#lp-sp-jpn{ position: relative; margin: 0 auto; padding: 0 0 6.770833333vw; width: 73.95833333vw; letter-spacing: .11em; font-family: "Ryumin Medium KL";}
#lp-sp-jpn .pc{ display: block;}
#lp-sp-jpn .sp{ display: none;}
#lp-sp-jpn .anchor{ position: relative; z-index: -1;}
#lp-sp-jpn .anchor:before{ display: block; margin-top: -67px; width: 100%; height: 67px; content: ""; vertical-align: top;}
#lp-sp-jpn figure{ margin: 0; padding: 0;}

@media only screen and (max-width: 736px) {
    #lp-sp-jpn{ margin: 0; padding: 0 0 13.33333333vw; width: 100%;}
    #lp-sp-jpn *{ box-sizing: border-box;}
    #lp-sp-jpn .pc{ display: none;}
    #lp-sp-jpn .sp{ display: block;}
    #lp-sp-jpn .anchor:before{ margin-top: -18.4vw; height: 18.4vw;}
}

#lp-sp-jpn .sec1{ margin: 0 calc(50% - 50vw); padding: 0 calc(50vw - 50%) 4.166666667vw; background: #824628; color: #fff;}
#lp-sp-jpn .sec1 + .sec1{ margin: 5.208333333vw calc(50% - 50vw) 0;}
#lp-sp-jpn .sec1 .main1{ position: relative; overflow: hidden; margin: 0 calc(50% - 50vw); height: 58.75vw; color: #fff;}
#lp-sp-jpn .sec1 .main1 figure{ position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%,-50%) scale(1.5); animation: zoom 2s cubic-bezier(0.25, 1, 0.5, 1) 1s forwards;}
#lp-sp-jpn .sec1 .main1 .logo1{ position: absolute; top: 31.51041667vw; left: 50%; width: 33.59427083vw; transform: translate(-50%,0);}
#lp-sp-jpn .sec1 .main1 .logo2{ position: absolute; top: 7.1875vw; right: 4.322916667vw; width: 22.21302083vw;}
#lp-sp-jpn .sec1 .main1 p{ position: absolute; right: 7.135416667vw; bottom: 1.458333333vw; width: 21.77083333vw; text-align: right; letter-spacing: .05em; font-weight: 400; font-size: 0.9375vw; font-family: bigmoore, serif; line-height: 1.5;}
#lp-sp-jpn .sec1 .main2{ margin: 0 calc(50% - 50vw);}
#lp-sp-jpn .sec1 .tl-wrap{ position: relative; margin: -39.16666667vw auto 0; width: 58.7984375vw; height: 56.82291667vw;}
#lp-sp-jpn .sec1 .tl-wrap h2{ position: sticky; top: calc(19.79166667vw + 67px);}
#lp-sp-jpn .sec1 .dl1{ padding: 2em 8.333333333vw 0 10.9375vw;}
#lp-sp-jpn .sec1 .dl1 > dt{ font-size: 1.979166667vw;}
#lp-sp-jpn .sec1 .dl1 > dd{ margin: 1em 0 0; letter-spacing: .08em; font-size: 1.25vw; line-height: 1.833333333;}
#lp-sp-jpn .sec1 .flex1{ display: flex; flex-direction: row-reverse; margin: 10.41666667vw 0 0; justify-content: space-between; align-items: flex-end;}
#lp-sp-jpn .sec1 .dl1 + .flex1{ margin: 2.083333333vw 0 0;}
#lp-sp-jpn .sec1 .flex1 .detail{ width: 28.95833333vw;}
#lp-sp-jpn .sec1 .flex1 .detail h3{ position: relative; letter-spacing: .05em; font-weight: 400; font-size: 2.604166667vw; font-family: "bigmoore", serif;}
#lp-sp-jpn .sec1 .flex1 .detail h3 span{ position: absolute; top: -5.885416667vw; left: -4.270833333vw; width: 18.17708333vw;}
#lp-sp-jpn .sec1 .flex1 .detail dl:after{ position: absolute; top: -1.09375vw; left: -8.177083333vw; width: 0; height: 0.130208333vw; background: #fff; content: "";}
#lp-sp-jpn .sec1 .flex1 .detail dl.is-active:after{ width: 39.66145833vw; transition: .75s width .5s ease-out;}
#lp-sp-jpn .sec1 .flex1 .detail dl{ position: relative; margin: 3.125vw 0 0; font-weight: 400; font-family: "bigmoore", serif;}
#lp-sp-jpn .sec1 .flex1 .detail dt{ letter-spacing: .055em; font-size: 1.458333333vw;}
#lp-sp-jpn .sec1 .flex1 .detail dd{ margin: 1em 0 0; letter-spacing: .06em; font-size: 0.729166667vw; line-height: 1.928571429;}
#lp-sp-jpn .sec1 .flex1 figure{ width: 36.97916667vw;}
#lp-sp-jpn .sec1 > p{ margin: 2em 0 0; font-size: 1.25vw; line-height: 2.375;}
#lp-sp-jpn .sec1 .img1{ position: relative; margin: 3.645833333vw 0 0;}
#lp-sp-jpn .sec1 .img1 ul{ display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: flex-end;}
#lp-sp-jpn .sec1 .img1 ul > li{ width: 32.03125vw;}
#lp-sp-jpn .sec1 .img1 ul > li:first-child{ width: 39.47916667vw;}
#lp-sp-jpn .sec1 .img1 figcaption{ position: absolute; top: 7.8125vw; left: 0; white-space: nowrap; font-size: 1.979166667vw; line-height: 1.973684211; clip-path: inset(0 100% 0 0);}
#lp-sp-jpn .sec1 .img1 figcaption.appear{ animation: 1s appear .5s ease-out 1 forwards;}
#lp-sp-jpn .sec1 .img2{ margin: 5.208333333vw 0 0;}
#lp-sp-jpn .sec1 .img2 figcaption{ font-size: 1.979166667vw; line-height: 1.973684211; clip-path: inset(0 100% 0 0);}
#lp-sp-jpn .sec1 .img2 figcaption.appear{ animation: 1s appear .5s ease-out 1 forwards;}
#lp-sp-jpn .sec1 .img2 ul{ display: flex; margin: 2.604166667vw 0 0; justify-content: space-between;}
#lp-sp-jpn .sec1 .img2 ul > li{ width: 35.46875vw;}
#lp-sp-jpn .sec1 .btn1{ margin: 2.34375vw 0 0;}
#lp-sp-jpn .sec1 .btn1 a{ position: relative; display: flex; flex-direction: column; margin: 0 auto; width: 11.5625vw; height: 11.5625vw; border-radius: 100%; background: #c3afa6; color: #824628; text-align: center; font-size: 1.25vw; align-items: center; justify-content: center;}
#lp-sp-jpn .sec1 .btn1 a span{ margin: .5em 0 0; font-family: bigmoore, serif;}
#lp-sp-jpn .sec1 .btn1 a:after{ position: absolute; top: 50%; left: 50%; width: 9.791666667vw; height: 9.791666667vw; border: 0.15625vw solid #824628; border-radius: 100%; content: ""; transform: translate(-50%,-50%);}
#lp-sp-jpn .sec1 .btn1 a:hover{ background: #fff;}

