.preloader {
   width: 100%;
   height: 300vh;
   position: relative;
}

.preloader:before {
   content: '';
   width: 100%;
   height: 100vh;
   position: fixed;
   top: 0;
   left: 0;
}

#keyJs2 {
   width: 150vw;
   position: absolute;
   top: 200vw;
   left: 0;
}

#keyJs2 img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.cloud {
   width: 100%;
   position: absolute;
   left: 0;
}

@media only screen and (max-width: 767px) {
   .preloader:before {
      background: url("../img/index/preloader-bg-img_sp.jpg") no-repeat center/cover;
   }

   .cloud {
      width: 200%;
      bottom: 55%;
   }

   .preloader .logo {
      display: none !important;
      background-color: #fff;
      width: 20vw;
      padding: 6vw;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1;
   }
}

@media only screen and (min-width: 768px) {
   .preloader:before {
      background: url("../img/index/preloader-bg-img.jpg") no-repeat center/cover;
   }

   #keyJs2 {
      top: 24vw;
   }

   .cloud {
      bottom: 0;
   }

   .preloader .logo {
      background-color: #fff;
      width: 115px;
      padding: 30px;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1;
   }
}

header,
section {
   background-color: #fff;
}

header:before {
   content: '';
   width: 100%;
   height: 100vh;
   background-image: linear-gradient(to bottom, transparent, #fff);
   position: absolute;
   bottom: 100%;
   left: 0;
}

@media only screen and (max-width: 767px) {
   #key figcaption {
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
   }
}

@media only screen and (min-width: 768px) {
   .header-nav {
      padding-top: 60px;
      padding-bottom: 0;
   }

   .header-nav .cv {
      padding-top: 105px;
   }

   .header-nav .cv {
      background: transparent;
   }

   #key {
      max-width: 1200px;
      margin: 50px auto 0;
   }

   #key figcaption {
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
   }
}

#sec1 {
   position: relative;
}

@media only screen and (max-width: 767px) {
   #sec1 {
      padding: 7.2vw 0 24vw;
   }

   #sec1 .wrap {
      padding-top: 36vw;
   }

   #sec1 h2 {
      width: 41.6vw;
      height: 110vw;
      font-weight: 500;
      font-size: 16vw;
      line-height: 1.3;
      letter-spacing: 0.1em;
      text-align: left;
      margin: 0 auto;
      position: relative;
      z-index: 1;
   }

   #sec1 h2 span {
      padding-top: 32vw;
   }

   #sec1 .photo {
      width: 100%;
      position: absolute;
      top: 75vw;
      left: 0;
   }

   #sec1 .txt {
      padding-top: 50vw;
   }

   #sec1 .txt br {
      display: block;
   }

   #sec1 .txt br.pc {
      display: none;
   }

   #sec1 .swiper {
      padding-top: 12vw;
   }

   #sec1 .swiper-wrapper {
      transition-timing-function: linear;
   }

   #sec1 .swiper-slide {
      width: 189.2vw;
   }
}

@media only screen and (min-width: 768px) {
   #sec1 {
      padding: 232px 0 150px;
   }

   #sec1 .wrap:before {
      content: '';
      width: 120px;
      height: 120px;
      background: url("../img/index/sec1-deco-1.png") no-repeat center top/cover;
      position: absolute;
      top: -72px;
      right: -60px;
   }

   #sec1 .wrap:after {
      content: '';
      width: 120px;
      height: 121px;
      background: url("../img/index/sec1-deco-2.png") no-repeat center top/cover;
      position: absolute;
      top: 452px;
      left: -60px;
   }

   #sec1 h2 {
      width: 246px;
      height: 1146px;
      font-weight: 500;
      font-size: 97px;
      letter-spacing: 0.1em;
      line-height: 123px;
      text-align: left;
      margin: 0 auto;
      position: relative;
      z-index: 1;
   }

   #sec1 h2 span {
      padding-top: 190px;
   }

   #sec1 .photo {
      width: 1000px;
      position: absolute;
      top: 5px;
      left: 0;
   }

   #sec1 .txt p+p {
      padding-top: 35px;
   }

   #sec1 .swiper {
      padding-top: 80px;
   }

   #sec1 .swiper-wrapper {
      transition-timing-function: linear;
   }

   #sec1 .swiper-slide {
      width: 1500px;
   }
}

#sec2 {
   position: relative;
}

