@import url('https://fonts.googleapis.com/css2?family=Forum&family=Zen+Kaku+Gothic+New&display=swap');

#lp-sp-xmas{ margin: 0 auto; width: 900px; color: #0A0A0A; font-weight: 400;}
#lp-sp-xmas *{ box-sizing: border-box;}
#lp-sp-xmas .pc{ display: block;}
#lp-sp-xmas .sp{ display: none;}
.anchor{ position: relative;}
.anchor:before{ display: block; margin-top: -67px; width: 100%; height: 67px; content: ""; vertical-align: top;}
#lp-sp-xmas figure{ margin: 0; padding: 0;}

@media only screen and (max-width: 1560px) {
    .anchor:before{ margin-top: -134px; height: 134px;}
}

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

#lp-sp-xmas .sec1{ position: sticky; top: 67px; z-index: -1; margin: 0 calc(50% - 50vw);}
#lp-sp-xmas .sec1 video{ width: 100%;}

@media only screen and (max-width: 1560px) {
    #lp-sp-xmas .sec1{ top: 134px;}
}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .sec1{ top: 18.4vw;}
}

#lp-sp-xmas .sec2{ margin: -42.23958333vw 0 0; padding: 0 0 200px; text-align: center; font-family: "Zen Kaku Gothic New", sans-serif;}
#lp-sp-xmas .sec2 h2{ margin: 0 auto; width: 36.48333333vw;}
#lp-sp-xmas .sec2 p{ margin: 16.61458333vw 0 0; color: #fff; letter-spacing: .1em; font-weight: 500; font-size: 22px; line-height: 2.363636364;}
#lp-sp-xmas .sec2 nav{ display: flex; flex-direction: column; margin: 120px 0 0; width: 100%; height: 551.61px; background: url("/static/mallDefault/contents/images/sp/xmas2025/bg_nav.png") no-repeat center / contain; font-family: "Forum", serif; align-items: center; justify-content: center;}
#lp-sp-xmas .sec2 nav h3{ border-bottom: .5px solid; letter-spacing: .2em; font-size: 24px; line-height: 1.25;}
#lp-sp-xmas .sec2 nav ul{ display: flex; margin: 50px 0 0; justify-content: center;}
#lp-sp-xmas .sec2 nav ul > li{ padding: 0 22px;}
#lp-sp-xmas .sec2 nav ul a{ position: relative; display: flex; flex-direction: column; padding: 0 0 35px; align-items: center;}
#lp-sp-xmas .sec2 nav ul a:after{ position: absolute; bottom: 0; left: 50%; width: 16.07px; height: 16.07px; background: url("/static/mallDefault/contents/images/sp/xmas2025/arrow.png") no-repeat center / contain; content: ""; transform: translate(-50%,0);}
#lp-sp-xmas .sec2 nav ul figure img{ display: block; margin: 0 auto; width: auto; height: 196px;}
#lp-sp-xmas .sec2 nav ul div{ letter-spacing: .2em; font-size: 20px;}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .sec2{ margin: -116vw 0 0; padding: 0 0 13.33333333vw;}
    #lp-sp-xmas .sec2 h2{ width: 89.6vw;}
    #lp-sp-xmas .sec2 p{ margin: 46.66666667vw auto 0; width: 80vw; letter-spacing: .05em; font-size: 4.266666667vw; line-height: 2.125;}
    #lp-sp-xmas .sec2 nav{ margin: 36vw auto 0; width: 94.66666667vw; height: 161.0666667vw; background: url("/static/mallDefault/contents/images/sp/xmas2025/bg_nav_sp.png") no-repeat center / contain;}
    #lp-sp-xmas .sec2 nav h3{ border-bottom: 0.133333333vw solid; font-size: 5.866666667vw; line-height: 1.272727273;}
    #lp-sp-xmas .sec2 nav ul{ margin: 8.8vw 0 0; flex-wrap: wrap;}
    #lp-sp-xmas .sec2 nav ul > li{ padding: 3.466666667vw 0 0; width: 40vw;}
    #lp-sp-xmas .sec2 nav ul a{ padding: 0 0 6.666666667vw;}
    #lp-sp-xmas .sec2 nav ul a:after{ width: 3.2vw; height: 3.2vw;}
    #lp-sp-xmas .sec2 nav ul figure img{ height: 36.8vw;}
    #lp-sp-xmas .sec2 nav ul div{text-align: center;  font-size: 4.266666667vw; line-height: 1.25;}
}

