/*! Writen  by SCSS */
.headnavi {
  transition: all 0.3s ease-in-out; }
  body.sec2 .headnavi, body.sec3 .headnavi {
    opacity: 0;
    pointer-events: none; }

.breadlist {
  display: none; }

.wrap {
  padding-top: 0 !important; }

.sec_cont {
  position: relative;
  z-index: 10;
  padding-top: 10vh; }
  @media screen and (max-width: 768px) {
    .sec_cont {
      padding-top: 0;
      background: #fff;
      margin-top: 80vw; } }

.info_ttl {
  font-size: clamp(14px, calc(25vw / 12.8), 25px);
  margin-bottom: 1.2em;
  line-height: 1;
  letter-spacing: 0.5em;
  font-weight: 400; }

.info01 {
  font-size: clamp(20px, calc(33vw / 12.8), 33px);
  margin-bottom: 1em;
  line-height: 1;
  letter-spacing: 0.3em;
  font-weight: 400; }

.info02 {
  font-size: clamp(30px, calc(50vw / 12.8), 50px);
  line-height: 1;
  letter-spacing: 0.3em;
  font-weight: 400; }
  .info02 span {
    display: inline-block;
    padding: 0.5em 0.3em;
    border-bottom: solid 1px #fff;
    border-top: solid 1px #fff; }

@media screen and (max-width: 480px) {
  .info_ttl {
    font-size: calc(14vw / 3.9); }

  .info01 {
    font-size: calc(18vw / 3.9);
    letter-spacing: 0.2em; }

  .info02 {
    font-size: calc(22vw / 3.9);
    letter-spacing: 0.2em; } }
.t1 {
  font-size: clamp(14px, calc(50vw / 16), 50px);
  margin-bottom: 0.3em;
  line-height: 1;
  letter-spacing: 0.3em;
  font-weight: 400;
  color: #2d2d2d; }
  .t1 > span {
    display: inline-block;
    position: relative; }
    .t1 > span::after {
      content: "";
      position: absolute;
      bottom: 0;
      height: 1px;
      width: 80vw;
      background: #424242; }
      @media screen and (max-width: 480px) {
        .t1 > span::after {
          left: 5%;
          width: 110%; } }

.t2 {
  font-size: clamp(12px, calc(19vw / 16), 19px);
  margin-bottom: 2em;
  line-height: 1;
  letter-spacing: 0.3em;
  color: #2d2d2d; }
  @media screen and (max-height: 700px) {
    .t2 {
      margin-bottom: 1em; } }

.t3 {
  font-size: clamp(20px, calc(30vw / 16), 30px);
  margin-bottom: 1.4em;
  line-height: 1.4;
  letter-spacing: 0.3em;
  color: #2d2d2d; }
  @media screen and (max-height: 700px) {
    .t3 {
      margin-bottom: 0.9em; } }

.t4 {
  font-size: clamp(16px, calc(21vw / 16), 21px);
  margin-bottom: 2em;
  line-height: 2.2;
  letter-spacing: 0.1em;
  color: #2d2d2d; }
  @media screen and (max-height: 700px) {
    .t4 {
      margin-bottom: 1.2em; } }
  @media screen and (max-height: 650px) {
    .t4 {
      font-size: clamp(14px, calc(18vw / 16), 18px);
      line-height: 1.6; } }

.t5 {
  font-size: clamp(15px, calc(19vw / 16), 19px);
  line-height: 1;
  letter-spacing: 0.1em;
  color: #114b2e; }
  .t5 a {
    display: flex;
    align-items: center;
    gap: 1em; }
    @media screen and (max-width: 768px) {
      .t5 a {
        justify-content: center; } }
    .t5 a .icon {
      position: relative; }
      .t5 a .icon .off {
        opacity: 1;
        transition: all 0.3s ease-in-out; }
      .t5 a .icon .on {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: all 0.3s ease-in-out; }
    .t5 a:hover .icon .off {
      opacity: 0; }
    .t5 a:hover .icon .on {
      opacity: 1; }
  @media screen and (max-width: 768px) {
    .t5 .vm_txt {
      width: 22%; } }

@media screen and (max-width: 480px) {
  .t1 {
    font-size: calc(30vw / 3.9);
    margin-bottom: 0.7em; }

  .t2 {
    font-size: calc(13vw / 3.9);
    margin-bottom: 1.4em; }

  .t3 {
    font-size: calc(18vw / 3.9);
    margin-bottom: 1.4em; }

  .t4 {
    font-size: calc(13vw / 3.9);
    margin-bottom: 1.8em;
    line-height: 1.9; }

  .t5 {
    font-size: calc(14vw / 3.9); }
    .t5 a .icon {
      width: 26px; } }
/*@include mq($br_tb){
	.body .wrap {
		overflow: visible;
	}
	.sec_wrap {
		height: 100%;
	}
}*/
.sec_page_top {
  position: absolute;
  bottom: 100%;
  right: 10px;
  z-index: 2;
  cursor: pointer; }

.sec_page_top img {
  transition: all 0.5s ease-in-out; }

.sec_page_top:hover img {
  opacity: 0.7; }

.sec_wrap {
  width: 100%; }

.sec_wrap .sec {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  opacity: 0;
  transition: all 0.5s ease-in-out 0s;
  display: flex; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec {
      height: auto;
      background: #fff;
      min-height: calc(100vh - 58px);
      margin-top: 180px;
      transition: all 0s ease-in-out 0s; } }

.sec_wrap .sec .bg2 {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  opacity: 0.3;
  overflow: hidden; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec .bg2 {
      opacity: 1;
      height: 100%; } }

.sec_wrap .sec .bg2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scaleY(1.2);
  transition: all 0.5s ease-in-out 0s; }

.sec_wrap .sec .bg1 {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  opacity: 1;
  transition: all 0.5s ease-in-out 0s;
  overflow: hidden; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec .bg1 {
      opacity: 1;
      height: 100%; } }

.sec_wrap .sec .bg1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom; }

.sec_wrap .sec .inn {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  opacity: 0;
  transition: all 0.5s ease-in-out 0s;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec .inn {
      padding: 60px 0 20px;
      padding: 50px 0 10px;
      position: relative;
      opacity: 1;
      height: auto;
      background: #fff; }
      .sec_wrap .sec .inn::before {
        content: "";
        position: absolute;
        bottom: -100px;
        left: 0;
        width: 100%;
        height: 100px;
        background: #fff;
        z-index: 20; } }
  .sec_wrap .sec .inn .img figure {
    display: inline-block; }

@media screen and (max-width: 768px) {
  .sec_wrap .sec.fix .inn {
    position: fixed;
    bottom: 58px;
    left: 0;
    top: auto; } }

.sec_wrap .sec.on {
  opacity: 1; }

.sec_wrap .sec.on .bg2 {
  opacity: 0;
  transition: all 0.5s ease-in-out 0.3s; }

.sec_wrap .sec.on .bg2 img {
  transform: scaleY(1);
  transition: all 0.8s ease-in-out 0.3s; }

.sec_wrap .sec.on .bg1 {
  opacity: 1;
  transition: all 0.5s ease-in-out 0.3s; }

.sec_wrap .sec.on .inn {
  opacity: 1; }

/*.sec_wrap #sec1::after {
	background: url("../images/top/mv_img01.jpg") center center / cover;;
	transition:all 1s ease-in-out;
}

.sec_wrap #sec2::after {
	background: url("../images/top/mv_img02.jpg") center center / cover;;
	transition:all 1s ease-in-out;
}

.sec_wrap #sec3::after {
	background: #fff;
}
.sec_wrap #sec4::after {
	background: #fff;
}
.sec_wrap #sec5::after {
	background: #fff;
}*/
@media screen and (max-width: 768px) {
  .sec_wrap .sec1 {
    margin-top: 0;
    height: auto;
    min-height: inherit; }
    .sec_wrap .sec1 .inn {
      margin-top: 0;
      padding: 0;
      background: none;
      height: auto;
      min-height: inherit; } }
.sec_wrap .sec1.fix .inn {
  position: relative;
  bottom: auto;
  top: 0; }
@media screen and (max-width: 768px) {
  .sec_wrap .sec1 .sec1_main {
    aspect-ratio: 750 / 1200; } }
.sec_wrap .sec1 .sec1_main #video {
  transition: opacity 1.2s ease-in-out;
  opacity: 1;
  min-width: 100%;
  min-height: 100vh;
  position: absolute;
  z-index: 10;
  background: #333;
  display: block;
  line-height: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  object-position: center top; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec1 .sec1_main #video {
      min-height: inherit; } }
.sec_wrap .sec1 .sec1_main.end2 #video {
  opacity: 0; }
.sec_wrap .sec1 .sec1_main.end2 .bg .copy {
  opacity: 1; }
@media screen and (max-width: 768px) {
  .sec_wrap .sec2 {
    margin-top: 0;
    opacity: 1; } }
.sec_wrap .sec2 .scr {
  left: 10px;
  transform: none; }
.sec_wrap .sec2 .cont {
  padding-top: 6vh;
  width: calc(100% - 60px);
  color: #fff;
  position: relative; }
  @media screen and (max-width: 1200px) {
    .sec_wrap .sec2 .cont {
      padding-top: 4vh; } }
  @media screen and (min-height: 660px) and (max-height: 690px) {
    .sec_wrap .sec2 .cont {
      padding-top: 10px; } }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec2 .cont {
      padding-top: 3vh !important; } }
  .sec_wrap .sec2 .cont .info1 img {
    margin: 0 auto; }
.sec_wrap .sec2 .merit {
  max-width: 1250px;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px 0; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec2 .merit {
      gap: 3px 0;
      margin-inline: -10px;
      gap: 6px 0; } }
  .sec_wrap .sec2 .merit li {
    position: relative;
    z-index: 5;
    text-align: center;
    padding-bottom: calc(5%/12.5); }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec2 .merit li {
        padding: calc(2%/4) 0; } }
    .sec_wrap .sec2 .merit li::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, #1d6890, #175b5d);
      mix-blend-mode: multiply;
      z-index: -2; }
    .sec_wrap .sec2 .merit li::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #000;
      opacity: 0.7;
      mix-blend-mode: multiply;
      z-index: -1; }
    .sec_wrap .sec2 .merit li:nth-child(1) {
      width: calc(578% / 12.5); }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec2 .merit li:nth-child(1) {
          width: 100%; } }
    .sec_wrap .sec2 .merit li:nth-child(2) {
      width: calc(369% / 12.5); }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec2 .merit li:nth-child(2) {
          width: calc(300% / 6.1);
          order: 2; } }
    .sec_wrap .sec2 .merit li:nth-child(3) {
      width: calc(265% / 12.5); }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec2 .merit li:nth-child(3) {
          width: calc(300% / 6.1);
          order: 2; } }