@media only screen and (max-width: 767px) {
   #sec2 {
      padding-bottom: 24vw;
   }

   #sec2 h2 {
      width: 55vw;
      height: 65vw;
      font-weight: 500;
      font-size: 12.2vw;
      letter-spacing: 0.1em;
      line-height: 1.3;
      margin: 0 auto;
      padding-top: 2vw;
      position: relative;
   }

   #sec2 h2:before {
      content: '';
      width: 12vw;
      height: 30vw;
      border: 3px solid #000;
      border-bottom: 0;
      position: absolute;
      top: 0;
      left: 4vw;
   }

   #sec2 h2:after {
      content: '';
      width: 12vw;
      height: 12vw;
      border: 3px solid #000;
      border-top: 0;
      position: absolute;
      bottom: 2vw;
      left: 4vw;
   }

   #sec2 h2 small {
      font-size: 9vw;
   }

   #sec2 h2 span {
      font-size: 20vw;
   }

   #sec2 .txt {
      padding-top: 10vw;
   }

   #sec2 .txt br {
      display: block;
   }

   #sec2 .row {
      position: relative;
      padding: 12vw 0 4.8vw;
   }

   #sec2 .row:before {
      content: '';
      width: 42vw;
      height: 66.6vw;
      background-color: #d8000d;
      position: absolute;
      bottom: 0;
      left: 0;
   }

   #sec2 .row .in {
      display: flex;
      gap: 4vw;
      padding-left: 5.2vw;
   }

   #sec2 .row h3 {
      width: 6.6vw;
      height: 50vw;
      font-weight: 400;
      font-size: 4.4vw;
      letter-spacing: 0.04em;
      line-height: 1.5;
      color: #fff;
      padding-top: 26vw;
      position: relative;
   }

   #sec2 .row .slider {
      width: calc(100% - 10.6vw);
   }

   #sec2 .row .slider .slick-list {
      margin-right: -10vw;
   }

   #sec2 .row .slider .slick-slide {
      margin-right: 10vw;
   }

   #sec2 .row .slider .slick-prev {
      bottom: 4.8vw;
      right: 19vw;
      left: auto;
   }

   #sec2 .row .slider .slick-next {
      bottom: 4.8vw;
      right: 5.2vw;
   }
}

@media only screen and (min-width: 768px) {
   #sec2 {
      padding-bottom: 85px;
   }

   #sec2 .wrap {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      gap: 20px;
   }

   #sec2 h2 {
      width: 270px;
      height: 355px;
      font-weight: 500;
      font-size: 66px;
      line-height: 90px;
      letter-spacing: 0.1em;
      padding: 20px 0 0 9px;
      position: relative;
   }

   #sec2 h2:before {
      content: '';
      width: 60px;
      height: 172px;
      border: 5px solid #000;
      border-bottom: 0;
      position: absolute;
      top: 0;
      left: 20px;
   }

   #sec2 h2:after {
      content: '';
      width: 60px;
      height: 80px;
      border: 5px solid #000;
      border-top: 0;
      position: absolute;
      bottom: 2px;
      left: 20px;
   }

   #sec2 h2 small {
      font-size: 48px;
   }

   #sec2 h2 span {
      font-size: 108px;
   }

   #sec2 .txt {
      width: 576px;
      padding-bottom: 37px;
   }

   #sec2 .row {
      position: relative;
      padding: 57px 0 28px;
   }

   #sec2 .row:before {
      content: '';
      width: calc(50% - 276px);
      height: 511px;
      background-color: #d8000d;
      position: absolute;
      bottom: 0;
      left: 0;
   }

   #sec2 .row .in {
      display: flex;
      justify-content: flex-end;
      gap: 22px;
      width: 96%;
      max-width: 1376px;
      margin: 0 auto;
   }

   #sec2 .row h3 {
      width: 52px;
      height: 380px;
      font-weight: 400;
      font-size: 34px;
      letter-spacing: 0.04em;
      line-height: 52px;
      color: #fff;
      position: relative;
      padding-top: 175px;
   }

   #sec2 .row .slider {
      width: calc(100% - 94px);
   }

   #sec2 .row .slider .slick-list {
      margin-right: -84px;
   }

   #sec2 .row .slider .slick-slide {
      margin-right: 84px;
   }

   #sec2 .row .slider .slick-next {
      bottom: 15px;
      right: 185px;
   }

   #sec2 .row .slider .slick-prev {
      bottom: 15px;
      right: 273px;
   }
}

@media only screen and (min-width: 1401px) {
   #sec2 .row .slider {
      width: 1188px;
   }
}

#sec3 {
   position: relative;
}

#sec3 .hochan {
   width: 180px;
   margin: 10px auto 0;
}
#sec3 .hochan img{
   width:100%;}