#lp-sp-xmas .sec{ margin: 0 calc(50% - 50vw); padding: 160px calc(50vw - 50%) 0;}
#lp-sp-xmas .sec3{ background: #E2CBA6;}
#lp-sp-xmas .sec4{ background: #BAB8B2;}
#lp-sp-xmas .sec5{ background: #405D58; color: #fff;}
#lp-sp-xmas .sec6{ background: #CC6851;}
#lp-sp-xmas .sec h3{ color: #CC6851; text-align: center; letter-spacing: .26em; font-weight: 400; font-size: 90px; font-family: "Forum", serif;}
#lp-sp-xmas .sec6 h3{ color: #E2CBA6;}
#lp-sp-xmas .sec .slide-img{ margin: 40px auto 0; width: 600px; opacity: 0; transition: opacity 1s ease;}
#lp-sp-xmas .sec .slide-img.slick-initialized{ opacity: 1;}
#lp-sp-xmas .sec .lead{ margin: 30px 0 0; padding: 0 0 140px; text-align: center; letter-spacing: .05em; font-weight: 400; font-size: 20px; font-family: "Zen Kaku Gothic New", sans-serif; line-height: 1.9;}
#lp-sp-xmas .sec .set{ padding: 0 0 200px;}
#lp-sp-xmas .sec .slide-wrap{ position: relative;}
#lp-sp-xmas .sec .slide-wrap .ico{ position: absolute; top: -20px; z-index: 10;}
#lp-sp-xmas .sec .slide-wrap .ico1-1{ left: 30px; width: 254px;}
#lp-sp-xmas .sec .slide-wrap .ico1-2{ right: 30px; width: 294px;}
#lp-sp-xmas .sec .slide-wrap .ico3-1{ right: 30px; width: 274px;}
#lp-sp-xmas .sec .slide-wrap .ico3-2{ left: 30px; width: 294px;}
#lp-sp-xmas .sec .slide-wrap .ico4-1{ right: 30px; width: 220px;}
#lp-sp-xmas .sec .slide-wrap .ico4-2{ left: 30px; width: 274px;}
#lp-sp-xmas .sec .slide{ opacity: 0; transition: opacity 1s ease;}
#lp-sp-xmas .sec .slide.slick-initialized{ opacity: 1;}
.slick-dotted.slick-slider{ margin-bottom: 0;}
.slick-dots{ bottom: -40px;}
.slick-dots li{ margin: 0 5px; width: 8px; height: 8px;}
.slick-dots li button{ padding: 0; width: 8px; height: 8px;}
.slick-dots li button:hover,
.slick-dots li button:focus{ outline: none;}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{ opacity: 1;}
.slick-dots li button:before{ display: block; width: 8px; height: 8px; background: #fff; content: ''; opacity: 1; transform: rotate(45deg);}
.slick-dots li.slick-active button:before{ background: #C86E5A; opacity: 1;}
#lp-sp-xmas .sec6 .slick-dots li.slick-active button:before{ background: #405D58;}
#lp-sp-xmas .sec .slide-wrap + p{ margin: 70px 0 0; text-align: center; letter-spacing: .05em; font-weight: 400; font-size: 18px; font-family: "Zen Kaku Gothic New", sans-serif; line-height: 1.888888889;}
#lp-sp-xmas .sec .item-wrap{ margin: 100px 0 0;}
#lp-sp-xmas .sec .more{ display: flex; margin: 50px 0 0; justify-content: center;}
#lp-sp-xmas .sec .more a{ position: relative; padding: 0 23px 19px 6px; letter-spacing: .2em; font-weight: 400; font-size: 20px; font-family: "Forum", serif;}
#lp-sp-xmas .sec .more a:after{ position: absolute; bottom: 0; left: 0; width: 174.59px; height: 13.3px; background: url("/static/mallDefault/contents/images/sp/xmas2025/btn_arrow.png") no-repeat center / contain; content: "";}
#lp-sp-xmas .sec5 .more a:after{ background: url("/static/mallDefault/contents/images/sp/xmas2025/btn_arrow_w.png") no-repeat center / contain;}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .sec{ margin: 0; padding: 0;}
    #lp-sp-xmas .sec h3{ display: flex; width: 100%; letter-spacing: normal; font-size: 14.4vw; justify-content: space-between;}
    #lp-sp-xmas .sec .slide-img{ margin: 9.333333333vw auto 0; width: 90.66666667vw;}
    #lp-sp-xmas .sec .lead{ margin: 6.666666667vw 0 0; padding: 0 0 21.33333333vw; font-size: 3.733333333vw; line-height: 1.714285714;}
    #lp-sp-xmas .sec .set{ padding: 0 0 26.66666667vw;}
    #lp-sp-xmas .sec .slide-wrap .ico{ top: -5.333333333vw;}
    #lp-sp-xmas .sec .slide-wrap .ico1-1{ left: 5.866666667vw; width: 46.66666667vw;}
    #lp-sp-xmas .sec .slide-wrap .ico1-2{ right: 3.2vw; width: 53.33333333vw;}
    #lp-sp-xmas .sec .slide-wrap .ico3-1{ right: 3.2vw; width: 50.66666667vw;}
    #lp-sp-xmas .sec .slide-wrap .ico3-2{ left: 3.2vw; width: 53.33333333vw;}
    #lp-sp-xmas .sec .slide-wrap .ico4-1{ right: 3.2vw; width: 40vw;}
    #lp-sp-xmas .sec .slide-wrap .ico4-2{ left: 3.2vw; width: 50.66666667vw;}
    .slick-dots{ bottom: -8vw;}
    .slick-dots li{ margin: 0 1.333333333vw; width: 1.6vw; height: 1.6vw;}
    .slick-dots li button{ padding: 0; width: 1.6vw; height: 1.6vw;}
    .slick-dots li button:before{ width: 1.6vw; height: 1.6vw;}
    #lp-sp-xmas .sec .slide-wrap + p{ margin: 13.33333333vw auto 0; width: 80vw; text-align: left; font-size: 3.466666667vw; line-height: 1.769230769;}
    #lp-sp-xmas .sec .item-wrap{ margin: 13.33333333vw 0 0;}
    #lp-sp-xmas .sec .more{ margin: 13.33333333vw 0 0;}
    #lp-sp-xmas .sec .more a{ padding: 0 5.6vw 3.733333333vw 1.066666667vw; font-size: 4.8vw;}
    #lp-sp-xmas .sec .more a:after{ width: 41.06666667vw; height: 2.933333333vw; background: url("/static/mallDefault/contents/images/sp/xmas2025/btn_arrow_sp.png") no-repeat center / contain;}
    #lp-sp-xmas .sec5 .more a:after{ background: url("/static/mallDefault/contents/images/sp/xmas2025/btn_arrow_w_sp.png") no-repeat center / contain;}
}

#lp-sp-xmas .sec7{ margin: 0 calc(50% - 50vw); padding: 160px calc(50vw - 50%) 200px; background: rgba(2555,255,255,.75);}
#lp-sp-xmas .sec7 h3{ color: #405D58; text-align: center; letter-spacing: .4em; font-weight: 400; font-size: 90px; font-family: "Forum", serif;}
#lp-sp-xmas .sec7 .item-wrap{ margin: 100px 0 0;}
#lp-sp-xmas .sec7 .more{ margin: 80px 0 0;}
#lp-sp-xmas .sec7 .more a{ display: flex; margin: 0 auto; width: 259px; height: 52px; border-radius: 26px; background: #405d58; box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.16); color: #fff; letter-spacing: .2em; font-weight: 400; font-size: 22px; font-family: "Forum", serif; justify-content: center; align-items: center;}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .sec7{ margin: 0; padding: 0 0 26.66666667vw;}
    #lp-sp-xmas .sec7 h3{ display: flex; letter-spacing: normal; font-size: 14.4vw; justify-content: space-between;}
    #lp-sp-xmas .sec7 .item-wrap{ margin: 16vw 0 0;}
    #lp-sp-xmas .sec7 .more{ margin: 13.33333333vw 0 0;}
    #lp-sp-xmas .sec7 .more a{ width: 53.33333333vw; height: 10.66666667vw; border-radius: 5.333333333vw; box-shadow: 0.533333333vw 0.533333333vw 1.333333333vw rgba(0, 0, 0, 0.16); font-size: 4.8vw;}
}

