@charset "UTF-8";

/* --------------------------
 mv
----------------------------- */

.mv{ width: 100%;overflow: hidden;background-color: #faf5f2;position: relative;}

/* swiper */
.swiper-container{width: 100%;position: relative;}
.swiper-container::after{content: "";width: 100%;height: 100%;position: absolute;top:0;left: 0;background: url(../img/top/curtain.png)no-repeat top left;background-size: cover; z-index:2;}
.swiper-container::after{clip-path: polygon(0% 0%, 0% 100%, 15% 100%, 10% 51%, 20% 10%, 80% 10%, 90% 50%, 85% 100%, 100% 100%, 100% 0%);}/* クリックできるように*/

.swiper-wrapper{ width: 100%;}

.swiper-slide{ background-color: #faf5f2;}
.swiper-slide a{ display: block;width: 100%;height: 100%;z-index: 5;cursor: pointer;}
.swiper-slide img{ width: 100%;}

.swiper-pagination-clickable .swiper-pagination-bullet {cursor: pointer;width: 20px;height: 20px;background: url(../img/top/star.png) no-repeat center center;z-index: 5;}
.swiper-pagination-black .swiper-pagination-bullet-active {width: 20px;height: 20px;background: url(../img/top/star_on.png)no-repeat center center;z-index: 5;}

.swiper-pagination {position: absolute;bottom: 3.5%;left: 0;right: 0;margin: auto;text-align: center;-webkit-transition: .3s opacity;-o-transition: .3s opacity;transition: .3s opacity;-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);z-index: 10;}
.swiper-pagination-bullet {opacity: 1;border-radius: 0;margin: 0 0.5%;}


@media screen and (max-width:767px) {
  .mv{ width: 100%;overflow: hidden;background-color: #f7f0eb;position: relative;}

  .swiper-container{width: 100%;position: relative;margin-bottom: 7.2vw;}
  .swiper-container::after{content: "";width: 100%;height: 100%;position: absolute;top:0;left: 0;background: url(../img/top/curtain-sp.png)no-repeat top left;background-size: cover; z-index:2;}

  .swiper-pagination-clickable .swiper-pagination-bullet {cursor: pointer;width: 2.66vw;height: 2.66vw;background: url(../img/top/star-sp.png) no-repeat center center;background-size: contain;z-index: 5;}
  .swiper-pagination-black .swiper-pagination-bullet-active {width: 2.66vw;height: 2.66vw;background: url(../img/top/star_on-sp.png)no-repeat center center;background-size: contain;z-index: 5;}

  .swiper-pagination {position: absolute;bottom: 2vw;left: 0;right: 0;margin: auto;text-align: center;-webkit-transition: .3s opacity;-o-transition: .3s opacity;transition: .3s opacity;-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);z-index: 10;}
  .swiper-pagination-bullet {opacity: 1;border-radius: 0;margin: 0 1%;}
}


/* --------------------------
 cont banner
----------------------------- */

@media screen and (min-width:767px) {

  .cont{ width: 100%;overflow: hidden;background-color: #f7f0eb;position: relative;}
  .cont ul{ width: 100%;text-align: center;padding: 20px 16px 15px 20px;}
  .cont ul li{ width: calc(50% - 8px);vertical-align: top;display: inline-block;margin-bottom: 13px;}
  .cont ul li:nth-child(odd){ margin-right: 10px;}
  .cont ul li img{ width: 100%;}
}

@media screen and (max-width:767px) {

  .cont{ width: 100%;overflow: hidden;background-color: #f7f0eb;position: relative;}
  .cont ul{ width: 100%;text-align: center;padding: 0 2vw;}
  .cont ul li{ width: 100%;display: block;margin-bottom: 2vw;}
  .cont ul li img{ width: 100%;}
}


/* --------------------------
 animation
----------------------------- */

.-cookie .slides { transform: translateX(10px); opacity: 0;}
.-cookie.-is-loaded .slides{opacity: 1;transform: translateX(0px);transition:all .5s ease .1s;}

.-cookie .ld-zoom { transform: scale(.8);opacity: 0;}
.-cookie.-is-loaded .ld-zoom{opacity: 1;transform: scale(1);transition:all .7s ease 0;}

.-cookie.-is-loaded .ld-zoom.delay1300{transition:all .7s ease .3s;}
.-cookie.-is-loaded .ld-zoom.delay1400{transition:all .7s ease .4s;}
.-cookie.-is-loaded .ld-zoom.delay1500{transition:all .7s ease .5s;}
.-cookie.-is-loaded .ld-zoom.delay1600{transition:all .7s ease .6s;}
.-cookie.-is-loaded .ld-zoom.delay1700{transition:all .7s ease .7s;}
.-cookie.-is-loaded .ld-zoom.delay1800{transition:all .7s ease .8s;}
.-cookie.-is-loaded .ld-zoom.delay1900{transition:all .7s ease .9s;}
.-cookie.-is-loaded .ld-zoom.delay2000{transition:all .7s ease 1s;}


.-is-first-time .slides { transform: translateX(10px); opacity: 0;}
.-is-first-time.-is-loaded .slides{opacity: 1;transform: translateX(0px);transition:all .5s ease 1.1s;}

.-is-first-time .ld-zoom { transform: scale(.8);opacity: 0;}
.-is-first-time.-is-loaded .ld-zoom{opacity: 1;transform: scale(1);transition:all .7s ease 0;}

.-is-first-time.-is-loaded .ld-zoom.delay1300{transition:all .7s ease 1.3s;}
.-is-first-time.-is-loaded .ld-zoom.delay1400{transition:all .7s ease 1.4s;}
.-is-first-time.-is-loaded .ld-zoom.delay1500{transition:all .7s ease 1.5s;}
.-is-first-time.-is-loaded .ld-zoom.delay1600{transition:all .7s ease 1.6s;}
.-is-first-time.-is-loaded .ld-zoom.delay1700{transition:all .7s ease 1.7s;}
.-is-first-time.-is-loaded .ld-zoom.delay1800{transition:all .7s ease 1.8s;}
.-is-first-time.-is-loaded .ld-zoom.delay1900{transition:all .7s ease 1.9s;}
.-is-first-time.-is-loaded .ld-zoom.delay2000{transition:all .7s ease 2s;}