@media only screen and (max-width: 767px) {
   #sec3 {
      padding-bottom: 24vw;
   }
   #sec3 .hochan {
      width: 140px;
   }
   #sec3 h2 {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 2vw;
      background: url("../img/index/sec3-deco-1.png") no-repeat center top/27.2vw auto;
      font-weight: 500;
      font-size: 6.4vw;
      line-height: 1.5;
      letter-spacing: 0.1em;
      margin: 0 -5.2vw;
      padding: 24vw 0 0 4vw;
   }

   #sec3 h2 span {
      font-size: 12.8vw;
      letter-spacing: 0.1em;
      line-height: 1.1;
   }

   #sec3 .box {
      display: grid;
      gap: 7vw;
      padding-top: 11vw;
   }

   #sec3 .box [class*="col"] {
      position: relative;
   }

   #sec3 .box figcaption {
      position: absolute;
      top: 35vw;
      z-index: 1;
   }

   #sec3 .box h3 {
      width: 22.2vw;
      height: 110vw;
      color: #fff;
      font-weight: 500;
      font-size: 20vw;
      line-height: 1;
      letter-spacing: 0em;
      text-align: right;
      position: absolute;
      top: 0;
   }

   #sec3 .box .sub {
      font-weight: 400;
      font-size: 6.6vw;
      line-height: 1;
      letter-spacing: 0.04em;
      padding-top: 2vw;
      position: relative;
      z-index: 1;
   }

   #sec3 .box .col-l figcaption {
      width: 50vw;
      right: -2vw;
   }

   #sec3 .box .col-l h3 {
      left: 0;
   }

   #sec3 .box .col-r figcaption {
      width: 52vw;
      left: -2vw;
   }

   #sec3 .box .col-r h3 {
      right: 0;
   }

   #sec3 .box .col-r .sub {
      text-align: right;
   }

   #sec3 .txt {
      text-align: center;
      padding-top: 16vw;
   }

   #sec3 .txt br {
      display: block;
   }
}

@media only screen and (min-width: 768px) {
   #sec3 {
      padding-bottom: 108px;
   }

   #sec3 .wrap {
      width: 96%;
      min-width: 1000px;
      max-width: 1420px;
   }

   #sec3 h2 {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 20px;
      background: url("../img/index/sec3-deco-1.png") no-repeat center top;
      font-weight: 500;
      font-size: 66px;
      line-height: 84px;
      letter-spacing: 0.1em;
      padding: 160px 0 100px 70px;
   }

   #sec3 h2 span {
      font-size: 108px;
      line-height: 116px;
      letter-spacing: 0.1em;
   }

   #sec3 .box {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px;
   }

   #sec3 .box [class*="col"] {
      position: relative;
   }

   #sec3 .box figure span {
      display: block;
      height: 810px;
   }

   #sec3 .box figcaption {
      position: absolute;
      top: 260px;
   }

   #sec3 .box h3 {
      width: 136px;
      height: 830px;
      color: #fff;
      font-weight: 500;
      font-size: 166px;
      line-height: 136px;
      letter-spacing: 0;
      text-align: right;
      position: absolute;
      top: 0;
   }

   #sec3 .box .sub {
      font-weight: 400;
      font-size: 50px;
      padding-top: 10px;
      position: relative;
   }

   #sec3 .box .col-l figcaption {
      width: 370px;
      right: -2px;
   }

   #sec3 .box .col-l h3 {
      left: 0;
   }

   #sec3 .box .col-r figcaption {
      width: 397px;
      left: -20px;
   }

   #sec3 .box .col-r h3 {
      right: 0;
   }

   #sec3 .box .col-r .sub {
      text-align: right;
   }

   #sec3 .txt {
      text-align: center;
      padding-top: 120px;
   }
}

#sec4 {
   position: relative;
}

@media only screen and (max-width: 767px) {
   #sec4 .box {
      padding: 6vw 0;
      position: relative;
   }

   #sec4 .box:before {
      content: '';
      border: 3px solid #d8000d;
      position: absolute;
      top: 0;
      right: -3.2vw;
      bottom: 0;
      left: -3.2vw;
   }

   #sec4 .slider {
      margin: 0 -5.2vw;
   }

   #sec4 .slider .slick-dots {
      position: absolute;
      bottom: 1vw;
      left: 5.2vw;
   }

   #sec4 h2 {
      font-weight: 500;
      font-size: 7vw;
      line-height: 1.5;
      letter-spacing: 0.1em;
      text-align: center;
      padding-top: 10vw;
   }

   #sec4 .txt {
      padding-top: 10vw;
   }

   #sec4 .txt br {
      display: block;
   }

   #sec4 .banner {
      display: grid;
      gap: 3vw;
      margin: 0 -2.6vw;
      padding: 12vw 0 24vw;
   }

   #sec4 .banner a {
      display: block;
      position: relative;
      box-sizing: border-box;
   }

   #sec4 .banner a:after {
      content: '';
      width: 12vw;
      height: 12vw;
      background: url("../img/shared/bnr-arrow.png") no-repeat center top/cover;
      position: absolute;
      bottom: 0;
      right: 0;
   }

   #sec4 .banner figure {
      height: 88vw;
      position: relative;
   }

   #sec4 .banner figure:after {
      content: '';
      border: 3px solid #fff;
      position: absolute;
      top: 2vw;
      right: 2vw;
      bottom: 2vw;
      left: 2vw;
   }

   #sec4 .banner h3 {
      width: 16vw;
      height: max-content;
      background-color: #fff;
      font-weight: 500;
      font-size: 8vw;
      line-height: 2;
      letter-spacing: 0.1em;
      padding: 2vw 0;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
   }

   #sec4 .bg-parallax {
      min-height: 130vw;
   }
}

