@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=League+Script&family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=League+Script&family=Noto+Sans+JP:wght@100..900&family=Zen+Kaku+Gothic+New&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap&text=1234567890');

/*基本設定*/
html{
    margin: 0 !important;
    font-size: 62.5%;
}
body{
    min-width: auto;
    color: #21201d;
    counter-reset: number-01 number-02 0;
}
.campaign_463_ver1_1{
    font-family: 'Noto Sans JP','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
    padding: 0 0 45px;
    background: #fbfbf5;
}
.campaign_463_ver1_1 h2{
    font-family: 'Noto Sans JP','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}

/*.fixed-nav{
    display: none;
}*/

.sp-500{display: block;}
.pc-500{display: none;}

.fixed-nav{
    display: none;
}
/*固定ナビ*/
.g-nav-menu-content figure img{
    display: none;
}
.navactive{
    /* 非表示にする */
    bottom: -100% !important;
    visibility: hidden;
}
.nav-active{
    /* 表示する */
    bottom: 0 !important;
    visibility: visible;
}

/*#content .container{
    padding: 0 15px;
}*/

.lp-right{
    display: none;
}

#lp {
  max-width: 500px;
  margin: 0px auto 0px;
}
@media screen and (max-width: 500px) {
  #lp {
    max-width: 100%;
  }
}
#lp.about{
  /*box-shadow: 0 0 8px #9e9493;*/
  background-color: #f5f3f2;
}
#gHeader {
    display: none;
}
.sp{display: block;}
.pc{display: none;}
@media only screen and (min-width:767px){
    .sp{display: none;}
    .pc{display: block;}
}
h2{
    font-size: 2rem;
    color: #21201d;
    text-align: center;
    margin-bottom: 0.8em;
    font-weight: 600;
    letter-spacing: 1px;
}
h3{
    font-size: 1.6rem;
    color: #21201d;
    font-weight: 600;
}
p{
    font-size: 1.4rem;
}

img{
    width: 100%;
}
span.note{
    display: block;
    font-size: 1.1rem;
    line-height: 1.8;
    line-break: strict;
    word-wrap: break-word;
}

/*全てのリンクボタン*/
a.link-btn{
    display: block;
    width: 95%;
    margin: 0.5em auto 0;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 500;
    text-align: center;
    height: 3.8em;
    line-height: 3.8em;
    letter-spacing: 1px;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #333;
    border-radius: 50px;
    position: relative;
    z-index: 1;
    transition: .5s;
    overflow: hidden;
}
a.link-btn::after{
    content: '';
    position: absolute;
    top: 50%;
    right: 10%;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg) translateY(-50%);
}
a.link-btn::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #333;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}
/*予約*/
a.reserve-cv{
    height: 2.5em;
    line-height: 2.5em;
    margin: 2em auto;
    background-color: #d86e6a;
    border-radius: 50px;
}
a.reserve-cv::before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: -100%;
    background-image: linear-gradient(130deg, rgb(235, 213, 243, 0) 25%, rgba(255, 255, 255, 0.5) 50%, rgba(229, 61, 81, 0) 75%);
    animation-name: shine;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
@keyframes shine {
    0% { left: -20%; }
    10% { left: 120%; }
    100% { left: 120%; }
}

/*お問い合わせ*/
a.contact-cv{
    background-color: #207d91;
}
/*もっと見る*/
a.more-btn{
    color: #21201d;
    border: 1px solid #21201d;
}
a.more-btn::after{
    border-color: #21201d;
}
/*LINE*/
a.line-btn{
    background-color: #00b34e;
}
/*キャンペーンcv*/
a.campaign-cv{
    background-color: #d86e6a;
}
a.campaign-cv:hover::after,
a.link-btn:hover{
    color: #fff;
}
a.link-btn:hover::before{
    transform-origin: 0% 50%;
    transform: scaleX(1);
}
/*チェック*/
a.check-btn{
    margin-bottom: 3em;
    background-color: #c4add2;
}
a.check-btn::after{
    top: 40%;
    transform: rotate(135deg);
}

