@charset "UTF-8";
.aoure_240626 {
  --lp-main-color: #fff;
  --lp-sub-color: #ddd;
  --lp-third-color: #000;
  --lp-font-jp: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Sans",  "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", Arial, "メイリオ", Meiryo, sans-serif;
  --lp-font-en: "nimbus-sans";
  --font-trajan: "trajan-pro-3";
  --sp-mv-text: calc(10 *(100vw / 750)) ;
  --pc-mv-text: 1rem;
  --sp-head: calc(10 *(100vw / 750)) ;
  --pc-head: 2rem;
  --sp-sub-head: calc(10 *(100vw / 750)) ;
  --pc-sub-head: 2rem;
  --sp-text: calc(10 *(100vw / 750)) ;
  --pc-text: 2rem;
  --sp-other-text: calc(10 *(100vw / 750)) ;
  --pc-other-text: 1rem;
  --sp-credit: calc(10 *(100vw / 750)) ;
  --pc-credit: 1rem;
  --sp-buy-btn: calc(10 *(100vw / 750)) ;
  --pc-buy-btn: 1rem;
  --cls-150: 0.15em;
  --cls-120: 0.125em;
  --cls-100: 0.1em;
  --cls-75: 0.075em;
  --cls-50: 0.05em;
  --cls-25: 0.025em;
}

/*================================
  header
=================================*/
.header{
  position: fixed;
}

#header .header__inner svg{
  fill: #fff;
}
.cls-4{
  stroke: #fff;
}
.header .navigation__list{
  color: #fff;
}
.header .drawer-btn__border{
  background: #fff;
}
.header .drawer-btn__border::after{
  background: #fff;
}
.header .drawer-btn__border::before{
  background: #fff;
}

/*================================
  リセット
=================================*/
.aoure_240626 p,
.aoure_240626 ul,
.aoure_240626 ol,
.aoure_240626 dl {
  margin: 0;
}

.aoure_240626 li {
  list-style: none;
}

.aoure_240626 img {
  width: 100%;
  height: auto;
  position: relative;
  -webkit-backface-visibility: hidden;
}

.aoure_240626 video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.aoure_240626 picture,
.aoure_240626 video {
  display: block;
}

.aoure_240626 .pc {
  display: none !important;
}

@media only screen and (min-width: 768px), print {
  .aoure_240626 .sp {
    display: none !important;
  }
  .aoure_240626 .pc {
    display: block !important;
  }
}


/*================================
  common
=================================*/
.aoure_240626 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--lp-main-color);
  overflow: hidden;
  font-family: var(--lp-font-jp);
  font-weight: 500;
  width: calc(750 *(100vw / 750));
  margin: auto;
  letter-spacing: var(--cls-100);
  font-feature-settings: "palt";
  background: var(--lp-third-color);
  padding-bottom: calc(194* (100vw / 750 ));
}
.top_button{
  position: absolute;
  right: calc(55* (100vw / 750 ));
  top: calc(-120* (100vw / 750 ));
}
@media only screen and (min-width: 768px), print {
  .aoure_240626 {
    width: 100%;
    padding-bottom: 17rem;
  }
  .top_button{
    position: relative;
    right: auto;
    top: auto;
  }
  .slick-dotted.slick-slider{
    margin: 0;
  }
}

.aoure_240626 .sec_tax{ 
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: calc(23* (100vw / 750 )) calc(25* (100vw / 750 ));
}

.aoure_240626 .sec_tax li a{ 
  text-decoration: underline;
  font-family: var(--lp-font-en);
  letter-spacing: 0.005em;
  font-size: calc(24* (100vw / 750 ));
}

.aoure_240626 .sec_text { 
  text-align: justify;
  font-size: calc(23* (100vw / 750 ));
  line-height: 1.8;
}

.aoure_240626 .sec_text.--wide {
  margin-top: calc(66* (100vw / 750 ));
}

.aoure_240626 .sec_text.--mini {
  width: calc(600* (100vw / 750 ));
  margin: auto;
  margin-top: calc(78* (100vw / 750 ));
}