@media only screen and (min-width: 768px) {
   #sec4 .wrap {
      width: 100%;
      min-width: 1000px;
      max-width: 1500px;
   }

   #sec4 h2 {
      font-weight: 500;
      font-size: 48px;
      letter-spacing: 0.1em;
      line-height: 73px;
      text-align: center;
   }

   #sec4 .box {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding-bottom: 60px;
   }


   #sec4 .box figure {
      background-size: cover;
      background-position: center center;
      height: 665px;
   }

   #sec4 .box figure img {
      object-fit: cover;
      width: 100% !important;
      height: 100% !important;
      object-position: 100% 50%;
   }

   #sec4 .box .slider {
      width: calc(100% - 670px);
   }

   #sec4 .box .slick-dots {
      position: absolute;
      bottom: 8px;
      left: 46px;
   }

   #sec4 .box .col {
      width: 650px;
      border: 5px solid #d8000d;
      box-sizing: border-box;
      padding: 146px 0 156px;
   }

   #sec4 .box .txt {
      width: 437px;
      margin: 0 auto;
      padding-top: 42px;
   }

   #sec4 .banner {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px;
      max-width: 1420px;
      margin: 0 auto;
   }

   #sec4 .banner a {
      position: relative;
      padding-top: 146px;
   }

   #sec4 .banner a:after {
      content: '';
      width: 90px;
      height: 90px;
      background: url("../img/shared/bnr-arrow.png") no-repeat center top/cover;
      position: absolute;
      bottom: 0;
      right: 0;
   }

   #sec4 .banner figure {
      height: 603px;
      position: relative;
   }

   #sec4 .banner figure:after {
      content: '';
      border: 5px solid #fff;
      position: absolute;
      top: 15px;
      right: 15px;
      bottom: 15px;
      left: 15px;
   }

   #sec4 .banner h3 {
      width: 84px;
      background-color: #fff;
      font-weight: 500;
      font-size: 66px;
      line-height: 84px;
      letter-spacing: 0.1em;
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      padding-bottom: 26px;
      cursor: pointer;
   }

   #sec4 .bg-parallax {
      background-image: url("../img/index/sec4-bg-img.jpg");
      min-height: 640px;
      margin-top: 170px;
   }
}

#sec5 {
   position: relative;
}

@media only screen and (max-width: 767px) {
   #sec5 {
      padding: 24vw 0 0;
   }

   #sec5 .wrap {
      padding: 0 2.6vw;
   }

   #sec5 h2 {
      background: url("../img/index/sec5-deco-1.png") no-repeat center left 2.6vw/7.2vw auto, url("../img/index/sec5-deco-1.png") no-repeat center right 2.6vw/7.2vw auto;
      font-weight: 700;
      font-size: 8.5vw;
      line-height: 1;
      letter-spacing: 0;
      border: 3px solid;
      padding: 25px 0;
   }

   #sec5 .box-1 {
      display: grid;
      grid-template-columns: 30vw 1fr;
      gap: 4vw;
      padding-top: 5.6vw;
   }

   #sec5 .box-1 h3 {
      width: 10vw;
      background-color: #d8000d;
      color: #fff;
      font-weight: 700;
      font-size: 10vw;
      line-height: 1;
      letter-spacing: 0.1em;
      position: relative;
      text-align: center;
      padding: 3vw 10vw;
   }

   #sec5 .box-1 h3:before {
      content: '';
      width: 100%;
      height: 100%;
      background: url("../img/index/sec5-deco-2.png") no-repeat top right/5.3vw auto, url("../img/index/sec5-deco-3.png") no-repeat bottom left/5.3vw auto;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec5 .box-1 figure img {
      height: 100%;
      object-fit: cover;
   }

   #sec5 .box-2 {
      padding-top: 5.2vw;
   }

   #sec5 .box-2 h3 {
      float: right;
      font-weight: 700;
      font-size: 12.8vw;
      line-height: 1;
      letter-spacing: 0.1em;
      margin: 4vw 0 0 4vw;
   }

   #sec5 .box-2 .txt {
      font-size: 12px;
      line-height: 25px;
   }

   #sec5 .box-2 .txt br {
      display: block;
   }

   #sec5 .box-3 h3 {
      font-weight: 400;
      font-size: 24.2vw;
      line-height: 1;
      letter-spacing: 0.04em;
   }

   #sec5 .box-3 h4 {
      font-weight: 700;
      font-size: 6.8vw;
      line-height: 1.5;
      letter-spacing: 0.1em;
      padding-bottom: 4vw;
      padding-left: 2.6vw;
   }

   #sec5 .box-3 div {
      display: flex;
      justify-content: flex-end;
      gap: 4vw;
   }

   #sec5 .box-3 .txt {
      width: 51vw;
      font-size: 12px;
      line-height: 25px;
   }

   #sec5 .box-3 figure {
      width: 37vw;
   }

   #sec5 .box-3 figure img {
      height: 100%;
      object-fit: cover;
   }

   #sec5 .box-4 {
      padding-top: 6vw;
      position: relative;
   }

   #sec5 .box-4 .col {
      width: 78.9vw;
      border: 3px solid #d8000d;
      box-sizing: border-box;
      margin-left: auto;
      padding: 4vw 4vw 5vw 10vw;
   }

   #sec5 .box-4 h3 {
      font-weight: 700;
      font-weight: 6vw;
      line-height: 1.5;
      letter-spacing: 0.1em;
   }

   #sec5 .box-4 h4 {
      font-weight: 400;
      font-size: 9.3vw;
      letter-spacing: 0.04em;
      line-height: 1;
      text-align: right;
      padding: 5vw 0 16vw;
   }

   #sec5 .box-4 .txt {
      font-size: 12px;
      line-height: 25px;
      padding-top: 3vw;
   }

   #sec5 .box-4 .txt br {
      display: block;
   }

   #sec5 .box-4 figure {
      width: 54.8vw;
      position: absolute;
      bottom: 0;
      left: -11vw;
   }

   #sec5 .bnr {
      padding: 2.6vw 2.6vw 24vw;
   }

   #sec5 .bnr a {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 16vw;
      background-color: #d8000d;
      color: #fff;
      font-weight: 400;
      font-size: 6vw;
      line-height: 2;
      letter-spacing: 0.04em;
      text-align: center;
      text-transform: uppercase;
      position: relative;
   }

   #sec5 .bnr a:before {
      content: '';
      border: 1px solid #fff;
      position: absolute;
      top: 1vw;
      right: 1vw;
      bottom: 1vw;
      left: 1vw;
   }

   #sec5 .bg-parallax {
      min-height: 130vw;
   }

   #sec5 .bg-parallax .smoke {
      width: 100%;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
   }
}