/*Instagram*/
a.insta_btn{
    display: block;
    border-radius: 0;
    color: #FFF;
    position: relative;
    width: 90%;
    height: 3.5em;
    line-height: 3.5em;
    margin: 0em auto 0;
    text-align: center;
    background: -webkit-linear-gradient(135deg, #3c5a9b 0%, #d97194 70%) no-repeat;
    background: linear-gradient(135deg, #3c5a9b 0%, #d97194 70%) no-repeat;/*グラデーション①*/
    border-radius: 5px;
    overflow: hidden;
}
a.insta_btn .fa-instagram{
    font-size: 2rem;
    position: relative;
    top: 2px;
}
a.insta_btn span {
    display:inline-block;
    position: relative;
    transition: .5s;
    font-size: 1.5rem;
}

/*LINE*/
a.line_btn{
    display: block;
    border-radius: 0px;
    color: #FFF;
    position: relative;
    width: 90%;
    height: 3em;
    line-height: 3em;
    text-align: center;
    background-color: #06c755;
    border-radius: 5px;
    overflow: hidden;
}
a.line_btn .fa-line{
    position: relative;
    font-size: 2rem;
    top: 2px;
}
a.line_btn span {/*テキスト*/
    display:inline-block;
    position: relative;
    transition: .5s;
    font-size: 1.5rem;
}

section.head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 1px 5px rgb(0 0 0 / 10%);
}

.logo{
    width: 40%;
    margin: 20px 0;
    text-align: center;
}
.logo img{
    width: 80%;
}

section.head .right{
    display: flex;
    width: 60%;
    column-gap: 8px;
    justify-content: center;
}
section.head .right a.btn-flat{
    border: 1px solid #8593ae;
    width: 45%;
    text-align: center;
    font-size: 1.2rem;
    transition: .3s;
    line-height: 1.5;
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    vertical-align: middle;
    text-decoration: none;
    overflow: hidden;
    padding: 1rem 0rem;
    color: #fff;
    border-radius: 0;
}
section.head .right a.btn-flat:nth-child(1){
    background-color: #8593ae;
}
section.head .right a.btn-flat:nth-child(2){
    color: #8593ae;
}

a.btn-flat span {
    position: relative;
}

a.btn-flat:before {
    position: absolute;
    top: 0;
    left: 50px;
    width: 150%;
    height: 500%;
    content: '';
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-transform: translateX(-100%) translateY(-100%) rotate(135deg);
    transform: translateX(-100%) translateY(-100%) rotate(135deg);
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
    background: #fff;
}
a.btn-flat:nth-child(2):before {
    background: #8593ae;
}

@media (hover : hover){
    section.head .right a.btn-flat:nth-child(1):hover{
        color: #8593ae;
    }
    section.head .right a.btn-flat:nth-child(2):hover{
        color: #fff;
    }
    a.btn-flat:hover:before {
        -webkit-transform: translateX(-27%) translateY(-21%) rotate(135deg);
        transform: translateX(-27%) translateY(-21%) rotate(135deg);
    }
}

@media only screen and (min-width:768px){
    section.head .right a.btn-flat{
        padding: 1.5rem 0;
    }
    @media (hover : hover){
        a.btn-flat:before{
            -webkit-transform: translateX(-77%) translateY(-96%) rotate(135deg);
            transform: translateX(-77%) translateY(-96%) rotate(135deg);
        }
    }
}

/* フェードイン */
.js-fadeIn {
    opacity: 0; 
    transform: translateY(30px); 
    transition: opacity .8s, transform .8s; 
}
.js-fadeIn.is-inview {
    opacity: 1; 
    transform: translateY(0); 
    transition-delay: .5s; 
}
.js-fadeRight {
    opacity: 0; 
    transform: translateX(-30px); 
    transition: opacity .8s, transform .8s; 
}
.js-fadeLeft {
    opacity: 0; 
    transform: translateX(30px); 
    transition: opacity .8s, transform .8s; 
}
.js-fadeRight.is-inview,
.js-fadeLeft.is-inview {
    opacity: 1; 
    transform: translateX(0); 
    transition-delay: .5s; 
}
.js-fadeUp {
    opacity: 0; 
    transform: scale(1.2); 
    transition: opacity .8s, transform .8s; 
}
.js-fadeUp.is-inview {
    opacity: 1; 
    transform: scale(1); 
    transition-delay: .8s; 
}

/*アニメーション*/
.anime_wrap{
    position: relative;
    overflow: hidden;
}
.pattern::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #FFF;
    z-index: 2;
    transition: .5s;
}
.pattern.show::before{
    transform: translateX(100%);
}
.pattern img{
    opacity: 0;
    transition: .5s;
}
.pattern.show img{
    opacity: 1;
}
.diamond::before,
.diamond::after{
    overflow: visible;
    opacity: 0;
    transition: .5s;
    transform: translateX(0) scale(0);
}
.diamond.show::before,
.diamond.show::after{
    opacity: 1;
    transform: translateX(0) scale(1);
}

.m-inner{
    width: 95%;
    margin: 0 auto;
}
.m-title span{
    font-family: "Afacad Flux", sans-serif;
    display: block;
    text-align: center;
    font-size: 1.8rem;
}

section.m-discount_area{
    width: 92%;
    margin: 0 auto;
    padding: 2em 0 0;
}
.discount__wrap{
    width: 97%;
    margin-bottom: 1.5em;
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 10px;
    box-shadow: 7px 7px 0px 0px #ded7d7;
}
.discount__wrap h3{
    color: #fff;
    padding: 0.5em 1em;
    border-radius: 10px 10px 0 0;
    letter-spacing: 1px;
}
.discount__wrap:nth-child(1) h3{
    background-color: #c4add2;
}
.discount__wrap:nth-child(2) h3{
    background-color: #d4a0bb;
}
.discount__wrap:nth-child(3) h3{
    background-color: #d4a0bb;
}

.discount__wrap__box{
    padding: 1em 1em 1em;
}
.discount__wrap:nth-child(1) .discount__wrap__box{
    padding: 0.5em 1em 1em;
}
.discount__wrap__box p{
    font-weight: 600;
    letter-spacing: 1px;
}
.discount__wrap__box p .hl{
    font-size: 2rem;
    padding-top: 0.5em;
}
.discount__wrap__box span.note{
    margin-top: 0.5em;
}

section.m-plan_area{
    width: 92%;
    margin: 0 auto;
    padding: 3em 0 0;
}

.plan__wrap{
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 15px;
}
.plan__wrap:not(:last-child){
    margin-bottom: 1em;
}
.plan__wrap h3{
    width: 75%;
    padding: 0.5em 1em;
    margin-left: auto;
    text-align: center;
    font-size: 1.6rem;
    background-color: #a0b2d4;
    border-left: 1px solid #21201d;
    border-bottom: 1px solid #21201d;
    border-radius: 0 15px 0 20px;
}
.plan__wrap .yen{
    text-align: center;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 1em 0 0.5em;
}
.plan__wrap .yen .hl{
    font-size: 2.4rem;
}
.plan__wrap__box{
    width: 92%;
    margin: 0 auto 1em;
}
.discount__wrap__subbox{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 15px;
    height: 85px;
    padding: 0.5em;
    border-top: 1px solid #21201d;
    font-size: 1.4rem;
}
.discount__wrap__subbox > div:nth-child(1){
    width: 35%;
    position: relative;
}
.discount__wrap__subbox > div:nth-child(1)::before{
    content: '';
    position: absolute;
    width: 1px;
    height: 60px;
    top: 50%;
    right: 0%;
    transform: translateY(-50%);
    border-right: 1px solid #21201d;
}
.discount__wrap__subbox > div:nth-child(2){
    width: 65%;
}
.discount__wrap__subbox p{
    font-size: 1.4rem;
}