.sec_wrap .sec2 .cap1 {
  font-size: 12px;
  line-height: 1.5; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec2 .cap1 {
      font-size: 9px; } }
.sec_wrap .sec2 .cap2 {
  font-size: 10px;
  line-height: 1.3;
  text-align: center; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec2 .cap2 {
      margin-inline: -10px;
      font-size: 8px;
      text-align: left; } }
@media screen and (max-width: 768px) {
  .sec_wrap .sec2 .modal_button {
    margin-inline: -10px; } }
.sec_wrap .sec10 .cont {
  max-width: 1100px;
  width: calc(100% - 60px);
  color: #fff;
  position: relative; }
.sec_wrap .sec10 .c4 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 10px; }
  .sec_wrap .sec10 .c4 li {
    width: calc(266% / 11); }
    @media screen and (max-width: 480px) {
      .sec_wrap .sec10 .c4 li {
        width: 48%; } }
    .sec_wrap .sec10 .c4 li .t_cap {
      font-size: 10px; }
      @media screen and (max-width: 480px) {
        .sec_wrap .sec10 .c4 li .t_cap {
          font-size: 8px; } }
.sec_wrap .sec10 .ta_c img {
  margin-inline: auto; }
.sec_wrap .sec3 .inn .cont {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  gap: calc(40% / 16); }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec3 .inn .cont {
      display: block; } }
  .sec_wrap .sec3 .inn .cont .txt {
    width: calc(620% / 16);
    padding-right: 20px;
    padding-top: calc(20% / 16); }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec3 .inn .cont .txt {
        width: calc(100% - 40px);
        margin: 0 auto 10px;
        text-align: center;
        padding: 0; } }
    .sec_wrap .sec3 .inn .cont .txt .t1 > span::after {
      top: 49%;
      left: 0; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec3 .inn .cont .txt .t1 > span::after {
          display: none; } }
  .sec_wrap .sec3 .inn .cont .img {
    width: calc(940% / 16);
    text-align: right; }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec3 .inn .cont .img {
        width: calc(100% + 0px);
        margin: 0 0 15px;
        text-align: center; } }
    .sec_wrap .sec3 .inn .cont .img > div {
      display: inline-block;
      position: relative; }
      .sec_wrap .sec3 .inn .cont .img > div .imgp {
        position: absolute;
        inset: 0;
        opacity: 0;
        transition: all 2s ease-in-out 0s; }
        @media screen and (max-width: 768px) {
          .sec_wrap .sec3 .inn .cont .img > div .imgp {
            opacity: 1; } }
        .sec_wrap .sec3 .inn .cont .img > div .imgp.img30 {
          position: relative; }