@media only screen and (min-width: 768px) {
   #sec5 {
      padding: 92px 0 0;
   }

   #sec5 .wrap {
      width: 96%;
      min-width: 1000px;
      max-width: 1340px;
      z-index: 1;
   }

   #sec5 h2 {
      background: url("../img/index/sec5-deco-1.png") no-repeat center left 10px, url("../img/index/sec5-deco-1.png") no-repeat center right 10px;
      font-weight: 700;
      font-size: 95px;
      line-height: 116px;
      letter-spacing: 0;
      border: 5px solid;
      padding: 25px 0 38px;
   }

   #sec5 .box-1 {
      display: grid;
      grid-template-columns: 388px 1fr;
      gap: 55px;
      padding-top: 86px;
   }

   #sec5 .box-1 h3 {
      width: 136px;
      background-color: #d8000d;
      color: #fff;
      font-weight: 700;
      font-size: 136px;
      line-height: 136px;
      letter-spacing: 0.1em;
      padding: 32px 126px 0;
      position: relative;
   }

   #sec5 .box-1 h3:before {
      content: '';
      width: 100%;
      height: 100%;
      background: url("../img/index/sec5-deco-2.png") no-repeat top right, url("../img/index/sec5-deco-3.png") no-repeat bottom left;
      position: absolute;
      top: 0;
      left: 0;
   }

   #sec5 .box-2 {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      padding: 70px 66px 26px 0;
   }

   #sec5 .box-2 h3 {
      width: 256px;
      height: 262px;
      font-weight: 700;
      font-size: 119px;
      line-height: 128px;
      letter-spacing: 0.1em;
      order: 2;
      padding-top: 12px;
   }

   #sec5 .box-2 .txt {
      width: calc(100% - 340px);
      font-size: 25px;
      letter-spacing: 0.1em;
      line-height: 52px;
      order: 1;
   }

   #sec5 .box-3 {
      position: relative;
   }

   #sec5 .box-3 figure {
      width: calc(100% - 800px);
      position: absolute;
      top: 46px;
      right: 0;
   }

   #sec5 .box-3 h3 {
      font-weight: 400;
      font-size: 205px;
      line-height: 212px;
      letter-spacing: 0.04em;
   }

   #sec5 .box-3 h4 {
      font-weight: 700;
      font-size: 59px;
      line-height: 90px;
      letter-spacing: 0.02em;
   }

   #sec5 .box-3 .txt {
      width: 710px;
      font-size: 25px;
      letter-spacing: 0.1em;
      line-height: 52px;
      padding-top: 23px;
   }

   #sec5 .box-4 {
      position: relative;
      padding-bottom: 88px;
   }

   #sec5 .box-4 figure {
      width: calc(100% - 628px);
      position: absolute;
      top: 28px;
      left: 28px;
   }

   #sec5 .box-4 .col {
      width: 518px;
      border: 5px solid #d8000d;
      margin-left: auto;
      padding: 30px 48px 54px;
      box-sizing: border-box;
      position: relative;
   }

   #sec5 .box-4 h3 {
      font-weight: 700;
      font-size: 44px;
      line-height: 98px;
      letter-spacing: 0.1em;
   }

   #sec5 .box-4 h4 {
      font-weight: 400;
      font-size: 108px;
      line-height: 108px;
      letter-spacing: 0.06em;
      text-align: right;
      position: relative;
   }

   #sec5 .box-4 .txt {
      font-size: 22px;
      letter-spacing: 0.1em;
      line-height: 44px;
      padding-top: 10px;
   }

   #sec5 .bnr {
      padding-bottom: 85px;
   }

   #sec5 .bnr a {
      display: block;
      background-color: #d8000d;
      color: #fff;
      font-weight: 400;
      font-size: 89px;
      line-height: 100px;
      letter-spacing: 0.04em;
      text-align: center;
      text-transform: uppercase;
      position: relative;
      padding: 34px 0;
   }

   #sec5 .bnr a:before {
      content: '';
      border: 2px solid #fff;
      position: absolute;
      top: 10px;
      right: 10px;
      bottom: 10px;
      left: 10px;
   }

   #sec5 .bnr a:hover {
      background-color: #000;
      opacity: 1;
   }

   #sec5 .bg-parallax {
      background-image: url("../img/index/sec5-bg-img.jpg");
      min-height: 640px;
   }

   #sec5 .bg-parallax .smoke {
      width: 100%;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
   }
}