@keyframes zoom {
    0% { transform: translate(-50%,-50%) scale(1.3);}
    100% { transform: translate(-50%,-50%) scale(1);}
}
@keyframes appear {
    100% { clip-path: inset(0 0 0 0);}
}

@media only screen and (max-width: 736px) {
    #lp-sp-jpn .sec1{ margin: 0; padding: 0 12.8vw 10.66666667vw;}
    #lp-sp-jpn .sec1 + .sec1{ margin: 13.33333333vw 0 0;}
    #lp-sp-jpn .sec1 .main1{ height: 121.0666667vw;}
    #lp-sp-jpn .sec1 .main1 .logo1{ top: 57.6vw; width: 64.90666667vw;}
    #lp-sp-jpn .sec1 .main1 .logo2{ top: 10.13333333vw; right: 4.533333333vw; width: 38.42133333vw;}
    #lp-sp-jpn .sec1 .main1 p{ right: 2.4vw; bottom: 4vw; width: 59.46666667vw; letter-spacing: .02em; font-size: 2.4vw; line-height: 1.333333333;}
    #lp-sp-jpn .sec1 .tl-wrap{ margin: -81.33333333vw calc(50% - 50vw) 0; padding: 0 0 0 7.2vw; width: auto; height: 114.1333333vw;}
    #lp-sp-jpn .sec1 .tl-wrap h2{ top: calc(39.46666667vw + 18.4vw); width: 80.472vw;}
    #lp-sp-jpn .sec1 .dl1{ padding: 1em 0 0;}
    #lp-sp-jpn .sec1 .dl1 > dt{ white-space: nowrap; font-size: 4.533333333vw;}
    #lp-sp-jpn .sec1 .dl1 > dd{ margin: 2em 0 0; letter-spacing: .11em; font-size: 3.733333333vw; line-height: 1.928571429;}
    #lp-sp-jpn .sec1 .flex1{ flex-direction: column; margin: 17.33333333vw 0 0; justify-content: flex-start; align-items: flex-start;}
    #lp-sp-jpn .sec1 .dl1 + .flex1{ margin: 17.33333333vw 0 0;}
    #lp-sp-jpn .sec1 .flex1 .detail{ width: 100%;}
    #lp-sp-jpn .sec1 .flex1 .detail h3{ display: flex; flex-direction: column; text-align: right; font-size: 5.6vw; align-items: flex-end;}
    #lp-sp-jpn .sec1 .flex1 .detail h3 span{ position: relative; top: auto; left: auto; margin: 0 0 .25em; width: 48.688vw;}
    #lp-sp-jpn .sec1 .flex1 .detail dl:after{ top: -4.533333333vw; left: 0; height: 0.266666667vw;}
    #lp-sp-jpn .sec1 .flex1 .detail dl.is-active:after{ width: 100%; transition: width 1s ease-out;}
    #lp-sp-jpn .sec1 .flex1 .detail dl{ margin: 8vw 0 0; text-align: right;}
    #lp-sp-jpn .sec1 .flex1 .detail dt{ letter-spacing: .05em; font-size: 5.333333333vw;}
    #lp-sp-jpn .sec1 .flex1 .detail dd{ margin: 1em 0 0; letter-spacing: .02em; font-size: 2.4vw; line-height: 1.555555556;}
    #lp-sp-jpn .sec1 .flex1 figure{ margin: 6.666666667vw 0 0; width: 60vw;}
    #lp-sp-jpn .sec1 > p{ margin: 1.5em 0 0; letter-spacing: .06em; font-size: 3.466666667vw; line-height: 1.923076923;}
    #lp-sp-jpn .sec1 .img1{ margin: 2em 0 0;}
    #lp-sp-jpn .sec1 .img1 ul{ flex-direction: column; padding: 8vw 0 0; justify-content: flex-start; align-items: center;}
    #lp-sp-jpn .sec1 .img1 ul > li{ margin: 5.333333333vw 0 0; width: 57.33333333vw;}
    #lp-sp-jpn .sec1 .img1 ul > li:first-child{ width: 57.33333333vw;}
    #lp-sp-jpn .sec1 .img1 figcaption{ position: relative; top: auto; left: auto; white-space: nowrap; font-size: 5.333333333vw; line-height: 1.6;}
    #lp-sp-jpn .sec1 .img2{ margin: 2em 0 0;}
    #lp-sp-jpn .sec1 .img2 ul{ flex-direction: column; margin: 0; padding: 8vw 0 0; justify-content: flex-start; align-items: center;}
    #lp-sp-jpn .sec1 .img2 ul > li{ margin: 5.333333333vw 0 0; width: 57.33333333vw;}
    #lp-sp-jpn .sec1 .img2 figcaption{white-space: nowrap; font-size: 5.333333333vw; line-height: 1.6; }
    #lp-sp-jpn .sec1 .btn1{ margin: 6.666666667vw 0 0;}
    #lp-sp-jpn .sec1 .btn1 a{ width: 40.26666667vw; height: 40.26666667vw; font-size: 4.8vw;}
    #lp-sp-jpn .sec1 .btn1 a span{ margin: .5em 0 0; font-size: 5.333333333vw;}
    #lp-sp-jpn .sec1 .btn1 a:after{ width: 34.13333333vw; height: 34.13333333vw; border: 0.8vw solid #824628;}
}