.aoure_240626 .sec_head {
  font-family: var(--lp-font-en);
  font-weight:400;
  letter-spacing: 0.05em;
  font-size: calc(25* (100vw / 750 ));
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  top: calc(67* (100vw / 750 ));
  z-index: 2;
}
.aoure_240626 .sec .js-sec_slide_wrap{
  position: relative;
  width: calc(700* (100vw / 750 ));
  margin: auto;
}
.aoure_240626 .sec .sec_inner.--02{
  display: flex;
  flex-direction: column;
  gap: calc(123* (100vw / 750 ));
  margin-top: calc(94* (100vw / 750 ));
}

.aoure_240626 .sec .sec_inner.--02 .sec_img{
  width: calc(400* (100vw / 750 ));
  margin: auto;
}

@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec_tax li a{ 
    text-decoration: underline;
    font-family: var(--lp-font-en);
    letter-spacing: 0.005em;
    font-size: 1.2rem;
  }
  
  .aoure_240626 .sec_text {
    text-align: justify;
    font-size: 1.3rem;
    line-height: 2.1;
  }
  
  .aoure_240626 .sec_text.--wide {
    margin-top: 3.5rem;
  }
  
  .aoure_240626 .sec_text.--mini { 
    width: 30rem;
    margin: auto;
    margin-top: 3.5rem;
  }
  
  .aoure_240626 .sec_head { 
    font-family: var(--lp-font-en);
    font-weight:400;
    letter-spacing: 0.05em;
    font-size: 2.5rem;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    top:6.5rem;
    z-index: 2;
  }
  .aoure_240626 .sec .js-sec_slide_wrap{
    position: relative;
    width: 70rem;
    margin: auto;
  }
  .aoure_240626 .sec .sec_inner.--02{
    width: 70rem;
    margin: auto;
    justify-content: space-between;
    display: flex;
    flex-direction: row;
    margin-top: 6rem;
    gap: 0;
  }
  
  .aoure_240626 .sec .sec_inner.--02 .sec_img{
    width: 30rem;
    margin: auto;
  }
  
  .aoure_240626 .sec_text_wrap{
    display: flex;
    flex-direction: column-reverse;
    gap: 3.5rem;
  }
}

/*================================
  slider
=================================*/
.aoure_240626 .slick-dots{
  position: initial;
  width: fit-content;
  margin: auto;
  margin-top: calc(40* (100vw / 750 ));
}
.aoure_240626 .slick-dots li button:before{
  display: none;
}

.aoure_240626 .slick-dots li{
  width: calc(13* (100vw / 750 ));
  height: calc(13* (100vw / 750 ));
  background-color: #fff;
  margin: 0 calc(6* (100vw / 750 ));
}

.aoure_240626 .slick-dots li button{
  width: 100%;
  height: 100%;
  padding: 0;
}

.aoure_240626 .slick-dots li.slick-active{
  background: #808080;
  position: initial;
}

.aoure_240626 .slick-dots li button{
  display: none;
}


@media only screen and (min-width: 768px), print {
  .aoure_240626 .slick-dots{
    position: initial;
    width: fit-content;
    margin: auto;
    margin-top: 2rem;
  }
  
  .aoure_240626 .slick-dots li{
    width: 0.8rem;
    height: 0.8rem;
    background-color: #fff;
    margin: 0 0.4rem;
  }
}




/*================================
  mv
=================================*/
.aoure_240626 .mv{
  width: 100%;
}

.aoure_240626 .mv .mv_img{
  position: relative;
}

.aoure_240626 .mv .mv_head_wrap{
  display: contents;
}

.aoure_240626 .mv .mv_head{
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  width: calc(244* (100vw / 750 ));
  top: calc(250* (100vw / 750 ));
}

.aoure_240626 .mv .mv_text{
  text-align: center;
  letter-spacing: 0.05em;
  line-height: 2.1;
  font-size: calc(23* (100vw / 750 ));
}