@media only screen and (min-width: 1401px) {
   #sec5 h2 {
      background-position: center left 34px, center right 34px;
      font-size: 119px;
   }

   #sec5 .box-3 figure {
      width: 518px;
   }

   #sec5 .box-4 figure {
      width: 574px;
      left: 74px;
   }

   #sec5 .box-4 .col {
      top: -92px;
   }

   #sec5 .box-4 h4 {
      top: -77px;
   }
}

#sec6 {
   position: relative;
}

@media only screen and (max-width: 767px) {
   #sec6 {
      padding-bottom: 12vw;
   }

   #sec6 .wrap {
      padding: 16vw 2.6vw 0;
   }

   #sec6 .logo {
      background-color: #fff;
      width: 30vw;
      padding: 4.8vw 4.8vw 0;
      position: absolute;
      top: -14vw;
      left: 50%;
      transform: translateX(-50%);
      box-sizing: border-box;
   }

   #sec6 .cv {
      border: 3px solid #000;
      padding: 8vw 2.6vw 6vw;
   }

   #sec6 .cv h3 {
      font-weight: 700;
      font-size: 4.4vw;
      letter-spacing: 0.1em;
      line-height: 1;
      padding-top: 4vw;
   }

   #sec6 .tel {
      padding-top: 2vw;
   }

   #sec6 .tel small {
      display: block;
      color: #959595;
      font-weight: 400;
      font-size: 11px;
      letter-spacing: 0;
      line-height: 1;
   }

   #sec6 .fax {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 2vw;
      font-weight: 500;
      line-height: 1.5;
      padding-top: 2vw;
   }

   #sec6 .fax code {
      font-size: 6vw;
   }

   #sec6 .fax small {
      width: 10vw;
      font-size: 3.2vw;
      background-color: #000;
      color: #fff;
      text-align: center;
   }

   #sec6 .txt-info {
      letter-spacing: 0;
      line-height: 22px;
      word-break: break-word;
      padding: 8vw 2.6vw 0;
   }

   #sec6 .txt-info dl {
      border-bottom: 1px solid #dddddd;
      padding-bottom: 15px;
   }

   #sec6 .txt-info dl+dl {
      padding-top: 9px;
   }

   #sec6 .txt-info a {
      background: url(../img/shared/icon-location.png) no-repeat center left/9px auto;
      padding-left: 12px;
   }

   #sec6 .photo {
      display: grid;
      gap: 10vw;
      padding: 12vw 2.6vw 0;
   }

   #sec6 .oshirase {
      background-color: #d8000d;
      color: #fff;
      margin: 12vw auto 0;
      padding: 8vw 5.2vw;
   }

   #sec6 .oshirase h3 {
      font-weight: 500;
      font-size: 6vw;
      letter-spacing: 0.1em;
      line-height: 2;
      border-bottom: 1px solid #fff;
      text-align: center;
      padding-bottom: 4vw;
   }

   #sec6 .oshirase .text {
      padding-top: 4vw;
   }

   #sec6 .oshirase ul {
      display: grid;
      gap: 2vw;
      padding-top: 2vw;
   }

   #sec6 .oshirase ul li {
      text-indent: -18px;
      padding-left: 18px;
   }
}

