@charset "utf-8";
.container {
    width: auto!important;
}
.container.container--contents-full>.row>.section:first-child {
    margin-top: 0px!important;
}
body{
    margin: 0;
    padding: 0;
}
.main {
    background-color: #ffffff!important;
}
#wrapper{
    min-width: 1000px;
    max-width: 1920px;
	margin: 0 auto -60px;
}
img{
    width: 100%;
    display: block;
    margin: 0 auto;
    /*vertical-align: bottom;*/
}
#wrapper a.cta_area .offer{
    width: 100%;
    background-image: url('../img/img01_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 5% 29%;
    box-sizing: border-box;
}
.offer{
    position: relative;
}

/*欠品案内用*/
#wrapper a.cta_area .offer_b{
    width: 100%;
    background-image: url('../img/img01b_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 5% 29%;
    box-sizing: border-box;
}
.offer_b{
    position: relative;
}
#wrapper .offer_b .b_btn{
    display: block;
    width: 18%;
    position: absolute;
    right: 32.7%;
    bottom: 11%;
}

#wrapper a.cta_area2 .offer_b{
    width: 100%;
    background-image: url('../img/img17.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    box-sizing: border-box;
}
a.cta_area2 .offer_b{
    position: relative;
    padding: 2% 0;
}
a.cta_area2 .offer_b img{
    width: 43%;
    padding: 1.5%;
}
#wrapper a.cta_area2 .offer_b .b_btn{
    display: block;
    width: 23%;
    position: absolute;
    right: 29.5%;
    bottom: 11%;
}
/*end*/