/*振袖×袴プラン*/
.m-furisodehakama_area h3{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.4rem;
    width: 80px;
    height: 80px;
    padding: 0;
    background-color: #c4add2;
    border: 1px solid #21201d;
}
.m-furisodehakama_area .plan__wrap:nth-child(1){
    padding: 1em;
}
.m-furisodehakama_area .box{
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
}
.m-furisodehakama_area .box:not(:last-child){
    margin-bottom: 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid #333;
}
.m-furisodehakama_area .yen{
    text-align: left;
    margin: 0em 0 0.5em;
}
.m-furisodehakama_area .plus{
    color: #c4add2;
    text-align: left;
    font-weight: 600;
}

.m-furisodehakama_area .plan__wrap__box {
    margin: 1em auto 1em;
}
.m-furisodehakama_area .plan__wrap:nth-child(2) .discount__wrap__subbox{
    padding: 0em 0.5em 0.5em 0.5em;
}
.m-furisodehakama_area .discount__wrap__subbox{
    height: 95px;
    border: unset;
}
.m-furisodehakama_area .discount__wrap__subbox > div:nth-child(1) {
    width: 18%;
}
.m-furisodehakama_area .discount__wrap__subbox > div:nth-child(1)::before{
    height: 80px;
}
.m-furisodehakama_area .discount__wrap__subbox > div:nth-child(2) {
    width: 82%;
}

.point_wrap{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95%;
    margin: 2em auto 0;
}
.point_wrap__subbox{
    width: 140px;
    height: 140px;
    margin-bottom: 0.5em;
    padding: 0.6em;
    background-color: #fff;
    border: 1px solid #333;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.point_wrap__box:nth-child(2){
    width: 70%;
    max-width: 250px;
}
.point_wrap__box h3{
    width: 60px;
    margin-bottom: 0.1em;
    text-align: center;
    line-height: 1;
}
.point_wrap__box p{
    text-align: center;
    font-size: 1.3rem;
}
.point_wrap__box p .hl{
    font-weight: 600;
}


section.m-benefits_area{
    width: 92%;
    margin: 0 auto;
    padding: 3em 0 0;
}
.benefits__wrap{
    text-align: center;
    margin-bottom: 2em;
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 20px;
    position: relative;
    width: 290px;
    height: 180px;
}
.benefits__wrap::before{
    counter-increment: number-01 1;
    content: counter(number-01,decimal-leading-zero) " ";
    font-family: "Afacad Flux", sans-serif;
    position: absolute;
    top: -0.9em;
    left: 0.2em;
    font-size: 3rem;
}
.benefits__wrap:nth-child(2){
    margin: 0 auto 2em;
}
.benefits__wrap:nth-child(3){
    margin: 0 0 0 auto;
}
.benefits__wrap__box{
    padding: 0em 1em;
    position: absolute;
    width: 100%;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
}
.benefits__wrap p{
    color: #c4add2;
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 0.3em;
}
.benefits__wrap h3{
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 1px;
    margin-bottom: 0.3em;
}
.benefits__wrap h3 span.hl{
    padding: 0.2em 0.1em;
    background-color: #c4a7d5;
}

section.m-use_area,
section.m-period_area{
    width: 92%;
    margin: 0 auto;
    padding: 3em 0 0;
    top: 0;
    left: 0;
}
.period__wrap,
.use__wrap{
    background-color: #fff;
    border: 1px solid #21201d;
    border-right: unset;
    text-align: center;
    position: relative;
    width: 300px;
    height: 35vh;
}
.period__wrap:last-child,
.use__wrap:last-child{
    border-right: 1px solid #21201d;
}
.period__wrap__box,
.use__wrap__box{
    padding: 0em 1em;
    position: absolute;
    width: 100%;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
}
.period__wrap__box > div:not(:last-child),
.use__wrap__box > div:not(:last-child){
    margin-bottom: 0.5em;
}
.period__wrap__box h3,
.use__wrap__box h3{
    letter-spacing: 1px;
}
.period__wrap__box p,
.use__wrap__box p{
    display: inline-block;
    text-align: left;
}
.period__wrap__box a.reserve-cv,
.use__wrap__box a.reserve-cv{
    width: 180px;
    margin: 0 auto;
}
.use__wrap__box .point{
    width: 180px;
    height: 2.5em;
    line-height: 2.5em;
    text-align: center;
    background-color: #acbddd;
    border: 1px solid #21201d;
    border-radius: 50px;
}

.period__wrap__box h3{
    color: #d38cb1;
    font-size: 1.8rem;

}
.period__wrap:nth-child(1) .period__wrap__box h3,
.period__wrap:nth-child(3) .period__wrap__box h3 {
    font-weight: normal;
    color: #21201d;
}
.period__wrap__box h3 .hl{
    display: block;
    font-weight: 600;
    color: #d38cb1;
}
.period__wrap:nth-child(3) .period__wrap__box h3 .hl{
    display: inline-block;
}
.period__wrap__box span.note{
    text-align: left;
}

/*gsap*/
.period__encircle,
.use__encircle{
    overflow-y: scroll;
}
.m-use_area .slide__wrapper{
    display: flex;
    overflow-y: scroll;
    width: 1300px;
}
.m-period_area .slide__wrapper{
    display: flex;
    overflow-y: scroll;
    width: 1000px;
}
.period__wrap,
.use__wrap{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 330px;
}