@media only screen and (min-width: 768px) {
   #sec6 {
      padding-bottom: 94px;
   }

   #sec6 .wrap {
      padding-top: 105px;
   }

   #sec6 .logo {
      background-color: #fff;
      width: 165px;
      padding: 26px 24px 0;
      position: absolute;
      top: -68px;
      left: 50%;
      transform: translateX(-50%);
      box-sizing: border-box;
   }

   #sec6 .cv {
      width: 770px;
      border: 5px solid #000;
      margin: 0 auto;
      padding: 30px 0 27px;
      box-sizing: border-box;
   }

   #sec6 .cv .btn-reserve a {
      width: 326px;
      height: 62px;
   }

   #sec6 .cv h3 {
      font-weight: 700;
      font-size: 19px;
      letter-spacing: 0.1em;
      padding-top: 28px;
   }

   #sec6 .cv ul {
      display: flex;
      justify-content: center;
      gap: 40px;
   }

   #sec6 .cv .fax,
   #sec6 .cv .tel {
      font-weight: 500;
   }

   #sec6 .cv .fax span,
   #sec6 .cv .fax code,
   #sec6 .cv .tel span,
   #sec6 .cv .tel code {
      font-size: 31px;
      letter-spacing: 0.04em;
      line-height: 35px;
   }

   #sec6 .cv .tel span {
      background-size: 30px auto;
      background-position: top 5px left;
      padding-left: 40px;
   }

   #sec6 .cv .fax {
      display: flex;
      align-items: center;
      gap: 12px;
   }

   #sec6 .cv .fax small {
      width: 46px;
      background-color: #000;
      color: #fff;
      line-height: 16px;
      text-align: center;
      position: relative;
      top: 3px;
   }

   #sec6 .cv .note {
      color: #959595;
      font-size: 13px;
      letter-spacing: 0;
      line-height: 20px;
   }

   #sec6 .txt-info {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 60px;
      font-size: 15px;
      line-height: 25px;
      padding-top: 65px;
   }

   #sec6 .txt-info dl {
      border-bottom: 1px solid #dddddd;
      padding-bottom: 15px;
   }

   #sec6 .txt-info dl+dl {
      padding-top: 9px;
   }

   #sec6 .txt-info a {
      background: url(../img/shared/icon-location.png) no-repeat center left/11px auto;
      padding-left: 15px;
   }

   #sec6 .txt-info a:hover {
      text-decoration: underline;
   }

   #sec6 .photo {
      display: flex;
      align-items: flex-end;
      gap: 36px;
      margin: 0 -100px;
      padding-top: 77px;
   }

   #sec6 .photo .img-2 {
      padding-bottom: 26px;
   }

   #sec6 .oshirase {
      background-color: #d8000d;
      color: #fff;
      margin: 100px auto 0;
      padding: 40px 125px 60px;
   }

   #sec6 .oshirase h3 {
      font-weight: 500;
      font-size: 42px;
      letter-spacing: 0.1em;
      line-height: 73px;
      border-bottom: 1px solid #fff;
      text-align: center;
      padding-bottom: 20px;
   }

   #sec6 .oshirase .text {
      max-width: max-content;
      margin: 0 auto;
      padding-top: 20px;
      font-size: 18px;
   }

   #sec6 .oshirase ul {
      display: grid;
      gap: 20px;
      padding-top: 30px;
   }

   #sec6 .oshirase ul li {
      text-indent: -25px;
      padding-left: 25px;
   }
}

/* ========== #hochan ========== */
#hochan {
   background-color: #fff;
   padding-top: 80px;
}

#hochan .wrap {
   width: 1100px !important;
   max-width: 100%;
   margin: 0 auto;
   padding: 60px 20px;
}

#hochan h2 {
   color: #d8000d;
   font-weight: 700;
   letter-spacing: 0.08em;
   text-align: center;
}

#hochan .inner {
   border: 5px solid #d8000d;
   border-radius: 12px;
   display: flex;
   align-items: center;
   gap: 40px;
   padding: 40px;
   margin-top: 30px;
}

#hochan .img {
   flex-shrink: 0;
   width: 280px;
   text-align: center;
}

#hochan .img img {
   width: 100%;
   height: auto;
}

#hochan .info {
   flex: 1;
}

#hochan .info dl {
   display: flex;
   border-bottom: 1px solid #ddd;
   padding: 8px 0;
   gap: 20px;
}

#hochan .info dl:last-of-type {
   border-bottom: none;
}

#hochan .info dt {
   width: 80px;
   flex-shrink: 0;
   color: #d8000d;
   font-weight: 700;
   font-size: 14px;
   letter-spacing: 0.05em;
}

#hochan .info dd {
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 1.6;
}

#hochan .story {
   background-color: #fff8f8;
   border-left: 4px solid #d8000d;
   padding: 14px 16px;
   margin-top: 16px;
   border-radius: 0 6px 6px 0;
}