.sec_wrap .sec3.on .inn .cont .img > div .imgp {
  opacity: 1; }
  .sec_wrap .sec3.on .inn .cont .img > div .imgp.img30 {
    transition: all 1.2s ease-in-out 1.5s;
    transition: all 1.2s ease-in-out 1.2s; }
  .sec_wrap .sec3.on .inn .cont .img > div .imgp.img31 {
    transition: all 1.2s ease-in-out 0.3s;
    transition: all 1.2s ease-in-out 0s; }
  .sec_wrap .sec3.on .inn .cont .img > div .imgp.img32 {
    transition: all 1.2s ease-in-out 0.6s;
    transition: all 1.2s ease-in-out 0.3s; }
  .sec_wrap .sec3.on .inn .cont .img > div .imgp.img33 {
    transition: all 1.2s ease-in-out 0.9s;
    transition: all 1.2s ease-in-out 0.6s; }
.sec_wrap .sec4 .inn::before {
  content: "";
  position: absolute;
  bottom: -5%;
  right: -5%;
  width: 50%;
  height: 100%;
  background: url("../images/top/sec4_bg.jpg") bottom right/100% auto no-repeat;
  animation: 4.5s sd infinite ease-in-out;
  transform-origin: bottom right;
  z-index: -1; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec4 .inn::before {
      width: 100%;
      display: none; } }