section.m-support_area{
    width: 92%;
    margin: 0 auto;
    padding: 3em 0 0;
}
.support-img{
    display: block;
    width: 90%;
    margin: 0 auto;
}
.support__wrap-bad{
    position: relative;
    padding-top: 1em;
}
.support__wrap-bad .item{
    position: absolute;
}
.support__wrap-bad .item:nth-child(2){
    top: 0em;
    right: 1em;
}
.support__wrap-bad .item:nth-child(3){
    top: 4em;
    left: 0;
}
.support__wrap-bad .item:nth-child(4){
    top: 10em;
    right: 0;
}
.support__wrap-bad .item p{
    padding: 0.5em 1em;
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 15px;
    font-size: 1.4rem;
}
.support__wrap-good{
    padding-top: 4.5em;
    text-align: center;
    position: relative;
}
.support__wrap-good::before{
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    top: 2em;
    left: 50%;
    transform: translateX(-50%);
    border-top: 10px solid #acbddd;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
}
.support__wrap-good::after{
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    top: 2.8em;
    left: 50%;
    transform: translateX(-50%);
    border-top: 10px solid #acbddd;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
}
.support__wrap-good h3{
    font-size: 1.8rem;
    line-height: 1.8;
    margin-bottom: 0.3em;
}
.support__wrap-good__box{
    margin: 2em 0 2em;
}
.support__wrap-good__subbox{
    display: flex;
    justify-content: space-between;
    gap: 20px;
    width: 220px;
    margin: 0em auto 0.5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #21201d;
    font-weight: 600;
}
.support__wrap-good__subbox h4{
    font-size: 1.8rem;
}
.support__wrap-good__subbox .yen .hl{
    font-size: 1.8rem;
    letter-spacing: 1px;
}
.support__wrap-good__box .note{
    text-align: left;
    margin-top: 3em;
}
.m-support_area .cv-btn.reserve{
    position: relative;
    margin-top: 3em;
}
.m-support_area .cv-btn.reserve::before{
    position: absolute;
    content: 'ご試着だけでもOK!';
    width: 180px;
    height: 35px;
    line-height: 35px;
    top: -1.8em;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 50px;

    z-index: 2;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 600;
    letter-spacing: 1px;
}
.m-support_area .cv-btn.reserve a.link-btn {
    width: 250px;
    height: 4em;
    line-height: 4em;
    font-weight: 600;
}

.m-support_area .cv-btn.line{
    position: relative;
    margin-top: 3em;
}
.m-support_area .cv-btn.line::before{
    position: absolute;
    content: 'まずは相談したい!';
    width: 180px;
    height: 35px;
    line-height: 35px;
    top: -1.8em;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    border: 1px solid #21201d;
    border-radius: 50px;

    z-index: 2;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 600;
    letter-spacing: 1px;
}
.m-support_area .cv-btn.line a.link-btn {
    width: 250px;
    height: 4em;
    line-height: 4em;
    font-weight: 600;
}

section.m-collection_area{
    width: 96%;
    margin: 0 auto;
    padding: 3em 0 0;
}
/* 複数画像切り替え */
.slider-container {
	position: relative;
    width: 80%;
    height: 500px;
    margin: 0 auto 1em;
}
.slideimg {
	position: absolute;
	width: 100%;
	height: 100%;
    top: 0;
    left: 50%;
	opacity: 0;
	background-size: cover;/* 画像をスライド全体にカバー */
	animation: slideAnime 15s infinite; /* 15秒で1サイクル */
}
.slideimg:nth-child(odd) {
    transform: translateX(-50%);
}
.slideimg:nth-child(even) {
    transform: translateX(-50%);
}
@keyframes slideAnime {
	0%, 30%, 100% { opacity: 0; }/* スライドの非表示タイミング */
	10%, 20% { opacity: 1; }/* スライドの表示タイミング */
}
.slideimg::before{
    counter-increment: number-02 1;
    content: " No." counter(number-02) ""; 
    font-family: "League Script", cursive;
    font-size: 2.4rem;
}
/* 各スライドのアニメーションタイミングを均等にずらす */
.slideimg:nth-of-type(1){
	background-image: url('https://furisode-luvri.jp/test/wp/wp-content/themes/kalon-child-luvri/images/shop/pages/hakama/TR2O-002_HW95-747.jpg');
	animation-delay: 0s;
}
.slideimg:nth-of-type(2) {
	background-image: url('https://furisode-luvri.jp/test/wp/wp-content/themes/kalon-child-luvri/images/shop/pages/hakama/2O-2307_HW99-730.jpg');
	animation-delay: 3s;
}
.slideimg:nth-of-type(3) {
	background-image: url('https://furisode-luvri.jp/test/wp/wp-content/themes/kalon-child-luvri/images/shop/pages/hakama/2O-2403_HW95-2301.jpg');
	animation-delay: 6s;
}
.slideimg:nth-of-type(4) {
	background-image: url('https://furisode-luvri.jp/test/wp/wp-content/themes/kalon-child-luvri/images/shop/pages/hakama/2O-2407_HW87-2402.jpg');
	animation-delay: 9s;
}
.slideimg:nth-of-type(5) {
	background-image: url('https://furisode-luvri.jp/test/wp/wp-content/themes/kalon-child-luvri/images/shop/pages/hakama/2O-2406_HW87-2401.jpg');
	animation-delay: 12s;
}

/*アコーディオン*/
.accordion {
    width: 100%;
    margin: 0 auto 1em;
}
.accordion summary {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    padding: 0.5em 0em;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 1px solid #21201d;
}
.accordion summary::-webkit-details-marker {
    display: none;
}
.accordion summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 1px solid #21201d;
    border-right: 1px solid #21201d;
    content: '';
    transition: transform .3s;
}
.accordion[open] summary::after {
    transform: rotate(225deg);
}
.accordion p {
    width: 75%;
    transform: translateY(-10px);
    opacity: 0;
    margin: 0 auto;
    padding: 1em 2em 1em;
    color: #333333;
    transition: transform .5s, opacity .5s;
}
.accordion[open] p {
    transform: none;
    opacity: 1;
}