.aoure_240626 .mv .mv_text.--01{
  position: absolute;
  transform: translateX(-50%);
  left: 50%;
  bottom: calc(57* (100vw / 750 ));
  width: 100%;
}

.aoure_240626 .mv .mv_text.--02{
  margin-top: calc(79* (100vw / 750 ));
}


@media only screen and (min-width: 768px), print {

  .aoure_240626 .mv{
    width: 100%;
  }

  .aoure_240626 .mv .mv_inner{
    position: relative;
  }

  .aoure_240626 .mv .mv_head_wrap{
    display: block;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    top: calc(276* (100vw / 1400 ));
  }
  
  .aoure_240626 .mv .mv_head{
    position: initial;
    transform: translateX(0);
    width: 17.8rem;
    margin: auto;
  }
  
  .aoure_240626 .mv .mv_text{
    text-align: center;
    letter-spacing: 0.1em;
    line-height: 2;
    font-size: 1.4rem;
    color: var(--lp-third-color);
    margin-top: calc(40* (100vw / 1400 ));
  }
  
  .aoure_240626 .mv .mv_text.--01{
    position: initial;
    transform: translateX(0);
    width: 100%;
  }
  
  .aoure_240626 .mv .mv_text.--02{
    margin-top: 0;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    bottom: calc(408* (100vw / 1400 ));
  }


}




/*================================
  sec01
=================================*/
.aoure_240626 .sec.--01 {
  margin-top: calc(149* (100vw / 750 ));
}

@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec.--01 {
    margin-top: 0;
  }


}


/*================================
  sec02
=================================*/
.aoure_240626 .sec.--02 {
  margin-top: calc(200* (100vw / 750 ));
}

@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec.--02 {
    margin-top: 20rem;
  }

}


/*================================
  sec03
=================================*/
.aoure_240626 .sec.--03 {
  margin-top: calc(200* (100vw / 750 ));
}


@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec.--03 {
    margin-top: 19rem;
  }
}

/*================================
  sec04
=================================*/
.aoure_240626 .sec.--04 {
  margin-top: calc(210* (100vw / 750 ));
}


@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec.--04 {
    margin-top: 20rem;
  }
}

/*================================
  sec05
=================================*/
.aoure_240626 .sec.--05 {
  margin-top: calc(200* (100vw / 750 ));
}


@media only screen and (min-width: 768px), print {
  .aoure_240626 .sec.--05 {
    margin-top: 20rem;
  }
}


.aoure_240626 .c-btn > a{
  display: flex;
  place-self: center;
  width: fit-content;
  margin-inline: auto;
  margin-top: 16rem;
  line-height: 1;
  letter-spacing: 0.037em;
  font-weight: 400;
  color: #fff;
  padding-bottom: 0.3rem;
  font-size: 1.8rem;
  border-bottom: 0.1rem solid #fff;
  font-family: var(--lp-font-en);
}

@media (max-width: 767px){
  .aoure_240626 .c-btn > a {
    padding-block: calc(3* 100vw / 750);
    font-size: calc(30* (100vw / 750 ));
    border-top: 0.1rem solid #fff;
    margin-top: calc(180* 100vw / 750);
  }
}


.aoure_240626 .js-fade {
  opacity: 0;
  transition: opacity 1s ease , transform 1s ease;
  transform: translateY(2rem);
}

.aoure_240626 .js-fade.fade_in {
  opacity: 1;
  transform: translateY(0);
}


.aoure_240626 .js-mv_fade {
  opacity: 0;
  transition: opacity 1s ease;
}


.aoure_240626 .js-mv_fade.fade_in {
  opacity: 1;
}

body.is-active .header .drawer-btn__border::before{
  background: #000;
}
body.is-active .header .drawer-btn__border::after{
  background: #000;
}

.js-mv_img img{
  scale: 1.1;
  transition: scale 1.5s ease ;
}

.js-mv_img.fade_in img{
  scale: 1;
}