#hochan .story-title {
   color: #d8000d;
   font-weight: 700;
   font-size: 14px;
   letter-spacing: 0.08em;
   margin-bottom: 6px;
}

#hochan .story-txt {
   font-size: 13px;
   line-height: 1.9;
   letter-spacing: 0.05em;
}

/* SP */
@media only screen and (max-width: 767px) {
   #hochan {
      background-color: #fff;
      padding: 50px 10px;
   }
   
   #hochan .wrap {
      padding: 12vw 5.2vw;
   }

   #hochan h2 {
      font-size: 6.2vw;
      line-height: 1.4;
      margin-bottom: 6vw;
   }

   #hochan .inner {
      flex-direction: column;
      gap: 6vw;
      padding: 6vw 5vw;
   }

   #hochan .img {
      width: 52vw;
      margin: 0 auto;
   }

   #hochan .info dt {
      width: 18vw;
      font-size: 4vw;
   }

   #hochan .info dd {
      font-size: 4vw;
   }

   #hochan .story {
      padding: 3.5vw 4vw;
      margin-top: 4vw;
      border-left: none;
   }

   #hochan .story-title {
      font-size: 4vw;
      margin-bottom: 2vw;
   }

   #hochan .story-txt {
      font-size: 4vw;
      line-height: 1.9;
   }
   
}

/* PC */
@media only screen and (min-width: 768px) {
   #hochan h2 {
      font-size: 54px;
      line-height: 1.4;
   }

   #hochan .info dt,
   #hochan .info dd {
      font-size: 25px;
   }

   #hochan .story-title {
      font-size: 25px;
   }

   #hochan .story-txt {
      font-size: 22px;
   }
}

/* ========== /hochan ========== */

#gmap {
   position: relative;
}

#gmap .deco[style*='visible'] {
   animation: animetxt 8s linear infinite;
   animation-delay: 0.5s;
   transform: translateX(0);
}

.gmap iframe {
   filter: grayscale(100%);
}

@keyframes animetxt {
   100% {
      transform: translateX(-100%);
   }
}

@media only screen and (max-width: 767px) {
   #gmap .wrap {
      padding: 0;
   }

   #gmap .button {
      padding-top: 8vw;
   }

   #gmap .deco {
      padding: 10vw 0 0;
   }

   #gmap .deco figure {
      width: 26vw;
      margin-left: auto;
   }

   .gmap {
      height: 480px;
   }
	.oshirase{
	width: 100%;
	background: #d8000d;
	color: #FFFFFF;
	margin: 15px auto 0 auto;
	padding: 10px 0;
}
.oshirase .waku{
	width: 96%;
	border: solid 1px #FFFFFF;
	margin: 0 auto;
}
.oshirase .waku .tit{
	text-align: center;
	font-size: 23px;
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E";
	margin-top: 20px;
	letter-spacing: 1px;
}
.oshirase .waku .txtx{
	text-align: center;
	line-height: 24px;
	margin: 15px 0 20px 0;
	font-size: 15px;
}

}

@media only screen and (min-width: 768px) {
	.oshirase{
	width: 700px;
	background: #d8000d;
	color: #FFFFFF;
	margin: 15px auto 0 auto;
	padding: 10px 0;
}
.oshirase .waku{
	width: 680px;
	border: solid 1px #FFFFFF;
	margin: 0 auto;
}
.oshirase .waku .tit{
	text-align: center;
	font-size: 23px;
	font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E";
	margin-top: 20px;
	letter-spacing: 1px;
}
.oshirase .waku .txtx{
	text-align: center;
	line-height: 24px;
	margin: -15px 0 20px 0;
	font-size: 15px;
}

   #gmap ul {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 30px;
      padding-top: 30px;
   }

   #gmap .gmap_print a {
      letter-spacing: 0.1em;
   }

   #gmap .gmap_print a img {
      max-width: 12px;
   }

   #gmap .gmap_print a:hover {
      text-decoration: underline;
   }

   #gmap .deco {
      padding: 66px 0 0;
   }

   #gmap .deco figure {
      width: 194px;
      margin-left: auto;
   }

   .gmap {
      height: 550px;
   }
}

@media only screen and (min-width: 768px) and (max-width: 1299px) {
   #sec2 .row .slider .slick-slide {
      height: 440px;
      background-size: cover;
      background-position: center center;
      position: relative;
      margin-right: 50px;
   }

   #sec2 .row .slider .slick-slide img {
      object-fit: cover;
      width: 100% !important;
      height: 100% !important;
   }


   #sec4 .box figure {
      height: 547px;
   }


   #sec4 h2 {
      font-size: 3vw;
      line-height: 2;
   }

   #sec4 .box .col {
      width: 45%;
      padding: 100px 0;
   }

   #sec4 .box .slider {
      width: 55%;
   }

}