/*詳細*/
section.m-exp_area{
    width: 92%;
    margin: 0 auto;
    padding: 1em 0 2em;
}
.exp__encircle{
    padding: 2em 1em;
    background: repeating-linear-gradient(-45deg, #e4e6ec, #e4e6ec 5px, #f5f3f2 5px, #f5f3f2 10px);
    border-radius: 10px;
}


.parent {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(3, 1fr);
    align-items: center;
    gap: 8px;
    font-size: 1.4rem;
}
.parent div:nth-child(1) {
    grid-column: span 2 / span 2;
}
.parent div:nth-child(2) {
    grid-column: span 3 / span 3;
    grid-column-start: 3;
}
.parent div:nth-child(3) {
    grid-column: span 2 / span 2;
    grid-row-start: 2;
}
.parent div:nth-child(4) {
    grid-column: span 3 / span 3;
    grid-column-start: 3;
    grid-row-start: 2;
}
.parent div:nth-child(5) {
    grid-column: span 2 / span 2;
    grid-row-start: 3;
}
.parent div:nth-child(6) {
    grid-column: span 3 / span 3;
    grid-column-start: 3;
    grid-row-start: 3;
}

/*理由*/
#Box8.sec_box{
    padding: 2em 0 3em;
}
.point{
    background-color: #A1B2AA;
}
.point img {
    width: 90%;
    margin: 0 auto;
    display: block;
}

.m-reason_area{
    padding: 3em 0 2em;
    background-color: #efe8f4;
}
.m-reason_area .m-title p{
    display: block;
    width: 100%;
    max-width: 160px;
    text-align: center;
    letter-spacing: 1px;
    font-size: 1.8rem;
    font-weight: 600;
    margin: 0em auto 0em;
}

.reason_box{
    margin-bottom: 1em;
    padding: 2em 1em;
    background-color: #fff;
    border-radius: 5px;
}
.reason_box .subbox:nth-child(2) img{
    width: 60px;
    margin: 1em 0 0.5em;
}

.reason_box:nth-child(2) {
    padding: 2em 1em 0;
}
.reason_box:nth-child(2) .subbox:nth-child(1) img{
    width: 60px;
    margin: 1em 0 0.5em;
}
.reason_box:nth-child(2) .subbox:nth-child(2) img{
    width: 90%;
    margin: 1em auto 0;
    display: block;
}

.reason_box:nth-child(3){
    display: flex;
    align-items: center;
    padding: 1em;
}
.reason_box:nth-child(3) .subbox:nth-child(1){
    width: 50%;
}
.reason_box:nth-child(3) .subbox:nth-child(1) img{
    width: 60px;
    margin: 1em 0 0.5em;
}
.reason_box:nth-child(3) .subbox:nth-child(2) {
    width: 50%;
}
.reason_box:nth-child(3) .subbox:nth-child(2) img{
    width: 100%;
    margin: 0;
}

.reason_box:nth-child(5) .subbox img{
    width: 60px;
    margin: 1em 0 0.5em;
}

.reason_box > div h3{
    text-align: left;
    font-size: 1.8rem;
    letter-spacing: 1px;
    margin-bottom: 1%;
}

.reason_box > div h3 span{
    color: #e8778c;
}
.reason_box > div p{
    margin-top: 1em;
    line-height: 1.8;
}

/*店舗一覧*/
.m-shoplist_area{
    padding: 2em 0 3em;
}
/*タブ切り替え全体のスタイル*/
.tabs {
    width: calc(100% - 20px);
    margin: 20px auto 0;
}
.tabs .tab_area{
    width: 60%;
    margin: 0px auto 0;
    display: flex;
    justify-content: center;
    gap: 10px;
}
/*タブのスタイル*/
.tab_item {
    position: relative;
    width: calc(100% / 2);
    height: 40px;
    line-height: 40px;
    border: 1px solid #3c3938;
    font-size: 1.4rem;
    text-align: center;
    display: block;
    float: left;
    letter-spacing: 1px;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
    display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
    display: none;
    padding: 25px 0 0;
    clear: both;
    overflow: hidden;
    margin: 0 auto;
}
.tab_content .studio{
    display: flex;
    flex-direction: column;
    column-gap: 5px;
    width: 100%;
    margin: 0 auto 2em;
}
.tab_content .studio h3{
    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-align: left;
    margin-top: 3%;
}
.tab_content .studio .exp__box{
    font-size: 1.3rem;
    color: #575757;
    letter-spacing: 1px;
}
.tab_content .table {
    display: table;
    border-collapse: collapse;
    margin: 0;
}
.tab_content .table .tr{
    display: table-row;
}
.tab_content .table .th{
    display: table-cell;
    width: 20%;
}
.tab_content .table .td{
    display: table-cell;
    padding: 1px 0 0 0;
    border: unset;
}

.tab_content .studio .more{
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 600;
    margin-top: 1em;
    padding-bottom: 5px;
    border-bottom: 1px dashed #3c3938;
}

.map{
    width: 100%;
}
.map iframe{
    width: 100%;
    height: 250px;
}
/*選択されているタブのコンテンツのみを表示*/
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content{
    display: block;
}
/*選択されているタブのスタイルを変える*/
#tab1:checked ~ .tab_area .tab1,
#tab2:checked ~ .tab_area .tab2{
    color: #fff;
    background: #3c3938;
}


/*問い合わせ*/
.m-contact_area{
    padding: 2em 0;
    text-align: center;
}
.m-contact_area .m-contact__bg{
    width: calc(100% - 20px);
    margin: 0 auto;
}

.m-contact_area p.con-intro{
    text-align: center;
    line-height: 1.5;
    margin: 1em 0;
}
.m-contact_area .m-con_num{
    position: relative;
    background-color: #fff9f9;
}
.m-contact_area .m-con_num_head{
    font-size: 1.5rem;
    padding: 5px;
    color: #fff;
    background-color: #2e5375;
}
.m-contact_area .con_num_tel{
    padding: 20px 10px;
    background-color: #fff;
}
.m-contact_area .con_num_tel a.con-tel{
    color: #2e5375;
    font-size: 2.2rem;
    font-weight: bold;
    position: relative;
    text-decoration: none;
}
.m-contact_area .con_num_tel a.con-tel::before{
    position: absolute;
    content: '\f095';
    font-family: 'Font Awesome 6 Free';
    font-weight: 600;
    display: inline-block;
    left: -16%;
    top: calc(50% + 0px);
    transform: translateY(-50%);
    font-size: 17px;
}
.m-contact_area .con_num_tel .con_num_timearea{
    margin-top: 10px;
}
.m-contact_area .con_num_tel .con_num_timearea .con_num_time{
    background-color: #f5f3f2;
    display: inline-block;
    padding: 5px 10px;
    margin-right: 10px;
    font-size: 1.2rem;
}

