@charset "utf-8";
* {
  margin:0;
  padding:0;
  box-sizing: border-box;
}
body {
  font-family:"ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color:#000;
  line-height: 1.5em;
}
ul,ol {
  list-style-type:none;
}
a:hover {
  opacity:1.0;
}
a:focus {
  outline: none;
}
.content_wrap {
  max-width: 750px;
  margin:0 auto;
  overflow: hidden;
}
.content_wrap img {
  height:auto;
  display: block;
  height: auto;
  border: 0;
  max-width: 100%;
  margin:0;
}
.content_wrap video {
  width: 100%;
  display: block;
  height: auto;
  border: 0;
  outline: none;
}
.content_wrap a {
  display: block;
}
.content_wrap .rl {
  position: relative;
}
.content_wrap .sld {
  opacity: 0;
  transition: opacity .3s linear;
}
.content_wrap .sld.slick-initialized {
  opacity: 1;
}

.content_wrap .hikari {
  border: 2px solid transparent;
  position: relative;
  overflow: hidden;
}
.content_wrap .hikari:before {
  content: "";
  animation: hikari 4s cubic-bezier(0.25, 0, 0.25, 1) infinite;
  background-color: #fff;
  width: 140%;
  height: 100%;
  transform: skewX(-45deg);
  top: -0;
  left: -140%;
  opacity: 0.5;
  position: absolute;
}
@keyframes hikari {
  0% {
    left: -160%;
    opacity: 0;
  }
  70% {
    left: -160%;
    opacity: 0.5;
  }
  71% {
    left: -160%;
    opacity: 1;
  }
  100% {
    left: -20%;
    opacity: 0;
  }
}
.content_wrap .slide_w {
  position:relative;
  z-index:4;
}
.content_wrap .slider {
  position:absolute;
  width:100%;
  height:min(168.5vw,1264px);
  left:0;
  top:0;
}
.content_wrap .slider__item {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.content_wrap .slider__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.content_wrap .slider__item:nth-of-type(1) {
  z-index: 2; 
}
.content_wrap .slider__item:nth-of-type(2) {
  z-index: 1; 
}
.content_wrap .slider__item.pre {
  z-index: 2;
}
.content_wrap .slider__item.now {
  z-index: 3;
}
.content_wrap .slider__item.leave {
   z-index: 3; 
}
@supports (-webkit-mask-size: 100% 100%) or (mask-size: 100% 100%) {
  .slider li:nth-of-type(2).now img {
    -webkit-mask-image: url("../images/mask.jpg");
    mask-image: url("../images/mask.jpg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: left top;
    mask-position: left top;
    animation: slideLeftToRight 1.5s cubic-bezier(.4, 0, .2, 1) 0s forwards;
  }
.slider li:nth-of-type(2).leave img {
    -webkit-mask-image: url("../images/mask.jpg");
    mask-image: url("../images/mask.jpg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: left top; 
    mask-position: left top;
    animation: slideRightToLeft 1.5s cubic-bezier(.4, 0, .2, 1) 0s forwards;
  }  
}
@keyframes slideLeftToRight {
  0% {
    -webkit-mask-size: 0% 100%;
    mask-size: 0% 100%;
  }
  100% {
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }
}
@keyframes slideRightToLeft {
  0% {
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }
  100% {
    -webkit-mask-size: 0% 100%;
    mask-size: 0% 100%;
  }
}
.content_wrap .video01 {
  position:absolute;
  width:100%;
  z-index:-1;
  left:0;
  top:6%;
}
.content_wrap .video01-2 {
  position:absolute;
  width:100%;
  z-index:-1;
  left:0;
  top:0;
}
.content_wrap .video02 {
  position:absolute;
  width: 58%;
  top:33.1%;
  left:3.7%;
}
.content_wrap .video02 video {
  border:min(0.7vw,5px) solid #fff;
  object-fit: cover;
  height:695px;
}
.content_wrap .pt01-1 {
  position: absolute;
  z-index:2;
  width:48.1%;
  top:33.24%;
  right:-0.9%;
}
.content_wrap .fuwa_wrap {
  animation: fuwa1 7s ease-in-out infinite alternate-reverse;
}
.content_wrap .fuwa_pic {
  animation: fuwa2 2s ease-in-out infinite alternate-reverse;
}
.content_wrap .pt01 {
  position:absolute;
  z-index:2;
  width:52.26%;
  top:28.47%;
  left:-3.86%;
}
.content_wrap .pt01.fuwa_wrap { animation-delay: 0s; }
.content_wrap .pt01 .fuwa_pic { animation-delay: 0s; }
.content_wrap .pt02 {
  position:absolute;
  z-index:3;
  width:35.33%;
  top:25.9%;
  left:43%;
}
.content_wrap .pt02.fuwa_wrap { animation-delay: -1.5s; }
.content_wrap .pt02 .fuwa_pic { animation-delay: -0.4s; }
.content_wrap .pt03 {
  position:absolute;
  z-index:3;
  width: 42.13%;
  top:34.62%;
  right:-2%;
}
.content_wrap .pt03.fuwa_wrap { animation-delay: -3.2s; }
.content_wrap .pt03 .fuwa_pic { animation-delay: -0.9s; }
.content_wrap .pt04 {
  position:absolute;
  z-index:4;
  width: 40.66%;
  top:67.56%;
  left:-6.13%;
}
.content_wrap .pt04.fuwa_wrap { animation-delay: -4.8s; }
.content_wrap .pt04 .fuwa_pic { animation-delay: -1.2s; }
.content_wrap .pt05 {
  position:absolute;
  z-index:3;
  width: 49.2%;
  top:72%;
  left:24%;
}
.content_wrap .pt05.fuwa_wrap { animation-delay: -5.5s; }
.content_wrap .pt05 .fuwa_pic { animation-delay: -1.5s; }
.content_wrap .pt06 {
  position:absolute;
  z-index:2;
  width: 57.33%;
  top:58.3%;
  right:-13.73%;
}
.content_wrap .pt06.fuwa_wrap { animation-delay: -6.2s; }
.content_wrap .pt06 .fuwa_pic { animation-delay: -1.8s; }
@keyframes fuwa1 {
  0% { transform: translateX(-7%); }
  100% { transform: translateX(7%); }
}
@keyframes fuwa2 {
  0% { transform: translateY(-9%); }
  100% { transform: translateY(9%); }
}
.content_wrap .pt07 {
  position:absolute;
  width:74.93%;
  z-index:5;
  top:50%;
  left:3.2%;
}
.content_wrap .btn01 {
  position:absolute;
  width:85.46%;
  top:24%;
  left:7.73%;
}
.content_wrap .video03 {
  position:absolute;
  z-index: -1;
  width:100%;
  top:12.54%;
  left:0;
}
.content_wrap .slide01 {
  position:absolute!important;
  width:100%!important;
  top:11.5%;
  left:0;
}
.content_wrap .slide01 .slick-slide img {
  box-shadow:min(0.7vw,5px) min(0.8vw,6px) min(2.26vw,17px) rgba(0,0,0,0.15)!important;
  border-radius: min(4vw,30px)!important;
  margin:0 auto min(2.66vw,20px)!important;
  width: 96.6%!important;
}
.content_wrap .sc_honey_b {
  position:relative;
  z-index:2;  
}
.content_wrap .sc_honey_b img {
  object-fit: cover;
}
.content_wrap .sc_wrap {
  position: relative;
  overflow: hidden;
  clip-path: inset(0%);
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 9;
}
.content_wrap .sc {
  position: absolute;
  left: 0%;
  width: 100%;
  height: calc(100% / 3);  
}
.content_wrap .sc_wrap .sc_bg1::after {
  content: "";
  display: block;
  position: fixed;
  top: 0%;
  width: 100%;
  max-width: 750px;
  height: 50vh;
  opacity: 0;
  transition: 1s;  
}
.content_wrap .sc_wrap .sc_bg2::after {
  content: "";
  display: block;
  position: fixed;
  bottom: 0%;
  width: 100%;
  max-width: 750px;
  height: 50vh;
  opacity: 0;
  transition: 1s;  
}
.content_wrap .sc_wrap .sc_t {
  position: fixed;
  bottom: 50%;
  left: 50%;
  margin-left:-278px;
  width: 74%;
  transition: 0.8s;
  max-width: 556px;
  transform: translateX(120%);
}
.content_wrap .sc_wrap .sc_b {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left:-278px;
  width: 74%;
  transition: 0.8s;
  max-width: 556px;
  transform: translateX(-120%);
}
.content_wrap .sc_wrap .sc.inview_active .sc_t,.content_wrap .sc_wrap .sc.inview_active .sc_b {
  transform: translateX(0);
}
.content_wrap .sc_wrap .sc01 {
  top:calc( 1292px + 0% );
}
.content_wrap .sc_wrap .sc02 {
  top:calc( 1292px + 20% );
}
.content_wrap .sc_wrap .sc03 {
  top:calc( 1292px + 40% );
}
.content_wrap .sc_wrap .sc01 .sc_bg1::after {
  opacity: 1;
  background: url(../images/sc01-bg1.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc01.inview_active .sc_bg1::after {
  background: url(../images/sc01-bg1.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc01 .sc_bg2::after {
  opacity: 1;
  background: url(../images/sc01-bg2.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc01.inview_active .sc_bg2::after {
  background: url(../images/sc01-bg2.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc02 .sc_bg1::after {
  background: url(../images/sc02-bg1.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc02.inview_active .sc_bg1::after {
  opacity: 1;
  background: url(../images/sc02-bg1.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc02 .sc_bg2::after {
   background: url(../images/sc02-bg2.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc02.inview_active .sc_bg2::after {
  opacity: 1;
  background: url(../images/sc02-bg2.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc03 .sc_bg1::after {
  background: url(../images/sc03-bg1.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc03.inview_active .sc_bg1::after {
  opacity: 1;
  background: url(../images/sc03-bg1.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc02 .sc_bg2::after {
   background: url(../images/sc03-bg2.jpg) center center / 200% no-repeat; 
}
.content_wrap .sc_wrap .sc02.inview_active .sc_bg2::after {
  opacity: 1;
  background: url(../images/sc03-bg2.jpg) center center / 130% no-repeat; 
}
.content_wrap .sc_wrap .sc.inview_active .sc_fuwa {
  opacity: 1;
}
.content_wrap .sc_wrap .sc_fuwa {
  position: fixed;
  transition: 0.8s 0.4s;
  opacity: 0;
  left:50%;
  animation: 1s sc_fuwa ease-in-out alternate infinite; 
}
.content_wrap .sc_wrap .sc.inview_active .sc_fuwa {
  opacity: 1;
}
.content_wrap .sc_wrap .sc01 .sc_fuwa {
  top: 50%;
  width: min(43.33vw,325px);
  margin-left:-175px;
  margin-top:-99px;
}
.content_wrap .sc_wrap .sc02 .sc_fuwa {
  top: 50%;
  width: min(36.4vw,273px);
  margin-left:-136px;
  margin-top:-100px;
}
.content_wrap .sc_wrap .sc03 .sc_fuwa {
  top: 50%;
  width: min(37.2vw,279px);
  margin-left:-136px;
  margin-top:-95px;
}
.content_wrap .pt-box {
  position:absolute;
  top:61.43%;
  left:20.8%;
  width: 58.8%;
  z-index:3;
}
.content_wrap .pt-cap {
  position:absolute;
  width:18.26%;
  top:64%;
  left:40.6%;
  z-index: 2;
}
@keyframes sc_fuwa {
  0% {
    transform: translateY(-5%);
  }
  100% {
    transform: translateY(5%);
  }
}
.content_wrap .pt-b1 {
  position:absolute;
  z-index: 5;
  width: 26.6%;
  top:40.7%;
  left:-6%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(150%, 100%);
}
.content_wrap .pt-b2 {
  position:absolute;
  z-index: 5;
  width: 34.93%;
  top:40.7%;
  right:4.53%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(-90%, 25%);
}
.content_wrap .pt-b3 {
  position:absolute;
  z-index: 5;
  width: 13.73%;
  top:40.2%;
  right:0.7%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(-300%, 120%);
}
.content_wrap .pt-b4 {
  position:absolute;
  z-index: 5;
  width: 45.6%;
  top:71.4%;
  left:-5.9%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(68%, -120%);
}
.content_wrap .pt-b5 {
  position:absolute;
  z-index: 5;
  width: 20.8%;
  top:79.9%;
  left:51.6%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(-60%, -220%);
}
.content_wrap .pt-b6 {
  position:absolute;
  z-index: 5;
  width: 15%;
  top:87.8%;
  left:73.73%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(-210%, -650%);
}
.content_wrap .pt-b7 {
  position:absolute;
  z-index: 5;
  width: 39%;
  top:62.9%;
  right:-11.3%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(-110%, -90%);
}
.content_wrap .pt-b8 {
  position:absolute;
  z-index: 5;
  width: 44.66%;
  top:43%;
  left:-1%;
  opacity: 0;
  transition: 1.4s;
  transform: translate(60%, 15%);
}
.content_wrap .pt-b1.inview_active,
.content_wrap .pt-b1.inview_active ~ .pt-b2,
.content_wrap .pt-b1.inview_active ~ .pt-b3,
.content_wrap .pt-b1.inview_active ~ .pt-b4,
.content_wrap .pt-b1.inview_active ~ .pt-b5,
.content_wrap .pt-b1.inview_active ~ .pt-b6,
.content_wrap .pt-b1.inview_active ~ .pt-b7,
.content_wrap .pt-b1.inview_active ~ .pt-b8 {
  opacity: 1;
  transform: translate(0, 0);
}
.content_wrap .pt-b1 img {
  animation: 1.6s pt_b_ani1 ease-in-out alternate infinite;
}
.content_wrap .pt-b2 img {
  animation: 2s pt_b_ani2 -0.5s ease-in-out alternate infinite;
}
.content_wrap .pt-b3 img {
  animation: 1s pt_b_ani1 ease-in-out alternate infinite;
}
.content_wrap .pt-b4 img {
  animation: 2s pt_b_ani2 1s ease-in-out alternate infinite;
}
.content_wrap .pt-b5 img {
  animation: 1s pt_b_ani1 ease-in-out alternate infinite;
}
.content_wrap .pt-b6 img {
  animation: 2s pt_b_ani2 -0.5s ease-in-out alternate infinite;
}
.content_wrap .pt-b7 img {
  animation: 1.6s pt_b_ani1 ease-in-out alternate infinite;
}
.content_wrap .pt-b8 img {
  animation: 2s pt_b_ani1 -0.5s ease-in-out alternate infinite;
}
@keyframes pt_b_ani1 {
  0% {
    transform: translateY(-5%);
  }
  100% {
    transform: translateY(5%);
  }
}
@keyframes pt_b_ani2 {
  0% {
    transform: translateY(-10%);
  }
  100% {
    transform: translateY(10%);
  }
}
.content_wrap .pt_circle {
  position:absolute;
  z-index:2;
  width:79.46%;
  top:26.4%;
  left:-1.6%;
  animation: ani_spin 20s linear 0s infinite; 
}
.content_wrap .pt_circle_u {
  position:absolute;
  z-index:3;
  width:100%;
  left:0;
  bottom:0;
}
@keyframes ani_spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-359deg);
  }
}
@media(max-width:749px) {
  .content_wrap img {
    width: 100%;
  }
  .content_wrap .video02 video {
    height:92.6vw;
  }
  .content_wrap .sc_wrap .sc_t {
    left: 13%;
    margin-left:0;
  }
  .content_wrap .sc_wrap .sc_b {
    left: 13%;
    margin-left:0;
  }
  .content_wrap .sc_wrap .sc_fuwa {
    position: fixed;
    transition: 0.8s 0.4s;
    opacity: 0;
    left:0;
  }
  .content_wrap .sc_wrap .sc01 .sc_fuwa {
    left:29.33%;
    margin-left:0;
    margin-top:-13.2vw;
  }
  .content_wrap .sc_wrap .sc02 .sc_fuwa {
    left:32%;
    margin-left:0;
    margin-top:-13.3vw;
  }
  .content_wrap .sc_wrap .sc03 .sc_fuwa {
    left:31.3%;
    margin-left:0;
    margin-top:-12.6vw;
  }  
  .content_wrap .sc_wrap .sc01 {
    top:calc( 172.26vw + 0% );
  }
  .content_wrap .sc_wrap .sc02 {
    top:calc( 172.26vw + 20% );
  }
  .content_wrap .sc_wrap .sc03 {
    top:calc( 172.26vw + 40% );
  }
}