@charset "UTF-8";
/* ====================================================
  top slider
==================================================== */
.top_view_sec {
  position: relative;
  width: 85%;
  overflow: hidden;
  margin: 0 auto;
}
@media screen and (max-width: 1300px) {
.top_view_sec {
  width: 90%;
}
}
@media screen and (max-width: 1180px) {
.top_view_sec {
  width: 100%;
}
}



.top_view_bg{
  background: #fffaec;
}

.top_view_wrap,
.top_view_contents,
.js-mainSlider,
.js-mainSlider .slick-list,
.js-mainSlider .slick-track,
.slide_wrap {
  width: 100%;
  /* height: 100vh; */
}

.slide_wrap {
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

@media screen and (max-width: 767px) {
.top_view_contents .slide_wrap.slide01 {
    background-position: center 30px;
  }
}

/* テキスト位置 */
.top_view_catch {
  position: absolute;
  left: 8%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}




.fixed_sentence{
  position: absolute;
  left: 0%;
  bottom: 0%;
  transform: translateY(-50%);
  z-index: 2;
}
.fixed_sentence p{
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.08em;
  background: rgb(255,255,255,0.7);
  padding: 5px 20px;
}
@media screen and (max-width: 1024px) {
.fixed_sentence{
  bottom: -17px;
}
.fixed_sentence p{
  font-size: 14px;
  padding: 5px 10px;
}
}
@media screen and (max-width: 767px) {
.fixed_sentence p{
  font-size: 12px;
}
}
@media screen and (max-width: 600px) {
.fixed_sentence p{
  font-size: 11px;
}
}
@media screen and (max-width: 350px) {
.fixed_sentence p{
  font-size: 9px;
}
}

/* テキスト共通 */
.slide_txt {
  position: relative;
  display: table;
  margin: 0px 0 1%;
  padding: 20px 40px;
  font-size: 42px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.12em;
  color: #333;

  background: none;

  opacity: 0;
  transform: translateY(28px);
  z-index: 1;
}
@media screen and (max-width: 1180px) {
.slide_txt {
  font-size: 36px;
}
}
@media screen and (max-width: 1024px) {
.slide_txt {
  font-size: 32px;
}
}
@media screen and (max-width: 820px) {
.slide_txt {
  font-size: 30px;
}
}
@media screen and (max-width: 767px) {
.slide_txt {
  font-size: 24px;
}
}
@media screen and (max-width: 600px) {
.slide_txt {
  font-size: 16px;
  padding: 5px 10px;
}
}
@media screen and (max-width: 350px) {
.slide_txt {
  font-size: 14px;
  padding: 5px 5px;
}
}

.slide_txt::before {
  content: "";
  position: absolute;
/* inset: -30px -40px; */
    inset: -15px -20px;
  z-index: -1;

  background: radial-gradient(
    ellipse,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(255, 255, 255, 0.82) 38%,
    rgba(255, 255, 255, 0.45) 68%,
    rgba(255, 255, 255, 0) 100%
  );

  filter: blur(15px);
  pointer-events: none;
}
@media screen and (max-width: 820px) {
.slide_txt::before {
    inset: -20px -30px;
}
}
@media screen and (max-width: 600px) {
.slide_txt::before {
  inset: -2px -5px;
  filter: blur(6px);
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.92) 38%, rgba(255, 255, 255, 0.65) 68%, rgba(255, 255, 255, 0) 100%);
}
}

.slide_txt::before {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}


/* 表示中スライドだけアニメーション */

/* slide01 */
.slide01.slick-active .slide_txt01 {
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 0.5s;
  margin: 0 0 10%;
}
/* 消す */
@media screen and (max-width: 767px) {
.slide01.slick-active .slide_txt01 {
  display: none;
}
}


.slide01.slick-active .slide_txt02 {
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 1.0s;
}
.slide01.slick-active .slide_txt03 {
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 1.4s;
}

/* slide02 */
.slide02.slick-active .slide_txt01{
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 0.5s;
  margin: 0 0 3%;
}

.slide02.slick-active .slide_txt02{
  animation: topSlideTextUp .9s ease forwards;
  animation-delay: 1.0s;
}


/* slide03 */
.slide03.slick-active .slide_txt01{
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 0.5s;
  margin: 0 0 1%;
}

.slide03.slick-active .slide_txt02{
  animation: topSlideTextUp .9s ease forwards;
  animation-delay: 1.0s;
}


/* slide04 */
.slide04.slick-active .slide_txt01{
  animation: topSlideTextUp 0.9s ease forwards;
  animation-delay: 0.5s;
  margin: 0 0 1%;
}

.slide04.slick-active .slide_txt02{
  animation: topSlideTextUp .9s ease forwards;
  animation-delay: 1.0s;
}


@keyframes topSlideTextUp {
  0% {
    opacity: 0;
    transform: translateY(28px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* スライドごとの文字位置調整 */
/* slide01 */
.slide01 .top_view_catch {
    left: 10%;
    top: 50%;
    width: 80%;
}
@media screen and (max-width: 1180px) {
.slide01 .top_view_catch {
    left: 5%;
    top: 50%;
    width: 85%;
}
}
@media screen and (max-width: 767px) {
.slide01 .top_view_catch {
    left: 5%;
    top: 76%;
    width: 85%;
}
}
/* slide02 */
.slide02 .top_view_catch {
    left: 5%;
    top: 55%;
    width: 80%;
}
@media screen and (max-width: 1180px) {
.slide02 .top_view_catch {
    left: 5%;
    top: 58%;
    width: 85%;
}
}
@media screen and (max-width: 767px) {
.slide02 .top_view_catch {
    left: 5%;
    top: 60%;
    width: 85%;
}
}


/* slide03 */
.slide03 .top_view_catch {
    left: 5%;
    top: 55%;
    width: 80%;
}
@media screen and (max-width: 1180px) {
.slide03 .top_view_catch {
    left: 5%;
    top: 58%;
    width: 85%;
}
}
@media screen and (max-width: 767px) {
.slide03 .top_view_catch {
    left: 5%;
    top: 61%;
    width: 85%;
}
}


/* slide04 */
.slide04 .top_view_catch {
    left: 22%;
    top: 65%;
    width: 70%;
}
@media screen and (max-width: 1180px) {
.slide04 .top_view_catch {
    left: 15%;
    top: 65%;
    width: 85%;
}
}
@media screen and (max-width: 767px) {
.slide04 .top_view_catch {
    left: 15%;
    top: 68%;
    width: 85%;
}
}
@media screen and (max-width: 600px) {
.slide04 .top_view_catch {
    left: 5%;
    top: 72%;
    width: 95%;
}
}