.sec_wrap .sec4 .inn .cont {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  gap: calc(60% / 16); }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec4 .inn .cont {
      display: block; } }
  .sec_wrap .sec4 .inn .cont .txt {
    width: calc(620% / 16);
    padding-right: 20px; }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec4 .inn .cont .txt {
        width: calc(100% - 40px);
        margin: 0 auto 10px;
        text-align: center;
        padding: 0; } }
    .sec_wrap .sec4 .inn .cont .txt .t1 > span::after {
      top: 47%;
      left: 0; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec4 .inn .cont .txt .t1 > span::after {
          display: none; } }
  .sec_wrap .sec4 .inn .cont .img {
    width: calc(940% / 16);
    text-align: right; }
    .sec_wrap .sec4 .inn .cont .img img {
      margin: 0; }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec4 .inn .cont .img {
        width: 100%;
        margin: 0 auto 15px;
        text-align: center; } }
    .sec_wrap .sec4 .inn .cont .img .cap1 {
      bottom: 25%;
      right: 79%; }
    .sec_wrap .sec4 .inn .cont .img .cap2 {
      bottom: 2%;
      right: 53%; }
    .sec_wrap .sec4 .inn .cont .img .cap3 {
      bottom: 31%;
      right: 28%; }
    .sec_wrap .sec4 .inn .cont .img .cap4 {
      bottom: 19%;
      right: 3%; }
    .sec_wrap .sec4 .inn .cont .img > div {
      display: inline-block;
      position: relative; }
      .sec_wrap .sec4 .inn .cont .img > div .imgp {
        position: absolute;
        inset: 0;
        opacity: 0;
        transition: all 2s ease-in-out 0s; }
        @media screen and (max-width: 768px) {
          .sec_wrap .sec4 .inn .cont .img > div .imgp {
            opacity: 1; } }
        .sec_wrap .sec4 .inn .cont .img > div .imgp.img41 {
          position: relative; }
.sec_wrap .sec4.on .inn .cont .img > div .imgp {
  opacity: 1; }
  .sec_wrap .sec4.on .inn .cont .img > div .imgp.img41 {
    transition: all 1.2s ease-in-out 0.2s; }
  .sec_wrap .sec4.on .inn .cont .img > div .imgp.img42 {
    transition: all 1.2s ease-in-out 0.4s; }
  .sec_wrap .sec4.on .inn .cont .img > div .imgp.img43 {
    transition: all 1.2s ease-in-out 0.6s; }
  .sec_wrap .sec4.on .inn .cont .img > div .imgp.img44 {
    transition: all 1.2s ease-in-out 0.8s; }
.sec_wrap .sec5 .inn::before {
  content: "";
  position: absolute;
  top: -5%;
  left: 10%;
  width: 30%;
  height: 100%;
  background: url("../images/top/sec5_bg.jpg") top left/100% auto no-repeat;
  animation: 4.5s sd infinite ease-in-out;
  transform-origin: top left;
  z-index: -1; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec5 .inn::before {
      width: 100%;
      display: none; } }
.sec_wrap .sec5 .inn .cont {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 0; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec5 .inn .cont {
      display: block; } }
  .sec_wrap .sec5 .inn .cont .txt {
    width: calc(788% / 16);
    padding-left: calc(180% / 16); }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec5 .inn .cont .txt {
        width: calc(100% - 40px);
        margin: 0 auto 10px;
        text-align: center;
        padding: 0; } }
    .sec_wrap .sec5 .inn .cont .txt .t1 > span::after {
      top: 47%;
      right: 0; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec5 .inn .cont .txt .t1 > span::after {
          display: none; } }
  .sec_wrap .sec5 .inn .cont .img {
    width: calc(812% / 16);
    text-align: left;
    margin-left: -5%; }
    .sec_wrap .sec5 .inn .cont .img img {
      margin: 0; }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec5 .inn .cont .img {
        width: 100%;
        margin: 0 auto 15px;
        text-align: center; } }
    .sec_wrap .sec5 .inn .cont .img .cap1 {
      bottom: 30%;
      right: 2.5%; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec5 .inn .cont .img .cap1 {
          bottom: 34%;
          right: 20.5%; } }
    .sec_wrap .sec5 .inn .cont .img .cap2 {
      bottom: 3%;
      right: 26.7%;
      z-index: 9; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec5 .inn .cont .img .cap2 {
          right: 15.5%; } }
    .sec_wrap .sec5 .inn .cont .img .cap3 {
      bottom: 3%;
      right: 65%; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec5 .inn .cont .img .cap3 {
          right: 53.2%; } }
    .sec_wrap .sec5 .inn .cont .img > div {
      display: inline-block;
      position: relative; }
      .sec_wrap .sec5 .inn .cont .img > div .imgp {
        position: absolute;
        inset: 0;
        opacity: 0;
        transition: all 2s ease-in-out 0s; }
        @media screen and (max-width: 768px) {
          .sec_wrap .sec5 .inn .cont .img > div .imgp {
            opacity: 1; } }
        .sec_wrap .sec5 .inn .cont .img > div .imgp.img51 {
          position: relative; }