.m-contact_area .con-insta{
    margin-top: 1.3em;
}
.m-contact_area .con-insta_area{
    width: 100%;
    margin: 0 auto;
}
.m-contact_area .con-insta_head{
    font-size: 1.4rem;
    margin-bottom: 5px;
}
.m-contact_area .con-insta_head span{
    display: inline-block;
    background: -webkit-linear-gradient(135deg, #3c5a9b 0%, #d97194 70%) no-repeat;
    background: linear-gradient(135deg, #3c5a9b 0%, #d97194 70%) no-repeat;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 1.4rem;
    font-weight: bold;
}
.m-contact_area .con-insta .con-insta_area .insta_btn{
    display: inline-block;
    width: 100%;
}
.m-contact_area .con-insta .con-insta_area .insta_btn .fa-instagram{
    font-size: 2rem;
    position: relative;
    top: 2px;
}
.m-contact_area .insta_btn span {
    display:inline-block;
    position: relative;
    transition: .5s;
    font-size: 1.5rem;
}
.m-contact_area .con-line{
    margin-top: 1em;
}
.m-contact_area .con-line_head{
    font-size: 1.4rem;
    margin-bottom: 5px;
}
.m-contact_area .con-line_head span{
    display: inline-block;
    color: #06c755;
    font-size: 1.4rem;
    font-weight: bold;
}
.m-contact_area .con-line_area{
    width: 100%;
    margin: 0 auto;
}
.m-contact_area .con-line_area .line_btn{
    color: #FFF;
    border-radius: 0px;
    position: relative;
    display: inline-block;
    width: 100%;
    height: 3em;
    line-height: 3em;
    text-align: center;
    background-color: #06c755;
    border-radius: 5px;
    overflow: hidden;
}
.m-contact_area .con-line_area .line_btn .fa-line{
    position: relative;
    font-size: 2rem;
    top: 2px;
}
.m-contact_area .line_btn span {/*テキスト*/
    display:inline-block;
    position: relative;
    transition: .5s;
    font-size: 1.5rem;
}

.copyright{
    font-size: 1rem;
    padding: 3em 0;
    text-align: center;
}

#g-nav-footer,
#g-nav{
    display: none;
}


/*固定*/
:root{
    --maincolor : #2e5375;
    --subcolor : #3c3938;
    --bgcolor : #2e5375;
}
.fixed-bottom{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0%;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    z-index: 999;
    transition: .5s;
    font-size: 1.2rem;

    /*opacity: 1;*/
    visibility: visible;
}
.fixed-bottom .nav-wrap{
    display: flex;
    position: relative;
    z-index: 999;
}
.fixed-bottom .nav-wrap .nav__box{
    width: 100%;
    background-color: #fff;
    border-top: 1px solid var(--maincolor);
    border-right: 1px solid var(--maincolor);
}
.fixed-bottom .nav-wrap .nav__box::after{
    content: none;
}
.fixed-bottom .nav-wrap .nav__box:last-child{
    border-right: none;
    width: 50%;
}
.fixed-bottom a{
    display: block;
    width: 100%;
    color: var(--maincolor);
    background-color: #fff;
}

.fixed-bottom .nav-wrap .nav__box:nth-child(3) a{
    color: #fff;
    background-color: var(--maincolor);
}
.fixed-bottom .nav-wrap .nav__box:nth-child(4){
    width: 45%;
}

.fixed-bottom #navArea{
    width: 100%;
    background-color: var(--maincolor);
}
.fixed-bottom .page-top_button{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    background: #fff;
    transition: .3s;
    z-index: 1;
}
.fixed-bottom .dli-arrow-up {
    display: inline-block;
    vertical-align: middle;
    color: var(--maincolor);
    line-height: 1;
    position: relative;
    width: 0.1em;
    height: 1em;
    background: currentColor;
}

.fixed-bottom .dli-arrow-up::before {
    content: '';
    width: 0.65em;
    height: 0.65em;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    transform: rotate(-45deg);
    transform-origin: top right;
    position: absolute;
    top: -0.05em;
    right: 50%;
    box-sizing: border-box;
}

.fixed-bottom .is-active{
    /* 非表示 */
    bottom: -100%;
    visibility: hidden;
}

.fixed-bottom .openBtn{
	position: relative;
	width: 100%;
    height: 100%;
	cursor: pointer;
	background:#fff;
}
/*ボタン内側*/
.fixed-bottom .openBtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 13px;
    height: 1px;
	background-color: var(--maincolor);
}
.fixed-bottom .openBtn span:nth-of-type(1) {
	top: 19px;	
    width: 50%;
}
.fixed-bottom .openBtn span:nth-of-type(2) {
	top: 27px;
    width:30%;
}
.fixed-bottom .openBtn.active span:nth-of-type(1) {
    top: 20px;
    left: 16px;
    transform: translateY(6px) rotate(-45deg);
    width: 35%;
}
.fixed-bottom .openBtn.active span:nth-of-type(2) {
    top: 32px;
    left: 16px;
    transform: translateY(-6px) rotate(45deg);
    width: 35%;
}