#lp-sp-xmas .sec8{ margin: 0 calc(50% - 50vw); padding: 160px calc(50vw - 50%) 200px; background: #BAB8B2;}
#lp-sp-xmas .sec8 h3{ color: #CC6851; text-align: center; letter-spacing: .4em; font-weight: 400; font-size: 90px; font-family: "Forum", serif;}
#lp-sp-xmas .sec8 .item-wrap{ margin: 100px 0 0;}
#lp-sp-xmas .sec8 .more{ margin: 80px 0 0;}
#lp-sp-xmas .sec8 .more a{ display: flex; margin: 0 auto; width: 259px; height: 52px; border-radius: 26px; background: #CC6851; box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.16); color: #fff; letter-spacing: .2em; font-weight: 400; font-size: 22px; font-family: "Forum", serif; justify-content: center; align-items: center;}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .sec8{ margin: 0; padding: 0 0 26.66666667vw;}
    #lp-sp-xmas .sec8 h3{ display: flex; letter-spacing: normal; font-size: 14.4vw; justify-content: space-between;}
    #lp-sp-xmas .sec8 .item-wrap{ margin: 16vw 0 0;}
    #lp-sp-xmas .sec8 .more{ margin: 13.33333333vw 0 0;}
    #lp-sp-xmas .sec8 .more a{ width: 53.33333333vw; height: 10.66666667vw; border-radius: 5.333333333vw; box-shadow: 0.533333333vw 0.533333333vw 1.333333333vw rgba(0, 0, 0, 0.16); font-size: 4.8vw;}
}

/*バナーエリア*/
#lp-sp-xmas .bn{ position: fixed; right: 1.5625vw; bottom: 1.822916667vw; z-index: 30;}
#lp-sp-xmas .bn a{ display: block; width: 14.84375vw; filter: drop-shadow(4px 4px 4px rgba(28, 41, 38, 0.8));}

@media only screen and (max-width: 736px) {
    #lp-sp-xmas .bn{ left: 5vw; bottom: 2vw; z-index: 20;}
    #lp-sp-xmas .bn a{ width: 95%; box-shadow: 0 0 2.666666667vw rgba(28, 41, 38, 0.8); filter: none;}
}