#lp-sp-jpn .sec2{ position: relative; margin: 6.25vw 0 0; padding: 35.41666667vw 9.375vw 1.5625vw; border: 0.104166667vw solid #824628;}
#lp-sp-jpn .sec2 .dl1{ position: absolute; top: 12.23958333vw; left: -3.125vw; background: #fff;}
#lp-sp-jpn .sec2 .dl1 dt img{ width: 31.8890625vw;}
#lp-sp-jpn .sec2 .dl1 dd{ margin: .5em 0 0; padding: 0 0 1.822916667vw; color: #824628; font-size: 1.25vw; line-height: 1.958333333;}
#lp-sp-jpn .sec2 h3.blt{ padding: 7.8125vw 0 0; border-top: 0.104166667vw dotted #824628;}
#lp-sp-jpn .sec2 h3 span{ display: flex; margin: 0 auto; width: 19.94791667vw; height: 2.552083333vw; border: 0.052083333vw solid #707070; background: #824628; color: #fff; letter-spacing: .05em; font-weight: 500; font-size: 1.5625vw; font-family: abhaya-libre, sans-serif; align-items: center; justify-content: center;}
#lp-sp-jpn .sec2 > figure{ margin: 2.083333333vw 0 0;}
#lp-sp-jpn .sec2 > figure.mb{ margin: 2.083333333vw 0 7.8125vw;}
#lp-sp-jpn .sec2 .slide{ display: flex; justify-content: space-between;}
#lp-sp-jpn .sec2 .slide > li{ width: 26.30208333vw;}
#lp-sp-jpn .sec2 figcaption{ margin: 2em 0 0; color: #824628; font-size: 0.833333333vw; font-family: "Ryumin Bold KL"; line-height: 2.125;}
#lp-sp-jpn .sec2 .flex1{ display: flex; margin: 2.083333333vw 0 0; justify-content: space-between; align-items: flex-end;}
#lp-sp-jpn .sec2 .flex1 figure{ width: 34.89583333vw;}
#lp-sp-jpn .sec2 .flex1 .detail{ width: 18.75vw;}
#lp-sp-jpn .sec2 .flex1 .detail dl{ color: #824628;}
#lp-sp-jpn .sec2 .flex1 .detail dt{ margin: 1em 0 0; font-size: 2.083333333vw; font-family: "Ryumin ExtraBold KL";}
#lp-sp-jpn .sec2 .flex1 .detail dd{ margin: 1em 0 0; font-size: 0.833333333vw; font-family: "Ryumin Bold KL"; line-height: 2.125;}
#lp-sp-jpn .sec2 .btn2{ margin: 2.34375vw 0 3.90625vw;}
#lp-sp-jpn .sec2 .btn2 a{ position: relative; display: flex; flex-direction: column; margin: 0 auto; width: 11.5625vw; height: 11.5625vw; border-radius: 100%; background: #9b6d5a; color: #fff; text-align: center; font-size: 1.25vw; align-items: center; justify-content: center;}
#lp-sp-jpn .sec2 .btn2 a span{ margin: .5em 0 0; font-family: bigmoore, serif;}
#lp-sp-jpn .sec2 .btn2 a:after{ position: absolute; top: 50%; left: 50%; width: 9.791666667vw; height: 9.791666667vw; border: 0.15625vw solid #fff; border-radius: 100%; content: ""; transform: translate(-50%,-50%);}
#lp-sp-jpn .sec2 .btn2 a:hover{ background: #824628;}