.sec_wrap .sec5.on .inn .cont .img > div .imgp {
  opacity: 1; }
  .sec_wrap .sec5.on .inn .cont .img > div .imgp.img51 {
    transition: all 1.2s ease-in-out 0.2s; }
  .sec_wrap .sec5.on .inn .cont .img > div .imgp.img52 {
    transition: all 1.2s ease-in-out 0.4s; }
  .sec_wrap .sec5.on .inn .cont .img > div .imgp.img53 {
    transition: all 1.2s ease-in-out 0.6s; }
  .sec_wrap .sec5.on .inn .cont .img > div .imgp.img54 {
    transition: all 1.2s ease-in-out 0.8s; }
.sec_wrap .sec6 .inn::before {
  content: "";
  position: absolute;
  bottom: -5%;
  left: -5%;
  width: 34%;
  height: 100%;
  background: url("../images/top/sec6_bg.jpg") bottom left/100% auto no-repeat;
  animation: 4.5s sd infinite ease-in-out;
  transform-origin: bottom left;
  z-index: -1; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec6 .inn::before {
      width: 100%;
      display: none; } }
.sec_wrap .sec6 .inn .cont {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 0; }
  @media screen and (max-width: 768px) {
    .sec_wrap .sec6 .inn .cont {
      display: block; } }
  .sec_wrap .sec6 .inn .cont .txt {
    width: calc(788% / 16);
    padding-left: calc(180% / 16); }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec6 .inn .cont .txt {
        width: calc(100% - 40px);
        margin: 0 auto 10px;
        text-align: center;
        padding: 0; } }
    .sec_wrap .sec6 .inn .cont .txt .t1 > span::after {
      top: 47%;
      right: 0; }
      @media screen and (max-width: 768px) {
        .sec_wrap .sec6 .inn .cont .txt .t1 > span::after {
          display: none; } }
  .sec_wrap .sec6 .inn .cont .img {
    width: calc(900% / 16);
    margin-left: calc(-140% / 16);
    text-align: left; }
    .sec_wrap .sec6 .inn .cont .img img {
      margin: 0; }
    @media screen and (max-width: 1600px) {
      .sec_wrap .sec6 .inn .cont .img {
        width: calc(820% / 16);
        margin-left: calc(-60% / 16); } }
    @media screen and (max-width: 768px) {
      .sec_wrap .sec6 .inn .cont .img {
        width: 100%;
        margin: 0 auto 15px;
        text-align: center; } }
    .sec_wrap .sec6 .inn .cont .img .cap1 {
      bottom: 1%;
      left: 2%;
      left: auto;
      right: 5%; }

@keyframes sd {
  0% {
    transform: rotate(-1.6deg); }
  50% {
    transform: rotate(1.6deg); }
  100% {
    transform: rotate(-1.6deg); } }
.sec_wrap .page_num {
  display: none; }

.sec_wrap .conts_h {
  display: none; }

.sec_wrap .sec_col {
  position: relative;
  width: 100%;
  height: 100%; }

.sec_wrap .sec_col li {
  position: absolute; }

/*.sec_wrap .sec_col .scr {
	bottom:1%;
	left:45.175%;
	width:9.65%;
	text-align:center;
	cursor:pointer;
}
.sec_wrap .sec_col .scr p {
	position:relative;
}
.sec_wrap .sec_col .scr img {
	transition:all 0.5s ease-in-out;
}
.sec_wrap .sec_col .scr:hover img {
	opacity:0.7;
}*/
.sec_wrap .sec_col .cap {
  right: 10px;
  bottom: 10px; }

.sec_thum {
  position: fixed;
  top: 49%;
  transform: translateY(-49%);
  right: 30px;
  z-index: 99;
  transition: all 0.3s ease-in-out; }
  body.off .sec_thum {
    opacity: 0; }
  @media screen and (max-width: 768px) {
    .sec_thum {
      right: 8px;
      display: none; } }