.img02{
    width: 100%;
    background-image: url('../img/img02_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.img02 img{
    width: 100%;
    padding: 50px 0 80px;
}
.img02.under img{
    background-position: bottom;
    padding-bottom: 0;
}
.img04{
    width: 100%;
    background-image: url('../img/img04_bg.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img04 img{
    width: 66%;
    padding: 0px 14% 0 2%;
}
.img05{
    width: 100%;
    background-image: url('../img/img05_bg.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img05 img {
    width: 58%;
    padding: 10% 0 7%;
}
.img06{
    position: relative;
}
.img06 img.mini{
    display: block;
    width: 50%;
    position: absolute;
    bottom: -5%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    margin: auto;
}
.img06 p.anno{
    display: block;
    background: none;
    font-size: 10px;
    text-align: right;
    width: 50%;
    margin: auto;
    position: absolute;
    color: #000;
    left: 25%;
    bottom: 9%;
}
.img06 p.anno:first-of-type{
    left: -9%;
}
.img06 p.anno:last-of-type{
    left: 8.5%;
}


.function{
    width: 100%;
    background-image: url('../img/img09.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    position: relative;
}
.function .flex{
    display: flex;
    width: 65%;
    position: absolute;
    left: 16%;
    top: 28.5%;
}
.function .flex video{
    width: 30%;
    margin: 2.6%;
}
.function video.cool{
    display: block;
    position: absolute;
    width: 21%;
    bottom: 29.8%;
    left: 41%;
}
.img08{
    width: 100%;
    background-image: url('../img/img08_bg.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img08 img{
    width: 34%;
    padding: 6% 0 1%;
}
.img14{
    width: 100%;
    background-image: url('../img/img14_24980.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img14 img{
    width: 38%;
    padding: 30.5% 0 7%;
}

.img14_s{
    width: 100%;
    background-image: url('../img/img14_s.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img14_s img{
    width: 38%;
    padding: 30.5% 0 7%;
}

.img14_209{
    width: 100%;
    background-image: url('../img/img14_209.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img14_209 img{
    width: 38%;
    padding: 30.5% 0 7%;
}

.img14_199{
    width: 100%;
    background-image: url('../img/img14_199.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
}
.img14_199 img{
    width: 38%;
    padding: 30.5% 0 7%;
}


.interview{
    position: relative;
    z-index: 99;
}
.interview video{
    /* position: absolute; */
    width: 50%;
    left: 50%;
    top: 55%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    margin: auto;
}
.parts{
    display: block;
    position: absolute;
    width: 10%;
    right: 21%;
    top: 96%;
}
#wrapper a.cta_area2 .offer{
    width: 100%;
    background-image: url('../img/img17.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    box-sizing: border-box;
    background-size: cover;
    padding: 5% 0;
}
a.cta_area2 .offer{
    position: relative;
    /* padding: 1% 0; */
}
a.cta_area2 .offer img{
    width: 52%;
    padding: 3.2%;
}
#wrapper a.cta_area2 .offer .b_btn{
    display: block;
    width: 22.5%;
    position: absolute;
    right: 24.5%;
    bottom: 13%;
}
.howto{
    position: relative;
}
.howto video{
    position: absolute;
    width: 53%;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    margin: auto;
}
#wrapper a.cta_area3 .offer{
    width: 100%;
    background-image: url('../img/img19.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center center;
    box-sizing: border-box;
    background-size: cover;
    padding: 1% 0 2%;
}
a.cta_area3 .offer{
    position: relative;
    padding: 2% 0;
}
a.cta_area3 .offer img {
    width: 43%;
    padding: 2% 0 10%;
}
#wrapper a.cta_area3 .offer .b_btn{
    display: block;
    width: 26%;
    position: absolute;
    right: 31%;
    bottom: 8%;
}
.contents {
  position: relative; /* 親要素にrelativeを設定 */
  width: 100%; /* コンテナの幅を100% */
  height: 500px; /* 高さを任意に設定 */
}

.bg-img {
  width: 100%; /* 画像をコンテナ全体に広げる */
  height: 100%; /* 画像の高さをコンテナに合わせる */
  object-fit: cover; /* 画像が切り取られないように調整 */
}

.movie02 video {
  position: absolute; /* 動画を絶対位置に配置 */
  width: 315px; 
  height: auto;
  top: 0px;
  left: 36px;
}

.movie03 video {
    position: absolute; /* 動画を絶対位置に配置 */
    width: 322px; 
    height: auto;
    top: 71px; /* 上から200pxの位置に配置 */
    left: 57.2%; /* 横位置をコンテナ幅の60%に設定 */
  }

.contents > div {
    margin: 10px 0; /* 各画像の間にスペースを作る */
}

/* .contents-img {
    max-width: 60%; 
    height: auto; 
} */

/*----------Q&A--------------------------------------------------------------------------------------------------------------------------------*/
.qa_area p{
    font-size: 3rem;
    margin-top: 80px;
    text-align: center;
    color: #6a3d16;
    font-weight: bold;
    font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
}
.qa,.qa p{
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;
}
.toggle_title {
    margin-top: 15px;
    position: relative;
    padding: 2.5% 7% 2.5% 12%;
    cursor: pointer;
    font-size: 1.2rem;
    text-align: left;
    line-height: 1.4;
    font-weight: bold;
    color: #6a3d16;
    max-height: 999999px;  /*Androidブラウザフォントバグ対策*/
    margin-left: 0%;
    background-color: #EFEBE2;
}
.toggle_btn {
    position: absolute;
    top: 50%;
    right: 2%;
    transform: translateY(-50%);
    display: block;
    width: 32px;
    height: 32px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border-radius: 50%;
}
.toggle_btn:before, .toggle_btn:after {
    display: block;
    content: '';
    background-color: #a07e44;
    position: absolute;
    width: 15px;
    height: 3px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.toggle_btn:before {
    width: 3px;
    height: 15px;
}
.toggle_title.selected .toggle_btn:before {
    content: normal;
}
.toggle_contents dd {
    display: none;
    margin-inline-start:0;
}
.toggle_contents:first-of-type dd {
    display: block;
}
.toggle_contents dd p{
    text-align: left;
    margin: auto ;
    font-size: 1rem;
    line-height: 1.3rem;
    box-sizing: border-box;
    border: 1px solid #d1d1d1;
    margin-top: 10px;
    position: relative;
    padding: 2%;
    font-size: 15px;
    line-height: 2rem!important;
}
.qa{
    padding: 3%;
    padding-top: 0;
    width: 63%;
    margin: 0 auto;
}
.toggle_title::before{
    content: "Q";
    font-weight: bold;
    background-color: #fff;
    border-radius: 53px;
    font-size: 1.2rem;
    padding: 1% 1.5%;
    position: absolute;
    top: 19%;
    left: 3%;
}

ol, ul {
    list-style: none;
}
.tab_area label{
    width: 30%;
    padding: 2% 0;
    font-size:17px;
}

.toggle_title {
    font-size: 16px!important;
}

.toggle_btn {
    width: 24px;
    height: 24px;
}

/*----------Q&A--------------------------------------------------------------------------------------------------------------------------------*/

.caution{
    padding: 2%;
    width: 55%;
    margin: 0 auto;
}
p.ttl{
    background-color: #777882;
    text-align: center;
    color: #fff;
    padding: 1%;
    font-size: 18px!important;
}
.box{
    border: 1px solid #777882;
    padding: 3%;
    color: #777882;
    font-size: 13px!important;
}
.grad-item{
    border: 1px solid #777882;
    padding: 3%;
    color: #777882;
    font-size: 13px!important;
}
.grad-item p{
    font-size: 13px!important;
}
.grad-wrap{
    position: relative;
}
.grad-btn {
    z-index: 2;
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    width: 123px;
    margin: auto;
    padding: 0.2em 0;
    border-radius: 2px;
    background: #6a3d16;
    color: #fff;
    font-size: 1.3rem;
    text-align: center;
    font-size: 13px!important;
    cursor: pointer;
    transition: .2s ease;
    box-shadow: 0 0 3px rgb(0 0 0 / 30%);
}
.grad-item {
    position: relative;
    overflow: hidden;
    height: 150px; /*隠した状態の高さ*/
}
.grad-item::before {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px; /*グラデーションで隠す高さ*/
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
    background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
    content: "";
}
.grad-trigger {
    display: none; /*チェックボックスは常に非表示*/
}
.grad-trigger:checked + .grad-btn {
    display: none; /*チェックされていたら、grad-btnを非表示にする*/
}
.grad-trigger:checked ~ .grad-item {
    height: auto; /*チェックされていたら、高さを戻す*/
}
.grad-trigger:checked ~ .grad-item::before {
    display: none; /*チェックされていたら、grad-itemのbeforeを非表示にする*/
}
.mt10{
    margin-top: 20px;
}

#wrapper .offer .b_btn{
    display: block;
    width: 26%;
    position: absolute;
    right: 31%;
    bottom: 17%;
}
#wrapper a.cta_area2 .offer .b_btn {
    display: block;
    width: 25.3%;
    position: absolute;
    right: 22.5%;
    bottom: 16%;
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media (max-width: 1400px) {
    #wrapper a.cta_area .offer{
        padding: 5% 23%;
    }
    #wrapper .offer .b_btn{
        width: 34%;
        right: 25.5%;
        bottom: 15%;
    }
    .img14 img {
        width: 45%;
        padding: 29% 0 3%;
    }
    a.cta_area2 .offer img {
        width: 55%;
        padding: 1%;
    }
    #wrapper a.cta_area2 .offer .b_btn {
        display: block;
        width: 23.5%;
        position: absolute;
        right: 25.5%;
        bottom: 14%;
        background-size: cover;
    }
    a.cta_area3 .offer img {
        width: 51%;
        padding: 2% 0 5.5%;
    }
    #wrapper a.cta_area3 .offer .b_btn {
        display: block;
        position: absolute;
        width: 34%;
        right: 25.5%;
        bottom: 7%;
    }
}

/* スライド*/

ul {
    padding: 0;
     margin: 0;
   }

   .insta02, .insta03{
     width: 160px;
     height: 180px;
     box-shadow: 1px 1px 6px #756dbd;
   }
   .insta02{margin-left: 30px;}
   .insta03{margin-right: 30px;}

   .insta02:nth-child(1) {
       background-image: url(../img/insta05.jpg);
       background-size: cover;
     }
     .insta02:nth-child(2) {
       background-image: url(../img/insta10.jpg);
       background-size: cover;
     }
     .insta02:nth-child(3) {
       background-image: url(../img/insta11.jpg);
       background-size: cover;
     }
     .insta02:nth-child(4) {
       background-image: url(../img/insta19.jpg);
       background-size: cover;
     }
     .insta02:nth-child(5) {
       background-image: url(../img/insta20.jpg);
       background-size: cover;
     }
     .insta02:nth-child(6) {
       background-image: url(../img/insta21.jpg);
       background-size: cover;
     }
     .insta02:nth-child(7) {
       background-image: url(../img/insta24.jpg);
       background-size: cover;
     }
     .insta02:nth-child(8) {
       background-image: url(../img/insta31.jpg);
       background-size: cover;
     }
      .insta02:nth-child(9) {
         background-image: url(../img/insta19.jpg);
         background-size: cover;
     }
     .insta02:nth-child(10) {
         background-image: url(../img/insta20.jpg);
         background-size: cover;
     }

     .insta03:nth-child(1) {
       background-image: url(../img/insta13.jpg);
       background-size: cover;
     }
     .insta03:nth-child(2) {
       background-image: url(../img/insta16.jpg);
       background-size: cover;
     }
     .insta03:nth-child(3) {
       background-image: url(../img/insta17.jpg);
       background-size: cover;
     }
     .insta03:nth-child(4) {
       background-image: url(../img/insta25.jpg);
       background-size: cover;
     }
     .insta03:nth-child(5) {
       background-image: url(../img/insta26.jpg);
       background-size: cover;
     }
     .insta03:nth-child(6) {
       background-image: url(../img/insta28.jpg);
       background-size: cover;
     }
     .insta03:nth-child(7) {
       background-image: url(../img/insta29.jpg);
       background-size: cover;
     }
     .insta03:nth-child(8) {
       background-image: url(../img/insta32.jpg);
       background-size: cover;
     }
     .insta03:nth-child(9) {
         background-image: url(../img/insta25.jpg);
         background-size: cover;
     }
     .insta03:nth-child(10) {
         background-image: url(../img/insta26.jpg);
         background-size: cover;
     }

/* スライドレールの枠 */

.wrap {
  overflow: hidden;
  display: flex;
  align-items: center;
  width: 75%;
  margin: auto;
}

.slideshow {
  display: flex;
  animation: loop-slide 35s infinite linear 0s both;
  margin-top: 10px;
  padding-bottom: 10px;
}
@-webkit-keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

/*--#16116 追加CSS--*/
.howtouse{
    width: 100%;
    background-image: url('../img/howtouse_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    box-sizing: border-box;
}
.howtouse img{
    padding: 90px 0px;
    max-width: 1000px;
}
@media (max-width: 1400px){
.howtouse img {
    padding: 90px 0px;
    max-width: 800px;
}
}

/* #16118 追記 */
.interview-voice {
    background-image: url(../img/interview-voice_bg.jpg);
    background-size: cover;
    min-height: 1060px;
    background-repeat: no-repeat;
    width: 100%;
    padding-top: 1px;
}

.interview video {
    width: 50%;
    left: 50%;
    top: 55%;
    transform: translateY(15%) translateX(50%);
    -webkit-transform: translateY(15%) translateX(50%);
    margin: auto;
}

.interview-ttl{
    width: 20%;
    margin: auto;
    position: relative;
    padding-top: 5%;
}

.user-voice{
    max-width: 80%;
    margin-top: 5%;
    padding-bottom: 10%;
}

.interview-detail{
    width: 50%;
    margin: auto;
    margin-top: 10%;
}

.interview-item{
    padding: 2%;
    color: #777882;
    font-size: 13px!important;
}
.interview-item p{
    font-size: 13px!important;
}
.interview-wrap{
    position: relative;
}
.interview-btn {
    z-index: 2;
    position: absolute;
    right: 0;
    bottom: 28px;
    left: 0;
    width: 180px;
    margin: auto;
    padding: 0.6em 0.4em;
    border-radius: 2px;
    background: #b98a4d;
    color: #fff;
    text-align: center;
    font-size: 18px!important;
    cursor: pointer;
    transition: .2s ease;
    box-shadow: 0 0 3px rgb(0 0 0 / 30%);
}
.interview-item {
    position: relative;
    overflow: hidden;
    height: 240px; /*隠した状態の高さ*/
}
.interview-item::before {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px; /*グラデーションで隠す高さ*/
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
    background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
    content: "";
}
.interview-trigger {
    display: none; /*チェックボックスは常に非表示*/
}
.interview-trigger:checked + .interview-btn {
    display: none; /*チェックされていたら、interview-btnを非表示にする*/
}
.interview-trigger:checked ~ .interview-item {
    height: auto; /*チェックされていたら、高さを戻す*/
}
.interview-trigger:checked ~ .interview-item::before{
    display: none; /*チェックされていたら、interview-itemのbeforeを非表示にする*/
}


/* 240112 */
#wrapper .cta_area .offer_b{
    width: 100%;
    background-image: url('../img/img01_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 5% 29%;
    box-sizing: border-box;
}
#wrapper .offer_b>a{
    display: block;
    width: 20%;
    position: absolute;
    right: 30.7%;
    bottom: 20%;
}

.function10 {
    background-image: url(../img/function_bg_pc.jpg);
    background-size: cover;
    padding: 4% 0;
}

.function10 img {
    width: 90%;
    max-width: 900px;
    margin: auto;
}

.timesave {
    background-image: url(../img/timesave_bg_pc.jpg);
    background-position: center;
    background-size: cover;
    padding: 0;
}
.timesave img {
    width: 90%;
    max-width: 1000px;
    margin: auto;
}

.ba10 {
    background-image: url(../img/ba_bg_pc.jpg);
    background-position: center;
    background-size: cover;
    padding: 3% 0 5%;
}
.ba10 img {
    width: 90%;
    max-width: 700px;
    margin: auto;
}
p.ttl {
    margin-bottom: 0;
}

/* #26561 追記 */
.interview3{
    position: relative;
}
.interview3 video{
    position: absolute;
    top: 36%;
    left: 0;
    right: 0;
    width: 50%;
    margin: 0 auto;
}

/* スライダー */

.scroll-infinity{
    width: 75%;
    margin: 0 auto;
}
@keyframes infinity-scroll-left {
    from {
      transform: translateX(0);
    }
      to {
      transform: translateX(-100%);
    }
    }
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left{
    animation: infinity-scroll-left 18s infinite linear 0.5s both;
}

.scroll-infinity__item>img {
  width: 90%;
  padding-top: 40px;
}

.scroll-infinity__item {
    width: calc(100vw / 8);
 }      
     
@keyframes infinity-scroll-right {
    from {
    transform: translateX(-100%);
          }
    to {
         transform: translateX(0%);
        }
}
.scroll-infinity__wrap2 {
   display: flex;
   overflow: hidden;
 }
.scroll-infinity__list2 {
 display: flex;
 list-style: none;
 padding: 0
}
.scroll-infinity__list--right{
  animation: infinity-scroll-right 15s infinite linear 0.5s both;
}

.scroll-infinity__item2>img {
 width: 90%;
 padding-top: 20px;
 margin-bottom: 46px;
 }

.scroll-infinity__item2 {
   width: calc(100vw / 8);
 }      


 .review_me {
    background-image: url(../img/review_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center bottom;
    padding: 50px 0 80px;
 }
 .review_me .ttl {
    width: 90%;
    max-width: 1000px;
    margin-bottom: 2%;
 }
 /* .slider {
    width: 80%;
    margin: auto;
 }
 .slide img {
    width: 94%;
    max-width: 440px;
 }

 .slick-dots li button:before {
    margin-top: 10px;
} */

.review_me p.anno{
    font-size: 16px;
    text-align: right;
    width: 80%;
    margin: 3% auto auto;
    color: #351811;
}


.carousel {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.rel {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.swiper02 {
    width: 90%;
  max-width: 1200px; /* 3スライド分の幅 */
  overflow: hidden;
  position: relative;
}
.contains {
    width: 90%;
  max-width: 1200px; /* 3スライド分の幅 */
  overflow: hidden;
  position: relative;
}

.slides {
    display: flex;
    transition: transform 0.5s ease-in-out;
    gap: 0 20px; /* 画像間の余白 */
  }

  .slide {
    flex: 0 0 calc((100% / 3) - 19px); /* 表示スライド数を考慮して計算 */
    box-sizing: border-box;
    text-align: center;
  }

  .slide img {
    width: 100%;
    height: auto;
    display: block; /* imgの間の余計な余白を削除 */
  }



.swiper-wrapper {
    display: flex;
    transition: transform 0.5s ease-in-out;
    gap: 0 20px; /* 画像間の余白 */
  }

  .swiper-slide {
    flex: 0 0 calc((100% / 3) - 19px); /* 表示スライド数を考慮して計算 */
    box-sizing: border-box;
    text-align: center;
  }

  .swiper-slide img {
    width: 100%;
    height: auto;
    display: block; /* imgの間の余計な余白を削除 */
  }



  .swiper-button-next02,.swiper-button-prev02 {
    background-color: #af8042; /* 背景色 */
    border: none; /* ボーダーなし */
    color: white; /* 文字色 */
    font-size: 20px; /* ボタンの文字サイズ */
    font-weight: bold; /* ボタンの文字を太く */
    cursor: pointer; /* カーソルをポインターに */
    width: 50px; /* ボタンの幅 */
    height: 50px; /* ボタンの高さ */
    border-radius: 50%; /* 丸い形状に */
    display: flex; /* 中央寄せのためにフレックスボックスを使用 */
    justify-content: center; /* 横方向中央寄せ */
    align-items: center; /* 縦方向中央寄せ */
    transition: all 0.3s ease; /* ホバー時のアニメーション */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* ボックスシャドウで立体感を追加 */
  }

    .scroll_button {
    background-color: #af8042; /* 背景色 */
    border: none; /* ボーダーなし */
    color: white; /* 文字色 */
    font-size: 20px; /* ボタンの文字サイズ */
    font-weight: bold; /* ボタンの文字を太く */
    cursor: pointer; /* カーソルをポインターに */
    width: 50px; /* ボタンの幅 */
    height: 50px; /* ボタンの高さ */
    border-radius: 50%; /* 丸い形状に */
    display: flex; /* 中央寄せのためにフレックスボックスを使用 */
    justify-content: center; /* 横方向中央寄せ */
    align-items: center; /* 縦方向中央寄せ */
    transition: all 0.3s ease; /* ホバー時のアニメーション */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* ボックスシャドウで立体感を追加 */
  }

 .swiper-button-next02:hover,.swiper-button-prev02:hover{
    background-color: #d9a75b; /* ホバー時の背景色 */
    color: #333; /* ホバー時の文字色 */
  }

  .scroll_button:hover {
    background-color: #d9a75b; /* ホバー時の背景色 */
    color: #333; /* ホバー時の文字色 */
  }

  .scroll_prev {
    position: absolute;
    top: 50%; /* 垂直中央に配置 */
    left: 2%;
    transform: translateY(-50%); /* 中央揃え */
    z-index: 999;
  }
  .swiper-button-prev02 {
    position: absolute;
    top: 50%; /* 垂直中央に配置 */
    left: 2%;
    transform: translateY(-50%); /* 中央揃え */
    z-index: 999;
  }
  .swiper-button-next02 {
    position: absolute;
    top: 50%; /* 垂直中央に配置 */
    right: 2%;
    transform: translateY(-50%); /* 中央揃え */
    z-index: 999;
  }
  .scroll_next {
    position: absolute;
    top: 50%; /* 垂直中央に配置 */
    right: 2%;
    transform: translateY(-50%); /* 中央揃え */
    z-index: 999;
  }
  @media (min-width: 1500px) {
  .swiper-button-prev02 {
        left: 10%;
      }
    .scroll_prev {
        left: 10%;
      }
    .scroll_next {
    right: 10%;
    }
  .swiper-button-next02 {
    right: 10%;
    }
  }

  /* 離脱ポップアップ */
  #backGuide {
    display: none;
    position: fixed !important;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(51, 51, 51, 0.8);
    z-index: 9999;
  }
  #popup {
    position: relative;
    display: block;
    width: 300px;
    height: 263px;
    margin: auto;
    top: 50%;
    transform: translateY(-50%);
  }
  #popup p {
    margin: 0;
  }
  #closeBtn {
    position: absolute;
    top: -10px;
    right: -10px;
    background: #fff;
    border: none;
    font-size: 24px;
    cursor: pointer;
  }
 

  .way3 {
    background-image: url(../img/contents_bg_pc_250619.jpg);
    height: auto;
    padding: 3% 0;
  }

  .way3 .rel {
    position: relative;
    width: 90%;
    max-width: 900px;
    margin: auto;
  }
  .way3 .movie02 {
    position: absolute;
    top: 67px;
    left: 5%;
  }
  .way3 .rel.two img {
    margin: 3% auto 3% 40px;
  }

/* こちらで追加 */
 .swiper-pagination-clickable .swiper-pagination-bullet{
    display: none!important;
  }