:root{ --bg-img_1:url("https://resource.xp-pen.com/img/active_list/kr2024_spring/kr_spring/bg1.jpg"); --bg-img_2:url("https://resource.xp-pen.com/img/active_list/kr2024_spring/kr_spring/bg2.jpg"); --bg-img_3:url("https://resource.xp-pen.com/img/active_list/kr2024_spring/kr_spring/bg3.jpg"); --bg-title1:url("https://resource.xp-pen.com/img/active_list/Xmas23_JP/krnew/bgt1.webp"); --bg-title2:url("https://resource.xp-pen.com/img/active_list/kr2024_spring/kr_spring/lpTitle.jpg"); --product-bg1:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/productbg1.png'); --product-bg1m:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/productbg1m.png'); --product-bg2:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/productbg2.png'); --product-bg2m:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/productbg2m.png'); --product-jx:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/jx.png'); --sbg1:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/sbg1.png'); --sbg2:url('https://resource.xp-pen.com/img/active_list/Xmas23_JP/krschool/sbg2.png'); --bg-color_1:#122044; --bg-color_2:#E3852F; --grid-bd-cr_1:#FEC949; --grid-bd-cr_2:#32273F; --title-cr: #fff; --goods-title-cr:#000; --goods-remark-cr: #666666; --goods-2nd-title-cr:#333; --goods-list-title-cr:#000000; --price-cr: #DC0302; --list-price-cr: #DC0302; --main-cr:#fff; --connect-text-cr:#4D2A32; --email-title-bg-cr:#1238BF; --connect-bg-cr:#FFFEFD; --label-bg_1:#7750FD; --label-bg_2:#FFE7B9; --fz12:0.12rem; --fz16:0.16rem; --fz18:0.18rem; --fz24:0.24rem; --fz30:0.30rem; --fz36:0.36rem; --fz38:0.38rem; --fz44:0.44rem; --fz48:0.48rem; --xl-goods-img-w:4.38rem; --title-img-w:3.55rem } html{font-size: 100px;font-size: 5.2083333vw;} #TopicPage img{/*max-width: max-content;*/ width: 100%;height: auto;} #TopicPage p,span{font-family: Noto Sans CJK JP;} #TopicPage .main-content{max-width: 19.2rem;margin: 0 auto;} /* new_nav_content */ #TopicPage .new_nav_content{width: 100%;height: auto;display: flex;justify-content: space-between;margin-bottom: 0.1rem;flex-wrap: wrap; } #TopicPage .NewNavList{width: 22%;text-align: center;background: linear-gradient(180deg, #FFFFFF, #FFD8DD);border-radius: 40px;border: 0.04rem solid #F8A2AF;padding: 0.2rem 0.1rem;box-sizing: border-box; text-shadow: 0px 0.04rem 0px #F4C6CF;font-weight: bold;font-family: Noto Sans CJK KR;font-size: 0.24rem;color: #ED4961; cursor: pointer; margin-bottom: 0.2rem;} #TopicPage .NewNavList.NewActive{background: linear-gradient(0deg, #EC3F59, #F29EAA);box-shadow: 0px 0.08rem 0px 0px #B6404F;border: 0.04rem solid #FFDBE0;color: #FFFFFF;text-shadow: 0px 0.04rem 0px #DF344D;} /* NewGift */ #TopicPage .NewGift{width: 100%;height: auto; display: flex;justify-content: space-between;flex-wrap: wrap; margin-bottom: 0.5rem;} #TopicPage .NewGift a{display: inline-block;width: 22%;height: auto;margin-bottom: 0.2rem;} #TopicPage .NewGift a img{width: 100%;} @media screen and (max-width: 768px){ #TopicPage .NewNavList{width: 48%;font-size: 0.3rem;} } /* SwitchNavbar */ #TopicPage .SwitchNavbar{width: 100%;height: auto;display: flex;justify-content: center;padding-bottom: 0.4rem;border-bottom: 1px solid #EDB3B3;margin-bottom: 0.3rem;} #TopicPage .SwitchNavbar_btn{ padding: 0.1rem 0.35rem ;box-sizing: border-box;margin-right: 1rem;border: 0.03rem solid #EC3F59;border-radius: 50px;min-width: 25%;text-align: center;position: relative; font-size: 0.24rem;font-weight: bold;font-family: Noto Sans CJK KR;color: #EC3F59;cursor: pointer; } #TopicPage .SwitchNavbar_btn.NewActive{background: #FFF3A1;} #TopicPage .SwitchNavbar_btn:last-child{margin-right: 0;} #TopicPage .SwitchNavbar_btn.NewActive::before, #TopicPage .SwitchNavbar_btn.NewActive::after{ content: ''; width: 0;height: 0; position: absolute; left: 50%; bottom: -0.35rem;margin-left: -0.2rem;border-top: 0.2rem solid transparent; border-bottom: 0.2rem solid transparent;border-left: 0.2rem solid transparent;border-right: 0.2rem solid transparent;border-top-color: #FFF3A1; } #TopicPage .SwitchNavbar_btn.NewActive::before{bottom: -0.39rem;border-top-color: #EC3F59;} #TopicPage .SwitchNavbar_cont{display: none;} #TopicPage .SwitchNavbar_cont.NewActive{display: block;} /* nav */ .nav-content-box {top: 50%;transform: translate(0px,-50%);position: fixed;z-index: 9999;right: 0.25rem;box-sizing: border-box;max-width: 2.2rem;min-height: 3.8rem;} .nav-content {padding: 0.8rem 0 0 0;width: 100%;} .nav-list-content {background: #145F47;border: 0.06rem solid #FFF5DA;box-shadow: 0px 0.04rem 0.1rem 0px rgba(0,0,0,0.43);border-radius: 0.21rem;padding: 0.65rem 0.2rem 0.26rem;position: relative;} .nav-list-content img {max-width: 0.88rem; width: 100%; height: auto;position: absolute;top: -12%;left: 50%;transform: translate(-50%,0);} .nav-list-content .nav-list {width: 100%;position: relative;cursor: pointer;background-color: #F5E8C3;padding: 0.07rem;display: inline-block; margin-bottom: 0.26rem;} .nav-list-content .nav-list:last-child{margin-bottom: 0;} .nav-list-content .nav-list p {font-size: 0.2rem;font-weight: bold;color: #145F47; width: 100%;text-align: center; display: inline-block;} .nav-list-content .nav-list.active {background-color: #C72B2A;box-shadow: 0px 4px 2px 0px rgba(0,0,0,0.31);} .nav-list-content .nav-list.active p{color: #fff;} #TopicPage .main-container{max-width: 12.4rem;padding: 0 0.2rem;margin: 0 auto;} #TopicPage .flex-content{display: flex;justify-content: space-between;flex-wrap: wrap;align-items: center;} #TopicPage .main-inner-content{padding: 0.6rem 0 1.2rem;background-repeat: repeat;background-size: 100%;} #TopicPage .TP-container{padding: 0.5rem 0 0.2rem;background-image: var(--bg-img_1);} #TopicPage .TPbg2{background-image: var(--bg-img_2);padding: 0.9rem 0 0.9rem;} #TopicPage .TPbg2 .TP-grid{margin-bottom: 0;} #TopicPage .main-inner-content.TPbg5{background: var(--bg-img_3) no-repeat center;background-size: cover;padding: 0.6rem 0 0.6rem} #TopicPage .TPbg3{background-image: var(--bg-img_3);padding: 0.9rem 0 0.9rem;} #TopicPage .title_boximg{width: 100%;height: auto;text-align: center;} #TopicPage .title_boximg.dximg{margin-top: 0.1rem;margin-bottom: 0.3rem;} #TopicPage .title_boximg.dximg img{width: auto;max-width: 70%;} #TopicPage .TP-container.TPbg3{padding: 1rem 0 0.4rem;} #TopicPage .TP-container_3{padding: 0.6rem 0 1.2rem;} #TopicPage .TP-container_4{background-color: #080104;padding: 0.6rem 0 0.55rem;} .bg-block{display: block;} .mo-block{display: none;} #TopicPage .store-banner-content .bg-block{ width: 100%;max-width: 19.2rem;height: auto;} #TopicPage .store-banner-content .mo-block{width: 100%;max-width: 8.5rem;height: auto;margin: 0 auto;} #TopicPage .new-banner{margin-bottom: 0.8rem; position: relative;} #TopicPage .new-text-box{position: absolute;left: 0.48rem;top: 50%;transform: translateY(-50%);} #TopicPage .new-text-box p{font-size: 0.3rem;font-weight: 500;color: #FFFFFF;} #TopicPage .new-text-box .new-title{font-size: 0.6rem;font-weight: 900;margin-bottom: 0.24rem;} #TopicPage .TP-container .new-gift{margin-bottom: 0.9rem;} /*module one*/ #TopicPage .title-box.title_lp{margin-bottom: 0; padding: 0.28rem 0;position: relative;overflow: hidden;background: var(--bg-title2) no-repeat;background-size: cover;background-position: center;} #TopicPage .title-box{text-align: center; width: 100%;position: relative;overflow: hidden;text-align: center;margin-bottom: 0.4rem;} #TopicPage .title-box img{max-width: 100%;width: auto;} #TopicPage .title-box.bgred{background-image: var(--bg-title1) ;background-size: 100%;background-repeat: no-repeat;background-color: #d31a1b;} #TopicPage .title-box.title_bg1{background: var(--bg-title1) no-repeat ;background-size: 100%; position: relative;z-index: 2;margin-bottom: -0.25rem;} #TopicPage .title-box_1{margin: 1rem 0 0.5rem;} #TopicPage .title-box_2{margin: 0.8rem 0 0;} #TopicPage .title-box h2{font-size: var(--fz48);color: var(--title-cr);font-weight: 900;text-shadow: 1px 3px 0px rgba(17,40,32,0.4);text-align: center;position: relative;z-index: 2;line-height: 1.1;} #TopicPage .title-box h2 span{font-size: var(--fz30);font-weight: normal;} #TopicPage .title_psoi1{width: 0.56rem;height: auto;position: absolute;top: 0;left: 12%;} #TopicPage .title_psoi2{width: 0.57rem;height: auto;position: absolute;top: 0;right: 12%;} #TopicPage .TP-grid{background-color: #E7ECF3; margin-bottom: 1.2rem;} #TopicPage .TP-grid_2{position: relative;margin-bottom: 0;} #TopicPage .TP-grid_2 .Artist-2nd-box{margin-top: 0;} #TopicPage .TP-grid_2 .Artist-2nd-box .Artist-2nd-list{border: 1px solid #FFFFFF;} #TopicPage .icon-box_2 { position: absolute; top: 0.07rem; right: 0.17rem;} #TopicPage .icon-box_2{width: 0.72rem;height: 0.7rem;} #TopicPage .X3-intro-content{text-align: center;position: relative;} #TopicPage .goods-intro-box{position: absolute;top: 0.3rem;left: 50%;transform: translateX(-50%);width: 100%;} #TopicPage .goods-intro-box p{text-align: center;} #TopicPage .intro-remark{color: #242023;font-size: 0.4rem;} #TopicPage .intro-title{color: #1E2029;font-weight: 900;font-size: 0.4rem;} #TopicPage .intro-desc{color: #1E2029;font-weight: 900;font-size: 0.24rem;} #TopicPage .detail-btn{display: inline-block;margin: 0.2rem 0;font-size: var(--fz24);font-weight: bold;color: #000000;background-color: #FED30C;border-radius: 0.26rem; padding: 0.1rem 0.6rem 0.1rem 0.4rem;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%); } #TopicPage .detail-btn::after{content: '→';position: absolute;right: 0.24rem;top: 0.09rem;transition: right 0.5s;} #TopicPage .detail-btn:hover::after{right: 0.18rem;} #TopicPage .buy-btn-box{text-align: center;padding-bottom: 0.4rem;} #TopicPage .buy-btn{display: inline-block;margin: 0.2rem 0;font-size: var(--fz24);font-weight: bold;color: #FFFFFF;background-color: #DD2C2B;border-radius: 0.26rem;padding: 0.1rem 1rem 0.1rem 0.8rem;position: relative;} #TopicPage .buy-btn::after{content: '→';position: absolute;right: 0.44rem;top: 0.09rem;transition: right 0.5s;} #TopicPage .buy-btn:hover::after{right: 0.3rem;} #TopicPage .discount-box{font-size: var(--fz30);font-weight: bold;color: #FFFFFF;display: inline-block;padding: 0.12rem 0.2rem;background: #DC0302;position: absolute;top: 0.3rem;left: 0.3rem;} #TopicPage .discount-box.xmas{top: initial;left: 50%;bottom: 0;transform: translate(-50%,0);color: #fff; border-radius: 0.5rem;padding: 0.12rem 1.2rem;background-color: #DD2C2B;border: 2px solid #DD2C2B;transition: all .3s;} #TopicPage .discount-box.xmas:hover{background-color: #DD2C2B; color: #fff;} /*Artist 22 Plus 卖点*/ #TopicPage .Artist22Plus-sell-list{padding: 0 0.85rem;margin: 0.6rem 0 0.4rem;} #TopicPage .sell-item{position: relative;box-shadow: 1px 24px 25px 2px rgba(55,79,81,0.3);border-radius: 15px;} #TopicPage .sell-item img{max-width: 100%;} #TopicPage .sell-item_1{ width: 30%;} #TopicPage .sell-item_2{width: 68%;} #TopicPage .sell-item_1 .sell-intro{position: absolute;top: 0.2rem;left: 0.33rem;} #TopicPage .sell-intro p{color: #000;font-size: 0.22rem;line-height: 1.6;} #TopicPage .sell-intro .size-title{font-size: 0.32rem;font-weight: bold;} #TopicPage .size-title span{font-size: 0.66rem;} #TopicPage .sell-col_3{margin-bottom: 0.35rem;} #TopicPage .sell-col_3 p{font-size: 0.26rem;font-weight: 500;color: #FEFEFE;position: absolute;right: 0.35rem;top: 50%;transform: translateY(-50%);text-align: center;} #TopicPage .sell-col_2{width: 48%;} #TopicPage .sell-col_2 p{position: absolute;top: 0.24rem;left: 50%;transform: translateX(-50%);color: #fff;font-size: 0.24rem;width: 100%;text-align: center;} #TopicPage .sell-col_2 .color-text{color: #000;} #TopicPage .sell-item_4{margin-top: 0.3rem;width: 100%;} #TopicPage .sell-item_4 .sell-col_2 .color-text{ top: 50%; right: 0.15rem; transform: translateY(-50%); width: auto;left: 48%;} #TopicPage .bg-sell{background: #FFFFFF;border-radius: 15px;} #TopicPage .sell-box{position: absolute;top: 50%;right: 0.35rem;transform: translateY(-50%);width: auto;} #TopicPage .sell-item_4 .x3-pro-title{font-size: 0.36rem;font-family: Gilroy;font-weight: bold;color: #FFFFFF; background: linear-gradient(143deg, #92E476 0%, #57B8C7 0%, #F1B322 0%, #2CD971 77.392578125%, #5CC2CB 100%); -webkit-background-clip: text;-webkit-text-fill-color: transparent; } #TopicPage .sell-item_4 .sell-box p{ position: initial;transform: translateX(0);} /*Artist 22 Plus 卖点*/ /*小王子新品*/ #TopicPage .TP-grid_2{background-color: #fff;padding: 0.55rem 0.4rem;} #TopicPage .sell-time{font-size: 0.38rem;color: #000000;text-align: center;margin-bottom: 0.16rem;} #TopicPage .new-goods-title{font-size: 0.38rem;color: #DC0302;text-align: center;} /*小王子新品*/ #TopicPage .product-intro-content{margin: 0 0.17rem;padding: 0.5rem 0.15rem;} #TopicPage .new-intro-content{background-color: #ECF1FF;border-radius: 0.3rem;} #TopicPage .NY_big{position: relative;} #TopicPage .flex{display: flex;justify-content: space-between;} #TopicPage .NY_big_box{flex-wrap: wrap;align-items: center;width: 100%;background: var(--product-bg1) no-repeat;background-size: 100% 100%; padding: 0.5rem 0 0.7rem;box-sizing: border-box;} #TopicPage .xl-content_bg2 .NY_big_box{background: var(--product-bg2) no-repeat;background-size: 100% 100%;} #TopicPage .XLcontent_sbg .NY_big_box{background: var(--sbg2) no-repeat;background-size: 100% 100%;} #TopicPage .TP-col-xl.XLcontent_sbg0 {background: var(--sbg1) no-repeat;background-size: 100% 100%;padding-bottom: 0.2rem;transform-style: preserve-3d;perspective: 1800px;} #TopicPage .XLcontent_sbg {width: 100%; transform-origin: center;position: relative;z-index: 2; } #TopicPage .XLcontent_sbg.lepetitprince_12{position: absolute;top: 0;left: 0;z-index: 3;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_box { padding: 0.5rem 0 0.5rem;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_title{text-align: center;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_remark{background: #FFF5DB;text-align: center;padding: 0.12rem 0.2rem;border: 1px solid #FFE8A8;border-radius: 0.4rem;color: #000000;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_p2{text-align: center;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_btn{margin-left: auto;margin-right: auto;} #TopicPage .XLcontent_sbg0.new-col-xl .NY_big_text{text-align: center;} #TopicPage .XLcontent_sbg0.new-col-xl .NYB_text_posi {right: 5%; bottom: -10%;} #TopicPage .goods-label{position: absolute;top: -0.3rem;left: 0;font-size: var(--fz24);font-weight: bold;color: var(--main-cr);background-color: var(--label-bg_1);border-radius: 0.28rem;padding: 0.09rem 0.29rem;} #TopicPage .label_2{ background-color: var(--label-bg_2);color: #3A2324;font-weight: bold;} #TopicPage .TP-col-xl .goods-label{top: 0.13rem;left: 0.13rem;} #TopicPage .NY_big_img{width: 48%;height: auto;position: relative} #TopicPage .new-icon{position: absolute;top: 0.3rem;left: 0.2rem;background:#6EA5FF;border-radius: 0.17rem;font-size: 0.24rem;font-weight: bold;color: #FFFFFF;padding: 0.01rem 0.16rem;display: inline-block;} #TopicPage .new-icon2{position: absolute;top: 0.2rem;left: 0;font-size: 0.24rem;font-weight: bold;color: #FFFFFF;padding-right: 0.14rem; width: 2.2rem; height: 0.62rem;line-height: 0.58rem;text-align: center; display: inline-block;background: var(--product-jx) no-repeat;background-size: 100% 100%;} #TopicPage .new-icon3{position: absolute;bottom: 10%;left: 25%;transform: translate(-50%,0);max-width: 3.09rem;} #TopicPage .Artist-2nd-list .new-icon{top: 0.15rem;left: 0.2rem;right: initial;} #TopicPage .NY_big_img img{width: var(--xl-goods-img-w);} #TopicPage .NY_big_text{width: 48%;height: auto;position: relative} #TopicPage .new-col-xl .NY_big_img img{width: 100%;max-width: 3.94rem;position: relative;transition: all 0.3s;} #TopicPage .new-col-xl .NY_big_img a{display: inline-block;} #TopicPage .new-col-xl .NY_big_img a .KRhover2{display: none;} #TopicPage .new-col-xl .NY_big_img a:hover .KRhover2{display: block;} #TopicPage .new-col-xl .NY_big_img a:hover .KRhover1{display: none;} #TopicPage .new-col-xl .NY_big_img .NY_big_po2{top: 0;} #TopicPage .new-col-xl .NY_big_img .NY_big_po2_t{top: 55%;} #TopicPage .new-col-xl .NY_big_img .NY_big_po2 img{width: 0.89rem;} #TopicPage .new-col-xl .NY_big_img{width: 50%;height: auto; text-align: center;padding: 0 0.7rem;box-sizing: border-box;} #TopicPage .new-col-xl .NY_big_text{width: 50%;height: auto;padding: 0 0.7rem;box-sizing: border-box;} #TopicPage .NY_big_title{font-size: var(--fz36);font-weight: bold;color: var(--goods-title-cr);line-height: 1.5;} #TopicPage .TP-col-md-item .NY_big_title{font-size: var(--fz24);font-weight: 400;margin-top: 0.2rem;} #TopicPage .TP-col-md-item .NY_big_p2{margin: 0.1rem 0 0.1rem;font-size: 0.28rem;} #TopicPage .NY_big_remark{font-size: var(--fz24);color: var(--goods-remark-cr);line-height: 2;margin-top: 0.2rem;} #TopicPage .sell-point-list{margin: 0.3rem 0;} #TopicPage .point-item{text-align: center;} #TopicPage .point-item p{text-align: center;font-size: var(--fz16);color: var(--goods-remark-cr);} #TopicPage .point-item img{width: 0.62rem;height: 0.62rem;} #TopicPage .NY_big_p2{font-size: var(--fz36);font-weight: bold;color: var(--price-cr);line-height: 1.5;margin: 0.24rem 0 0.3rem;} #TopicPage .original-price{font-size: var(--fz18);text-decoration: line-through;color: var(--goods-remark-cr);} #TopicPage .NY_big_btn{font-size: var(--fz24);font-weight: bold;color: #1D91CB;padding: 0.08rem 0.3rem;border-radius: 0.08rem;display: inline-block;background-color: #fff;transition: .3s; border: 2px solid #1D91CB;box-shadow: 0px 0.05rem 0px 0px #1D91CB;min-width: 60%;text-align: center;} #TopicPage .NY_big_btn:hover{ color: #fff;background-color: #2AB2F5;} #TopicPage .buy-button-box{display: flex;align-items: center;background-color: var(--price-cr);box-shadow: 0px 0.05rem 0px 0px rgba(174,67,86,0.27);border-radius: 0.24rem; border: 1px solid var(--price-cr);width: 2.84rem;margin-top: 0.16rem; } #TopicPage .discount-text{ font-size: var(--fz30); font-weight: bold; color: var(--main-cr); width: 55%; text-align: center;} #TopicPage .buy-link-box{display: inline-block;font-size: var(--fz24);width: 45%;text-align: center;padding: 0.12rem 0;line-height: 1;background: var(--main-cr);border-radius: 0.24rem;font-weight: 500;color: var(--price-cr);} #TopicPage .buy-link-box:hover{opacity: 0.8;} #TopicPage .giveaway-content{margin: 0.6rem 0;} #TopicPage .new-list-content{position: relative;margin-top: 0.75rem;} #TopicPage .icon-box{position: absolute;top: -5%;left: 3%;} #TopicPage .icon-box img{width: 0.72rem;} #TopicPage .tab-content{margin-top: 1rem;margin-bottom: 0.66rem;} #TopicPage .tag-title{font-size: var(--fz30);font-weight: 900;color: #432A2B;line-height: 1.4;padding-bottom: 0.1rem;border-bottom: 1px solid #D8D8D8;} #TopicPage .tab-list-box{margin-top: 0.4rem;} #TopicPage .tab-list-box a{flex-wrap: wrap;} #TopicPage .tab-list-box img{max-width: 456px;width: 49%;height: auto;} #TopicPage .color-content img{ width: min(948px,100%);height: auto;} #TopicPage .color-content{text-align: center;position: relative;} #TopicPage .color-content .NY_big_btn{width: 38%;position: absolute;bottom: 5%;left: 50%;transform: translateX(-50%);} #TopicPage .Artist-list-title{font-size: var(--fz30);font-weight: 400;color: #FFFFFF;text-align: right;max-width: 600px;margin: 0 auto;} #TopicPage .Artist-list-title span{font-size: var(--fz48);font-weight: bold;} #TopicPage .Artist-2nd-box{display: flex;justify-content: space-between;flex-wrap: wrap;margin-top: 0.3rem;} #TopicPage .L_box{width: 48%;} #TopicPage .free_gift{background: #EC3F59;width: 100%;border-radius: 0 0 10px 10px; display: flex;align-items: center;justify-content: center;} #TopicPage .free_gift span{font-size: var(--fz24);color: #FFFFFF;font-weight: bold;text-shadow: 0px 0.03rem 0px #D2364D;text-align: center;} #TopicPage .free_gift img{max-width: 1.9rem;width: auto;} #TopicPage .free_gift img.last-child{max-width: 1rem;} #TopicPage .L_box .Artist-2nd-list{ width: 100%;} #TopicPage .Artist-2nd-list{ width: 48%; background: #fff; border: 0.04rem solid #EC3F59;border-radius: 10px 10px 0 0; padding: 0.3rem 0 0.3rem; text-align: center; position: relative;} #TopicPage .Artist-2nd-list .NY_big_po2{top: 0.2rem;right: inherit;left: 0.2rem;} #TopicPage .new-2nd-box{ margin-bottom: 0.6rem;} #TopicPage .Artist-2nd-img{ padding: 0 0.08rem;display: inline-block;} #TopicPage .Artist-2nd-img img{max-width: max-content;} #TopicPage .Artist-2nd-img img:last-child{width: 80%;} #TopicPage .Artist-2nd-content .Artist-2nd-list{border-radius: 0.3rem;padding: 0.2rem 0.2rem 0.25rem;} #TopicPage .Artist-intro-box p{text-align: center;} #TopicPage .color-list{ margin: 0.2rem 0 0.1rem;text-align: center;} #TopicPage .color-box{width: 0.15rem;height: 0.15rem;border-radius: 50%;display: inline-block;margin-right: 0.1rem;} #TopicPage .black{background: #000000;} #TopicPage .blue{background: #16599C;} #TopicPage .green{background: #6B826E;} #TopicPage .pink{background: #E5BEC4;} #TopicPage .Artist-name{font-size: 0.26rem;color: #081128;font-weight: bold;margin: 0.15rem 0;} #TopicPage .Artist-2nd-content .Artist-name{color: var(--goods-2nd-title-cr);font-weight: bold;} #TopicPage .Artist-remark{ font-size: var(--fz18); color: var(--goods-remark-cr); line-height: 1.5; margin: 0.15rem 0;} #TopicPage .new-2nd-box .Artist-remark{color: #666666; width: 80%;margin-left: auto;margin-right: auto;box-sizing: border-box;} #TopicPage .new-list-content .Artist-remark{text-align: left;} #TopicPage .goods-price{font-size: var(--fz24);color: var(--price-cr);font-weight: bold;margin: 0.15rem 0;} #TopicPage .goods-price em{text-decoration: line-through;color: #666666;font-style: normal;font-size: var(--fz18);} #TopicPage .Artist-2nd-content .goods-price{ border-bottom: 2px solid #E5E5E5; padding-bottom: 0.18rem; margin-bottom: 0.21rem; font-weight: bold;} #TopicPage .buy-button{ font-size: var(--fz24);color: #EC3F59;font-weight: bold;padding: 0.08rem;background-color: #fff;border-radius: 0.5rem; border: 2px solid #EC3F59;width: 60%;display: block;text-align: center;transition: .3s;margin: 0 auto; } #TopicPage .buy-button:hover{color: #fff;background-color:#EC3F59;} /*Artist 12 2nd content*/ #TopicPage .New3ndBox .L_box{width: 32%;margin-bottom: 0.5rem;} #TopicPage .New3ndBox .L_box .Artist-name{font-size: var(--fz18);} /*goods list*/ #TopicPage .TP-col-xl{background: var(--main-cr);padding: 0.4rem;margin: 0 0 0.5rem;position: relative;box-shadow: none;} #TopicPage .new-col-xl{padding: 0; background-color: transparent;} #TopicPage .icon-box_1{position: absolute;right: 0.21rem;bottom: 0;} #TopicPage .icon-box_1 img{width: 1.37rem;height: 1.35rem;} #TopicPage .new-col-xl .NY_big_title{ font-size: var(--fz30);color: var(--goods-list-title-cr);} #TopicPage .new-col-xl .NY_big_remark{color: #0C4A3A;font-size: 0.2rem;line-height: 1.5;margin-bottom: 0.3rem;} #TopicPage .new-col-xl .NY_big_p2{color: var(--list-price-cr);font-size: var(--fz30);margin-top: 0;} #TopicPage .new-col-xl .NYB_text_posi{width:0.95rem;position: absolute;right: 12%;bottom: 0%;cursor: pointer;} #TopicPage .TP-col-xl .point-info{ font-size: var(--fz12);} #TopicPage .NY_big_po2{position: absolute;top: 0.1rem;right: 0.2rem;z-index: 1;} #TopicPage .NY_big_po2 img{width: 0.89rem;} #TopicPage .NY_big_po2_t{ width: 100%;height: auto;font-weight: 600;color: #FFF3A1;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%); font-size: .28rem;line-height: .28rem;text-shadow: 0.01rem 0.02rem 0.01rem rgba(127,87,0,0.67);z-index: 3; } #TopicPage .NY_big_po2_t.stroke{-webkit-text-stroke: 2px #FFF891;text-stroke: 2px #FFF891;z-index: 2;} #TopicPage .NY_big_po2_t span{ font-size: 0.24rem;} #TopicPage .TP-col-md-item{width: 32%;padding: 0.4rem 0.2rem;margin-bottom: 0.47rem;text-align: center;position: relative;} #TopicPage .TP-col-item{background: var(--main-cr);border-radius: 0.1rem;} #TopicPage .TP-col-md-img{ text-align: center; position: relative;} #TopicPage .icon_gift{position: absolute;bottom: 0;left: 0;width: 0.72rem;} #TopicPage .TP-col-item p{text-align: center;} #TopicPage .TP-col-item .buy-button-box{margin: 0.16rem auto 0;} #TopicPage .more-button{background-color: var(--grid-bd-cr_2);margin: 0 auto 0.8rem;width: 80%;text-align: center;display: block;padding: 0.24rem;border: 2px solid #FFFFFF;border-radius: 0.41rem;transition: transform .3s;} #TopicPage .more-button:hover{transform: scale(1.05);} #TopicPage .table-more{background-color: var(--bg-color_2);} /*goods list*/ /*購入特典*/ #TopicPage .bluetooth-banner{text-align: center;margin-bottom: 0.3rem;} #TopicPage .buy-free-content {display: flex;justify-content: space-between;flex-wrap: wrap;margin-bottom: 0.4rem;} #TopicPage .free-list {width: 30.917%;} #TopicPage .free-list img{height: auto;} #TopicPage .bluetooth-banner img{height: auto;transition: transform .5s;} #TopicPage .bluetooth-banner img:hover{transform: scale(1.05);} /*購入特典*/ /*email content*/ #TopicPage .connect-content{background: var(--connect-bg-cr);border-radius: 0.1rem;padding: 0.42rem 0.24rem;margin-top: 1rem;} #TopicPage .email-box{background: var(--email-title-bg-cr);border-radius: 0.1rem;padding: 0.1rem 0.2rem;text-align: left;} #TopicPage .email-box img{ max-width: max-content;} #TopicPage .email-box .email-info{font-size: var(--fz30);font-weight: bold;color: var(--main-cr);vertical-align: middle;} #TopicPage .info-remark{ font-size: var(--fz24); font-weight: bold; color: var(--connect-text-cr); line-height: 1.5; text-align: left; margin: 0.16rem 0 0.4rem;} #TopicPage .photo-content{border: 2px solid #C5CDC1;border-radius: 0.1rem;display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;padding: 0.55rem 0.4rem;margin-top: 0.4rem;} #TopicPage .info-list-box:first-child{width: 45%;} #TopicPage .info-list-box:last-child{width: 55%;} #TopicPage .info-list-box{display: flex;align-items: center;} #TopicPage .info-list-box p{font-size: var(--fz24);color: var(--connect-text-cr);line-height: 1.5;text-align: left;} #TopicPage .right-info{padding: 0 0.2rem;width: 70%;} #TopicPage .info-img{width: 0.92rem;height: 0.92rem;} #TopicPage .info-list-box .border-info{border: 1px solid #FF799B;border-radius: 0.07rem;display: inline-block;padding: 0 0.4rem 0 0.1rem;margin: 0.08rem 0;} #TopicPage .border-info .detail-text{color: #FF799B;cursor: pointer;position: relative;} #TopicPage .border-info .detail-text::before{content: '→';position: absolute;right: -0.24rem;top: 0;transition: right 0.5s;} #TopicPage .detail-text:hover::before{right: -0.3rem;} /*email content*/ /*logo intro*/ #TopicPage .xppen-box{text-align: center;} #TopicPage .xppen-box img{margin-bottom: 0.2rem;width: 2.27rem;height: 2.56rem;} #TopicPage .xppen-intro{font-size: var(--fz24);color: #8E98B2;line-height: 1.6;text-align: center;margin-top: 0.6rem;} #TopicPage .footer-box{display: flex;justify-content: space-between;flex-wrap: wrap;align-items: center;margin-top: 1.2rem;margin-bottom: 0.6rem;} #TopicPage .footer-box p{width: 25%;border-right: 1px solid;color: var(--main-cr);font-size: var(--fz24);line-height: 2;text-align: center;} #TopicPage .footer-box p:last-child{border-right: none;} #TopicPage .img_arrow-box{text-align: center;margin-bottom: 0.27rem;} /*logo intro*/ /* TP_grid_4 */ #TopicPage .TP_grid_4{width: 100%;height: auto;display: flex;justify-content: space-between;flex-wrap: wrap;} #TopicPage .TP_grid_4box{width: 24%;height: auto;border-radius: 0.24rem;border: 0.08rem solid #31803F;overflow: hidden;margin-bottom: 0.5rem;background: #FFFFFF;} #TopicPage .TP_grid_4boxbox{width: 100%;height: auto;padding: 0.3rem 0.2rem 0;box-sizing: border-box;} #TopicPage .TP_grid_4boxbox a{display: inline-block;margin-bottom: 0.3rem;} #TopicPage .TP_grid_4boxname{text-align: center;font-size: var(--fz24);font-family: Noto Sans CJK JP;font-weight: bold;margin-bottom: 0.04rem;color: #000000;} #TopicPage .TP_grid_4price{text-align: center;font-size: var(--fz24);font-family: Noto Sans CJK JP;font-weight: bold;color: #D21A1A;margin-bottom: 0.2rem;} #TopicPage .TP_grid_4price span{font-size: var(--fz18);font-weight: 400;text-decoration: line-through;color: #666;} #TopicPage .TP_grid_4zk{width: 100%;background-color: #31803F;text-align: center;border-radius: 0.15rem;margin-bottom: -0.02rem;position: relative;} #TopicPage .TP_grid_4zk span{display: inline-block;padding: 0.1rem 0;width: 100%;text-align: center; position: relative;z-index: 2;font-size: var(--fz44);font-family: Noto Sans CJK JP;color: #FFF1C1;line-height: 1.1;font-weight: 900;} #TopicPage .TP_grid_4zk span.span2{position: absolute;top: 0;left: 0;-webkit-text-stroke: 0.03rem #1A4722;} #TopicPage .TP_grid_red .TP_grid_4box{border: 0.08rem solid #BD2727;} #TopicPage .TP_grid_red .TP_grid_4zk {background: #BD2727;} #TopicPage .TP_grid_red .TP_grid_4zk span.span2{-webkit-text-stroke: 0.03rem #941B1B;} /* TP_grid_xin */ #TopicPage .TP_grid_xin{width: 100%;height: auto;position: relative;margin-bottom: 0.65rem;} #TopicPage .TP_grid_xinbox{width: 80%; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);text-align: center;} #TopicPage .TP_grid_xinboxp1{font-size: 0.26rem;font-weight: 400;color: #4E1A00;line-height: 1.3;margin-bottom: 0.24rem;text-align: center;} #TopicPage .TP_grid_xinboxp1 span{color:#D62A29;} #TopicPage .TP_grid_xinboxp2{font-size: 0.6rem;padding: 0 0.15rem;display: inline;background: linear-gradient(180deg, transparent 50%, #EAD9BE 50%);font-weight: 900;color: #045F40;} #TopicPage .TP_grid_xinboxp2 span{color: #D62A29;} #TopicPage .TP_grid_xinboxp3box{margin-top: 0.3rem;margin-bottom: 0.4rem;text-align: center;} #TopicPage .TP_grid_xinboxp3{ display: inline;font-size: 0.2rem;line-height: 2.5;color: #000000;font-weight: 400; border-bottom: 1px solid #000;text-align: center;} #TopicPage .TP_grid_xinboxp4{font-size: 0.3rem;text-align: center;font-weight: bold;color: #4E1A00;} #TopicPage .TP_grid_xinboxp4 span{color: #D62A29;border-bottom: 1px solid #D62A29;display: inline-block;} /* TP_grid_xg */ #TopicPage .TP_grid_xg{width: 100%;height: auto;margin-bottom: 0.8rem;} #TopicPage .TP_grid_xg img{width: 100%; box-shadow: 0px 0px 0.32rem 0px rgba(0,0,0,0.17);} /* TP_grid_wl */ #TopicPage .TP_grid_wl{width: 100%;height: auto;} #TopicPage .TP_grid_wlbox{width: 100%;height: auto;margin-bottom: 0.3rem;} #TopicPage .TP_grid_wlbox1{width: 100%;height: auto;margin-bottom: 0.4rem;} #TopicPage .TP_grid_wlbox2{width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;} #TopicPage .TP_grid_wlbox2 a{display: inline-block; width: 48.5%;height: auto;} /* */ #TopicPage .xmas_kr{width: 100%;height: auto;display: flex;justify-content: space-between;flex-wrap: wrap;padding-bottom: 0.4rem;} #TopicPage .xmas_krbox{width: 48%;height: auto;box-sizing: border-box;box-shadow: 0 0.11rem 0.16rem 0 rgba(0,0,0,0.7);border-radius: 0.4rem;overflow: hidden;margin-bottom: 0.35rem;background: #FFFFFF;border: 0.08rem solid #EC3F59;} #TopicPage .xmas_krtitle{background: #EC3F59;padding: 0.2rem 0;box-sizing: border-box;font-size: 0.36rem;line-height: 1;font-weight: 900;text-align: center;color: #fff;font-family: Noto Sans CJK JP;display: flex;align-items: center;justify-content: center;} #TopicPage .xmas_krtitle img{width: 0.34rem;height: auto;} #TopicPage .xmas_krtitle img:last-child{margin-left: 0.1rem;} #TopicPage .xmas_krtitle img:first-child{margin-right: 0.1rem;} #TopicPage .xmas_krdesc{padding: 0.3rem 0.12rem;font-size: 0.18rem ;line-height: 1.4;font-weight: 400;text-align: center;color: #333333;font-family: Noto Sans CJK JP;border-radius: 0 0 0.4rem 0.4rem;border-top: none;} #TopicPage .xmas_krdesc a{color: #654A11;text-decoration: none;font-size: inherit;} @media screen and (max-width: 768px){ #TopicPage .discount-box.xmas{padding: 0.1rem 0.7rem;} #TopicPage .xmas_krbox{width: 49%;border: 0.05rem solid #EC3F59;} #TopicPage .xmas_krdesc{padding: 0.3rem 0.08rem;} #TopicPage .xmas_krtitle {font-size: 0.24rem;} } /* random_box */ #TopicPage .random_box{width: 100%;height: auto;margin-bottom: 0.7rem;background-color: #fff;} #TopicPage .random_box_img{width: 100%;} #TopicPage .random_box_img img{ max-width: 100%;} #TopicPage .random_box_cont{width: 100%;height: auto;padding: 0.4rem 0.5rem 0.6rem;box-sizing: border-box;} #TopicPage .random_box_title{width: 100%;height: auto;text-align: left;position: relative;margin-bottom: 0.4rem;} #TopicPage .random_box_title span{display: inline-block; background: #6EA5FF;padding: 0.12rem 0.36rem;border-radius: 30px;font-weight: 400;font-family: Noto Sans CJK KR;font-size: 0.3rem;color: #fff;position: relative;z-index: 2;} #TopicPage .random_box_title::after{content: '';position: absolute;width: 100%;height: 1px;background-color: #EAE6E6;left: 0;top: 50%;} #TopicPage .random_box_product{width: 100%;height: auto; display: flex;flex-wrap: wrap; justify-content: space-between;padding: 0 0.4rem;} #TopicPage .Rb_product_text{width: 32%;margin-bottom: 0.5rem;} #TopicPage .Rb_product_text1{color: #000;font-weight: bold;font-size: 0.26rem;margin-bottom: 0.24rem;} #TopicPage .Rb_product_text2{color: #666;font-weight: 400;font-size: 0.26rem;line-height: 1.5;} #TopicPage .Rb_product_text2 span{display: inline-block; color: #EC3F59;} #TopicPage .random_box_desc{padding:0 0.4rem 0.5rem;color: #333333;font-weight: 400;font-size: 0.26rem;border-bottom: 2px solid #EAE6E6;margin-bottom: 0.5rem;} #TopicPage .random_box_desc span{font-size: 0.24rem;color: #4d4d4d;} #TopicPage .random_box_btn{width: 100%;text-align: center; } #TopicPage .random_box_btn a{display: inline-block;padding: 0.15rem 1rem;background: #EC3F59;border-radius: 50px;color: #FFFFFF;font-size: 0.3rem;font-weight: bold;font-family: Noto Sans CJK KR;} @media screen and (max-width: 1500px){ #TopicPage .Rb_product_text{width: 48%;} } @media screen and (max-width: 1500px){ #TopicPage .TP-col-xl.XLcontent_sbg0{ perspective: 1400px; } } @media screen and (max-width: 1200px){ #TopicPage .TP-col-xl.XLcontent_sbg0{ perspective: 1200px; } } @media screen and (max-width: 992px){ #TopicPage .TP-col-xl.XLcontent_sbg0{ perspective: 1000px; } } @media screen and (max-width: 768px){ html{font-size: 100px;font-size: 13.0208vw;} #TopicPage .title-box img { max-width: 80%; width: auto; } #TopicPage .new-2nd-box.L1_content4 .Artist-2nd-list .NY_big_po2, #TopicPage .new-2nd-box.L1_content3 .Artist-2nd-list .NY_big_po2{top: 0.5rem;} #TopicPage .TP_grid_wlbox{max-width: 521px;margin: 0 auto;margin-bottom: 0.3rem;} #TopicPage .TP_grid_wlbox1{max-width: 521px;margin: 0 auto;margin-bottom: 0.4rem;} #TopicPage .TP_grid_wlbox2{max-width: 521px;margin: 0 auto;} #TopicPage .TP_grid_wlbox2 a{width: 100%;} #TopicPage .TP_grid_wlbox2 a:first-child{margin-bottom: 0.4rem;} #TopicPage .TP_grid_xinbox{display: none;} #TopicPage .nav-content-box.module_NavFixed{display: none !important;} #TopicPage .bg-block{display: none;} #TopicPage .mo-block{display: block;text-align: center; margin: 0 auto;} #TopicPage .TP-container .new-gift{margin-bottom: 0.3rem;} #TopicPage .free-list{width: 100%;margin-bottom: 0.5rem;} #TopicPage .intro-remark{font-size: var(--fz30);} #TopicPage .intro-title{font-size: var(--fz36);} #TopicPage .discount-box{bottom: 0;top: initial;left: 50%;transform: translateX(-50%);border-radius: 0.32rem;} #TopicPage .Artist22Plus-sell-list{padding: 0 0.24rem; margin: 0.3rem 0 0.2rem;} #TopicPage .sell-intro .size-title{font-size: 0.2rem;} #TopicPage .size-title span{font-size: 0.3rem;} #TopicPage .sell-intro p{font-size: 0.2rem;} #TopicPage .sell-item_1 .sell-intro {top: 0.2rem;left: 0.23rem;} #TopicPage .sell-col_3 p{font-size: 0.2rem;right: 0.1rem;} #TopicPage .sell-col_3{margin-bottom: 0.24rem;} #TopicPage .sell-col_2 p{font-size: 0.2rem;top: 0.1rem;} #TopicPage .sell-item_4 .sell-col_2 .color-text{width: 1.5rem;} #TopicPage .sell-item_4 .x3-pro-title{font-size: 0.3rem;} #TopicPage .sell-box{right: 0.1rem;} #TopicPage .NY_big_box{background: var(--product-bg1m) no-repeat; background-size: 100% 100%;} #TopicPage .xl-content_bg2 .NY_big_box{background: var(--product-bg2m) no-repeat;background-size: 100% 100%;} #TopicPage .new-col-xl .NY_big_img{width: 50%;height: auto;padding: 0 0.4rem;} #TopicPage .new-col-xl .NY_big_text{width: 50%;height: auto;padding: 0 0.4rem;} #TopicPage .new-col-xl .NY_big_title{text-align: left;font-size: 0.24rem;} #TopicPage .new-col-xl .NY_big_remark{text-align: left;font-size: 0.18rem;} #TopicPage .new-col-xl .NY_big_p2{text-align: left;font-size: 0.24rem;} #TopicPage .NY_big_text{width: 100%;text-align: left;} #TopicPage .NY_big_box{padding: 0.4rem 0 0.7rem;} #TopicPage .NY_big_img{width: 100%;text-align: center; margin-bottom: 0;} #TopicPage .XLcontent_sbg0.new-col-xl .NYB_text_posi{bottom: -12%;} #TopicPage .new-2nd-box .Artist-remark{width: 90%;font-size: 0.14rem;} #TopicPage .NY_big_text p{text-align: center;} #TopicPage .NY_big_title{font-size: var(--fz30);} #TopicPage .sell-point-list{justify-content: center;margin: 0.2rem 0;} #TopicPage .point-item{ margin: 0 0.1rem;} #TopicPage .new-intro-content{ margin: 0;} #TopicPage .Artist-2nd-list{width: 48%;padding: 0.4rem 0 0.2rem;} #TopicPage .Artist-2nd-list .new-icon{top: 0.1rem;left: 0.1rem;} #TopicPage .new-2nd-box{margin-bottom: 0.3rem;} #TopicPage .TP-col-md-item{width: 48%;} #TopicPage .title-box_1{margin: 0.6rem 0 0.5rem;} #TopicPage .Artist-intro-box{text-align: center;} #TopicPage .Artist-intro-box p{text-align: center;font-weight: bold;} #TopicPage .new-list-content .Artist-remark{ display: none; } #TopicPage .buy-button-box{margin: 0.16rem auto 0;} #TopicPage .Artist-list-title span{ font-size: var(--fz36); } #TopicPage .Artist-2nd-content .Artist-intro-box p{margin: 0.05rem 0;} #TopicPage .Artist-intro-box .Artist-remark{font-weight: normal;} #TopicPage .Artist-2nd-content .goods-price{border: none; padding-bottom: 0.1rem;} #TopicPage .NY_big_box .TP-col-item p{font-size: var(--fz24);} #TopicPage .photo-content .info-list-box {width: 100%;margin: 0.2rem 0;} #TopicPage .photo-content{padding: 0.2rem 0.4rem;} #TopicPage .footer-box p{font-size: var(--fz18);} #TopicPage .connect-content{margin-top: 0.5rem;} #TopicPage .footer-box p{width: 48%; margin-bottom: 0.3rem;} #TopicPage .footer-box p:nth-child(2n){border-right: none;} #TopicPage .new-col-xl .NYB_text_posi{bottom: -10%;} #TopicPage .title-box.title_bg1 {background: var(--bg-title1) no-repeat;background-size: cover; background-position: center; margin-bottom: -0.3rem;} #TopicPage .TP_grid_4box{width: 48%;} #TopicPage .TP-grid_2 { background-color: #fff; padding: 0.6rem 0.2rem 0.2rem;} #TopicPage .Artist-name{font-size: 0.24rem;} #TopicPage .title-box h2{font-size: var(--fz36);} #TopicPage .free_gift span {font-size: var(--fz16);} #TopicPage .free_gift img {max-width: 0.95rem;} #TopicPage .free_gift img.last-child {max-width: 0.5rem;} #TopicPage .New3ndBox .L_box{width: 48%;} } /* icon */ #us21_spring .Ch2020_icon{max-width: 12rem;box-sizing: border-box; margin: 0 auto;display: flex;justify-content: center;} #us21_spring .Ch2020_icon a{margin-right: .4rem; display: inline-block;text-decoration: none;padding: .15rem;box-sizing: border-box;line-height: 1;border: 1px solid #FFFFFF;border-radius: .1rem; background: rgba(0, 0, 0, 0.5);transition: all .2s;} #us21_spring .Ch2020_icon a:last-child{margin-right: 0;} #us21_spring .Ch2020_icon a em {font-size: .36rem;color: #fff;font-weight: 400;line-height: 1;transition: all .2s;} #us21_spring .Ch2020_icon a:hover{background: #fff;} #us21_spring .Ch2020_icon a:hover .x5_fb{color: #385899;} #us21_spring .Ch2020_icon a:hover .x5_tw{color: #00aced;} #us21_spring .Ch2020_icon a:hover .x5_in{color: #e20c35;} #us21_spring .Ch2020_icon a:hover .x5_yt{color: #ff011d;} #us21_spring p{font-size: .36rem;font-family: HYQiHei;font-weight: normal;color: #A87F56;text-align: center;margin:.44rem 0;} #us21_spring .Ch2020_icon {padding-bottom: 0.1rem;} #us21_spring .icon-list-item {display: inline-block;vertical-align: top;margin-right: 0.4rem;text-align: center;} #us21_spring .Ch2020_icon a {margin-right: 0;} #us21_spring .icon-list-item span {display: inline-block;margin-top: 10px;font-size: 0.14rem;color: #A87F56;} #us21_spring .Ch2020_icon img {max-width: 0.36rem;height: auto;} @media screen and (max-width: 768px ){ #us21_spring .Ch2020_icon{padding: 0rem .2rem 0rem;} } @media screen and (max-width: 480px ){ #us21_spring .Ch2020_icon a em {font-size: .3rem;} #us21_spring .Ch2020_icon img {max-width: 0.3rem;height: auto;} } @media screen and (max-width: 400px ){ #us21_spring .Ch2020_icon a { padding: .15rem;} }