.sec_thum li {
  width: 10px;
  height: 10px;
  margin: 0 0 30px;
  cursor: pointer;
  position: relative;
  text-align: right;
  border: solid 1px #fff;
  border-radius: 50%;
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.3); }
  @media screen and (max-width: 768px) {
    .sec_thum li {
      width: 10px;
      height: 10px;
      margin: 0 0 30px; } }

.sec_thum li:last-child {
  margin: 0 0 0 0;
  display: none; }

.sec_thum li:before {
  position: absolute;
  top: 0;
  right: 0px;
  width: 100%;
  height: 100%;
  content: "";
  background: #fff;
  border-radius: 50%;
  opacity: 0; }

.sec_thum li:hover:before {
  opacity: 1; }

.sec_thum li.ac:before {
  opacity: 1; }

.sec_thum li::after {
  position: absolute;
  top: -80%;
  right: -80%;
  width: 260%;
  height: 260%;
  content: "";
  border: solid 1px #fff;
  border-radius: 50%;
  opacity: 0;
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.3); }

.sec_thum li:hover::after {
  opacity: 1; }

.sec_thum li.ac::after {
  opacity: 1; }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
.scr {
  position: absolute;
  z-index: 20;
  z-index: 20;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  font-size: 16px;
  line-height: 1;
  color: #fff;
  padding-bottom: 3.2em;
  letter-spacing: 0.05em;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.6); }
  .scr::after {
    content: "";
    position: absolute;
    height: 3em;
    left: 50%;
    border-left: solid 1px #fff;
    bottom: 0;
    animation: 2s scroll_move infinite;
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); }
  .scr.bk {
    color: #333;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.6); }
    .scr.bk::after {
      border-left: solid 1px #000;
      box-shadow: 0 0 5px 2px rgba(255, 255, 255, 0.1); }
  @media screen and (max-width: 768px) {
    .scr {
      display: none; } }

@keyframes scroll_move {
  from {
    transform: scale(1, 0);
    transform-origin: center top; }
  to {
    transform: scale(1, 1);
    transform-origin: center top; } }
body.off header {
  transition: all 0.3s ease-in-out;
  background: rgba(0, 0, 0, 0.4); }

div.header .nav_btn::before {
  border: solid 1px #fff;
  opacity: 1; }
  body.end div.header .nav_btn::before, body.end2 div.header .nav_btn::before {
    border: solid 1px #000;
    opacity: 0.6; }
  body.scrolled.sec2 div.header .nav_btn::before {
    border: solid 1px #fff;
    opacity: 1; }
  body.nav_open div.header .nav_btn::before {
    border: solid 1px #fff;
    opacity: 1; }
    @media screen and (max-width: 767px) {
      body.nav_open div.header .nav_btn::before {
        border: solid 1px #000;
        opacity: 0.9; } }
  body.off div.header .nav_btn::before {
    border: solid 1px #fff;
    opacity: 1; }
    @media screen and (max-width: 767px) {
      body.off div.header .nav_btn::before {
        border: solid 1px #fff;
        opacity: 1; } }
  body.nav_open.off div.header .nav_btn::before {
    border: solid 1px #fff;
    opacity: 1; }
    @media screen and (max-width: 767px) {
      body.nav_open.off div.header .nav_btn::before {
        border: solid 1px #000;
        opacity: 0.9; } }
div.header .nav_btn hr {
  background: #fff; }
  body.end div.header .nav_btn hr, body.end2 div.header .nav_btn hr {
    background: #222; }
  body.scrolled.sec2 div.header .nav_btn hr {
    background: #fff; }
  body.nav_open div.header .nav_btn hr {
    background: #fff; }
    @media screen and (max-width: 767px) {
      body.nav_open div.header .nav_btn hr {
        background: #222; } }
  body.off div.header .nav_btn hr {
    background: #fff; }
    @media screen and (max-width: 767px) {
      body.off div.header .nav_btn hr {
        background: #fff; } }
  body.nav_open.off div.header .nav_btn hr {
    background: #fff; }
    @media screen and (max-width: 767px) {
      body.nav_open.off div.header .nav_btn hr {
        background: #222; } }
div.header .nav_btn .hamb_txt {
  color: #fff; }
  body.end div.header .nav_btn .hamb_txt, body.end2 div.header .nav_btn .hamb_txt {
    color: #222; }
  body.scrolled.sec2 div.header .nav_btn .hamb_txt {
    color: #fff; }
  body.nav_open div.header .nav_btn .hamb_txt {
    color: #fff; }
    @media screen and (max-width: 767px) {
      body.nav_open div.header .nav_btn .hamb_txt {
        color: #222; } }
  body.off div.header .nav_btn .hamb_txt {
    color: #fff; }
    @media screen and (max-width: 767px) {
      body.off div.header .nav_btn .hamb_txt {
        color: #fff; } }
  body.nav_open.off div.header .nav_btn .hamb_txt {
    color: #fff; }
    @media screen and (max-width: 767px) {
      body.nav_open.off div.header .nav_btn .hamb_txt {
        color: #222; } }

.movie_banner_box {
  width: 85%;
  max-width: 500px;
  max-width: 460px;
  max-width: 720px;
  max-width: 500px;
  margin: 0 auto; }
  @media screen and (max-width: 480px) {
    .movie_banner_box {
      width: 100%; } }
  .movie_banner_box.wide {
    max-width: 800px; }
  .movie_banner_box .modal_button {
    cursor: pointer;
    transition: opacity 0.3s ease-in-out; }
    @media (hover: hover) {
      .movie_banner_box .modal_button:hover {
        opacity: 0.7; } }
  .movie_banner_box .cap_c {
    font-size: 14px;
    margin-top: 5px;
    font-size: 10px; }
    @media screen and (max-width: 480px) {
      .movie_banner_box .cap_c {
        font-size: 12px;
        font-size: 8px; } }

.modal_cont {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
  pointer-events: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(0, 0, 0, 0.8);
  z-index: 9999999; }
  body.modal_open .modal_cont {
    opacity: 1;
    pointer-events: all; }
  .modal_cont .modal {
    max-width: 1600px;
    width: 96%;
    height: 100dvh;
    margin-inline: auto;
    pointer-events: none;
    transition: opacity 0.3s ease-in-out; }
    @media screen and (max-width: 480px) {
      .modal_cont .modal {
        width: 100%; } }
    .modal_cont .modal.active {
      opacity: 1;
      pointer-events: all; }
    .modal_cont .modal .modal_box {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center; }
      @media screen and (max-width: 480px) {
        .modal_cont .modal .modal_box {
          align-items: flex-start;
          margin-top: 45%; } }
    .modal_cont .modal video {
      width: 100%;
      height: auto;
      line-height: 0; }
  .modal_cont .modal_close {
    position: fixed;
    top: 10px;
    right: 10px;
    cursor: pointer;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: flex-end;
    border: 1px solid #fff;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 9999999; }
    @media screen and (max-width: 480px) {
      .modal_cont .modal_close {
        width: 50px;
        height: 50px; } }
    .modal_cont .modal_close::before, .modal_cont .modal_close::after {
      position: absolute;
      top: 40%;
      left: 30%;
      width: 40%;
      height: 2px;
      background-color: #FFF;
      content: ""; }
      @media screen and (max-width: 480px) {
        .modal_cont .modal_close::before, .modal_cont .modal_close::after {
          top: 35%; } }
    .modal_cont .modal_close::before {
      transform: rotate(45deg); }
    .modal_cont .modal_close::after {
      transform: rotate(-45deg); }
    .modal_cont .modal_close .close_text {
      text-align: center;
      font-size: 12px;
      margin-bottom: 2px;
      width: 100%;
      color: #fff; }
      @media screen and (max-width: 480px) {
        .modal_cont .modal_close .close_text {
          font-size: 10px;
          margin-bottom: 1px; } }

.holiday_box {
  max-width: 620px;
  max-width: 700px;
  width: 100%;
  color: #c7000a;
  margin: 25px auto 0;
  margin-top: 0;
  margin-bottom: 30px;
  background: #fff;
  padding: 20px 10px;
  border: 1px solid #c7000b; }
  @media screen and (max-width: 767px) {
    .holiday_box {
      width: 100%;
      padding: 10px;
      margin-top: 20px; } }
  .holiday_box .holiday_head {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 3px;
    letter-spacing: 0.1em; }
    @media screen and (max-width: 767px) {
      .holiday_box .holiday_head {
        font-size: 11px; } }
  .holiday_box .holiday_text {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.6; }
    @media screen and (max-width: 767px) {
      .holiday_box .holiday_text {
        font-size: 11px;
        letter-spacing: 0.1em; } }

.float {
  position: fixed;
  z-index: 9999;
  bottom: 0;
  left: 0;
  max-width: 630px;
  width: 80%; }
  .float .float_close {
    position: absolute;
    top: 0.2em;
    left: 0.2em;
    top: -0.6em;
    left: 0.2em;
    padding-top: 0.1em;
    font-size: 18px;
    font-size: 24px;
    font-size: 26px;
    width: 1.4em;
    height: 1.4em;
    border-radius: 50%;
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    background: #000;
    cursor: pointer; }
  @media screen and (max-width: 480px) {
    .float {
      bottom: 72px;
      left: 10px;
      width: calc(100% - 20px); }
      .float .float_close {
        top: -0.4em;
        left: -0.4em;
        font-size: 22px; } }

.m_slide {
  background: #000;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  .m_slide .m_box {
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 0;
    position: absolute;
    inset: 0;
    opacity: 0; }
    .m_slide .m_box .img {
      width: 100%;
      height: 100%;
      overflow: hidden; }
      .m_slide .m_box .img figure {
        width: 100%;
        height: 100%;
        overflow: hidden; }
        .m_slide .m_box .img figure img {
          width: 100%;
          height: 100%;
          object-fit: cover; }
    .m_slide .m_box .copy {
      opacity: 0;
      position: absolute;
      inset: 0;
      max-width: 1600px;
      margin-inline: auto; }
      .m_slide .m_box .copy img {
        width: 100%;
        height: 100%;
        object-fit: scale-down; }
    .m_slide .m_box.box1 {
      transition: all 1s ease-in-out 0s; }
      .m_slide .m_box.box1 .img figure {
        position: relative;
        width: calc(100% + 200px);
        height: 100%;
        left: 0;
        transition: all 8s linear 0s; }
        @media screen and (max-width: 767px) {
          .m_slide .m_box.box1 .img figure {
            width: calc(100% + (100% / 8)); } }
      .m_slide .m_box.box1 .copy {
        transition: all 1s ease-in-out 1.5s;
        transition: all 1s ease-in-out 1s; }
      body.scene1 .m_slide .m_box.box1 {
        opacity: 1; }
        body.scene1 .m_slide .m_box.box1 .img figure {
          left: -200px; }
          @media screen and (max-width: 767px) {
            body.scene1 .m_slide .m_box.box1 .img figure {
              left: calc(-100% / 8); } }
        body.scene1 .m_slide .m_box.box1 .copy {
          opacity: 1; }
    .m_slide .m_box.box2 {
      transition: all 1s ease-in-out 0s; }
      .m_slide .m_box.box2 .img figure {
        position: relative;
        width: calc(100% + 200px);
        height: 100%;
        left: -200px;
        transition: all 8s linear 0s; }
        @media screen and (max-width: 767px) {
          .m_slide .m_box.box2 .img figure {
            width: calc(100% + 200px);
            left: calc(-100% / 8); } }
      .m_slide .m_box.box2 .copy {
        transition: all 1s ease-in-out 1.5s;
        transition: all 1s ease-in-out 1s; }
      body.scene2 .m_slide .m_box.box2 {
        opacity: 1; }
        body.scene2 .m_slide .m_box.box2 .img figure {
          left: 0; }
        body.scene2 .m_slide .m_box.box2 .copy {
          opacity: 1; }
    .m_slide .m_box.box3 {
      transition: all 2.5s ease-in-out 0s; }
      .m_slide .m_box.box3 .img figure {
        width: 100%;
        height: 100%;
        transform: scale(1.1);
        transition: all 4.5s ease-out 0s;
        transition: all 4s ease-out 0s;
        position: relative; }
        .m_slide .m_box.box3 .img figure::after {
          content: "";
          position: absolute;
          inset: 0;
          background: #000;
          opacity: 0.6;
          transition: all 1s ease-in 4s;
          transition: all 1s ease-in 3s; }
      .m_slide .m_box.box3 .copy {
        transition: all 2s ease-in-out 5s;
        transition: all 2s ease-in-out 4s; }
      body.scene3 .m_slide .m_box.box3 {
        opacity: 1; }
        body.scene3 .m_slide .m_box.box3 .img figure {
          transform: scale(1); }
          body.scene3 .m_slide .m_box.box3 .img figure::after {
            opacity: 0; }
        body.scene3 .m_slide .m_box.box3 .copy {
          opacity: 1; }
  body.moving .m_slide * {
    transition-duration: 0s !important;
    transition-delay: 0s !important; }
    body.moving .m_slide *::after {
      transition-duration: 0s !important;
      transition-delay: 0s !important; }
    body.moving .m_slide *::before {
      transition-duration: 0s !important;
      transition-delay: 0s !important; }
  .m_slide .replay,
  .m_slide .skip {
    position: absolute;
    top: 115px;
    left: 15px;
    background-color: #000;
    border: 1px solid #fff;
    color: #fff;
    font-size: 16px;
    padding: 0.3em 0.7em 0.2em;
    transition: 0.4s;
    z-index: 10;
    line-height: 1; }
    @media screen and (max-width: 767px) {
      .m_slide .replay,
      .m_slide .skip {
        top: 75px;
        left: 15px;
        font-size: 12px; } }
  .m_slide .replay {
    display: none;
    pointer-events: none; }
    body.scene4 .m_slide .replay {
      display: block;
      pointer-events: all; }
  body.scene4 .m_slide .skip {
    display: none;
    pointer-events: none; }

/*# sourceMappingURL=top.css.map */