#navArea.cp-nav .accordion .main__box{
    position: relative;
    cursor: pointer;
    padding: 20px 50% 20px 20px;
    transition: all .5s ease;
    /*background-color: #fff5f3;*/
    /*border-radius: 5px;*/
    font-size: 1.4rem;
    /*border-bottom: none;*/
    border-bottom: 1px solid var(--maincolor);
    color: var(--maincolor);
}
#navArea.cp-nav .accordion .main__box::before,
#navArea.cp-nav .accordion .main__box::after{
    position: absolute;
    content: '';
    width: 12px;
    height: 1px;
    background-color: var(--maincolor);
    transition: .5s;
    color: var(--maincolor);
}
#navArea.cp-nav .accordion .main__box::before{
    top: 50%;
    right: 15px;
    transform: rotate(0deg);
}
#navArea.cp-nav .accordion .main__box::after{
    top: 50%;
    right: 15px;
    transform: rotate(90deg);
}
#navArea.cp-nav .accordion .main__box.close::before,
#navArea.cp-nav .accordion .main__box.close::after{
    transform: rotate(0deg);
}
@media (hover : hover){
    #navArea.cp-nav .accordion .main__box:hover{
        color: #fff;
        background-color: var(--maincolor);
    }
    #navArea.cp-nav .accordion .main__box:hover::before, 
    #navArea.cp-nav .accordion .main__box:hover::after{
        color: #fff;
        background-color: #fff;
    }
}
#navArea.cp-nav .accordion .sub__box{
    display: none;
    padding: 8px 0 0% 7%;
    background-color: unset;
}
#navArea.cp-nav .nav__wrap .accordion .sub__box a{
    margin-bottom: 8px;
    /*background-color: #f8f4f3;*/
}
#navArea.cp-nav .accordion .sub__box a:last-child{
    margin-bottom: 0px;
}


#navArea.cp-nav .nav__wrap {
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    right: -100%;
    width: 100%;
    background: #ffffff;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transition: all .5s;
    z-index: 3;
    opacity: 0;
}
#navArea.cp-nav .nav__wrap.open  {
    right: 0;
    opacity: 1;
}
#navArea.cp-nav .nav__wrap .nav-inner {
    padding: 25px 25px 50px 25px;
}
#navArea.cp-nav .nav__wrap .nav-inner ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#navArea.cp-nav .nav__wrap .nav-inner ul li {
    position: relative;
    margin: 8px 0;
}
#navArea.cp-nav .nav__wrap .nav-inner ul li a {
    display: block;
    color: var(--maincolor);
    text-decoration: none;
    transition-duration: 0.2s;
    /*background-color: #fff5f3;*/
    /*border-radius: 5px;*/
    text-align: left;
    padding: 20px 20px 20px 20px;
    font-size: 1.4rem;
    /*border-bottom: none;*/
    border-bottom: 1px solid #8593ae;
}


.fixed-bottom .toggle_btn {
    position: relative;
    display: block;
    width: 100%;
    height: 50px;
    transition: all .5s;
    cursor: pointer;
    z-index: 999;
    left: 0%;
}
.fixed-bottom .toggle_btn span {
    display: block;
    position: absolute;
    width: 25px;
    height: 1px;
    background-color: #fff;
    border-radius: 4px;
    transition: all .5s;
}
.fixed-bottom .toggle_btn span:nth-child(1) {
    top: 20px;
    left: 13px;
}
.fixed-bottom .toggle_btn span:nth-child(2) {
    top: 28px;
    left: 13px;
    width: 20px;
}
.fixed-bottom .toggle_btn.open  span:nth-child(1) {
    top: 14px;
    -webkit-transform: translateY(10px) rotate(-315deg);
    transform: translateY(10px) rotate(-315deg);
}
.fixed-bottom .toggle_btn.open  span:nth-child(2) {
    width: 25px;
    top: 33px;
    -webkit-transform: translateY(-10px) rotate(315deg);
    transform: translateY(-10px) rotate(315deg);
}
#navArea.cp-nav #mask {
    display: none;
    transition: all .5s;
}
#navArea.cp-nav #mask.open  {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .8;
    z-index: 2;
    cursor: pointer;
}

/*ボタン*/
#navArea.cp-nav .nav__wrap .nav-inner .nav_btn{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    margin: 1em 0;
}
#navArea.cp-nav .nav__wrap .nav-inner .nav_btn a{
    text-align: center;
    color: var(--maincolor);
    width: calc(100% / 2 - 5px);
    padding: 10px 0;
    border-radius: 5px;
    background-color: #fff;
    font-size: 1.2rem;
    border: 1px solid var(--maincolor);
}

#navArea.cp-nav .nav__wrap .nav-inner .nav_btn a:nth-child(1){
    color: #fff;
    background-color: var(--maincolor);
}

@media only screen and (min-width:412px){
    .logo img{
        width: 70%;
    }
    .toggle_btn span:nth-child(1),
    .toggle_btn span:nth-child(2){
        left: 15px;
    }

    .m-furisodehakama_area .discount__wrap__subbox > div:nth-child(1) {
        width: 26%;
    }
}
@media only screen and (min-width:430px){
    h3 {
        font-size: 1.8rem;
    }
    .discount__wrap__box p .hl {
        font-size: 2.2rem;
    }

    .plan__wrap h3 {
        font-size: 1.8rem;
    }
    .plan__wrap .yen {
        font-size: 1.8rem;
    }
    .plan__wrap .yen .hl {
        font-size: 2.8rem;
    }
    
    .m-shoplist_area h2::before,
    .m-contact_area h2::before{
        top: -1.2em;
    }

    .m-furisodehakama_area h3{
        font-size: 1.6rem;
    }
    .m-furisodehakama_area .box{
        gap: 15px;
    }
    .point_wrap {
        gap: 10px;
    }
}
@media only screen and (min-width:500px){
    .sp-500{display: none;}
    .pc-500{display: block;}

    .slideimg {
        width: 75%;
        height: 100%;
        margin: 0 auto;
    }

    .m-title span {
        font-size: 1.6rem;
    }
    .news_area__box h2 {
        width: 32%;
    }
    .news_area__box p {
        width: 68%;
    }

}