@media only screen and (max-width: 736px) {
    #lp-sp-jpn .sec2{ margin: 18.66666667vw auto 0; padding: 93.33333333vw 8vw 2.666666667vw; width: 74.4vw; border: 0.533333333vw solid #824628;}
    #lp-sp-jpn .sec2 .dl1{ top: 24vw; left: -9.333333333vw;}
    #lp-sp-jpn .sec2 .dl1 dt img{ width: 70.10933333vw;}
    #lp-sp-jpn .sec2 .dl1 dd{ margin: 1em 0 0; padding: 0 0 10.66666667vw 5.333333333vw; width: 75.46666667vw; letter-spacing: .06em; font-size: 3.733333333vw; line-height: 1.5;}
    #lp-sp-jpn .sec2 h3.blt{ position: relative; padding: 12vw 0 0; border-top: none;}
    #lp-sp-jpn .sec2 h3.blt:after{ position: absolute; top: 0; left: 50%; display: block; width: 68vw; height: 0.533333333vw; border-top: 2px dotted #824628; content: ""; transform: translate(-50%,0);}
    #lp-sp-jpn .sec2 h3 span{ margin: 0; width: 100%; height: 9.333333333vw; border: 0.266666667vw solid #707070; font-size: 6.4vw;}
    #lp-sp-jpn .sec2 > figure{ margin: 8vw 0 0; padding: 0 1.333333333vw;}
    #lp-sp-jpn .sec2 > figure.mb{ margin: 8vw 0 17.33333333vw;}
    #lp-sp-jpn .sec2 > figure > div{ margin: 0 -9.333333333vw; width: auto;}
    #lp-sp-jpn .sec2 .slide{ display: block;}
    #lp-sp-jpn .sec2 .slide > li{ width: 100%;}
    #lp-sp-jpn .sec2 .slide{ opacity: 0; transition: opacity 1.2s ease;}
    #lp-sp-jpn .sec2 .slide.slick-initialized{ opacity: 1;}
    #lp-sp-jpn .sec2 .slick-slide{ backface-visibility: hidden; transform-style: preserve-3d;}
    #lp-sp-jpn .sec2 .slick-prev,
    #lp-sp-jpn .sec2 .slick-next{ width: 2.8vw; height: 5.770666667vw;}
    #lp-sp-jpn .sec2 .slick-prev.slick-disabled:before,
    #lp-sp-jpn .sec2 .slick-next.slick-disabled:before{ opacity: 1;}
    #lp-sp-jpn .sec2 .slick-prev:before,
    #lp-sp-jpn .sec2 .slick-next:before{ display: block; width: 100%; height: 100%; background: url("/static/mallDefault/contents/images/sp/japandi/2024aw/arrow.png") no-repeat center / contain; content: ""; opacity: 1;}
    #lp-sp-jpn .sec2 .slick-prev:before{ transform: rotate(180deg);}
    #lp-sp-jpn .sec2 .slick-prev{ left: -6.933333333vw;}
    #lp-sp-jpn .sec2 .slick-next{ right: -6.933333333vw;}
    #lp-sp-jpn .sec2 figcaption{ padding: 0 1.333333333vw; letter-spacing: .05em; font-size: 3.2vw; line-height: 1.833333333;}
    #lp-sp-jpn .sec2 .flex1{ flex-direction: column; margin: 12vw 0 0; justify-content: flex-start; align-items: flex-start;}
    #lp-sp-jpn .sec2 .flex1 figure{ margin: 0 -8vw; width: auto;}
    #lp-sp-jpn .sec2 .flex1 .detail{ padding: 0 1.333333333vw; width: 100%;}
    #lp-sp-jpn .sec2 .flex1 .detail dt{ margin: 1em 0 0; font-size: 8vw;}
    #lp-sp-jpn .sec2 .flex1 .detail dd{ margin: .5em 0 0; letter-spacing: .05em; font-size: 3.2vw; line-height: 1.833333333;}
    #lp-sp-jpn .sec2 .btn2{ margin: 18.66666667vw 0 12vw;}
    #lp-sp-jpn .sec2 .btn2 a{ width: 40.26666667vw; height: 40.26666667vw; font-size: 4.8vw;}
    #lp-sp-jpn .sec2 .btn2 a span{ margin: .5em 0 0; font-size: 5.333333333vw;}
    #lp-sp-jpn .sec2 .btn2 a:after{ width: 34.13333333vw; height: 34.13333333vw; border: 0.8vw solid #fff;}
}

#lp-sp-jpn .act2 { opacity: 0;}
#lp-sp-jpn .fadein { animation: fadein 1s ease forwards;}
@keyframes fadein {
    0% { opacity: 0;}
    100% { opacity: 1;}
}