@media only screen and (min-width:600px){
    a.link-btn {
        width: 300px;
    }

    .support__wrap-bad .item:nth-child(2) {
        top: 1em;
        right: 2em;
    }
    .support__wrap-bad .item:nth-child(3) {
        top: 8em;
    }
    .support__wrap-bad .item:nth-child(4) {
        top: 13em;
    }

    .m-support_area .cv-btn.reserve a.link-btn {
        width: 300px;
    }
    .m-support_area .cv-btn.line a.link-btn {
        width: 300px;
    }
}

@media only screen and (min-width:768px){
    .logo img{
        width: 50%;
    }

    section.head .right .btn{
        font-size: 1.4rem;
    }
    section.head .right .btn a {
        padding: 12px 0;
    }
    section.head .right a.btn-flat{
        font-size: 1.4rem;
    }

    .m-shoplist_area h2::before,
    .m-contact_area h2::before{
        top: -1.1em;
    }

    a.link-btn::after{
        width: 10px;
        height: 10px;
    }
    
    .m-shoplist_area{
        padding: 3em 0;
    }
    .m-shoplist_area h2{
        margin-bottom: 1em;
    }

    /*お問い合わせ*/
    .m-contact_area{
        padding: 3em 0;
    }
    .m-contact_area p.con-intro{
        font-size: 1.6rem;
    }
    .m-contact_area .m-con_num_head{
        font-size: 1.6rem;
    }
    .m-contact_area .con_num_tel a.con-tel{
        font-size: 2.5rem;
    }
    .m-contact_area .con_num_tel a.con-tel::before{
        top: calc(50% + 2px);
        font-size: 22px;
    }
    .m-contact_area .con_num_tel .con_num_timearea .con_num_time{
        font-size: 1.5rem;
    }
    .m-contact_area .con_num_tel .con_num_timearea span{
        font-size: 1.6rem;
    }
    .m-contact_area .con-insta_head span,
    .m-contact_area .con-line_head span{
        font-size: 1.6rem;
    }
    .m-contact_area .con-insta_head,
    .m-contact_area .con-line_head{
        font-size: 1.6rem;
    }
    .m-con_flex{
        margin: 0 auto;
    }

    /*固定*/
    .fixed-bottom .nav-wrap .nav__box:last-child{
        width: 40%;
    }
    .toggle_btn span:nth-child(1), .toggle_btn span:nth-child(2) {
        left: 29px;
    }
    
    #navArea.cp-nav .nav__wrap{
        right: -320px;
        width: 320px;
    }
    #navArea.cp-nav .nav__wrap .nav-inner {
        display: block;
        padding: 20px 20px 50px 20px;
    }
    #navArea.cp-nav .nav__wrap .nav-inner ul{
        width: 100%;
    }
    #navArea.cp-nav .nav__wrap .nav-inner .nav_btn{
        flex-direction: row;
    }
    #navArea.cp-nav .nav__wrap .nav-inner .nav_btn a{
        border: unset;
    }
    .accordion .sub__box a::before{
        content: unset;
    }
    .nav_btn a{
        font-size: 1.2rem;
    }
}
@media only screen and (min-width:800px){

    /*固定*/
    .fixed-bottom{
        width: 500px;
        margin: 0 auto;
    }
    .fixed-bottom .nav-wrap .nav__box:first-child{
        border-left: 1px solid var(--maincolor);
    }
    .fixed-bottom .nav-wrap .nav__box:last-child{
        border-right: 1px solid var(--maincolor);
    }

}

@media only screen and (min-width:980px){
    .campaign_463_ver1_1{
        padding-bottom: 0;
    }
    .fixed-bottom{
        display: none;
    }
    .fixed-nav{
        display: block;
        position: fixed;
        top: 2em;
        left: 3%;
        width: 200px;
    }
    .fixed-nav img{
        width: 150px;
    }
    .fixed-nav ul{
        margin: 2em 0 0 1em;
        line-height: 1.8;
    }
    .fixed-nav ul li:not(:last-child){
        margin-bottom: 0.5em;
    }
    .fixed-nav ul li a{
        letter-spacing: 1px;
        font-weight: 600;
    }

    .nav_list.now{
        list-style: circle;
    }
    .nav_list.now a{
        color: var(--maincolor);
    }

    .fixed-reserve{
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        gap: 10px;
        width: 26%;
        margin-top: 2em;
    }
    .fixed-reserve div{
        width: 180px;
    }
    .fixed-reserve div a{
        display: block;
        text-align: center;
        font-size: 1.2rem;
        padding: 0.8em;
        border-radius: 50px;
    }
    .fixed-reserve .reserve-1 a{
        color: #fff;
        background-color: #D76E69;
        border: 1px solid #D76E69;
        transition: .2s;
    }
    .fixed-reserve .reserve-1 a:hover{
        color: #D76E69;
        background-color: #EDE8E9;
    }
    .fixed-reserve .reserve-2 a{
        color: #D76E69;
        border: 1px solid #D76E69;
    }

    #lp{
        position: relative;
        height: 100%;
    }
}

@media only screen and (min-width:1200px){
    .fixed-nav{
        width: calc(25% - 100px);
    }
    .lp-right{
        position: fixed;
        top: 0;
        right: -7%;
        height: 100%;
        width: calc(57% - 100px);
        display: block;
    }
    .lp-right .slider.lpRight{
        margin-inline: auto;
        overflow: hidden; /* 画像がはみ出ないようにする */
    }
    .lp-right .slider.lpRight img{
        width: 100%;
    }
    @keyframes zoomUp {
        0% {
            transform: scale(1);
        }
        100% {
            transform: scale(1.15); /* 拡大率 */
        }
    }
    .add-animation {
        animation: zoomUp 10s linear 0s normal both;
    }

    #lp{
        width: calc(60% - 100px);
        margin-left: calc(30% - 100px);
    }
}

@media only screen and (min-width:1440px){
    .lp-right{
        right: 0%;
    }
    #lp{
        margin-left: calc(25% - 100px);
    }
}

@media only screen and (min-width: 1920px) {
    #lp {
        margin-left: calc(28% - 100px);
    }
}