@charset "utf-8"; /* 컨텐츠 공통 (s) ****************************************************/ .contents h1 {margin-bottom:40px; font-size:var(--F40); line-height:48px; color:var(--gray900); text-align:center} .contents h1 a {float:right; margin-top:7px;} .contents h1 a + a {margin-right:10px;} .contents h1 .btn_wrap {float:right;} .contents h1 .btn_wrap .btn {float:left !important; width:68px; height:18px; margin-left:8px; line-height:18px;} /*.contents h1 + section {margin:28px auto 0;}*/ .contents h1 + section.edit {width:640px; margin-left:0; margin-right:0;} .contents > .banner {margin-bottom:20px;} .contents > .banner ~ section {margin-top:120px;} /*#189930*/ .contents > section ~ section {margin-top: 80px;} .contents > .cate-imgtxt-banner + .list_Wrap {margin-top:120px;} /*#189930*/ .contents section > h3 {display:inline-block; margin:0 0 40px; height:50px; line-height:50px; color:var(--gray900); font-size:29px !important;} .contents section > h3 > #updtStdrDt, .contents section > h3 > .updtStdrDt {position:absolute; right:0; margin-left:20px; color:var(--gray600); font-size:var(--F17);} .contents section > .sort {margin-top:18px; float:right;} .contents section > .sort ul li {float:left; line-height:26px; font-size:var(--F21);} .contents section > .sort ul li + li {margin-left:30px;} .contents section > .sort ul li.on {border-bottom:2px solid var(--purple400);} .contents section > .sort ul li.on a {color:var(--purple400);} .contents section > .sort a {color:var(--gray600);} .contents section + p.txt-center {margin-top:20px;} .contents.evt .date, .contents.mz .date {margin-top:39px;} .contents.evt .date + section, .contents.mz .date + section {margin-top:-21px;} .contents .sub_txt + section {margin-top:60px;} .wrap.main .contents section > .sort, .wrap.inshop .contents section > .sort {margin-right:60px;} /* 컨텐츠 공통 (e) ****************************************************/ /* 컨텐츠 기타 (s) ****************************************************/ section.item_typeA > .list_goods > ul > li a .txt {display:block; margin-bottom:40px; height:142px;} section.item_typeA > .list_goods > ul > li a .txt > span {display:block; margin:24px 0 10px; max-height:84px; line-height:42px; color:var(--gray900); font-size:29px; overflow:hidden;} section.item_typeA > .list_goods > ul > li a .txt > em {display:block; max-height:48px; line-height:var(--F15LL); color:var(--gray800); font-size:var(--F15); overflow:hidden;} section.item_typeB > .list_goods > ul > li img {margin-left:15%; width:78%;} section.item_typeB > .list_goods > ul > li a .txt {display:block; margin-top:-52px; margin-bottom:40px; height:142px;} section.item_typeB > .list_goods > ul > li a .txt > span {display:block; margin:24px 0 10px; max-height:84px; line-height:42px; color:var(--gray900); font-size:37px; font-weight:bold; overflow:hidden;} section.item_typeB > .list_goods > ul > li a .txt > em {display:block; max-height:48px; line-height:24px; color:var(--gray800); font-size:var(--F17); overflow:hidden;} section.item_typeC > .list_goods {padding:0;} section.item_typeC > .list_goods > ul {margin:0;} section.item_typeC > .list_goods > ul > li {margin:0; width:33.33%;} section.item_typeC > .list_goods > ul > li a .txt {position:absolute; bottom:0; padding:40px 50px; width:calc(100% - 120px); color:var(--gray900);} section.item_typeC > .list_goods > ul > li a .txt.white {color:var(--white);} section.item_typeC > .list_goods > ul > li a .txt > span {display:block; margin:24px 0 10px; max-height:84px; line-height:42px; font-size:37px; font-weight:bold; overflow:hidden;} section.item_typeC > .list_goods > ul > li a .txt > em {display:block; width:100%; line-height:24px; font-size:var(--F17); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.item_special > .list_goods {padding:0;} section.item_special > .list_goods > ul {margin:0;} section.item_special > .list_goods > ul > li {margin:0; width:50%;} section.item_special > .list_goods > ul > li a .txt {position:absolute; bottom:0; padding:50px; width:calc(100% - 120px); color:var(--gray900);} /* 전시배너 TEXT 색상 반영 */ section.item_special > .list_goods > ul > li a .txt.white, section.item_special > .list_goods > ul > li a .txt.white * {color:var(--white);} /* 전시배너 TEXT 색상 반영 */ section.item_special > .list_goods > ul > li a .txt > span {display:block; position:relative; margin:24px 0 10px; width:100%; line-height:42px; font-size:37px; font-weight:bold; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.item_special > .list_goods > ul > li a .txt > em {display:block; width:100%; line-height:32px; font-size:25px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.shop_info .banner {position:relative; width:100%; height:170px; overflow:hidden;} section.shop_info .banner img {position:absolute; left:50%; margin-left:-960px; width:1920px; height:160px; max-width: none;} section.instagram h3 {padding-left:56px; font-size:37px; background:url("../images/ui/ico_instagram.png") no-repeat left center;} section.instagram .tag a {position:absolute; margin-top:-60px; right:0; width:60px; height:60px;} section.instagram .tag .balloon {display:block; position:absolute; right:0; bottom:55px; height:0; margin-right:23px; padding-bottom:7px; background:url('../images/ui/bg_tag_balloon.png') no-repeat right bottom; opacity:0; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} section.instagram .tag .balloon span {display:inline-block; margin-right:-23px; padding:8px 10px; color:var(--white); background:#282726; cursor:default;} section.instagram .tag:hover .balloon {display:block; height:35px; opacity:1;} section.instagram .list_goods > ul > li .angle {display:block; position:relative; width:0; height:0; padding-right:100%; padding-bottom:100%; overflow:hidden; background-size:cover !important; background-position:center center;} section.product .banner {position:relative; width:100%; height:660px; overflow:hidden;} section.product .banner.h510 {height:510px;} section.product .banner > ul {position:absolute; left:50%; transform:translate(-50%, 0);} section.product .banner img {width:auto; max-width:none;} section.product .banner + .sort {margin:30px 60px; width:calc(100% - 120px); text-align:right;} section.product .banner + .sort ul {display:inline-block;} section.product .banner + .sort:after {display:block; clear:both; content:'';} section.product .banner + .list_goods {margin-top:60px;} /* 경품처리 제외기간 설정 */ .day_off {height:62px; text-align:left; border-left:3px solid var(--gray250);} .day_off div {position:absolute; margin-top:-5px; padding-left:16px;} .day_off div span {display:block; line-height:22px; color:var(--purple400); font-size:var(--F14);} .day_off div em {display:block; margin-top:6px; line-height:20px; color:var(--gray600); font-size:var(--F13);} section.detail .goods_detail .notice .day_off {margin-bottom:40px;} .btn.carry {display:block; height:40px; line-height:40px; font-size:var(--F15); border:1px solid var(--gray250) !important;} .btn.carry span {position:relative; padding:0 15px; background:var(--white) url(../images/ui/btn_down.svg) no-repeat right 5px/10px auto;} .btn.carry span em {font-weight:bold;} .btn.carry.on span {background:var(--white) url(../images/ui/btn_up.svg) no-repeat right 5px/10px auto;} .carry_prd {visibility:hidden; position:absolute; z-index:5; width:442px; background:var(--white);} .carry_prd .tastes {margin-top:20px !important; width:442px !important; background:var(--white);} .carry_prd .tastes .list_goods.slider .lSAction {top:-10px !important;} .carry_prd .tastes .list_goods ul li .info .brand, .carry_prd .tastes .list_goods ul li .info .brand_year {font-size:var(--F14); font-weight:bold; color:var(--gray900);} .carry_prd .tastes .list_goods ul li .info .price {font-size:var(--F14); font-weight:normal; color:var(--gray900);} .carry_prd .tastes .list_goods ul li {width:141px;} .carry_prd .tastes .list_goods.slider .lSAction {z-index:1;} .list_Wrap h4 {display:inline-block; height:40px; line-height:40px; font-size:33px; color:var(--gray900);} .list_Wrap h4 .brand {font-size:29px;} .list_Wrap h4 small {margin-left:14px; color:var(--gray600); font-size:25px;} .list_wrap > ul > li {padding:0 0 0 10px; line-height:20px; text-indent:-10px;} .list_wrap > ul > li.notice {color:var(--purple400);} .list_wrap > ul > li:before {content:"· ";} .list_wrap > ul > li.notice:before {content:"! ";} .list_wrap.hyphen > ul > li:before {content:"- ";} .list-leadin + .list_Wrap {margin-top:0 !important;} .delivery_wrap {margin-top:29px; padding-top:16px; border-top:1px solid var(--gray250);} .delivery_txt {color:var(--gray600);} .delivery_txt .stxt {display:block; line-height:19px; color:var(--gray600);} .delivery_txt .tip {vertical-align:1px;} .remote_wrap.p2 .delivery_txt .stxt{color: var(--purple400); font-size:var(--F13); line-height: var(--F13L);} .size_wrap .mysize, .prd_wrap .mysize {margin-top:0; margin-bottom:9px; color:var(--gray600);} .size_wrap .mysize a, .size_wrap .mysize span, .prd_wrap .mysize a, .prd_wrap .mysize span {display:inline-block; color:var(--gray600);} .size_wrap .mysize a.accept, .prd_wrap .mysize a.accept {padding-right:20px; background:url("../images/ui/ico_mysize_accept.png") no-repeat right center;} .size_wrap .mysize a.outset, .prd_wrap .mysize a.outset {padding-right:20px; background:url(../images/ui/btn_finder.svg) no-repeat right center/11px 11px;} .size_wrap .mysize em, .prd_wrap .mysize em {color:var(--gray600);} .size_wrap .mysize em + em:before, .prd_wrap .mysize em + em:before {content:' · ';} .prd_wrap {margin-top:27px;} .prd_wrap + .prd_wrap {margin-top:37px;} .prd_wrap .select + .select {margin-top:6px;} .prd_wrap .select > a label:after {right:5px;} .prd_wrap.sel_btn {position:relative; padding-right:106px;} .prd_wrap.sel_btn .size_go {position:absolute; top:37px; right:0; display:inline-block; width:100px; height:52px; line-height:50px; padding:0; letter-spacing:-0.3px; font-size:var(--F14); text-align:center; background:var(--gray250);} .remote_wrap {display:none;} .remote_wrap.on {display:block;} .item_wraps {margin-top:26px;} .item_box {position:relative; margin-top:19px; padding-top:16px; border-top:1px solid var(--gray250);} .item_box .options span {font-size:var(--F14); color:var(--gray900);} .item_box .options span.cssf {padding-left:3px; color:var(--purple400) !important;} .item_box .options span.cssf span {color:var(--purple400);} .item_box .btn_remove {position:absolute; top:8px; right:0; width:20px; height:20px; font-size:0; background:url('../images/ui/btn_x_gray.svg') no-repeat center; background-size:15px auto;} .item_box .item_price {float:right; margin-top:-28px; color:var(--gray900); font-size:var(--F14);} .item_box .item_price span {font-size:19px;} .item_box.disabled .options, .item_box.disabled .options span, .item_box.disabled .item_price, .item_box.disabled .item_price span {color:var(--gray400);} .total_price {margin-top:19px; padding-top:34px; border-top:1px solid var(--gray250); font-size:var(--F17); color:var(--purple400); text-align:right; font-weight:bold;} .total_price em {font-size:var(--F14); font-weight:bold; padding-right:6px;} .total_price span {font-size:27px; font-weight:bold; color:var(--purple400);} label.switch {display:inline-block; position:relative; width:78px; height:20px; margin-left:10px; border:1px solid #d5d5d5; vertical-align:middle;} label.switch input[type=checkbox] + .slider {position:absolute; top:-1px; left:39px; z-index:10; width:40px; height:22px; background-color:#959595; transition:all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} label.switch input[type=checkbox]:checked + .slider {top:-1px; left:-1px; background-color:var(--purple400);} label.switch span + span {position:relative; z-index:20; float:left; width:50%; height:20px; font-weight:bold; font-size:var(--F12); color:var(--white); line-height:20px; text-align:center;} .grid_wrap { width:100%; font-size:var(--F14); } .grid_wrap td.toggle {cursor:pointer;} .grid_wrap tr.detail {display:none;} .grid_wrap tr.on + tr.detail {display:table-row;} .grid_wrap tr.detail td {padding-left:118px; text-align:left;} .grid_wrap tr.detail.type_1 td {position:relative; padding:0;} .grid_wrap tr.detail.type_1 td .cmt_wrap {margin:0; padding:0;} .grid_wrap tr.detail td p {font-size:var(--F14); color:var(--gray900); line-height:22px;} .grid_wrap tr.detail td .img {display:block; width:674px; margin-top:30px;} .grid_wrap tr.detail td .img img {margin-top:30px;} .grid_wrap tr.detail td .img img:first-child {margin-top:0;} .grid_wrap tr.detail .review_info {display:table; width:100%; margin-top:30px;} .grid_wrap tr.detail .review_info dl {display:table-cell; margin-top:30px; padding:0; width:674px;} .grid_wrap tr.detail .review_info dt {display:inline-block; clear:none; width:60px; font-size:var(--F14); color:var(--gray800);} .grid_wrap tr.detail .review_info dt.clear {clear:both; margin-left:0;} .grid_wrap tr.detail .review_info dd {display:inline-block; width:80px; vertical-align:middle;} .grid_wrap tr.detail .review_info dd + dt {margin-left:60px;} .grid_wrap tr.detail .review_info dd span {font-size:var(--F14); color:var(--gray800);} .grid_wrap tr.detail .review_info dd .star {margin:10px 0;} .grid_wrap tr.detail .btn_wrap {display:table-cell; vertical-align:middle; text-align:right;} .grid_wrap th { padding:12px 0; line-height:20px; color:var(--gray800); vertical-align:top; vertical-align:middle; font-weight:normal; background:var(--white); border-bottom:1px solid #959595; text-align:center;} .grid_wrap th span:not(.date) + span {margin-left:15px;} .grid_wrap th span .btn {width:80px; height:18px; margin-left:10px; padding:0; border-color:#d5d5d5; font-size:var(--F12); color:var(--gray600); line-height:var(--F12L); vertical-align:middle;} .grid_wrap th .date {display:inline-block; width:120px; color:var(--gray900); font-size:var(--F17); font-weight:bold; } .grid_wrap th .shop {margin-left:5px; font-weight:bold; } .grid_wrap th > a {float:right; padding-right:12px; color:var(--gray600); background:url(../images/ui/btn_next.svg) no-repeat 100% 50% / 6px auto;} .grid_wrap th a.map {display:inline-block; float:none; margin-left:8px; padding:0 10px; height:18px; line-height:var(--F12L); vertical-align:bottom; color:var(--gray800); font-size:var(--F12);} .grid_wrap td {padding:25px 0; line-height:18px; color:var(--gray600); vertical-align:middle; text-align:center; border-bottom:1px solid var(--gray250); } .grid_wrap tr:first-child td {border-top:1px solid var(--gray900);} .grid_wrap td.v-top {vertical-align:top !important;} /* #229628 */ .grid_wrap td img {margin-right:18px; float:left; width:100px;} .grid_wrap td.delete {width:auto; padding-left:0;} .grid_wrap td.delete a {display:inline-block; overflow:hidden; width:16px; height:16px; padding:5px; background:url(../images/ui/btn_x_gray.svg) no-repeat center center/16px 16px; font-size:0; } .grid_wrap td:last-child.star_td {padding-left:0; text-align:center;} .grid_wrap td.star_td .txt {display:block; margin-bottom:6px; color:var(--purple400); line-height:12px;} .grid_wrap td .disabled {display:inline-block; width:93px; height:35px; line-height:35px; font-size:var(--F14); color:#a4a4a4; border:1px solid var(--gray250); box-sizing:border-box; } .grid_wrap .order_th {text-align:left;} .grid_wrap .order_th span {display:inline-block; margin-left:15px; color:var(--gray800);} .grid_wrap .order_th span em {font-weight:bold; } .grid_wrap .order_th span.fitting {color:#50507a;} .grid_wrap .order_th span.fitting em {margin-right:5px; padding:2px 10px 3px; font-size:var(--F13); border:1px solid #50507a;} .grid_wrap .order_th span.funding {position:relative; color:var(--gray800);} .grid_wrap .order_th span.funding em {margin-right:5px; padding:2px 10px 3px; color:#2c2ca9; font-size:var(--F13); border:1px solid #2c2ca9;} .grid_wrap .order_th .funding .card {position:relative;} .grid_wrap .order_th .funding .card > .btn {display:inline-block; position:absolute; top:0; right:0; width:110px; line-height:28px; height:30px; color:var(--white); background:var(--gray900); border-color:var(--gray900); } .grid_wrap .order_th .funding .card > .cssf {display:block; margin-top:18px; font-size:var(--F15);} .grid_wrap .order_th .funding .funding_payment {margin-top:16px; padding-top:13px; border-top:1px solid var(--gray250);} .grid_wrap .order_th .funding .funding_payment > h3 {color:var(--gray900); font-size:var(--F15);} .grid_wrap .order_th .funding .funding_payment > p {margin-top:5px; color:var(--gray800); font-size:var(--F15);} .grid_wrap .order_th .funding .funding_payment > p strong {color:var(--gray900);} .grid_wrap .order_th .funding .funding_payment > p span {color:var(--gray600); font-size:var(--F15);} .grid_wrap .order_th span.gift em {margin-right:5px; padding:2px 10px 3px; font-size:var(--F13); color:var(--white); background:#a155db;} /*//#134519 : 선물하기*/ .grid_wrap .order_th span.appendix em {margin-right:5px; padding:2px 10px 3px; color:var(--gray900); font-size:var(--F13); border:1px solid var(--gray900);} /*//#137222 : 사은품 행사 셀링 강화*/ .grid_wrap .order_th .date {width:100px; margin-left:0; font-size:var(--F16); color:var(--gray900); font-weight:normal} .grid_wrap .order_th .btn_arr {float:right; padding-right:14px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/ auto 12px; color:var(--gray600);} .grid_wrap .order_th .btn {margin-left:15px; padding:0; width:80px; height:18px; font-size:var(--F11); color:var(--gray600); vertical-align:middle; line-height:18px; border:none;} .grid_wrap .order_th .order_to {margin-top:12px; line-height:22px;} .grid_wrap .order_th .order_to .name {margin-left:0; color:var(--gray800); font-size:var(--F14);} .grid_wrap .order_th .order_to .name em {display:inline-block; margin-left:10px;} .grid_wrap .order_th .order_to > a {float:right; padding-right:18px; color:var(--gray600); background:url(../images/ui/btn_down_gray.svg) no-repeat right center/10px auto; } .grid_wrap .order_th .order_to.on > a {background-image:url(../images/ui/btn_up_gray.svg)} .grid_wrap .order_th .order_to .detail {display:none; position:absolute; margin-top:12px; padding:20px; width:920px; background:#fafafa; z-index:1} .grid_wrap .order_th .order_to.on .detail {display:block;} .grid_wrap .order_th .order_to .detail .btn {float:right; margin-top:7px; width:110px; height:29px; vertical-align:middle; font-size:var(--F13); color:var(--gray800); vertical-align:middle; line-height:29px;} .grid_wrap .order_th .fitting em {margin-right:5px; padding:2px 10px 3px; vertical-align:top; color:#50507a; font-size:var(--F13); border:1px solid #50507a;} .grid_wrap .order_th .funding, .grid_wrap .order_th .fitting {margin-bottom:4px;} .grid_wrap .order_th .funding span, .grid_wrap .order_th .fitting span {margin-left:0px; color:#50507a;} .grid_wrap td.none, .grid_wrap.list td.none {padding:150px 0; font-size:var(--F14); color:var(--gray600); text-align:center;} .grid_wrap td.txt-right {text-align:right;} .grid_wrap .checkbox > label {margin-right:0; height:20px; line-height:20px;} .grid_wrap .checkbox > label i {margin-top:0;} .grid_wrap .list_goods {display:block; position:relative; width:100px; height:133px;} .grid_wrap .list_goods img {float:none; margin-right:0; width:100px;} .grid_wrap .list_goods .keep {right:21px; margin-top:-35px;} .grid_wrap .add {width:17px; height:23px; background:url("../images/ui/bg_arrow_low.png") no-repeat 0 25px;} .grid_wrap .add .checkbox {display:none;} .grid_wrap .status span {display:block; width:100%; color:#a6a6a6; font-size:var(--F13); word-break: keep-all;}/* #176650 수정 */ .grid_wrap .status.c444 span {color:var(--gray800);}/* #173845 수정 */ .grid_wrap .status span + span {margin-top:8px;} .grid_wrap a.btn + .quantity {position:absolute; margin-left:5px;} .grid_wrap .quantity {display:inline-block; margin-top:14px; border:1px solid var(--gray250);} .grid_wrap .quantity input[type=number] {margin:0; padding:0 5px; height:25px; line-height:25px; font-size:var(--F13); border:0;} .grid_wrap .quantity em {font-size:var(--F13);} .grid_wrap .quantity .minus, .grid_wrap .quantity .plus {top:3px; height:18px; line-height:18px; font-size:var(--F13);} .grid_wrap .quantity .plus {left:61px; right:auto;} .grid_wrap .quantity .apply {display:inline-block; padding:0 12px 0 6px; vertical-align:middle; color:var(--gray800); font-weight:bold; } .grid_wrap .info .disabled, .grid_wrap .quantity.disabled {width:inherit; height:inherit; line-height:inherit;} .grid_wrap .txt-quantity {display:block; margin-top:8px; color:var(--gray900);} .grid_wrap a.btn {display:inline-block; width:108px; min-width:72px; padding:0; font-size:var(--F13); line-height:26px} .grid_wrap td:last-child a.btn + a.btn {margin-top:4px;} .grid_wrap td:last-child a.btn.alarm {padding:6px 0; height:32px; line-height:16px; border-color:var(--gray800); background-color:var(--gray800); color:var(--white);} .grid_wrap .soldout {display:block; margin-top:8px; color:var(--purple400);} .grid_wrap .benefits {display:inline-block; min-width:160px; text-align:left; color:var(--gray800);} .grid_wrap .benefits > a {height:16px; line-height:16px; font-size:var(--F13); font-weight:bold; } .grid_wrap .benefits > a + a {display:block !important; margin-top:8px !important;} .grid_wrap .benefits .group_discount {display:inline-block; margin:0 auto; padding-left:26px; color:var(--purple400); background:url("../images/ui/ico_group_discount.png") no-repeat left center;} .grid_wrap .benefits .view_coupon {display:inline-block; margin:0 auto; padding-left:26px; color:var(--purple400); background:url("../images/ui/ico_view_coupon.png") no-repeat left center;} .grid_wrap .benefits p + .group_discount, .grid_wrap .benefits p + .free_fitting, .grid_wrap .benefits p + .view_coupon {margin:11px auto 0;} .grid_wrap .shipping span {display:block;} .grid_wrap .shipping em {color:#2c2ca9;} .grid_wrap .price {font-size:var(--F15); color:var(--gray800); font-weight:bold; } .grid_wrap .post_info {padding-top:50px; text-align:left; color:var(--gray900); font-size:var(--F14);} .grid_wrap .post_info > span {display:inline-block; width:124px;} .grid_wrap .info {max-width:350px; padding-right:10px; text-align:left; overflow:hidden;} .grid_wrap .info strong {display:block; margin-bottom:10px; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L); font-weight:bold;} .grid_wrap .info .brand, .grid_wrap .info .name, .grid_wrap .info .option, .grid_wrap .info .coin_txt, .myReview .info .brand, .myReview .info .option, .myReview .info .name {display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#8e8e8e;} .grid_wrap .info .coin_txt { color:var(--gray800); line-height:var(--F14L); font-size:var(--F14); margin-top:20px;} .grid_wrap .info .option * {color:var(--gray600);} .grid_wrap .info .option .color {display:inline-block; vertical-align:middle;} .grid_wrap .info .option .color span {display:inline-block; vertical-align:middle; width:12px; height:12px;} .grid_wrap .info .free_fitting {margin-top:10px} .grid_wrap .info a.btn {margin-top:14px; padding:0; width:72px; font-size:var(--F13); line-height:23px;} .grid_wrap .info .title {display:inline-block; overflow:hidden; max-width:100%; margin-top:15px; height:20px; color:var(--gray900); line-height:20px; white-space:nowrap; text-overflow:ellipsis; cursor:pointer; width:100%; background:url(../images/ui/btn_down_gray.svg) no-repeat right center / 12px auto;} .grid_wrap .info .title.photo {padding-right:26px; box-sizing:border-box; background:url("../images/ui/bg_photo.png") no-repeat 100% 50%;} .grid_wrap .info .qna_txt {display:inline-block; padding-top:20px;} .grid_wrap .info .qna_txt em {display:inline-block; width:70px; font-weight:bold; color:var(--purple400);} .grid_wrap .info .qna_txt .title {display:inline-block; overflow:hidden; position:relative; max-width:195px; padding-right:20px; background:url(../images/ui/btn_down_gray.svg) no-repeat 100% 4px/12px auto; color:var(--gray800); white-space:nowrap; text-overflow:ellipsis; line-height:16px; vertical-align:top; cursor:pointer; width:inherit; margin-top:1px;} .grid_wrap .info .qna_txt .title.lock {max-width:165px; padding-right:50px; margin-top:1px;} .grid_wrap .info .qna_txt .title.lock:after {position:absolute; top:0; right:20px; width:20px; height:20px; background:url("../images/ui/bg_lock.png") no-repeat 0 0; content:'';} .grid_wrap .info i.offline {position:absolute; margin:0 0 0 5px !important;} .grid_wrap .on .info .title {background-image:url(../images/ui/btn_up_gray.svg)} .grid_wrap .on .info .qna_txt .title {background-image:url(../images/ui/btn_up_gray.svg);} .grid_wrap .on td {padding-bottom:10px !important; border-bottom:0 !important;} .grid_wrap .info i.best, .grid_wrap .info i.review, .grid_wrap .info i.experience {margin:0 5px !important;} /* 체험단 리뷰 이벤트 */ .grid_wrap .info i.best + i.review {margin-left:0 !important;} .grid_wrap .info .first-review {position:absolute; color:var(--purple400);} .grid_wrap .info .title .txt {display:inline-block; max-width:400px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .grid_wrap .info .title .txt.photo {padding-right:26px; box-sizing:border-box; background:url("../images/ui/bg_photo.png") no-repeat 100% 50%;} /* [22년 1분기] 선물 포장 서비스 개선 */ .grid_wrap .info .txt-packing {display:block; margin-top:11px;} .grid_wrap .info .txt-packing i {font-size:var(--F14); line-height:18px;} .grid_wrap .info .txt-packing i ~ i {margin-left:11px;} /* [22년 1분기] 선물 포장 서비스 개선 */ .grid_wrap .soldout {display:block; margin-top:8px; color:var(--purple400);} .grid_wrap .packing {display:block; margin-top:15px;} .grid_wrap .packing i + i {margin-left:15px;} .grid_wrap .packing i:first-child {margin-left:0;} .grid_wrap .service {display:block; margin-top:15px; margin-bottom:10px;} .grid_wrap .service em + .free_fitting {margin-left:18px;} .grid_wrap .service > p {margin-bottom:10px; color:var(--gray900); font-size:var(--F14);} .grid_wrap .service > em {font-size:var(--F14);} .grid_wrap .service > em + em:before {content:'/';} .grid_wrap .service .group_discount {margin-left:20px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_group_discount.png") no-repeat left center;} .grid_wrap .service .global_shipping {margin-left:20px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_global_shipping.png") no-repeat left center;} .grid_wrap .group_discount {margin-top:10px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_group_discount.png") no-repeat left center;} .grid_wrap span.group_discount {padding-left:0 !important; background:none !important;} .grid_wrap .global_shipping {margin-top:10px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_global_shipping.png") no-repeat left center;} .grid_wrap span.global_shipping {padding-left:0 !important; background:none !important;} .grid_wrap .group_discount + .global_shipping {margin-left:20px;} .grid_wrap .family_discount {margin-top:10px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_group_discount.png") no-repeat left center;} .grid_wrap span.family_discount {padding-left:0 !important; background:none !important;} .grid_wrap .family_discount + .group_discount, .grid_wrap .family_discount + .global_shipping {margin-left:20px;} .grid_wrap .go_styling {display:block; margin-top:15px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_go_styling.png") no-repeat left center;} /* 사은품 행사 셀링 강화*/ .grid_wrap .appendix {display:block; width:fit-content; margin-top:15px; padding-left:26px; color:var(--purple400); font-weight:bold; background:url("../images/ui/ico_appendix.png") no-repeat 2px center;} /* 사은품 행사 셀링 강화*/ .grid_wrap dl {padding:0 20px;} .grid_wrap dl:after {display:block; clear:both; content:"";} .grid_wrap dl dt, .grid_wrap dl dd {float:left; padding:4px 0; line-height:36px;} .grid_wrap dl dt {clear:both; width:76px; text-align:left;} .grid_wrap dl dd {width:194px; text-align:left;} .grid_wrap dl dd .quantity {display:block; position:relative; margin-top:0; border:0 none; text-align:left;} .grid_wrap dl dd .quantity input[type=number] {padding:5px 15px; border:0 none; text-align:left;} .grid_wrap dl dd .quantity a {display:inline-block; right:0; overflow:hidden; width:36px; height:36px; background:url("../images/ui/bg_quantity.png") no-repeat 0 0; white-space:nowrap; text-indent:100%;} .grid_wrap dl dd .quantity .minus {right:0; left:auto; background-position:-36px 0;} .grid_wrap dl dd .quantity .plus {right:40px; left:auto;} .grid_wrap dl dd .quantity .minus, .grid_wrap dl dd .quantity .plus {height:36px;} .grid_wrap td dl dd .select > a label {color:var(--gray600); font-size:var(--F14);} .grid_wrap td dl dd .select:nth-child(1n+3) {margin:5px 0 0 0;} .grid_wrap td dl dd .select:nth-child(2n+4) {margin-left:1px;} .grid_wrap dl dd .input_box input[type="text"] {font-size:var(--F13);} .grid_wrap dl dd .select + .select {margin-left:1px;} .grid_wrap dl dd .select + .input_box {display:block; margin-top:5px; width:192px;} .grid_wrap dl dd .select + textarea {display:block; margin-top:10px; padding:9px 6px; min-height:18px; width:180px; height:18px; line-height:18px; font-size:var(--F13); border-color:var(--gray250);} .grid_wrap .defect {display:block; margin:26px 0 0 -18px; } .grid_wrap .defect .file_wrap .file_img + .file_img {margin-left:10px;} .grid_wrap .defect .file_wrap:after {display:block; clear:both; content:'';} .grid_wrap .defect ul {margin-top:20px;} .grid_wrap .defect ul li {padding-left:6px; text-indent:-6px; line-height:22px; text-align:left;} .grid_wrap .defect ul li:before {content:'· ';} .grid_wrap.addr {margin-top:0; border-bottom:1px solid #959595;} .grid_wrap.addr + .grid_wrap {margin-top:88px;} .grid_wrap.addr td {padding:60px 0; border:0 none; vertical-align:top;} .grid_wrap.addr td:last-child {vertical-align:middle;} .grid_wrap.addr strong {display:block; font-weight:bold; font-size:18px; color:var(--gray900); line-height:24px; text-align:left;} .grid_wrap.addr p {font-size:var(--F14); line-height:24px; text-align:left;} .grid_wrap.addr p b {font-size:var(--F15); font-weight:bold; } .grid_wrap.addr p + p {margin-top:24px;} .grid_wrap.addr p span {display:block;} .grid_wrap.addr p b + span {display:inline-block; margin-left:5px;} .grid_wrap.addr .attach {margin-top:10px; color:var(--gray600); line-height:24px;} .grid_wrap.addr .dawn-memo{margin-top:10px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}/* #205947 */ .grid_wrap.addr .input_select {margin-top:20px; text-align:left;} .grid_wrap.addr .input_select + p {margin-top:14px;} .grid_wrap.addr a.btn {display:inline-block; width:108px; font-size:var(--F13); color:var(--white); background:var(--gray900); border-color:var(--gray900);} .grid_wrap.addr tr + .number_acconut td {border-top:1px solid #959595;} .grid_wrap.addr .number_acconut td {text-align:left;} .grid_wrap.addr .number_acconut td > p {color:var(--gray600); font-size:var(--F14);} .grid_wrap.addr .number_acconut td > a.btn {display:block; margin:10px 0 0 90px;} .grid_wrap.addr .number_acconut td dl {margin-top:10px; padding:0;} .grid_wrap.addr .number_acconut td dl + .btn {display:inline-block; line-height:28px; font-size:var(--F13); color:var(--gray800); background:var(--white); border-color:#d5d5d5;} .grid_wrap.addr .number_acconut td dl dt {width:90px; line-height:30px; color:var(--gray800); font-size:var(--F15); font-weight:bold; } .grid_wrap.addr .number_acconut td dl dd {width:280px; line-height:30px;} .grid_wrap.addr .number_acconut td dl dd .select, .grid_wrap.addr .number_acconut td dl dd .input_box input {font-size:var(--F14);} .grid_wrap.addr .info {padding-top:40px; color:var(--gray800); text-align:left; font-size:var(--F14); border-top:1px solid var(--gray250);} .grid_wrap.addr .info > ul {margin-top:16px;} .grid_wrap.addr .info > ul li {line-height:20px; color:var(--gray600);} .grid_wrap .caution {margin:18px 0 0 20px; } .grid_wrap .pass_grid {display:block; margin-bottom:18px; width:100%; height:20px;} .grid_wrap .pass_grid .caution {position:absolute; margin-left:0; color:var(--gray600); background: url(../images/base/bg_caution_gray.png) no-repeat left 1px; font-size:var(--F14); font-weight:bold; } .grid_wrap .step {position:absolute;} .grid_wrap .step span {display:block; float:left; font-weight:normal; color:#a6a6a6; }/* #173845 수정 */ .grid_wrap .step span:after {display:inline-block; width:22px; height:18px; vertical-align:top; background:url(../images/ui/btn_next_gray.svg) no-repeat center 3px/6px auto; content:''} .grid_wrap .step span.on {color:var(--purple400);}/* #173845 수정 */ .grid_wrap .step span.on:after {background-image:url(../images/ui/btn_next_em.svg)} .grid_wrap .step span:last-child {padding:0; background:none;} .grid_wrap .step + .info {margin-top:40px;} .myReview .info .brand, .myReview .info .option, .myReview .info .name {display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#8e8e8e;} .myReview .info .option em {color:#8e8e8e;} .myReview .info .option .color {vertical-align:-2px;} .myReview .info .option .color span {display:inline-block; height:14px; width:14px;} .grid_wrap .info .name, .myReview .info .brand, .myReview .info .name { color:var(--gray900); line-height:var(--F14L); font-size:var(--F14); margin-bottom:6px;} .goods_container {position:relative;} .goods_container .loading {position:absolute; top:0; width:100%; height:100%; min-height:500px; background:rgba(255, 255, 255, 0.9);} .goods_container .loading .loadGif {position:absolute; width:100%; height:100%;} .goods_container .loading .loadGif img {position:absolute;} .goods_container .loading .loadMsg {display:block; position:absolute;} .goods_container .list_goods > ul {display:flex;flex-wrap:wrap;}/* #203126:20230425 */ /* #174179 컨텐츠 기타 (e) ****************************************************/ /* #174179 전체 브랜드 (s) ****************************************************/ .brand_list h1 {margin-bottom:0; padding-bottom:10px; border-bottom:2px solid var(--gray900);} .brand_list .gods_count { margin-top:40px; font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:bold; text-align:right} .brand_list .gods_count > em {font-weight:inherit} /* #174179 전체 브랜드 (e) ****************************************************/ /* #174179 our picks 패럴렉스형, 기획전 (s) ***********************************/ .our-picks-lists .filter {display:flex; justify-content:flex-end; align-items:center; float:none; margin-top:0; margin-bottom:30px; line-height:24px; text-align:right;} .our-picks-lists .filter .layer > a {font-weight:normal} .our-picks-lists .list-area ul {display:flex; flex-wrap:wrap; margin:0 -8px 0 -8px} .our-picks-lists .list-area ul > li {position:relative; display:flex; flex-direction:column; flex:none; min-width:0; padding:0 8px; box-sizing:border-box} .our-picks-lists .list-area ul > li > a {flex:auto} .our-picks-lists .list-area .item-img {position:relative; overflow:hidden} .our-picks-lists .list-area .item-img > img, .our-picks-lists .list-area .item-img .videoPlayer, .our-picks-lists .list-area .item-img .video.inline {position:absolute; left:0; top:0; width:100%; height:100%} .our-picks-lists .list-area .item-info {padding-top:10px; color:var(--gray900);} .our-picks-lists .list-area .item-info .tit {font-weight:bold; overflow:hidden; word-wrap:break-word; word-break:keep-all;} .our-picks-lists .list-area [class*="list-col-"] .item-img {padding-top:calc(100% * 451/338)} .our-picks-lists .list-area [class*="list-col-"] .item-info {height:84px; font-size:var(--F15); line-height:var(--F15L);} .our-picks-lists .list-area [class*="list-col-"] .item-info .desc {max-height:42px; overflow:hidden; word-wrap:break-word; word-break:keep-all} .our-picks-lists .list-area .list-col-3 > li {flex-basis:33.333333%; width:33.333333%; max-width:33.333333%; margin-bottom:40px; } .our-picks-lists .list-area .list-col-3 .item-info {height:63px; padding-right:calc(120/456*100%)} .our-picks-lists .list-area .list-col-3 .item-info .tit {max-height:21px} .our-picks-lists .list-area .list-col-4 > li {flex-basis:25%; width:25%; max-width:25%; margin-bottom:40px; } .our-picks-lists .list-area .list-col-4 .item-info {padding-right:calc(80/338*100%)} .our-picks-lists .list-area .list-col-4 .item-info .tit {max-height:42px;} .our-picks-lists .list-area .list-col-6 > li {flex-basis:16.66666666666667%; width:16.66666666666667%; max-width:16.66666666666667%; margin-bottom:40px; } .our-picks-lists .list-area .list-col-6 .item-info {padding-right:calc(40/220*100%)} .our-picks-lists .list-area .list-col-6 .item-info .tit {max-height:42px;} .our-picks-lists .list-area .list-col-3 li:nth-last-child(-n+3), .our-picks-lists .list-area .list-col-4 li:nth-last-child(-n+4), .our-picks-lists .list-area .list-col-5 li:nth-last-child(-n+5), .our-picks-lists .list-area .list-col-6 li:nth-last-child(-n+6) {margin-bottom:0} /* #174179 our picks 패럴렉스형, 기획전 (e) ***********************************/ /* #174179 이벤트 List (s) ****************************************************/ .list-events .list-top {display:flex; justify-content:space-between; align-items:center; margin-bottom:30px} .list-events .list-top a {font-size:var(--F15); line-height:var(--F15L); color:var(--black);} .list-events .list-top .filter {margin-top:0} .list-events .list-top .filter > a:hover {text-decoration:underline} .list-events .list-area .ssf-events {display:flex; flex-wrap:wrap; margin:0 -8px 0 -8px} .list-events .list-area .ssf-events > li {position:relative; display:flex; flex-direction:column; flex-basis:33.3333%; width:33.3333%; max-width:33.3333%; min-width:0; margin-bottom:40px; padding:0 8px; box-sizing:border-box} .list-events .list-area .ssf-events > li > a {flex:auto} .list-events .list-area .ssf-events .item-img {position:relative; padding-top:calc(100% * 0.5635)} .list-events .list-area .ssf-events .item-img > img {position:absolute; left:0; top:0; width:100%; height:100%} .list-events .list-area .ssf-events .item-info {padding:10px 120px 0 0; font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .list-events .list-area .ssf-events .item-info > p {text-overflow:ellipsis; overflow:hidden; white-space:nowrap;} .list-events .list-area .ssf-events .item-info .tit {font-weight:bold; overflow:hidden; word-wrap:break-word; word-break:keep-all;} .list-events .list-area .ssf-events .item-info .date {margin-top:8px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray500)} .enter_event {width:400px;} .enter_event select {width:400px; background-position:377px center;} /* #174179 이벤트 List (e) ****************************************************/ /* 수트서플라이 (s) ***********************************************************/ .billboard.h720 ul, .billboard.h720 ul > li, .billboard.h720 ul > li > img, .billboard.h720 ul > li > a:not(.play) > img, .billboard.h720 .lSSlideWrapper .lightSlider > li {height:720px;} .suitsupply_nav .lSSlideOuter {position:relative;} .suitsupply_nav .lSSlideWrapper {position:relative; overflow:hidden; z-index:1;} .suitsupply_nav .lSSlideWrapper .lSSlide > li {position:relative; float:left;} .suitsupply_nav .lSSlideWrapper .lSSlide > li > a > span {position:absolute; display:block; top:50%; margin-top:-21px; width:100%; height:42px; text-align:center; line-height:42px; color:var(--white); font-size:38px; z-index:2;} .suitsupply_nav .lSAction a {position:absolute; top:50%; margin-top:-53px; width:45px; height:85px; opacity:0.4; background:url(../images/base/btn_billboard_action.svg) no-repeat left center; cursor:pointer; z-index:3;} .suitsupply_nav .lSAction a.lSPrev {left:30px; font-size:0; } .suitsupply_nav .lSAction a.lSNext {right:30px; font-size:0; background-position:right center;} /* 수트서플라이 (e) ***********************************************************/ /* 컨텐츠코너 > 기획전&이벤트 (s) **********************************************/ section.corner_content .banner, section.corner_content .banner a {position:relative; display:block; *width:730px; text-align:left;} section.corner_content .banner span {position:absolute; bottom:50%; left:60px; margin-bottom:-25px; width:440px; max-height:100px; line-height:50px; color:var(--white); font-size:47px; font-weight:bold; word-wrap:break-word; word-break:keep-all;} section.corner_content .banner em {position:absolute; top:50%; left:60px; margin-top:35px; width:880px; line-height:20px; color:var(--white); font-size:var(--F17); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.corner_content .banner.c111 span, section.corner_content .banner.c111 em {color:var(--gray900);} /* 기획전&이벤트 실시간 연관상품 슬라이더 */ .corner_content .tabs.sort .tab {margin-bottom:0;} .corner_content .tabs.sort .list_goods {display:block !important; height:0; opacity:0; overflow:hidden;} .corner_content .tabs.sort .list_goods.on {height:auto; opacity:1;} .corner_content .tabs.sort .list_goods ul {margin-top:36px !important; height:475px !important; overflow:hidden;} .corner_content .tabs.sort .list_goods ul > li {margin-top:0;} .corner_content .tabs.sort .list_goods ul > li a .info {height:auto; vertical-align:top;} .corner_content .tabs.sort .list_goods.slider .lSAction a {position:absolute; /*top:calc(100% - 167px / 2); */ top:50%; margin-top:-30px; width:36px; height:60px; cursor:pointer; z-index:3;} .corner_content .tabs.sort .list_goods.slider .lSAction a.lSPrev {left:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_prev.svg) no-repeat center center/8px auto;} .corner_content .tabs.sort .list_goods.slider .lSAction a.lSNext {right:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_next.svg) no-repeat center center/8px auto;} /* #209018:20230807 */ .corner_content .tab-rects > ul > li{width:calc(100% / 6);} .corner_goods .tab-rects > ul > li{width:calc(100% / 6);} /* //#209018:20230807 */ .contents.evt section.corner_content > div, .contents.evt section.corner_goods, .contents.mz section.corner_content > div, .contents.mz section.corner_goods {margin-top:54px;} .contents.evt .line_banner a + a img, .contents.evt .line_banner + .line_banner, .contents.mz .line_banner a + a img, .contents.mz .line_banner + .line_banner {margin-top:10px !important;} /* #232895(s) */ .contents.evt .corner_content .corner_1400 {margin:80px -220px 0; width:1400px;} /* #236656 */ .contents.evt .corner_content .corner_1400 .corner_sale_notice {padding:0;} .contents.evt .corner_sale_notice {margin:80px -220px 0; padding:0 20px;} /* #236656 */ .contents.evt .corner_content .sale-notice-area h2, .contents.evt .corner_content .keyword-gods-list h2, .contents.evt .corner_content .sales-ranking h2 {max-height:38px;} /* #236656 */ .contents.evt .corner_content .txt-info h2.tit {max-height:96px !important;} /* #236656 */ .contents.evt .corner_content .txt-info h3.tits {max-height:26px !important;} /* #236656 */ .contents.evt .corner_sale_notice .sale-notice-area h2 {max-width:692px; max-height:38px; overflow:hidden; margin:0 auto 30px; font-size:var(--F32); line-height:38px; color:var(--gray900); font-weight:bold; text-align:center; word-break:break-all;} /* #236656 */ .contents.evt .corner_sale_notice .sale-notice-area h2 img {width:auto; max-width:100%;} .contents .corner_content .corner_sale_notice {margin:0;} /* #236656(s) */ .wrap.plan .contents.evt > section.corner_event, .wrap.plan .contents.evt > section.corner_goods, .wrap.plan .contents.evt > section.corner_content {margin-top:0; padding-bottom:120px;} /* #236656(e) */ /* #232895(e) */ .corner_content > div {margin-top:80px; width:100%;} .corner_content h3 {font-size:25px; line-height:36px;} .corner_content img {width:100%;} .evt_newIn h2 {margin-bottom:36px; line-height:36px; font-size:25px; color:var(--gray800);} .evt_newIn .list {display:flex; min-height:300px; overflow:hidden;} .evt_newIn .list li {width:228px; margin-right:16px;} .evt_newIn .list li a {display:block;} .evt_newIn .list li img {display: block; width:228px; height:228px; object-fit: cover;} .evt_newIn .list li strong {display:block; height:20px; font-weight:bold; color:var(--gray900); font-size:var(--F17); line-height:20px; margin:18px 0 7px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;} .evt_newIn .list li span {line-height:21px; height:42px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;} .evt_newIn .lSSlideOuter {position:relative; overflow:hidden;} .evt_newIn .lSSlideWrapper {overflow:hidden;} .evt_newIn .lSSlide {float:left; width:228px;} .evt_newIn .lSAction {display:none !important;} .evt_newIn .lSSlideWrapper:hover ~ .lSAction {display:block !important;} .evt_newIn .lSAction:hover {display:block !important;} .evt_newIn .lSAction a {position:absolute; display:block; width:36px; height:60px; top:50%; transform: translateY(-50%); cursor: pointer; background-color:rgba(255, 255, 255, 0.8); background-position:center center; background-size:7px auto; background-repeat: no-repeat;} .evt_newIn .lSAction a.lSPrev {display:none; left:0; background-image:url(../images/ui/btn_prev.svg);} .evt_newIn .lSAction a.lSNext {right:0; background-image:url(../images/ui/btn_next.svg); } .evt_newIn .lSPager {padding-top:34px;} .evt_newIn .lSPager ul {display:flex; justify-content: center;} .evt_newIn .lSPager ul li {padding:0 5px;} .evt_newIn .lSPager a {display:block; font-size:0; width:12px; height:12px; background:#ccc; border-radius:var(--radius); transition: all 0.5s;} .evt_newIn .lSPager ul li.active a {width:24px; background:var(--purple400);} .evt_keyword h2 {margin-bottom:36px; line-height:36px; font-size:25px; color:var(--gray800);} .evt_keyword .list {display:flex; height:300px; overflow:hidden;} .evt_keyword .list li {width:228px; margin-right:16px;} .evt_keyword .list li a {display:block; position:relative;} .evt_keyword .list li img {display: block; width:228px; height:300px; object-fit: cover;} .evt_keyword .list li span {position:absolute; left:50%; top:50%; color:var(--white); transform:translate3d(-50%, -50%, 0); height:32px; max-width:calc(100% - 40px); padding:0 10px; font-size:var(--F17); line-height:32px; font-weight:bold; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; background: rgba(0, 0, 0, 0.3);} .evt_keyword .list li span:before {content:'#'} .evt_keyword .lSSlideOuter {position:relative; overflow:hidden;} .evt_keyword .lSSlideWrapper {overflow:hidden;} .evt_keyword .lSSlide {float:left; width:228px;} .evt_keyword .lSAction {display:none !important;} .evt_keyword .lSSlideOuter:hover .lSAction {display:block !important;} .evt_keyword .lSAction a {position:absolute; display:block; width:36px; height:60px; top:50%; transform: translateY(-50%); cursor: pointer; background-color:rgba(255, 255, 255, 0.8); background-position:center center; background-size:7px auto; background-repeat: no-repeat;} .evt_keyword .lSAction a.lSPrev {left:0; background-image:url(../images/ui/btn_prev.svg);} .evt_keyword .lSAction a.lSNext {right:0; background-image:url(../images/ui/btn_next.svg); } /* 컨텐츠코너 > 기획전&이벤트 (e) **********************************************/ /* 컨텐츠코너 > Lucky Event (s) ***********************************************/ .lucky .lucky_title + h3 {margin-top:75px;} .lucky .lucky_list {margin-top:35px;} .lucky .lucky_list + .lucky_title {margin-top:80px;} .lucky .lucky_list img {width:100%;} .lucky .lucky_list > ul + ul {margin-top:80px;} .lucky .lucky_list > ul > li {display:flex; align-items: center; padding:30px; height:133px; border:1px solid var(--gray250); border-bottom-color:var(--gray200);} .lucky .lucky_list > ul > li:last-child {border-bottom-color:var(--gray250);} .lucky .lucky_list > ul > li + li {border-top:0;} .lucky .lucky_list > ul > li .thumb {padding-right:20px; width:100px;} .lucky .lucky_list > ul > li.win .thumb:before {position:absolute; margin:-14px 0 0 -14px; content:"당첨"; width:56px; height:56px; text-align:center; line-height:56px; color:var(--white); font-weight:bold; background:var(--purple400); border-radius:27px;} .lucky .lucky_list > ul > li .info {position:relative; width:330px;} .lucky .lucky_list > ul > li .info.disabled {color:#b4b4b4 !important;} .lucky .lucky_list > ul > li .info a.detail {display:block; margin-bottom:12px; color:#8e8e8e;} .lucky .lucky_list > ul > li .info a.detail:hover {text-decoration:underline;} .lucky .lucky_list > ul > li .info > span {display:block; width:100%; font-size:var(--F14); font-weight:bold; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .lucky .lucky_list > ul > li .info > span.name {margin-top:2px; font-weight:normal;} .lucky .lucky_list > ul > li .info > span.price {margin-top:8px;} .lucky .lucky_list > ul > li .info .color {margin-top:12px !important; height:16px;} .lucky .lucky_list > ul > li .info .color span {float:left; width:16px; height:16px; line-height:14px; font-size:0;} .lucky .lucky_list > ul > li .info .color span + span {margin-left:3px;} .lucky .lucky_list > ul > li .order {padding-left:72px; width:224px; vertical-align:middle;} .lucky .lucky_list > ul > li .order .choice {width:224px; color:var(--gray600); font-size:var(--F14); text-align:center;} .lucky .lucky_list > ul > li .order .select {display:block; margin-top:0; width:224px; text-align:center;} .lucky .lucky_list > ul > li .order .select label {display:flex; align-items: center; justify-content: center; } .lucky .lucky_list > ul > li .order .select label em {flex:1;} .lucky .lucky_list > ul > li .order .select label:after {align-self:flex-end;} .lucky .lucky_list > ul > li .order .quantity {margin-top:0;} .lucky .lucky_list > ul > li .order .quantity input {width:222px;} .lucky .lucky_list > ul > li .order .quantity .minus {top:auto; bottom:3px; left:13px; background:url('../images/ui/bg_minus.gif') no-repeat center center;} .lucky .lucky_list > ul > li .order .quantity .plus {top:0px; right:13px; background:url('../images/ui/bg_plus.gif') no-repeat center center;} .lucky .lucky_list > ul > li .order .select + .quantity {margin-top:10px;} .lucky .lucky_list > ul > li .submit {padding-left:12px; width:140px; margin:0;} .lucky .lucky_list > ul > li .submit .btn {min-width:auto; padding-left:0; padding-right:0; width:100%; height:78px; line-height:76px; margin:0;} .lucky .lucky_list > ul > li .submit .btn.disabled {color:var(--white); background:#d5d5d5; border-color:#d5d5d5;} .lucky .lucky_list > ul.cols2 {display:flex; flex-wrap: wrap; justify-content: space-between;} .lucky .lucky_list > ul.cols2 > li { display:block; position:relative; padding:40px 36px 40px 208px; width:470px; box-sizing: border-box; height:auto; border-top:1px solid var(--gray250); border-color:var(--gray250);} .lucky .lucky_list > ul.cols2 > li:nth-child(even) {margin-left:20px;} .lucky .lucky_list > ul.cols2 > li:nth-child(1n+3) {margin-top:20px;} .lucky .lucky_list > ul.cols2 > li > div {vertical-align:top;} .lucky .lucky_list > ul.cols2 > li .thumb {position:absolute; left:36px; top:40px; width:152px;} .lucky .lucky_list > ul.cols2 > li.win .thumb:before {margin:-18px 0 0 -18px;} .lucky .lucky_list > ul.cols2 > li .info { width:100%; height:125px;} .lucky .lucky_list > ul.cols2 > li .info > span + span {margin-top:8px;} .lucky .lucky_list > ul.cols2 > li .info a.detail {position:absolute; right:0;} .lucky .lucky_list > ul.cols2 > li .info .brand {width:160px;} .lucky .lucky_list > ul.cols2 > li .order {display:flex; flex-wrap: wrap; align-items: flex-end; padding-left:0; height:76px; vertical-align:bottom;} .lucky .lucky_list > ul.cols2 > li .order .choice {height:76px; text-align:left;} .lucky .lucky_list > ul.cols2 > li .order .select + .quantity {margin-top:8px;} .lucky .lucky_list > ul.cols2 > li .submit {margin-top:12px; width:100%; height:50px; padding:0;} .lucky .lucky_list > ul.cols2 > li .submit .btn {height:50px; line-height:50px; } /* 컨텐츠코너 > Lucky Event (e) ***********************************************/ /* 컨텐츠코너 > 핫딜 이벤트 (s) ***********************************************/ .corner_content .hot_deal {padding:80px 60px 20px; width:calc(100% - 120px); border-top:1px solid var(--gray250);} .corner_content .hot_deal > ul.type_A li {display:block; height:555px; background:var(--white);} .corner_content .hot_deal > ul.type_A li + li {margin-top:20px;} .corner_content .hot_deal > ul.type_A li img {width:420px;} .corner_content .hot_deal > ul.type_A li .detail {height:100%;} .corner_content .hot_deal > ul.type_A li .detail .harf:first-child {position:absolute; left:0; top:34px;} .corner_content .hot_deal > ul.type_A li .detail .harf:last-child {position:absolute; left:0; bottom:40px;} .corner_content .hot_deal > ul.type_B > li {display:block; height:693px; position:relative; background:var(--white);} .corner_content .hot_deal > ul.type_B > li + li {margin-top:80px;} .corner_content .hot_deal > ul.type_B li .detail {position:absolute; top:0; right:0;} .corner_content .hot_deal > ul.type_B li .detail {height:100%;} .corner_content .hot_deal > ul.type_B li .detail .harf:first-child {position:absolute; left:0; top:32px;} .corner_content .hot_deal > ul.type_B li .detail .harf:last-child {position:absolute; left:0; bottom:0px;} .corner_content .hot_deal > ul + ul {margin-top:80px;} .corner_content .hot_deal > ul li .detail {float:right; margin-right:40px; position:relative; width:340px;} .corner_content .hot_deal > ul li .harf {display:inline-block; width:100%; text-align:left; line-height:28px; font-size:19px; word-break:keep-all;} .corner_content .hot_deal > ul li .harf .vol {display:block; margin-top:20px; line-height:24px; color:var(--gray600); font-size:var(--F17);} .corner_content .hot_deal > ul li .harf .vol + .vol {margin-top:0;} .corner_content .hot_deal > ul li .harf {display:inline-block; width:100%;} .corner_content .hot_deal > ul.type_A li .harf .color {display:block; margin-bottom:11px;} .corner_content .hot_deal > ul.type_B li .harf .color {display:block; margin-top:25px;} .corner_content .hot_deal > ul li .harf .brand, .corner_content .hot_deal > ul li .harf .name {display:block; line-height:32px; color:var(--gray900); font-size:23px; font-weight:bold;} .corner_content .hot_deal > ul li .harf .price {display:block; line-height:60px; color:var(--gray900); font-size:37px; font-weight:bold;} .corner_content .hot_deal > ul.type_B li .harf .price {margin-bottom:20px;} .corner_content .hot_deal > ul li .harf .price del {padding-right:8px; color:var(--gray600); font-size:19px;} .corner_content .hot_deal > ul li .harf .price .sale {padding-left:8px; color:var(--purple400); font-size:23px;} .corner_content .hot_deal > ul li .harf a {display:block; margin-top:7px; padding:24px 40px; line-height:20px; font-size:19px; font-weight:bold; background:url(../images/ui/btn_next.svg) no-repeat 292px center/ auto 12px; border:1px solid var(--gray900);} .corner_content .hot_deal > ul li .harf .color {display:block; margin-top:13px; width:100%; max-height:16px; overflow:hidden;} .corner_content .hot_deal > ul li .harf .color:after {display:block; clear:both; content:"";} .corner_content .hot_deal > ul li .harf .color span {float:left; width:16px; height:16px; line-height:16px; font-size:0;} .corner_content .hot_deal > ul li .harf .color span + span {margin-left:5px;} .corner_content .hot_deal .photo {display:block; width:420px; overflow:hidden;} .corner_content .hot_deal .photo .lSSlideOuter {position:relative;} .corner_content .hot_deal .photo .lSSlideWrapper {position:relative; height:555px !important; } .corner_content .hot_deal .photo .lSSlideWrapper .lSFade > li {position:absolute; top:0; width:100%; opacity:0; display:none;} .corner_content .hot_deal .photo .lSSlideWrapper .lSFade > li.active {opacity:1; display:block; position:relative;} .corner_content .hot_deal .photo .lSGallery {margin-top:5px;} .corner_content .hot_deal .photo .lSGallery li {display:inline-block; position:relative; float:left;} .corner_content .hot_deal .photo .lSGallery li.active:after {position:absolute; top:-2px; left:-2px; width:99px; height:131px; border:none; background-color:transparent; content:'';} .corner_content .hot_deal .photo .lightSlider li {display:block; height:100%;} .corner_content .hot_deal .photo .lSPager.lSGallery {display:block; margin:0; width:auto !important; transform:translate(0px, 0px) !important;} .corner_content .hot_deal .photo .lSPager.lSGallery li {margin-top:8px; width:99px !important;} .corner_content .hot_deal .photo .lSPager.lSGallery li:nth-child(4n) {margin-right:0 !important;} .corner_content .hot_deal .hot_deal_tip {margin-top:56px;} .corner_content .hot_deal .hot_deal_tip h4 {font-size:var(--F15);} .corner_content .hot_deal .hot_deal_tip ul {margin-top:10px;} .corner_content .hot_deal .hot_deal_tip ul li {position:relative; padding-left:8px; line-height:26px; color:var(--gray800);} .corner_content .hot_deal .hot_deal_tip ul li:before {position:absolute; top:11px; left:0; width:2px; height:2px; background-color:var(--gray600); content:'';} /* 컨텐츠코너 > 핫딜 이벤트 (e) ***********************************************/ /* 컨텐츠코너 > 펀딩오더 (s) **************************************************/ .corner_content .funding_order .list_goods .order_period .d-d, .corner_content .funding_order .list_goods .order_period .d-0 {display:inline-block; position:absolute; top:0; left:0; padding:0 6px; height:24px; line-height:24px; color:var(--gray600); font-size:var(--F14); font-weight:bold; background:var(--white);} .corner_content .funding_order .list_goods .order_period .d-d {color:var(--gray600); border:1px solid #949496;} .corner_content .funding_order .list_goods .order_period .d-0 {color:#ff0000; border:1px solid #ff0000;} .corner_content .funding_order .list_goods .order_period .d-to, .corner_content .funding_order .list_goods .order_period .d-end {display:block; position:absolute; margin-top:-70px; width:100%; height:70px; line-height:70px; text-align:center; color:var(--white); font-size:26px; font-weight:bold; text-shadow:0 0 4px rgba(0, 0, 0, 0.2);; background:rgba(17, 17, 17, 0.3);} .corner_content .funding_order .list_filter {position:relative;} .corner_content .funding_order .list_filter .tabs {position:absolute; bottom:0; left:53px;} .corner_content .funding_order .list_filter .tabs > h3 {margin-left:8px; color:var(--gray900); font-size:37px; line-height:38px;} .corner_content .funding_order .list_filter .tabs > h3 > small {display:block; margin-bottom:3px; color:var(--gray800); font-size:var(--F17); } .corner_content .funding_order .list_filter .tabs a {color:var(--gray800);} .corner_content .funding_order .list_filter .tabs .tab {margin-top:45px; height:25px; line-height:25px; border-bottom:0;} .corner_content .funding_order .list_filter .tabs .tab > li {display:inline-block;} .corner_content .funding_order .list_filter .tabs .tab > li + li {margin-left:30px;} .corner_content .funding_order .list_filter .tabs .tab > li > a {padding:10px 4px; line-height:25px; font-size:19px;} .corner_content .funding_order .list_filter .tabs .tab > li > a.on {color:var(--gray900); font-weight:bold; border-bottom:2px solid var(--gray900);} .corner_content .funding_order .list_filter + .list_goods {margin-top:40px;} .corner_content .funding_order .list_goods ul > li a .info {height:145px;} .corner_content .funding_order .order_state .point_max {margin-top:24px; width:100%; height:6px; background-color:var(--gray200);} .corner_content .funding_order .order_state .point_min {position:relative; height:100%;} .corner_content .funding_order .order_state .point_min_txt {position:absolute; margin-top:12px; top:0; right:0;} .corner_content .funding_order .order_state .point_min_txt > span {position:absolute; margin-left:-190px; width:380px; text-align:center; color:var(--gray600); font-size:var(--F13);} .corner_content .funding_order .order_state .point_min_txt.left, .corner_content .funding_order .order_state .point_min_txt.right {left:0;} .corner_content .funding_order .order_state .point_min_txt.left > span {margin-left:0; text-align:left;} .corner_content .funding_order .order_state .point_min_txt.right > span {margin-left:0; text-align:right;} .corner_content .funding_order .order_state .point_run {position:absolute; height:100%; background-color:var(--purple400);} .corner_content .funding_order .order_state > p {margin-top:4px; text-align:right; line-height:25px; color:var(--gray900); font-size:var(--F14);} .corner_content .funding_order .order_state > p > em {color:var(--gray600);} .corner_content .funding_order .order_state > p > em.full {color:var(--purple400);} .corner_content .funding_order .order_state > .date_open {margin-top:15px; text-align:left; color:var(--purple400);} /* 컨텐츠코너 > 펀딩오더 (e) **************************************************/ /* #197933:20230312:20230418 start */ /* 스페셜 오퍼 (s) */ .wrap .corner_content .special-offer{position:relative;width:100%;max-width:1400px;margin:0 auto;} .wrap .corner_content .special-offer .box-top{position:relative;} .wrap .corner_content .special-offer .logo-area{position:absolute;z-index:1;top:60px;left:50%;margin-left:-315px;} .wrap .corner_content .special-offer .logo-area img{display:block;width:auto;height:30px;} .wrap .corner_content .special-offer .bg-area{position:relative;height:903px;width:100%;} .wrap .corner_content .special-offer .bg-area .inner{width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;} .wrap .corner_content .special-offer .bg-area.type-img::after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background-color:var(--black);opacity:0.6;} .wrap .corner_content .special-offer .img-area{position:absolute;top:120px;left:50%;width:562px;height:562px;margin-left:-281px;} .wrap .corner_content .special-offer .img-area .inner{position:relative;width:100%;height:100%;} .wrap .corner_content .special-offer .img-area .inner img{display:block;position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;border-radius:50%;} .wrap .corner_content .special-offer .img-area .swap-item{opacity:0;transition:opacity 0.4s;} .wrap .corner_content .special-offer .img-area .swap-item.active{opacity:1;z-index:1;} .wrap .corner_content .special-offer .title-area{position:absolute;bottom:70px;left:50%;transform:translateX(-50%);z-index:2;} .wrap .corner_content .special-offer .title-area .inner img{width:auto;height:232px;} .wrap .corner_content .special-offer .txt-area{height:308px;background-color:var(--gray900);} .wrap .corner_content .special-offer .txt-area .inner{display:flex;flex-direction:column;align-items:center;height:100%;width:470px;margin:0 auto;} .wrap .corner_content .special-offer .txt-area .inner *{text-align:center;} .wrap .corner_content .special-offer .txt-area .inner .tit{width:100%;margin:54px 0 14px;color:var(--white);font-size:34px;line-height:44px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;font-weight:700;} .wrap .corner_content .special-offer .txt-area .inner .desc{width:100%;margin:14px 0 31px;color:var(--white);font-size:28px;line-height:34px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:400;} .wrap .corner_content .special-offer .txt-area .inner .date{width:100%;color:var(--gray450);font-size:26px;line-height:32px;font-weight:400;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;} /* 20230414 */ /* 스페셜 오퍼 (e) */ /* #197933:20230312:20230418 end */ /* 컨텐츠코너 (s) ************************************************************/ .corner_content .corner_txt.box {padding:52px 60px; width:calc(100% - 120px);} .corner_content .corner_txt > h3 {line-height:38px; font-size:25px;} .corner_content .corner_txt > p {line-height:var(--F17LL); font-size:var(--F17);} .corner_content .corner_txt > h3 + p {margin-top:26px;} .corner_content .video {display:block; position:relative; width:100%;} .corner_content .video.playing .thumb {display:none;} .corner_content .video a.play {display:block; position:absolute; top:50%; left:50%; width:90px; height:90px; margin:-45px 0 0 -45px; background:url('../images/ui/btn_play.png') no-repeat center center; z-index:1;} .corner_content .video .thumb {display:block; position:absolute;} .corner_content .video .player iframe {width:100%;} .corner_content .goods ul li {display:block;} .corner_content .goods ul li dl {margin-top:10px;} .corner_content .goods ul li dl dd {display:block; line-height:22px;} .corner_content .goods ul li dl dd em {margin-left:10px;} .corner_content .goods ul li {width:100%;} .corner_content .goods ul.col2 li {float:left; width:50%;} .corner_content .goods ul.col2:after {display:block; clear:both; content:'';} .corner_content .event_notice {margin-top:60px !important; padding:44px 60px; width:calc(100% - 120px); color:var(--gray800); background:#f7f7f7;} .corner_content .event_notice.color-dark {color:#b2b2b2 !important; background:#333 !important;} .corner_content .event_notice > h3 {display:inline-block; color:var(--gray900); font-size:var(--F17); line-height:var(--F17LL); } .corner_content .event_notice.color-dark > h3 {color:var(--white) !important;} .corner_content .event_notice.accordion > h3 i {display:inline-block; width:12px; height:26px; vertical-align:top; margin-left:15px; background:url(../images/ui/btn_down.svg) no-repeat center center/100% auto; } .corner_content .event_notice.accordion > h3.on i {background-image:url(../images/ui/btn_up.svg);} .corner_content .event_notice > .code {margin-top:20px; padding:0 !important; line-height:26px; font-size:var(--F16);} .corner_content .lookbook {width:100%;} .corner_content .lookbook ul {padding-left:240px; background:var(--gray900);} .corner_content .lookbook ul li {width:480px;} .corner_content .lookbook .lSSlideOuter ul li {opacity:0.5;} .corner_content .lookbook .lSSlideOuter ul li.active {opacity:1;} /* 컨텐츠코너 (e) ************************************************************/ /* 코너 댓글이벤트 (s) *******************************************************/ .corner_reply .write_reply {position:relative; border-style:solid; border-color:var(--gray900); border-width:2px 0 2px 0;} .corner_reply .write_reply h3 {display:inline-block; padding:34px 0; max-width:820px; line-height:28px; font-size:19px;} .corner_reply .write_reply .btn {position:absolute; right:0; top:50%; margin-top:-27px; width:110px; height:54px; line-height:54px; font-size:var(--F15); color:var(--white);background:var(--gray900);} .corner_reply .reply_wrap {margin-top:54px;} .corner_reply .reply_wrap h3 {line-height:30px; font-size:19px;} .corner_reply .reply_wrap h3 .sort {float:right; color:var(--gray600); font-size:var(--F14); font-weight:normal;} .corner_reply .reply_wrap h3 .sort a {margin:0 5px; color:var(--gray600);} .corner_reply .reply_wrap h3 .sort a:last-child {margin-right:0;} .corner_reply .reply_wrap > ul {margin-top:15px; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li {padding:26px 0; color:var(--gray600); font-size:var(--F14);} .corner_reply .reply_wrap > ul > li.on {padding-bottom:0;} .corner_reply .reply_wrap > ul > li + li {border-top:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li.notice {padding:26px 20px; background:#f7f7f7;} .corner_reply .reply_wrap > ul > li.notice .toggle_ellipsis .ks:first-child {color:var(--gray900); font-weight:bold;} .corner_reply .reply_wrap > ul > li.notice .toggle_ellipsis .content {max-height:220px !important; overflow-y:auto; cursor:default;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .ks + .ks {margin-left:16px;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .edit {float:right;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .edit a {margin-left:15px; color:var(--gray600);} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .edit a:hover {color:var(--gray800);} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content {margin-top:12px; height:auto; max-height:110px; line-height:22px; color:var(--gray600); font-size:var(--F14); background:none; overflow:hidden; cursor:pointer; white-space:normal} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content.on {max-height:9999px; overflow-y:auto;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content + .more {display:block; cursor:pointer;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content.on + .more {display:none;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content.disabled {cursor:default;} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content .to {margin-right:10px; color:var(--gray900);} .corner_reply .reply_wrap > ul > li .toggle_ellipsis .content .blinde {color:#b4b4b4;} .corner_reply .reply_wrap > ul > li .file_list {margin-top:16px;} .corner_reply .reply_wrap > ul > li .file_list ul:after {display:block; clear:both; content:"";} .corner_reply .reply_wrap > ul > li .file_list ul li {float:left;} .corner_reply .reply_wrap > ul > li .file_list ul li + li {margin-left:10px;} .corner_reply .reply_wrap > ul > li .file_list ul li a img {width:60px; height:60px; border:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li .btn_list {margin-top:30px;} .corner_reply .reply_wrap > ul > li .btn_list .btn {padding:4px 30px; height:34px; line-height:24px; color:var(--gray800); font-size:var(--F13);} .corner_reply .reply_wrap > ul > li .btn_list .btn + .btn {margin-left:7px;} .corner_reply .reply_wrap > ul > li .btn_list .heart {float:right; text-align:center;} .corner_reply .reply_wrap > ul > li .btn_list:after {content:""; display:block; clear:both;} .corner_reply .reply_wrap > ul > li .btn_list .heart > label > i {margin:1px 3px 0 0;} .corner_reply .reply_wrap > ul > li .btn_list .heart > label {padding:4px 10px 4px 6px;; width:57px; height:24px; line-height:24px; color:var(--gray800); font-size:var(--F13); background:var(--white); border:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li.on > .reply {display:block;} .corner_reply .reply_wrap > ul > li > .reply {display:none; margin-top:26px; border-top:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li > .reply li {position:relative; padding:26px 50px; background:#f7f7f7;} .corner_reply .reply_wrap > ul > li > .reply li + li {border-top:1px solid var(--gray250);} .corner_reply .reply_wrap > ul > li > .reply li:before {display:block; content:''; position:absolute; top:30px; left:21px; width:8px; height:9px; border-width:0 0 1px 1px; border-style:solid; border-color:var(--gray600);;} /* 코너 댓글이벤트 (e) *******************************************************/ /* 코너 SNS이벤트 (s) ********************************************************/ section.corner_sns {width:100%;margin:60px auto 0} section.corner_sns h3 {line-height:30px; font-size:19px;} section.corner_sns h3 small {float:right; color:var(--gray600); font-size:var(--F14); font-weight:normal;} section.corner_sns .select_sns .radio {margin-left:34px;} section.corner_sns .select_sns .radio label {margin-right:18px; font-size:0;} section.corner_sns .select_sns .radio label i {height:30px; background:url('../images/ui/icon_sns_large.png') no-repeat; border-radius:0;} section.corner_sns .select_sns .radio label i.ks {width:13px; background-position:-9px bottom;} section.corner_sns .select_sns .radio label i.fb {width:11px; background-position:-39px bottom;} section.corner_sns .select_sns .radio label i.tw {width:24px; background-position:-63px bottom;} section.corner_sns .select_sns .radio label i.kt {width:26px; background-position:-93px bottom;} section.corner_sns .select_sns .radio input:checked + label i.ks {background-position:-9px top;} section.corner_sns .select_sns .radio input:checked + label i.fb {background-position:-39px top;} section.corner_sns .select_sns .radio input:checked + label i.tw {background-position:-63px top;} section.corner_sns .select_sns .radio input:checked + label i.kt {background-position:-93px top;} section.corner_sns .select_sns .form_wrap p {margin-top:7px;} section.corner_sns .select_sns .notice {float:left; margin-top:-17px; color:var(--gray600); font-size:var(--F13);} section.corner_sns .select_sns .form_wrap {margin-top:7px;} section.corner_sns .select_sns .form_wrap textarea {padding:15px; width:810px; height:24px; line-height:22px;} section.corner_sns .select_sns .form_wrap button {float:right; margin-top:0; width:110px; height:54px; line-height:42px; color:var(--white); font-size:var(--F14); font-weight:bold; border-color:var(--gray800); background:var(--gray800);} section.corner_sns .select_sns .form_wrap p {width:838px; text-align:right; color:var(--gray600); font-size:var(--F13); font-weight:bold;;} section.corner_sns .reply_wrap {margin-top:40px;} section.corner_sns .reply_wrap h3 {line-height:30px; font-size:19px;} section.corner_sns .reply_wrap ul {margin-top:17px; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} section.corner_sns .reply_wrap ul li {padding:24px 0; min-height:62px;} section.corner_sns .reply_wrap ul li + li {border-top:1px solid var(--gray250);} section.corner_sns .reply_wrap ul li .profile {display:inline-block; float:left; width:60px; height:60px; border:1px solid var(--gray250); background:url('../images/ui/bg_ssf_profile.gif') no-repeat center center} section.corner_sns .reply_wrap ul li .profile img {width:60px; height:60px} section.corner_sns .reply_wrap ul li .profile + .reply {margin-left:25px;} section.corner_sns .reply_wrap ul li .reply {display:inline-block; width:860px;} section.corner_sns .reply_wrap ul li .reply em {display:block; height:18px; line-height:18px; color:var(--gray600); font-size:var(--F13); background:url('../images/ui/icon_sns_small.png') no-repeat;} section.corner_sns .reply_wrap ul li .reply em.ks {padding-left:25px; background-position:0 -1px} section.corner_sns .reply_wrap ul li .reply em.fb {padding-left:25px; background-position:0 -49px} section.corner_sns .reply_wrap ul li .reply em.tw {padding-left:30px; background-position:0 -99px} section.corner_sns .reply_wrap ul li .reply em.kt {padding-left:30px; background-position:0 -149px} section.corner_sns .reply_wrap ul li .reply p {margin-top:5px; line-height:22px; font-size:var(--F14); color:var(--gray800); word-wrap:break-word; word-break:keep-all;} /* 코너 SNS이벤트 (e) ********************************************************/ /* 코너 리뷰 (s) *************************************************************/ #review.review {text-align:left;} #review.review h3 {margin-bottom:35px; line-height:30px; font-size:25px;} #review.review .sum {margin-top:50px;} #review.review .sum:after {display:block; clear:both; content:'';} #review.review .sum > dt {float:left;} #review.review .sum > dt > h4 {line-height:28px; color:var(--gray800); font-size:19px;} #review.review .sum > dt > h4 small {margin-left:10px; color:var(--gray600);; font-size:var(--F14); font-weight:normal;} #review.review .sum > dd {float:right;} #review.review .sum > dd > div {display:inline-block; margin-left:40px; font-size:var(--F14);} #review.review .sum > dd > div + div {margin-left:40px;} #review.review .sum > dd > div > h5 {line-height:24px; color:var(--gray800); font-size:var(--F14);} #review.review .sum > dd > div > ul {margin-top:10px;} #review.review .sum > dd > div > ul > li {display:block; height:28px; line-height:28px;} #review.review .sum > dd > div > ul > li > span {float:left; color:var(--gray800);} #review.review .sum > dd > .size > ul > li > span {min-width:65px;} #review.review .sum > dd > .color > ul > li > span {min-width:90px;} #review.review .sum > dd > div > ul > li .graph {display:inline-block; width:120px; height:7px; background:var(--gray250);} #review.review .sum > dd > div > ul > li .graph > span {display:block; height:100%; background:var(--purple400);} #review.review .sum > dd > div > ul > li > em {margin-left:15px; color:var(--gray600);;} #review.review .description + .toggle_ellipsis {margin-top:-30px;} #review.review .toggle_ellipsis img {width:100%;} #review.review .toggle_ellipsis .sort {margin-top:80px; height:35px; line-height:35px; color:var(--gray600);; font-size:var(--F14);} #review.review .toggle_ellipsis .sort > span {display:inline-block;} #review.review .toggle_ellipsis .sort > span a {color:var(--gray600);;} #review.review .toggle_ellipsis .sort > span + span {margin-left:10px;} #review.review .toggle_ellipsis .sort > span + span:before {content:'|';} #review.review .toggle_ellipsis .sort > span + span a {margin-left:10px;} #review.review .toggle_ellipsis .sort .select {margin-left:30px;} #review.review .toggle_ellipsis .sort .select label {line-height:28px; color:var(--gray600);; border:0;} #review.review .toggle_ellipsis .sort .select .option a {color:var(--gray600);;} #review.review .toggle_ellipsis .content .img {margin-top:20px;text-align:center;} #review.review .toggle_ellipsis .content .img img {display:block; margin-top:10px; width:auto; max-width:500px; max-height:500px;} #review.review .toggle_ellipsis > ul {margin-top:10px;} #review.review .toggle_ellipsis > ul li {padding:30px 0; font-size:var(--F14);} #review.review .toggle_ellipsis > ul li > dl:after {display:block; clear:both; content:'';} #review.review .toggle_ellipsis > ul li > dl dt {float:left; padding-right:30px; width:60px;} #review.review .toggle_ellipsis > ul li > dl dd {float:left; width:960px;} #review.review .toggle_ellipsis > ul li > dl dt + dd {float:left; width:870px;} #review.review .toggle_ellipsis > ul li > dl dd .info {margin-bottom:12px;} #review.review .toggle_ellipsis > ul li > dl dd .info > a span {display:block; line-height:22px; font-size:14px !important;} #review.review .toggle_ellipsis > ul li > dl dd .info > a span.name {color:var(--gray600);} #review.review .toggle_ellipsis > ul li > dl dd .info + .summary {margin-top:24px !important;} #review.review .toggle_ellipsis > ul li > dl dd .summary {color:var(--gray800);} #review.review .toggle_ellipsis > ul li > dl dd .summary > span + span {margin-left:15px;} #review.review .toggle_ellipsis > ul li > dl dd .summary > .color em:first-child {margin-left:15px;} #review.review .toggle_ellipsis > ul li > dl dd .summary > .color:before {content:'|';} #review.review .toggle_ellipsis > ul li > dl dd .summary > span em + em {margin-left:10px; color:var(--gray900);}/*//#146166 : 상품상세 컬러변경*/ #review.review .toggle_ellipsis > ul li > dl dd .summary > .best {padding:0 6px; border:1px solid var(--purple400); font-size:var(--F13); color:var(--purple400); line-height:16px;} #review.review .toggle_ellipsis > ul li > dl dd .date {color:var(--gray600);;} #review.review .toggle_ellipsis > ul li > dl dd .date em + em {margin-left:10px;} #review.review .toggle_ellipsis > a.btn {margin-top:-35px; } /* 코너 리뷰 (e) *************************************************************/ /* 우수 입점 브랜드 (s) ******************************************************/ .good_service {display:table; margin-top:40px !important; padding:20px 40px; width:calc(100% - 80px); min-height:54px; background:#faf4ff;} .good_service > div {display:table-cell; padding-left:70px; vertical-align:middle; font-size:19px; background:url(../images/ui/badge_good_service.png) no-repeat left center;} .good_service > div .cssf {font-weight:bold;} .wrap.main .contents .good_service, .wrap.inshop .contents .good_service {margin:auto; width:calc(100% - 200px);} .detail .brand_store + .good_service {margin-top:6px !important;} .detail .good_service {padding:16px 20px; width:calc(100% - 136px);} .detail .good_service > div {line-height:var(--F14L); font-size:var(--F14);} /* 우수 입점 브랜드 (e) ******************************************************/ /* lightSlider > swiper 띠배너 (s) ***********************************/ /* #271632:20250617 */ .banners.slider > ul {display: flex;} .banners.slider > ul li {flex-shrink: 0;} .banners.slider.swiper-initialized{visibility:visible;} .banners.slider.swiper .swiper-slide > a{display:block;} .banners.slider.swiper .swiper-pagination.swiper-pagination-bullets{margin-top:20px;text-align:center;} .banners.slider.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet{display:inline-block;margin:0 5px;width:12px;height:12px;text-indent:-9999px;border-radius:var(--radius);background:#ccc;transition:all 0.5s ease;-moz-transition:all 0.5s ease;-webkit-transition:all 0.5s ease;cursor:pointer;} .banners.slider.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active{width:24px;background:var(--purple400);} /* lightSlider > swiper 띠배너 (e) ***********************************/ /* 상품상세, 기획전, 이벤트 상세 띠배너 (s) ***********************************/ .auto_banners {margin-top: 0;} .auto_banners * {color:inherit} .auto_banners.slider {position: relative; height: 100px; overflow: hidden; opacity: 0;} .auto_banners.slider ul li {float: left;} .auto_banners.slider ul li a {position: relative; display: block; height: 100px; background-position: center; background-size: auto 100%; color:var(--gray900);} .auto_banners.slider ul li a div {position: absolute; top: 50%; left: 80px; transform: translateY(-50%);} .auto_banners.slider ul li a div em {display: block; margin-bottom: 8px; font-size:var(--F12); line-height: 1;} .auto_banners.slider ul li a div strong {display: block; font-size:var(--F16); line-height: 1; font-weight: bold;} .auto_banners.slider ul li a div span {display: block; margin-top: 4px; font-size:var(--F14); line-height: 1;} .auto_banners.slider ul li a.text_white div em, .auto_banners.slider ul li a.text_white div strong, .auto_banners.slider ul li a.text_white div span {color: var(--white);} .auto_banners.slider .lSAction {display:inline-block; position: absolute; bottom: 6px; right: 6px; z-index: 1; width: 66px; height: 20px; background: rgba(0,0,0,0.2); border-radius: 60px;} .auto_banners.slider .lSAction a {width: 6px; height: 10px; margin-top: -5px; background: url(../images/ui/btn_next_white.svg) no-repeat center center/6px auto;} .auto_banners.slider .lSAction a.lSPrev {left: 7px; transform: rotate(180deg);} .auto_banners.slider .lSAction a.lSNext {right: 7px;} .auto_banners.slider .lSPager {display: none;} .auto_banners.slider .lSPageNum {position: absolute; bottom: 10px; right: 24px; z-index: 2; width: 30px; text-align: center; font-size:var(--F12); line-height: 1; letter-spacing: 1px; color: var(--white);} .auto_banners.slider.single {opacity:1} .auto_banners.slider.single ul li {width:100%} /* 상품상세, 기획전, 이벤트 상세 띠배너 (e) ***********************************/ /* 실시간 클릭랭킹 (s) *******************************************************/ .click_ranking h3 {font-size:33px !important;} .click_ranking .ranking_title {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:40px;} .click_ranking .filter .layer > a {font-weight:normal;} .click_ranking .filter.left .layer > a {font-size:33px;} .click_ranking .filter .layer .sort .list_sort ul {padding:10px 0;} .click_ranking .filter .layer .sort .list_sort a {display:block; font-weight:normal; padding-left:20px;} .click_ranking .filter .layer .sort .list_sort ul li.on {background:#f7f7f7;} .click_ranking .filter .layer .sort .list_sort ul li.on a {color:var(--gray800); background:none; padding-left:20px !important;} .click_ranking .filter.right .layer .sort .list_sort {width:115px;} .click_ranking .no_result {text-align:center; margin:70px 0; font-size:var(--F17);} .click_ranking .ranking_title {display:flex; justify-content: space-between; padding:0 0; min-height:40px; margin-bottom:40px;} .click_ranking.main .ranking_title {padding:0 60px; min-height:40px;} section.click_ranking .list_goods > ul {display:flex;flex-wrap:wrap;}/* #203126:20230425 */ .ranking_tabs {clear:both; margin-top:40px !important; margin-bottom:40px; padding:0; min-height:60px} .ranking_tabs .filter {display:block; position:relative; float:left; width:200px; margin-top:0; border:1px solid var(--gray250); padding:0 15px; height:62px; box-sizing: border-box;} .ranking_tabs .filter .layer > div {left:-1px; top:49px !important; margin-left:0 !important; border: 1px solid var(--black);} .ranking_tabs .filter .layer > a {line-height:60px; width:150px; text-align:left; color:var(--gray900); display:inline-block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .ranking_tabs .filter .row_arrow {background: url(../images/ui/btn_down.svg) no-repeat right center/14px auto;} .ranking_tabs .filter .row_arrow.up {background: url(../images/ui/btn_up.svg) no-repeat right center/14px auto;} .click_ranking.main .ranking_tabs {padding:0 60px;} .ranking_title .filter {display:flex; align-items:center; float:none; text-align:left; position:relative;} .ranking_title .filter a[role="heading"] {font-size:var(--F40); line-height:48px; color:var(--gray900);} .ranking_title .filter .layer > [class*=sort] {border: 1px solid var(--black);} .ranking_title .filter.left .row_arrow {padding-right:30px; background:url(../images/svgs/chevron-down-24.svg) no-repeat right center/24px auto;} .ranking_title .filter.left .row_arrow.up {background:url(../images/svgs/chevron-up-24.svg) no-repeat right center/24px auto;} .ranking_title .filter.left .layer .sort {top:49px !important; left:0; margin-left:0 !important;} .ranking_title .filter.right .layer {margin-left:20px;} .ranking_title .filter.right .layer .sort {top:20px !important; right:0;} .ranking_title .brand {display:inline-block; padding-left:10px; font-size:29px; vertical-align:3px;} .ranking_title .ranking_time {position:relative; display:flex; align-items:center; font-size:var(--F17); font-weight:bold} .ranking_title .ranking_time span {color:var(--gray600);} /*.ranking_title .ranking_time span {font-size:var(--F13); line-height:var(--F13L); color:var(--gray600)}*/ .ranking_title .ranking_time .tip {position:relative; width:16px; height:16px; background: url(../images/svgs/question.svg) no-repeat right center/16px auto;} .ranking_title .ranking_time .tip_content {overflow:inherit; left:auto !important; right:-5px; top:30px !important; width:182px; padding:15px 20px 10px; line-height:var(--F14L); color:var(--gray800); font-size:var(--F14); text-align:left; letter-spacing:-1px; border:1px solid #f0e5fa; background:#f7eeff; border-radius:0;} .ranking_title .ranking_time .tip_content:before {position:absolute; display:block; content:''; top:-6px; right:10px; width:8px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} .ranking_title .ranking_time .tip_content .tits {display:block; font-size:var(--F17); color:var(--gray900);} .ranking_title .ranking_time .tip_content ul {margin-top:5px;} .ranking_title .ranking_time .tip_content li {position:relative; padding-left:10px;} .ranking_title .ranking_time .tip_content li:before {position:absolute; content:''; top:8px; left:0; width:5px; height:1px; background:var(--gray800);} .ranking_title .ranking_time .tip_content i.close {top:10px; right:8px; width:20px; height:20px; color:transparent; background: url(../images/ui/btn_x_gray.svg) no-repeat center center/ 12px auto;} /* 실시간 클릭랭킹 (e) *******************************************************/ /* CLICK NOW (s) ************************************************************/ .click_now {position:relative; display:block;} .click_now .list_goods ul > li a .label {display:none;} .click_now .select > a label {color:var(--gray900); font-size:19px; font-weight:bold; border-bottom:0;} .click_now .sort {margin-top:52px;} .click_now .sort ul:after {display:block; content:''; clear:both;} .click_now .sort ul li {float:left; line-height:26px; font-size:var(--F21);} .click_now .sort ul li + li {margin-left:30px;} .click_now .sort ul li.on {border-bottom:2px solid var(--purple400);} .click_now .sort a {color:var(--gray600);} .click_now .sort ul li.on a {color:var(--purple400);} .click_now .get_time {position:relative; float:right; margin-top:-28px; color:var(--gray600); font-size:var(--F17); font-weight:bold;} .click_now .get_time .tip {width:16px; height:16px; margin-bottom:-3px; padding:2px; background:url(../images/svgs/question.svg) no-repeat right center/16px auto;} .click_now .get_time .tip_content {/*margin:30px 0 0 -324px;*/ left:auto !important; right:0; top:30px !important; width:282px; line-height:20px; color:var(--gray800); font-size:var(--F13); letter-spacing:-1px;} .list_goods ul > li a .rank {position:absolute; top:0; width:56px; height:56px; text-align:center; background:var(--gray900);} .list_goods ul > li a .rank h5 {margin-top:12px; text-align:center; color:var(--white); line-height:16px; font-size:22px;} .list_goods ul > li a .rank span {display:inline-block; position:relative; margin-top:8px; line-height:8px; text-align:center; font-size:8px;} .list_goods ul > li a .rank span em {padding-left:12px; font-size:var(--F13); font-weight:bold; color:#a4a4a4;} .list_goods ul > li a .rank i.up:before {position:absolute; content:'▲'; color:#a4a4a4;} .list_goods ul > li a .rank i.down:before {position:absolute; content:'▼'; color:#a4a4a4;} .list_goods ul > li a .rank i.stay {display:block; position:absolute; top:3px; width:8px; height:2px; background:#999;} .list_goods ul > li a .rank .new {margin-left:-9px; color:#c487fc;} section.list_Wrap .click_now + .list_goods {margin-top:50px;} /* CLICK NOW (e) ************************************************************/ /* 검색어 랭킹 (s) **********************************************************/ section.ranking {display:table; margin-top:64px !important; padding-top:60px; width:100%; border-top:1px solid var(--gray250); overflow:hidden;} /* #292639 */ section.recommend {margin-top:0 !important} section.recommend .god-lists {margin-bottom:60px;} /* #292639 */ section > h3.ranking {margin-bottom:20px; color:var(--gray900); font-size:19px !important;} section > h3.ranking {margin-bottom:20px; color:var(--gray900); font-size:19px !important;} section > h3.ranking > em {display:inline-block; position:relative; margin-right:10px; color:var(--gray900); font-size:var(--F21); vertical-align:top; font-weight:bold; overflow:hidden;} section > h3.ranking span {display:inline-flex; align-items:center; gap:0 3px; position:relative; margin-left:18px; width:40px; height:50px; line-height:50px; vertical-align:top; font-size:10px; font-weight:bold; overflow:hidden;} /* #292639(s) */ section > h3.ranking span em {display:inline-block; color:var(--gray600); font-size:var(--F14); font-weight:normal;} section > h3.ranking i.up + em {color:var(--red500);} section > h3.ranking i.down + em {color:var(--blue500);} section > h3.ranking i.up {display:inline-block; width:8px; height:8px;} section > h3.ranking i.down {display:inline-block; width:8px; height:8px;} section > h3.ranking i.stay {display:inline-block; width:8px; height:8px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ section > h3.ranking i.up { background-color:var(--red500); --url:url(../images/svgs/rank-up.svg); mask:var(--url) center center / 8px auto no-repeat; -webkit-mask:var(--url) center center / 8px auto no-repeat; } section > h3.ranking i.down { background-color:var(--blue500); --url:url(../images/svgs/rank-down.svg); mask:var(--url) center center / 8px auto no-repeat; -webkit-mask:var(--url) center center / 8px auto no-repeat; } section > h3.ranking i.stay { background-color:var(--gray900); --url:url(../images/svgs/rank-equal.svg); mask:var(--url) center center / 8px auto no-repeat; -webkit-mask:var(--url) center center / 8px auto no-repeat; } } /* #292639(e) */ section > h3.ranking .new {font-weight:700; color:var(--purple400);} /* #292639 */ section > h3.ranking .stay + em {font-size:0;} .ranking ol {display:table-cell; width:25%;} .ranking ol li {display:block; width:100%; line-height:36px; text-align:left; font-size:var(--F14);} .ranking ol li > em {display:inline-block; position:relative; width:40px; height:34px; line-height:34px; vertical-align:top; font-weight:bold; overflow:hidden;} .ranking ol li a {display:inline-block; padding-right:20px; width:calc(80% - 120px); height:34px; line-height:34px; vertical-align:top; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .ranking ol li span {display:inline-block; position:relative; width:40px; height:34px; line-height:34px; text-align:center; vertical-align:top; font-size:9px; font-weight:bold; overflow:hidden;} .ranking ol li span em {display:inline-block; color:var(--gray600); font-size:var(--F12); font-weight:bold;} .ranking ol li i {color:var(--gray600);} .ranking ol li i.up:before {position:absolute; content:'▲';} .ranking ol li i.down:before {position:absolute; content:'▼';} .ranking ol li i.stay {display:block; position:absolute; top:50%; left:50%; margin:-1px 0 0 -5px; width:10px; height:2px; background:#999;} .ranking ol li .new {color:var(--purple400);} .ranking ol li .up + em, .ranking ol li .down + em {text-indent:12px;} .ranking ol li .stay + em {font-size:0;} /* 검색어 랭킹 (e) **********************************************************/ /* 탭 일반/비동기 공용화 (s) *************************************************/ .wrap .contents section > .tabs.sort {display:block; float:none; margin-top:-14px; width:100%;} .wrap .contents section > .tabs.sort ul, .wrap .contents .tabs.sort ul.tab {margin-bottom:50px; border-top:1px solid var(--gray200); border-bottom:1px solid var(--gray200);} .wrap .contents section > .tabs.sort ul:after, .wrap .contents .tabs.sort ul.tab:after {display:block; clear:both; content:'';} .wrap .contents section > .tabs.sort ul li, .wrap .contents .tabs.sort ul.tab li {float:left;} .wrap .contents section > .tabs.sort ul li + li, .wrap .contents .tabs.sort ul.tab li + li {margin-left:0px;} .wrap .contents section > .tabs.sort ul li.on, .wrap .contents .tabs.sort ul.tab li.on {border-bottom:0; background-color:var(--purple400);} .wrap .contents section > .tabs.sort ul li a, .wrap .contents .tabs.sort ul.tab li a {padding:0 30px !important; height:60px; color:var(--gray900); line-height:60px; font-size:var(--F16);} .wrap .contents section > .tabs.sort ul li.on a, .wrap .contents .tabs.sort ul.tab li.on a {color:var(--white) !important; font-weight:bold;} .wrap .contents section > .tabs.sort ul li a:hover, .wrap .contents .tabs.sort ul.tab li a:hover {color:var(--purple400);} .wrap .contents .tabs.sort ul.tab {display:block; margin-top:36px; height:auto;} .wrap .contents .tabs.sort ul.tab:after {display:block; content:""; clear:both;} .wrap .contents .tabs.sort ul.tab li {height:60px;} .wrap .contents .tabs.sort ul.tab > li > a {width:auto;} .wrap .contents .tabs.sort ul.tab > li > a.on {color:var(--white); border-bottom:0; background-color:var(--purple400); font-weight:bold;} /* 탭 일반/비동기 공용화 (e) ************************************************/ /* 키워드 코너 (s) *********************************************************/ .main.wrap .corner_keyword {margin-left:60px; margin-right:60px;} .main.wrap .corner_keyword > h3 {margin-left:0px !important;} .corner_keyword .hash {margin-top:36px;} .hash ul {font-size:0;} .hash ul:after {display:block; clear:both; content:''; } .hash ul li {float:left; margin-bottom:10px; margin-right:10px;} .hash ul li a {display:inline-block; padding:10px 20px; height:28px; line-height:var(--F16LL); color:var(--gray900); font-size:var(--F16); border:1px solid var(--gray250);} .hash ul li a span {display:block; width:100%; max-width:200px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .hash ul li a span:before {content:'#';} .hash ul li a:hover {border-color:var(--purple400); color:var(--purple400)} /* 키워드 코너 (e) *********************************************************/ /* 더보기 (s) *************************************************************/ .view_more {display:inline-block; box-sizing:border-box; padding:0 50px; height:50px; font-size:var(--F14); line-height:48px; color:var(--gray600); border:1px solid var(--gray250); background:none;} .view_more:after {display:inline-block; width:22px; height:100%; vertical-align:middle; background:url(../images/ui/btn_down.svg) no-repeat right center/12px auto; content:'';} .view_more.up:after, p.on .view_more:after {background-image:url(../images/ui/btn_up.svg);} .view_more.right:after {background-image:url(../images/ui/btn_next.svg); background-size:auto 12px;} .view_more:before {content:"VIEW MORE"; vertical-align:middle;} .view_more.auto {padding:0 40px; margin-top:30px; width:auto; font-size:var(--F14); background:none;} .view_more.auto:before {content:none;} .view_more.auto:after {display:inline-block; width:19px; height:46px; vertical-align:top; background:url(../images/ui/btn_next.svg) no-repeat right center/auto 12px; content:''; } /* 더보기 (e) *************************************************************/ /* slider Fader (s) ******************************************************/ .fader {width:100%; padding-bottom:44px;} .fader .lSSlideOuter {position:relative;} .fader .lSSlideWrapper {position:relative;} .fader ul {position:relative;} .fader ul > li {display:block; width:100%; text-align:center; overflow:hidden; margin:0;} .fader .lSSlideWrapper .lightSlider > li {display:block; float:left; width:100%; text-align:center; overflow:hidden;} .fader .lSFade .lslide {position:absolute; top:0; left:0; opacity:0;} .fader .lSFade .lslide.active {opacity:1; z-index:1;} .fader .lSPager {position:absolute; margin-top:-15px; width:100%; text-align:center; z-index:2;} .fader .lSPager ul {display:inline-block;} .fader .lSPager li {display:inline-block; width:auto;} .fader .lSPager li {width:auto; display:inline-block;} .fader .lSPager li a {display:inline-block; margin:0 3px; width:8px; height:8px; text-indent:-9999px; background:#ccc;} .fader .lSPager li.active a {background:var(--gray800);} .fader .lSAction {position:relative; height:18px; margin-top:12px;} .fader .lSAction a {position:absolute; top:0; display:block; width:18px; height:18px; cursor:pointer; z-index:3;} .fader .lSAction a.lSPrev {left:0; background:url(../images/ui/btn_prev_gray.svg) no-repeat left center/18px auto; } .fader .lSAction a.lSNext {right:0;background:url(../images/ui/btn_next_gray.svg) no-repeat left center/18px auto; ;} .fader.arrow .lSPager {position:static; margin-top:20px; width:100%; text-align:center; z-index:2;} .fader.arrow .lSAction {position:static; height:auto; margin:0;} .fader.arrow .lSAction a {position:absolute; top:50%; margin-top:-43px; width:45px; height:85px; opacity:0.4; background:url(../images/base/btn_billboard_action.svg) no-repeat; cursor:pointer; z-index:3;} .fader.arrow .lSAction a.lSPrev {left:30px; background-position:left center;} .fader.arrow .lSAction a.lSNext {right:30px; background-position:right center;} /* slider Fader (e) ******************************************************/ /* Slider_pager (s) ******************************************************/ .slider_pager .lSSlideOuter {position:relative;} .slider_pager .lSSlideWrapper {position:relative; overflow:hidden;} .slider_pager .lSSlideWrapper .lSSlide > li {float:left;} .slider_pager .lSAction a {position:absolute; top:50%; margin-top:-62px; width:45px; height:85px; opacity:0.4; background:url(../images/base/btn_billboard_action.svg) no-repeat; cursor:pointer; z-index:3;} .slider_pager .lSAction a.lSPrev {left:30px; background-position:left center;} .slider_pager .lSAction a.lSNext {right:30px; background-position:right center;} .slider_pager .lSPager {position:absolute; margin-top:36px; width:100%; text-align:center; z-index:2;} .slider_pager .lSPager ul, .slider_pager .lSPager li {display:inline;} .slider_pager .lSPager li a {display:inline-block !important; margin:0 3px; width:8px; height:8px; text-indent:-9999px; background:#ccc;} .slider_pager .lSPager li.active a {background:var(--gray800);} /* Slider_pager (e) ******************************************************/ /* prd_slide_type (s) ****************************************************/ .prdSlider {padding:0 60px;} .wrap.main .contents section.prdSlider > h3 {margin-left:0;} .prdSlider .lSSlideOuter {position:relative;} .prdSlider .lSSlideWrapper {position:relative;} .prdSlider .lSFade .lslide {position:absolute; top:0; left:0; opacity:0;} .prdSlider .lSFade .lslide.active {opacity:1; z-index:1;} .prdSlider .lSAction a {position:absolute; top:50%; margin-top:-40px; width:80px; height:80px; cursor:pointer; z-index:3;} .prdSlider .lSAction a.lSPrev {left:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_prev.svg) no-repeat center center/14px auto; } .prdSlider .lSAction a.lSNext {right:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_next.svg) no-repeat center center/14px auto; } .prdSlider .lSPager {padding-top:20px; width:100%; text-align:center; z-index:2;} .prdSlider .lSPager ul, .prdSlider .lSPager li {display:inline;} .prdSlider .lSPager li a {display:inline-block; margin:0 5px; width:12px; height:12px; text-indent:-9999px; background:#ccc; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} .prdSlider .lSPager li.active a {width:24px; background:var(--purple400);} /* prd_slide_type (e) ****************************************************/ /* 세사패 Diver_ SSF SHOP 상품 상세페이지 (s) *****************************/ #diverstyle {text-align:left; margin-top:95px; }/* #173384 수정 */ /* #187118: 20230417 삭제 #diverstyle h3 { margin-bottom:30px; line-height:30px; font-size:25px;} */ #diverstyle h3 .tips {position:absolute; display:inline-block; margin-left:20px; padding:0 10px; border-radius:3px; font-size:var(--F13); line-height:30px; color:var(--white); background:var(--purple400);} #diverstyle h3 .tips::before {position:absolute; content:''; display:block; top:11px; left:-4px; width:8px; height:8px; background:var(--purple400); transform:rotate(-45deg);} #diverstyle .toggle_ellipsis img {width:100%;} #diverstyle .toggle_ellipsis > ul {margin-top:10px;} #diverstyle .toggle_ellipsis > ul li {padding:30px 0; font-size:var(--F14);} #diverstyle .toggle_ellipsis > ul li > dl:after {display:block; clear:both; content:'';} #diverstyle .toggle_ellipsis > ul li > dl dt {float:left; padding-right:30px; width:60px;} #diverstyle .toggle_ellipsis > ul li > dl dd {float:left; width:960px;} #diverstyle .toggle_ellipsis > ul li > dl dt + dd {float:left; width:870px;} #diverstyle .toggle_ellipsis > ul li > dl dd .info {margin-bottom:12px;} #diverstyle .toggle_ellipsis > ul li > dl dd .info > a span {display:block; line-height:22px; font-size:14px !important;} #diverstyle .toggle_ellipsis > ul li > dl dd .info > a span.name {color:var(--gray600);} #diverstyle .toggle_ellipsis > ul li > dl dd .info + .summary {margin-top:24px !important;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary {color:var(--gray800);} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > span + span {margin-left:15px;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > .color em:first-child {margin-left:15px;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > .color:before {content:'|';} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > span em + em {margin-left:10px; color:var(--gray900);} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > .best {padding:0 6px; border:1px solid var(--purple400); font-size:var(--F13); color:var(--purple400); line-height:16px;} #diverstyle .toggle_ellipsis > ul li > dl dd .date {color:var(--gray600);;} #diverstyle .toggle_ellipsis > ul li > dl dd .date em + em {margin-left:10px;} #diverstyle .toggle_ellipsis > ul li > dl dt {position:relative;} #diverstyle .toggle_ellipsis > ul li > dl dt .file {display:inline-block; position:absolute; right:35px; bottom:5px; padding:0 6px; line-height:20px; color:var(--white); font-size:var(--F13); font-weight:bold; background:rgba(0, 0, 0, 0.6);} #diverstyle .toggle_ellipsis > ul li > dl dd .summary {margin:0 0 18px !important;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > div {margin-bottom:10px;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > div > i {margin-top:0 !important;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > div > i + i {margin-left:3px;} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > span {color:var(--gray600);} #diverstyle .toggle_ellipsis > ul li > dl dd .summary > .color::before {content:'';} #diverstyle .toggle_ellipsis .content {margin-bottom:18px; height:auto; max-height:110px; line-height:22px; } #diverstyle .toggle_ellipsis .content.on {max-height:9999px;} #diverstyle .toggle_ellipsis .content.disabled {background:none;} #diverstyle .toggle_ellipsis .content .img {display:none;} #diverstyle .toggle_ellipsis .content.on .img {display:block;} #diverstyle .toggle_ellipsis .content .img {margin-top:20px;text-align:center;} #diverstyle .toggle_ellipsis .content .img img {display:block; margin-top:10px; width:auto; max-width:500px; max-height:500px;} #diverstyle .date .profile {position:relative; margin-right:10px; display:inline-block; width:40px; height:40px; overflow:hidden; border-radius:50%; vertical-align:middle;} #diverstyle .date .profile img {min-width: 100%; min-height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); object-fit: cover;} #diverstyle .date .bold {font-weight:bold;} #diverstyle .txt_diver {color:var(--gray900);} #diverstyle .txt_diver em {font-weight:bold;} /* 세사패 Diver_ SSF SHOP 상품 상세페이지 (e) *****************************/ /* Banner (s) ***********************************************************/ /* Banner Marketing*/ section.marketing {position:relative; width:100%; height:auto; overflow:hidden;} section.marketing > a {display:flex; justify-content:center} section.marketing > a img {width:100%;} /* 개인화 마케팅 */ section.marketing.indiv {height:250px;} section.marketing.indiv .birth, section.marketing.indiv .coupon, section.marketing.indiv .coin {display:block; text-align:center; padding:60px 0; width:1920px; height:130px; vertical-align:middle;} section.marketing.indiv .birth {background:url(../images/temp/bg_banner_birth.jpg) no-repeat center center;} section.marketing.indiv .coupon.type01 {background:url(../images/temp/bg_banner_coupon01.jpg) no-repeat center center;} section.marketing.indiv .coupon.type02 {background:url(../images/temp/bg_banner_coupon02.jpg) no-repeat center center;} section.marketing.indiv .coupon.type03 {background:url(../images/temp/bg_banner_coupon03.jpg) no-repeat center center;} section.marketing.indiv .coin {background:url(../images/temp/bg_banner_coin.jpg) no-repeat center center;} section.marketing.indiv .copy {line-height:21px; color:var(--gray900); font-size:23px;} section.marketing.indiv h5 {width:100%; margin:20px 0 30px; line-height:43px; color:var(--gray900); font-size:41px; font-weight:normal;} section.marketing.indiv .info {line-height:16px; color:var(--gray600); font-size:var(--F17);} section.marketing.indiv > a {position:absolute; left:50%; transform:translateX(-50%);} /* Banner Categoty*/ section.category {position:relative; margin-top:0 !important; width:100%; height:540px; overflow:hidden;} section.category.h400 {margin-top:80px !important; height:400px;} section.category > div {position:absolute; left:50%; margin-left:-960px;} section.category > div > img {width:auto;} .promotion .banner {position:relative; width:100%; height:300px; overflow:hidden;} .promotion .banner a img {position:absolute; width:auto; height:100%} .promotion .banner + .benefits {margin-top:10px;} .promotion .benefits {width:100%; text-align:center; background:#f4f0f8;} .promotion .benefits > ul {display:inline-block; padding:50px 0;} .promotion .benefits > ul:after {display:block; clear:both; content:"";} .promotion .benefits > ul > li {float:left; text-align:left;} .promotion .benefits > ul > li + li {margin-left:100px;} .promotion .benefits > ul > li img {float:left; margin-right:20px; width:80px; height:80px; background:#333;} .promotion .benefits > ul > li span {display:inline-block; width:170px; line-height:24px; color:var(--gray900); font-size:var(--F17); word-wrap:break-word; word-break:keep-all;} .promotion .benefits > ul > li em {display:block; line-height:24px; color:var(--gray600); font-size:var(--F14);} /* Banner (e) ***********************************************************/ /* 멤버십 통합 (s) *******************************************************/ .mem-class {font-size:0;} .mem-class .coin {display:inline-block; width:121px; height:121px; line-height:121px; text-align:center; color:var(--white); font-size:19px; border-radius:50%; font-weight:bold; font-weight:600;} .mem-class .badge {display:inline-block; padding:0 12px; height:26px; line-height:26px; text-align:center; color:var(--white); font-size:var(--F14); border-radius:var(--radius); font-weight:bold;} .mem-class .coin.min {width:45px; height:45px; line-height:43px; font-size:var(--F21);} .mem-class .lv-01 {background:var(--gray800);} .mem-class .lv-02 {background:var(--gray900);} .mem-class .lv-03 {background:linear-gradient(-45deg, var(--purple400) 40%, #903cc1 100%);} .mem-class .badge.lv-03 {background:linear-gradient(-90deg, var(--purple400) 40%, #903cc1 100%);} .mem-class .lv-04 {background:linear-gradient(-45deg, #74553c 40%, #b58643 100%);} .mem-class .badge.lv-04 {background:linear-gradient(-90deg, #74553c 40%, #b58643 100%);} .mem-class .lv-05 {background:linear-gradient(-45deg, #acacac 40%, #d5d5d5 100%);} .mem-class .badge.lv-05 {background:linear-gradient(-90deg, #acacac 40%, #d5d5d5 100%);} .mem-class .lv-06 {background:linear-gradient(-45deg, #c08837 40%, #e1be61 100%);} .mem-class .badge.lv-06 {background:linear-gradient(-90deg, #c08837 40%, #e1be61 100%);} .mem-class .lv-07 {background:linear-gradient(-45deg, #111380 40%, #874af7 100%);} .mem-class .badge.lv-07 {background:linear-gradient(-90deg, #111380 40%, #874af7 100%);} .mem-class .lv-08 {background:linear-gradient(-45deg, #7a47ec 40%, #57eaef 100%);} .mem-class .badge.lv-08 {background:linear-gradient(-90deg, #7a47ec 40%, #57eaef 100%);} .mem-class .lv-01:after {content:'SSF 멤버';} .mem-class .lv-02:after {content:'WELCOME';} .mem-class .lv-03:after {content:'FAMILY';} .mem-class .lv-04:after {content:'BRONZE';} .mem-class .lv-05:after {content:'SILVER';} .mem-class .lv-06:after {content:'GOLD';} .mem-class .lv-07:after {content:'PLATINUM';} .mem-class .lv-08:after {content:'DIAMOND';} .mem-class .min.lv-03:after {content:'F';} .mem-class .min.lv-04:after {content:'B';} .mem-class .min.lv-05:after {content:'S';} .mem-class .min.lv-06:after {content:'G';} .mem-class .min.lv-07:after {content:'P';} .mem-class .min.lv-08:after {content:'D';} /* 불편한 기능 제보 */ .inner-wrap .lnb ~ .troubleTip {width:690px !important; padding-left:30px} .troubleTip > p:first-child {padding:34px 0; text-align:center; font-size:27px; font-weight:bold;} .troubleTip .gotoTip {padding:0 0 50px; text-align:center; }/* #174121 수정 */ .troubleTip .btn.bk {display:block; width:155px; height:50px; padding:16px 32px 15px 32px; margin:0 auto; line-height:18px; font-size:var(--F15); font-weight:bold;}/* #174121 수정 */ .troubleTip .gotoTip .btn:not(.bk) {height:52px; color:var(--gray800); padding:0; margin:0 auto; border-color:transparent; line-height:52px;} .troubleTip {text-align: center;} .troubleTip h2 {font-weight: bold; font-size:var(--F21); line-height:26px; margin-bottom:8px; color:var(--gray900);} .troubleTip p {font-weight: normal; font-size:var(--F15); line-height:20px; margin-bottom:40px; letter-spacing: -0.5px;} .troubleTip .card-area {display: flex; background-color: var(--gray100); padding:30px 40px; align-items: center; justify-content: space-between;} .troubleTip .card-area .card-con {display: flex; align-items: center;} .troubleTip .card-area .card-con .card-image {width:60px; background-color: var(--white); border-radius: 50%; margin-right:10px;} .troubleTip .card-area .card-con .card-text {font-size:var(--F15); font-weight: normal; line-height: 20px; letter-spacing: -0.05em; color:var(--gray600);} .troubleTip .card-area .card-con .card-text span{color:var(--gray900);} .troubleTip .card-area .txtC button.reload {position:static; height:48px; line-height:22px; width:112px; border:1px solid var(--gray250); font-weight: bold; font-size:var(--F15); } .troubleTip .done {width:670px; padding-top:120px; text-align:center; background:url(../images/ui/bg_face_smile.gif) no-repeat center top;}/* #174121 수정 */ .troubleTip .done strong {font-size:var(--F21); color:var(--gray900);} .troubleTip .done span {display:block; padding:12px 0 36px; color:var(--gray800); line-height:19px;}/* #174121 수정 */ .troubleTip .done .btn {width:181px; height:50px; padding:0; line-height:48px; font-size:var(--F15);}/* #174121 수정 */ .troubleList {position:relative; padding-top:38px; } .troubleList p:first-child {font-size:19px; line-height:60px;font-weight:bold;} .troubleList button.reload {position:absolute; right:0; top:54px; padding:0 24px; line-height:34px; height:34px; color:var(--gray800); background:none; border:1px solid var(--gray250);} .troubleList button.reload:before {display:inline-block; vertical-align:middle; height:34px; width:23px; background:url(../images/ui/reload.png) no-repeat left center; content:''; } .troubleList .txtC {padding-top:10px;} .troubleList .txtC button.reload {position:static; height:48px; line-height:46px; padding:0 48px;} .troubleList .grid-item {width:467px; margin-bottom:20px; box-sizing:border-box; border-radius:9px; background:#e7e7e7; overflow:hidden;} .troubleList .grid-item img {width:100%;} .troubleWrite {width:540px;} .troubleWrite h2 {color:var(--gray900);} .troubleWrite strong {display:block; color:var(--gray900); white-space: nowrap;} .troubleWrite .trouble_serious {display:flex; justify-content: center; padding:46px 0 43px;} .troubleWrite .trouble_serious label {display:inline-block; width:120px; margin:0 10px; padding-top:88px; line-height:20px; vertical-align:top; color:var(--gray600); text-align:center; box-sizing:border-box; background-image:url(../images/ui/bg_serious.png); background-repeat: no-repeat;} .troubleWrite .trouble_serious label.so {background-position:0 0;} .troubleWrite .trouble_serious label.ng {background-position:0 -200px;} .troubleWrite .trouble_serious label.worst {background-position:0 -400px;} .troubleWrite .trouble_serious input:checked + label {color:var(--purple400); } .troubleWrite .trouble_serious input:checked + label.so {background-position:-120px 0;} .troubleWrite .trouble_serious input:checked + label.ng {background-position:-120px -200px;} .troubleWrite .trouble_serious input:checked + label.worst {background-position:-120px -400px;} .troubleWrite .trouble_txt textarea {width:100%; height:120px; margin-top:8px; padding:16px 18px; box-sizing:border-box; line-height:23px;}/* #174121 수정 */.troubleWrite .trouble_txt textarea::placeholder {color:var(--gray600);} .troubleWrite .trouble_photos {display:flex; width:100%; padding-top:38px;} .troubleWrite .trouble_photos > * {flex:auto; padding-right:20px;} .troubleWrite .trouble_photos .file_wrap {padding:2px 0 0 0; margin:0; border-top: none;} .troubleWrite .submit {margin-top:26px;}/* #174121 수정 */ .troubleWrite .submit button {width:325px; height:50px; padding:0; line-height:50px; background:var(--gray900); color:var(--white); font-size:var(--F17); } .troubleWrite .submit button:disabled {background:#d5d5d5;} .popup .troubleWrite .file_wrap .file_img {width:96px; height:124px; margin-left:10px;} /* 멤버십 통합 (e) *******************************************************/ /* 장바구니&주문결제 (e) *************************************************/ /* PCOD 주문결제 */ /* #268969: 20250331 (s) */ section.order .order-util {display:flex; justify-content:flex-end; margin-bottom:10px;} section.order .order-util .toggle-box {display:flex; align-items:center; gap:0 12px; height:36px;} section.order .order-util .toggle-box .toggle-title {font-size:var(--F15); color:var(--gray900); line-height:var(--F15L);} /* #268969: 20250331 (e) */ section.order .grid_wrap.goods .info .name {max-width:240px;} section.order .grid_wrap.goods + .caution {margin-top:25px;} section.order div > h4 {margin-top:56px; line-height:28px; font-size:19px; color:var(--gray900);} section.order div > h4 > a {float:right; font-weight:bold; font-size:var(--F15); color:var(--gray600); line-height:26px;} section.order div > h4 > .edit {position:absolute; width:400px; text-align:right; margin-top:-32px; left:419px;} section.order div > h4 > .edit .btn.gy {font-size:var(--F14);} section.order .confirm_wrap {margin-top:70px; border-top:1px solid var(--gray800);} section.order .confirm_wrap.type_1 {margin-top:0; border:0 none;} section.order .confirm_wrap h5 {margin-top:40px; color:var(--gray800); font-size:var(--F15);} section.order .confirm_wrap .txt {margin-top:30px; line-height:20px; color:var(--gray600);} section.order .confirm_wrap .list_wrap {margin-top:30px; color:var(--gray600);} section.order .confirm_wrap .certify {margin:45px auto 0; width:auto; text-align:center;} section.order .confirm_wrap .certify:after {display:block; content:''; clear:both;} section.order .confirm_wrap .checkbox {display:block; margin-top:40px; color:var(--gray900);} section.order .confirm_wrap .checkbox a {float:right; font-weight:bold; color:var(--gray600); line-height:34px;} section.order .confirm_wrap .checkbox a span {display:none;} section.order .confirm_wrap .checkbox a span:first-child {display:block;} section.order .confirm_wrap .checkbox.on a span:first-child {display:none;} section.order .confirm_wrap .checkbox.on a span:last-child {display:block;} section.order .confirm_wrap .mCS {display:none; margin-top:30px; height:150px; text-align:left; background:var(--gray150);} section.order .confirm_wrap.type_1 .mCS {display:block;} section.order .confirm_wrap .on + .mCS {display:block;} section.order .confirm_wrap + .confirm_wrap {padding-top:20px; border-top:1px solid var(--gray250);} section.order .confirm_wrap + .confirm_wrap > h4 {margin-top:0;} section.order .form_wrap {margin-top:70px; border-top:1px solid var(--gray800);} section.order .form_wrap + .form_wrap {margin-top:45px;} section.order .form_wrap > ul {margin-top:20px; width:540px;} section.order .form_wrap > ul > .division + .division {margin-top:20px; padding-top:20px; border-top:1px solid var(--gray250);} section.order .form_wrap > ul > li .item {vertical-align:top;} section.order .form_wrap > ul > li .shop {position:relative; width:100%; vertical-align:middle;} section.order .form_wrap > ul > li .shop em {display:inline-block; width:362px; line-height:24px; word-wrap:break-word; word-break:keep-all;} section.order .form_wrap > ul > li .shop i.map {float:right;} section.order .form_wrap > ul > li .mine {position:absolute; color:var(--gray600); margin-left:18px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; vertical-align:top;} section.order .form_wrap > ul > li .mine + .input_box {width:150px;} section.order .form_wrap > ul > li a.btn {display:inline-block; } section.order .form_wrap > ul > li .input_box + a.btn, section.order .form_wrap > ul > li .input_box + input + a.btn {display:inline-block; width:100px; margin-left:20px; vertical-align:top;} section.order .form_wrap > ul > li .input_box + .checkbox {margin-left:17px;} section.order .form_wrap > ul > li .input_box + .checkbox label {margin:0; width:100px;} section.order .form_wrap > ul > li .input_box + .checkbox.save {margin-left:0;} section.order .form_wrap > ul > li .input_box + .checkbox.save label {margin-top:10px; width:200px;} section.order .form_wrap > ul > li .outside {position:absolute; margin-left:440px !important; color:var(--gray600);} section.order .form_wrap > ul > li .outside.caution {height:35px; line-height:35px; color:var(--purple400); background-position:left 8px;} section.order .form_wrap > ul > li .outside.default {height:35px; line-height:var(--F14L); color:var(--gray600); font-size:var(--F14);} section.order .form_wrap > ul > li .pickup_addr {line-height:30px;} section.order .form_wrap > ul > li .pickup_addr .btn {display:inline-block; margin-top:14px;} section.order .form_wrap > ul > li .input_box.type_1 {padding-bottom:45px;} section.order .form_wrap > ul > li .input_box .desc {position:absolute; left:0; width:820px;} section.order .form_wrap > ul > li .input_box .desc a {color:var(--gray600);} section.order .form_wrap > ul.type_1 > li .input_box {width:190px;} section.order .form_wrap > ul > li .item .arrow {display:inline-block; width:10px; height:6px; margin-left:7px; background:url(../images/ui/btn_down_gray.svg) no-repeat left center/10px auto; vertical-align:middle;} section.order .form_wrap > ul > li.on .balloon {display:block;} section.order .form_wrap > ul > li .balloon {display:none; position:absolute; z-index:100; padding:17px 20px; width:290px; background-color:var(--white); border:1px solid var(--gray900); text-align:center;} section.order .form_wrap > ul > li .balloon li {position:relative;padding-left:10px; font-size:var(--F13); color:var(--gray600); text-align:left; line-height:var(--F13L);} section.order .form_wrap > ul > li .balloon li:before {position:absolute; top:9px; left:0; width:2px; height:2px; background-color:var(--gray600); content:'';} section.order .form_wrap > ul > li.unipass {padding-bottom:48px;} section.order .form_wrap > ul > li.unipass .reset:disabled {background:var(--white);} /* #251787:20241011 (s) */ section.order .form_wrap .agree_unipass {margin:5px 0 0 140px !important; line-height:24px;} section.order .form_wrap .agree_unipass .remote {line-height:19px;} section.order .form_wrap .agree_unipass .zoom120 {color:var(--gray800); font-size:var(--F17); text-decoration:underline;} section.order .form_wrap .agree_unipass .remote_wrap {padding:0px !important;} section.order .form_wrap .agree_unipass .agreeContents {margin:0px !important;} /* #251787:20241011 (e) */ /* 빠른배송서비스 */ section.order .form_wrap p.invalid {margin-top:18px; font-size:var(--F13); color:var(--red500); line-height:var(--F13L);} /* #246087 */ section.order .form_wrap .pin {margin-top:15px; display: flex;} section.order .form_wrap p.invalid + .pin {margin-top:10px;} /* #246087 */ section.order .fast_time {margin-top:10px;} section.order .fast_time .time_info {font-size:var(--F13); color:var(--gray900); line-height:var(--F13L);} section.order .fast_time .time_info b {font-weight:700;} section.order .fast_time .time_valid {margin-top:2px; font-size:var(--F13); line-height:var(--F13L);} section.order .form_wrap .pin span { border-radius: 4px; height: 15px; font-size: 10px; line-height: 14px; padding:0px 4px 0px; margin-right:4px; border:1px solid var(--gray250); box-sizing: border-box;} section.order .form_wrap .pin span.fast {background-color: var(--mint500); color:var(--white); border:0;} section.order .form_wrap .pin span.normal { background-color: var(--gray900); color:var(--white); border:0;} section.order .form_wrap.fast .input_wrap{ margin-top:10px;} section.order .form_wrap.fast .input_wrap .row:first-child { margin-top:10px;} section.order .form_wrap.fast .info{display: block; margin:10px 0 20px;} section.order .form_wrap.fast .info dt{ font-size:var(--F13); line-height:var(--F13L); margin-bottom:2px;} section.order .form_wrap.fast .info dt strong{ font-weight: bold;} section.order .form_wrap.fast .info dd{ font-size:var(--F13); line-height:var(--F13L); color: var(--purple400);} section.order .form_wrap.fast h3 { font-size:18px; line-height: 19px; font-weight: bold; margin-top: 50px; } section.order .form_wrap.fast .grid_wrap.fast {width:540px; margin-top:20px;} /* #246087 */ section.order .form_wrap.fast .grid_wrap.fast tr:first-child td { border-top: 0;} section.order .form_wrap.fast .grid_wrap.fast thead tr th {height:60px; padding:0; background-color: var(--gray150); border-bottom:1px solid var(--gray250); box-sizing:border-box;} section.order .form_wrap.fast .grid_wrap.fast tbody tr td {height:60px; padding:0; color:var(--gray900); position:relative;box-sizing:border-box;} section.order .form_wrap.fast .grid_wrap.fast tbody tr td span { display:block; font-size:var(--F13); font-weight:normal; line-height: var(--F13L); color:var(--gray500); } section.order .form_wrap.fast .grid_wrap.fast tbody tr td label.radio > .label { padding:2px 0 0 20px;} section.order .form_wrap.fast .grid_wrap.fast tbody tr td label.radio > label > i { margin:0;} section.order .form_wrap.fast .grid_wrap.fast .checkbox > label, .radio > label {margin-right:0;} /* #246087(s) section.order .form_wrap.fast .grid_wrap.fast .tips-layer-fast {display:none !important; z-index: 1; position:absolute; top:49px; left:50%; margin-left:-60px; display: inline-block; color:var(--gray800); padding:11px 25px 12px 24px; background:#f7eeff; border:1px solid #f0e5fa;} section.order .form_wrap.fast .grid_wrap.fast .tips-layer-fast:after {position:absolute; top:-8px; left:50%; margin-left:-3px; display:block; width:10px; height:8px; background:url(../images/ui/bu_tip_up.png) no-repeat center center/10px 8px; content:''; transition: opacity 0.2s;} section.order .form_wrap.fast .grid_wrap.fast .tips-layer-fast.active{display:none;} section.order .form_wrap.fast .grid_wrap.fast .tips-layer-fast p {color:var(--gray800);font-size:var(--F13); line-height: var(--F13L);} #246087(e) */ section.order .form_wrap.fast .grid_wrap.fast .radio > input[type=radio]:disabled + label > i:after {background: var(--gray400);} /* #246087(s) */ section.order .form_wrap.fast > span, section.order .form_wrap.fast > section > span {margin-top:10px; padding-left:19px; display:block; position:relative; font-weight: normal; font-size:var(--F13); line-height: var(--F13L); color:var(--purple500);} section.order .form_wrap.fast > span::before, section.order .form_wrap.fast > section > span::before {content:""; position:absolute; top:7px; left:8px; width:3px; height:3px; border-radius:2px; background-color:var(--purple400);} section.order .form_wrap.fast > section > h3 {margin:50px 0 0; height:auto; font-size:18px !important; line-height:19px; font-weight:bold;} section.order .form_wrap.fast .ship_info dt {color:var(--gray900);} /* #246087 */ section.order .form_wrap .ship_info {margin-top:10px;} section.order .form_wrap .ship_info dt {font-size:var(--F13); font-weight:700; color:var(--gray700); line-height:var(--F13L);} section.order .form_wrap .ship_info dd {position:relative; padding-left:19px; font-size:var(--F12); color:var(--gray700); line-height:var(--F12L);} section.order .form_wrap .ship_info dd::before {content:""; position:absolute; top:7px; left:8px; width:3px; height:3px; border-radius:2px; background-color:var(--gray700);} section.order .form_wrap .ship_info .info_point {color:var(--purple400);} section.order .form_wrap .ship_info .info_point::before {background-color:var(--purple400);} section.order .form_wrap .ship_info .invalid_point {color:var(--red500);} section.order .form_wrap .ship_info .invalid_point::before {background-color:var(--red500);} section.order .form_wrap .ship_empty {margin:0 0 5px; width:540px; border:1px solid var(--gray250); padding:40px 0; font-size:var(--F14); color:var(--gray800); text-align:center; line-height:var(--F14L);} /* #246087(e) */ section.order .form_wrap.request select {width:100%; background:url(../images/ui/btn_down_gray.svg) no-repeat 97% center/ 12px auto;padding: 2px 30px 2px 20px;} section.order .form_wrap.request input {margin:8px 0 10px;} section.order .form_wrap.request .row>span { font-size:var(--F13); line-height:20px; color:var(--purple500);} section.order .form_wrap.request .row .radio {display:block; padding-top:10px; margin-bottom:22px; } section.order .form_wrap.request .row .radio label { margin-right:42px; } section.order .form_wrap.request dl { width:540px; padding:20px; background-color: #F7F7F7; font-size:var(--F14); line-height:var(--F14L); margin-top:20px; }/* #205947 */ section.order .form_wrap.request dt { color:var(--purple500); margin:0 0 10px 8px; position:relative; }/* #205947 */ section.order .form_wrap.request dt:before {content: "*"; display: block; position: absolute; top: 0; left: -10px; width: 10px; } section.order .form_wrap.request dt:first-child {margin:0 0 5px 8px;}/* #205947 */ section.order .form_wrap.request dd { margin-left:8px; position:relative; } section.order .form_wrap.request dd:before {content: "-"; display: block; position: absolute; top: 0; left: -10px; width: 10px; } /* section.order .form_wrap.request dd:last-child:before {content: ""; display: block; position: absolute; top: 0; left: -10px; width: 10px; } #205947 */ section.order .form_wrap.request textarea{height:200px;} /* // 빠른배송서비스 */ section.order .packing {margin-top:45px; border-top:1px solid var(--gray800);} section.order .packing > p {margin-top:30px; line-height:20px; color:var(--gray600);} /* [22년 1분기] 선물 포장 서비스 개선 */ section.order .packing > ul {margin-top:30px; padding:15px 0; border-top:1px solid var(--gray250);} section.order .packing > ul > li {padding:15px 0; line-height:35px;} section.order .packing > ul > li .packing_info {display:inline-block; width:386px; vertical-align:top;} section.order .packing > ul > li .info {display:inline-block; width:450px; vertical-align:middle;} /*188885*/ section.order .packing > ul > li .info ~ .info {margin-top:20px;} section.order .packing > ul > li .info .brand {display:block; line-height:20px; color:var(--gray900);} section.order .packing > ul > li .info .name {display:block; line-height:20px; color:var(--gray800); word-break: break-word; white-space: initial;} /*188885*/ section.order .packing > ul > li .info .option {display:block; line-height:20px; color:var(--gray600);} section.order .packing > ul > li > i {margin-left:30px;} /*section.order .packing > ul > li .packing_radio {display:inline-block; width:277px; margin-top:24px; vertical-align:top;} section.order .packing > ul > li .packing_radio .radio ~ .radio {margin-left:26px;}*/ /* [22년 1분기] 선물 포장 서비스 개선 */ section.order .packing .checkbox > label {margin:0;} section.order .packing .checkbox > label > i {margin-right:25px;} section.order .packing .checkbox + i {margin-left:0;} section.order .payment {border-top:1px solid var(--gray800);} section.order .payment .tabs {margin-top:40px;} section.order .payment .tabs .tab {display:flex; height:60px; border:0;} section.order .payment .tabs .tab li {flex:1 0 auto; height:60px; line-height:60px; border:1px solid var(--gray250); border-right:0; box-sizing:border-box; border-collapse:collapse;} section.order .payment .tabs .tab li:last-child {border-right:1px solid var(--gray250);} section.order .payment .tabs .tab li > a, section.order .payment .tabs .tab li > label {display:block; height:58px; line-height:58px; color:var(--gray600); font-size:var(--F15); border-bottom:0; text-align:center;} section.order .payment .tabs .tab li > a.on, section.order .payment .tabs .tab li > label.on {color:var(--white); background:var(--purple400);} section.order .payment .tabs .tab li > a.on span, section.order .payment .tabs .tab li > label.on span {padding-left:32px; font-size:var(--F16); font-weight:bold; color:var(--white); background:url(../images/ui/bg_fin_check_white.svg) no-repeat left center/22px auto;} section.order .payment .tabs > div {margin-top:15px;} section.order .payment .tabs .checkbox + .btn {float:right;} section.order .payment .tabs .list_wrap {padding-top:15px; font-size:var(--F15);} section.order .payment .tabs .list_wrap > ul > li {color:var(--gray600); text-indent:-7px;} section.order .payment .tabs .funding_payment h3 {margin-top:24px; font-size:var(--F16);} section.order .payment .tabs .funding_payment p {margin-top:5px; line-height:22px; color:var(--gray800); font-size:var(--F15);} section.order .payment .checkbox > label, section.order .payment .radio > label {color:var(--gray800); margin-right:40px; font-size:var(--F15);} section.order .bill {margin-top:70px; padding-top:70px; border-top:1px solid var(--gray250);} section.order .bill + .list_wrap {margin-top:24px; color:var(--gray600); font-size:var(--F14);} section.order .bill + .caution{margin-top:20px;margin-bottom:0px;}/* #214453:20230829 */ section.order .bill ~ .agree {margin-top:60px;}/* #214453:20230829 */ section.order .banners + .bill {margin-top:90px; padding-top:0; border-top:0;} section.order .banners {margin-top:54px;} section.order .banners.slider .lSPager {position:absolute; margin-top:20px; width:100%; text-align:center; z-index:2;} section.order .banners.slider .lSPager ul, section.order .banners.slider .lSPager li {display:inline;} section.order .banners.slider .lSPager li a {display:inline-block; margin:0 5px; width:12px; height:12px; text-indent:-9999px; border-radius:var(--radius); background:#ccc; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}/*#142595*/ section.order .banners.slider .lSPager li.active a {width:24px; background:var(--purple400);} section.order .banners.slider .lSAction a {display:none; position:absolute; width:10px; height:17px; z-index:1; padding:10px; } /*#142595*/ section.order .banners.slider .lSAction a.lSPrev {left:20px; background:url(../images/ui/btn_prev.svg) no-repeat center center /10px auto;} section.order .banners.slider .lSAction a.lSNext {right:20px; background:url(../images/ui/btn_next.svg) no-repeat center center /10px auto;} section.order .agree {margin-top:45px; font-size:var(--F15);} section.order .agree .checkbox {margin-bottom:10px;}/*//#157237*/ section.order .agree h4 {margin-bottom:30px;} section.order .agree .remote {display:inline-block; vertical-align:middle; padding-right:20px; width:auto; height:auto; color:var(--gray600); background-position:right center; } section.order .agree .remote_wrap {margin:18px 0 0 28px !important; color:var(--gray600); font-size:var(--F14);} section.order .agree .fast { padding-left: 25px; line-height: 20px; text-align: left; color: var(--purple400); font-size:var(--F13);font-weight: normal; background: url(../images/base/bg_caution_lite.png) no-repeat left 1px; background-size: 18px auto;} /* 수선 결제페이지 */ section.order .form_wrap + .payment {margin-top:45px;} section.order .payment .pay_wrap {margin-top:35px;} section.order .payment .pay_wrap .radio_box {display:inline-block; vertical-align:middle;} section.order .payment .pay_wrap .radio_box:after {display:block; clear:both; content:'';} section.order .payment .pay_wrap .radio_box li {float:left; width:190px; height:60px; line-height:60px; border:1px solid var(--gray250); border-right:0; box-sizing:border-box; border-collapse:collapse;} section.order .payment .pay_wrap .radio_box li:last-child {border-right:1px solid var(--gray250);} section.order .payment .pay_wrap .radio_box li > label {display:block; height:58px; line-height:58px; color:var(--gray600); font-size:var(--F15); border-bottom:0; text-align:center;} section.order .payment .pay_wrap .radio_box li input[type=radio]:checked + label {color:var(--white); background:var(--purple400);} section.order .payment .pay_wrap .radio_box li input[type=radio]:checked + label span {padding-left:26px; font-weight:bold; background:url(../images/ui/bg_fin_check_white.svg) no-repeat left center / 22px auto;} section.order .payment .pay_wrap .checkbox {margin-left:36px; vertical-align:middle;} section.order .payment .pay_wrap .checkbox label {color:var(--gray900);} section.order.mypage div > h4 {position:relative;} section.order.mypage div > h4 > .btns {left:140px} /* 주문완료 */ section.order {font-size:var(--F15);} section.order .line_wrap {padding:60px 0;} section.order .tit_wrap + .line_wrap {border-top:1px solid var(--gray250);} section.order .line_wrap + .line_wrap {border-top:1px solid var(--gray800);} section.order .line_wrap h3 {font-size:19px; color:var(--gray900); line-height:28px;} section.order .line_wrap p {margin-top:32px; font-size:var(--F17); color:var(--gray800); line-height:24px;} section.order .line_wrap p.sub_txt {margin-top:10px; font-size:var(--F14); color:var(--gray600);} section.order .line_wrap p b {font-size:var(--F17); font-weight:bold; word-break:break-word;} /* #242465:20240705 */ section.order .line_wrap p .shop {margin-left:10px; padding:8px 12px 8px 32px; background:url("../images/ui/ico_map_small.png") no-repeat 11px 50%; border:1px solid var(--gray250); font-weight:bold; font-size:var(--F12); color:var(--gray900); line-height:12px;} section.order .line_wrap p + p {margin-top:24px;} section.order .line_wrap p span {display:block;} section.order .line_wrap p b + span {display:inline-block; margin-left:5px;} section.order .line_wrap p.dawn-memo{margin:5px 0;text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}/* #205947 */ section.order .line_wrap .desc {font-size:var(--F15); color:var(--gray800);} section.order .line_wrap .txt_info {margin-top:36px; font-size:var(--F17); color:var(--gray600); line-height:24px; font-weight:bold; } section.order .line_wrap .txt_info strong {color:var(--gray800);} section.order .line_wrap dl {margin-top:25px;} section.order .line_wrap p + dl {border-top:1px solid var(--gray250);} section.order .line_wrap dl dt, section.order .line_wrap dl dd {height:20px; line-height:20px; font-weight:bold;} section.order .line_wrap dl dt {padding-top:25px; color:var(--gray800);} section.order .line_wrap dl dd {color:var(--gray600);} section.order .line_wrap .item_info {margin-top:36px} section.order .line_wrap .item_info li {padding-top:10px;} section.order .line_wrap .item_info li i, section.order .line_wrap .item_info li span {display:inline-block; height:12px; line-height:12px;} section.order .line_wrap .item_info li i {width:145px;} section.order .line_wrap .item_info li i {color:var(--gray600);} section.order .line_wrap .item_info li span {color:var(--gray900); text-align:right} section.order .line_wrap .list_wrap {margin-top:30px} section.order .line_wrap .list_wrap li {margin-top:4px; color:var(--gray600);} section.order .line_wrap .list_wrap li:first-child {margin-top:0;} section.order .line_wrap .submit_order {margin-top:55px;} section.order .line_wrap .submit_order a.btn {margin:0 5px;} section.order .line_wrap + .ad_recommend {margin-top:45px;} section.order .line_wrap .bill {border:0 none; margin-top:0; padding-top:0} section.order .line_wrap .bill .credit_card {display:inline-block; padding-bottom:16px; color:var(--gray600);} section.order .line_wrap .bill .credit_card em {margin-left:10px; color:var(--gray800); font-weight:bold; } section.order .line_wrap .bill .gray_box {margin-top:0;} section.order .line_wrap h3 + .bill {margin-top:40px;} section.order .line_wrap .input_select {display:block; width:100%; margin-top:40px; border:1px solid red;} section.order .line_wrap .input_select input {border:0 none; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; font-weight:bold; font-size:19px; color:var(--gray800);} section.order .line_wrap .input_select ul {width:100%;} section.order .line_wrap.receiver {border-color:var(--gray800); position:relative;} section.order .line_wrap.receiver .toggle {display:block; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; font-size:19px; color:var(--gray800);} section.order .line_wrap.receiver div {display:none;} section.order .line_wrap.receiver.on div {display:block;} section.order .line_wrap.receiver div p {margin:15px 0; padding-top:25px; border-top:1px solid var(--gray250); font-size:var(--F14); color:var(--gray600);} section.order .line_wrap.receiver div .btn { vertical-align:middle; } /* 빠른배송서비스 */ section.order .line_wrap.receiver .tips-layer-fast {position:absolute; top:82px; left:0; display:inline-block; margin-top:8px; padding:8px 9.5px 3.5px; background:#f7eeff; border:1px solid #f0e5fa;} section.order .line_wrap.receiver .tips-layer-fast:after {left:50%; margin-left:-3px; position:absolute; top:-8px; left:20px; display:block; width:10px; height:8px; background:url(../images/ui/bu_tip_up.png) no-repeat center center/10px 8px; content:''; } section.order .line_wrap.receiver .tips-layer-fast span {color:var(--purple500); margin:0; font-size: 10px; line-height: 14px;} section.order .line_wrap.receiver>span {display:block; font-size:var(--F14); line-height:var(--F14L); color:var(--purple500); font-weight: bold; margin: 5px 0;} section.order .line_wrap.receiver em {display:block; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600);} /* //빠른배송서비스 */ section.order .line_wrap .order_list {margin-top:40px;} section.order .line_wrap .order_list li {display:table; padding:25px 0; border-bottom:1px solid #f7f7f7;} section.order .line_wrap .order_list li:first-child {border-top:1px solid #f7f7f7;} section.order .line_wrap .order_list li .info {display:table-cell; width:380px; max-width:380px; vertical-align:middle;} section.order .line_wrap .order_list li .info .brand, section.order .line_wrap .order_list li .info .time {display:block; overflow:hidden; height:20px; font-weight:bold; font-size:var(--F15); color:var(--gray900); line-height:20px; white-space:nowrap; text-overflow:ellipsis;} section.order .line_wrap .order_list li .info .name {display:block; overflow:hidden; height:20px; margin-top:5px; font-size:var(--F15); color:var(--gray600); line-height:20px; white-space:nowrap; text-overflow:ellipsis;} /* #214453:20230829 */ section.order .line_wrap .order_list li .info .options{display:block;margin-top:5px;font-size:var(--F15);color:var(--gray600);line-height:20px;white-space:nowrap;text-overflow:ellipsis;} section.order .line_wrap .order_list li .info .options em{display:block;line-height:inherit;color:inherit;font-size:inherit;} section.order .line_wrap .order_list li .info .options em::before{content:'ㄴ';display:inline-block;margin-right:2px;} /* //#214453:20230829 */ section.order .line_wrap .order_list li .info .time {color:var(--purple400); overflow:inherit; height:inherit; white-space:inherit; text-overflow:inherit;} section.order .line_wrap .order_list li .info .time + .name {font-size:var(--F14); overflow:inherit; height:inherit; white-space:inherit; text-overflow:inherit;} section.order .line_wrap .order_list li .fitting {display:table-cell; padding-left:65px; vertical-align:middle; color:var(--purple400);} section.order .line_wrap .order_list li .fitting + .info {padding-left:64px;} section.order .line_wrap .order_list li .status {display:table-cell; padding-left:65px; vertical-align:middle; color:var(--gray800);} section.order .ad_banner {margin-top:100px;} /* 사은품 */ section.order .freebie {margin-top:45px; padding:50px 0; border-top:1px solid var(--gray800); border-bottom:1px solid var(--gray800);} section.order .freebie h4 {margin-top:0;} section.order .freebie ul:after {display:block; clear:both; content:'';} section.order .freebie ul li {display:block; float:left; padding:40px 0; width:50%; height:132px; border-bottom:1px solid #f7f7f7;} section.order .freebie ul:last-child li {padding-bottom:0 !important; border-bottom:0 !important;} section.order .freebie ul li img {display:block; float:left; width:100px; height:132px;} section.order .freebie ul li .info {display:block; float:left; padding:20px 25px; width:280px;} section.order .freebie ul li .info span {display:inline-block; max-height:44px; line-height:22px; overflow:hidden;} section.order .freebie ul li .info .txt-quantity {display:block; margin-top:20px; color:var(--gray600);} /* #256990(s) */ section.order .confirm_wrap .term_wrap .term_item {padding-top:20px;} section.order .confirm_wrap .term_wrap .term_item:first-child {padding:38px 0 20px; border-bottom:1px solid var(--gray250);} section.order .confirm_wrap .term_wrap .term_item .checkbox {margin-top:0;} section.order .confirm_wrap .term_wrap .term_item .checkbox label {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} section.order .confirm_wrap .term_wrap .term_item .checkbox label b {font-weight:bold;} section.order .confirm_wrap .term_wrap .term_item .accordion-header {display:flex; align-items:center; justify-content:space-between;} section.order .confirm_wrap .term_wrap .term_item .accordion-header .accordion-toggle {display:flex; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} section.order .confirm_wrap .term_wrap .term_item .accordion-header .accordion-toggle::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ section.order .confirm_wrap .term_wrap .term_item .accordion-header .accordion-toggle::after { background-color:var(--gray600); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } section.order .confirm_wrap .term_wrap .term_item .accordion-header .accordion-toggle[aria-expanded="true"]::after { --url:url(../images/uxui/icon/chevron_up-12.svg); } } section.order .confirm_wrap .term_wrap .term_item .accordion-content {margin-top:20px;} section.order .confirm_wrap .term_wrap .term_item .accordion-content[aria-hidden="true"] {display:none;} section.order .confirm_wrap .term_wrap .term_item .accordion-content .terms-scroll {overflow-y:auto; padding:30px; height:300px; box-sizing:border-box; background-color:var(--gray150);} section.order .confirm_wrap .term_wrap .term_item .accordion-content .terms-scroll .agreeContents {margin:0; padding:0; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} section.order .confirm_wrap .term_wrap .term_item .accordion-content .terms-scroll::-webkit-scrollbar {width:3px;} section.order .confirm_wrap .term_wrap .term_item .accordion-content .terms-scroll::-webkit-scrollbar-thumb {background:var(--gray450); border-radius:2px;} section.order .confirm_wrap .term_wrap .term_item .accordion-content .terms-scroll::-webkit-scrollbar-thumb:hover {background:var(--gray600);} /* #256990(e) */ /* 주문금액 */ .calc {padding:70px 0; text-align:center;} .calc > span {display:inline-block; line-height:36px; text-align:center; font-size:27px; vertical-align:top;} .calc > span > i {display:block; margin-top:5px; line-height:32px; color:var(--gray800); font-size:var(--F15);} .calc > span > span {display:block; font-weight:bold; color:var(--gray600); font-size:var(--F13); line-height:10px;} .calc > span.minus, .calc > span.plus, .calc > span.total {padding-left:80px; background:url("../images/ui/bg_calc.gif") no-repeat;} .calc > span.minus {color:var(--purple400); background-position:30px -40px;} .calc > span.minus em {color:var(--purple400);} .calc > span.plus {background-position:30px 26px;} .calc > span.total {color:var(--gray900); background-position:30px -104px;} .calc > span.minus .arrow {margin:5px auto 0;} .calc > span.minus > i {color:var(--purple400);} .calc > span.minus .arrow .balloon {display:none;} .calc > span.minus .arrow.toggle {padding-right:21px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; cursor:pointer;} .calc > span.minus .arrow.toggle .balloon {display:none; position:absolute; margin-left:-138px; margin-top:6px; padding-top:9px; width:360px; text-align:center; background:url('../images/ui/bg_balloon.gif') no-repeat center top;} /* 착불배송*/ .calc > span.minus.on .arrow.toggle {background-image:url(../images/ui/btn_up_gray.svg);} .calc > span.minus.on .arrow.toggle .balloon {display:block;} .calc > span.minus .arrow.toggle .balloon .detail {display:inline-block; padding:10px 18px; background:var(--gray800);} .calc > span.minus .arrow.toggle .balloon .detail span {display:block; min-width:180px; font-size:var(--F13); line-height:20px; color:#a4a4a4; text-align:left;} .calc > span.minus .arrow.toggle .balloon .detail span:first-child, .calc > span.minus .arrow.toggle .balloon .detail span:first-child em {color:var(--white); font-weight:bold; } .calc > span.minus .arrow.toggle .balloon .detail span b {display:inline-block; overflow:hidden; width:100px; height:20px; line-height:20px; text-overflow:ellipsis; white-space:nowrap; vertical-align:top; color:#a4a4a4;} .calc > span.minus .arrow.toggle .balloon .detail span em {margin-left:20px; float:right;} .calc > span.plus .arrow {position:relative; margin:5px auto 0;} .calc > span.plus .arrow .balloon {display:none;} .calc > span.plus .arrow.toggle {padding-right:21px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; cursor:pointer;} .calc > span.plus .arrow.toggle .balloon {display:none; position:absolute; left:50%; transform:translateX(-50%); margin-top: 6px; padding-top:9px; background:url('../images/ui/bg_balloon.gif') no-repeat center top;} .calc > span.plus.on .arrow.toggle {background-image:url(../images/ui/btn_up_gray.svg);} .calc > span.plus.on .arrow.toggle .balloon {display:block;} .calc > span.plus .arrow.toggle .balloon .detail {padding:10px 18px; background:var(--gray800); font-size:var(--F13); line-height:20px; color:var(--white); text-align:left; white-space:nowrap;} /* 착불배송*/ /* 주문버튼 */ .submit_order {margin-top:50px; text-align:center;} .submit_order a.btn span {color:#e6cfff;} .submit_order.none .btn {border-color:#d5d5d5; background-color:#d5d5d5;} .submit_order.none em {display:block; margin-top:15px; font-weight:bold; color:var(--gray800); line-height:30px;} .submit_order.none p {font-size:var(--F13); color:var(--gray800); line-height:20px;} .submit_order.none dl {display:block; margin:10px auto; width:280px; border-bottom:1px solid var(--gray250);} .submit_order.none dl dt {display:block; width:280px; height:30px; line-height:30px; color:var(--gray800); font-size:var(--F13); border-top:1px solid var(--gray250);} .submit_order.none dl dt span {display:inline-block; float:left; padding-left:40px; width:80px; text-align:center; color:var(--gray600);} /* 장바구니 */ .cart .tabs .tab li {width:25%;} .cart .tabs .tab.third li {width:33.33%;} .cart .order_set {margin-top:60px;} .cart .order_set_head + .order_set {margin-top:20px;} .cart .order_set .grid_wrap.goods .info .name {max-width:240px;} .cart .order_set .grid_wrap.goods td:last-child a.btn {display:block; width:70px;} .cart .order_set .grid_wrap.goods td .ordermade {display:block; margin-top:12px; line-height:15px; text-align:left; color:var(--gray600); font-size:var(--F12);} .cart .order_set .grid_wrap.goods td .ordermade strong {color:var(--gray900);} .cart .tabs p.info {display:block; position:absolute; margin-top:-30px; padding-left:30px; height:25px; line-height:22px; color:var(--purple400); font-size:19px; font-weight:bold; background:url("../images/ui/exc_mark_r.png") no-repeat left center;} .cart .tabs i.info {display:block; margin-top:60px; padding-left:30px; line-height:20px; font-weight:bold; background:url("../images/ui/ico_i.png") no-repeat left center;} .cart .submit {margin-top:20px; text-align:right;} .cart .submit p {line-height:28px; color:var(--gray600); font-size:var(--F13);} .cart .bill {margin-top:70px;} .cart .ad_banner {margin-top:100px;} section.cart .tabs .tab > li > a.on {color:var(--gray900); border-bottom:4px solid var(--gray900);} section.cart .tabs .tab > li > a.on > em {color:var(--gray900);} section.cart .order_wrap label > input[type=checkbox]:checked + i {background-position:0 0; background-color:var(--gray900); border:0;} section.cart .order_wrap label > input[type=checkbox]:checked + i + span {color:var(--gray900);} section.cart .order_wrap .gray_box .accounts .cssf, section.cart .order_wrap tbody tr td .shipping span.cost, section.cart .order_wrap .gray_box > p.appendix-box > span, section.cart .order_wrap .gray_box .accounts, section.cart .order_wrap .gray_box .accounts em, section.cart .order_wrap .gray_box .price, section.cart .order_wrap .gray_box .price em, section.cart .calc > span, section.cart .calc > span em, section.cart .calc > span.minus > i {color:var(--gray900);} /* order table */ .order_wrap {margin-top:-50px;} .order_wrap > p {margin-top:15px; color:var(--gray600); } /* check & radio */ .order_wrap label > input[type=checkbox] {width:0; height:0;} .order_wrap label > input[type=checkbox] + i {display:inline-block; margin:-3px 8px 0 0; width:20px; height:20px; vertical-align:middle; background:url(../images/base/bg_component.png) no-repeat var(--white) -21px -1px; border:1px solid var(--gray250); box-sizing:border-box;} .order_wrap label > input[type=checkbox]:checked + i {background-position:0 0; background-color:var(--purple400); border:0;} .order_wrap label > input[type=checkbox]:disabled + i {background-position:0 0; background-color:var(--gray250); border:0;} .order_wrap label > input[type=checkbox]:checked + i + span {color:var(--purple400);} .order_wrap label > input[type=checkbox]:disabled + i + span {color:var(--gray250);} .order_wrap table {width:100%;} .order_wrap thead tr th {padding:10px 0; /*height:30px;*/ text-align:left; font-weight:400;} .order_wrap label > input[type=checkbox].all-check + i + span {font-weight:bold;} .order_wrap thead tr th .store {display:inline-block; margin-left:10px; padding-left:15px; height:12px; line-height:12px; border-left:1px solid #d5d5d5; font-size:var(--F15);} .order_wrap thead tr th.submit {justify-content: space-between; margin:0;} .order_wrap thead tr th.submit a.btn {min-width:auto; margin-left:auto; padding:0 20px; width:auto; height:36px; font-size:var(--F14); line-height:34px; border-color:var(--gray250);} .order_wrap thead tr.tinfo th p {height:40px; line-height:40px; font-size:var(--F14); color:var(--purple400); text-indent:34px; text-align:left; background:url("../images/base/bg_caution.png") no-repeat #fbf7ff 10px center; position:relative;} .order_wrap thead tr.tinfo th a { position:absolute; top:14px; right:10px; font-size:var(--F12); font-weight: normal;line-height: 16px; color:var(--purple400); display:block; text-decoration: underline; } .order_wrap thead tr.thead th {text-align:center; color:var(--gray600); font-size:var(--F14); border-bottom:1px solid #b8b8b8;} .order_wrap tbody tr td {position:relative; padding:30px 0; vertical-align:top; border-top:1px solid var(--gray250);} .order_wrap tbody tr td.add {width:17px; height:23px; background:url("../images/ui/bg_arrow_low.png") no-repeat 0 30px;} .order_wrap tbody tr td.add label {display:none;} .order_wrap tbody tr td .list_goods {position:relative;} .order_wrap tbody tr td .list_goods img {width:100px;} .order_wrap tbody tr td .list_goods .keep {right:6px; margin-top:-35px;} .order_wrap tbody tr td .badge > i {display:inline-block; margin-bottom:2px; padding:0 10px; height:20px; line-height:var(--F12L); font-size:var(--F12); border:1px solid; box-sizing:border-box;} .order_wrap tbody tr td .badge > i em {color:var(--white);} .order_wrap tbody tr td .badge > i.pup {color:var(--white); background-color:var(--purple400); border-color:var(--purple400);} .order_wrap tbody tr td .badge > i.blk {color:var(--white); background-color:var(--gray900); border-color:var(--gray900);} .order_wrap tbody tr td .badge > i.dgy {color:var(--white); background-color:#50506e; border-color:#50506e;} .order_wrap tbody tr td .badge > i.red {color:#ff0000; background-color:var(--white); border-color:#ff0000;} .order_wrap tbody tr td .badge > i.red em {color:#ff0000;} .order_wrap tbody tr td .badge > i.blu {color:var(--white); background-color:#2c2ca9; border-color:#2c2ca9;} .order_wrap tbody tr td .badge > i.lgy {color:var(--white); background-color:#8e8e8e; border-color:#8e8e8e;} .order_wrap tbody tr td .badge > i.clr {color:var(--gray900); background-color:var(--white); border-color:var(--gray900);} .order_wrap tbody tr td .badge > i.clr em {color:var(--gray900);} .order_wrap tbody tr td .badge + .info {margin-top:12px;} .order_wrap tbody tr td .info {margin-top:-2px;} .order_wrap tbody tr td .info .brand, .order_wrap tbody tr td .info .name {display:block; width:380px; height:24px; line-height:var(--F15LL); font-size:var(--F15); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .order_wrap tbody tr td .info .brand {color:var(--gray900);} .order_wrap tbody tr td .info .selected_options {position:relative; margin-top:8px; line-height:18px; color:var(--gray600); font-size:var(--F14);} .order_wrap tbody tr td .info .selected_options * {color:var(--gray600);} /* 사은품 행사 셀링 강화*/ .order_wrap tbody tr td .benefits {width:300px; margin-top:12px;} .order_wrap tbody tr td .benefits > a {display:inline-block; box-sizing:border-box; max-width:100%; margin-right:40%; padding-left:26px; height:16px; line-height:16px; color:var(--purple400); font-size:var(--F13); font-weight:bold; white-space: nowrap; overflow:hidden; text-overflow: ellipsis;} .order_wrap tbody tr td .benefits > a:hover {text-decoration:underline;} .order_wrap tbody tr td .benefits > a + a {margin-top:8px !important;} .order_wrap tbody tr td .benefits .view_coupon {background:url("../images/ui/ico_view_coupon.png") no-repeat left center;} .order_wrap tbody tr td .benefits .group_discount {background:url("../images/ui/ico_group_discount.png") no-repeat left center;} .order_wrap tbody tr td .benefits .appendix {position:relative; padding-right:15px; background:url("../images/ui/ico_appendix.png") no-repeat 2px center;} .order_wrap tbody tr td .benefits .appendix:after {position:absolute; right:0; top:0; display:inline-block; width:10px; height:16px; line-height:16px; vertical-align:middle; content:''; background:url(../images/ui/btn_next_em.svg) no-repeat center center/5px auto; } .order_wrap tbody tr td .benefits p + .group_discount, .order_wrap tbody tr td .benefits p + .free_fitting, .order_wrap tbody tr td .benefits p + .view_coupon, .order_wrap tbody tr td .benefits p + .appendix {margin:11px auto 0;} .order_wrap tbody tr td .alter {margin-top:30px; height:40px;} .order_wrap tbody tr td .alter .btn {padding:0 28px; height:40px; line-height:38px; color:var(--gray900); font-size:var(--F15); border-color:#d5d5d5; box-sizing:border-box;} .order_wrap tbody tr td .alter .btn + .btn {margin-left:5px;} .order_wrap tbody tr td .alter .btn.alarm {color:var(--white); background-color:var(--gray800); border-color:var(--gray800);} .order_wrap tbody tr td .alter .btn.disabled:not(.alarm) {border-color:var(--gray250); color:var(--gray500) !important;} /* #229844 */ .order_wrap tbody tr td .shipping span {display:block; margin:0 20px; line-height:var(--F14L); color:var(--gray600); font-size:var(--F14); word-break:keep-all;} .order_wrap tbody tr td .shipping span + span {margin-top:10px;} .order_wrap tbody tr td .shipping span.cost {color:var(--purple400); font-size:var(--F15); font-weight:bold;} .order_wrap tbody tr td .shipping span.store {color:var(--gray900); font-size:var(--F15); font-weight:bold;} .order_wrap tbody tr td .shipping span i.location {display:inline-block; margin-right:6px; width:14px; height:20px; vertical-align:top; background:url(../images/base/bg_component.png) no-repeat var(--white) -80px 0px;} .order_wrap tbody tr td .delete {display:block; position:absolute; top:19px; right:0; width:16px; height:16px; font-size:0; background:url(../images/ui/btn_x_gray.svg) no-repeat center center/14px auto;} .order_wrap tbody tr td .price {margin:0 20px;} .order_wrap tbody tr td .price del {display:block; color:#a4a4a4; font-size:var(--F15);} .order_wrap tbody tr td .price span {display:block; color:var(--gray900); font-size:var(--F17); font-weight:bold;} .order_wrap tbody tr td .price span > em {margin-left:5px; color:var(--purple400); font-weight:bold;} .order_wrap tbody tr td .fulfill {position:absolute; bottom:30px; left:20px;} .order_wrap tbody tr td .fulfill .btn {display:block; padding:0; width:140px; height:40px; line-height:38px; font-size:var(--F15); border-color:#d5d5d5; box-sizing:border-box;} .order_wrap tbody tr td .fulfill .btn.disabled {color:var(--white) !important; background:#d5d5d5; border-color:#d5d5d5 !important;} .order_wrap tbody tr td .fulfill .btn + .btn {margin-top:8px;} .order_wrap .null {padding:196px 0 100px; height:17px; background:url("../images/base/basket.png") no-repeat center 90px; border-bottom:1px solid var(--gray250);} .order_wrap .gray_box {margin:10px 0 0 40px; padding:30px 40px; width:838px; background-color:#fafafa; border:1px solid var(--gray200);} .order_wrap .gray_box h5 {margin-bottom:8px; color:#8e8e8e; font-size:var(--F15); font-weight:normal;} .order_wrap .gray_box > p {display:flex; } .order_wrap .gray_box .accounts {font-size:var(--F16);} .order_wrap .gray_box .price {margin-left:auto; text-align:right; font-size:23px; font-weight:bold;} .order_wrap .gray_box .price em {font-weight:normal} .order_wrap .gray_box .shipping_cost {display:block; color:#8e8e8e; font-size:var(--F14); font-weight:normal;} .order_wrap .gray_box > p.appendix-box {position:relative; display:block; padding:25px 0 0 81px; margin-top:22px; margin-bottom:-7px; font-size:var(--F15); border-top:1px solid var(--gray250);} .order_wrap .gray_box > p.appendix-box > span {position:absolute; left:0; top:28px; color:var(--purple400); font-weight:bold;} .order_wrap .gray_box > p.appendix-box > a {display:block; position:relative; box-sizing: border-box; padding-right:15px; width:fit-content; max-width:100%; line-height:26px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .order_wrap .gray_box > p.appendix-box > a:after {position:absolute; right:0; top:0; display:inline-block; width:10px; height:26px; line-height:26px; vertical-align:middle; content:''; background:url(../images/ui/btn_next.svg) no-repeat right center/5px auto;} /* 사은품 행사 셀링 강화*/ /* 착불배송 */ .order_wrap .info_box {position: relative; margin:11px 0 0 40px; padding-left: 25px; line-height: 20px; color: var(--purple400);} .order_wrap .info_box::before {content: ''; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; background: url("../images/base/bg_caution_lite.png") no-repeat top left/18px auto;} .order_wrap .info_box strong {color: var(--purple400); font-weight: bold;} .order_wrap > ul {margin-top:17px;} .order_wrap > ul li {position: relative; padding-left: 10px; color:var(--gray600);} .order_wrap > ul li::before {content: ''; position: absolute; top: 8px; left: 0; width: 2px; height: 2px; background: var(--gray600);} /* 빠른배송서비스 */ .popup .passibleArea .form_popup { margin-bottom:60px;} .popup .passibleArea h2 {font-size:var(--F32); line-height:40px; margin-top:80px; margin-bottom:40px;} /* #246087 */ .fast-info {margin-top:20px; color:var(--gray700); font-size:var(--F12); line-height: 16px;} .fast-info span {display: block; color:var(--gray700);} .fast-info span:last-child {margin-top:4px;} .fast-info strong {display: inline-block; margin-right:6px; font-weight: bold; font-size:var(--F12); line-height:16px;} .passibleArea .fast-time {margin-top:20px; margin-bottom:130px;} .passibleArea .fast-time span {display: flex; color:var(--gray700); font-size:var(--F12); line-height: 16px; margin-bottom:6px; } .passibleArea .fast-time span em {display: inline-block; border-radius: 4px; color:var(--gray900); font-size: 10px; line-height: 14px; margin-right:24px; padding:1px 4px 0px; text-align: center;} .passibleArea .fast-time span em.dawn {background-color:var(--gray200);} .passibleArea .fast-time span em.afternoon {background-color:var(--purple200);} .passibleArea .fast-time span em.night {background-color:var(--mint100);} .passibleArea .fast-time span:last-child {margin-bottom:0;} .passibleArea .btn { display:flex; justify-content: center; align-items: center; width:100%; height:50px; margin-top:10px; font-size:var(--F12); line-height: 16px;;} .passibleArea .btn:first-child {margin-top:0px;} .passibleArea .fast-service {display: flex; justify-content: center; font-size:var(--F12); margin-top:20px; color:var(--purple400); line-height: 16px;} /* #246087(s) */ .ship_content .ship_txt {font-size:var(--F12); color:var(--gray700); line-height:var(--F12L);} .ship_content .link-arrow {display:flex; align-items:center; gap:0 2px; font-size:var(--F12); color:var(--purple400); line-height:var(--F12L);} .ship_content .link-arrow::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ship_content .link-arrow::after { background-color:var(--purple400); --url:url(../images/uxui/icon/chevron_right-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ship_content .ship_txt + .link-arrow {margin-top:12px;} .ship_content .ship_info {margin-top:20px;} .ship_content .ship_txt + .ship_info {margin-top:36px;} .ship_content .ship_info dt {font-size:var(--F12); font-weight:700; color:var(--gray700); line-height:var(--F12L);} .ship_content .ship_info dd {position:relative; padding-left:19px; font-size:var(--F12); color:var(--gray700); line-height:var(--F12L);} .ship_content .ship_info dd::before {content:""; position:absolute; top:7px; left:8px; width:3px; height:3px; border-radius:2px; background-color:var(--gray700);} .ship_content .ship_info .info_point {color:var(--purple400);} /* #293976 */ .ship_content .ship_info .info_point::before {background-color:var(--purple400);} .ship_btns {margin-top:130px;} .ship_btns .btn {display:flex; align-items:center; gap:0 4px;} .ship_btns .btn::before {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ship_btns .btn::before { background-color:var(--gray700); --url:url(../images/uxui/icon/plus-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ship_more_btns {margin-top:130px;} .ship_more_btns .btn {display:flex; align-items:center; gap:0 4px;} .ship_more_btns .btn:not(.gray)::after {content:""; width:12px; height:12px;} .ship_more_btns .btn.gray::before {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ship_more_btns .btn:not(.gray)::after { background-color:var(--gray700); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } .ship_more_btns .btn::before { background-color:var(--white); --url:url(../images/uxui/icon/plus-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } /* #246087(e) */ /* 빠른배송서비스_기존 배송지 확인 팝업 */ .existAriaCheck .title {margin-bottom:20px; padding-top: 37px; font-size:var(--F20); line-height:var(--F20L);} /* #246087 */ .existAriaCheck .fast-info { color:var(--gray700); font-size:var(--F12); line-height: 16px; margin-top:10px;} /* #195117: 20230227 start */ .existAriaCheck .sub-title {display:flex; align-items:center; justify-content:space-between; padding-bottom:12px; font-size:var(--F20); font-weight: bold; line-height:var(--F20L); margin-top:44px !important;} /* #246087 */ .existAriaCheck .sub-title button.btn-refresh {overflow:hidden; width:24px; height:24px; white-space:nowrap; text-indent:100%; background:url(../images/svgs/change-24-gray700.svg) no-repeat center center / 24px auto;} .existAriaCheck .txt-refresh {position:relative; margin-top:0 !important; padding:8px; font-size:10px; color:var(--gray700); line-height:var(--F14); background-color:var(--purple150); text-align:center;} .existAriaCheck .txt-refresh:before {content:""; position:absolute; top:-12px; right:6px; border:6px solid transparent; border-bottom:6px solid var(--purple150);} .existAriaCheck .txt-refresh span {color:var(--purple400);} .existAriaCheck .txt-refresh + .exist-aria-list {border-top:0;} .existAriaCheck .txt-refresh + .exist-aria-list .exist-aria-item:first-child {padding-top:14px;} /* #195117: 20230227 end */ .existAriaCheck a.btn { display:flex; width:100%; height:50px; justify-content: center; align-items: center; margin-top:20px; } .existAriaCheck a.btn.bk { font-weight:bold; } #popup > div.existAriaCheck > *:not(:first-child):not(.submit):not(form){ margin-top:10px; } .exist-aria-list { padding-bottom:20px; margin-top:0px !important;}/* #176650_7 수정 */ /* #195117: 20230227 */ .exist-aria-item { padding:20px 0 24px; position:relative; border-bottom:1px solid var(--gray250);} .exist-aria-item:first-child { padding:0 0 24px; } .exist-aria-item.basic { border-bottom:1px solid var(--gray900);} .exist-aria-item .pin {display: flex; margin-bottom:10px;} .exist-aria-item .pin span { border-radius: 4px; height: 15px; font-size: 10px; line-height: 14px; padding:0px 4px 0px; margin-right:4px; border:1px solid var(--gray250); box-sizing: border-box;} .exist-aria-item .pin span.fast {background-color: var(--mint500); color:var(--white); border:0;} .exist-aria-item .pin span.normal {background-color:var(--gray900); color:var(--white);} .exist-aria-item .name {display:block; font-weight:bold; font-size:var(--F14); line-height: var(--F14L);} .exist-aria-item .address {margin:2px 0 0; font-size:var(--F13); line-height: var(--F13L);word-break: keep-all; width: 341px;} .exist-aria-item a.check {position: absolute; right: 0; top: 20px; display:flex; justify-content: center; align-items: center; padding:0; width: 66px; height: 36px; font-weight:normal; background-color: var(--gray800); color:var(--white); margin:0;} .exist-aria-item a.check.white {background-color:var(--white); color:var(--gray800);} /* #246087 */ .exist-aria-list .non-login { margin:197px 0; text-align: center; font-weight: normal; font-size:var(--F13); line-height: var(--F13L); color:var(--gray800);} .existAriaCheck .form_wrap {display: flex;} .existAriaCheck .form_wrap input {height:26px;} .existAriaCheck .form_wrap .input_box {height: 38px; width:100%; margin-right:10px;} .existAriaCheck .form_wrap a {font-size: 0; width: 32px;height: 32px; margin-top:0; vertical-align: top; background: url(../images/ui/btn_finder.svg) no-repeat center center/16px auto; padding: 18px; cursor: pointer; } /* 빠른배송서비스__서비스 가능직역 안내 알럿 */ .fast-passible-pupup .submit .btn {border:1px solid var(--gray900); background-color: var(--white); color:var(--gray900); } /* 빠른배송서비스__주소검색 팝업 */ .newAriaAdd h2.title {border-bottom:1px solid var(--gray900); line-height:50px;} /* #246087 */ .newAriaAdd .postal_new .result > table td:nth-child(2) > a > em { word-break: keep-all;} /* 빠른배송서비스__팀프레시 배송조회 팝업 */ .popup .team-fresh-popup>h2 {font-size:var(--F20); line-height:var(--F20L); font-weight: bold;} .team-fresh-popup h4 {margin-top:30px; margin-bottom: 10px; font-size:var(--F14); line-height: var(--F14L); font-weight: bold;} .team-fresh-popup h4:first-child {margin-top:40px;} .team-fresh-popup .grid_wrap tr:first-child td {border-top: 1px solid var(--gray250); } .team-fresh-popup .grid_wrap td {height:45px; line-height: 16px; font-size:var(--F12); padding:0; color:var(--gray900);} .team-fresh-popup .grid_wrap.info td { padding:0 20px;text-align: left; box-sizing: border-box; } .team-fresh-popup .grid_wrap.info tr td:first-child {border-right:1px solid var(--gray250); padding:0 20px;background-color: var(--gray100); width:104px; box-sizing: border-box;} .team-fresh-popup .grid_wrap.state{margin-bottom:35px;} .team-fresh-popup .grid_wrap.state tr th {border: 1px solid var(--gray250); width: 160px; font-size:var(--F12); line-height: 16px; box-sizing: border-box;} .team-fresh-popup .grid_wrap.state tr:first-child th {border-top: 1px solid var(--gray250); border-bottom: 1px solid var(--gray250); border-left:0; background-color: var(--gray100); height:45px; padding:0;} .team-fresh-popup .grid_wrap.state tr th:last-child {border-right: 0; } .team-fresh-popup .grid_wrap.state tr td {border: 1px solid var(--gray250); font-size:var(--F12); line-height: 16px; box-sizing: border-box;} .team-fresh-popup .grid_wrap.state tr td:first-child {border-top: 1px solid var(--gray250); border-bottom: 1px solid var(--gray250); border-left:0;} .team-fresh-popup .grid_wrap.state tr td:last-child {border-right: 0; } /* 빠른배송서비스__빠른배송 안내 팝업 */ .popup .fast-delivery-popup {padding-bottom:35px;} .fast-delivery-popup .grid_wrap.fast { margin-bottom:15px; } .fast-delivery-popup .grid_wrap.fast thead {z-index: 1; position:relative; } .fast-delivery-popup .grid_wrap.fast thead:after {z-index: 2; content:""; display:block; position:absolute; top:0; left:0; width:100%; height:1px; background-color: var(--gray900);} .fast-delivery-popup .grid_wrap.fast thead tr th { position:relative; border: 1px solid var(--gray250); background-color: var(--gray200); font-size:var(--F12); line-height:16px; color:var(--gray900); height: 45px;padding:0; } .fast-delivery-popup .grid_wrap.fast tr th:first-child { border-left:0;width:110px;} .fast-delivery-popup .grid_wrap.fast tr th:nth-child(2) { width:110px;} .fast-delivery-popup .grid_wrap.fast tr th:last-child { border-right:0;} .fast-delivery-popup .grid_wrap.fast tr td {padding:0; height:45px; border-left:1px solid var(--gray250); border-right:1px solid var(--gray250);font-size:var(--F12); line-height:16px; color:var(--gray900);} .fast-delivery-popup .grid_wrap.fast tr td:first-child { border-left:0;} .fast-delivery-popup .grid_wrap.fast tr td:last-child { border-right:0;} .fast-delivery-popup .grid_wrap.fast tr:first-child td {border-top:0;} .fast-delivery-popup .grid_wrap.fast tr:last-child td {border-bottom:1px solid var(--gray900);} .fast-delivery-popup p {margin-top:40px; margin-bottom:20px; font-size:var(--F13); line-height: var(--F13L); color:var(--gray600);} .fast-delivery-popup>span {position:relative; display:block; font-size:var(--F12); line-height: 16px; color:var(--gray600); margin:5px 0 0 10px; } .fast-delivery-popup>span:before {content: ''; position: absolute; width: 2px; height: 2px; margin-top: 0px; left: -8px; top: 7px; background-color: currentColor; color:var(--gray600);} .fast-delivery-popup>span:last-child { margin-top:10px;} .fast-delivery-popup>em {display:block; color:var(--gray900); font-size:var(--F13); line-height: var(--F13L); margin:14px 0 10px 10px;} .fast-delivery-popup .delivery_time {margin:0 10px; padding:15px 0 30px 0;} .fast-delivery-popup .delivery_time .grid_wrap thead tr th { position:relative; border-bottom: 0; background-color: var(--gray200); font-size:var(--F11); line-height:15px; height: 45px;padding:0;} .fast-delivery-popup .delivery_time .grid_wrap tr th:first-child { border-left:0;width:110px;} .fast-delivery-popup .delivery_time .grid_wrap tr th:nth-child(2) { width:110px;} .fast-delivery-popup .delivery_time .grid_wrap tr th:last-child { border-right:0;} .fast-delivery-popup .delivery_time .grid_wrap tr td {font-size: 10px; line-height: 19px; color:var(--gray900); padding:9px 0 7px; border-top:1px solid var(--gray250); } .fast-delivery-popup .delivery_time .grid_wrap tr td span{font-size: 10px; line-height: 11px; display: block; color:var(--gray500);} .fast-delivery-popup .delivery_time .grid_wrap tr:last-child td {border-bottom:0;} .fast-delivery-popup .delivery_time .radio > label > i {margin-right:0;} .fast-delivery-popup .delivery_time .radio > label > i:after {background-color: var(--white);} .fast-delivery-popup .delivery_time .radio > input[type=radio]:disabled + label > i:after {background-color: var(--gray400);} .fast-delivery-popup h2 {font-weight: bold; font-size:var(--F20); line-height:23px;} /* #248657 */ .fast-delivery-popup h3 {display:flex; align-items: center; font-weight: bold; font-size:var(--F17); line-height:var(--F17L);}/* #176650_8 */ .fast-delivery-popup h3::before {content: ""; display:flex;width:4px; height:4px; border-radius: 50%; background-color: var(--black); margin-right:5px;}/* #176650_8 */ .fast-delivery-popup .submit { margin-top:15px;} .popup .fast-delivery-popup .submit .btn { font-size:var(--F12); font-weight:bold;} /* //빠른배송서비스 */ .order_edit {width:420px;} .order_edit .name {margin-top:23px; display:block; width:380px; color:var(--gray900); line-height:20px; font-size:var(--F15);} .order_edit .selected_options {position:relative; margin-top:12px; line-height:18px; color:#8e8e8e; font-size:var(--F14);} .order_edit ul li > span {display:inline-block; width:90px; line-height:34px; vertical-align:top; color:var(--gray800); font-size:var(--F15);} .order_edit ul li > div {display:inline-block; width:310px;} .order_edit .color-select label {margin:0 10px 10px 0 !important;} .order_edit .size {width:300px;} .order_edit .size ul {display:inline-block; position:relative; text-align:center;} .order_edit .size li {margin-left:-1px; display:table-cell; float:left; width:93px; height:34px; border:1px solid var(--gray250); z-index:0;} .order_edit .size li:nth-child(1n+4) {margin-top:-1px;} .order_edit .size li label {display:block; position:absolute; width:93px; height:34px; line-height:33px; color:var(--gray900); font-size:var(--F15); font-weight:bold; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .order_edit .size li input[type=radio]:checked + label {margin:-1px 0 0 -1px; color:var(--purple400); border:1px solid var(--purple400); z-index:1;} .order_edit .size li input[type=radio]:disabled + label {cursor:default;} .order_edit .size li label.recomanded:before {display:inline-block; margin-top:8px; margin-right:3px; padding:0 6px; vertical-align:top; line-height:var(--F12L); content:"추천"; color:var(--white); font-size:var(--F12); background:#00c0b5; } .order_edit .stock {display:block; color:red; font-size:var(--F12);} .order_edit .select {width:280px !important; height:34px;} .order_edit .select > a label {padding:4px 24px 4px 0; background-position:right -294px;} .order_edit .select.over > a label {background-position:right -344px;} .order_edit .select .option {top:-1px; width:calc(100% + 2px);} .order_edit .select + .select {margin-top:20px;} .order_edit .quantity input[type=number] {padding:4px 0;} .order_edit .quantity .minus, .order_edit .quantity .plus {height:32px; line-height:36px; color:var(--gray900);} .order_edit .submit {margin-top:20px;} .order_edit .submit .btn.full {width:178px;} .order_edit .option_wrap:not(.new) > ul > li .quantity {display:block;} .order_edit .option_wrap:not(.new) > ul > li .quantity input {color:#8e8e8e; text-align:left; border:0 none;} .order_edit .option_wrap:not(.new) > ul > li .quantity a {overflow:hidden; width:23px; height:23px; background:url("../images/ui/bg_quantity.png") no-repeat 0 0; white-space:nowrap; text-overflow:ellipsis; text-indent:100%;} .order_edit .option_wrap:not(.new) > ul > li .quantity .minus {background-position:-42px -7px; left:auto; right:-5px;} .order_edit .option_wrap:not(.new) > ul > li .quantity .plus {background-position:-6px -6px; right:28px;} /* 착불배송 */ .down_coupon {width:740px;} .down_coupon .coupon {display:block; margin:26px auto 0; width:720px;} .down_coupon .coupon > ul:after {display:block; content:''; clear:both;} .down_coupon .coupon li {display:block; position:relative; float:left; width:354px; overflow:hidden;} .down_coupon .coupon li .coupon_box {position:relative; width:293px; height:190px; padding:30px; border:1px solid var(--gray250);} .down_coupon .coupon li .coupon_box:after {display:block; content:''; position:absolute; margin-top:-16px; top:50%; right:-16px; width:30px; height:30px; background:var(--white); border:1px solid var(--gray250); border-radius:15px;} .down_coupon .coupon li .coupon_box .mark {display:block; height:14px; line-height:14px; color:var(--purple400); font-size:var(--F15);} .down_coupon .coupon li .coupon_box strong {display:block; margin-top:10px; line-height:22px; font-size:23px; color:var(--gray900); font-family:"SSF_Bold", "NotoSans_kr_Regular";} .down_coupon .coupon li .coupon_box p { margin-top:14px; height:44px; line-height:22px; font-size:var(--F17); color:var(--gray800); overflow:hidden;} .down_coupon .coupon li .coupon_box .date {display:block; margin-top:20px; height:16px; line-height:16px; color:var(--gray600); font-size:var(--F14); overflow:hidden;} .down_coupon .coupon li .coupon_box .btn {margin-top:20px; padding:2px 26px; font-size:var(--F13); background:var(--gray800);} .down_coupon .coupon .lSAction a {position:absolute; top:50%; margin-top:-30px; width:36px; height:60px; cursor:pointer; z-index:3; background-size:12px auto;} .down_coupon .coupon .lSAction a.lSPrev {margin-left:-36px; left:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_prev.svg) no-repeat center center/10px auto; } .down_coupon .coupon .lSAction a.lSNext {margin-right:-36px; right:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_next.svg) no-repeat center center/10px auto;} .down_coupon .list_wrap {margin-left:10px; } .down_coupon p.null {padding:100px 0; width:100%; line-height:50px;} .down_coupon p.null span {display:block; color:var(--gray600); font-size:var(--F14); font-weight:normal;} .down_coupon .submit {margin-top:28px;} .down_coupon .submit .btn {padding:12px 80px; font-weight:normal;} .down_coupon .submit .btn .download {display:inline-block; margin-right:12px; width:13px; height:16px; vertical-align:middle; background:url(../images/ui/ico_download.png) var(--gray900) no-repeat left center;} .down_coupon .banners {position:relative; margin-top:36px; margin:26px auto 0; width:100%;} .down_coupon .banners.slider .lSAction a {position:absolute; top:50%; z-index:1; margin-top:-11px; width:12px; height:22px;} .down_coupon .banners.slider .lSAction a.lSPrev {left:50px; background-size:12px auto;} .down_coupon .banners.slider .lSAction a.lSNext {right:50px; background-size:12px auto;} .order_wrap .bill {border-top:2px solid var(--gray900); border-bottom:2px solid var(--gray900);} .order_wrap .bill h4 {height:50px; line-height:50px; font-size:var(--F17); border-bottom:1px solid var(--gray200);} .order_wrap .bill h4 small {margin-left:10px; font-size:var(--F17); font-weight:normal;} .order_wrap .bill h4 small em {font-weight:bold;} .order_wrap .bill h4 .store {display:inline-block; margin-left:10px; padding-left:15px; height:14px; line-height:14px; border-left:1px solid #d5d5d5; font-size:var(--F16); font-weight:normal;} .order_wrap .bill .calc {padding:35px 0;} .order_wrap .bill .calc > span > span {display:block; font-weight:bold; color:#8e8e8e; font-size:var(--F13); line-height:10px;} .order_wrap .bill .calc > span.minus .arrow {margin:5px auto 0; width:68px;} .order_wrap .bill .calc > span.minus .arrow .balloon {display:none;} .order_wrap .bill .calc > span.minus .arrow.toggle {padding-right:21px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; cursor:pointer;} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon {display:none; position:absolute; margin-left:-138px; padding-top:9px; width:360px; text-align:center; background:url('../images/ui/bg_balloon.gif') no-repeat center top;} .order_wrap .bill .calc > span.minus.on .arrow.toggle {background-image:url(../images/ui/btn_up_gray.svg);} .order_wrap .bill .calc > span.minus.on .arrow.toggle .balloon {display:block;} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail {display:inline-block; padding:10px 18px; background:var(--gray800);} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail span {display:block; min-width:180px; font-size:var(--F13); line-height:20px; color:#d5d5d5; text-align:left;} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail span:first-child, .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail span:first-child em {color:var(--white); font-weight:bold;} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail span b {display:inline-block; overflow:hidden; width:100px; height:20px; line-height:20px; text-overflow:ellipsis; white-space:nowrap; vertical-align:top;} .order_wrap .bill .calc > span.minus .arrow.toggle .balloon .detail span em {margin-left:20px; float:right;} .order_wrap .bill .submit_order {margin:0 0 40px 0; } .order_wrap .bill .submit_order.timeoff {display:block; text-align:center;} .order_wrap .bill .submit_order.timeoff a.btn {background-color:#d5d5d5; border-color:#d5d5d5 !important; cursor: default;} .order_wrap .bill .submit_order.timeoff em {display:block; margin-top:15px; font-weight:bold; color:var(--gray800);} .order_wrap .bill .submit_order.timeoff p {color:var(--gray800); } .cash-receipt_wrap {margin-top:60px; border-top:1px solid var(--gray800);} .cash-receipt_wrap > div {padding:25px 0 0 0;} .cash_receipt .radio > label {margin-right:40px;} .cash_receipt .income {padding-top:10px;}/*//#157237*/ .cash_receipt .input_box {display:inline-block; vertical-align:top;} .cash_receipt .select > a label {padding:7px 20px 7px 10px} .cash_receipt .input_box input {height:40px; line-height:38px; padding:0 20px; box-sizing:border-box; border:1px solid var(--gray250); width:300px;} .cash-receipt_wrap .caution {margin-top:20px;} .cash-receipt_wrap select {width:180px; padding-left:20px; background-position: 155px center;} /* 장바구니&주문결제 (e) *************************************************/ /* #248657: [24. 3Q] 장바구니 UI/UX 개선 (s) */ .ssfmp.ct-main .ct-tab-view .tbl-goods {border-top:0px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr td {border:0px; border-top:1px solid var(--gray250); vertical-align:top; padding-top:24px; padding-bottom:0px;} /* #265404 */ .ssfmp.ct-main .ct-tab-view .tbl-goods tr:first-of-type td {border-top:0px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr:last-of-type td {padding-bottom:0px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr td .goods-check {margin-right:14px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr td .goods-td {padding:0px; position:relative;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr td .goods-td .delete {position:absolute; top:-3px; right:0; width:24px; height:24px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr td .goods-td .delete button {width:24px; height:24px; background:var(--gray600); mask:url(../images/uxui/icon/cancel.svg) center center / 24px auto no-repeat; -webkit-mask:url(../images/uxui/icon/cancel.svg) center center / 24px auto no-repeat; text-indent:-9999px;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr.disabled .goods-img img {opacity:.6;} .ssfmp.ct-main .ct-tab-view .tbl-goods tr.disabled .info-area .goods-info .goods-basic .brand, .ssfmp.ct-main .ct-tab-view .tbl-goods tr.disabled .info-area .goods-info .goods-basic .name, .ssfmp.ct-main .ct-tab-view .tbl-goods tr.disabled .info-area .goods-info .goods-basic .addon *, .ssfmp.ct-main .ct-tab-view .tbl-goods tr.disabled .info-area .goods-info .goods-basic .price-info .gods-price * {color:var(--gray450);} .ssfmp.ct-main .layer-toast::before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-color:var(--gray900); opacity:0.6;} .ssfmp.ct-main .layer-toast {overflow:hidden; position:fixed; top:50%; left:50%; width:calc(338 * 100% / 574); min-width:338px; max-width:574px; margin:0px auto; text-align:center; padding:10px 24px; border-radius:6px; box-sizing:border-box; opacity:0; visibility:hidden; transform:translate(-50%, -50%); transition-duration:500ms; z-index:2001;} .ssfmp.ct-main .layer-toast.add-cart {width:338px;} .ssfmp.ct-main .layer-toast.active {opacity:1; visibility:visible;} .ssfmp.ct-main .layer-toast span {position:relative; display:block; min-width:290px; font-size:var(--F15); color:var(--white); line-height:var(--F15LL); text-align:center;} .ssfmp.ct-main .fullLayerLoadWrap .loadGif img {margin-top:-29px; margin-left:-29px;} .ssfmp.ct-main .ct-content {padding-top:0px !important;} .ssfmp.ct-main .ct-content.sticky .tab-rects {position:sticky; top:0; z-index:20; padding-bottom:0; transition:transform .5s;} .ssfmp.ct-main .ct-content .inquiry-txtbox {height:auto; margin-top:30px; padding:20px 60px 19px 30px;} .ssfmp.ct-main .ct-content .inquiry-txtbox .inquire-txt {font-size:var(--F15); line-height:var(--F15L);} .ssfmp.ct-main .ct-select .selector-title {margin-bottom:30px;} .ssfmp.ct-main .ct-select .selector-title .title-left {margin-top:13px;} .ssfmp.ct-main .ct-select .selector-title .title-left .selector-cart {margin:0px; padding:0px;} .ssfmp.ct-main .ct-select .selector-title .title-left .selector-cart .checkbox label {font-size:var(--F15); line-height:var(--F15L); margin-right:12px;} .ssfmp.ct-main .ct-select .selector-title .title-left .selector-cart .selected {display:block; height:22px; margin-left:20px;} .ssfmp.ct-main .ct-select .selector-title .title-left .selector-cart .selected a {display:block; height:22px; font-size:var(--F15); line-height:var(--F15L);} .ssfmp.ct-main .ct-select .selector-title .title-left .selector-cart .selected.disabled a {color:var(--gray250);} .ssfmp.ct-main .ct-select .selector-title .title-right .btn:disabled {border:1px solid var(--gray250); color:var(--gray250) !important; background:var(--white);} .ssfmp.ct-main .ct-tab-view {display:flex; gap:0 60px; position:relative; margin-top:30px; padding-top:0px !important;} /* #266485:20250305 */ .ssfmp.ct-main .ct-tab-view .ct-list {display:flex; flex-direction:column; width:calc(934 * 100% / 1400); border-bottom:1px solid var(--gray250);} .ssfmp.ct-main .ct-tab-view .ct-list > ul {border-top:1px solid var(--gray900);} .ssfmp.ct-main .ct-tab-view .ct-list > ul > li {border-top:1px solid var(--gray900);} /* #265404 */ .ssfmp.ct-main .ct-tab-view .ct-list > ul > li:first-of-type {border-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-list > ul:last-of-type > li:last-of-type {margin-bottom:120px;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-check .checkbox > label {margin:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-check .checkbox > label > i {margin:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img {margin-bottom:24px;} /* #265511 */ .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep {position:absolute; bottom:10px; right:10px; width:28px; height:28px; z-index:11;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart > label {width:auto !important; height:30px; font-weight:bold;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart > label input[type=checkbox] + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center top;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart > label input[type=checkbox]:checked + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center bottom;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart > .dummy {display:block; width:0px; height:28px; padding-left:28px;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart:after {position:absolute; right:0; width:28px; height:28px; content:""; background:url('../images/svgs/like-28-white.svg') no-repeat center top/28px auto;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-img .keep .heart[aria-pressed="true"]:after {background:url('../images/svgs/like-28-fill-red.svg') no-repeat center top/28px auto;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area {flex:1;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info {display:flex; flex-direction:row; gap:0 40px; margin-bottom:20px; margin-right:54px; min-height:200px; box-sizing:border-box;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic {max-width:437px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .warn {margin-top:2px; color:var(--red500); font-size:var(--F13); line-height:var(--F13L);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .withsale-goods {position:relative; display:flex; align-items:center; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600); margin-top:12px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .withsale-goods::before {content:""; width:16px; height:16px; background:var(--gray600); mask:url(../images/uxui/icon/information-16.svg); -webkit-mask:url(../images/uxui/icon/information-16.svg);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .withsale-goods a {display:flex; align-items:center; margin-left:2px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .withsale-goods .arrow {display:block; width:12px; height:12px; margin-left:2px; background:var(--gray600); mask:url(../images/uxui/icon/chevron_right-12.svg); -webkit-mask:url(../images/uxui/icon/chevron_right-12.svg);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .withsale-goods em {margin-left:2px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip {position:relative; display:inline-block; font-size:var(--F13); line-height:var(--F13L); border:1px solid var(--gray900); border-radius:6px; background:var(--white); padding:10px 16px; margin-top:6px; z-index:1;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip .triangle {display:block; width:8px; height:7px; border-bottom:2px solid var(--white); position:absolute; top:-8px; left:20%;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip .triangle::before, .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip .triangle::after {content:''; position:absolute; width:0.05em; height:8px; background:var(--gray900);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip .triangle::before {top:0px; left:1px; transform:rotate(34deg);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-basic .ct-tooltip .triangle::after {top:0px; right:2px; transform:rotate(-34deg);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info {display:flex; align-items:center; gap:0 20px; position:relative; margin-top:8px;} /* #265500 */ .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info .gods-price {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900)} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info .cost {display:block; color:var(--gray500); font-size:var(--F15); line-height:var(--F15L);} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info .sale {display:flex; align-items:center; font-size:var(--F17); line-height:var(--F17L); font-weight:bold} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info .sale em {display:inline-block;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .price-info .sale .discount {color:var(--purple500); margin-right:2px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-btn {display:flex; flex-direction:column; justify-content:center; min-width:180px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-btn button {width:100%; margin-top:8px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-info .goods-btn button:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-pay .status-box {margin-bottom:16px;} .ssfmp.ct-main .ct-tab-view .ct-list .info-area .goods-pay:not(:has(.gifts-area)) .status-box {margin-bottom:24px;} /* #265404 */ .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area {display:flex; gap:0 10px; width:100%; margin-top:16px; margin-bottom:16px; padding:0 40px 0 24px; box-sizing:border-box;} .ssfmp.ct-main .ct-tab-view .ct-list .goods-pay:not(:has(.status-box)) .gifts-area {padding-left:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .tbl-group tr:not(:last-of-type) .gifts-area {margin-bottom:24px;} /* #265404 */ .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .desc {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .badge {height:20px; padding:0 6px; border:1px solid var(--gray250); font-size:var(--F12); line-height:var(--F12L); color:var(--gray600); border-radius:4px; box-sizing:border-box;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list {position:relative; flex:1;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul {display:grid; grid-template-columns:repeat(auto-fit, minmax(100%, 1fr)); gap:10px 60px; margin-top:10px; box-sizing:border-box;} /* .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul.list-col-1 {grid-template-columns:repeat(auto-fit, minmax(100%, 1fr));} */ /* .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul.list-col-2 {grid-template-columns:repeat(auto-fit, minmax(28%, 1fr));} */ .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul li {display:inline-flex; align-items:center;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul li a {display:block; padding-right:16px; position:relative;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul li a::after {content:''; width:16px; height:16px; position:absolute; top:2px; right:0px; margin-left:2px; background:var(--gray700); mask:url(../images/uxui/icon/chevron_right-16.svg) right center / 16px auto no-repeat; -webkit-mask:url(../images/uxui/icon/chevron_right-16.svg) right center / 16px auto no-repeat;} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list ul li span {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-break:break-word; font-size:var(--F15); line-height:var(--F15L); color:var(--gray700);} .ssfmp.ct-main .ct-tab-view .ct-list .gifts-area .gifts-list i {display:block; width:16px; height:16px;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-group {display:grid; grid-template-columns:225px 1fr; margin-bottom:80px;} /* #265404 */ .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap {grid-column:2; border:1px solid var(--gray250); padding:24px; box-sizing:border-box;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-area {display:grid; grid-template-columns:1fr 1fr; gap:0 60px; overflow:hidden;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item {font-size:var(--F15); line-height:var(--F15L); margin-top:10px; position:relative;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-wrap .item-info {display:flex; justify-content:space-between; align-items:center;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-wrap .item-info .item-title {color:var(--gray600); position:relative;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-wrap .item-info .item-title .require {display:inline-block; margin-left:4px; font-size:var(--F12); color:var(--blue400);} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-wrap .item-info .item-value {flex:1; text-align:right; color:var(--gray900);} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-wrap .item-null {color:var(--gray600);} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .btn-toggle {display:block;position: absolute;top: 2px; right:-20px; margin-left:3px; width:16px;height: 16px;text-indent:-9999px;background:var(--gray600);mask:url(../images/uxui/icon/chevron_down-16.svg) center center / 16px auto no-repeat;-webkit-mask:url(../images/uxui/icon/chevron_down-16.svg) center center / 16px auto no-repeat;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-dropdown {margin-top:6px; padding:12px; border:1px solid var(--gray250); display:none;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-dropdown ul li {display:flex; justify-content:space-between; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600); margin-top:6px;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-list .amount-item .item-dropdown ul li:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-total .total-info {display:flex; justify-content:space-between; align-items:end; min-width:220px; height:calc(100% - 1px);} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-total .total-info .total-title {font-size:var(--F15);} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-total .total-info .total-value {font-size:var(--F20); font-weight:700; flex:1; text-align:right;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-area.open .btn-toggle {mask:url(../images/uxui/icon/chevron_up-16.svg) center center / 16px auto no-repeat; -webkit-mask:url(../images/uxui/icon/chevron_up-16.svg) center center / 16px auto no-repeat;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-area.open .item-dropdown {display:block;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-area.open .amount-total {transform:translateY(-76px);} @media only all and (max-width:1360px) { .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .amount-area {gap:0 12px;} } .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .gifts-area {border-top:1px solid var(--gray250); font-size:var(--F14); line-height:var(--F14L); color:var(--gray600); padding:16px 0 0; margin-bottom:0px;} .ssfmp.ct-main .ct-tab-view .ct-list .amount-wrap .gifts-area .gifts-list {margin-right:16px;} .ssfmp.ct-main .ct-tab-view .ct-payment {width:calc(406 * 100% / 1400); height:100%; position:sticky; top:60px; z-index:20; padding:30px 36px 40px; background:var(--white); border:1px solid var(--gray900); transform:translateY(-1px) !important; box-sizing:border-box;} .ssfmp.ct-main .ct-tab-view .ct-payment.sticky-end {z-index:19;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-title {padding-bottom:8px; border-bottom:2px solid var(--gray900); font-size:var(--F20); line-height:var(--F20L); font-weight:700;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-info {padding:20px 0; border-bottom:1px solid var(--gray900);} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-info ul li {display:flex; justify-content:space-between; font-size:var(--F16); line-height:var(--F16LL); margin-top:6px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-info ul li:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-info ul li .txt {color:var(--gray600);} .ssfmp.ct-main .ct-tab-view .ct-payment .discount-list {margin-top:4px; padding:16px; border:1px solid var(--gray250);} .ssfmp.ct-main .ct-tab-view .ct-payment .discount-list ul li {display:flex; justify-content:space-between; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600); margin-top:6px;} .ssfmp.ct-main .ct-tab-view .ct-payment .discount-list ul li:first-of-type {margin-top:0px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-total {display:flex; justify-content:space-between; align-items:flex-end; margin-top:20px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-total .txt {font-size:var(--F17); line-height:var(--F17L); font-weight:400;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-total .value {display:inline-flex; align-items:center; font-size:var(--F20); line-height:var(--F20L); font-weight:700;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-total .value em {font-size:var(--F24); line-height:var(--F24L); font-weight:700;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-tip {font-size:var(--F13); line-height:var(--F13LL); color:var(--red500); margin-top:12px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-submit {margin-top:20px;} .ssfmp.ct-main .ct-tab-view .ct-payment .payment-submit button {width:100%; margin:0px;} .ssfmp.ct-main .marketing-banner {margin-top:60px;} /* #266485:20250305 */ .ssfmp.ct-main .marketing-banner + .marketing-banner {margin-top:40px;} .ssfmp.ct-main .guide-content {margin-top:40px;} .ssfmp.ct-main .guide-content h3 {font-size:var(--F16); line-height:var(--F16LL); font-weight:700; color:var(--gray600);} .ssfmp.ct-main .guide-content .guide-list {margin-top:6px;} .ssfmp.ct-main .gods-wrap {margin-top:120px;} .ssfmp.ct-main .gods-wrap .recomm-list {padding:0 40px; position:relative;} .ssfmp.ct-main .gods-wrap .recomm-list .god-item {margin-bottom:0px; justify-content:space-between; gap:30px 0;} .ssfmp.ct-main .gods-wrap .recomm-list .god-item .god-info {height:103px;} .ssfmp.ct-main .gods-wrap .recomm-list .god-item .god-img {padding-top:calc(100% * 334/248);} .ssfmp.ct-main .gods-wrap .recomm-list .btn.cart {max-height:36px;} .ssfmp.ct-main .gods-wrap .recomm-list .swiper-button-prev {position:absolute; top:233px; left:0; z-index:10; width:24px; height:24px; background: url(../images/svgs/chevron-left-44-gray900.svg) no-repeat center/24px auto;} .ssfmp.ct-main .gods-wrap .recomm-list .swiper-button-next {position:absolute; top:233px; right:0; z-index:10; width:24px; height:24px; background: url(../images/svgs/chevron-right-44-gray900.svg) no-repeat center/24px auto;} /* //#248657: [24. 3Q] 장바구니 UI/UX 개선 (e) */ /* 주문결제 개선 (s) ****************************************************/ .caution {font-weight:normal; background:url("../images/base/bg_caution_lite.png") no-repeat left 1px; background-size:18px auto;} .grid_wrap .info .option {padding-top:3px;} .grid_wrap .info .option + .option {padding-top:0;} .grid_wrap .info .option.option-set::before{content:'ㄴ';display:inline-block;margin-right:2px;}/* #214453:20230913 */ .grid_wrap .info .packing {margin-top:15px;} /*#186371 배송패키지*/ .grid_wrap .info .packing i ~ i {margin-left:50px} /*#186371 배송패키지*/ .grid_wrap .price, .grid_wrap .price em {color:var(--gray900);} .form_wrap .row > label.required:after {position:absolute; top:4px;} section.order div > h4 {font-weight:bold; margin-top:42px;} section.order div > h4 > .btns {position:absolute; width:540px; text-align:right; margin-top:-34px; /*left:419px;*/} section.order .confirm_wrap + .confirm_wrap > h4 {margin-top:42px;} section.order .confirm_wrap + .confirm_wrap, section.order .form_wrap + .form_wrap, section.order .packing {margin-top:60px;} section.order .packing > ul {margin-top:0; border-top:0;} section.order .packing > ul li {border-top: 1px solid var(--gray250);} section.order .packing > ul li:first-child {border-top:0;} section.order .payment {margin-top:26px;} section.order .confirm_wrap + .confirm_wrap {padding-top:0;} section.order .agree h4 {margin-bottom:25px;} section.order .input_wrap .agree .remote_wrap {padding:20px; line-height:20px; box-sizing:border-box; background:#f7f7f7;} section.order .btns .btn.gray {line-height:38px; color:var(--white); background:var(--gray800); border:1px solid var(--gray800);} section.order .packing > ul > li > i {margin-left:50px;} section.order .packing ul li .quantity {margin-left:80px; width:138px;} section.order .packing ul li .quantity .minus, section.order .packing ul li .quantity .plus {width:18px; height:12px; font-size:0;} section.order .packing ul li .quantity .minus {top:auto; bottom:13px; left:13px; background:url('../images/ui/bg_minus.gif') no-repeat center center;} section.order .packing ul li .quantity .plus {top:11px; right:13px; background:url('../images/ui/bg_plus.gif') no-repeat center center;} section.order .bill.noline {margin-top:70px; padding-top:0; border-top:0;} section.order .agree .remote_wrap {margin-top:13px !important; margin-bottom:13px !important;} .form_wrap .input_wrap {margin-top:30px;} .form_wrap .input_wrap .row {width:540px; margin-top:20px; padding-left:140px; box-sizing:border-box;} .form_wrap .input_wrap .row .tits {position:absolute; display:block; left:0; top:9px; line-height:22px; font-size:var(--F15);} .form_wrap .input_wrap .row .input_box.txt_etc {padding-right:110px;} .form_wrap .input_wrap .row .input_box.txt_etc .btn {position:absolute; right:0; width:100px;} .form_wrap .input_wrap .row .input_box.txt_etc .mine {position:absolute; left:305px; line-height:40px; color:var(--gray600); white-space:nowrap;} .form_wrap .input_wrap .row .input_box.txt_chk {padding-right:200px;} .form_wrap .input_wrap .row .input_box.txt_chk .checkbox {position:absolute; right:90px; width:100px;} .form_wrap .input_wrap .row .input_box.txt_chk .btn {position:absolute; right:90px; width:100px;} .form_wrap .input_wrap .row .input_box.txt_chk .mine {position:absolute; left:320px; line-height:40px; color:var(--gray600); font-size:var(--F14); white-space:nowrap;} .form_wrap .input_wrap .row .outside {position:absolute; left:580px; top:7px; width:380px;} .form_wrap .input_wrap .row .outside.default {top:0;} .form_wrap .input_wrap .row .caution { line-height:22px; font-weight:normal; background:url(../images/base/bg_caution_lite.png) no-repeat 0 0;} .form_wrap .input_wrap .row .outside li {position:relative; padding-left:10px; font-size:var(--F14); color:var(--gray900);} .form_wrap .input_wrap .row .outside li::before {position:absolute; content:''; top:7px; left:0; display:inline-block; width:2px; height:2px; background:var(--gray900);} .form_wrap .input_wrap .row .outside li .cssf {color:var(--gray900);} .form_wrap .input_wrap .row + .caution{margin-left:140px;margin-top:10px;}/* #214453:20230829 */ .form_wrap .input_wrap .row .checkbox {margin-top:10px;}/*//#157237*/ .form_wrap .input_wrap .row .desc {margin-top:10px; margin-right:-400px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .form_wrap .input_wrap .row .desc .go_unipass {display:inline-block; font-size:var(--F14); line-height:var(--F14L); color:var(--purple500); margin-top:5px;} /* #251787:20240930 */ .form_wrap .input_wrap .row .pickup_addr {line-height:30px;} .form_wrap .input_wrap .row .pickup_addr .btn {margin-left:0; margin-top:10px;} .form_wrap .input_wrap .row label .arrow {display:inline-block; width:10px; height:6px; margin-left:7px; vertical-align:middle; background:url(../images/ui/btn_down_gray.svg) no-repeat left center/10px auto;} .form_wrap .input_wrap .row.on .balloon {display:block;} .form_wrap .input_wrap .row .balloon {display:none; position:absolute; z-index:100; padding:17px 20px; width:290px; background-color:var(--white); border:1px solid var(--gray900); text-align:center;} .form_wrap .input_wrap .row .balloon li {position:relative;padding-left:10px; font-size:var(--F13); color:var(--gray600); text-align:left; line-height:var(--F13L);} .form_wrap .input_wrap .row .balloon li:before {position:absolute; top:9px; left:0; width:2px; height:2px; background-color:var(--gray600); content:'';} .form_wrap .input_wrap .row.btn-r {display:flex; justify-content:flex-end; margin-top:-60px} /* #185205 */ .form_wrap .input_wrap .row .invalid {margin-top:12px; color:var(--red500);} /* #246087 */ /* #210340:20230725 */ /* .pay_with {display:flex; flex-wrap:wrap; width:100%; overflow:hidden; margin-top:25px;} .pay_with li {display:inline-flex; align-items:flex-start; width:240px; padding-top:10px; height:30px;} .pay_with li em {position:relative; display:inline-block; padding:0 5px; font-size:var(--F12); line-height:17px; vertical-align:4px; color:#9e3fff; border:1px solid #ae5eff;} .pay_with li em::before {display:block; content:''; position:absolute; top:6px; left:-3px; width:3px; height:3px; background:var(--white); border-top:1px solid #ae5eff; border-left:1px solid #ae5eff; transform:rotate(-45deg);} .pay_with .radio > label {margin-right:5px !important;} */ .pay_with{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;} .payment_tit + .pay_with {margin-top:30px;} .pay_with li{position:relative;} .pay_with li label{position:relative;display:inline-block;width:100%;height:90px;} .pay_with li input{position:absolute;opacity:0;width:0;height:0;} .pay_with li label > span{display:inline-block;width:100%;height:100%;box-sizing:border-box;padding-top:18px;text-align:center;font-size:var(--F14);color:var(--black);font-weight:400;font-size:var(--F13);line-height:var(--F13L);border:1px solid var(--gray250);border-radius:var(--radius);--label-offset:calc(13px);--label-height:calc(28px + 44px);} .pay_with li label > span::before{content:"";display:inline-block;height:28px;width:100%;margin-bottom:3px;background:url(../images/ui/ico_paywith.png?timestamp=20231010) no-repeat center calc(var(--label-offset) * -1) / 80px auto;} /* #218145:20231010 */ .pay_with li label.account > span::before{background-position:center calc((var(--label-height)) * -2 - var(--label-offset) );} .pay_with li label.deposit > span::before{background-position:center calc((var(--label-height)) * -1 - var(--label-offset) );} .pay_with li label.kakao > span::before{background-position:center calc((var(--label-height)) * -3 - var(--label-offset) );} .pay_with li label.toss > span::before{background-position:center calc((var(--label-height)) * -4 - var(--label-offset) );} .pay_with li label.naver > span::before{background-position:center calc((var(--label-height)) * -5 - var(--label-offset) );} .pay_with li label.ss > span::before{background-position:center calc((var(--label-height)) * -6 - var(--label-offset) );} .pay_with li label.apple > span::before{background-position:center calc((var(--label-height)) * -9 - var(--label-offset) );} .pay_with li label.mobile > span::before{background-position:center calc((var(--label-height)) * -7 - var(--label-offset) );} .pay_with li label.payco > span::before{background-position:center calc((var(--label-height)) * -8 - var(--label-offset) );} .pay_with li label em{position:absolute;left:0;top:0;display:flex;border-radius:var(--radius);background:rgba(0,0,0,0.6);padding:2px 10px;} .pay_with li label em span{color:var(--white,#FFF);font-style:normal;font-weight:400;font-size:var(--F12);line-height:var(--F12L);white-space:nowrap;} .pay_with li input:checked + span{border:1px solid var(--black);} .pay_with_add {margin-top:30px;} /* //#210340:20230725 */ .pay_with_add > *.on {display:block;} .pay_with_add > * {display:none;} .pay_with_add .grid_table {width:100%; table-layout:fixed; border-top:1px solid var(--gray200);} .pay_with_add .grid_table th {width:200px; padding:0 10px 0 22px; text-align:left; color:var(--gray900); background:#f7f7f7; box-sizing:border-box; border-bottom:1px solid var(--gray200);} .pay_with_add .grid_table td { padding:20px 30px; text-align:left; color:var(--gray900); box-sizing:border-box; border-bottom:1px solid var(--gray200);} .pay_with_add .grid_table .select {flex:none; height:40px; margin-right:5px;} .pay_with_add .grid_table .select label {border:none; padding:7px 20px 7px 10px; width:188px;} .pay_with_add .list_wrap.etc {margin-top:10px;} .payment .chks {margin-top:10px;} .income1, .income2, .income3, .income4 {display:none;} .note {margin-top:25px;} .note strong {display:block; padding:0 0 0 25px; color:var(--gray900); line-height:18px; font-weight:bold; letter-spacing:-0.5px; background:url(../images/base/bg_caution_gray_lite.png) no-repeat 0 0;} .note .list_wrap.etc {margin-top:10px;} .list_wrap.etc li {position:relative; text-indent:0; line-height:22px; font-size:var(--F14); color:var(--gray800);} .list_wrap.etc li::before {position:absolute; content:''; top:8px; left:0; display:inline-block; width:2px; height:2px; background:var(--gray900);} .pay_with_add .input_box {display:inline-block; vertical-align:middle;} .pay_with_add .input_box input[type="text"] {flex:1; height:40px; line-height:38px; padding:0 20px; box-sizing:border-box; border:1px solid var(--gray250); width:220px;} h4.payment_tit > a.tip_card {float:none; display:inline-block; margin:0 0 0 20px; padding-right:24px; font-size:var(--F14); line-height:var(--F14L); vertical-align:3px; font-weight: normal; color:var(--gray900); background:url(../images/base/bg_base.png) no-repeat right -946px; cursor:pointer;} .gray_box2 {background:#f7f7f7;} .gray_box2 .calc {padding:50px 0;} .only_txt {padding-right:5px; line-height:34px; vertical-align:middle;} .checkbox.line {position:relative; padding-top:20px; margin-top:10px;}/*//#157237*/ .checkbox.line::before {content:''; display:block; position:absolute; top:0; width:960px; border-top:1px solid #ddd;} .submit_order.etc {display:block;} .submit_order.etc p {padding-bottom:20px; color:var(--gray900);} .address_list {margin:35px 30px; width:500px;} .addr-list li {position: relative; padding-right:0px;} .addr-list li .btns {position:absolute; right:0; top:-25px;} .addr-list li .btns .btn:not(.bk) {position:relative; margin-left:3px;} .pop_payment {width:780px;} .pop_payment .submit {width:530px; margin-left:auto; margin-right:auto; } .payment_total {position:relative; padding:0 0 40px 0; margin:0 0 40px 0; text-align:right; color:var(--gray900); font-size:31px; border-bottom:1px solid var(--gray800);} .payment_total em {position:absolute; left:0; top:5px; font-size:var(--F17); font-weight:bold;} .pop_payment h4.payment_tit {font-size:var(--F17); font-weight:bold;} .pop_payment h4.payment_tit > a.tip_card {vertical-align:0;} /* #210340:20230725 */ .pop_payment .pay_with{gap:15px;} .pop_payment .payment_tit + .pay_with {margin-top:25px;} .popup .pop_payment .list_wrap li {text-indent: 0; padding-left: 10px;} /* //#210340:20230725 */ .post_more {margin-top:20px; text-align:center;} .post_more .btn span {padding-right:18px; background:url(../images/ui/btn_down.svg) no-repeat right center / 14px auto;} .agreeContents2 {padding:16px 20px 14px; background:var(--gray150);} .agreeContents2 li {color:var(--gray600); line-height:22px;} .agreeContents {padding-top:15px; padding-bottom:15px;} .agreeContents h3, .agreeContents .zoom120, .agreeContents .zoom120 p, .agreeContents .zoom120 li, .agreeContents .zoom120 dd, .agreeContents .zoom120 span, .agreeContents dl dt, .agreeContents dl dd {color:var(--gray600);} .agreeContents p {color:var(--gray600); font-size:var(--F14);} .agreeContents ul li {color:var(--gray600); font-size:var(--F14);} .agreeContents h4 {margin:0 !important; font-size:17px !important; line-height:26px !important; color:var(--gray600) !important; font-weight:normal !important;} /* #185205 베네피아 포인트 전환 팝업 */ .popup .benepia-pop {width:500px} .popup .benepia-pop h2 {font-size:var(--F24); line-height:var(--F24L)} .popup .benepia-pop h3 {margin-top:40px; font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:bold} .popup .benepia-pop .check-form {margin-top:30px} .popup .benepia-pop .check-form .txt {margin-bottom:10px; font-size:var(--F15); line-height:var(--F15L); color:var(--gray900)} .popup .benepia-pop .check-form .submit {margin-top:20px} .popup .benepia-pop .input_box {margin-top:10px} .popup .benepia-pop .input_box input {height:44px; padding:12px 15px; border: 1px solid var(--gray250); border-radius:var(--radius); font-size:var(--F14); line-height:var(--F14L); color:var(--gray500); box-sizing:border-box} .popup .benepia-pop .input_box input:read-only {background-color:var(--gray100);} .popup .benepia-pop .submit .btn {height:44px; padding:0 15px; border-radius:var(--radius); font-size:var(--F14); line-height:44px; box-sizing:border-box} .popup .benepia-point {height:560px; margin-right:-30px; padding-right:30px; overflow-y:auto; overflow-x:hidden} .popup .benepia-point .point-status {display:flex; justify-content:space-between; flex-wrap:wrap; align-content:center; width:500px; height:124px; padding:20px 20px 24px 15px; border-radius:var(--radius); background:var(--gray150); box-sizing:border-box} .popup .benepia-point .point-status > span {align-self:center; font-size:var(--F15); line-height:var(--F15L); color:var(--gray900)} .popup .benepia-point .point-status .txt {width:274px;} .popup .benepia-point .point-status .active {margin-bottom:30px; font-weight:bold} .popup .benepia-point .point-status .point.active {font-size:var(--F24); line-height:var(--F24L);} .popup .benepia-point .txts {position:relative; margin-top:10px; padding-left:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray500)} .popup .benepia-point .txts::before {position:absolute; left:0; top:8px; width:2px; height:2px; content:''; margin-right:4px; background: var(--gray600);} .popup .benepia-point .input_box.inline {display:flex; justify-content:space-between; margin-top:20px} .popup .benepia-point .input_box.inline .ipt {width:355px} .popup .benepia-point .input_box.inline .submit {margin-top:0} .popup .benepia-point .input_box.inline .submit .btn {padding:0 22px; color:var(--gray900)} .popup .benepia-point .terms-agree {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; margin-top:15px;} .popup .benepia-point .terms-agree .checkbox > label {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900)} .popup .benepia-point .terms-agree a[role="button"] {width:16px; height:16px; padding:2px 0; background:url(../images/svgs/chevron-down-16.svg) center / 16px auto no-repeat;} .popup .benepia-point .terms-agree a[role="button"].on {background-image:url(../images/svgs/chevron-up-16.svg);} .popup .benepia-point .terms-agree #agree_terms {margin-top:17px; height:120px; text-align:left; background:var(--gray150); overflow-y:auto;} .popup .benepia-point .note-lists {margin-top:40px} .popup .benepia-point .note-lists .tit {font-size:var(--F13); line-height:var(--F13L); color:var(--gray900); font-weight:bold} /* #190680 */ .popup .benepia-point .note-lists li {position:relative; margin-top:6px; padding-left:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray500)} .popup .benepia-point .note-lists li:first-child {margin-top:8px;} .popup .benepia-point .note-lists li::before {position:absolute; left:0; top:8px; width:2px; height:2px; content:''; margin-right:4px; background: var(--gray600);} .popup .benepia-point .note-lists li em {color:var(--gray900)} .popup .benepia-point .note-lists li .b {font-weight:bold} /* #190680 */ .popup .benepia-point .note-lists li .underline {text-decoration:underline} /* #190680 */ .popup .benepia-point .submit.change {margin-top:40px} .popup .benepia-point .submit.change .btn {height:60px; font-size:var(--F15); line-height:60px} /* 주문결제 개선 (e) ****************************************************/ /* 멤버십 안내 (s) *****************************************************/ .membership .intro .tit:after {display:block; clear:both; content:"";} .membership .intro .tit h2 {float:left; width:380px; font-size:39px; line-height:48px;} .membership .intro .tit p {float:left; font-size:19px; color:var(--gray800); line-height:30px;} .membership .intro .tit p span {display:block; margin-top:12px; font-size:var(--F15); color:var(--gray600); line-height:16px;} .membership .intro ul {margin-top:100px;} .membership .intro ul:after {display:block; clear:both; content:"";} .membership .intro ul li {float:left; width:25%; height:195px;} .membership .intro ul li strong {font-weight:bold; font-size:25px; color:var(--purple400); line-height:28px;} .membership .intro ul li p {margin-top:16px; color:var(--gray800); line-height:22px;} .membership .detail {border-top:1px solid var(--gray900);} .membership .detail h3 {margin:60px 0 40px 0; font-size:19px; color:var(--gray900); line-height:16px;} .membership .detail table {width:100%; text-align:center;} .membership .detail table th {padding:20px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; font-size:var(--F13); color:var(--gray600); line-height:16px;} .membership .detail table td {padding:12px 0; border-bottom:1px solid var(--gray250); font-size:var(--F14); color:var(--gray600); line-height:22px;} .membership .detail table td.tleft {text-align:left;} .membership .detail .list_wrap {margin-top:24px;} .membership .detail .list_wrap li {font-size:var(--F14); color:var(--gray600); line-height:22px;} .membership .detail .list_wrap ul ul {padding-left:10px;} .membership .detail .list_wrap ul ul li {color:var(--gray600); line-height:22px;} .membership .detail .list_wrap ul ul ul li:before {content:"· ";} .membership .detail .list_wrap + table {margin-top:50px;} .membership .detail table.type_1 th {border-left:1px solid #d5d5d5; font-size:var(--F17); color:var(--gray800);} .membership .detail table.type_1 td {padding:35px 0 35px 30px; border-color:#d5d5d5; border-left:1px solid #d5d5d5; text-align:left; vertical-align:top;} .membership .detail table.type_1 th:first-child, .membership .detail table.type_1 td:first-child {padding-left:0; border-left:0 none;} .membership .detail table.type_1 .list_wrap {margin-top:0;} .membership .detail table.type_1 .list_wrap > ul > li {margin-top:10px;} .membership .detail table.type_1 .list_wrap > ul > li:first-child {margin-top:0;} .membership .detail .line_box {margin-top:30px; padding:30px 0; border-top:1px solid var(--gray900); border-bottom:1px solid var(--gray900); line-height:12px;} .membership .detail .line_box strong {display:inline-block; width:150px; color:var(--gray800);} .membership .detail .line_box span {display:inline-block; font-weight:bold; font-size:var(--F17); color:var(--gray800);} .membership .detail .terms_wrap h2 {margin-top:60px; font-size:33px; color:var(--gray900);} .membership .detail .terms_wrap .mCS {margin-top:40px; padding:10px; height:340px; text-align:left; background:var(--gray150);} .membership .update_plz {display:block; position:absolute; top:24px; left:29px; width:310px; margin-top:15px; padding:16px 20px; line-height:22px; font-size:var(--F15); background:#f7eeff; border:1px solid #f0e5fa;} .membership .update_plz:after {display:block; content:''; position:absolute; top:-6px; left:30px; width:10px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} .membership .update_plz p + p {padding-top:15px;} .membership .update_plz a {display:inline-block; padding:0 20px; margin-right:10px; line-height:28px; font-size:var(--F13); border:1px solid var(--gray800);} .membership .update_plz a.em {background:var(--gray800); color:var(--white)} .membership .update_plz button.close {position:absolute; right:8px; top:10px; width:20px; height:20px; color:transparent; background:url(../images/ui/btn_x_gray.svg) no-repeat center center/ 12px auto;} section.membership .info-header {height:246px;} section.membership .info-header h2 {font-size:25px; line-height:36px;} section.membership .info-header p {margin-top:20px; line-height:30px; color:var(--gray800); font-size:19px;} section.membership .info-header p span {display:block; color:#999; font-size:var(--F15);} section.membership .info-header p .btn {display:block; margin-top:36px; width:168px; height:48px; padding:0; line-height:48px;} section.membership .gray_box {margin-top:60px; padding:40px;} section.membership .gray_box h4 {font-size:25px; line-height:36px;} section.membership .gray_box .welcome {display:inline-block; padding-right:40px; border-right:1px solid var(--gray250);} section.membership .gray_box .applogin {display:inline-block; margin-left:40px;} section.membership .gray_box > div {margin-top:36px; vertical-align:top;} section.membership .gray_box > div > h5 {font-size:var(--F17); font-family:'SSF_Regular', 'NotoSans_kr_Demilight';} section.membership .gray_box > div > p {displaY:block; margin-top:17px;} section.membership .gray_box > div > p > img {width:auto;} section.membership .gray_box > div > p > img + img {margin-left:5px;} section.membership .gray_box > div > ul {margin-top:20px;} section.membership .gray_box > div > ul > li {line-height:var(--F15LL); color:var(--gray800); font-size:var(--F15);} section.membership .gray_box > div > ul + p {margin-top:3px; color:var(--gray600); } section.membership .accordion {margin-top:60px;} section.membership .accordion .title {display:block; position:relative; padding:23px 20px; line-height:24px; font-size:var(--F17); font-weight:bold;} section.membership .accordion .title.on {border-bottom:1px solid var(--gray200);} section.membership .accordion .title:after {position:absolute; right:0; content:''; top:5px; right:10px; width:36px; height:60px; background: url(../images/ui/btn_down.svg) no-repeat center center/14px auto;} section.membership .accordion .title.on:after {transform:rotate(-180deg);} section.membership .accordion .content {margin-bottom:30px;} section.membership .accordion .content > table {margin-top:10px; width:100%;} section.membership .accordion .content > table th {padding:0 20px; font-weight:bold;} section.membership .accordion .content > table tr:first-child th {text-indent: 0!important; text-align:center;} section.membership .accordion .content > table .txt-left {padding-left:20px; text-align:left;} section.membership .accordion .content > ul {margin-top:25px; line-height:var(--F14LL); color:#8e8e8e; font-size:var(--F14);} section.membership .accordion .content > table td {padding:20px; height:auto; font-weight:500} section.membership .accordion .content > table td ul {font-weight:normal} section.membership .accordion .content ul ul, section.membership .accordion .content ul ol {padding-left:8px; color:#8e8e8e;} section.membership .accordion + .detail {margin-top:60px; border-top:0;} section.membership .accordion + .detail .mCS {margin-top:24px;} section.membership .terms_wrap h4 {font-size:var(--F24); line-height:36px;} section.membership .class-table h4 {display:flex; align-items: center; font-size:25px; line-height:36px;} section.membership .class-table h4 a.btn {margin-left:auto;} .newly h4, .class-table h4 {margin-top:60px; margin-bottom:24px; font-size:19px; line-height:28px;} .class-table table {margin-top:28px;} .class-table table th {padding:25px 0 25px 50px; line-height:18px; text-align:left; font-weight:bold; background-color:#fafafa;} .class-table table th, .class-table table td {font-size:var(--F14); border:1px solid var(--gray200); border-right:0; border-left:0; font-weight:bold;} .class-table table td {height:68px; text-align:center;} .class-table table th > span {display:block; color:#8e8e8e; font-size:var(--F13); font-weight:normal} .class-table table .mem-class td {height:120px; font-weight:600;} .class-table table .mem-class th {text-align:center;} .class-table table .mem-class .coin.min {display:block; margin:0 auto 8px;} .class-table i.icons {vertical-align:middle;} .class-table i.icons:after {top:0; left:-30px; width:20px; height:20px;} .class-table i.icons.class:after {background-position:right -4px;} .class-table i.icons.p-point:after {background-position:right -44px;} .class-table i.icons.i-point:after {background-position:right -85px;} .class-table i.icons.g-point:after {background-position:right -124px;} .class-table i.icons.money:after {background-position:right -165px;} .class-table i.icons.needle:after {background-position:right -205px;} .class-table i.icons.backfree:after {background-position:right -244px;} .class-table i.icons.fitting:after {background-position:right -284px;} .class-table i.icons.backfavor:after {background-position:right -324px;} .class-table i.icons.headset:after {background-position:right -364px;} .class-table i.icons.discount:after {background-position:right -405px;} .class-table i.icons.diamond:after {background-position:right -445px;} .class-table i.icons.coupon:after {background-position:right -484px;} /* 멤버십 안내 (e) ******************************************************/ /* mypage (s) **********************************************************/ section.mypage .date_wrap {margin-top:50px; text-align:right;} section.mypage .date_wrap .search-date {display:inline-block; margin-right:5px; vertical-align:top;} section.mypage .date_wrap .search-date input {margin-top:0;} section.mypage .date_wrap .btn {height:36px; border-color:var(--gray900); color:var(--gray900); line-height:34px;} section.mypage .tabs .myReview .info {max-width:800px !important;} section.mypage .tabs .tab li {width:25%;} section.mypage .tabs .grid_wrap.goods th {text-align:left;} section.mypage > .tabs > div h3 {font-size:25px; line-height:36px;} section.mypage > .tabs .tab-tit {margin:60px 0px 20px 0px} /*.inner-wrap section.mypage .date_wrap {margin-top:0}*/ /* 메인 */ section.mypage .info_wrap {padding:70px 0; border-top:2px solid #282828 !important; border-bottom:2px solid #282828 !important;} section.mypage .info_wrap .basic:after, section.mypage .info_wrap .extend:after {display:block; clear:both; content:"";} section.mypage .info_wrap .basic .left {display:inline-block; color:var(--gray900);} section.mypage .info_wrap .basic .left h2 {font-size:33px; line-height:28px;} section.mypage .info_wrap .basic .left span {display:block; margin-top:26px; font-weight:bold; font-size:19px; line-height:14px;} section.mypage .info_wrap .basic .right {float:right; width:590px; padding-bottom:50px;} section.mypage .info_wrap .basic .right .grade {display:inline-block; width:290px;} section.mypage .info_wrap .basic .right .grade span {display:block; color:var(--gray800); line-height:12px;} section.mypage .info_wrap .basic .right .grade h3 {margin-top:20px; font-size:49px; color:var(--gray900); line-height:46px;} section.mypage .info_wrap .basic .right .grade h3 a {display:inline-block; padding-right:25px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/auto 29px; font-size:36px; color:var(--gray600);} section.mypage .info_wrap .basic .right .grade h3 + a {display:inline-block; margin-top:20px; font-size:var(--F17); color:var(--gray600); line-height:14px;} section.mypage .info_wrap .extend .left {display:inline-block; padding-top:48px} section.mypage .info_wrap .extend .count > a {display:block; margin-top:12px; font-size:31px; font-weight:bold; color:var(--gray900); line-height:30px;} section.mypage .info_wrap .extend .count label {display:inline-block; position:relative; width:78px; height:20px; margin-left:10px; border:1px solid #d5d5d5; vertical-align:middle;} section.mypage .info_wrap .extend .count label input[type=checkbox] + .slider {position:absolute; top:-1px; left:39px; z-index:10; width:40px; height:22px; background-color:#959595; transition:all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} section.mypage .info_wrap .extend .count label input[type=checkbox]:checked + .slider {top:-1px; left:-1px; background-color:var(--purple400);} section.mypage .info_wrap .extend .count label span + span {position:relative; z-index:20; float:left; width:50%; height:20px; font-weight:bold; font-size:var(--F12); color:var(--white); line-height:20px; text-align:center;} section.mypage .info_wrap .extend .right {float:right; width:590px; padding-top:47px; border-top:1px solid #e9e9e9;} section.mypage .info_wrap .extend .right ul .count {display:inline-block; margin-left:32px;} section.mypage .info_wrap .extend .right ul .count > a {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} section.mypage .info_wrap .extend .right ul .count:first-child > a {max-width:176px;} section.mypage .info_wrap .extend .right ul .count:nth-child(2) > a {max-width:156px;} section.mypage .info_wrap .extend .right ul .count:nth-child(3) > a {max-width:60px;} section.mypage .info_wrap .extend .right ul .count:nth-child(4) > a {max-width:80px;} section.mypage .info_wrap .extend .right ul .count:first-child {margin-left:0;} section.mypage .info_wrap + .banners {margin-top:50px;} section.mypage .order_wrap h4 {padding-top:95px; font-size:19px; color:var(--gray900); font-weight:bold; line-height:26px;} section.mypage .membership {margin-bottom:57px; padding:50px 0; height:200px; border-top:2px solid #282828 !important; border-bottom:2px solid #282828 !important;} section.mypage .membership h2 {color:var(--gray900); line-height:32px; font-size:27px;} section.mypage .membership h2 > a {display:inline-block; width:100%; height:32px;} section.mypage .membership h2 > a:after {display:inline-block; width:25px; height:32px; vertical-align:top; background:url(../images/ui/btn_next.svg) no-repeat right center/14px auto; background-size:10px; content:'';} section.mypage .membership h2 > a em {display:inline-block; max-width:50%; height:32px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align:top; } section.mypage .membership h2 > small {display:block; width:100%; margin-top:10px; color:var(--gray600); line-height:18px; height:20px; font-size:19px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; } section.mypage .membership h3 {line-height:36px; font-size:25px; font-weight:normal;} section.mypage .membership h3 > span {font-weight:bold;} section.mypage .membership .mem-class {display:inline-block; width:460px;} section.mypage .membership .mem-class .coin {vertical-align:top;} section.mypage .membership .mem-profile {position:relative; display:inline-block; width:290px; margin-left:30px; }/*//#141828 : 회원가입 재구성*/ section.mypage .membership .mem-profile a.btn.gy {color:var(--white); background:var(--gray800); border:1px solid var(--gray800);} section.mypage .membership .mem-info:hover .update_plz {display:block;} section.mypage .membership .mem-grade {margin-top:20px; font-size:var(--F17);} section.mypage .membership .mem-grade .tip {line-height:20px;} section.mypage .membership .mem-grade .speech {display:none; position:absolute; margin-top:-8px; margin-left:90px;} section.mypage .membership .mem-grade .tip:hover + .speech, section.mypage .membership .mem-grade .speech:hover {display:block;} section.mypage .membership .mem-grade .speech .bulloon {position:relative; margin-top:15px; padding:16px 20px; line-height:22px; font-size:var(--F14); background:#f7eeff; border:1px solid #f0e5fa;} section.mypage .membership .mem-grade .speech .bulloon em {display:block; margin:10px 0; color:#8e8e8e; font-size:var(--F14);} section.mypage .membership .mem-grade .speech .bulloon a { font-size:var(--F14); font-weight:bold;} section.mypage .membership .mem-grade .speech .bulloon:after {display:block; content:''; position:absolute; top:-6px; left:30px; width:10px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} section.mypage .membership .mem-grade .badge {margin-left:6px;} section.mypage .membership .mem-grade > span {display:block; line-height:24px; font-size:var(--F17);} section.mypage .membership .mem-grade > span.sum {margin-top:6px; color:var(--gray600); font-size:var(--F14); font-weight:normal;} section.mypage .membership .mem-grade > span.sum > em {color:var(--gray800); font-weight:bold;} section.mypage .membership .mem-grade + .btn { height:37px; padding:0 20px; line-height:37px; margin-top:24px;} section.mypage .membership .switch {display:inline-block; position:relative; width:78px; height:20px; margin-left:10px; border:1px solid #d5d5d5; vertical-align:middle;} section.mypage .membership .switch input[type=checkbox] + .slider {position:absolute; top:-1px; left:39px; z-index:10; width:40px; height:22px; background-color:#959595; transition:all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} section.mypage .membership .switch input[type=checkbox]:checked + .slider {top:-1px; left:-1px; background-color:var(--purple400);} section.mypage .membership .switch span + span {position:relative; z-index:20; float:left; width:50%; height:20px; font-weight:bold; font-size:var(--F12); color:var(--white); line-height:20px; text-align:center;} section.mypage .membership .mem-wallet {float:right; width:500px; vertical-align:top;} section.mypage .membership .mem-wallet > ul > li {float:left; width:33.33%;} section.mypage .membership .mem-wallet > ul > li > span {display:block; color:var(--gray800); font-size:var(--F14);} section.mypage .membership .mem-wallet > ul > li > .value {display:block; margin-top:5px; font-size:33px; line-height:38px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} section.mypage .membership .mem-wallet > ul > li .review_plz {position:absolute; margin:-55px 0 0 -53px; padding:9px 20px; font-size:var(--F14); background:#f7eeff; border: 1px solid #f0e5fa;} /*#141816추가*/ section.mypage .membership .mem-wallet > ul > li .review_plz:after {display:block; content:''; position:absolute; bottom:-6px; left:45%; width:10px; height:10px; background:#f7eeff; border-bottom:1px solid #f0e5fa; border-right:1px solid #f0e5fa; transform:rotate(45deg);}/*#141816추가*/ section.mypage .membership .mem-wallet > ul:after {display:block; content:''; clear:both;} section.mypage .membership .mem-wallet > ul + ul {margin-top:30px; padding-top:36px; border-top:1px solid #e9e9e9;} section.mypage .membership + .banners + .order_wrap {margin-top:-30px;} section.mypage .membership.info {height:174px;} section.mypage .membership.info + .grade .grade_list {padding-top:22px; border-top:0;} section.mypage .membership .mem-decide {margin-top:15px; line-height:24px; font-size:var(--F14);} section.mypage .membership .mem-decide label {display:inline-block; width:85px; color:#8e8e8e;} section.mypage .membership .mem-decide span {color:var(--gray900);font-weight:bold;} section.mypage .membership .mem-next {float:right; width:420px; vertical-align:top;} section.mypage .membership .mem-next .mem-class {font-size:var(--F17); font-weight:bold;} section.mypage .membership .mem-next .mem-class .badge {margin:0 10px;} section.mypage .membership .mem-next .mem-class > small {display:block; margin-top:5px; color:#8e8e8e; font-size:var(--F14); font-weight:normal;} section.mypage .membership .mem-next .mem-step {position:relative; margin-top:40px; height:20px;} section.mypage .membership .mem-next .mem-step > div:before {display:block; content:''; position:absolute; top:50%; margin-top:-2px; width:100%; height:4px; background-color:#e9e9e9; z-index:0;} section.mypage .membership .mem-next .mem-step > div:after {display:block; content:''; position:absolute; top:50%; margin-top:-2px; height:4px; background-color:var(--purple400); z-index:1;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-03:after {width:0%;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-04:after {width:20%;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-05:after {width:40%;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-06:after {width:60%;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-07:after {width:80%;} section.mypage .membership .mem-next .mem-step > div.tobe_lv-08:after {width:100%;} section.mypage .membership .mem-next .mem-step > div > ul {display:block; position:absolute; width:100%; font-size:0; z-index:2;} section.mypage .membership .mem-next .mem-step > div > ul > li {display:inline-block; width:20px; height:20px; line-height:20px; text-align:center; color:var(--white); font-size:var(--F13); font-weight:bold; background-color:#e9e9e9; border-radius:50%;} section.mypage .membership .mem-next .mem-step > div > ul > li + li {margin-left:60px;} section.mypage .membership .mem-next .mem-step .tobe_lv-03 > ul > li:nth-last-child(1n+6), section.mypage .membership .mem-next .mem-step .tobe_lv-04 > ul > li:nth-last-child(1n+5), section.mypage .membership .mem-next .mem-step .tobe_lv-05 > ul > li:nth-last-child(1n+4), section.mypage .membership .mem-next .mem-step .tobe_lv-06 > ul > li:nth-last-child(1n+3), section.mypage .membership .mem-next .mem-step .tobe_lv-07 > ul > li:nth-last-child(1n+2), section.mypage .membership .mem-next .mem-step .tobe_lv-08 > ul > li {background-color:var(--purple400);} section.mypage .membership .mem-next .mem-step div > ul > li:after {content:''; position:absolute; margin:-21px 0 0 -9%; width:16%; color:var(--gray600); text-align:center; font-size:var(--F13);} section.mypage .membership .mem-next .mem-step div.lv-03 > ul > li:nth-child(1):after {content:'FAMILY';} section.mypage .membership .mem-next .mem-step div.lv-04 > ul > li:nth-child(2):after {content:'BRONZE';} section.mypage .membership .mem-next .mem-step div.lv-05 > ul > li:nth-child(3):after {content:'SILVER';} section.mypage .membership .mem-next .mem-step div.lv-06 > ul > li:nth-child(4):after {content:'GOLD';} section.mypage .membership .mem-next .mem-step div.lv-07 > ul > li:nth-child(5):after {content:'PLATINUM';} section.mypage .membership .mem-next .mem-step div.lv-08 > ul > li:nth-child(6):after {content:'DIAMOND';} section.mypage .membership .mem-next .mem-step div.tobe_lv-03 > ul > li:after {font-weight:bold;} section.mypage .membership .mem-next .mem-step div.tobe_lv-03 > ul > li:nth-child(1):after {content:'FAMILY'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step div.tobe_lv-04 > ul > li:nth-child(2):after {content:'BRONZE'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step div.tobe_lv-05 > ul > li:nth-child(3):after {content:'SILVER'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step div.tobe_lv-06 > ul > li:nth-child(4):after {content:'GOLD'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step div.tobe_lv-07 > ul > li:nth-child(5):after {content:'PLATINUM'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step div.tobe_lv-08 > ul > li:nth-child(6):after {content:'DIAMOND'; color:var(--purple400) !important; } section.mypage .membership .mem-next .mem-step .speech {position:absolute; margin:17px 0 0 -26px;} section.mypage .membership .mem-next .mem-step .speech .bulloon {display:inline-block; position:relative; margin-top:15px; padding:16px 20px; line-height:22px; white-space:nowrap; font-size:var(--F14); background:#f7eeff; border:1px solid #f0e5fa;} section.mypage .membership .mem-next .mem-step .speech .bulloon span {color:var(--purple400);} section.mypage .membership .mem-next .mem-step .speech .bulloon:after {display:block; content:''; position:absolute; top:-6px; left:30px; width:10px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} section.mypage .membership .mem-next .mem-step div.tobe_lv-06 .speech .bulloon:after, section.mypage .membership .mem-next .mem-step div.tobe_lv-07 .speech .bulloon:after, section.mypage .membership .mem-next .mem-step div.tobe_lv-08 .speech .bulloon:after {left:auto; right:30px; text-align:right;} section.mypage .membership .mem-next .mem-step div.tobe_lv-03 .speech {left:0;} section.mypage .membership .mem-next .mem-step div.tobe_lv-04 .speech {left:19%;} section.mypage .membership .mem-next .mem-step div.tobe_lv-05 .speech {left:38%;} section.mypage .membership .mem-next .mem-step div.tobe_lv-06 .speech {right:32%;} section.mypage .membership .mem-next .mem-step div.tobe_lv-07 .speech {right:13%;} section.mypage .membership .mem-next .mem-step div.tobe_lv-08 .speech {right:-6%;} section.mypage .grid_wrap {margin-top:36px; } section.mypage .grid_wrap.goods .info {max-width:487px;} /* #196830: 20230403 */ section.mypage .grid_wrap .info .brand {margin-bottom:0; color: var(--gray900);} section.mypage .grid_wrap .info .name {margin-bottom:10px;} /* #196830: 20230313 start */ section.mypage .grid_wrap tr td:first-child {vertical-align:top;} section.mypage .grid_wrap tr td:first-child + td {vertical-align:middle;} /* #196830: 20230403 start */ section.mypage .grid_wrap .info .coin_desc {display:block; margin-top:20px; padding:15px; background-color:#f7f7f7;} section.mypage .grid_wrap .info .coin_desc .coin_title {display:flex; align-items:center; gap:0 6px; overflow:hidden; font-size:var(--F14); font-weight:700; color:var(--purple400); line-height:var(--F14L); white-space:nowrap; text-overflow:ellipsis;} section.mypage .grid_wrap .info .coin_desc .coin_title em {padding:0 10px; background-color:var(--purple500); font-size:var(--F12); color:var(--white); line-height:20px;} section.mypage .grid_wrap .info .coin_desc .coin_title + p {margin-top:4px;} section.mypage .grid_wrap .info .coin_desc p {display:block; position:relative; padding-left:6px; font-size:var(--F13);color:var(--gray900); line-height:var(--F13L);} section.mypage .grid_wrap .info .coin_desc p:before {content:""; position:absolute; top:8px; left:0; width:2px; height:2px; background-color:var(--gray600);} /* #196830: 20230403 end */ /* #196830: 20230313 end */ section.mypage .post + .post {margin-top:95px;} section.mypage .post .grid_wrap tr:first-child td {border-top:0;} /* 수선, 문의·활동 내역 */ section.mypage .history_wrap h4 {padding-top:95px; font-size:19px; color:var(--gray900); line-height:26px;} section.mypage .history_wrap h4 span {display:inline-block; width:50%; color:var(--gray900); } section.mypage .history_wrap + .history_wrap h4 {padding-top:60px; border-top:1px solid var(--gray800);} section.mypage .history_wrap .repair_list {margin-top:45px; padding-bottom:70px;} section.mypage .history_wrap .repair_list p {font-size:var(--F14); color:var(--gray600); line-height:24px; text-align:left;} section.mypage .history_wrap .ask_list {margin-top:45px; padding-bottom:35px; border-bottom:1px solid var(--gray250);} section.mypage .history_wrap .ask_list li {display:inline-block; width:190px;} section.mypage .history_wrap .ask_list li:nth-child(2) {margin-right:100px;} section.mypage .history_wrap .ask_list li span {display:inline-block;font-weight:bold; font-size:var(--F14); color:var(--gray800); line-height:16px;} section.mypage .history_wrap .ask_list li span.heart { width:16px; height:16px; } section.mypage .history_wrap .ask_list li span.heart>i { display:block; margin-top:4px; width:100%; height:100%; background:url(../images/base/heart_em_wishlist.svg)no-repeat; padding-top:2px;} section.mypage .history_wrap .ask_list li a {display:block; margin-top:15px; font-size:33px; line-height:30px; color:var(--gray800);} section.mypage .history_wrap .hint_area {padding:40px 0; border-bottom:1px solid var(--gray250);} section.mypage .history_wrap .hint_area:after {display:block; clear:both; content:"";} section.mypage .history_wrap .hint_area .left {float:left;} section.mypage .history_wrap .hint_area .left em {display:block; font-size:var(--F14); color:var(--gray800); line-height:14px;} section.mypage .history_wrap .hint_area .left p {display:block; margin-top:10px; font-size:var(--F13); color:var(--gray600); line-height:12px;} section.mypage .history_wrap .hint_area .right {float:right; padding-top:4px;} section.mypage .history_wrap .hint_area .right span {display:inline-block; font-size:var(--F21); color:var(--gray900); vertical-align:middle;} section.mypage .history_wrap .hint_area .right .btn {padding:0; width:109px; height:26px; margin-left:20px; font-size:var(--F13); line-height:26px; text-align:center; vertical-align:middle;} /* 주문 하단 스텝 */ section.mypage .step_wrap {margin-top:80px;} section.mypage .step_wrap > strong {font-size:19px; line-height:36px;} section.mypage .step_wrap h3 {font-size:19px; color:var(--gray900);} section.mypage .step_wrap img {margin-top:50px; width:auto;} section.mypage .step_wrap ol {margin-top:36px;} section.mypage .step_wrap ol:after {display:block; clear:both; content:"";} section.mypage .step_wrap ol li {float:left; width:172px; height:206px; margin:35px 0 0 50px; padding-right:30px; background:url(../images/ui/btn_next.svg) no-repeat right 91px/10px auto} section.mypage .step_wrap ol li:nth-child(4n-3) {margin-left:0px;} section.mypage .step_wrap ol li:last-child {background-image:none;} section.mypage .step_wrap ol li .number {display:block; font-size:35px; color:var(--gray600); line-height:24px;} section.mypage .step_wrap ol li em {display:block; margin-top:18px; font-size:var(--F21); color:var(--gray900); line-height:20px;} section.mypage .step_wrap ol li p {height:54px; margin-top:18px; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L); text-align:left;} section.mypage .step_wrap ol li span {display:block; font-size:var(--F13); color:var(--gray600);} section.mypage .step_wrap.col3 ol li {padding-right:76px; width:210px;} section.mypage .step_wrap.col3 ol li:nth-child(4n-3) {margin-left:50px;} section.mypage .step_wrap.col3 ol li:nth-child(3n+1) {margin-left:0;} section.mypage .step_wrap.col3 ol li:nth-child(3n) {background-image:none;} section.mypage .step_wrap ul {margin-top:80px} section.mypage .step_wrap ul:after {display:block; clear:both; content:"";} section.mypage .step_wrap ul li {position:relative; float:left; width:172px; margin-left:20px; padding-top:65px; background:url(../images/ui/btn_next.svg) no-repeat 127px 65px / 10px auto} section.mypage .step_wrap ul li:after {position:absolute; top:0; left:0; width:46px; height:46px; background:url("../images/ui/bg_step.png") no-repeat 0 0; content:'';} section.mypage .step_wrap ul li:nth-child(2):after {background-position:0 -46px} section.mypage .step_wrap ul li:nth-child(3):after {background-position:0 -92px} section.mypage .step_wrap ul li:nth-child(4):after {background-position:0 -138px} section.mypage .step_wrap ul li:nth-child(5):after {background-position:0 -184px} section.mypage .step_wrap ul li em {display:block; font-size:var(--F17); color:var(--gray900); line-height:20px} section.mypage .step_wrap ul li p {margin-top:18px; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L); text-align:left;} section.mypage .step_wrap ul li span {display:block; position:relative; padding-top:42px; font-size:var(--F13); color:var(--gray600);} section.mypage .step_wrap ul li span:after {position:absolute; top:15px; left:0; width:20px; height:1px; background-color:#d5d5d5; content:'';} section.mypage .step_wrap ul li:last-child {background-image:none;} section.mypage > .list_wrap {margin-top:50px;} section.mypage > .list_wrap li {position:relative; padding-left:12px; font-size:var(--F14); color:var(--gray600); line-height:var(--F14L); text-indent:0;} section.mypage > .list_wrap li:before {position:absolute; top:9px; left:0; width:3px; height:3px; background-color:var(--gray600); content:'';} section.mypage > .list_wrap h5 {margin-top:20px; margin-bottom:5px; color:var(--gray600); font-size:var(--F15); line-height:22px; font-weight:bold;} section.mypage .list_wrap {margin-top:80px;} section.mypage .list_wrap ul li {color:var(--gray600); line-height:20px;} section.mypage .list_wrap ul li a {border-bottom:1px solid #959595; color:var(--gray600);} section.mypage .list_wrap ul.bk {margin-top:35px;} section.mypage .list_wrap ul.bk li {color:var(--gray900);} section.mypage .list_wrap ul.bk + ul {margin-top:10px;} section.mypage .offline + .list_wrap {margin-top:20px;} section.mypage .btn_more {margin-top:40px; text-align:center;} section.mypage .btn_more .btn {display:inline-block; box-sizing:border-box; padding:0 50px; height:50px; font-size:var(--F14); line-height:48px; color:var(--gray600); border:1px solid var(--gray250); background:none;} section.mypage .btn_more .btn span:after {display:inline-block; width:22px; height:100%; vertical-align:middle; background:url(../images/ui/btn_down.svg) no-repeat right center/12px auto; content:'';} section.mypage .global_Shipping {margin-top:60px;} section.mypage .global_Shipping h3 {font-size:19px;} section.mypage .global_Shipping h3 small {margin-left:40px;} section.mypage .global_Shipping p {display:inline-block;margin-top:30px; width:48%;} section.mypage .global_Shipping p + p {margin-left:3%;} section.mypage .global_Shipping p .item {color:var(--gray600); margin-right:30px;} section.mypage .global_Shipping + .tit_outside {margin-top:100px !important;} /* 상품추가 슬라이드 */ section.mypage .slide_wrap {padding-bottom:75px; border-bottom:1px solid var(--gray800);} section.mypage .slide_wrap h3 {margin-top:56px; font-size:19px; line-height:26px;} section.mypage .slide_wrap .slider {margin-top:55px; padding:0 35px;} section.mypage .slide_wrap .slider:after {display:block; clear:both; content:"";} section.mypage .slide_wrap .slider .lSAction a {margin-left:-35px;} section.mypage .slide_wrap .slider .lSAction .lSNext {margin-right:-35px;} section.mypage .slide_wrap .slider .lSSlideWrapper {height:auto;} section.mypage .slide_wrap .slider li {float:left; width:170px;} section.mypage .slide_wrap .slider li .img {position:relative; margin-left:20px; width:110px;} section.mypage .slide_wrap .slider li .img a {overflow:hidden; position:absolute; top:0; right:0; width:40px; height:40px; background:url("../images/ui/bg_add.png") no-repeat 0 0; white-space:nowrap; text-indent:100%;} section.mypage .slide_wrap .slider li .img img {width:100%;} section.mypage .slide_wrap .slider li .info {margin-top:16px; padding-left:20px;} section.mypage .slide_wrap .slider li .info .brand, section.mypage .slide_wrap .slider li .info .name {display:block; overflow:hidden; height:20px; font-weight:bold; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L); white-space:nowrap; text-overflow:ellipsis;} section.mypage .slide_wrap .slider li .info .item {display:block; margin-top:10px; min-height:36px;} section.mypage .slide_wrap .slider li .info .item span {display:block; font-size:var(--F13); color:var(--gray600); line-height:18px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} /* 교환&반품신청 */ section.mypage .tit_wrap.check .vip {margin:20px 0 40px; padding:40px 0; color:var(--purple400); border-bottom:1px solid var(--gray250);} section.mypage .tit_wrap.check .vip h5 {display:inline-block; width:135px; height:44px; line-height:44px; vertical-align:top; font-size:25px;} section.mypage .tit_wrap.check .vip span {display:inline-block; line-height:22px;} section.mypage .info_wrap {border:0;} section.mypage .info_wrap h3 {margin-top:56px; font-size:19px; line-height:26px;} section.mypage .info_wrap img {margin-top:50px;} /* 교환&반품 내역 - 주소&제품 추가 */ section.mypage .shadow_box .grid_wrap.addr:before {display:block; clear:both; height:40px; content:"";} section.mypage .shadow_box .grid_wrap.addr {margin-left:-60px; width:calc(100% + 120px);} section.mypage .shadow_box .grid_wrap.addr td {padding:35px 0; text-indent:60px; border-top:2px solid var(--gray250) !important; border-bottom:2px solid var(--gray250);} section.mypage .shadow_box .grid_wrap.addr td strong {color:var(--gray800); font-size:var(--F17);} section.mypage .shadow_box .pay_info .goods, section.mypage .shadow_box .claim_info .goods {margin:-50px 0 0 170px; width:678px;} section.mypage .shadow_box .goods tr:first-child td {border-top:0 !important;} /* 주문상세 */ section.mypage .tit_order {height:22px; font-size:23px; color:var(--gray900); line-height:22px;} section.mypage .tit_order .delivery::before {content:''; display:inline-block; width:1px; height:12px; background:#ccc; position:absolute; left:-13px; top:0px;} section.mypage .tit_order .delivery {color:var(--gray600); font-size:var(--F13); position:relative; margin:0 20px;} section.mypage .tit_outside {margin:30px 0 0 !important; height:22px; font-size:19px !important; color:var(--gray900); font-weight:bold; line-height:22px;} section.mypage .tit_outside small {margin-left:30px;} section.mypage .tit_outside + .goods.grid_wrap {margin-top:10px;} section.mypage .gray_box {position:relative; margin-top:40px; padding:40px; background-color:#fafafa;} section.mypage .gray_box dl:after {display:block; clear:both; content:"";} section.mypage .gray_box dl + img {margin-top:50px;} section.mypage .gray_box dt {clear:both; float:left; width:75px; color:var(--gray600); line-height:30px;} section.mypage .gray_box dd {float:left; font-weight:bold; color:var(--gray900); line-height:30px;} section.mypage .gray_box dd span {display:inline-block; margin-right:15px; font-weight:normal} section.mypage .gray_box dd i.map_small {margin-left:5px;} section.mypage .gray_box > p.info_deliver {padding-left:36px; color:var(--purple400); font-size:var(--F17); background:url('../images/ui/exc_mark.png') no-repeat left top;} section.mypage .gray_box > p.info_deliver > span {display:block; line-height:27px;} section.mypage .gray_box > p.info_deliver > span em {font-weight:bold; } section.mypage .gray_box > p.info_deliver > small {display:block; line-height:27px; color:var(--gray600); font-size:14px} section.mypage .gray_box > p.info_deliver > small em {font-weight:bold;} section.mypage .gray_box > p.info_deliver > small + span {margin-top:18px;} /*#163678 : 착불배송*/ section.mypage .gray_box > p.info_deliver > span.highlight {color:var(--purple400);} section.mypage .gray_box > p.info_deliver > span.highlight + small {margin-top:5px; line-height:22px;} /*//#163678 : 착불배송*/ section.mypage .gray_box > a.btn {position:absolute; top:50%; padding:1px 0; width:108px; font-size:var(--F13); right:40px; margin-top:-18px; border-color:var(--gray250); background-color:#f7f7f7;} section.mypage .gray_box .change_area {display:none; position:absolute; bottom:-80px; left:0; width:calc(100% - 50px); padding-left:48px; border:1px solid var(--gray900); background-color:var(--white); z-index:2;} section.mypage .gray_box .hide {display:none; z-index:3;} section.mypage .gray_box .hide {overflow:hidden; position:absolute; bottom:-56px; right:25px; width:22px; height:22px; padding:6px; background:url(../images/ui/btn_x_gray.svg) no-repeat center center/18px 18px; white-space:nowrap; text-indent:999%;} section.mypage .gray_box.on .change_area, section.mypage .gray_box.on .hide {display:block;} section.mypage .gray_box .change_area em {display:inline-block; height:78px; margin-right:20px; line-height:78px;} section.mypage .gray_box .change_area label {height:34px; margin-right:30px; line-height:34px; vertical-align:middle;} section.mypage .gray_box .change_area .btn {vertical-align:middle; width:110px; height:30px; border-color:var(--gray250); background-color:var(--gray250); line-height:30px;} section.mypage .tit_wrap + .pay_info {padding-top:75px; border-top:1px solid var(--gray800);} section.mypage .pay_info, section.mypage .claim_info {padding-top:55px;} section.mypage .pay_info h3, section.mypage .claim_info h3 {font-size:19px; color:var(--gray900); line-height:26px;} section.mypage .pay_info .shadow_box {margin-top:25px; padding:50px 60px; border:1px solid var(--gray800); box-shadow:0px 7px 0px #e0e0e0;} section.mypage .pay_info .shadow_box:after {display:block; clear:both; content:"";} section.mypage .pay_info .shadow_box .cost {float:left; width:50%} section.mypage .pay_info .shadow_box .none {float:left; position:relative; width:50%;} section.mypage .pay_info .shadow_box .none img {width:auto; margin:178px 0 0 80px;} section.mypage .pay_info .shadow_box .detail {float:left; width:100%} section.mypage .pay_info .shadow_box .cost + .detail {float:left; width:50%} section.mypage .pay_info .shadow_box .cost dl {display:inline-block; padding-left:135px; min-height:87px; background:url("../images/ui/bg_pay.png?timestamp=20231116") no-repeat;}/*//#154220 : 결제수단_페이코추가*/ /* #210340:20230725 */ section.mypage .pay_info .shadow_box .cost dl.card {background-position:0 top;} section.mypage .pay_info .shadow_box .cost dl.cash {background-position:-400px top;} section.mypage .pay_info .shadow_box .cost dl.mobi {background-position:-800px top;} section.mypage .pay_info .shadow_box .cost dl.paypal {background-position:-1200px top;} section.mypage .pay_info .shadow_box .cost dl.union {background-position:-1600px top;} section.mypage .pay_info .shadow_box .cost dl.toss {background-position:-2000px top;} section.mypage .pay_info .shadow_box .cost dl.alipay {background-position:-2000px top;} section.mypage .pay_info .shadow_box .cost dl.kakaopay {background-position:-2400px top;} section.mypage .pay_info .shadow_box .cost dl.naverpay {background-position:-2800px top;}/* 결제수단_네이버페이추가*/ section.mypage .pay_info .shadow_box .cost dl.payco {background-position:-3200px top;}/* 결제수단_페이코추가*/ section.mypage .pay_info .shadow_box .cost dl .return {margin-top:30px; font-size:var(--F14);} section.mypage .pay_info .shadow_box .cost dl .return em {display:block; color:var(--gray800);} section.mypage .pay_info .shadow_box .cost dl .return span {margin-top:15px; line-height:18px; font-size:var(--F13);} section.mypage .pay_info .shadow_box dl dt { font-size:var(--F17); color:var(--gray800); line-height:18px;} section.mypage .pay_info .shadow_box dl dt small {float:right; width:180px; text-align:left; font-size:var(--F13); color:var(--gray600);} section.mypage .pay_info .shadow_box dl dt strong {display:block; margin-top:4px; font-size:var(--F14); color:var(--gray600); font-weight:bold; } section.mypage .pay_info .shadow_box dl dd {color:var(--gray600); line-height:24px; margin-top:8px;} section.mypage .pay_info .shadow_box dl dd a {padding:0 10px; font-size:var(--F13); line-height:28px; color:var(--gray800);} section.mypage .pay_info .shadow_box dl dt span, section.mypage .pay_info .shadow_box dl dd span {float:right; width:180px; color:var(--gray800); text-align:left;} section.mypage .pay_info .shadow_box dl .total {margin-top:20px;} section.mypage .pay_info .shadow_box dl .total span {font-size:23px; color:var(--purple400);} section.mypage .pay_info .shadow_box dl .total em {color:var(--purple400);} section.mypage .pay_info .shadow_box dl .promo {display:inline-block; max-width:150px; vertical-align:top; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.mypage .pay_info .shadow_box dl + dl {margin-top:40px; padding-top:40px; border-top:1px solid var(--gray250);} section.mypage .pay_info .shadow_box li {margin-top:8px;} section.mypage .pay_info .shadow_box li:first-child {margin-top:0;} section.mypage .pay_info .shadow_box li > span {display:inline-block; font-size:var(--F17); color:var(--gray800); line-height:28px;} section.mypage .pay_info .shadow_box li > span + span {float:right; /*width:180px;*/} section.mypage .pay_info .shadow_box li > span + .select {float:right;} section.mypage .pay_info .shadow_box li > span a {width:52px; height:14px; line-height:14px;} section.mypage .pay_info .shadow_box .swap dl dd {margin-top:0 !important; float:left; width:50%; height:36px; line-height:36px; color:var(--gray800); font-size:var(--F17);font-weight:bold;} section.mypage .pay_info .shadow_box .swap dl dd span {display:inline-block; width:250px; font-weight:normal} section.mypage .pay_info .shadow_box .swap.type_1 dl dd {float:none; width:100%;} section.mypage .pay_info .shadow_box .swap.type_1 dl dd span {width:580px;} section.mypage .pay_info .shadow_box + em.cssf {display:block; margin-top:24px; font-size:var(--F14);} section.mypage .pay_info + .submit {margin-top:95px;} section.mypage .claim_info .goods.grid_wrap td {color:var(--gray800); text-align:left;} section.mypage .claim_info .goods.grid_wrap tr:first-child td {border-top:0;} section.mypage .claim_info .goods.grid_wrap tr:last-child td {border-bottom:0;} section.mypage .claim_info .goods.grid_wrap td > span {display:block;} section.mypage .claim_info .goods.grid_wrap .info .name {margin-bottom:0;} section.mypage .claim_info .goods.grid_wrap .global {color:var(--gray800);} section.mypage .claim_info .goods.grid_wrap .global em{display:block;} /* 사은품 */ section.mypage .freebie {margin-top:45px; padding:40px 0 30px; border-bottom:1px solid #959595;} section.mypage .freebie h4 {margin-top:0 !important; line-height:18px !important;} section.mypage .freebie h4 small {margin-left:20px; color:var(--gray600); font-size:var(--F14); font-weight:normal;} section.mypage .freebie ul:after {display:block; clear:both; content:'';} section.mypage .freebie ul li {display:block; float:left; padding:30px 0; width:50%; height:132px; border-bottom:1px solid #f7f7f7;} section.mypage .freebie ul:last-child li {padding-bottom:0 !important; border-bottom:0 !important;} section.mypage .freebie ul li img {display:block; float:left; width:100px; height:132px;} section.mypage .freebie ul li .info {display:block; position:relative; float:left; padding:0 25px; width:280px; height:132px;} section.mypage .freebie ul li .info span {display:inline-block; max-height:44px; line-height:22px; font-size:var(--F14); overflow:hidden;} section.mypage .freebie ul li .info .txt-quantity {display:block; margin-top:12px; color:var(--gray600);} section.mypage .freebie ul li .info .btn {position:absolute; bottom:0; line-height:28px; font-size:var(--F13);} /* 클레임 */ section.mypage.claim h3 {color:var(--gray900); font-size:19px;} section.mypage.claim h3 small {margin-left:20px; color:var(--gray600); font-size:var(--F15); font-weight:normal;} section.mypage.claim .grid_wrap tr:first-child td {border-top:1px solid #b4b4b4 !important;} section.mypage.claim .grid_wrap tr td .info {max-width:240px;} section.mypage.claim .grid_wrap tr td .info .brand {line-height:var(--F14L); font-size:var(--F14);} section.mypage.claim .grid_wrap tr td .info .name {margin-bottom:8px; line-height:var(--F14L); font-size:var(--F14);} section.mypage.claim .grid_wrap tr td .info .option {line-height:20px; font-size:var(--F13); color:var(--gray600);} section.mypage.claim .grid_wrap tr td .info .price {display:inline-block; margin-top:8px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900); font-weight:bold;} section.mypage.claim .grid_wrap .service > span {display:inline-block; line-height:var(--F14L); font-size:var(--F14);} section.mypage.claim .grid_wrap .service > span em + em:before {content:'/';} section.mypage.claim .grid_wrap .service .group_discount {display:block; margin:8px 0;} section.mypage.claim .grid_wrap .caution {margin:8px 0; font-size:var(--F14); color:var(--purple400); font-weight:normal;} section.mypage.claim .grid_wrap p {font-size:var(--F14); word-break:keep-all;} section.mypage.claim .grid_wrap:not(.addr) td dl dt {width:90px; color:var(--gray800); font-size:var(--F14);} section.mypage.claim .grid_wrap:not(.addr) td dl dd {width:400px;} section.mypage.claim .grid_wrap:not(.addr) td dl dd:last-child {float:none;} section.mypage.claim .grid_wrap:not(.addr) td dl dd:last-child .select ~ .select {margin-left:0px; margin-top:10px;} section.mypage.claim .grid_wrap:not(.addr) td dl dd .select + .select {margin-left:5px;} section.mypage.claim .grid_wrap:not(.addr) td dl dd .select:nth-child(1n+3) {margin:5px 0 0 0;} section.mypage.claim .grid_wrap:not(.addr) td dl dd .select:nth-child(2n+4) {margin-left:5px;} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl {margin:20px; line-height:34px; text-align:left; vertical-align:top; color:var(--gray800); font-size:var(--F13);} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl .remote {margin:-5px 0 0 20px;} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl .tip {display:inline-block; margin-top:3px; width:20px; height:20px; vertical-align:top; background:url("../images/base/bg_base.png") #959595 no-repeat center -945px;} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl .tip + .box {display:none;} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl .tip:hover + .box {display:block;} section.mypage.claim .grid_wrap:not(.addr) td .review_ctrl .box {position:absolute; margin-top:-2px; margin-left:213px; padding:24px 30px; line-height:20px; color:var(--gray900); border:1px solid var(--gray250); background:var(--white); z-index:3;} section.mypage.claim .grid_wrap .defect {display:block; margin:0; padding:5px 20px 0;} section.mypage.claim .grid_wrap .defect ul {margin-top:8px;} section.mypage.claim .grid_wrap dl dd .select + textarea {width:478px; height:38px; box-sizing: content-box;} section.mypage.claim .grid_wrap tr td.cost {padding:30px 46px 70px 0; text-align:right; border-bottom:0;} section.mypage.claim .grid_wrap tr td.cost > span {line-height:36px; color:var(--gray900); font-size:var(--F17); font-weight:bold;} section.mypage.claim .grid_wrap tr td.cost > span em {font-weight:normal} section.mypage.claim .grid_wrap tr td.cost .select {margin:-4px 24px 0 20px;} section.mypage.claim .grid_wrap.addr {border-bottom:0;} section.mypage.claim .grid_wrap.addr td {padding:75px 0 60px;} section.mypage.claim .grid_wrap.refund tr:first-child td {padding-top:60px; border-top:0 !important; border-bottom:1px solid #b4b4b4;} section.mypage.claim .slide_wrap {border-bottom:0;} section.mypage.claim .slide_wrap .slider li {padding-bottom:44px;} section.mypage.claim .slide_wrap .slider li .img a {top:260px; right:18px; width:71px; height:28px; line-height:28px; text-align:center; color:var(--gray800); font-size:var(--F13); background:none; text-indent:0; border:1px solid var(--gray250);} section.mypage.claim .slide_wrap .slider.col4 li .img {width:170px;} section.mypage.claim .slide_wrap .slider.col4 li .img a {top:340px; right:48px;} section.mypage.claim .pay_info .shadow_box li > span:first-child {color:var(--gray600);} section.mypage.claim .pay_info .shadow_box li.total > span {line-height:42px; font-size:19px; color:var(--purple400) !important;} section.mypage.claim .pay_info .shadow_box li.total > span:first-child {color:var(--gray900) !important; font-weight:bold} section.mypage.claim .pay_info .shadow_box li.total > span em {color:var(--purple400);} section.mypage.claim .pay_info .shadow_box li .payment em + em:before {content:'+';} /*#188824 자사상품 배송비 정책 변경(s)*/ section.mypage.claim .pay_info .shadow_box .detail-info span {font-size:var(--F17); line-height:var(--F17L); color:var(--gray600);} section.mypage.claim .pay_info .shadow_box .detail-info .total {display:flex; justify-content:space-between} section.mypage.claim .pay_info .shadow_box .detail-info .total span {color:var(--gray900); font-weight:bold} section.mypage.claim .pay_info .shadow_box .detail-info .lists {margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid #d9d9d9} section.mypage.claim .pay_info .shadow_box .detail-info .lists li {display:flex; justify-content:space-between; margin-top:10px} section.mypage.claim .pay_info .shadow_box .detail-info>ul>li:last-child ul:last-child {margin-bottom:0; padding-bottom:0; border-bottom:none} /*#188824 자사상품 배송비 정책 변경(e)*/ /* 선물하기*/ section.mypage.claim .pay_box {position:relative; margin-top:60px; padding-bottom:59px; border-bottom:1px solid #b4b4b4;} section.mypage.claim .pay_box h3 {padding-bottom:7px;} section.mypage.claim .pay_box p {padding-top:14px; color:var(--gray600); line-height:20px; font-size:var(--F15);} section.mypage.claim .pay_box p.gift{color:var(--gray800);} section.mypage.claim .pay_box .quantity {display:inline-block; position:absolute; right:0; bottom:60px; height:36px; border:0 none; text-align:left;} section.mypage.claim .pay_box .quantity input[type=number] {padding:5px 15px; border:0 none; text-align:left; height:30px;} /* 선물하기*/ section.mypage.claim .pay_box .quantity a {display:inline-block; right:0; overflow:hidden; width:36px; height:36px; background:url("../images/ui/bg_quantity.png") no-repeat 0 0; white-space:nowrap; text-indent:100%;} section.mypage.claim .pay_box .quantity .minus {right:0; left:auto; background-position:-36px 0;} section.mypage.claim .pay_box .quantity .plus {right:40px; left:auto;} section.mypage.claim .pay_box .quantity .minus, section.mypage .grid_wrap dl dd .quantity .plus {height:36px;} section.mypage.claim .pay_info .gray_box {margin-top:5px; padding:40px;} section.mypage.claim .pay_info .gray_box small {line-height:30px; color:var(--gray600); font-size:var(--F15);} section.mypage.claim .pay_info .gray_box > span {display:block; margin-top:20px; color:var(--gray600); font-size:var(--F17);} section.mypage.claim .pay_info .gray_box > span em {margin-left:20px; color:var(--gray900); font-weight:bold;} section.mypage.claim .pay_info .gray_box > a.btn {background:var(--gray800); border-color:var(--gray800); color:var(--white);} section.mypage.claim .tit_wrap + .check_info {margin-top:0; padding-top:75px; border-top:1px solid var(--gray800);} section.mypage.claim .check_info {margin-top:80px; padding-bottom:80px; border-bottom:1px solid #b4b4b4;} section.mypage.claim .check_info h3 + dl {margin-top:40px;} section.mypage.claim .check_info dl {display:table; width:100%;} section.mypage.claim .check_info dl dt {display:table-cell; padding-left:50px; width:95px; height:60px; vertical-align:middle; line-height:30px; color:var(--purple400); font-size:23px; font-weight:bold; letter-spacing:-1px; background:url(../images/ui/bg_claim.png) no-repeat;} section.mypage.claim .check_info dl .box {background-position:left 12px;} section.mypage.claim .check_info dl .call {background-position:left -88px;} section.mypage.claim .check_info dl .vip {background-position:left -188px;} section.mypage.claim .check_info dl .review {background-position:left -288px;} section.mypage.claim .check_info dl dd {display:table-cell; padding-left:40px; height:60px; vertical-align:middle; color:var(--gray800); font-size:var(--F17);} section.mypage.claim .check_info dl dd span {margin-top:16px;} section.mypage.claim .check_info dl dd strong {color:var(--gray800);} section.mypage.claim .check_info dl + dl {margin-top:60px;} section.mypage.claim .check_info dl + span {margin-top:60px;} section.mypage.claim .check_info span {position:relative; display:block; padding-left:8px; color:var(--gray600); font-size:var(--F14); background:url() no-repeat ;} section.mypage.claim .check_info span:before {position:absolute; top:8px; left:0; width:3px; height:3px; background-color:var(--gray600); content:'';} section.mypage.claim .submit {margin:60px 0;} /* 최근 본 상품 */ section.mypage .count_tit {font-size: 19px; color: var(--gray900); line-height: 24px;} section.mypage .count_tit em { margin-left: 5px; } section.mypage .tabs .count_tit {margin-top: 50px;} section.mypage .count_tit span {display: inline-block;margin-left: 10px;font-size:var(--F15);color: var(--gray600);} section.mypage .count_tit .search-date {float: right;font-weight: normal;line-height: 30px;} section.mypage .count_tit .btn {display: inline-block;float: right;padding: 1px 20px;border-color: var(--gray800);background-color: var(--gray800);font-size:var(--F13);} section.mypage .count_tit .btn + .btn {margin-right: 5px; } section.mypage .count_tit + .info {margin: 22px 0 4px;color: var(--gray800);font-size:var(--F14);} section.mypage .count_tit .search-date .btn {width: auto;margin-left: 20px;padding: 5px 20px;background-color: var(--white);border-color: var(--gray900);font-size:var(--F15);color: var(--gray900);line-height: var(--F15LL);} section.mypage .count_tit .select {float: right;font-size:var(--F15);width: 90px;} section.mypage .count_tit .select label {width: auto !important;border: 0 none;color: var(--gray800);} section.mypage .count_tit + .form_wrap {margin-top: 36px;} section.mypage .list_none {display: block;padding: 150px 0;border-bottom: 0 none;font-size:var(--F17);color: var(--gray600);text-align: center;} section.mypage .list_goods {margin-top: 50px;} section.mypage .list_goods:after {display: block;clear: both;content: "";} section.mypage .list_goods li {float: left;width: 228px;} section.mypage .list_goods li:nth-child(4n+1) {clear: both;margin-left: 0;} section.mypage .list_goods li .img {position: relative;} section.mypage .list_goods li .img .del {overflow: hidden;position: absolute;top: 0;right: 0;width: 32px;height: 32px;background: var(--black) url("../images/ui/btn_x_white.svg") no-repeat center center/15px auto;white-space: nowrap;text-indent: 100%;} section.mypage .list_goods li .img .checkbox {position: absolute;top: 0;right: 0;} section.mypage .list_goods li .img .checkbox label {margin-right: 0;} section.mypage .list_goods li .img .checkbox label i {position: absolute;top: 0;right: 0;width: 30px;height: 30px;margin: 0;background: url("../images/ui/bg_chech_big.png") no-repeat 0 0;} section.mypage .list_goods li .img .checkbox > input[type=checkbox]:checked + label > i {background-position: 0 -30px;} section.mypage .list_goods li .img .mark_box {position: absolute;top: 50%;left: 50%;width: 100px;height: 36px;margin-top: -50px;margin-left: -50px;padding: 32px 0;text-align: center;} section.mypage .list_goods li .img .mark_box:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: var(--gray900);opacity: 0.7;content: '';} section.mypage .list_goods li .img .mark_box span {position: relative;font-size:var(--F14);color: var(--white);line-height: 18px;} section.mypage .list_goods li .img .del {display:none;} section.mypage .list_goods li:hover .img .del {display:block;} section.mypage .list_goods li .info {position:relative; height:auto; margin-bottom: 60px;} section.mypage .list_goods li .info .brand, section.mypage .list_goods li .info .name {display: block;font-size:var(--F13);color: var(--gray800);line-height: 18px;} section.mypage .list_goods li .info .brand {overflow: hidden;margin-top: 18px;white-space: nowrap;text-overflow: ellipsis;} section.mypage .list_goods li .info .name {overflow: hidden;max-height: 36px;margin-top: 5px;line-height: 18px;word-wrap: break-word;word-break: keep-all;} section.mypage .list_goods li .info .price {display: block;margin-top: 10px;font-weight: bold;color: var(--gray900);line-height: 18px;} section.mypage .list_goods li .info .price del {margin-left: 18px;font-size:var(--F13);color: var(--gray600);} section.mypage .list_goods li .info .price .sale {margin-left: 18px;color: var(--purple400);} section.mypage .list_goods li .info .price .sale.none {margin-left: 0;} section.mypage .list_goods li .info .score {display: block;margin-top: 25px;} section.mypage .list_goods li .info > .heart {position: absolute;bottom: 0;right: 0;} section.mypage .list_goods + .list_wrap, section.mypage .list_none + .list_wrap {margin-top: 0;padding-top: 35px;border-top: 1px solid var(--gray250);} section.mypage .banner {margin-top: 55px;} /* 매장구매내역 */ section.mypage .grid_wrap.goods.type_1 td {font-size:var(--F14); color:var(--gray800);} section.mypage .grid_wrap.goods.type_1 td span {display:block; overflow:hidden; /*max-width:260px;*/ white-space:nowrap; text-overflow:ellipsis;} section.mypage .grid_wrap.goods.type_1 td em {display:block; color:var(--gray600);} /* 멤버십 포인트 */ section.mypage .gray_box .point {display:table; width:100%; margin:30px 0;} section.mypage .gray_box .point .tit {display:table-cell; vertical-align:middle;} section.mypage .gray_box .point .tit h2 {font-size:27px; line-height:30px; font-weight:normal;} section.mypage .gray_box .point .num {display:table-cell; font-size:45px; color:var(--purple400); line-height:40px; text-align:right; vertical-align:middle;} section.mypage .gray_box .point .num button {width:20px; height:40px; vertical-align:top; background:url(../images/ui/btn_down_em.svg) no-repeat right center/20px auto; } section.mypage .gray_box .point .num button.on {background-image:url(../images/ui/btn_up_em.svg); } section.mypage .gray_box .point .num em {display:inline-block; line-height:40px; color:var(--purple400);} section.mypage .gray_box .point .txt {display:table-cell; font-size:27px; color:var(--gray600); line-height:30px; text-align:right; vertical-align:middle;} section.mypage .tbl_wrap {margin-top:25px;} section.mypage .tbl_wrap .tbl_tit span {display:inline-block; margin-left:30px; padding-top:10px; color:var(--gray800); line-height:20px; vertical-align:middle;} section.mypage .tbl_wrap .tbl_tit .check + span, section.mypage .tbl_wrap .tbl_tit .check + span + span {vertical-align:-2px;} section.mypage .tbl_wrap .tbl_tit span em {font-weight:bold;} section.mypage .tbl_wrap .tbl_tit .date {margin-left:0; color:var(--gray900);} section.mypage .tbl_wrap .tbl_tit .count {margin-left:0;} section.mypage .tbl_wrap .tbl_tit .btn {float:right;} section.mypage .tbl_wrap .grid_wrap {table-layout:fixed; margin-top:15px;} section.mypage .tbl_wrap .grid_wrap th {border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; color:var(--gray600);} section.mypage .tbl_wrap .grid_wrap td {border-bottom:1px solid var(--gray250); color:var(--gray900);} section.mypage .tbl_wrap .grid_wrap td span {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} section.mypage .tbl_wrap .grid_wrap td span em {color:var(--gray900);} section.mypage .tbl_wrap .grid_wrap td span.checkbox > label{height:24px;line-height:24px;} /* #211776:20230817 */ section.mypage .tbl_wrap .grid_wrap td.align-center {vertical-align:middle !important;} section.mypage .tbl_wrap .grid_wrap td.tit {text-align:left; line-height:18px;} section.mypage .tbl_wrap .grid_wrap td.tit .num {display:inline-block; color:var(--gray600);} section.mypage .tbl_wrap .grid_wrap td.tit a.num {padding-right:14px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/ auto 12px; background-size:6px auto; } section.mypage .tbl_wrap .grid_wrap td.tit .w370 {max-width:370px;} section.mypage .tbl_wrap .grid_wrap td.tit .purple {color:var(--purple400); font-weight:bold;} section.mypage .tbl_wrap .grid_wrap td.tit .btn.rnd {display:block; margin-top:12px} /* #185205 */ section.mypage .tbl_wrap .grid_wrap td.tit .btn.rect {display:block; margin-top:10px;} /* #195598 */ section.mypage .tbl_wrap .grid_wrap td.tit em, section.mypage .tbl_wrap .grid_wrap td p span {display:block; color:var(--gray600);} section.mypage .tbl_wrap .grid_wrap td p span.del {text-decoration:line-through;} section.mypage .tbl_wrap .grid_wrap td.none {padding:110px 0; font-size:var(--F15); color:var(--gray600); line-height:22px;} section.mypage .tbl_wrap .txt {margin-top:15px; line-height:20px; font-size:var(--F13); color:var(--gray600);} section.mypage .tbl_wrap .txt span {display:inline-block; width:110px; color:var(--gray600);} section.mypage .tbl_wrap .txt + .txt {margin-top:6px;} section.mypage .tbl_wrap.type_1 {margin-top:95px;} section.mypage .tbl_wrap.type_1 td {font-size:var(--F17);} section.mypage .tbl_wrap.type_2 {margin-top:60px;} section.mypage .tbl_wrap.type_2:first-child {margin-top:0;} section.mypage .tbl_wrap.type_2 td {font-size:var(--F15); line-height:20px;} section.mypage .tbl_wrap.type_2 .tbl_tit .check {margin-left:0;} section.mypage .tbl_wrap.type_2 .tbl_tit .check span {margin-left:0;} section.mypage .tbl_wrap.type_2 .grid_wrap td .quantity {position:relative; border:0 none;} section.mypage .tbl_wrap.type_2 .grid_wrap td .quantity span {display:inline-block; font-size:var(--F13); color:var(--gray600); line-height:36px; vertical-align:middle;} section.mypage .tbl_wrap.type_2 .grid_wrap td .quantity input {width:100px; height:36px; margin-right:45px; font-size:var(--F15); color:var(--gray900); line-height:36px; vertical-align:middle;} section.mypage .tbl_wrap.type_2 .grid_wrap td .quantity a {display:inline-block; overflow:hidden; position:relative; top:0; left:0; width:36px; height:36px; background:url("../images/ui/bg_quantity.png") no-repeat 0 0; white-space:nowrap; text-indent:100%; vertical-align:middle;} section.mypage .tbl_wrap.type_2 .grid_wrap td .quantity .minus {background-position:-36px 0} /* 수선 : 무료 수선 서비스 */ section.mypage .tbl_wrap.type_2 .grid_wrap td .detail {display:block; margin-top:17px; font-size:var(--F13); color:var(--gray600); line-height:15px;} section.mypage .tbl_wrap.type_2 .grid_wrap td.none .btn {width:120px; height:30px; margin-top:15px; line-height:26px;} section.mypage .tbl_wrap.type_2.all-group .tbl_tit {display:flex; align-items:center;} section.mypage .tbl_wrap.type_2.all-group .tbl_tit span {padding-top:0} section.mypage .purple-loast {position:relative; z-index:2;} section.mypage .purple-loast button {height:20px; width:10px; margin-left:7px; vertical-align:top; background:url(../images/ui/btn_down.svg) no-repeat right center/10px auto;} section.mypage .purple-loast.on button { background-image:url(../images/ui/btn_up.svg)} section.mypage .purple-loast ul {display:none; position:absolute; top:14px; left:100px; width:206px; margin-top:15px; padding:16px 20px; line-height:22px; font-size:var(--F14); background:#f7eeff; border:1px solid #f0e5fa;} section.mypage .purple-loast.on ul {display:block} section.mypage .purple-loast ul:after {display:block; content:''; position:absolute; top:-6px; left:30px; width:10px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} section.mypage .purple-loast ul li {display:flex; padding-bottom:8px; justify-content: space-between; line-height:18px; font-size:var(--F14);} section.mypage .purple-loast ul li:last-child {padding-bottom:2px;} section.mypage .gray_box .usable {display:none;} section.mypage .gray_box .usable.on {display:block;} section.mypage .gray_box .usable ul {padding-top:22px; border-top:1px solid var(--gray250);} section.mypage .gray_box .usable ul li {display:flex; justify-content: space-between; line-height:23px; font-size:18px; padding-bottom:18px;} section.mypage .gray_box .usable p {display:flex; justify-content: space-between; line-height:38px; padding:18px 0 0 23px; background:url(../images/base/bg_caution_gray_lite.png) no-repeat left 28px; border-top:1px solid var(--gray250);} section.mypage .gray_box .usable p .btn {background:none; border-color:var(--gray900);} section.mypage .gray_box dl.type_1 dt {width:160px; line-height:22px;} section.mypage .gray_box dl.type_1 dd {margin-bottom:17px; line-height:22px; font-weight:normal} section.mypage .gray_box dl.type_1 dd:after {display:block; clear:both; content:'';} section.mypage .gray_box dl.type_1 dd em {display:block; color:var(--gray600);} section.mypage .gray_box dl.type_1 dd:last-child {margin-bottom:0;} section.mypage .join_membership {margin:130px; line-height:24px; text-align:center; font-size:var(--F17);} section.mypage .join_membership .btn {margin-top:20px; padding:10px 40px;} /* 온/오프라인 쿠폰 */ section.mypage .offline {margin-top:60px;} section.mypage .offline:after {display:block; clear:both; content:" ";} section.mypage .offline h3 {color:var(--gray800); font-size:25px; line-height:36px;} section.mypage .offline > a {display:flex; align-items: center; float:left; margin-top:20px; margin-right:12px; padding:24px 30px; width:250px; height:149px; border:1px solid var(--gray250);} section.mypage .offline > a:nth-child(3n+1) {margin-right:0;} section.mypage .offline > a .coupon {color:var(--gray800); font-size:19px;width:100%;}/* #173083_2 수정 */ section.mypage .offline > a .coupon em {display:inline-block; line-height: 36px; margin:0 14px 8px 0; color:var(--gray900); font-size:31px; font-weight:bold; margin-top:3px;} section.mypage .offline > a .coupon span {display:block; line-height:var(--F14L); color:var(--gray600); font-size:var(--F14);} section.mypage .offline > a .coupon span.priceText {display:inline-block; color:var(--gray800); font-size:19px; font-weight:normal; line-height: 20px;} section.mypage .offline > a .coupon span.care {font-size:var(--F13);} section.mypage .offline > a .coupon i {display:block; margin:10px 0 14px 0; width:100%; height:1px; background-color: var(--gray200);} section.mypage .offline > span {display:block; margin-top:20px; color:var(--gray600); font-size:var(--F14);} section.mypage .offline .sms {display:inline-block; margin-top:28px; margin-left:145px; margin-bottom:8px; padding:35px 0 35px 115px; line-height:20px; background:url("../images/ui/bg_sms.png") no-repeat left center;} section.mypage .offline .number {display:inline-block; margin-top:28px; margin-left:116px; margin-bottom:8px; padding:35px 0 35px 140px; line-height:20px; background:url("../images/ui/bg_8s.png") no-repeat left center;} section.mypage .offline .null {margin-top:20px; line-height:166px;} section.mypage .offline .delay {display:block; clear:both; margin-top:20px; padding:50px 0; width:100%; line-height:22px; text-align:center; color:var(--gray600); font-size:var(--F15);} /* 누적금액 혜택 */ section.mypage .tbl_multi {margin-top:80px;} section.mypage .tbl_multi:after {display:block; clear:both; content:'';} section.mypage .tbl_multi h3 {font-size:25px; color:var(--gray800); line-height:36px; } section.mypage .tbl_multi .grid_wrap {float:left; width:450px; margin-top:20px; margin-right:60px;} section.mypage .tbl_multi .grid_wrap:last-child {margin-right:0;} section.mypage .tbl_multi .grid_wrap th {border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;} section.mypage .tbl_multi .grid_wrap td {border-bottom:1px solid var(--gray250); color:var(--gray900);} /* 나의 쿠폰 */ section.mypage .mycoupon_wrap ul {border-bottom:1px solid #959595;} section.mypage .mycoupon_wrap ul:after {display:block; clear:both; content:"";} section.mypage .mycoupon_wrap li {float:left; margin-left:26px; width:467px;} section.mypage .mycoupon_wrap li:nth-child(2n-1) {clear:both; margin-left:0} section.mypage .mycoupon_wrap li .coupon_box {position:relative; height:284px; padding:39px 30px 0; border:1px solid var(--gray250); box-sizing:border-box;} section.mypage .mycoupon_wrap li .coupon_box strong {display:block; font-size:37px; line-height:50px; font-weight:bold; color:var(--gray900);} section.mypage .mycoupon_wrap li .coupon_box strong span {margin-left:5px; font-weight:normal; font-size:var(--F21); line-height:40px; color:var(--gray900);} section.mypage .mycoupon_wrap li .coupon_box small {display:block; margin-top:7px; line-height:16px; font-size:var(--F15); color:var(--gray600);} section.mypage .mycoupon_wrap li .coupon_box p {margin-top:4px; font-size:var(--F17); color:var(--gray900); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;} section.mypage .mycoupon_wrap li .coupon_box small + p {margin-top:8px;} section.mypage .mycoupon_wrap li .coupon_box .date {position:absolute; left:30px; right:30px; bottom:79px; font-size:var(--F14); line-height: 1; color:var(--gray600);} section.mypage .mycoupon_wrap li .coupon_box .date .time {position:relative; padding-left: 17px; color:var(--gray600);} section.mypage .mycoupon_wrap li .coupon_box .date .time::before {content: ''; position:absolute; top:50%; left:8px; width:1px; height:10px; margin-top:-5px; background:var(--gray250);} section.mypage .mycoupon_wrap li .coupon_box .mark {position:absolute; top:0; right:0; width:130px; height:36px; line-height:36px; background-color:var(--gray250); color:var(--gray800); text-align:center;} section.mypage .mycoupon_wrap li .coupon_box .target {position:absolute; left:30px; right:30px; bottom:25px; padding-top:20px; border-top:1px solid var(--gray200);} section.mypage .mycoupon_wrap li .coupon_box .target em {font-size:var(--F14); line-height: 1; color:var(--gray800);} section.mypage .mycoupon_wrap li .coupon_box .target span {margin-left: 2px;} section.mypage .mycoupon_wrap li .coupon_box .target a {margin-left: 2px; color:var(--gray600);} section.mypage .mycoupon_wrap li .coupon_box .target a::after {content: ''; display: inline-block; margin: 2px 3px 0 4px; vertical-align: top; width:7px; height:9px; background: url(../images/ui/btn_next_gray.svg) no-repeat center center/ 7px auto;} section.mypage .mycoupon_wrap li .coupon_info {margin-bottom:53px; padding:21px 30px;} section.mypage .mycoupon_wrap li .coupon_info span {display:block; font-size:var(--F14); color:var(--gray600); line-height:24px;} section.mypage .mycoupon_wrap li.null {padding:200px 0; width:100%; line-height:50px;} section.mypage .mycoupon_wrap li.null span {display:block;} /* 나의 쿠폰 - 상세 */ section.mypage .mycoupon_detail > div {padding: 30px 30px 23px; border: 1px solid var(--gray250); box-sizing: border-box; border-radius:var(--radius);} section.mypage .mycoupon_detail > div > strong {display: block; margin-bottom: 21px; font-size: 19px; font-weight: bold; color: var(--gray900);} section.mypage .mycoupon_detail > div ul li {display:flex; flex-flow:wrap;} section.mypage .mycoupon_detail > div ul li ~ li {margin-top: 15px;} section.mypage .mycoupon_detail > div ul li em {width: 72px; font-size:var(--F15); line-height: 18px; color: var(--gray800);} section.mypage .mycoupon_detail > div ul li p {width: calc(100% - 72px); font-size:var(--F15); line-height: 17px; color: var(--gray900);} section.mypage .mycoupon_detail > div ul li p strong {display: block; margin-bottom: 6px; font-weight: bold; color: var(--gray900);} section.mypage .mycoupon_detail > div ul li p span {display: block; line-height: 1.7; color: var(--gray900);} section.mypage .mycoupon_detail > ul li {position: relative; margin-top: 11px; padding-left: 10px; font-size:var(--F14); line-height: 1; color: var(--gray600);} section.mypage .mycoupon_detail > ul li::before {position: absolute; top: 50%; left: 0; width: 2px; height: 2px; margin-top: -1px; background: var(--gray600); content: '';} section.mypage .mycoupon_detail ~ .list_Wrap {margin-top: 81px;} section.mypage .list_Wrap h1 {padding-bottom:13px; line-height:35px; font-size:27px; font-weight:bold; color:var(--gray900); border-bottom:2px solid var(--gray900); text-align:left} section.mypage .list_Wrap h1 span {display:inline-block; margin-left:6px; line-height:35px; font-size:27px; font-weight:bold; color:var(--purple400);} /* 수선 : 수선신청 */ section.mypage .order.form_wrap + .line_info {margin:0;} section.mypage .line_info {border-top:1px solid var(--gray800);} section.mypage .page + .line_info {margin-top:50px;} section.mypage .line_info .inner {padding-top:60px;} section.mypage .line_info .inner + .inner {border-top:1px solid #d5d5d5;} section.mypage .line_info .inner h2 {margin-bottom:35px; font-size:19px; color:var(--gray900); line-height:20px;} section.mypage .line_info .inner .sub_tit {display:table; width:100%; padding-bottom:20px;} section.mypage .line_info .inner .sub_tit span {display:table-cell; color:var(--gray800); line-height:20px; vertical-align:middle;} section.mypage .line_info .inner .sub_tit .left {text-align:left;} section.mypage .line_info .inner .sub_tit .right {text-align:right;} section.mypage .line_info .inner .sub_tit .right .btn {font-size:var(--F13); height:30px; line-height:28px;} section.mypage .line_info .inner .sub_tit .btn { vertical-align:middle;} section.mypage .line_info.type_1 {border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} section.mypage .line_info.type_1 .left_cell {color:var(--gray600);} section.mypage .line_info.type_2 {margin:0; padding-bottom:0;} section.mypage .line_info.type_2 .inner .left {color:var(--gray600);} section.mypage .line_info.type_2 .txt {display:block; padding-top:20px; color:var(--gray600); line-height:18px;} section.mypage .line_info.type_2 .txt a {color:var(--gray800);} section.mypage .line_info.type_2 .inner + .txt {margin-top:40px; border-top:1px solid var(--gray250);} section.mypage .line_info.type_2 .inner h3 {font-size:19px; line-height:28px;} section.mypage .line_info.type_2 table {width:100%;} section.mypage .line_info.type_2 table td {padding:40px 0; border-bottom:1px solid var(--gray250);} section.mypage .line_info.type_2 table td.num {font-size:19px; color:var(--gray600); text-align:center;} section.mypage .line_info.type_2 table td .base {display:table; position:relative;} section.mypage .line_info.type_2 table td .base img {display:table-cell; margin-right:18px; width:100px; max-width:none; vertical-align:middle; border:1px solid #d4d4d4;} section.mypage .line_info.type_2 table td .base .info {display:table-cell; padding-right:10px; width:100%; max-width:350px; text-align:left; overflow:hidden; vertical-align:middle;} section.mypage .line_info.type_2 table td .base .info strong {display:block; margin-bottom:24px; font-size:var(--F17); color:var(--gray900); line-height:14px;} section.mypage .line_info.type_2 table td .base .info .brand, section.mypage .line_info.type_2 table td .base .info .name, section.mypage .line_info.type_2 table td .base .info .option {display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} section.mypage .line_info.type_2 table td .base .info .brand, section.mypage .line_info.type_2 table td .base .info .name {line-height:20px; color:var(--gray900); font-size:var(--F15);} section.mypage .line_info.type_2 table td .base .info .name {margin-bottom:15px;} section.mypage .line_info.type_2 table td .base .info .option {line-height:18px; font-size:var(--F14); color:var(--gray600);} section.mypage .line_info.type_2 table td .base .info a.btn {margin-top:14px; padding:0; width:72px; font-size:var(--F13);} section.mypage .line_info.type_2 table td .base .btn {position:absolute; top:50%; right:0; margin-top:-15px; width:120px; } section.mypage .line_info.type_2 table td .extend {margin:40px 0;} section.mypage .line_info.type_2 table td .extend:after {display:block; clear:both; content:'';} section.mypage .line_info.type_2 table td .extend dl {float:left; margin-left:40px;} section.mypage .line_info.type_2 table td .extend dl:first-child {margin-left:0;} section.mypage .line_info.type_2 table td .extend dl:after {display:block; clear:both; content:'';} section.mypage .line_info.type_2 table td .extend dl dt {font-size:var(--F14); color:var(--gray800);} section.mypage .line_info.type_2 table td .extend dl dd {float:left; margin-top:10px; margin-left:10px; width:100px; height:132px; background:url("../images/ui/img_add.png") var(--white) no-repeat center center; border:1px solid #d4d4d4;} section.mypage .line_info.type_2 table td .extend dl dd a {display:block; height:100%;} section.mypage .line_info.type_2 table td .extend dl dd img {width:100%; height:100%; background:none;} section.mypage .line_info.type_2 table td .extend dl dt + dd {margin-left:0;} section.mypage .line_info.type_2 table td .state {display:block; padding-top:40px; border-top:1px solid var(--gray250);} section.mypage .line_info.type_2 table td .state span {display:inline-block; width:150px; font-size:var(--F14); color:var(--gray600); line-height:14px;} section.mypage .line_info.type_2 table td .state span em {color:var(--gray800);} section.mypage .line_info.type_2 table td .state a {display:inline-block; padding-right:16px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/ auto 12px; font-size:var(--F15); color:var(--gray600);} section.mypage .repair_step .tabs > div {padding-top:55px;} section.mypage .repair_step .tabs .tab li {width:50%;} section.mypage .repair_step .tabs ol li {margin-top:30px;} section.mypage .repair_step .tabs ol li:first-child {margin-top:0;} section.mypage .repair_step .tabs ol li em {display:block; font-size:var(--F15); color:var(--gray900); line-height:22px;} section.mypage .repair_step .tabs ol li p {margin-top:10px; font-size:var(--F14); color:var(--gray800); line-height:22px;} section.mypage .repair_step .tabs ol li .img {display:inline-block; padding:15px 20px;} section.mypage .repair_step .tabs ol li .img img {width:auto;} /* 수선 : 상품목록조회 */ section.mypage .count_tit + .list_wrap {margin-top:30px;} section.mypage .form_wrap .item {vertical-align:top; cursor:default;} section.mypage .form_wrap textarea {width: calc(100% - 22px); padding:10px; height:72px !important;} section.mypage .form_wrap .checkbox > label {min-width:100px;} section.mypage .form_wrap .file_box {display:flex; flex-wrap: wrap; width:820px;} section.mypage .form_wrap .file_box input[type="text"] {width:688px;} section.mypage .form_wrap .file_box button {float:left; width:120px; height:36px; margin-left:10px; background-color:var(--white); border:1px solid var(--gray250);} section.mypage .form_wrap .file_box .desc {clear:both; width:100%; } section.mypage .form_wrap .file_box ul {line-height:20px; margin-top:5px;} section.mypage .form_wrap .file_box ul li {display:inline-block; margin-left:10px;} section.mypage .form_wrap .file_box ul li:first-child {margin-left:0;} section.mypage .form_wrap .file_box ul li em {display:inline-block; margin-right:4px; font-weight:bold; font-size:var(--F14); color:var(--gray800); vertical-align:0;} section.mypage .form_wrap.type_1 {margin-top:25px; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;} section.mypage .form_wrap.type_1 .item {font-weight:bold; color:var(--gray800);} section.mypage .form_wrap.type_2 {padding:40px 0; border-top:1px solid #d5d5d5;} section.mypage .submit + .form_wrap {margin-top:40px;} section.mypage .order.form_wrap {margin-top:60px; padding:50px 0; border-top:1px solid var(--gray900); border-bottom:1px solid var(--gray250);} section.mypage .order.form_wrap + .order.form_wrap {margin-top:0; border:0 none;} section.mypage .order.form_wrap.last {border-color:var(--gray900);} section.mypage .order.form_wrap .form_tit {width:540px; font-weight:bold; font-size:19px; color:var(--gray900); line-height:30px;} section.mypage .order.form_wrap .form_tit .check_txt, section.mypage .order.form_wrap .form_tit .checkbox {position:relative; float:right; padding-left:14px; font-size:var(--F14); color:var(--gray600); line-height:30px;} section.mypage .order.form_wrap .form_tit .check_txt:after {position:absolute; top:14px; left:0; width:4px; height:4px; background-color:var(--purple400); border-radius:3px; content:'';} section.mypage .order.form_wrap .form_tit .btn {float:right; width:100px; height:30px; font-size:var(--F13); line-height:28px; font-weight:normal} section.mypage .order.form_wrap + .form_wrap {margin-top:45px;} section.mypage .order.form_wrap > ul {margin-top:20px; width:540px; font-size:var(--F15);} section.mypage .order.form_wrap > ul > li .item {vertical-align:top;} section.mypage .order.form_wrap > ul > li .input_box + a.btn {margin-left:28px; width:95px; vertical-align:top;} /* 수선 : 수선안내 */ section.mypage .date_wrap + .repair_tab {margin-top:40px;} section.mypage .tabs.repair_tab .tab li {width:33.33%;} section.mypage .tabs.repair_tab > div {padding-top:55px;} section.mypage .tabs.repair_tab .search_wrap .remote_wrap {margin-top:28px;} section.mypage .tabs.repair_tab .search_wrap .input_box {display:inline-block; width:300px; margin-right:35px; vertical-align:top;} section.mypage .tabs.repair_tab .search_wrap .btn {width:96px; vertical-align:top;} section.mypage .tabs.repair_tab .tbl_repair {width:100%; margin-top:35px; text-align:center;} section.mypage .tabs.repair_tab .tbl_repair th {padding:20px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; font-size:var(--F13); color:var(--gray600);} section.mypage .tabs.repair_tab .tbl_repair td {padding:20px 0; border-bottom:1px solid var(--gray250); font-size:var(--F13); color:var(--gray900); vertical-align:middle;} section.mypage .tabs.repair_tab .tbl_repair td .btn {width:120px; height:30px; line-height:28px; font-size:var(--F13);} section.mypage .tabs.repair_tab .tbl_repair td.none {padding:75px 0; font-size:var(--F14); color:var(--gray600); line-height:22px;} section.mypage .tabs.repair_tab .tbl_repair + .list_wrap {margin-top:30px;} section.mypage .tabs.repair_tab .line_info .repair_img {padding:50px 0; text-align:center;} section.mypage .tabs.repair_tab .line_info .repair_img img {width:auto;} section.mypage .tabs.repair_tab .line_info ol {padding-bottom:50px;} section.mypage .tabs.repair_tab .line_info ol li {margin-top:25px;} section.mypage .tabs.repair_tab .line_info ol li:first-child {margin-top:0;} section.mypage .tabs.repair_tab .line_info ol li span {display:block; color:var(--gray800);} section.mypage .tabs.repair_tab .line_info ol li p {margin-top:15px; padding-left:10px; color:var(--gray600); line-height:22px;} section.mypage .as_box {margin-top:45px;} section.mypage .as_box h2 {font-size:19px; color:var(--gray900); line-height:45px;} section.mypage .as_box .sub_tit {height:30px; padding:20px 0; color:var(--gray800); line-height:30px;} section.mypage .as_box .sub_tit .btn {float:right; width:128px; height:28px; padding:0; line-height:28px; font-size:var(--F13);} section.mypage .as_box .accordion li .title {font-size:var(--F17); line-height:28px; padding:26px 0; background-position:right -275px;} section.mypage .as_box .accordion li .title.on {background-position:right -325px;} section.mypage .as_box .accordion li .content {padding:0; margin-bottom:30px; background-color:var(--white);} section.mypage .as_box .accordion li .content .list_wrap {margin-top:0;} section.mypage .as_box .accordion li .content .list_wrap li {color:var(--gray800);} section.mypage .as_box .accordion li .content .point {color:var(--purple400);} section.mypage .as_box .accordion li .content .txt {font-size:var(--F14); color:var(--gray800); line-height:22px;} section.mypage .as_box .accordion li .content .txt:first-child {margin-top:0;} section.mypage .as_box .accordion li .content table {margin:30px 0; width:100%;} section.mypage .as_box .accordion li .content table th {padding:17px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;font-size:var(--F13); color:var(--gray600); text-align:center;} section.mypage .as_box .accordion li .content table td {padding:10px 0; border-bottom:1px solid var(--gray250); font-size:var(--F13); color:var(--gray600); text-align:center;} section.mypage .as_box .accordion li .content table td.bl {border-left:1px solid var(--gray250);} section.mypage .as_flow {display:flex; flex-wrap: wrap; flex-direction: row; } section.mypage .as_flow dt {width:110px; letter-spacing:-2px; margin-right:60px; font-weight:bold; font-size:19px; color:var(--gray600); text-align:center; line-height:30px;} section.mypage .as_flow dt:not(:nth-last-child(2)) {min-height:90px; background:url(../images/ui/btn_down.svg) no-repeat 50% 57px/18px auto;} section.mypage .as_flow dd {width:calc(100% - 170px);} section.mypage .as_flow dd li {position:relative; padding-left:15px; line-height:20px;} section.mypage .as_flow dd li span {position:absolute; left:0; top:0; width:15px; } section.mypage .submit .btn {border-color:var(--gray900);} /* 상품리뷰 */ section.mypage .tabs .count_tit + .grid_wrap.goods th {text-align:center; } section.mypage .tabs .purple_coin {margin-top:50px;} section.mypage .tabs .purple_coin div {display:inline-block; padding:15px 0; height:64px;} section.mypage .tabs .purple_coin div h4 {color:var(--gray900); font-size:var(--F17); font-weight:normal; } section.mypage .tabs .purple_coin div span {display:block; margin-top:10px; line-height:20px; color:var(--gray600); font-size:var(--F13);} section.mypage .tabs .purple_coin dl {display:block; float:right;} section.mypage .tabs .purple_coin dl dd {display:inline-block; width:130px; line-height:var(--F14L); text-align:center; font-size:var(--F14);} section.mypage .tabs .purple_coin dl dd img {display:block; margin:0 auto 10px; width:44px;} section.mypage .tabs .purple_coin dl dd em {display:block; color:var(--purple400); font-size:var(--F16);} /* 1:1문의(상세) */ section.mypage .form_wrap .info {display:table-cell; padding:6px 0; border-bottom:1px solid var(--gray250); line-height:22px;} section.mypage .form_wrap .info.no_line {border:0 none;} section.mypage .form_wrap .info.no_line .img {display:inline-block; position:relative;} section.mypage .form_wrap .info.no_line .img .delete {position:absolute; top:0; right:0; width:32px; height:32px; font-size:0; background:var(--black) url(../images/ui/btn_x_white.svg) no-repeat center center/15px auto; z-index:3;} section.mypage .form_wrap .btn_center {margin-top:40px; text-align:center;} section.mypage .form_wrap .btn_center .btn {width:110px; } section.mypage .grid_wrap + .cmt_wrap {margin-top:-1px;} section.mypage .cmt_wrap {margin-top:60px;} section.mypage .cmt_wrap > ul > li {display:table; table-layout:fixed; width:100%; border-top:1px solid #d5d5d5;} section.mypage .cmt_wrap > ul > li:first-child {border:0 none;} section.mypage .cmt_wrap > ul > li .item {display:table-cell; padding-top:45px; width:140px; font-weight:bold; color:var(--purple400); line-height:22px; vertical-align:top;} section.mypage .cmt_wrap > ul > li .info {display:table-cell; padding:45px 0;} section.mypage .cmt_wrap > ul > li .info .cmt {font-size:var(--F14); line-height:22px;} section.mypage .cmt_wrap > ul > li .info .cmt p {color:var(--gray800);} section.mypage .cmt_wrap > ul > li .info .cmt .date {display:block; margin-top:10px; color:var(--gray600);} section.mypage .cmt_wrap > ul > li .info .survey {display:table; width:100%; margin-top:30px; padding-top:30px; border-top:1px solid var(--gray250);} section.mypage .cmt_wrap > ul > li .info .survey .txt {display:table-cell; width:180px; color:var(--gray600); padding-top:30px;} section.mypage .cmt_wrap > ul > li .info .survey .list {padding-top:30px;} section.mypage .cmt_wrap > ul > li .info .survey .list .radio {display:inline-block; margin-bottom:10px;} section.mypage .cmt_wrap > ul > li .info .survey .list .radio label {margin-right:30px; font-size:var(--F14); color:var(--gray800);} section.mypage .cmt_wrap > ul > li .info .survey .list .input_box {display:inline-block; width:500px; vertical-align:top;} section.mypage .cmt_wrap > ul > li .info .survey .list .input_box input {padding:2px 0; margin-top:0; font-size:var(--F13);} section.mypage .cmt_wrap > ul > li .info .survey .list .btn {width:110px; height:30px; margin:0 0 0 10px; padding:3px 20px; font-size:var(--F13); line-height:var(--F13LL); vertical-align:top;} /* 아이디 변경, 비밀번호 변경 */ section.mypage .form_wrap.center {padding-top:50px; text-align:center;} section.mypage .form_wrap.center .sub_txt {display:block; font-size:var(--F17); color:var(--gray900); line-height:28px;} section.mypage .form_wrap.center .input_box {display:inline-block; width:350px; margin-top:26px;}/*//#141828 : 회원가입 재구성*/ section.mypage .form_wrap.center ul {display:inline-block; margin-top:26px; width:500px;} section.mypage .form_wrap.center ul li .item {width:120px; text-align:left;} section.mypage .form_wrap.center ul li .input_box {margin-top:0; width:380px;} section.mypage .form_wrap.center ul li .input_box .skills {top:0; margin-top:3px;} section.mypage .form_wrap.center ul li .txt {text-align:left;} section.mypage .gray_box dl.coupon {margin-top:20px; padding-left:84px; background:url("../images/ui/bg_coupon.png") no-repeat 0 50%; font-size:var(--F14);} section.mypage .gray_box dl.coupon dt {width:60px; line-height:22px;} section.mypage .gray_box dl.coupon dd {line-height:22px;} section.mypage .tabs.grade .tab li {width:50%;} section.mypage .grade .info {padding:60px 0;} section.mypage .grade .info h2 {font-weight:normal; font-size:27px; color:var(--gray900); line-height:36px;} section.mypage .grade .info h2 em {display:inline-block; font-weight:bold; font-size:38px; line-height:36px;} section.mypage .grade .info .grade_box {margin-top:40px;} section.mypage .grade .info .grade_box.n3 {position:relative;} section.mypage .grade .info .grade_box:after {display:block; clear:both; content:'';} section.mypage .grade .info .grade_box > div {float:left; width:398px; height:120px; margin-left:4px; padding:35px 40px; background-color:var(--gray150);} section.mypage .grade .info .grade_box > div:first-child {margin-left:0;} section.mypage .grade .info .grade_box > div h3 {overflow:hidden; font-weight:bold; font-size:37px; color:var(--gray900); line-height:42px; white-space:nowrap; text-overflow:ellipsis;} section.mypage .grade .info .grade_box > div span {display:block; margin-top:15px; font-size:var(--F17); color:var(--gray800); line-height:14px;} section.mypage .grade .info .grade_box > div p {margin-top:15px; font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} section.mypage .grade .info .grade_box.n3 > div {width:237px;} section.mypage .grade .info .grade_box > div .balloon {display:block !important; position:absolute; top:165px; padding:12px 17px; text-align:left; background-color:var(--purple400); font-size:var(--F13); color:var(--white); line-height:18px;} section.mypage .grade .info .grade_box > div .balloon:after {position:absolute; top:-7px; left:20px; width:14px; height:7px; background:url('../images/ui/bg_balloon02.gif') no-repeat center top; content:'';} section.mypage .grade .info .grade_box.on > div .balloon {display:block;} section.mypage .grade .info .list_wrap {margin-top:40px;} section.mypage .grade .grade_list {padding-top:60px; border-top:1px solid var(--gray800);} section.mypage .grade .grade_list h4 {position:relative; font-weight:bold; font-size:19px; color:var(--gray900); line-height:16px;} section.mypage .grade .grade_list h4 .btn {position:absolute; top:-7px; right:0; height:18px; line-height:18px;} section.mypage .grade .grade_list > ul > li {display:table; width:100%; margin-top:60px;} section.mypage .grade .grade_list > ul > li:first-child {margin-top:40px;} section.mypage .grade .grade_list > ul > li .tit {display:table-cell; width:164px; text-align:center; vertical-align:middle;} section.mypage .grade .grade_list > ul > li .tit span {display:inline-block; position:relative; padding-left:54px; font-weight:bold; font-size:27px; color:var(--purple400); line-height:32px; text-align:left;} section.mypage .grade .grade_list > ul > li .tit span:after {position:absolute; top:50%; left:0; height:40px; margin-top:-20px; background:url("../images/ui/bg_grade_benefit.png") no-repeat 0 0; content:'';} section.mypage .grade .grade_list > ul > li .tit .gift:after {width:41px; background-position:0 0;} section.mypage .grade .grade_list > ul > li .tit .as:after {width:41px; background-position:0 -40px;} section.mypage .grade .grade_list > ul > li .tit .txt {padding-left:0;} section.mypage .grade .grade_list > ul > li .tit .vip:after {width:41px; background-position:0 -80px;} section.mypage .grade .grade_list > ul > li .tit .point:after {width:41px; background-position:0 -120px;} section.mypage .grade .grade_list > ul > li .tit .percent:after {width:41px; background-position:0 -160px;} section.mypage .grade .grade_list > ul > li .tit .coin:after {width:41px; background-position:0 -200px;} section.mypage .grade .grade_list > ul > li .tit .feeting:after {width:41px; background-position:0 -240px;} section.mypage .grade .grade_list > ul > li.coupon .tit {vertical-align:top;} section.mypage .grade .grade_list > ul > li.coupon dl {vertical-align:top;} section.mypage .grade .grade_list > ul > li dl {display:table-cell; padding-left:40px; vertical-align:middle;} section.mypage .grade .grade_list > ul > li dl dt {position:relative; font-size:19px; color:var(--gray800); line-height:24px; font-weight:bold;} section.mypage .grade .grade_list > ul > li dl dt + dt {margin-top:10px; font-weight:normal;} section.mypage .grade .grade_list > ul > li dl dt .btn {position:absolute; top:-7px; right:0; height:18px; font-size:var(--F13); color:var(--gray800); line-height:18px;} section.mypage .grade .grade_list > ul > li dl dd {position:relative; padding-left:10px; font-size:var(--F14); color:var(--gray600); line-height:22px;} section.mypage .grade .grade_list > ul > li dl dd:before {position:absolute; top:9px; left:0; width:3px; height:3px; background-color:var(--gray600); content:'';} section.mypage .grade .grade_list > ul > li dl dd.none {padding-left:0;} section.mypage .grade .grade_list > ul > li dl dd.none:before {display:none;} section.mypage .grade .grade_list > ul > li dl dd span {display:block; color:var(--gray600);} section.mypage .grade .grade_list > ul > li dl dd i.fit {display:inline-block; padding:0 10px; line-height:17px; color:#50506e; font-size:var(--F12); border:1px solid #50506e;} section.mypage .grade .grade_list > ul > li dl dt + dd {margin-top:15px;} section.mypage .grade .grade_list > ul > li dl dd ol li {font-size:var(--F14); color:var(--gray600); line-height:22px;} section.mypage .grade .grade_list > ul > li dl dd ul li {position:relative; padding-left:10px; font-size:var(--F14); color:var(--gray600); line-height:22px;} section.mypage .grade .grade_list > ul > li dl dd ul li:before {position:absolute; top:0; left:0; content:'-';} section.mypage .grade .grade_list > ul > li dl dd table {width:100%; margin-top:15px;} section.mypage .grade .grade_list > ul > li dl dd table th {padding:13px; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250); font-size:var(--F13); color:var(--gray600); text-align:center;} section.mypage .grade .grade_list > ul > li dl dd table td {padding:15px; border-bottom:1px solid var(--gray250); font-size:var(--F14); color:var(--gray600); text-align:center;} section.mypage .grade .grade_list > ul > li dl dd table th:first-child, section.mypage .grade .grade_list > ul > li dl dd table td:first-child {padding:15px 0;} section.mypage .grade .grade_list > ul > li dl dd table + span {margin-top:17px;} section.mypage .grade .grade_list > ul > li dl dd.half_tbl:after {display:block; clear:both; content:'';} section.mypage .grade .grade_list > ul > li dl dd.half_tbl table {float:left; width:353px; margin:15px 20px 15px 0; box-sizing:border-box;} section.mypage .grade .grade_list > ul > li dl dd.half_tbl table + table {margin:15px 0 15px 20px;} section.mypage .grade .grade_list > ul > li dl dd.half_tbl table tr:first-child td {border-top:1px solid var(--gray250);} section.mypage .grade .grade_list > ul > li dl dd.half_tbl table td {padding-left:0; text-align:left;} section.mypage .newly > ul {font-size:0;} section.mypage .newly > ul > li {display:inline-block; width:20%; height:190px; text-align:center; vertical-align:top; font-size:var(--F14); border:1px solid var(--gray200); box-sizing:border-box;} section.mypage .newly > ul > li + li {border-left:0;} section.mypage .newly > ul > li:nth-child(1n+6) {border-top:0;} section.mypage .newly > ul > li:nth-child(5n+6) {border-left:1px solid var(--gray200) !important;} section.mypage .newly > ul > li > i {display:block; margin:40px auto 12px; width:64px; height:64px; background-color:rgba(196, 135, 252, .2);; border-radius:50%;} section.mypage .newly > ul > li > a {display:inline-block; color:#8e8e8e; font-size:var(--F12); font-family:"SSF_Bold", "NotoSans_kr_Medium";} section.mypage .benefits {margin-top:40px;} section.mypage .benefits > p {text-align:center; height:10px; border-bottom:1px solid var(--gray200);} section.mypage .benefits > p > .remote {margin-top:10px; padding:6px 30px 6px 15px; line-height:10px; color:var(--gray900); font-size:var(--F13); background:url(../images/ui/btn_down_gray.svg) var(--white) right 10px / 12px auto no-repeat;} section.mypage .benefits > p > .remote.on { background-image:url(../images/ui/btn_up_gray.svg)} section.mypage .benefits .gray_box {line-height:24px; color:var(--gray800); font-size:var(--F13);} section.mypage .benefits .gray_box h5 {color:var(--gray900); font-size:var(--F14);} section.mypage .benefits .gray_box ul {margin-top:7px;} section.mypage .benefits .gray_box ul + h5 {margin-top:20px;} section.mypage .benefits .gray_box ul ol {padding-left:20px;} section.mypage .benefits .gray_box ul table {margin:5px 0 15px; width:100%;} section.mypage .benefits .gray_box ul table th, section.mypage .benefits .gray_box ul table td {padding:5px 10px; border:1px solid var(--gray200); background-color:var(--white);} /* 회원탈퇴 */ section.mypage.quit .message {color:var(--gray900); font-size:var(--F17); padding-bottom:50px; border-bottom:1px solid var(--gray900);} section.mypage.quit h4 {margin-top:50px; font-size:19px; line-height:28px;} section.mypage.quit .point {padding-bottom:40px; border-bottom:1px solid var(--gray250);} section.mypage.quit .point:after {display:block; clear:both; content:'';} section.mypage.quit .point > div {float:left; margin-right:80px; font-size:33px;} section.mypage.quit .point > div.trisection {margin-right:0; width:33.33%;} section.mypage.quit .point > div span {margin-top:40px; margin-bottom:10px; display:block; color:var(--gray600); font-size:var(--F14);} section.mypage.quit .order {padding:40px 0; font-size:var(--F17); border-bottom:1px solid var(--gray250);} section.mypage.quit .order > p {padding-left:36px; color:var(--purple400); font-size:var(--F17); background:url('../images/ui/exc_mark.png') no-repeat left center;} section.mypage.quit .order > p > em {color:var(--gray900);} section.mypage.quit .cause {margin-top:30px;} section.mypage.quit .cause .checkbox {margin-left:20px;} section.mypage.quit .cause textarea {margin-top:20px; height:150px; } section.mypage.quit .list_wrap {margin-top:30px;} /* #185205 베네피아 연동 */ section.mypage.quit .point.benepia {display:flex; flex-wrap:wrap} section.mypage.quit .point.benepia > div.trisection {width:20%} section.mypage.quit .point.benepia > div span.txt {margin:0; font-size:var(--F15); line-height:var(--F15L); color:var(--gray450)} section.mypage.quit .point.benepia > div em {line-height:42px} /* 위시리스트 */ .wishlist ul.tablist {display:flex; height:44px; box-sizing: border-box; } .wishlist ul.tablist li {flex:1; display:flex;} .wishlist ul.tablist li > * {flex:1; display:flex; justify-content: center; align-items: center; font-size:var(--F17); line-height:21px; color:var(--gray900); border-bottom: 4px solid var(--gray250);} .wishlist ul.tablist li[aria-selected=true] > * {font-weight:700; color:var(--purple400); border-bottom: 4px solid var(--purple400);} .wishlist ul.tablist.stem, *[role="tabpanel"] ul.tablist {border-color:var(--gray900);} .wishlist ul.tablist.stem li > *, *[role="tabpanel"] ul.tablist li {font-size:var(--F16); line-height:20px;} .wishlist ul.tablist.stem li[aria-selected=true], [role="tabpanel"] ul.tablist li[aria-selected=true] {position:relative;} .wishlist ul.tablist.stem li[aria-selected=true]:after, [role="tabpanel"] ul.tablist li[aria-selected=true]:after {position:absolute; left:0; bottom:0; display:inline-block; width:100%; height:2px; background:var(--gray900); content:'';} section.wishlist .list_none {display:block; padding:150px 0; border-bottom:0 none; font-size:var(--F17); color:var(--gray600); text-align:center;} section.wishlist .list_none .no-saved {margin-top:-40px; padding-bottom:20px; font-size:var(--F17); line-height:var(--F17L)} /* 185569 */ section.wishlist .list_none .btn.lg {width:320px} /* 185569 */ section.wishlist .wishlist_count { margin-top:-20px; } /* #185569 */ section.wishlist .wishlist_count .count_tit { font-size:19px; padding: 6px 0; color:var(--gray900); line-height:24px; display:inline-block;} section.wishlist .wishlist_count .count_tit em {margin-left:5px; font-weight:bold; color:var(--purple400);} section.wishlist .wishlist_count .count_tit span {display:inline-block; margin-left:10px; font-size:var(--F15); color:var(--gray600);} section.wishlist .wishlist_count .count_tit .search-date {float:right; font-weight:normal; line-height:30px;} section.wishlist .wishlist_count .count_tit .btn {display:inline-block; float:right; padding:1px 20px; border-color:var(--gray800); background-color:var(--gray800); font-size:var(--F13);} section.wishlist .wishlist_count .count_tit .btn + .btn {margin-right:5px;} section.wishlist .wishlist_count .count_tit + .info {margin:22px 0 4px; color:var(--gray800); font-size:var(--F14);} section.wishlist .wishlist_count .count_tit .search-date .btn {width:auto; height:px; margin-left:20px; padding:5px 20px; background-color:var(--white); border-color:var(--gray900); font-size:var(--F15); color:var(--gray900); line-height:var(--F15LL);} section.wishlist .wishlist_count .count_tit .select {float:right; font-size:var(--F15); width:90px;} section.wishlist .wishlist_count .count_tit .select label {width:auto !important; border:0 none; color:var(--gray800);} section.wishlist .wishlist_count .count_tit + .form_wrap {margin-top:36px;} section.wishlist .list_wrap { margin-top:50px;} section.wishlist .banner {margin-top:55px;} /* 위시리스트 > 상품 */ section.wishlist #gods .wishlist_count .filter {margin-top:0px;} section.wishlist #gods .wishlist_count .filter .layer::after { display:block; content:''; clear:both; } section.wishlist #gods .wishlist_count .filter .layer .checkbox>label { margin-right:30px; margin-bottom:3px; } section.wishlist #gods .wishlist_count .filter .layer .checkbox, section.wishlist #gods .wishlist_count .filter .layer .radio {display:block; float:left; padding:6px 0; min-height:20px; max-width:100%;} section.wishlist #gods .wishlist_count .filter .layer .button {display:block; float:left; } section.wishlist #gods .wishlist_count .filter .layer .btn {font-weight: normal; } section.wishlist .wishlist_goods {max-width:960px; margin:32px auto 0 auto;} /* #185569 */ section.wishlist .wishlist_goods>ul {width:100%; margin:0;} section.wishlist .wishlist_goods:after {display:block; clear:both; content:"";} section.wishlist .wishlist_goods li {float:left; width:228px; margin:0 8px;} section.wishlist .wishlist_goods li:nth-child(4n) {margin-right:0px;} section.wishlist .wishlist_goods li:nth-child(4n+1) {clear:both; margin-left:0;} section.wishlist .wishlist_goods li .img {position:relative; padding-top:calc(302*100% / 228)} /*#189216*/ section.wishlist .wishlist_goods li .img > a {position:absolute; left:0; top:0; width:100%; height:100%} /*#189216*/ section.wishlist .wishlist_goods li .img img {width:100%; height:100%} /*#189216*/ section.wishlist .wishlist_goods li .img .del {overflow:hidden; position:absolute; top:0; right:0; width:32px; height:32px; background:var(--black) url(../images/ui/btn_x_white.svg) no-repeat center center/15px auto; white-space:nowrap; text-indent:100%;} section.wishlist .wishlist_goods li .img .heart {overflow:hidden; display: block; position:absolute; bottom:15.73px; right:14.33px; width:23.33px; height:21px; background:url(../images/base/heart_wishlist.svg) no-repeat center center/20px auto; } section.wishlist .wishlist_goods li .img .heart > label {display:inline-block; margin:0; width:100%; height:100%; vertical-align:middle; font-size:0;} section.wishlist .wishlist_goods li .img .heart > label > i {display:inline-block; vertical-align:top; width:100%; height:100%; background:url(../images/base/heart_wishlist.svg);background-size: 23.33px 21px;} section.wishlist .wishlist_goods li .img .heart > input[type=checkbox]:checked + label > i { background-image:url(../images/base/heart_em_wishlist.svg); background-size: 23.33px 21px;} section.wishlist .wishlist_goods li .img .checkbox {position:absolute; top:0; right:0;} section.wishlist .wishlist_goods li .img .checkbox label {margin-right:0;} section.wishlist .wishlist_goods li .img .checkbox label i {position:absolute; top:0; right:0; width:30px; height:30px; margin:0; background:url("../images/ui/bg_chech_big.png") no-repeat 0 0;} section.wishlist .wishlist_goods li .img .checkbox > input[type=checkbox]:checked + label > i {background-position:0 -30px;} section.wishlist .wishlist_goods li .img .mark_box {position:absolute; top:50%; left:50%; width:100px; height:36px; margin-top:-50px; margin-left:-50px; padding:32px 0; text-align:center;} section.wishlist .wishlist_goods li .img .mark_box:before {position:absolute; top:0; left:0; width:100%; height:100%; background-color:var(--gray900); opacity:0.7; content:'';} section.wishlist .wishlist_goods li .img .mark_box span {position:relative; font-size:var(--F14); color:var(--white); line-height:18px;} section.wishlist .wishlist_goods li .info {position:relative; margin-bottom:103px;} section.wishlist .wishlist_goods li .info .brand, section.wishlist .wishlist_goods li .info .name {display:block; font-size:var(--F13); color:var(--gray800); line-height:18px;} section.wishlist .wishlist_goods li .info .brand {overflow:hidden; margin-top:18px; white-space:nowrap; text-overflow:ellipsis;} section.wishlist .wishlist_goods li .info .name {overflow:hidden; max-height:36px; margin-top:5px; line-height:18px; word-wrap:break-word; word-break:keep-all;} section.wishlist .wishlist_goods li .info .price {display:block; margin-top:10px; font-weight:bold; color:var(--gray900); line-height:18px;} section.wishlist .wishlist_goods li .info .price del {margin-left:12px; font-size:var(--F13); color:var(--gray600);} section.wishlist .wishlist_goods li .info .price .sale {margin-left:12px; color:var(--purple400);} section.wishlist .wishlist_goods li .info .price .sale.none {margin-left:0;} section.wishlist .wishlist_goods li .info .score {display:block; margin-top:25px;} section.wishlist .wishlist_goods li .info > .heart {position:absolute; bottom:0; right:0;} section.wishlist .wishlist_goods + .list_wrap, section.wishlist .list_none + .list_wrap {margin-top:0; padding-top:35px; border-top:1px solid var(--gray250);} /* 위시리스트 > 브랜드 */ section.wishlist #brand .wishlist_count .filter {margin-top:0px; padding:6px 0;} section.wishlist #brand .wishlist_count .filter .layer .row_arrow {font-size:var(--F16); font-weight: normal; color:var(--gray900); } section.wishlist #brand .wishlist_count + .wishlist_mybrand_wrap {margin-top:32px} section.wishlist .wishlist_brand .wishlist_mybrand_wrap { margin:60px 0; } section.wishlist .list_goods li .img .del {display:none;} section.wishlist .list_goods li:hover .img .del {display:block;} .wishlist_mybrand_wrap + .mybrand_wrap {margin-top:52px;} .wishlist_mybrand_wrap .wishlist_mybrand .list_goods {margin-top:0;} .wishlist_mybrand .wish_mybrand .list_goods > ul {margin:0;} .wishlist_mybrand .wish_mybrand .list_goods > ul:first-child {margin:0;} .wishlist_mybrand .list_goods ul > li {width:151.667px; margin:0; margin-right:10px;} .wishlist_mybrand .list_goods ul > li:last-child {margin-right:0;} .wishlist_mybrand_wrap .wishlist_mybrand .list_goods li:nth-child(4n+1) {clear:inherit;} .wishlist_mybrand .list_goods li .info {margin-bottom: 0;} .wishlist_mybrand .list_goods ul > li a .label {left:4px; width:42px; height:42px; font-size:var(--F11); line-height:15px; letter-spacing:-0.5px;} .wishlist_brand .wishlist_mybrand_like {margin:4px 0 90px 0; padding: 40px 0; border-top: 1px solid var(--gray250); border-bottom: 1px solid var(--gray250);} .wishlist_brand .wishlist_mybrand_like .bname_tit .names {display:block; font-size:29px; line-height:28px; letter-spacing:-0.5px;} .wishlist_brand .wishlist_mybrand_like .bname_tit .names em {color:var(--purple400);} .wishlist_brand .wishlist_mybrand_like .bname_tit .names em span {color:var(--purple400);} .wishlist_brand .wishlist_mybrand_like .bname_tit .txts {display:block; font-size:var(--F15); margin-top:23px;padding-bottom:30px;} .wishlist_brand .wishlist_mybrand_like .bname_tit .txts .hearts {display:inline-block; width:17px; height:15px; vertical-align:-2px; text-indent:-999999px; background:url(../images/base/ico_like_heart.png) no-repeat 0 0;} .wishlist_brand .list_goods ul > li > a {display:block; position:relative; padding-top:calc(200*100% / 151)} /*#189216*/ .wishlist_brand .list_goods ul > li > a > img {position:absolute; left:0; top:0; width:100%; height:100%; max-height:200px} /*#189216*/ .wishlist_brand .list_goods .keep {position:absolute; margin-top:-40px; right:12px; width:30px; height:30px; z-index:1;} .wishlist_brand .list_goods .keep .heart > label {width:auto !important; height:30px; font-weight:bold;} .wishlist_brand .list_goods .keep .heart > label input[type=checkbox] + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center top;} .wishlist_brand .list_goods .keep .heart > label input[type=checkbox]:checked + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center bottom;} .wishlist_brand .list_goods .keep .heart > .dummy {display:block; width:0px; height:30px; padding-left:30px;} .wishlist_brand .list_goods .keep .heart:after {position:absolute; right:0; width:30px; height:30px; content:""; background:url('../images/base/heart04.png') no-repeat center top;} /*#143775*/ .wishlist_brand .list_goods .keep .heart.on:after {background-position:center bottom;} .wishlist_brand .list_goods .info .score {line-height:16px; color:var(--gray800); font-size:var(--F14);} .wishlist_brand .list_goods .info .score span {display:inline-block;} /*#146170추가*/ .wishlist_brand .list_goods .info .score span + span {margin-left:14px; padding-left:16px;} .wishlist_brand .list_goods .info .score span + span:before {position:absolute; content:''; margin:4px 0 0 -15px; width:1px; height:10px; background:var(--gray250);} .wishlist_brand .list_goods .info .score span em {margin-left:5px;} .wishlist_brand .list_goods .info .score .heart > i {display:inline-block; width:14px; height:16px; vertical-align:middle; text-indent:-9999px; background:url('../images/base/ico_score_heart.png') no-repeat center top;} .wishlist_mybrand .list_goods ul li .info {margin-top:10px; height:auto; text-align:left; font-size:var(--F13); margin-bottom: 0;} .wishlist_mybrand .list_goods ul li .info .name {display:inline-block; margin-top:0 !important; width:100%; font-size:var(--F14); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .wishlist_mybrand .list_goods ul li .info .price {margin-top:0; height:22px; line-height:var(--F13LL); font-size:var(--F13); overflow:hidden;} .wishlist_mybrand .list_goods li .info .price .sale {margin-left:3px !important;} .wishlist_my_bnames {position:relative; padding-bottom:13px} .wishlist_my_bnames .b_name {display:inline-block; margin-right:16px; vertical-align:middle; } .wishlist_my_bnames .b_name span {display:block; font-size:var(--F21); color:var(--gray900); font-weight:bold;} .wishlist_my_bnames .b_name span.ko {display:block; margin-top:2px; font-size:var(--F14); color:var(--gray600); font-weight:normal;} .wishlist_my_bnames .evaluations {display:inline-block; vertical-align:11px;} .wishlist_my_bnames .more {position:absolute; top:4px; right:0; color:var(--gray600); display: inline-block; padding-right:14px; background:url("../images/ui/btn_next_gray.svg") no-repeat right 5px / 6px auto;} /* 위시리스트 > 컨텐츠 */ section.wishlist .wishlist_magazine {margin-top:40px;} section.wishlist .wishlist_magazine:after {display:block; clear:both; content:"";} section.wishlist .wishlist_magazine li {float:left; width:312px; margin:0 6px;} section.wishlist .wishlist_magazine li:nth-child(3n) {margin-right:0px;} section.wishlist .wishlist_magazine li:nth-child(3n+1) {clear:both; margin-left:0px;} section.wishlist .wishlist_magazine li .img {z-index:1; position:relative;} section.wishlist .wishlist_magazine li .img .magazineItem {display:block;width:100%; box-sizing:border-box;} section.wishlist .wishlist_magazine li .img .magazineItem .thumb {display:block;width:100%;padding-top:100%;background-size:cover;} section.wishlist .wishlist_magazine li .img .heart {overflow:hidden; display: block; position:absolute; bottom:12px; right:12px; width:28px; height:28px; background:url(../images/base/heart_wishlist.svg) no-repeat center center/20px auto; } section.wishlist .wishlist_magazine li .img .heart > label {display:inline-block; margin:0; width:100%; height:100%; vertical-align:middle; font-size:0;} section.wishlist .wishlist_magazine li .img .heart > label > i {display:inline-block; vertical-align:top; width:100%; height:100%; background:url(../images/base/heart_wishlist.svg); background-size: 28px 28px;} section.wishlist .wishlist_magazine li .img .heart > input[type=checkbox]:checked + label > i { background-image:url(../images/base/heart_em_wishlist.svg); background-size: 28px 28px;} section.wishlist .wishlist_magazine li .info {position:relative; margin-bottom:60px;} section.wishlist .wishlist_magazine li .name {display:inline-block;margin-top:8px;padding:4px 8px;box-sizing:border-box;background:var(--gray900);} section.wishlist .wishlist_magazine li .name img {height:12px; width:auto;} section.wishlist .wishlist_magazine li .title {display:block;margin-top:4px;font-weight:bold;font-size:var(--F14);line-height:15.6px;color:var(--black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing: -0.3%;} section.wishlist .wishlist_magazine li .desc {display:block;margin-top:4px;font-size:var(--F14);line-height:14px;color:var(--gray600);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing: -0.3%;} /* #185569 위시리스트 > 기획전 */ section.wishlist .our-picks-lists .list-area ul {margin:0 -6px 0 -6px} section.wishlist .our-picks-lists .list-area ul > li {padding:0 6px} section.wishlist .our-picks-lists .list-area .list-col-3 .item-img {padding-top:calc(100% * 416/312)} section.wishlist .our-picks-lists .list-area .list-col-3 .item-img .heart {overflow:hidden; display: block; position:absolute; bottom:12px; right:12px; width:28px; height:28px; background:url(../images/base/heart_wishlist.svg) no-repeat center center/20px auto; } section.wishlist .our-picks-lists .list-area .list-col-3 .item-img .heart > label {display:inline-block; margin:0; width:100%; height:100%; vertical-align:middle; font-size:0;} section.wishlist .our-picks-lists .list-area .list-col-3 .item-img .heart > label > i {display:inline-block; vertical-align:top; width:100%; height:100%; background:url(../images/base/heart_wishlist.svg); background-size: 28px 28px;} section.wishlist .our-picks-lists .list-area .list-col-3 .item-img .heart > input[type=checkbox]:checked + label > i { background-image:url(../images/base/heart_em_wishlist.svg); background-size: 28px 28px;} /* #185569: 20230215 start */ section.wishlist .our-picks-lists .list-area .list-col-3 .item-info {padding-right:0;} section.wishlist .our-picks-lists .list-area .list-col-3 .item-info .tit {display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; max-height:42px;} /* #185569: 20230215 end */ /* #191118 > #201752:20230417 start */ section.wishlist .tab-rects.nested > ul > li { display: list-item; position: initial; padding: 0; } /* #231012 */ section.wishlist .tab-rects.nested > ul > li > span[role="button"]{ position: relative; display: block; height: 60px; max-height: none; margin-top: 0; padding: 18px 30px 19px; font-size: var(--F17); line-height: var(--F17L); text-align: center; box-sizing: border-box; } section.wishlist .tab-rects.nested > ul > li[aria-controls="contents"][aria-selected="true"] { margin-bottom: 66px; } /* #191118 > #201752:20230417 end */ /* 나의 브랜드 */ .my_count .count_tit {display:inline-block;} .my_count .count_tit em {font-weight:bold; color:var(--purple400);} .my_count .filter {margin-top:0;} .my_count .filter .layer {margin-left:30px;} .my_count .filter .layer > a {width:150px;} .my_count .filter .layer > div {border: 1px solid var(--black);} .my_count .filter .layer .sort .list_sort {width:160px;} .my_count .filter .layer .sort .list_sort ul {padding:10px 0;} .my_count .filter .layer .sort .list_sort a {display:block; font-weight:normal; padding-left:20px;} .my_count .filter .layer .sort .list_sort ul li.on {background:#f7f7f7;} .my_count .filter .layer .sort .list_sort ul li.on a {color:var(--gray800); background:none; padding-left:20px !important; font-weight:normal;} .mybrand .list_goods li .info {margin-bottom: 0;} .mybrand .list_goods ul > li a .label {left:4px; width:42px; height:42px; font-size:var(--F11); line-height:15px; letter-spacing:-0.5px;} .mybrand .list_goods ul li .info {margin-top:10px; height:auto; text-align:left; font-size:var(--F13); margin-bottom: 0;} .mybrand .list_goods ul li .info .name {display:inline-block; margin-top:0 !important; width:100%; font-size:var(--F14); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .mybrand .list_goods ul li .info .price {margin-top:0; height:22px; line-height:var(--F13LL); font-size:var(--F13); overflow:hidden;} .mybrand .list_goods li .info .price .sale {margin-left:3px !important;} .mybrand_wrap {margin:35px 0 50px;} .mybrand_wrap + .mybrand_wrap {margin-top:52px;} .mybrand_like + .mybrand_wrap {margin-top:60px; padding-top:35px; border-top:1px solid var(--gray250);} .mybrand_wrap + .page {margin-top:-7px;} .mybrand .list_goods > ul {margin:0;} .mybrand .list_goods ul > li {width:151.667px; margin:0; margin-right:10px;} .mybrand .list_goods ul > li:last-child {margin-right:0;} section.mypage .mybrand .list_goods li:nth-child(4n+1) {clear:inherit;} section.mypage .mybrand .list_goods {margin-top:0;} .my_bnames {position:relative; padding-bottom:13px} .my_bnames .b_name {display:inline-block; margin-right:16px; vertical-align:middle; } .my_bnames .b_name span {display:block; font-size:var(--F21); color:var(--gray900); font-weight:bold;} .my_bnames .b_name span.ko {display:block; margin-top:2px; font-size:var(--F14); color:var(--gray600); font-weight:normal;} .my_bnames .evaluations {display:inline-block; vertical-align:11px;} .my_bnames .more {position:absolute; top:4px; right:0; color:var(--gray600); display: inline-block; padding-right:14px; background:url("../images/ui/btn_next_gray.svg") no-repeat right 5px / 6px auto;} .evaluations .heart {display:inline-block; height:18px;} .evaluations .heart > label {width:auto; height:18px; font-size:var(--F13); line-height:18px;} .evaluations .heart > label > i {margin-right:7px; width:20px; height:18px; background:url("../images/base/heart02.png") no-repeat; background-position:0 0;} .evaluations .heart > input:checked + label > i {background-position:0 bottom;} .item_bname {display:block;} .item_bname span {display:block; color:var(--gray900); font-size:var(--F14); font-weight:bold; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .item_bname .ko {display:block; color:var(--gray600); font-size:var(--F14); font-weight:normal; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .item_evaluations {margin-top:13px;} .item_evaluations .heart {display:inline-block; height:12px;} .item_evaluations .heart > label {width:auto; height:13px; line-height:13px; font-size:var(--F13);} .item_evaluations .heart > label > i {margin-right:4px; width:14px; height:13px; vertical-align:-2px; background:url("../images/base/heart07.png") no-repeat; background-position:0 0; background-size:14px auto;} .item_evaluations .heart > input:checked + label > i {background-position:0 bottom;} .mybrand_like {margin:55px 0; padding:41px 0 0; border-top:1px solid var(--gray250); } .bname_tit .names {display:block; font-size:29px; line-height:28px; letter-spacing:-0.5px;} .bname_tit .names em {color:var(--purple400);} .bname_tit .names em span {color:var(--purple400);} .bname_tit .txts {display:block; font-size:var(--F15); margin-top:23px; padding-bottom:2px;} .bname_tit .txts .hearts {display:inline-block; width:17px; height:15px; vertical-align:-2px; text-indent:-999999px; background:url(../images/base/ico_like_heart.png) no-repeat 0 0;} /* 이벤트 참여내역&1:1문의 테이블 */ .grid_wrap.list {margin-top:40px; table-layout:fixed;} .grid_wrap.list th {padding:20px 0; border:0 none; background-color:var(--white); font-size:var(--F14); color:var(--gray600); text-align:left;} .grid_wrap.list th.txt-center {text-align:center;} .grid_wrap.list td {padding:13px 0; border-left:0 none; border-right:0 none; font-size:var(--F14); text-align:left;} .grid_wrap.list tr:first-child td {border-top:1px solid var(--gray600);} .grid_wrap.list td:first-child {color:var(--gray800);} .grid_wrap.list td.tit strong {display:block; overflow:hidden; height:22px; line-height:22px; white-space:nowrap; text-overflow:ellipsis;} .grid_wrap.list td.tit .date {display:block; color:var(--gray600); line-height:22px;} .grid_wrap.list th.tit, .grid_wrap.list td.tit {text-align:left;} .grid_wrap.list td.tit a {display:inline-block; overflow:hidden; max-width:100%; white-space:nowrap; text-overflow:ellipsis;} .grid_wrap.list td.tit strong {display:block; line-height:22px;} .grid_wrap.list td.tit span {display:block; color:#d5d5d5; line-height:22px;} .grid_wrap.list td.btn_right {text-align:right;} .grid_wrap.list td.btn_right a {display:inline-block; font-size:var(--F13); color:var(--gray800); border:1px solid #d5d5d5; width:110px; height:26px; line-height:26px; text-align:center; margin-left:5px; letter-spacing:-1px;} .grid_wrap.list td.btn_right a:first-child {margin-left:0;} /* #170365_2 매거진 찜하기 */ .contents.mz .set-right {display: flex;}/* #170365_5 수정 */ .contents.mz .set-right .heart {display:block; z-index:1; position:relative; width:25px; height:25px; margin-right:15.5px;}/* #170365_5 수정 */ .contents.mz .set-right .heart > label {width:auto !important; height:25px; font-weight:bold;} .contents.mz .set-right .heart > label input[type=checkbox] + i {width:25px; height:25px; background:url('../images/base/heart04.png') no-repeat center top;} .contents.mz .set-right .heart > label input[type=checkbox]:checked + i {width:25px; height:25px; background:url('../images/base/heart04.png') no-repeat center bottom;} .contents.mz .set-right .heart > .dummy {display:block; width:0px; height:25px; padding-left:30px;} .contents.mz .set-right .heart:after {position:absolute; right:0; width:25px; height:25px; content:""; background:url('../images/base/heart04.png') no-repeat center 5%;} /*#143775*/ .contents.mz .set-right .heart.on:after {background-position:center 92%;} .mysize-save {position:relative; padding:0 0 100px 167px;} .mysize-save h2 {position:absolute; left:0; top:0; font-weight:bold; color:var(--gray900); font-size:19px;} .mysize-save a.btn {position:absolute; right:0; bottom:60px; width:150px;} .mysize-save .size_box {max-width:770px; min-height:296px} .mysize-save .size_box li {position:relative; float:left; padding:30px; border:1px solid var(--gray250); box-sizing:border-box;} .mysize-save .size_box li .name {display:block; width:188px; font-weight:bold; font-size:var(--F17); color:var(--gray800); line-height:18px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .mysize-save .size_box li .name small {display:block; margin-top:6px; width:188px; color:var(--gray600); font-size:var(--F14); font-weight:normal; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .mysize-save .size_box li .detail {display:table; margin-top:30px;} .mysize-save .size_box li .detail .img {display:table-cell; width:91px; vertical-align:middle;} .mysize-save .size_box li .detail span {display:table-cell; padding-left:35px; vertical-align:middle;} .mysize-save .size_box li .detail span em {display:block; font-weight:bold; color:var(--gray800); line-height:22px;} .mysize-save .size_box li .btn_wrap {position:absolute; top:10px; right:10px;} .mysize-save .size_box li .btn_wrap a {display:inline-block; padding:5px; font-size:var(--F14); color:var(--gray600); line-height:12px;} .mysize-save .size_box li .edit {position:absolute; top:12px; right:5px; width:20px; height:20px; font-size:0; background:url(../images/ui/ico_more_dotted.png) no-repeat 13px top;} .mysize-save .size_box li .edit:hover + .btn_wrap.box, .mysize-save .size_box li .btn_wrap.box:hover {display:block;} .mysize-save .size_box li .btn_wrap.box {display:none; top:28px; right:6px; padding:6px; background:var(--white); border:1px solid #b4b4b4;} .mysize-save .size_box li .btn_wrap.box a {display:block; color:var(--gray800); font-size:var(--F14);} .mysize-save .size_box .lSAction {margin-top:-46px; position:absolute; top:50%; width:100%; height:41px;} .mysize-save .size_box .lSAction .lSPrev {display:block; position:absolute; left:-35px; width:35px; height:92px; background:url(../images/ui/btn_prev.svg) var(--white) no-repeat center center /10px auto; z-index:9; cursor:pointer;} .mysize-save .size_box .lSAction .lSNext {display:block; position:absolute; right:-35px; width:35px; height:92px; background:url(../images/ui/btn_next.svg) var(--white) no-repeat center center /10px auto; z-index:9; cursor:pointer;} .mysize-save .size_box li dl {margin-top:24px;} .mysize-save .size_box li dl dd {height:28px; line-height:28px; color:var(--gray600);} .mysize-save .size_box li dl dd em {float:right; color:var(--gray800); font-weight:bold; } .mysize-save .list_wrap {margin:20px 0;} .mysize-save .size_box + .list_wrap {margin-top:40px;} .mysize-save.empty {padding-bottom:20px;} .mysize-save.empty p {font-size:var(--F17); line-height:var(--F17LL);} .mysize-save.empty .btn {top:0; bottom:auto;} .mycard-save {position:relative; padding:60px 0 60px 167px; border-top:1px solid var(--gray250);}/*//#153907*/ .mycard-save h2 {position:absolute; left:0; top:60px; font-weight:bold; color:var(--gray900); font-size:var(--F20);} .mycard-save > div {position:relative;} .mycard-save .card_num {display:block; padding-left:66px; height:34px; background:url(../images/ui/credit_card.gif) no-repeat left top;} .mycard-save .card_num.check {padding-left:76px; background-position:left bottom;} .mycard-save .card_num > strong {display:block; height:22px; line-height:22px; color:var(--gray900); font-size:var(--F16);} .mycard-save .card_num > em {display:block; height:12px; line-height:12px; color:var(--gray800); font-size:var(--F14);} .mycard-save .card_num.account {background:url(../images/ui/account_card.png) no-repeat left top;}/*//#153907*/ .mycard-save .list_wrap {margin:30px 0 0;}/*//#153907*/ .mycard-save .empty p {line-height:34px; font-size:18px;} .mycard-save .btns {position:absolute; right:0; top:0;} .mycard-save .btns .btn.bk {width:150px;} .refund-account {width:420px;} .refund-account .name {font-weight:bold; padding-bottom:10px; color:var(--gray900);} .refund-account.form_wrap .row .select {width:calc(100% - 12px);} .refund-account .select label {width:calc(100% - 20px);} .refund-account .agree_terms {overflow:hidden; overflow-y:auto; margin-top: 13px; padding: 0; height: 150px; background:var(--gray150);} .purpleCoin-refund {width:800px; } .popup .purpleCoin-refund h1 {border:none;} .purpleCoin-refund .refund {display:flex; justify-content: space-between; align-items: center; padding-bottom:36px; margin-top:-13px; margin-bottom:40px; line-height:40px; font-size:var(--F17); color:var(--gray900); border-bottom:1px solid var(--gray900); } .purpleCoin-refund .refund span {font-size:31px; color:var(--gray900);} .purpleCoin-refund dl {display:flex; height:78px; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} .purpleCoin-refund dl dt {flex:none; width:160px; padding-left:20px; line-height:78px; color:var(--gray900); font-size:var(--F15); background:#F7F7F7;} .purpleCoin-refund dl .row {padding-left:20px; margin-top:20px;} .purpleCoin-refund .form_wrap .row .select {width:200px;} .purpleCoin-refund .agree {padding :10px 0 0;} .purpleCoin-refund .agree .remote {width:auto; height:auto; padding-right:18px; vertical-align:middle; background-position:right center} .purpleCoin-refund #agree_privacy {overflow-y:auto;} /* 동일고객주소_합배송 주문 발송 서비스 */ .layerNotice.guideCancel {width:698px !important; border-radius:0px; position:relative; padding:40px 30px;} .layerNotice.guideCancel h1 {letter-spacing:-0.08em; padding-bottom:24px;} .layerNotice.guideCancel p {font-size:var(--F14); color:var(--gray800); letter-spacing:-0.03em; padding-bottom:20px; border-bottom:1px solid var(--gray250);} .layerNotice.guideCancel .btns * {border-radius:0px; font-weight:normal;} .layerNotice.guideCancel .product_wrap h3 {margin: 16px 0; font-size:var(--F15); font-weight:bold; line-height:var(--F15LL); color:var(--gray900); letter-spacing:-0.03em;} .layerNotice.guideCancel .product_wrap ul li {width:152px !important; margin-right:10px; cursor:pointer;} .layerNotice.guideCancel .product_wrap ul li .img a {overflow:hidden; position:absolute; top:0; right:0; width:40px; height:40px; background:url("../images/ui/bg_add.png") no-repeat 0 0; white-space:nowrap; text-indent:100%;} .layerNotice.guideCancel .product_wrap ul li .img img {width:100%;} .layerNotice.guideCancel .product_wrap ul li .info {margin-top:8px;} .layerNotice.guideCancel .product_wrap ul li .info * {display:block; font-weight:normal; font-size:var(--F15); line-height:23px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .layerNotice.guideCancel .product_wrap ul li .info .brand {color:var(--gray900);} .layerNotice.guideCancel .product_wrap ul li .info .name {color:var(--gray800);} .layerNotice.guideCancel .product_wrap ul li .info .item {margin-top:10px; min-height:36px;} .layerNotice.guideCancel .product_wrap ul li .info .item span {font-size:var(--F14); color:var(--gray600); line-height:18px;} .layerNotice.guideCancel .btns {padding: 50px 54px 0px !important;} .layerNotice.guideCancel .close {position:absolute; top:20px; right:20px !important; margin:0; padding:0; width:30px; height:30px; border:0; border-radius:0; background:url("../images/ui/btn_x.svg") no-repeat center center / 15px auto; font-size:0px; text-indent:-9999px;} .layerNotice.guideCancel .swiper-button-prev, .layerNotice.guideCancel .swiper-button-next {width:36px; height:60px; position:absolute; top:121px; z-index:1; cursor:pointer;} .layerNotice.guideCancel .swiper-button-prev {left:0px; background:rgba(255,255,255,.8) url(../images/ui/btn_prev.svg) no-repeat center center/8px auto;} .layerNotice.guideCancel .swiper-button-next {right:0px; background:rgba(255,255,255,.8) url(../images/ui/btn_next.svg) no-repeat center center/8px auto;} /* 동일고객주소_합배송 주문 발송 서비스 */ /* mypage (e) ***********************************************************/ /* 주문정보 테이블 (s) ***************************************************/ i.offline {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--gray900); font-size:var(--F12); background:var(--white); font-weight:bold; border:1px solid var(--gray900); box-sizing:border-box;} i.offline:after {content:"매장구매" !important;} i.best {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--white); font-size:var(--F12); background:var(--purple400); font-weight:bold; border:1px solid var(--purple400); box-sizing:border-box;} i.best:after {content:"BEST";} i.review {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--gray900); font-size:var(--F12); background:var(--white); font-weight:bold; border:1px solid var(--gray900); box-sizing:border-box;}/*//#146166 : 상품상세 컬러변경*/ i.review:after {content:"첫리뷰";} i.txt-only {display:inline-block; padding-left:5px; line-height:22px;} i.experience {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--white); font-size:var(--F12); background:#151515; font-weight:bold; border:1px solid #151515; box-sizing:border-box;} /*#141816*/ i.experience:after {content:"체험단 리뷰";} i.worker {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--gray900); font-size:var(--F12); background:var(--white); font-weight:bold; border:1px solid var(--gray900); box-sizing:border-box;} i.worker:after {content:"직원리뷰";} i.helps {display:inline-block; margin:0; padding:0 10px; height:20px; line-height:var(--F12L); color:var(--gray900); font-size:var(--F12); background:var(--white); font-weight:bold; border:1px solid var(--gray900); box-sizing:border-box;} i.helps:after {content:"도움리뷰";} .review_info {margin-top:50px; } .review_info h4 {color:var(--gray800); font-size:19px; line-height:28px;} .review_info strong {display:block; margin-top:18px; color:var(--gray600); font-size:var(--F15); line-height:22px; font-weight:bold;} .review_info strong + .list_wrap {margin-top:2px; color:var(--gray600); font-size:var(--F14);} /*#141816*/ .myReview .detail td {position:relative; padding-top:0; border-top:0 !important;} .myReview .detail td > p {width:640px;} .myReview .detail td .date {position:absolute; top:0; right:20px;} .myReview .detail td .img img {margin:0 8px 0 0 !important; width:auto; height:160px;} .myReview .detail .review_info dt, .myReview .detail .review_info dd {float:left; padding:0; line-height:24px;} .myReview .detail .review_info dt {color:#999 !important;} .myReview .detail .review_info dd {width:90px !important;} .myReview .detail .review_info dd .star {margin:4px 0 0 !important;}/* 210329 만족도 위치 조정 */ .myReview .detail .btn_wrap {display:block !important; margin:0 !important; text-align:right;} /* 주문정보 테이블 (e) ***************************************************/ /* 사이즈 비교하기 (s) ***************************************************/ .compare_size {width:460px; height:645px} .compare_size .tabs {margin-top:30px;} .compare_size .tabs .tab {height:58px; border:1px solid var(--gray250);} .compare_size .tabs .tab li {width:50%; line-height:58px; text-align:center;} .compare_size .tabs .tab li + li {border-left:1px solid var(--gray250); box-sizing:border-box;} .compare_size .tabs .tab li a {display:block; color:var(--gray600); font-size:var(--F15); border:0;} .compare_size .tabs .tab li a.on {color:var(--white); line-height:58px; background-color:var(--purple400);} .compare_size .tabs .tab li a.on i {color:var(--white); padding-left:23px; background:url(../images/ui/bg_fin_check_white.svg) no-repeat 0 center/18px auto;} .compare_size .tabs > div {padding:40px 0;} .compare_size #search_order .date_wrap .btn {margin-left:3px; vertical-align:bottom; line-height:24px; background-position:0 -550px;} .compare_size #search_code h4 {margin-bottom:30px; font-size:var(--F15);} .compare_size #search_code .guide {position:relative; float:right; margin-top:-49px; vertical-align:top; line-height:16px;} .compare_size #search_code .guide > div {display:none; position:absolute; top:0; right:0; width:460px; background:var(--white); z-index:1;} .compare_size #search_code .guide > div > img {margin-top:20px;} .compare_size #search_code .guide .find_code {display:block; float:right; margin-left:5px; width:16px; height:16px; line-height:16px; text-align:center; vertical-align:middle; text-indent:-9999px; color:#aaa; font-size:var(--F14); background:url(../images/base/bg_base.png) no-repeat center -947px; cursor:pointer;} .compare_size #search_code .input_wrap.on .guide > div {display:block} .compare_size #search_code .input_wrap.on .guide > div .btn {display:block; margin:30px auto; width:222px; height:38px; line-height:38px; color:var(--gray900); font-size:18px; border:1px solid var(--gray900);} .compare_size #search_code .input_wrap.on + .order {display:none;} .compare_size #search_code .input_wrap .input_box {display:inline-block; width:346px;} .compare_size #search_code .input_wrap .btn {margin-left:16px; padding:5px 0; width:92px; vertical-align:bottom; height:24px; line-height:24px; background-position:0 -550px;} .compare_size section.order {width:100%; margin-top:-25px;} .compare_size section.order img {margin-right:0 !important;} .compare_size section.order .btn:not(.ln) {width:93px; height:35px; line-height:35px; font-size:var(--F14);} .compare_size section.order p.null {padding:180px 0 120px; background:url(../images/base/img_silence.gif) no-repeat center 100px;} .compare_size section.order .grid_wrap {margin-top:0;} .compare_size section.order .grid_wrap tbody tr:last-child td {border-bottom-color:var(--gray900);} .compare_size section.order .grid_wrap tbody tr td > .size {text-align:left;} .compare_size section.order .grid_wrap tbody tr td > .size .select + .select {margin-left:4px;} .compare_size section.order .grid_wrap tbody tr:first-child td {border-top:0;} .compare_size section.order .grid_wrap.goods .info .name {white-space:normal;} .compare_size section.order .btn {height:32px; line-height:32px;} .compare_size section .keep_null {margin-top:36px; text-align:center;} .compare_size section .keep_null > p {margin-bottom:14px; line-height:24px; letter-spacing:-1px;} .compare_size section .keep_null > p > span {display:block; margin-bottom:10px; color:var(--gray800); font-size:var(--F16);} .compare_size section .keep_null > p > strong {color:var(--gray900);} .compare_size .compare_goods {margin-top:20px;} .compare_size .compare_goods h4 {color:var(--gray800); font-size:var(--F15);} .compare_size .compare_goods table {width:100%;} .compare_size .compare_goods table + h4 {margin-top:40px;} .compare_size .compare_goods table th, .compare_size .compare_goods table td {padding:3px 0; line-height:36px; vertical-align:bottom; text-align:center; font-weight:400; border-bottom:1px solid var(--gray250);} .compare_size .compare_goods table th {color:var(--gray600); font-size:var(--F14);} .compare_size .compare_goods table td .thumb {position:relative; margin-bottom:10px;} .compare_size .compare_goods table td .thumb .text {position:absolute; bottom:10px; left:50%; margin-left:-40px; width:80px; line-height:28px; text-align:center; color:var(--white); background:var(--gray900); opacity:0.9;} .compare_size .compare_goods table td .select > a label {padding:2px 24px 2px 0; background-position:right -296px;} .compare_size .compare_goods table td .select.over > a label {background-position:right -346px;} .compare_size .compare_goods table td .select.over .option > ul {margin-top:29px;} .compare_size .btnWrap {display:flex; justify-content:center; margin:30px 0 0 0;}/*//#154873*/ .compare_size .btnWrap .btn {display:inline-block;} .compare_size .btnWrap .btn a {display:block; margin:0 5px; padding:0 30px; min-width:68px; height:48px; line-height:48px; font-size:var(--F17); text-align:center; color:var(--white); background:#b4b4b4; text-decoration:none !important; font-weight:bold; border:1px solid var(--gray900);} .compare_size .btnWrap .btn.ln a {color:var(--gray900); background:var(--white);} .compare_size .btnWrap .btn.bk a {color:var(--white); background:var(--gray900);} .compare_size .btnWrap .btn a.disabled {color:var(--white) !important; background:#d5d5d5 !important; border-color:#d5d5d5;} /* 사이즈 비교하기 (e) ***************************************************/ /* 사이즈 리뷰개편 (s) ***************************************************/ .popup .review_edit {width:640px;} .review_edit .review_survey {position:relative; margin:20px 0; text-align:center;} .review_edit .review_survey li + li {margin-top:24px;} .review_edit .review_survey li:first-child {margin-bottom:36px;} .review_edit .review_survey li .query {color:var(--gray900); font-size:var(--F15); font-weight:bold;} .review_edit .review_survey li .answer {margin-top:10px; padding-top:18px; height:60px; line-height:20px; font-size:0 !important;} .review_edit .review_survey li .answer .radio {display:inline-block; position:relative; width:96px; height:1px; min-height:1px; box-sizing:border-box;} .review_edit .review_survey li .answer .radio:not(:last-child):after {content:''; width:60px; height:1px; background:var(--gray250); position:absolute; right:-20px; top:50%;} .review_edit .review_survey li .answer .radio:last-child {width:66px !important; border-right:0;} .review_edit .review_survey li .answer .radio input[type=radio] + label {position:absolute; top:0; left:0; margin:-18px 0 0 0; width:75px; text-align:center; font-size:var(--F14); letter-spacing: -1px;} .review_edit .review_survey li .answer .radio input[type=radio] + label i {display:block; margin:auto; width:36px; height:36px; background:var(--gray250); border-radius:18px;} .review_edit .review_survey li .answer .radio input[type=radio] + label i:after {display:none;} .review_edit .review_survey li .answer .radio input[type=radio]:checked + label i {background:url(../images/ui/bg_fin_check_white.svg) var(--purple400) center center /22px auto no-repeat;} .review_edit .review_survey .star {margin-left:24px; width:170px; height:24px; background:url(../images/base/starpoint_survey.png?timestamp=20210907) no-repeat;} /*#141816*/ .review_edit .review_survey .star > label {float:left; margin-right:10px; width:24px; height:24px; font-size:0px;} .review_edit .review_survey .star.point0 {background-position:left 0 !important;} .review_edit .review_survey .star.point1 {background-position:left -48px !important;} .review_edit .review_survey .star.point2 {background-position:left -96px !important;} .review_edit .review_survey .star.point3 {background-position:left -144px !important;} .review_edit .review_survey .star.point4 {background-position:left -192px !important;} .review_edit .review_survey .star.point5 {background-position:left -240px !important;} .review_edit .review_survey + .add_size {margin-top:50px;} .review_edit .add_size {display:block; margin:0 0 0 220px; width:320px; font-size:var(--F15);} /*#141816*/ .review_edit .add_size > li {margin-top:10px;} /*#141816*/ .review_edit .add_size > li:first-child {margin:0;} .review_edit .add_size > li .input_box {float:left;} .review_edit .add_size > li .unit {display:inline-block; margin-left:8px; color:#8e8e8e;} .review_edit .add_size > li.terms {margin:30px 0 0 -160px; width:500px; text-align:left;} /*#141816*/ .review_edit .add_size > li.terms .checkbox label {line-height:34px !important; color:var(--gray800); letter-spacing:-1px;} .review_edit .add_size > li.terms .remote {position:absolute; width:34px; height:34px; right:1px; background:url(../images/ui/btn_down_gray.svg) no-repeat 8px center / 16px auto;} /*#141816*/ .review_edit .add_size > li.terms .remote.on {background-image:url(../images/ui/btn_up_gray.svg); } .review_edit .add_size > li .mCS {margin-top:13px; padding:0; height:150px; text-align:left; background:var(--gray150);} #photo_review_popup_contents {width:auto !important; background:var(--white); margin:0;} .popup .photo_alburm {position:relative; padding:35px 30px 35px 50px ; margin:0 !important; width:900px !important; height:610px; /*background:var(--white);*/} .popup .photo_alburm h2 {display:flex; width:100%; } .popup .photo_alburm h2 .page {color:var(--gray600); margin:0 0 0 10px;} .popup .photo_alburm .gallery {margin-top:16px; } .popup .photo_alburm .gallery .lSSlideOuter {position:relative;} .popup .photo_alburm .gallery .lSSlideWrapper {position:relative; width:520px !important; height:520px !important; /*slide = overflow:hidden;*/ background:#f7f7f7; border:1px solid var(--gray250);} .popup .photo_alburm .gallery .lSSlideWrapper .lSSlide > li {float:left; width:100%; background:#f7f7f7;} .popup .photo_alburm .gallery .lSSlideWrapper .lSFade > li {position:absolute; top:0; width:100%; opacity:0; display:none;} .popup .photo_alburm .gallery .lSSlideWrapper .lSFade > li.active {display:flex !important; justify-content:center; align-items:center; text-align:center; opacity:1; display:block;} .popup .photo_alburm .gallery .lSSlideWrapper .lSFade > li.active img {max-width:520px; max-height:520px; width:auto; height:auto;} .popup .photo_alburm .gallery .lSSlideWrapper .lSSlide > li > a > img {width:100%; height:100%;} .popup .photo_alburm .gallery .lSGallery {position:absolute; top:410px; left:554px; width:344px !important; transform: translate(0px, 0px) !important;} .popup .photo_alburm .gallery .lSGallery li {display:flex !important; justify-content:center; align-items:center; position:relative; float:left; text-align:center; margin-top:10px; margin-right:10px !important; width:60px !important; height:60px; background:#f7f7f7;} .popup .photo_alburm .gallery .lSGallery li.active:after {position:absolute; top:0; left:0; width:60px; height:60px; border:2px solid var(--purple400); background-color:transparent; content:''; box-sizing:border-box;} .popup .photo_alburm .gallery .lSGallery li img {width:auto; max-width:60px; max-height:60px;} .popup .photo_alburm .gallery .lSGallery li:nth-child(5n) {margin-right:0px !important;} .popup .photo_alburm .gallery .lSAction {display:block !important; margin-top:-310px;} .popup .photo_alburm .gallery .lSAction a {position:absolute; background:pink; width:14px; height:24px;} .popup .photo_alburm .gallery .lSAction .lSPrev {margin-left:-99px; background:url(../images/ui/btn_prev.svg)no-repeat center center/14px auto;} .popup .photo_alburm .gallery .lSAction .lSNext {margin-left:980px; background:url(../images/ui/btn_next.svg) no-repeat center center/14px auto;} .popup .photo_alburm .review_txt {display:block; position:absolute; top:64px; left:602px; width:345px;} .popup .photo_alburm .review_txt dl dd .summary {border:0;} .popup .photo_alburm .review_txt dl dd .summary .star {background:url(../images/base/starpoint_gray.png?timestamp=20210907) no-repeat;} .popup .photo_alburm .review_txt dl dd .summary .star.point0 {background-position:left 0;} .popup .photo_alburm .review_txt dl dd .summary .star.point0h {background-position:left -16px;} .popup .photo_alburm .review_txt dl dd .summary .star.point1 {background-position:left -32px;} .popup .photo_alburm .review_txt dl dd .summary .star.point1h {background-position:left -48px;} .popup .photo_alburm .review_txt dl dd .summary .star.point2 {background-position:left -64px;} .popup .photo_alburm .review_txt dl dd .summary .star.point2h {background-position:left -80px;} .popup .photo_alburm .review_txt dl dd .summary .star.point3 {background-position:left -96px;} .popup .photo_alburm .review_txt dl dd .summary .star.point3h {background-position:left -112px;} .popup .photo_alburm .review_txt dl dd .summary .star.point4 {background-position:left -128px;} .popup .photo_alburm .review_txt dl dd .summary .star.point4h {background-position:left -144px;} .popup .photo_alburm .review_txt dl dd .summary .star.point5 {background-position:left -160px;} .popup .photo_alburm .review_txt dl dd .summary .gray_box {margin-top:20px; padding:20px; background:#f7f7f7;} .popup .photo_alburm .review_txt dl dd .summary .gray_box > span {display:block; line-height:22px; font-size:var(--F14);} .popup .photo_alburm .review_txt dl dd .summary .gray_box > span > em:first-child {display:inline-block; min-width:80px; color:var(--gray600);} .popup .photo_alburm .review_txt dl dd .summary .gray_box > span > em + em {color:var(--gray900);} /*#141816*/ .popup .photo_alburm .review_txt dl dd .content {width:100%; max-height:110px; overflow-y:auto;} .popup .photo_alburm .review_txt dl dd .date {margin-top:20px; color:var(--gray600); max-height:39px; overflow:hidden;} .popup .photo_alburm .review_txt dl dd .date em {word-break:break-all; color:var(--gray600);} /*#141816*/ .popup .photo_alburm .review_txt dl dd .date em + em {margin-left:6px;} .popup .photo_alburm .review_txt dl dd h4 {margin-top:10px; padding-top:20px; font-size:var(--F15); border-top:1px solid var(--gray250);}/*#141816*/ .popup .photo_alburm .review_txt dl dd .summary .support {display:none; font-size:var(--F13); color:var(--gray600); padding-top:10px;} .popup .photo_alburm_list .list {margin-top:20px; max-width:888px;} .popup .photo_alburm_list .list > ul > li {display:block; float:left; margin:2px; width:144px; height:144px;} .popup .photo_alburm_list .list > ul > li .image {position:relative; width:100%; height:100%; background-size:cover !important; background-position:center center;} .popup .photo_alburm_list .list > ul > li .image .file {display:inline-block; position:absolute; right:5px; bottom:5px; padding:0 6px; line-height:20px; color:var(--white); font-size:var(--F13); font-weight:bold; background:rgba(0, 0, 0, 0.6);} .popup .photo_alburm_list .list > ul > li:last-child {padding-bottom:40px;} /* 사이즈 리뷰개편 (e) ***************************************************/ /* 세사패 Magazine (s) **************************************************/ /* 매거진 리스트 */ .mz-header {min-height:95px; margin-top: 43px; background:var(--gray900); padding:20px; box-sizing:border-box;text-align:center;} .mz-header > img {height:32px; width:auto; vertical-align:top;} .mz-header > p {margin:8px 0 0; font-size:var(--F16); line-height:1; color:var(--white);} .mz-nav {margin:30px 0;text-align:center;} .mz-nav ul {display:inline-flex;} .mz-nav ul li {width:80px; height:106px; background:var(--gray150); border:1px solid var(--gray150); box-sizing:border-box; border-radius:8px; margin-right:8px;} .mz-nav ul li a {display:block;padding:12px 0 0;height:100%;box-sizing:border-box;} .mz-nav ul li a .logo {width:55px; height:55px; display:flex; justify-content:center; align-items:center; line-height:55px; margin:0 auto; font-size:19px; font-weight:bold; color: var(--gray600);} .mz-nav ul li a .logo img {width:55px; opacity:0.6;} .mz-nav ul li a span {display:block; margin-top:13px; font-size:var(--F14); font-weight:normal; line-height:1; letter-spacing:-1px; color:var(--gray600);} .mz-nav ul li[aria-selected="true"], .mz-nav ul li:hover {background:var(--white); border-color:var(--gray900);} .mz-nav ul li[aria-selected="true"] a .logo, .mz-nav ul li:hover a .logo {color:var(--gray900);} .mz-nav ul li[aria-selected="true"] a .logo img, .mz-nav ul li:hover a .logo img {opacity:1;} .mz-nav ul li[aria-selected="true"] a span, .mz-nav ul li:hover a span {color:var(--gray900);} .mz-no-result {padding:60px 0; text-align:center; font-size:var(--F15);} .magazineSlider {width:100%; margin-top:0 !important; outline:none;} .magazineSlider .lSSlideOuter {position:relative; padding-bottom:32px;} .magazineSlider .lSSlideWrapper {position:relative;width:960px;margin:0 auto;} .magazineSlider ul {position:relative; width:100%; height:660px;} .magazineSlider ul > li {display:block; width:100%; height:660px; text-align:center;} .magazineSlider ul > li > a {display:block;} .magazineSlider ul > li > img, .magazineSlider ul > li > a:not(.play) > img {position:absolute; left:50%; width:auto; height:660px; transform:translate(-50%, 0);} .magazineSlider .lSSlideWrapper .lightSlider > li {display:block; float:left; width:100%; height:603px; text-align:center;} .magazineSlider .lSSlideWrapper .lightSlider > li > a:not(.play) > img {position:absolute; left:50%; width:auto; height:550px; transform:translate(-50%, 0);} .magazineSlider .lSFade .lslide {position:absolute; top:0; left:0; opacity:0; visibility:hidden;} .magazineSlider .lSFade .lslide.active {opacity:1; visibility:visible; z-index:1;} .magazineSlider .lSPager {position:absolute; margin-top:30px; width:100%; text-align:center; z-index:2;} .magazineSlider .lSPager ul, .magazineSlider .lSPager li {display:inline;} .magazineSlider .lSPager li a {display:inline-block; margin:0 5px; width:12px; height:12px; text-indent:-9999px; background:#ccc; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} .magazineSlider .lSPager li.active a {width:24px; background:var(--purple400);} .magazineSlider .lSPager .btnAuto {position:absolute; display:inline-block; margin-left:15px; width:12px; height:12px; background:url("../images/base/bg_base.png") left -600px no-repeat;} .magazineSlider .lSPager .btnAuto.pause {background-position:left -650px;} .magazineSlider .lSAction {position:absolute;top:233px;left:50%;width:960px;margin-left:-480px;} .magazineSlider .lSAction a {position:absolute; top:0; margin-top:0; width:42px; height:74px; cursor:pointer; z-index:3; opacity:0.4; background:url('../images/base/btn_billboard_action.svg') no-repeat left center; font-size:0;} .magazineSlider .lSAction a.lSPrev {left:-77px; } .magazineSlider .lSAction a.lSNext {right:-77px; background-position:right center;} .magazineSlider .info {position:absolute;top:550px;left:0;right:0;z-index: 1;} .magazineSlider .info .title {display:block;margin-top:15px;font-weight:bold;font-size:19px;line-height:1.2;color:var(--gray900);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .magazineSlider .info .desc {display:block;margin-top:1px;font-size:var(--F15);line-height:1.2;color:var(--gray900);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .magazineList {margin:90px auto 0;} .magazineList .magazineItem {display:block;width:33.3%;padding:0 10px;box-sizing: border-box;margin-bottom:96px;} .magazineList .magazineItem:nth-child(3n+1) {margin-bottom:50px;padding: 0 40px 0 60px;} .magazineList .magazineItem:nth-child(3n) {margin-bottom:50px;padding: 0 60px 0 40px;} .magazineList .magazineItem .thumb {display:block;width:100%;padding-top:100%;background-size:cover;} .magazineList .magazineItem .info {position:relative} .magazineList .magazineItem .name {display:inline-block;margin-top:15px;padding:7px 12px 0;height:30px;box-sizing:border-box;background:var(--gray900);} .magazineList .magazineItem:nth-child(3n+1) .name, .magazineList .magazineItem:nth-child(3n) .name {position:absolute;top:-45px;left:0;margin-top:0;} .magazineList .magazineItem .name img {height:17px;} .magazineList .magazineItem .title {display:block;margin-top:15px;font-weight:bold;font-size:19px;line-height:1.2;color:var(--black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .magazineList .magazineItem .desc {display:block;margin-top:3px;font-size:var(--F14);line-height:1.2;color:var(--gray600);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .magazineList ~ .submit {margin-top:0;} .magazineList ~ .submit .btn {color:var(--gray800);border-color:var(--gray800);} /* 매거진 상세 */ .corner_magazine {margin:50px 0 60px;} .corner_magazine h3 {font-size:29px;line-height:1.1;color:var(--gray900);} .corner_magazine + section:not(.flow) {margin-top:60px;} .corner_magazine .submit .btn {color:var(--gray800);border-color:var(--gray800);} .magazineDetailSlider {width:100%; margin:50px 0 60px; outline:none;} .magazineDetailSlider .lSSlideOuter {position:relative; padding-bottom:52px;} .magazineDetailSlider .lSSlideWrapper {position:relative;width:760px;margin:0 auto;} .magazineDetailSlider ul {position:relative; width:100%; } .magazineDetailSlider ul > li {display:block; width:100%; text-align:center;} .magazineDetailSlider ul > li > a {display:block;} .magazineDetailSlider ul > li > img, .magazineDetailSlider ul > li > a:not(.play) > img {position:absolute; left:50%; width:auto; height:350px; transform:translate(-50%, 0);} .magazineDetailSlider .lSSlideWrapper .lightSlider > li {display:block; float:left; width:100%; text-align:center;} .magazineDetailSlider .lSSlideWrapper .lightSlider > li > a:not(.play) > img {position:absolute; left:50%; width:auto; height:350px; transform:translate(-50%, 0);} .magazineDetailSlider .lSFade .lslide {position:absolute; top:0; left:0; opacity:0; visibility:hidden;} .magazineDetailSlider .lSFade .lslide.active {opacity:1; visibility:visible; z-index:1;} .magazineDetailSlider .lSPager {position:absolute; margin-top:40px; width:100%; text-align:center; z-index:2;} .magazineDetailSlider .lSPager ul, .magazineDetailSlider .lSPager li {display:inline;} .magazineDetailSlider .lSPager li a {display:inline-block; margin:0 5px; width:12px; height:12px; text-indent:-9999px; background:#ccc; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} .magazineDetailSlider .lSPager li.active a {width:24px; background:var(--purple400);} .magazineDetailSlider .lSPager .btnAuto {position:absolute; display:inline-block; margin-left:15px; width:12px; height:12px; background:url("../images/base/bg_base.png") left -600px no-repeat;} .magazineDetailSlider .lSPager .btnAuto.pause {background-position:left -650px;} .magazineDetailSlider .lSAction {position:absolute;top:181px;left:50%;width:960px;margin-left:-480px;} .magazineDetailSlider .lSAction a {position:absolute; top:50%; margin-top:-40px; width:80px; height:80px; cursor:pointer; z-index:3; font-size:0;} .magazineDetailSlider .lSAction a.lSPrev {left:0; background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_prev.svg) no-repeat center center / 14px auto;} .magazineDetailSlider .lSAction a.lSNext {right:0;background:rgba(255, 255, 255, 0.8) url(../images/ui/btn_next.svg) no-repeat center center / 14px auto;} .magazineDetailSlider .magazineItem {float: left;width:50%;padding:0 10px;box-sizing:border-box;} .magazineDetailSlider .magazineItem .thumb {display:block;width:100%;padding-top:100%;background-size:cover;} .magazineDetailSlider .magazineItem .info {position:relative} .magazineDetailSlider .magazineItem .name {position:absolute;top:-45px;left:0;margin-top:0;padding:7px 12px;height:30px;box-sizing:border-box;background:var(--gray900);} .magazineDetailSlider .magazineItem .name img {height:17px;} .magazineDetailSlider .magazineItem .title {display:block;margin-top:15px;font-weight:bold;font-size:19px;line-height:1.2;color:var(--black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;} .magazineDetailSlider .magazineItem .desc {display:block;margin-top:3px;font-size:var(--F14);line-height:1.2;color:var(--gray600);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;} /* 세사패 Magazine (e) **************************************************/ /* parking page (s) ****************************************************/ .parking {padding-top:150px; text-align:center;} .parking h1 img {width:auto;} .parking h2 {margin-top:115px; font-size:33px; color:var(--gray900); line-height:50px;} .parking p {margin-top:18px; color:var(--gray800);} .parking .box {width:560px; margin:0 auto; margin-top:40px; padding:60px 0; background-color:#fafafa;} .parking .box span {display:block; font-weight:bold; font-size:var(--F17); color:var(--gray600); line-height:var(--F17LL);} .parking em {display:block; margin-top:35px; color:var(--gray600);} /* parking page (e) ****************************************************/ /* Global (s) *********************************************************/ .ship_rate {margin-top:80px; width:100%;} .popup h2 + .ship_rate {margin-top:20px;} .ship_rate h4 {margin-bottom:40px; font-size:25px; line-height:36px;} .popup .ship_rate h4 {font-size:19px; line-height:28px;} .ship_rate .form_wrap ul li .item {vertical-align:top;} .ship_rate .form_wrap ul li .cost, .ship_rate .form_wrap ul li .weight {display:inline-block; width:284px; border-bottom:1px solid var(--gray250);} .ship_rate .form_wrap ul li .weight {margin-left:30px;} .ship_rate .form_wrap ul li .select + .select {margin-left:30px;} .ship_rate .form_wrap ul li .input_box input + input {margin-left:30px;} .ship_rate .form_wrap ul li p {color:var(--gray600); font-size:var(--F13);} .ship_charge {margin-top:80px;} .ship_charge h4 {margin-bottom:40px; font-size:25px; line-height:36px;} .popup .ship_charge h4 {font-size:19px; line-height:28px;} .ship_charge ul {border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} .ship_charge ul li {display:table; width:100%;} .ship_charge ul li + li {border-top:1px solid var(--gray250);} .ship_charge ul li em {display:table-cell; width:12.5%; height:40px; line-height:40px; color:var(--gray600); text-align:left; font-size:var(--F14);} .ship_charge ul li em:first-child {color:var(--gray800);} /* Global (e) *********************************************************/ /* 우편번호 찾기 (s) *****************************************************/ .postal_new { width:780px; } .postal_new .form_wrap label {display:inline-block; width:88px; color:#1a1414; font-size:var(--F14); } .postal_new .form_wrap .input_box {display:inline-block; margin-right:4px; width:573px;} .postal_new .form_wrap .input_box input {height:28px; line-height:28px;} .postal_new .form_wrap .btn {padding:0 30px; line-height:38px; vertical-align:top;} .postal_new .result {margin-top:20px; /*width:760px;*/ height:500px; overflow-y:auto;} .postal_new .result .ex {padding-left:90px;} .postal_new .result .ex > p {color:var(--gray800);} .postal_new .result .ex > ul {margin-top:32px; line-height:24px;} .postal_new .result .ex > ul > li > span {display:inline-block; width:130px; color:var(--gray600);} .postal_new .result > table {margin-top:20px; border-top:1px solid var(--gray250);} .postal_new .result > table th {height:44px; line-height:44px; color:var(--gray600); background:var(--white);} .postal_new .result > table th, .postal_new .result > table td {border-right:0; border-left:0; padding:6px 0;} .postal_new .result > table td:first-child em {color:var(--gray900);} .postal_new .result > table td:nth-child(2) {text-align:left; padding-left:30px; line-height:32px;} .postal_new .result > table td:nth-child(2) > a > span {display:inline-block; width:58px; color:var(--gray600);} .postal_new .result > table td:nth-child(2) > a > em {color:var(--gray800);} .postal_new .result > table td:nth-child(2) .keyword {color:var(--purple400);} .postal_new .result > table td:last-child {padding:0;} .postal_new .result > table td:last-child .btn {font-size:var(--F13); padding:0; width:88px; height:35px; line-height:33px;} /* #246087(s) */ .postal_new .ship_info {margin-top:20px;} .postal_new .ship_info dt {font-size:var(--F12); font-weight:700; color:var(--gray700); line-height:var(--F12L);} .postal_new .ship_info dd {position:relative; padding-left:19px; font-size:var(--F12); color:var(--gray700); line-height:var(--F12L);} .postal_new .ship_info dd::before {content:""; position:absolute; top:7px; left:8px; width:3px; height:3px; border-radius:2px; background-color:var(--gray700);} .postal_new .ship_info .info_point {color:var(--purple400);} /* #293976 */ /* #246087(e) */ .addr_more {margin-top:-1px; padding:5px 105px 15px 100px; position: relative; background: var(--white);} .addr_more label {position:absolute; left:24px; top:15px;} .addr_more .btn {position:absolute; right:6px; height:40px !important; line-height:38px !important; } .addr_more input {padding-left:10px; height:40px; line-height:38px; border:1px solid var(--gray250); box-sizing:border-box;} /* 우편번호 찾기 (e) *****************************************************/ /* 고객센터 (s) **********************************************************/ section.customer .advice_wrap {padding-bottom:80px;} section.customer .advice_wrap ul:after {display:block; clear:both; content:"";} section.customer .advice_wrap li {position:relative; float:left; width:33.33%; padding-top:96px; text-align:center;} section.customer .advice_wrap li:after {position:absolute; top:0; left:50%; width:76px; height:76px; margin-left:-38px; background:url("../images/ui/bg_customer_advice.png") no-repeat 0 0; content:'';} section.customer .advice_wrap li + li:after {background-position:0 -76px;} section.customer .advice_wrap li + li + li:after {background-position:0 -152px;} section.customer .advice_wrap li h2 {margin-bottom:20px; font-size:23px; color:var(--gray900); line-height:30px;} section.customer .advice_wrap li span {display:block; min-height:36px; font-size:var(--F14); color:var(--gray600); line-height:18px;} section.customer .advice_wrap li span + span {margin-top:8px;} section.customer .advice_wrap li .btn_wrap {margin-top:40px;} section.customer .advice_wrap li .btn_wrap a + .balloon {display:block; position:absolute; right:-38px; bottom:-46px; height:0; opacity:0; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease;} /* #296271 */ section.customer .advice_wrap li .btn_wrap a + .balloon span {display:inline-block; margin-right:-23px; padding:10px 15px; color:var(--gray800); text-align:left; background:var(--white); border:1px solid #b4b4b4; cursor:default;} section.customer .advice_wrap li .btn_wrap a + .balloon:after {display:block; content:''; position:absolute; top:-5px; left:24px; width:9px; height:9px; background:var(--white); border-top:1px solid #b4b4b4; border-left:1px solid #b4b4b4; transform:rotate(45deg);} section.customer .advice_wrap li .btn_wrap a:hover + .balloon {display:block; height:35px; opacity:1;} section.customer .advice_wrap li em {display:block; margin-top:26px; margin-left:-4px; font-size:18px; color:var(--gray900); line-height:26px;} /* #296271(s) */ section.customer .advice_wrap li .btn_wrap a {padding:0 15px; border-radius:var(--radius); border-color:var(--gray250); color:var(--gray900); line-height:36px;} section.customer .advice_wrap li .btn_wrap a.disabled {color:var(--gray250) !important;} /* #296271(e) */ section.customer .link_wrap {padding-top:80px; border-top:1px solid #212121;} section.customer .link_wrap h2 {margin-top:100px; font-size:var(--F24); color:var(--gray900); line-height:36px;} section.customer .link_wrap h2:first-child {margin-top:0;} section.customer .link_wrap h2 a {float:right; padding-right:15px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/ auto 12px; font-size:var(--F15); color:var(--gray600);} section.customer .link_wrap .list {display:table; width:100%; margin-top:32px; border:1px solid var(--gray250);} section.customer .link_wrap .list a {display:table-cell; width:20%; height:88px; border-left:1px solid var(--gray250); color:var(--gray800); text-align:center; vertical-align:middle; line-height:20px;} section.customer .link_wrap .list a:first-child {border:0 none;} section.customer .link_wrap .list a span {display:block; font-size:var(--F14); color:var(--gray600);} section.customer .link_wrap .list.type_1 a {width:14.28%;} section.customer .link_wrap table {width:100%; margin-top:32px;} section.customer .link_wrap table th, section.customer .link_wrap table td {font-size:var(--F15); color:var(--gray600); text-align:center;} section.customer .link_wrap table th {height:50px; border-bottom:1px solid #959595; } section.customer .link_wrap table td {height:54px; border-bottom:1px solid #f7f7f7;} section.customer .link_wrap table td.tit {color:var(--gray800); text-align:left;} section.customer .form_tit {padding-bottom:20px; width:670px; height:28px; border-bottom:1px solid var(--gray800); font-size:19px; color:var(--gray900); line-height:28px;} /* #245270 */ section.customer .form_tit .check_txt {position:relative; float:right; padding-left:14px; font-size:var(--F15); color:var(--gray600); line-height:20px;} section.customer .form_tit .check_txt:after {position:absolute; top:9px; left:0; width:4px; height:4px; background-color:var(--purple400); border-radius:3px; content:'';} section.customer .form_wrap + .form_tit {margin-top:45px;} section.customer .form_tit + .form_wrap, section.customer .check_txt + ul {padding-top:15px;} section.customer .form_wrap .form_tit {border-bottom:0 none;} section.customer .form_wrap > ul {clear:both;} section.customer .form_wrap > ul > li {position:relative; width:670px; font-size:var(--F15);} section.customer .form_wrap > ul > li .item {vertical-align:top;} section.customer .form_wrap > ul > li textarea {height:108px;} section.customer .form_wrap > ul > li .checkbox:not(.inline) {position:absolute; top:7px; right:-260px; width:240px; padding-left:20px;} section.customer .form_wrap .file_box button {position:absolute; top:10px; left:691px; width:120px; border:1px solid var(--gray250); background-color:var(--white); height:36px;} section.customer .form_wrap + .form_wrap {margin-top:60px; padding-top:60px; border-top:1px solid var(--gray800);} section.customer .form_wrap .chk_tit:after {display:block; clear:both; content:"";} section.customer .form_wrap .chk_tit h2 {float:left; font-size:19px; color:var(--gray900); line-height:20px;} section.customer .form_wrap .chk_tit .chk_txt {float:right; font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} section.customer .form_wrap .chk_tit .chk_txt .checkbox {vertical-align:middle;} /* #210732(s) */ section.customer .form_wrap .chk_tit .chk_txt label {height:24px; margin-left:20px; font-size:var(--F15); color:var(--gray800); line-height:var(--F15LL); vertical-align:top;} section.customer .form_wrap .chk_tit .chk_txt label i {top:-1px;} /* #210732(e) */ section.customer .form_wrap .mCS {margin-top:40px; padding:30px; height:340px; text-align:left; background:var(--gray150);} section.customer .form_wrap .invalid_txt {display:block; margin-top:10px; font-size:var(--F14); color:#f0394d; line-height:12px;} section.customer .list_wrap {margin-top:76px;} section.customer .list_wrap > ul > li {font-size:var(--F15); color:var(--gray600); line-height:22px;} section.customer .list_wrap > ul > li:before {content:"· "} section.customer .banner {display:block; margin-top:60px;} /* #245270(s) */ section.customer.wide, section.customer.wide .form_tit, section.customer.wide .form_wrap > ul > li {width:898px;} section.customer.wide .form_wrap > ul > li .item {width:202px;} section.customer.wide .form_wrap .input_wrap {display:block; position:relative; margin-top:0; padding-right:130px;} section.customer.wide .form_wrap .input_wrap .btn {position:absolute; top:0; right:0; width:120px;} section.customer.wide .form_wrap .unit_wrap {display:inline-flex; align-items:center; gap:0 10px;} section.customer.wide .form_wrap .unit_wrap + .unit_wrap {margin-left:20px;} section.customer.wide .form_wrap .unit_wrap .input_unit {font-size:var(--F15); color:var(--gray900); line-height:var(--F14L);} section.customer.wide .form_wrap .radio input[type="radio"]:not(:first-child) + label {margin-left:20px;} section.customer.wide .form_wrap .info_txt {display:block; margin-top:10px; font-size:var(--F12); color:var(--gray600); line-height:16px;} section.customer.wide .form_wrap .check_list .checkbox {display:block; position:relative; top:0; right:0; padding-left:0; margin-top:12px; width:auto;} section.customer.wide .form_wrap .check_list .checkbox:first-child {margin-top:0;} section.customer.wide .form_wrap .txt_list {display:block; margin-top:20px;} section.customer.wide .form_wrap .txt_list span {display:block; position:relative; padding-left:20px; font-size:var(--F15); color:var(--gray600); line-height:var(--F14L);} section.customer.wide .form_wrap .txt_list span::before {content:""; position:absolute; top:9px; left:9px; width:3px; height:3px; border-radius:2px; background-color:var(--gray600);} section.customer.wide .form_wrap .file_box input[type="text"] {width:564px;} section.customer.wide .form_wrap .file_box button {left:778px;} section.customer.wide .form_wrap #agree_privacy {height:284px;} section.customer.wide .form_wrap .submit_import {margin-top:70px;} section.customer.wide .form_agree {margin-top:35px; margin-bottom:20px; padding-bottom:45px; border-bottom:1px solid var(--gray900);} section.customer.wide .list_wrap {margin-top:70px;} section.customer.wide .list_wrap .list_title {display:block; margin-bottom:8px; font-size:var(--F14); color:var(--gray600); font-weight:700; line-height:var(--F14L);} section.customer.wide .list_wrap > ul > li {font-size:var(--F14); line-height:var(--F14LL);} /* #245270(e) */ /* 공지사항 */ section.customer .search_wrap {padding-bottom:40px; border-bottom:1px solid var(--gray800);} section.customer .search_wrap:after {display:block; clear:both; content:"";} section.customer .search_wrap h2 {float:left; margin-right:30px; font-weight:bold; font-size:19px; color:var(--gray900); line-height:40px;} section.customer .search_wrap .input_box {float:left; width:617px;} section.customer .search_wrap .input_box input {margin-top:0;} section.customer .search_wrap .btn {float:right; margin-left:10px; padding:0 30px;} section.customer .board {width:100%; margin-top:85px;} section.customer .board th, section.customer .board td {padding:20px 0;} section.customer .board th {color:var(--gray600); border-bottom:1px solid var(--gray800);} section.customer .board td {color:var(--gray800); border-bottom:1px solid var(--gray250);} section.customer .board td:first-child {color:var(--gray600);} section.customer .board td .tit {display:inline-block; height:16px; overflow:hidden; width:100%; max-width:725px; white-space:nowrap; text-overflow:ellipsis; line-height:16px;} section.customer .board .notice_line td, section.customer .board .notice_line td a {color:var(--purple400);} section.customer .page {margin-top:20px;} /* 공지사항 상세 */ section.customer .board dl dt {line-height:50px; color:var(--gray800); border-bottom:1px solid var(--gray900);} section.customer .board dl dt span {float:left; padding-right:50px; min-width:40px;} section.customer .board dl dt .date {float:right; text-align:right;} section.customer .board dl dd {padding:40px 0;} section.customer .board dl dd .content {min-height:360px; line-height:var(--F15LL); color:var(--gray600); font-size:var(--F15);} section.customer .board ul {border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} section.customer .board ul li {line-height:48px; font-size:var(--F15);} section.customer .board ul li + li {border-top:1px solid var(--gray250);} section.customer .board ul li span {float:left; padding-right:50px; min-width:40px; color:var(--gray600);} section.customer .board ul li a {color:var(--gray600);} section.customer .board .submit .btn {width:180px;} /* 고객센터 (e) **********************************************************/ /* FAQ (s) **************************************************************/ .faq .search_wrap {padding-bottom:40px; border-bottom:1px solid var(--gray800);} .faq .search_wrap:after {display:block; clear:both; content:"";} .faq .search_wrap h2 {float:left; width:100px; font-size:19px; color:var(--gray900); line-height:36px; letter-spacing: -1px;} .faq .search_wrap .input_box {float:left; width:770px;} .faq .search_wrap .input_box input {margin-top:0;} .faq .search_wrap .btn {float:right; width:80px; margin-left:10px;} .faq .result_wrap {padding-top:70px;} .faq .result_wrap h2 {font-size:25px; color:var(--gray900); line-height:36px;} .faq .result_wrap .qna_box + h2 {margin-top:80px;} .faq .result_wrap .qna_box h3 {margin-top:80px; font-size:19px; color:var(--gray900); line-height:28px;} .faq .result_wrap .qna_box h3:first-child {margin-top:60px;} .faq .result_wrap .qna_box .accordion {margin-top:20px; border-top:1px solid var(--gray900);} .faq .result_wrap .qna_box .accordion > ul > li {position:relative; padding-left:40px;} .faq .result_wrap .qna_box .accordion .num {position:absolute; top:0; left:0; width:40px; padding:25px 0; font-weight:bold; color:var(--gray800); text-align:left;} .faq .result_wrap .qna_box .accordion div {position:relative;} .faq .result_wrap .qna_box .accordion .title {padding:25px 0 25px 38px; color:var(--gray800); line-height:18px;} .faq .result_wrap .qna_box .accordion .content {padding:12px 0 40px 38px; background-color:var(--white); font-size:var(--F15); color:var(--gray600); line-height:22px;} .faq .result_wrap .qna_box .accordion div i {position:absolute; left:0; font-weight:bold;} .faq .result_wrap .qna_box .accordion .title i {top:25px; color:var(--gray800);} .faq .result_wrap .qna_box .accordion .title {background-position:right -277px;} .faq .result_wrap .qna_box .accordion .title.on {background-position:right -328px;} .faq .result_wrap .qna_box .accordion .content i {top:12px; color:var(--gray600);} .faq .result_wrap .qna_box .accordion .content a {display:inline-block; margin-top:15px; font-weight:bold; font-size:var(--F15); font-weight:bold; color:var(--gray600); line-height:15px;} .faq .result_wrap .qna_info {margin-top:50px; display:flex; align-items: center;} .faq .result_wrap .qna_info p {display:inline-block; line-height:var(--F15LL); color:var(--gray600); font-size:var(--F15);} .faq .result_wrap .qna_info .set-right {display:flex; margin-left:auto; align-items:stretch;} .faq .result_wrap .qna_info .set-right a {align-items: center; margin-left:5px; text-align:center;} /* FAQ (e) **************************************************************/ /* 사이트맵 (s) *********************************************************/ .sitemap .sitemap_wrap {padding:50px 0; border-top:1px solid var(--gray800);} .sitemap .sitemap_wrap .tab {border:none; margin:0 0 15px 0;} .sitemap .sitemap_wrap .tab > li {float:left; width:25%; text-align:left;} .sitemap .sitemap_wrap .tab > li > a {display:inline-block; width:auto; font-weight:bold; font-size:19px; color:var(--gray900); line-height:35px;} .sitemap .sitemap_wrap .tab > li > a.on {border:none; color:var(--purple400);} .sitemap .sitemap_wrap h3 {display:block; font-weight:bold; font-size:19px; color:var(--gray900); line-height:35px;} .sitemap .sitemap_wrap ul {margin-top:20px;} .sitemap .sitemap_wrap ul:after {display:block; clear:both; content:"";} .sitemap .sitemap_wrap ul li {float:left; width:25%; height:35px} .sitemap .sitemap_wrap ul li a {display:inline-block; height:35px; color:var(--gray600); line-height:35px;} .sitemap .sitemap_wrap .list a {font-weight:bold; font-size:19px; color:var(--gray900);} /* 사이트맵 (e) *********************************************************/ /* 매장찾기 (s) *********************************************************/ .find_shop .search_wrap {position:relative; display:flex; flex-wrap: wrap; margin-top:40px; padding:30px 40px 22px; background-color:#f7f7f7; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} h2 + .find_shop .search_wrap {margin-top:36px;} .find_shop .search_wrap.select_size {background-color:#faf7fe;} .find_shop .search_wrap.select_size .select_info {display:inline-block; width:410px; height:38px; line-height:30px;} .find_shop .search_wrap.select_size .select {width:200px;} .find_shop .search_wrap.select_size + .search_wrap {margin-top:10px;} .find_shop .search_wrap .select {width:286px; vertical-align:top;} .find_shop .search_wrap .select + .select {margin-left:7px;} .find_shop .search_wrap > ul {width:100%; margin-top:16px; line-height:var(--F14L); color:var(--gray600); font-size:var(--F14);} .find_shop .result_wrap {position:relative; margin-top:36px;} .find_shop .result_wrap h4 {display:inline-block; font-size:var(--F17); color:var(--gray900); line-height:45px;} .find_shop .result_wrap h4 > em {color:var(--purple400);} .find_shop .result_wrap .option_area {display:inline-block; float:right; vertical-align:top;} .find_shop .result_wrap .list_check {text-align:right;} .find_shop .result_wrap .list_check label {margin-right:0; margin-left:20px; color:var(--gray800); font-weight:bold;} .find_shop .result_wrap .list_check label > em {color:var(--gray600);} .find_shop .result_wrap .result_list > li {position:relative; padding:40px 0; border-bottom:1px solid #d5d5d5;} .find_shop .result_wrap .result_list > li:first-child {border-top:1px solid #d5d5d5;} .find_shop .result_wrap .result_list > li .info {display:table; table-layout:fixed; width:100%;} .find_shop .result_wrap .result_list > li .info > a {display:table-cell; padding-right:38px; vertical-align:middle;} .find_shop .result_wrap .result_list > li .info > a .name {display:block; margin-top:0; font-weight:bold; font-size:var(--F14); color:var(--gray900); line-height:13px;} .find_shop .result_wrap .result_list > li .info > a .name em {display:inline-block; position:relative; margin-left:13px; padding-left:16px; line-height:13px;} .find_shop .result_wrap .result_list > li .info > a .name em:after {position:absolute; top:0; left:0; width:1px; height:13px; background-color:var(--gray900); content:'';} .find_shop .result_wrap .result_list > li .info > a span {display:block; margin-top:15px; font-size:var(--F14); color:var(--gray600); line-height:18px;} .find_shop .result_wrap .result_list > li .info > a .quantity h5 {position:absolute; height:18px; line-height:18px; font-size:var(--F14); color:var(--gray600); font-weight:normal;;} .find_shop .result_wrap .result_list > li .info > a .quantity ul {margin-left:78px;} .find_shop .result_wrap .result_list > li .phone {display:table-cell; width:150px; padding:0 15px; font-size:var(--F14); color:var(--gray600); vertical-align:middle;} .find_shop .result_wrap .result_list > li .service {display:table-cell; width:150px; padding:0 38px; color:var(--gray600); vertical-align:middle;} .find_shop .result_wrap .result_list > li .service span {display:inline-block; padding:0 3px; font-size:var(--F13);} .find_shop .result_wrap .result_list > li .service .on {font-weight:bold; color:var(--gray800);} .find_shop .result_wrap .result_list > li .service .pickup_message {display:block; margin-top:15px;} .find_shop .result_wrap .result_list > li .btn_wrap {display:table-cell; width:110px; vertical-align:middle; text-align:right;} .find_shop .result_wrap .result_list > li .btn_wrap .remote {display:inline-block; padding-right:24px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/13px auto; font-weight:bold; font-size:var(--F14); color:#8e8e8e;} .find_shop .result_wrap .result_list > li .btn_wrap .remote.on {background-image:url(../images/ui/btn_up_gray.svg);} .find_shop .result_wrap .result_list > li .btn_wrap .remote em:last-child {display:none;} .find_shop .result_wrap .result_list > li .btn_wrap .remote.on em:first-child {display:none;} .find_shop .result_wrap .result_list > li .btn_wrap .remote.on em:last-child {display:block;} .find_shop .result_wrap .result_list > li .map_box {display:none; overflow:hidden; height:500px; margin-top:40px;} .find_shop .result_wrap .result_list + .page {margin-top:45px;} .find_shop .result_wrap .none {padding:78px 0; color:var(--gray600); text-align:center; line-height:18px;} .find_shop .result_wrap .map {overflow:hidden; height:560px; padding:40px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;} .find_shop .result_wrap .result_list > li .info .addr {color:var(--gray800);} .find_shop .result_wrap .result_list > li .info .open {margin-top:12px;} .find_shop .result_wrap .result_list > li .info .tel {margin-top:6px;} .find_shop .result_wrap .result_list > li .info .open > i, .find_shop .result_wrap .result_list > li .info .tel > i {display:inline-block; margin:2px 8px 0 0; vertical-align:top; width:14px; height:14px; line-height:14px; background:url("../images/base/bg_component.png") no-repeat;} .find_shop .result_wrap .result_list > li .info .open > i {background-position:-66px -21px;} .find_shop .result_wrap .result_list > li .info .tel > i {background-position:-80px -21px;} .find_shop .result_wrap .result_list > li .info .badge {margin-top:18px; font-size:0;} .find_shop .result_wrap .result_list > li .info .badge > i {display:inline-block; padding:0 9px; height:20px; line-height:var(--F12L); color:var(--white); font-size:var(--F12); border:1px solid var(--gray900); box-sizing:border-box;} .find_shop .result_wrap .result_list > li .info .badge > i + i {margin-left:4px;} .find_shop .result_wrap .result_list > li .info .badge .pickup {background-color:#5f65e3; border-color:#5f65e3;} .find_shop .result_wrap .result_list > li .info .badge .repair {background-color:#313892; border-color:#313892;} .find_shop .result_wrap .result_list > li .info .badge .trade {background-color:#a066d2; border-color:#a066d2;} .find_shop .result_wrap .result_list > li .info .badge .turn {background-color:#da9ce1; border-color:#da9ce1;} .find_shop .result_wrap .result_list > li .info .badge .point {color:var(--purple400); background-color:var(--white); border-color:var(--purple400);} .find_shop .result_wrap .result_list .info .stock {display:table-cell; padding-left:100px; vertical-align:middle;} .find_shop .result_wrap .result_list .info .stock > span {display:block;} .find_shop .result_wrap .result_list .info .stock > span + span {margin-top:10px;} .find_shop .result_wrap .result_list .info .stock a.fold {display:inline-block; margin:2px 0 0 6px; width:16px; height:16px; vertical-align:top; font-size:0; background:url(../images/base/bg_component.png) no-repeat -1px -21px; border:1px solid var(--gray200); box-sizing:border-box;} .find_shop .result_wrap .result_list .info .stock a.fold.on {transform:rotate(180deg);} .find_shop .result_wrap .result_list .info .stock .stock_list {display:none; position:absolute; margin:10px 0 0 45px; padding:20px; background:var(--white); border:1px solid var(--gray250);} .find_shop .result_wrap .result_list .info .stock .stock_list h5 {color:var(--gray900); font-size:var(--F17);} .find_shop .result_wrap .result_list .info .stock .stock_list > ul {margin-top:16px;} .find_shop .result_wrap .result_list .info .stock .stock_list > ul > li {line-height:30px;} .find_shop .result_wrap .result_list .info .stock .stock_list > ul > li > span {display:inline-block; width:80px; color:var(--gray800);} .find_shop .result_wrap .result_list .info .stock .stock_list > ul > li > em {display:inline-block; width:70px; color:var(--gray600);} .find_shop .result_wrap .result_list .info .stock .stock_list .close {background:url(../images/base/bg_base.png) no-repeat right -506px;} .find_shop .result_wrap .result_list .info .btn_wrap .btn + .remote {margin-top:10px;} .shop .brand_sel {position:relative; z-index:3;} .shop .brand_sel .select {margin-top:0; width:600px;} .shop .brand_sel .select h3 {font-size:39px; color:var(--gray900); line-height:40px;} .shop .brand_sel .select h3 a {display:inline-block; position:relative; padding-right:42px;} .shop .brand_sel .select h3 a:after {position:absolute; top:50%; right:0; margin-top:-6px; width:23px; height:13px; background:url(../images/ui/btn_down.svg) no-repeat left top/23px auto; content:'';} .shop .brand_sel .select.over h3 a:after {background-position:0 0;} .shop .brand_sel .select .option {top:36px;} .shop .brand_sel .select.over .option > ul {margin-top:10px;} .shop .search_wrap {position:relative; z-index:2; margin-top:70px;} .shop .search_wrap .select {margin:0 8px 0 0; width:218px; vertical-align:top;} .shop .search_wrap .select label {display:block; color:var(--gray600);} .shop .search_wrap .input_box {display:inline-block; width:368px; margin-right:8px; vertical-align:top;} .shop .search_wrap .input_box input[type="text"] {margin-top:0; color:var(--gray600);} .shop .search_wrap .btn {width:78px; vertical-align:top;} .shop .result_wrap {position:relative; margin-top:40px;} .shop .result_wrap h4 {font-size:19px; color:var(--gray900); line-height:20px;} .shop .result_wrap > .tabs {margin-top:50px;} .shop .result_wrap .tabs .tab li {width:33.33%;} .shop .result_wrap .tabs .sub_tab {display:none;} .shop .result_wrap .tabs .sub_tab.on {display:block;} .shop .result_wrap .option_area {display:block; position:absolute; top:148px; left:0; z-index:1;} .shop .result_wrap .option_area:after {display:block; clear:both; content:"";} .shop .result_wrap .list_check label {margin-right:20px;} .shop .result_wrap .list_check label .tip {display:inline-block; width:20px; height:20px; margin-left:6px; background:url("../images/ui/ico_q.png") no-repeat 0 0; vertical-align:middle;} .shop .result_wrap .list_type {position:relative; padding-top:101px;} .shop .result_wrap .list_type .tab {position:absolute; top:34px; right:0; height:34px; border:0 none; line-height:34px;} .shop .result_wrap .list_type .tab a {display:inline-block; margin-left:25px; font-weight:bold; font-size:var(--F15); color:var(--gray600); line-height:34px;} .shop .result_wrap .list_type .tab .on {color:var(--gray900);} .shop .result_wrap .result_list > li {position:relative; padding:40px 0; border-bottom:1px solid #d5d5d5;} .shop .result_wrap .result_list > li:first-child {border-top:1px solid #d5d5d5;} .shop .result_wrap .result_list > li .info {display:table; table-layout:fixed; width:100%;} .shop .result_wrap .result_list > li .info > a {display:table-cell; padding-right:38px; vertical-align:middle;} .shop .result_wrap .result_list > li .info > a .name {display:block; margin-top:0; font-weight:bold; font-size:var(--F15); color:var(--gray900); line-height:13px;} .shop .result_wrap .result_list > li .info > a .name em {display:inline-block; position:relative; margin-left:13px; padding-left:16px; line-height:13px;} .shop .result_wrap .result_list > li .info > a .name em:after {position:absolute; top:0; left:0; width:1px; height:13px; background-color:var(--gray900); content:'';} .shop .result_wrap .result_list > li .info > a span {display:block; margin-top:15px; font-size:var(--F15); color:var(--gray600); line-height:18px;} .shop .result_wrap .result_list > li .info > a .quantity h5 {position:absolute; height:18px; line-height:18px; font-size:var(--F15); color:var(--gray600); font-weight:normal;} .shop .result_wrap .result_list > li .info > a .quantity ul {margin-left:78px;} .shop .result_wrap .result_list > li .phone {display:table-cell; width:150px; padding:0 15px; font-size:var(--F15); color:var(--gray600); vertical-align:middle;} .shop .result_wrap .result_list > li .service {display:table-cell; width:150px; padding:0 38px; color:var(--gray600); vertical-align:middle;} .shop .result_wrap .result_list > li .service span {display:inline-block; padding:0 3px; font-size:var(--F14);} .shop .result_wrap .result_list > li .service .on {font-weight:bold; color:var(--gray800); /*color:var(--purple400);*/} .shop .result_wrap .result_list > li .service .pickup_message {display:block; margin-top:15px;} .shop .result_wrap .result_list > li .btn_wrap {display:table-cell; width:110px; vertical-align:middle; text-align:right;} .shop .result_wrap .result_list > li .btn_wrap .remote {display:inline-block; padding-right:24px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/13px auto; font-weight:bold; font-size:var(--F15); color:var(--gray600);} .shop .result_wrap .result_list > li .btn_wrap .remote.on {background-image:url(../images/ui/btn_up_gray.svg);} .shop .result_wrap .result_list > li .btn_wrap .remote em:last-child {display:none;} .shop .result_wrap .result_list > li .btn_wrap .remote.on em:first-child {display:none;} .shop .result_wrap .result_list > li .btn_wrap .remote.on em:last-child {display:block;} .shop .result_wrap .result_list > li .map_box {display:none; overflow:hidden; height:250px; margin-top:40px;} .shop .result_wrap .result_list + .page {margin-top:45px;} .shop .result_wrap .none {padding:78px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; font-size:var(--F15); color:var(--gray600); text-align:center; line-height:18px;} .shop .result_wrap .map {overflow:hidden; height:560px; padding:40px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;} /* 매장찾기 (e) *********************************************************/ /* 회원가입 (s) *********************************************************/ .join {width:520px; margin:0 auto;} .join.full {width:960px} .join .tabs .tab li {width:50%;} /* 회원가입 > 유형선택 */ .join .select_type {display:inline-block; width:100%; text-align:center;} .join .select_type a {display:inline-block; padding:55px 40px; width:355px; text-align:left; color:var(--white);} .join .select_type a.member {background:var(--gray800);} .join .select_type a.online {margin-left:20px; background:#8e8e8e;} .join .select_type a em {display:block; line-height:26px; font-size:19px;} .join .select_type a span {display:block; margin-top:10px; line-height:36px; font-size:29px; font-weight:bold;} .join .select_type .list_wrap ul {display:inline-block; width:435px; text-align:left; vertical-align:top;} .join .select_type .list_wrap ul + ul {margin-left:20px;} .join .select_member {width:100%;} .join .select_member td {padding:56px 40px; text-align:left; vertical-align:top; border:1px solid var(--gray250);} .join .select_member td:first-child {border-right-color:var(--gray200);} .join .select_member td h4 {color:var(--gray900); font-size:29px;} .join .select_member td h4 small {display:block; margin-bottom:20px; color:var(--gray600); font-size:19px;} .join .select_member td .submit {margin-top:40px; text-align:left;} .join .select_member td .submit .btn {display:inline-block; padding:0 25px; width:auto; min-width:86px; height:48px; line-height:48px; text-align:center; font-size:var(--F16); font-weight:bold;} .join .select_member td .submit .btn.lbk {color:var(--gray900);} .join .select_member td .list_wrap {margin-top:32px;} .join .select_member + .benefit {margin-top:40px;} .join .select_member + .benefit > div {border-top:0;} .join .benefit {margin-top:90px;} .join .benefit > div {display:block; border-top:1px solid var(--gray250);} .join .benefit > div h3 {display:inline-block; vertical-align:top; margin:56px 0 0 40px; width:290px; color:var(--gray900); font-size:23px;} .join .benefit > div h3 em {display:block; margin-bottom:5px; color:var(--gray800); line-height:20px; font-size:var(--F15);} .join .benefit > div ul {display:inline-block; margin:30px 0;} .join .benefit > div ul li {display:table; width:600px; padding:30px 0;} .join .benefit > div ul li img {display:inline-block; width:164px; height:94px;} .join .benefit > div ul li img + img {margin-top:10px;} .join .benefit > div ul li div {display:table-cell; width:388px; vertical-align:middle;} .join .benefit > div ul li div p {color:var(--gray800); line-height:26px; font-size:19px; padding-bottom:6px;} .join .benefit > div ul li div span {color:var(--gray600); line-height:20px; font-size:var(--F15); font-weight:normal;} .join .benefit > div > p {display:inline-block; margin:24px 0 0 320px; line-height:22px; color:var(--gray600);} .join .benefit > div > a.btn {display:inline-block; margin:15px 0 0 320px;} .join-gateway { width:520px; margin:0 auto; } .join-gateway .logo {padding:0 0 25px 0; text-align:center;} .join-gateway h2 {line-height: 32px; font-size:var(--F21); font-weight:bold;} .join-gateway .intro h2 {text-align:center;} .join-gateway .intro > p {font-size:var(--F14); line-height:22px; padding:30px 0 25px 0; text-align:center;} .join-gateway .intro > p strong {font-size:18px; color:var(--gray900);} .join-gateway .intro > p + p {margin-top:10px} .join-gateway .way {display:flex; width: calc(100% + 16px); margin-left:-8px; padding-bottom:40px;} .join-gateway .way.case {width:100%; margin:0; flex-wrap: wrap;} .join-gateway .way a {flex:1; margin:0 8px; height:70px; line-height:68px; text-align:center; font-size:var(--F17);} .join-gateway .way.case a {flex:none; margin:0; width:100%; } .join-gateway .way.case a + a {margin-top:20px;} .join-gateway .way a:before {display:inline-block; vertical-align:middle; content:'';} .join-gateway .way a.kakao {background:#fee100; border:1px solid #fee100} .join-gateway .way a.kakao:before {width:32px; height:68px; margin-right:10px; background:url(../images/ui/logo_kakao.png) no-repeat center center; } .join-gateway .way a.phone {border:1px solid var(--gray250);} .join-gateway .way a.phone:before {width:21px; height:68px; margin-right:10px; background:url(../images/ui/ic_mobile.png) no-repeat center center } .join-gateway .rules {padding:20px 0 30px; border-top:1px solid var(--gray250);} .join-gateway .rules a {display:block; height:55px; line-height:55px; font-size:19px; font-weight:bold; color:var(--gray900); padding-right:20px; background:url(../images/ui/btn_down.svg) no-repeat right center/12px auto;} .join-gateway .rules a.on {background-image:url(../images/ui/btn_up.svg)} .join-gateway .rules #agree_membership {margin-top:0;} .join-gateway .img {padding:0 0 40px;} .join-benefit{position:relative; padding-top:33px; border-top:1px solid var(--gray250);} .join-benefit h2 {line-height: 32px; font-size: 19px; color:var(--gray900); font-weight:bold;} .join-benefit ul {padding-top:27px;} .join-benefit li {display:flex; align-items: center; padding:0 0 35px 0; font-size:var(--F15); line-height:22px;} .join-benefit li img {width:auto; margin-right:60px;} .join-benefit li span {display:block; font-size:var(--F17); line-height:25px; margin-bottom:10px; font-weight:bold;} .join-benefit li em {color:var(--purple400); font-weight:bold;} .join-benefit a.more {position:absolute; right:0; top:40px; display:inline-block; padding-right:15px; font-size:var(--F15); color:var(--gray600); background:url(../images/ui/btn_next_gray.svg) no-repeat right center/ 7px auto;} .join-benefit.case {padding:35px 0 8px; background:#faf7fe; border-top:1px solid #efeaf5; border-bottom:1px solid #efeaf5} .join-benefit.case h2 {line-height:var(--F17LL); font-size:var(--F17); text-align:center; font-weight:normal;} .join-benefit.case h2 span {font-weight:bold; font-size:19px;} .join-benefit.case ul {padding-top:35px;} .join-benefit.case li img {margin-left:50px;} .join-benefit.case .submit {margin-top:32px;} /* #220535:20231106 회원가입 완료 start */ .join-end > *:not(:first-child) {margin-top:30px;} .join-end .submit {width: calc(100% + 10px);} .join-end .submit.half .btn {flex: 1; margin: 0 5px; min-width:auto; padding:0;} .join-end .submit.full {width:100%; margin-top:40px;} .join-end .submit.full .btn {width:100%; margin:0px;} .join-end .join-welcome {width:456px; margin:0 auto;} .join-end .join-welcome .greeting {display:flex; flex-wrap:wrap; justify-content:center; width:100%; background:var(--gray100); border-radius:var(--radius);} .join-end .join-welcome .greeting dl.account {display:grid; grid-template-columns:auto 1fr; justify-content:center; gap:16px 10px; padding:30px 0;} .join-end .join-welcome .greeting dl.account dt {width:auto; padding:0px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray600); text-align:right; box-sizing:border-box;} .join-end .join-welcome .greeting dl.account dd {width:auto; padding:0px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:bold; text-align:left; box-sizing:border-box;} /* #239628(s) */ .join-end .join-welcome .marketing-agree-result {padding:20px 0;} .join-end .join-welcome .marketing-agree-result p {font-size:var(--F17); color:var(--gray900); line-height:var(--F17L);} .join-end .join-welcome .marketing-agree-result p + .agree, .join-end .join-welcome .marketing-agree-result p + .disagree {margin-top:8px;} .join-end .join-welcome .marketing-agree-result .agree, .join-end .join-welcome .marketing-agree-result .disagree {margin-top:4px;} .join-end .join-welcome .marketing-agree-result div span {font-size:var(--F15); color:var(--gray500); line-height:var(--F15L);} .join-end .join-welcome .marketing-agree-result div em {font-size:var(--F15); color:var(--gray500); line-height:var(--F15L);} .join-end .join-welcome .marketing-agree-result .agree span, .join-end .join-welcome .marketing-agree-result .agree em {color:var(--gray900);} /* #239628(e) */ /* #261570(s) */ .join-end .join-membership {width:1164px; margin:0 auto;} .join-end .join-membership .join-info {display:flex; flex-direction:column; align-items:center; justify-content:center;} .join-end .join-membership .join-info .join-box {padding:30px; width:456px; background-color:var(--gray100); border-radius:var(--radius); box-sizing:border-box;} .join-end .join-membership .join-info .join-box dt {display:flex; align-items:center; gap:0 10px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray600);} .join-end .join-membership .join-info .join-box dt span {color:var(--gray900); font-weight:700;} .join-end .join-membership .join-info .join-box dd {margin-top:2px; font-size:var(--F15); line-height:var(--F15L); color:var(--gray600);} .join-end .join-membership .join-info .join-box dt + dd {margin-top:10px;} .join-end .join-membership .join-info .join-id {display:flex; align-items:center; justify-content:space-between; margin-top:40px; width:456px;} .join-end .join-membership .join-info .join-id .id-label {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .join-end .join-membership .join-info .join-id .id-input {display:flex; flex:1; gap:0 6px; justify-content:flex-end;} .join-end .join-membership .join-info .join-id .id-input .input_box {width:230px;} .join-end .join-membership .join-info .join-id .id-input .btn {width:104px;} .join-end .join-membership .join-wrap {margin-top:80px;} .join-end .join-membership .join-info + .join-wrap {margin-top:60px;} .join-end .join-membership .join-info .submit.full {max-width:456px;} .join-end .join-membership .join-wrap .join-inner {height:auto; margin-top:0;} .join-end .join-membership .join-wrap:last-child .line-title {border-top:1px solid var(--gray250);} .join-end .join-membership .join-wrap .join-inner .coupon-item {display:flex; align-items:center; justify-content:center; gap:0 24px;} .join-end .join-membership .join-wrap .join-inner .coupon-item a {display:flex; width:338px; height:135px;} .join-end .join-membership .join-wrap .join-inner .coupon-item a.coupon-basic {background-image:url(../images/mypage/img_coupon_bg01.png);} .join-end .join-membership .join-wrap .join-inner .coupon-item a.coupon-special {background-image:url(../images/mypage/img_coupon_bg02.png);} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-left {display:flex; flex:1; flex-direction:column; gap:16px 0; padding:20px;} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-left .coupon-title {font-size:var(--F15); line-height:var(--F15L); color:var(--white); font-weight:700;} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-left .coupon-value {font-size:52px; line-height:58px; color:var(--white); font-weight:700; letter-spacing:-1.04px;} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-right {display:flex; align-items:center; justify-content:center; width:102px;} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-right span {display:flex; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L); color:var(--white);} .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-right span::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .join-end .join-membership .join-wrap .join-inner .coupon-item a .coupon-right span::after { background-color:var(--white); --url:url(../images/uxui/icon/chevron_right.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } } .join-end .join-membership .line-title {display:flex; align-items:center; gap:0 8px; width:100%; height:74px; border-top:1px solid var(--gray900); position:relative;} .join-end .join-membership .line-title h3 {font-size:var(--F20); font-weight:400; line-height:var(--F20L); color:var(--gray900); padding:23px 0 24px;} /* #229687 멤버십 가입혜택 start */ .join-end .join-membership .join-inner {display:flex; gap:0 24px; justify-content:center; margin-top:20px; width:100%; height:70px;} .join-end .join-membership .join-inner .desc {display:flex; gap:0 12px; align-items:center; width:338px;} .join-end .join-membership .join-inner .desc .thum {max-width:120px;} .join-end .join-membership .join-inner .desc dl {display:flex; flex-direction:column; gap:4px 0; width:100%;} .join-end .join-membership .join-inner .desc dl dt {font-size:var(--F15); line-height:var(--F15L); font-weight:700;} .join-end .join-membership .join-inner .desc dl dd {font-size:var(--F14); line-height:var(--F14LL); font-weight:400; color:var(--gray600);} /* //#229687 멤버십 가입혜택 end */ /* #220535:20231106 회원가입 완료 end */ /* #261570(e) */ /* #218430 추천아이디 */ .join-end .recommend{display: flex; align-items: center; justify-content: center; margin-top:20px;} .join-end .recommend p{width:118px;font-size:var(--F15);line-height: var(--F15L);} .join-end .recommend .with-btn{display: flex; align-items: center; gap: 0 6px; } .join-end .recommend button.btn.lg.active{border: 1px solid var(--gray900); width:102px;} /* //#218430 추천아이디 */ .greeting p {padding-bottom:20px; line-height:32px; font-size:var(--F20); font-weight:bold; color:var(--gray900); text-align:center;} /* 로그인 & 비회원(주문조회) */ .join small {font-size:var(--F14); line-height:22px;} .join .link {margin-top:40px; border-top:1px solid var(--gray250);} .join .link .submit {margin-top:30px;} .join .link .submit a {display:inline-block; height:14px; line-height:14px; color:var(--gray800); font-size:var(--F15);} .join .link .submit a + a {margin-left:30px; padding-left:30px; border-left:1px solid var(--gray250);} .join .nonmember {margin-top:35px;} .join .nonmember p {display:inline-block; width:343px; padding-top:5px; line-height:20px; color:var(--gray600); font-size:var(--F13);} .join .nonmember .submit {margin-top:0; float:right; } .join .nonmember .submit a { width:162px; min-width:auto; height:50px; margin:0; line-height:48px; font-size:var(--F15); color:var(--gray800); padding:0; border-color:var(--gray250);} .center_info {margin-top:40px; padding:23px 0; background-color:#f7f7f7; color:#5e5e5e; text-align:center;} .center_info span {display:inline-block; margin-right:16px; padding-left:24px; background:url("../images/ui/bg_phone.png") no-repeat 0 center;} /* 아이디 & 비밀번호 찾기 */ .join .serach_wrap {margin-top:70px; padding-bottom:18px;} .join .serach_wrap:after {display:block; clear:both; content:"";} .join .serach_wrap h4 {font-size:19px; color:var(--gray900); font-weight:bold;} .join .serach_wrap p {margin-top:14px; color:var(--gray600); line-height:22px;} .join .serach_wrap .search_id {float:left; width:342px; } .join .serach_wrap .search_id ul {margin-top:14px;} .join .serach_wrap .search_id ul li {color:var(--gray800); line-height:22px;} .join .serach_wrap .search_pw {float:left; width:342px; padding-top:20px;} .join .serach_wrap .submit {margin-top:0; float:right;} .join .serach_wrap .submit a.btn {width:104px; min-width:auto; padding:0; height:78px; font-size:var(--F17); line-height:78px;} .join .serach_wrap .submit a.btn.big {height:119px; line-height:119px;} /* 회원가입 정보입력 */ .form_wrap.edit {width:640px; margin-left:0; margin-right:0;} .form_wrap.edit .row {padding-left:140px;} .form_wrap.change {width:520px; padding-left:100px} .form_wrap.change .row {padding-left:120px;} .form_wrap:not(.edit) .row.case {padding-left:0;} .form_wrap .row {position:relative; padding-left:102px; margin-top:30px; } .form_wrap .row .input_box, .form_wrap .row .input_select {display:flex; flex:1; flex-wrap: wrap; } .form_wrap .row .input_box + .input_box {margin-top:8px;} .form_wrap .row > .label, .form_wrap .row > label {position:absolute; left:0; top:9px; display:block; line-height:22px; font-size:var(--F15);} .form_wrap .row .btn {margin-left:10px; line-height:38px;} .form_wrap .row .select {flex:none; width:120px; height:40px; padding:0 0 0 10px; border:1px solid var(--gray250); margin-right:5px; } .form_wrap .row .select label {border:none; padding:8px 20px 8px 0;} .form_wrap .row > label.required:after { display: inline-block; width: 5px; height: 5px; vertical-align: top; margin: 0 0 0 4px; border-radius: 50%; background: var(--purple400); content: '';} .form_wrap .row .input_select ul {top:40px;} .form_wrap .row .remote {display:block; padding:4px 0; font-size:var(--F14); line-height:22px; background: url(../images/ui/btn_down.svg) no-repeat right center / 12px auto;} .form_wrap .row .remote.case {font-size:18px;} .form_wrap .row .remote.on {background-image:url(../images/ui/btn_up.svg);} .form_wrap .row .ad-channel-box .list_wrap {padding:18px 0 0 0;} .form_wrap .row .list_wrap {padding:15px 0;} .form_wrap .row input[type="text"], .form_wrap .row input[type="password"], .form_wrap .row input[type="number"], .signIn input[type="text"], .signIn input[type="password"] {flex:1; height:40px; line-height:38px; padding:0 20px; box-sizing:border-box; border:1px solid var(--gray250);} .form_wrap > p {margin:10px 0 5px; color:var(--gray900); font-size:var(--F14);} .form_wrap dl.row {display:flex; padding:0 !important; align-items: center;} .form_wrap dl.row dt {flex:0 1 auto; display:flex; align-items: center; padding-right:20px; line-height:22px; font-size:var(--F14); min-height:40px;} .form_wrap dl.row dd {flex:0 1 auto; min-height:40px; display:flex; align-items: center;} .form_wrap.option {padding-top:10px; border-top:1px solid #d5d5d5;} .form_wrap.option .checkbox label {position:relative; margin-right:0;} .form_wrap.option .checkbox .dis-check + label {min-width:auto; padding-right:34px !important;} .form_wrap.option .checkbox .remote {position:absolute; top:0; right:0; width:34px; height:34px; background:url(../images/ui/btn_down.svg) no-repeat 10px center / 12px auto; vertical-align:top} .form_wrap.option .checkbox .remote.on {background-image:url(../images/ui/btn_up.svg) } .form_wrap.option .checkbox.all-group label {padding-right:0;} .form_wrap.option .checkbox.dis-group {display:block;} /* #183386 이용약관동의 개선 */ .form_wrap .row.terms-area {margin-top:40px; padding:0} .form_wrap .row.terms-area > h2 {color:var(--black);} .form_wrap .row.terms-area .tit.checkbox label {margin-top:11px; font-size:var(--F15); line-height:var(--F15L); color:var(--black);} .form_wrap .terms-bx {margin-top:14px; padding:16px 0; border:1px solid var(--gray250);} .form_wrap .terms-bx > ul > li {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; margin-bottom:12px; padding:0 16px;} .form_wrap .terms-bx > ul > li:last-child {margin-bottom:0} .form_wrap .terms-bx > ul > li label {padding:0; color:var(--gray600); line-height:20px;} .form_wrap .terms-bx > ul > li a[role="button"] {width:16px; height:16px; padding:2px 0; background:url(../images/svgs/chevron-down-16.svg) center / 16px auto no-repeat;} .form_wrap .terms-bx > ul > li a[role="button"].on {background-image:url(../images/svgs/chevron-up-16.svg);} .form_wrap .terms-bx #agree_online, .form_wrap .terms-bx #agree_privacy, .form_wrap .terms-bx #agree_membership {margin:10px -16px 0} .form_wrap .row.option {margin-top:40px; padding:0;} /* #234158(s) */ .form_wrap .row.option .option_header {display:flex;} .form_wrap .row.option .option_header .checkbox {flex:1; font-weight:bold;} .form_wrap .row.option .option_header .option-title {font-size:var(--F15); font-weight:bold; color:var(--gray900); line-height:var(--F15L);} /* #266166 */ .form_wrap .row.option .check_row:not(:first-child) {margin-top:12px;} .form_wrap .row.option .check_row .list_wrap li {position:relative; text-indent:0;} .form_wrap .row.option .check_row .list_wrap li:before {position:absolute; top:8px; left:0; width:3px; height:3px; border-radius:50%; content:""; background-color:var(--gray600);} .form_wrap .row.option .remote.case {width:24px; height:24px; padding:0; background:url(../images/svgs/chevron-down-16.svg) right center / 16px auto no-repeat; font-size:var(--F15); line-height:var(--F15L); color:var(--black); font-weight:bold} /* #234158(e) */ .form_wrap .row.option .remote.case.on {background-image:url(../images/svgs/chevron-up-16.svg);} .form_wrap .row.option .ad-channel-box {padding:0 16px 16px; border:none; background:#F6F6F6} /* #234158 */ .form_wrap .row.option .ad-channel-box > p {margin-top:0; color:var(--gray900);} .form_wrap .row.option .ad-channel-box .cssf {color:var(--purple500)} .form_wrap .row.option .ad-channel-box label {margin-right:15px; padding:0; color:var(--black); line-height:20px;} .form_wrap .row.option .ad-channel-box label > i {margin-right:8px} .form_wrap .row.option .ad-channel-box .point {color:var(--purple500)} .form_wrap .row.option .ad-channel-box .bold {font-weight:bold;} /* #234158 */ .form_wrap .row.option .ad-channel-box .list_wrap li {margin-bottom:4px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600)} .form_wrap .row .radio > label {margin-right:18px; color:var(--gray600)} .join .form_wrap .fin_check {display:none;} .join .form_wrap.valid_fbook .submit, .join .form_wrap.valid_naver .submit, .join .form_wrap.valid_kakao .submit {display:none;} .join .form_wrap.valid_fbook .facebook, .join .form_wrap.valid_naver .naver, .join .form_wrap.valid_kakao .kakao {display:block;} .join .form_wrap.option > h4 {margin-bottom:16px; display:flex; justify-content: space-between;} .join .form_wrap.option > ul {margin-top:0; padding:0 0 40px; border-top:0; border-bottom:1px solid var(--gray250);} .join .form_wrap.option > ul > li .item {vertical-align:top; color:var(--gray800);} .join .form_wrap.option > ul > li .list_wrap {margin-top:12px; color:var(--gray600);} .join .form_wrap.option > ul > li p {color:var(--gray600);} .join .form_wrap.option > ul > li small {float:right; color:var(--gray600); font-size:var(--F13);} .join .form_wrap .fin_check {padding:25px 0 10px 0; text-align:center;} .join .form_wrap .fin_check span {display:inline-block; height:16px; padding-left:32px; background:url("../images/ui/bg_fin_check.svg") no-repeat 0 center; background-size:22px auto; color:var(--gray800); line-height:16px;} .join .form_wrap .link_right {margin-top:36px; letter-spacing:-1px;} .join .form_wrap .link_right a {float:right; color:var(--gray600);} .join .form_wrap .link_right + .list_wrap {margin-top:15px;} .join .form_wrap {margin-top:70px; padding-top:0; border:0 none;} .join .form_wrap:after {display:block; clear:both; content:"";} .join .form_wrap > ul > li .checkbox .dis-check + label {color:var(--gray800); line-height:26px; font-size:var(--F16); font-weight:bold; text-decoration:underline;} .join.form_wrap .submit {margin-top:60px;} /* #266166 */ .join .agree_terms {margin-top:60px; text-align:center;} .join .agree_terms .submit {width:100%; text-align:center;} #agrees_offer, #agrees_elctrn, /*157817*/ #agree_online, #agree_privacy, #agree_membership, #agree_auto_buying, #agree_address {margin-top:20px; height:150px; text-align:left; background:var(--gray150); overflow-y:auto;} #agree_marketing {margin:10px 0; height:150px; text-align:left; background:var(--gray150); overflow-y:auto;} /*임직원용 회원가입 완료*/ .join.full .fin_wrap h2 {margin-top:106px; text-align:center; font-size:25px; color:var(--gray900); line-height:36px;} .join.full .fin_wrap .sub_txt {margin-top:5px; text-align:center; font-size:var(--F17); color:var(--gray600);} .join.full .fin_wrap .info_center {margin-top:20px; text-align:center;} .join.full .fin_wrap .info_center strong {display:block; font-size:var(--F21); color:var(--gray900); line-height:36px; font-weight:bold;} .join.full .fin_wrap .info_center .txt_coupon {display:block; margin-top:12px; font-size:var(--F15); color:var(--gray600); line-height:18px;} .join.full .fin_wrap .info_center .txt_coupon > span {display:block;} .join.full .fin_wrap .info_center .noti {line-height:38px;} .join.full .fin_wrap .info_center .submit {margin-top:56px;} .join.full .fin_wrap .info_center .submit > span {display:inline-block; position:relative; padding-bottom:20px;} .join.full .fin_wrap .info_center .submit > span > a {margin-left:8px; color:var(--gray900); font-weight:bold; border-color:var(--gray900);} .join.full .fin_wrap .info_center .submit > span > a + em {display:block; position:absolute; margin-top:5px; right:0; width:380px; color:var(--purple400); text-align:right; font-weight:bold;} .join.full .fin_wrap .mem-class {font-weight:bold;} .join.full .fin_wrap .mem-class i.badge {vertical-align:text-bottom;} .join.full .fin_wrap .gray_box {display:inline-block; margin-top:40px; padding:25px 113px; line-height:24px;} .join.full .coupon_wrap {margin-top:120px; font-size:var(--F15);} .join.full .coupon_wrap ul {border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} .join.full .coupon_wrap ul:after {display:block; clear:both; content:"";} .join.full .coupon_wrap li {float:left; width:50%; padding:40px 0 40px 40px; box-sizing:border-box;} .join.full .coupon_wrap li a {display:flex; align-items: center;} .join.full .coupon_wrap li img {width:auto;} .join.full .coupon_wrap li span {margin-left:16px; width:225px; color:var(--gray800); vertical-align:middle;} .join.full .coupon_wrap .btns {margin-top:20px; text-align:right;} /* 임직원용 회원가입 완료 */ .inner-wrap .lnb ~ section.signIn {padding-left:100px; margin:0} .signIn {width:520px; margin:0 auto} .signIn .tabs .tab li {width:50%;} .signIn .tabs .tab > li > a {color:var(--gray900); border-color:var(--gray900);} .signIn .tabs > div {padding-top:60px;} .signIn .input_box ~ .input_box {margin-top:10px;} .signIn .signIn-form + p.txt {flex:none; width:100%; margin:25px 0 5px; color:var(--gray900); font-size:var(--F15);} .signIn .invalid-txt, .signIn .valid-txt {padding-right:140px;} .signIn .save_id {height:20px; margin-top:20px;} .signIn .link {display:flex; justify-content: space-around; height:35px; padding:20px 50px; margin-top:40px; background:#f7f7f7;} .signIn .link a { line-height:35px;} .signIn a.facebook, .signIn a.naver, .signIn a.kakao {display:inline-block; padding-left:25px; height:35px; line-height:35px; color:var(--gray800); font-weight:bold;} .signIn a.facebook {background:url("../images/ui/bg_facebook.png") no-repeat 0 center;} .signIn a.naver {background:url("../images/ui/bg_naver.png") no-repeat 0 center;} .signIn a.kakao {background:url("../images/ui/bg_kakao.png") no-repeat 0 center;} .signIn a.facebook.box, .signIn a.naver.box, .signIn a.kakao.box {display:inline-block; margin:0 10px; padding-left:42px; height:32px; line-height:32px; color:var(--gray800); background:url("../images/ui/bg_sns.jpg") no-repeat; font-size:var(--F13); font-weight:bold;} .signIn a.kakao.box {background-position:0 0;} .signIn a.facebook.box {background-position:0 -32px;} .signIn a.naver.box {background-position:0 -64px;} .signIn-form {display:flex; align-items: stretch; justify-content: stretch; flex-wrap: wrap;} .signIn-form > div {flex:1;} .signIn-form button {width:138px; padding:0 10px; margin-left:20px; background:var(--gray900); color:var(--white); font-size:var(--F17); line-height:22px; text-align:center;} .login_sns {padding-top:55px;} .login_sns dt {position:relative; text-align:Center; } .login_sns dt span {position:relative; display:inline-block; padding:0 19px; line-height:28px; font-size:19px; background:var(--white);} .login_sns dt:before {position: absolute; display: inline-block; left: 0; top: calc(50% - 1px); width: 100%; height: 1px; background: var(--gray250); content:''; } .login_sns dd {display:flex; justify-content: space-around; padding:35px 60px 40px; } .signIn input[type="text"], .signIn input[type="password"] {flex:1; height:40px; line-height:38px; padding:0 20px; box-sizing:border-box; border:1px solid var(--gray250);} .signIn .form_wrap {width:600px} .signIn .form_wrap .row {padding:0;} .signIn .form_wrap .row input[type="text"], .signIn .form_wrap .row input[type="password"], .signIn .signIn-form input[type="text"], .signIn .signIn-form input[type="password"] {height:50px; line-height:48px; } .signIn .submit {position:relative; width:calc(100% + 8px); left:-4px; } .signIn .submit .btn {flex:1; min-width:auto;} .signIn .login_sns + .submit{margin:0;} .other-cert {padding-top:30px;} .other-cert dt {position:relative; text-align:center; } .other-cert dt span {position: relative; display: inline-block; padding: 0 10px; font-size:var(--F17); color: var(--gray600); line-height: 36px; background: var(--white);} .other-cert dt:before {position: absolute; display: inline-block; left: 0; top: calc(50% - 1px); width: 100%; height: 1px; background: var(--gray250); content:'';} .other-cert dd {padding-top:30px;} .other-cert dd a {display:block; height:60px; line-height:60px; font-size:var(--F17); color:var(--gray900); text-align:center; background-color:var(--gray250);} .get-account-info .submit {margin-top:40px; justify-content: space-between;} .get-account-info p.txt {font-size:var(--F21); padding-bottom:37px; color:var(--gray900);} .get-account-info p.account {padding:25px; text-align:center; color:var(--gray800); font-size:var(--F17); background:#f7f7f7;} .get-account-info .account-list {padding:32px 128px; background:#f7f7f7;} .get-account-info .account-list li {display:flex; line-height:34px; justify-content:space-between;} .get-account-info .account-list .account-id {font-size:var(--F17); color:var(--gray900);} .get-account-info .account-list .join-date {font-size:var(--F14); color:var(--gray600);} .cert-modify-wrap {width:460px !important;} .cert-modify-wrap .form_wrap {margin:0 !important;} .cert-modify-wrap .input_box {flex-wrap: wrap;} .cert-modify-wrap .form_wrap .row {padding:0;} .cert-modify-wrap .form_wrap .row label {position:static; width:100%; font-size:var(--F15); line-height:34px;} .cert-modify-wrap .valid-status, .cert-modify-wrap .invalid-txt {padding-left:0;} .cert-step {display:flex; height:39px; width:100%;} .cert-step li {flex:1; line-height:35px; font-size:var(--F17); color:var(--gray600); text-align:center; border-bottom:4px solid var(--gray250); } .cert-step li.on {border-color:var(--gray900); font-weight:bold; } .form_wrap > .cert-step-guide {display:flex; align-content: stretch; justify-content: center; margin:0 0 10px; padding:40px; line-height:var(--F17L); font-size:var(--F17); color:var(--purple400); background:#f7f7f7;} .form_wrap > .cert-step-guide:before {display:inline-block; width:30px; vertical-align:top; background:url(../images/base/bg_caution_lite.png) no-repeat center 3px; content:'';} .popup .guiding {padding-top: 25px; padding-bottom:4px; /*background: url(../images/ui/bg_warn.svg) no-repeat 0 0/auto 57px;*/} .popup .guiding h1 {font-size:25px; line-height:32px; color:var(--gray900); padding-bottom:18px; font-weight:normal; border:none;} .popup .guiding p {font-size:var(--F17); line-height:24px; color:var(--gray600); margin:0; padding:0 0 0 0; } .popup .cert-modify-wrap .submit .btn:first-child {margin:0;} .changePW .form_wrap .row .input_box label {font-size:var(--F13); } .cert-modify-wrap .form_wrap .row > label.required:after {margin-top:8px;} .hint {position:absolute; right:-30px; top:11px;} .hint > div {display:none; position:absolute; top:10px; right:-5px; z-index:10; width:445px; margin-top:15px; padding:16px 20px; line-height:22px; font-size:var(--F14); background:#f7eeff; border:1px solid #f0e5fa;} .hint > div:after {display:block; content:''; position:absolute; top:-6px; right:8px; width:8px; height:10px; background:#f7eeff; border-top:1px solid #f0e5fa; border-left:1px solid #f0e5fa; transform:rotate(45deg);} .hint .close {top:0; right:0; background-size:10px auto} .hint p {font-size:var(--F12); line-height:20px;} .hint dt {font-size:var(--F14); font-weight:bold; color:var(--gray900);} .hint dd + dt {padding-top:10px;} .hint dd {padding-top:6px; font-size:var(--F13); line-height:var(--F13LL);} .input_box input.invalid, .input_select input.invalid {border-color:#f0394d !important;} .invalid-txt {flex:none; width:100%; box-sizing:border-box; margin-top:5px !important; color:#f0394d !important} .valid-txt {margin-top:5px !important; color:var(--purple400) !important} .valid-status {width:100%; margin:0; padding-top:5px; } .valid-status span {font-size:var(--F14); color:var(--gray600); margin-right:5px;} .popup .valid-status span {display:block;} .valid-status span:before {display:inline-block; vertical-align:middle; width:15px; height:16px; background:url(../images/ui/bg_fin_check.svg) no-repeat left 2px/12px auto; content:'';} .valid-status span.ok {color:var(--purple400)} .valid-status span.ok:before {background-image:url(../images/ui/bg_fin_check_em.svg);} .ad-channel-box {margin:10px 0; padding:12px 20px 17px; background:#f7f7f7; border:1px solid var(--gray250);} .ad-channel-box > p {margin-top:5px; font-size:var(--F14);} .ad-channel-box > p span {font-size:var(--F12); color:var(--gray600);} .ad-channel-box .checkbox {padding:17px 0 0 0;} .check-box {display:flex; flex-wrap: wrap;} .check-box li {width:50%; padding-bottom:15px;} .inner-wrap .lnb ~ section.addr-list {width:740px} .addr-list li {position:relative; padding:35px 80px 27px 0; border-bottom:1px solid var(--gray250);} .addr-list li.default {border-color:var(--gray900); padding-top:10px;} .addr-list li.default:before {display:inline-block; padding:0 10px; margin-bottom:13px; vertical-align:middle; background:var(--purple400); color:var(--white); font-size:var(--F11); line-height:20px; content:'기본'} .addr-list li .btn.bk {background-color:var(--gray800); margin:6px 0 13px;} .addr-list li .btn:not(.bk) {position:absolute; right:0; top:40px;} .addr-list li.default .btn:not(.black) {top:30px;} .addr-list li p {font-size:var(--F14); line-height:24px; } .addr-list li .name {font-weight:bold; color:var(--gray900);} .addr-list li .address {font-size:var(--F14); line-height:22px; margin-bottom:10px; word-break: break-all; padding-right:85px;} /*//#142595*/ .addr-list .emty {font-size:var(--F15); color:var(--gray600); text-align:center;} .addr-list .emty strong {display:block; font-size:var(--F17); color:var(--gray900); margin-bottom:10px;}/*//#157237*/ .address_list .addr-list li .address {padding-right:0;}/*//#142595*/ .addr_add {width:400px;} .addr_add .agree_terms {overflow:hidden; overflow-y:auto; margin-top: 13px; padding: 0; height: 150px; background:var(--gray150);} /* #218430 */ dl.account {display:flex; flex-wrap:wrap; padding:23px 0; background:var(--gray100); border-radius: var(--radius);} dl.account dt {width:140px;padding:3px 5px 3px 115px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray600); text-align:right;} dl.account dd { padding:3px 0 0 10px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight: bold; text-align:left; } /* //#218430 */ .inner-wrap .lnb ~ section.form_wrap.edit {width:640px !important; margin-left:65px} .inner-wrap .lnb ~ section.manage-myinfo {width:640px !important; margin-left:65px} .manage-myinfo h2 {padding-bottom:11px; font-size:18px; font-weight:bold; border-bottom:1px solid var(--gray250);} .manage-myinfo > ul + h2 {margin-top:60px;} .manage-myinfo .logout {display:inline-block; font-size:var(--F14); margin-top:25px; } .manage-myinfo > ul li {display:flex; justify-content: space-between; align-items: center;} .manage-myinfo ul.account {margin-top:28px;} .manage-myinfo ul.account li { line-height:60px; font-size:var(--F14); border-bottom:1px solid var(--gray250);} .manage-myinfo ul.sns li {height:88px; border-bottom:1px solid var(--gray250);} .manage-myinfo ul.sns li span.naver {font-size:var(--F14); line-height:32px; color:var(--gray900);} .manage-myinfo ul.sns li span.naver:before {display:inline-block; width:32px; height:32px; margin-right:10px; vertical-align:top; background:url(../images/ui/bg_sns.jpg) no-repeat center -64px; content:'';} .manage-myinfo.form_wrap .row.option {border:none; margin:0; padding:0;} /* 회원가입 (e) *********************************************************/ /* 이용약관 (s) *********************************************************/ .terms h2 {font-size:19px; line-height:28px; color:var(--gray900);} .terms .mCS {margin-top:10px; padding:30px; height:560px; text-align:left; background:var(--gray150);} .terms .mCS + h2 {margin-top:50px;} .terms .tabs .tab li {width:50%;} .terms .terms_wrap h2 {margin-top:54px; font-size:var(--F17); color:var(--gray800); line-height:var(--F17LL);} .terms .terms_wrap p, .terms .terms_wrap ol {margin-top:30px; color:var(--gray600); line-height:24px;} .terms .terms_wrap ol em {color:var(--purple400);} .terms .terms_wrap > ul {margin-top:30px;} .terms .terms_wrap > ul > li {position:relative; margin-top:15px; padding-left:10px; color:var(--gray600); line-height:24px;} .terms .terms_wrap > ul > li:after {position:absolute; top:11px; left:0; width:2px; height:2px; background-color:var(--gray600); content:'';} .terms .terms_wrap > ul > li:first-child {margin-top:0;} .terms .terms_wrap > ul ul li {display:block; padding-left:10px; color:var(--gray600);} .terms .terms_wrap > ul ul li:first-child {margin-top:10px;} .terms .terms_wrap > ul ul ul {padding-left:10px;} .terms .terms_wrap > ul ul ul li {position:relative;} .terms .terms_wrap > ul ul ul li:last-child {margin-bottom:10px;} .terms .terms_wrap > ul ul ul li:after {position:absolute; top:11px; left:0; width:2px; height:2px; background-color:#959595; content:'';} /* #276640:20250618 (s) */ .terms .terms_wrap .agreementMenu {margin:60px 0 30px; padding:30px 0; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);}/* #172748_라벨링제 적용 */ .terms .terms_wrap .agreementMenu ul {margin:0px;} .terms .terms_wrap .agreementMenu ul:after{display:block; clear:both; content:"";} .terms .terms_wrap .agreementMenu li {position:relative; float:left; width:50%; padding-left:10px; box-sizing:border-box; margin-top:12px;} .terms .terms_wrap .agreementMenu li:nth-child(1), .terms .terms_wrap .agreementMenu li:nth-child(2) {margin-top:0px;} .terms .terms_wrap .agreementMenu li a {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); line-height:22px;} /* //#276640:20250618 (e) */ .terms .terms_wrap .agreementMenu li:hover a {color:var(--gray900); font-weight:700;} .terms .terms_wrap .agreementMenu li:after {position:absolute; top:10px; left:0; width:2px; height:2px; background-color:var(--gray600); content:'';} .terms .terms_wrap table {width:100%; margin-top:30px; border-bottom:1px solid #d5d5d5;} .terms .terms_wrap table th, .terms .terms_wrap table td {border-top:1px solid #d5d5d5; line-height:24px; text-align:center;} .terms .terms_wrap table th {padding:16px 0; font-size:var(--F14); color:var(--gray600);} .terms .terms_wrap table td {padding:11px 20px; border-right:1px solid #d5d5d5; font-size:var(--F15); color:var(--gray800);} .terms .terms_wrap table td.txt-left {text-align:left;} .terms .terms_wrap .box {margin:50px 0; padding:40px 65px; border:1px solid var(--gray250) !important; background-color:#f7f7f7;} .terms .terms_wrap .box h3 {font-size:29px; color:var(--gray900); line-height:30px;} .terms .terms_wrap .box span {display:block; margin-top:10px; color:var(--gray900); line-height:14px;} .terms .terms_wrap h3 {/*margin-top:36px;*/ font-size:var(--F15); color:var(--gray800);} .terms .terms_wrap p {margin-top:0;} .terms .agreeContents {margin:0; padding:15px 20px;} .terms .settingList {margin-top:40px; background:var(--gray150); padding:40px; font-size:var(--F16); color:var(--gray700);} .terms .settingList li {line-height:26px;} .terms .settingList li a:hover {color:var(--purple400);} /* 라벨링제 적용 */ /* #276640:20250618 (s) */ .agree_personalPolicy {position:relative; margin-top:40px;} .agree_personalPolicy .select {z-index:9; position:absolute; top:-84px; right:0; width:220px; height:40px;} .agree_personalPolicy .select label {height:28px; display:flex; align-items:center; padding:5px 30px 5px 10px; border-radius:var(--radius);} .agree_personalPolicy .select label em {color:var(--gray500); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .agree_personalPolicy .terms .terms_wrap .labeling {margin-top:30px; padding:30px; background:var(--gray150);} .agree_personalPolicy .terms .terms_wrap .labeling ul {display:flex; gap:0 36px; margin-top:30px; margin-bottom:0px; position:relative;} .agree_personalPolicy .terms .terms_wrap .labeling ul li {position:relative;} .agree_personalPolicy .terms .terms_wrap .labeling ul li .thum {display:flex; justify-content:center; align-items:center; width:120px; height:120px; background:var(--white); border-radius:var(--radius); cursor:pointer;} .agree_personalPolicy .terms .terms_wrap .labeling ul li .thum img {width:81px;} .agree_personalPolicy .terms .terms_wrap .labeling ul li .desc {font-size:var(--F17); line-height:var(--F17L); font-weight:400; color:var(--gray900); text-align:center; margin-top:12px; cursor:pointer;} .agree_personalPolicy .terms .terms_wrap .labeling ul li:hover .desc {font-weight:700;} .agree_personalPolicy .terms .terms_wrap .labeling ul li .more {position:absolute; top:165px; width:460px; background:var(--white); border:1px solid var(--gray900); padding:24px; box-sizing:border-box; display:none;} .agree_personalPolicy .terms .terms_wrap .labeling ul li:hover .more {display:block; z-index:1;} .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(1):hover .more, .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(2):hover .more, .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(3):hover .more, .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(4):hover .more {left:0;} .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(5):hover .more, .agree_personalPolicy .terms .terms_wrap .labeling ul li:nth-of-type(6):hover .more {right:0;} .agree_personalPolicy .terms .terms_wrap .labeling ul li .more .title {font-size:var(--F14); line-height:var(--F14L); font-weight:700; color:var(--gray900);} .agree_personalPolicy .terms .terms_wrap .labeling ul li .more .text {margin-top:12px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray900);} .agree_personalPolicy .terms .terms_wrap .labeling .caption {font-size:var(--F15); line-height:var(--F15LL); color:var(--gray700); margin-top:20px;}/* #174347 수정, #276640:20250618 */ .agree_personalPolicy .terms .terms_wrap .agreeContents {margin:0px; padding:0px;} .agree_personalPolicy .terms .terms_wrap .agreeContents h3 {font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); margin-bottom:12px;} .agree_personalPolicy .terms .terms_wrap .agreeContents > p {font-size:var(--F15); line-height:var(--F15LL); color:var(--gray700);} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board {border:1px solid var(--gray250); margin-top:13px;} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board thead {background:var(--gray150);} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board thead th {font-weight:400; color:var(--gray600);} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board thead + tbody tr td {color:var(--gray700); text-align:left; vertical-align:top;} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board tbody tr th {font-size:var(--F14); line-height:var(--F14LL); font-weight:400 !important; text-align:left; color:var(--gray600); background:var(--gray150); padding-left:11px;} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board tbody tr td {font-size:var(--F14); line-height:var(--F14LL); text-align:left; vertical-align:middle;} .agree_personalPolicy .terms .terms_wrap .agreeContents .tblWrap .tbl_board + p {margin-top:12px;} /* //#276640:20250618 (e) */ /* //#172748_라벨링제 적용 */ /* 이용약관 (e) *********************************************************/ /* 검색 (s) ************************************************************/ /* #190064 start */ /* 20230322 start */ .search .search-top{display:flex;flex-direction:column;align-items:center;} .search .form_input{width:692px;} .search .form_input .input_select{display:flex;justify-content:space-between;width:692px;height:56px;border:1px solid var(--black);box-sizing:border-box;} .search .form_input .input_select input[type=search]{margin:0;padding:12px 55px 12px 20px;width:calc(100% - 50px);font-weight:400;font-size:var(--F24);line-height:var(--F24L);color:var(--black);box-sizing:border-box;outline:0;border:0;} .search .form_input .input_select input[type=text]{margin:0;padding:13px 0 13px 20px;width:calc(100% - 32px);height:54px;line-height:54px;font-weight:400;font-size:var(--F24);color:var(--black);box-sizing:border-box;outline:0;border:0;} .search .form_input .input_select input[type=text]::-webkit-search-cancel-button{position:absolute;right:15px;width:20px;height:20px;background:url(../images/svgs/circle-cancel-fill.svg) right center / 20px auto no-repeat;cursor:pointer;-webkit-appearance:none;} .search .form_input .input_select input[type=search]::-webkit-search-cancel-button{position:absolute;right:15px;width:20px;height:20px;background:url(../images/svgs/circle-cancel-fill.svg) right center / 20px auto no-repeat;cursor:pointer;-webkit-appearance:none;} .search .form_input .input_select input[type=submit]{position:absolute;right:20px;top:50%;transform:translateY(-50%);margin:0;width:32px;height:32px;vertical-align:top;border:0;background:url(../images/uxui/icon/search-32.svg) center / 32px no-repeat;cursor:pointer;} .search .form_input .input_select input[type=submit]:after{display:block;clear:both;content:'';} .search .form_input .input_select ul{left:-1px;top:54px;padding:24px 20px;width:692px;text-indent:0;border-color:var(--gray900);text-align:left;} .search .form_input .input_select ul li{padding:0;margin-top:24px;} .search .form_input .input_select ul li:first-of-type{margin-top:0;} .search .form_input .input_select ul li span{font-weight:normal;color:var(--purple500);} .search .form_input .input_select ul li a:hover span{font-weight:bold;} .search .form_input .input_select ul li a{display:block;padding:0;font-size:var(--F17);line-height:var(--F17L);color:var(--gray900);} .search .form_input .input_select ul li a.on{background-color:var(--gray150);} .search .form_input .radio{display:block;line-height:80px;} .search .search-rel{width:692px;margin-top:10px;} .search .search-rel dl{display:flex;} .search .search-rel dl dt{flex:0 0 auto;margin-right:20px;color:var(--gray500);font-weight:700;font-size:var(--F15);line-height:var(--F15L);} .search .search-rel dl dd{white-space:nowrap;} .search .search-rel dl dd a{display:inline-block;color:var(--gray500);font-weight:400;font-size:var(--F15);line-height:var(--F15L);border-bottom:1px solid var(--gray500);} .search .search-rel dl dd a + a{margin-left:12px;} .search .search-to-ssf{width:692px;margin-top:10px;} .search .search-to-ssf a {white-space: nowrap;} .search .search-to-ssf a span{display:inline-block;position:relative;border-bottom:1px solid var(--gray500);color:var(--gray500);font-weight:400;font-size:var(--F14);line-height:var(--F14L);} .search .search-to-ssf a span::after{content:'';position:absolute;top:4px;right:-14px;width:12px;height:12px;transform:translateY(0);background:url(../images/svgs/chevron-right-12.svg) no-repeat center/12px auto;} .search .search-to-ssf a span em{display:inline-block;margin-right:4px;color:var(--gray900);font-weight:400;font-size:var(--F14);line-height:var(--F14L);} .search .link_brand{display:block;margin-top:0 !important;padding:0 0 60px;} .search .form_input + script + .link_brand{padding-top:0;} .search .link_brand h4{padding-bottom:10px;border-bottom:2px solid var(--gray900);font-weight:700;font-size:var(--F20);line-height:var(--F20L);color:var(--gray900);} .search .link_brand .swiper{margin-top:40px;} .search .link_brand li{max-width:220px;margin-right:16px;} .search .link_brand li a{display:block;} .search .link_brand li .img{position:relative;width:100%;height:0;padding-top:80px;background-color:var(--gray150);border-radius:12px;overflow:hidden;} .search .link_brand li .img:before {content:""; position:absolute; top:0; left:0; z-index:2; width:100%; height:100%; background-color:var(--black); opacity:0.03;} /* #208074 */ .search .link_brand li .img > img{display:block;position:absolute;left:0;top:50%;width:100%;height:100%;transform:translateY(-50%);object-fit:cover;} .search .link_brand li .img .dim{position:absolute;left:8px;bottom:8px;width:24px;height:24px;z-index:1;} .search .link_brand li .img .dim img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px;border:1px solid var(--white);box-sizing:border-box;} /* 20230306 start */ .search .link_brand li .img .text{display:flex;align-items:center;position:absolute;left:0;top:0;width:100%;height:100%;padding:19px 60px;box-sizing:border-box;} .search .link_brand li .img .text span{width:100%;max-height:calc(var(--F15L) * 2);font-size:var(--F15);line-height:var(--F15L);color:var(--gray900);box-sizing:border-box;word-break:break-word;word-wrap:break-word;text-align:center;font-style:normal;font-weight:400;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;} .search .link_brand li .caption{margin-top:10px;font-weight:400;font-size:var(--F14);line-height:var(--F14L);text-align:center;color:var(--gray900);} /* 20230306 end */ .search .link_brand li .caption{margin-top:10px;font-weight:400;font-size:var(--F14);line-height:var(--F14L);text-align:center;color:var(--gray900);} /* 검색 결과 내 탭 */ .search .ssf_tabs{margin-bottom:33px} .search .ssf_tabs > ul{display:flex;justify-content:flex-start;align-items:flex-start;border-bottom:2px solid var(--gray250)} .search .ssf_tabs > ul li{margin:0 32px 0 0;padding-bottom:10px;font-size:var(--F20);line-height:var(--F20L);font-weight:400;} .search .ssf_tabs > ul li:hover > a{color:var(--gray900);} .search .ssf_tabs > ul li.on{position:relative;text-decoration:none;color:var(--gray900);font-weight:700;} .search .ssf_tabs > ul li.on::before{position:absolute;left:0;bottom:-2px;width:100%;height:2px;content:'';background:var(--gray900)} .search .ssf_tabs .search_counts{margin:30px 0 20px;font-weight:400;font-size:var(--F17);line-height:var(--F17L);} /* 검색 결과 상품 */ .search .list_Wrap {margin-top:0 !important;} .search .list_Wrap h1 {padding-bottom:13px; line-height:35px; font-size:27px; font-weight:bold; color:var(--gray900); border-bottom:2px solid var(--gray900);} .search .list_Wrap h1 span {display:inline-block; margin-left:6px; line-height:35px; font-size:27px; font-weight:bold; color:var(--purple400);} .search .list_Wrap h4 {display:inline-block; line-height:36px; font-size:var(--F21); color:var(--gray900); font-weight:normal;} .search .list_Wrap h4 span em {margin-left:10px; color:var(--purple400); font-weight:bold;} .search .list_Wrap .god-lists .nodata{display:flex;align-items:center;justify-content:center;height:300px;margin:0;padding:0;background:var(--gray150);font-size:var(--F17);line-height:var(--F17L);color:var(--gray700);} @supports (display:grid) and (column-gap: 16px) { .search .list_Wrap .god-lists > ul{display:grid;grid-template-columns:repeat(6,1fr);margin:0;column-gap:16px;row-gap:40px;} .search .list_Wrap .god-lists .list-col-6 .god-item{width:auto;max-width:none;padding:0;margin-bottom:0;} } .search .result {margin-top:0 !important; padding:0; border-bottom:2px solid var(--gray900); text-align:center;} .search .result h3 {font-weight:normal;} .search .result h3 > em {line-height:50px; color:var(--purple400); font-size:45px;} .search .result h3 > small {display:block; margin-top:5px; color:var(--gray800); font-size:19px;} .search .result h3 .unit {margin-top:30px;} .search .result h3 .unit dl {display:table; width:100%; color:var(--gray800);} .search .result h3 .unit dl dt, .search .result h3 .unit dl dd {display:table-cell; height:40px; line-height:40px; font-size:25px;} .search .result h3 .unit dl dt {text-align:left;} .search .result h3 .unit dl dd {padding-left:40px; text-align:right;} .search .result.type_1 {border-bottom:none} /*#189930*/ .search .result.type_1 h3 {height:auto; margin:0; font-size:19px; color:var(--gray800);} .search .result.type_1 h3 > em {padding-right:5px; font-size:29px !important;} .search .result.type_1 h3 .unit {display:inline-block; margin-top:0; padding-left:100px; vertical-align:middle;} .search .result.type_1 h3 .unit dl dt, .search .result.type_1 h3 .unit dl dd {height:28px; font-size:19px !important; line-height:28px;} .search .result.type_1 h3 .unit dl dt em {font-weight:bold;} .search .link_event {padding-top:100px; margin:0 -8px; border-top:2px solid var(--gray250);} .search .link_event img {width:100%;} .search .link_event > ul {display:flex; justify-content: space-around;} .search .link_event > ul > li { max-width:519px; margin:0 8px;} .search .result + .link_event {margin-top:0; border:0 none;} .search .recommend h3{display:block;height:auto;padding-bottom:10px;margin-bottom:40px !important;border-bottom:2px solid var(--gray900);font-weight:700;font-size:20px !important;line-height:26px;} .search .search-msg{padding:80px 0 60px;} .search .search-msg .msg-1{font-weight:400;font-size:var(--F24);line-height:var(--F24L);} .search .search-msg .msg-2{margin-top:10px;font-weight:400;font-size:var(--F14);line-height:var(--F14L);color:var(--gray900);} /* 검색 결과 리뷰 */ .search .ssf_tabs .gods-review{margin-top:40px;} .search .ssf_tabs .gods-review .review-lists > ul{margin-top:0;} /* 20230322 start */ .search .ssf_tabs .gods-review .review-info .info .txt:last-child{margin-bottom:0px !important;} .search .ssf_tabs .gods-review .review-info .info + .desc{margin-top:16px;} .search .ssf_tabs .review-item .review-info .user .date::before{display:none;} .search .ssf_tabs .review-item .review-info .user .id + .date::before{display:inline-block;} @supports (display:grid) and (gap: 16px) { .search .our-picks-lists .list-area .list-col-4{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 16px;margin:0;} .search .our-picks-lists .list-area .list-col-4 > li{width:auto;max-width:none;padding:0;margin-bottom:0px;} /* 20230331 */ .search .list-events .list-area .ssf-events{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 16px;margin:0;} .search .list-events .list-area .ssf-events > li{width:auto;max-width:none;padding:0;margin-bottom:0px;}/* 20230331 */ .search .ssf_tabs .gods-review{padding:0;} .search .ssf_tabs .gods-review .review-lists > ul{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 16px;margin:0;} .search .ssf_tabs .gods-review .review-lists > ul > li{width:auto;max-width:none;padding:0;margin-bottom:0px;}/* 20230331 */ } /* 20230322 end */ /* 검색 결과 탭별 실패 : 20230228 start */ .search .ssf_tabs .ssf_tab_cont .srch-no-result{display:flex;justify-content:center;margin:30px 0;padding:28px 0 29px;background-color:var(--gray150);} .search .ssf_tabs .ssf_tab_cont .srch-no-result.type-h{height:300px;align-items:center;box-sizing:border-box;} /* #199807:20230328 */ .search .ssf_tabs .ssf_tab_cont .srch-no-result p{text-align:center;font-size:var(--F17);line-height:var(--F17L);color:var(--gray700);font-weight:400;} .search .ssf_tabs .ssf_tab_cont .srch-recomend > h3{margin:40px 0 20px;font-size:var(--F17);line-height:var(--F17L);color:var(--gray900);font-weight:400;} .search .ssf_tabs .ssf_tab_cont .srch-recomend .god-lists > ul{margin-top:0;} .search .ssf_tabs .ssf_tab_cont .srch-recomend .gods-review{margin-top:0;} /* 검색 결과 탭별 실패 : 20230228 end */ /* 20230322 end */ /* #190064 end */ /* 검색 (e) ************************************************************/ /* 브랜드 리스트 (s) ***************************************************/ .brand_list h1 span {margin-left:8px;font-size:var(--F16); font-weight:bold; line-height:18px; color:var(--black);} .brand_list h1 span em {font-size:var(--F16); font-weight:bold; line-height:18px; color:var(--black);} .brand_list .classify {padding:0;} .brand_list .tabs {display:flex; justify-content:space-between; box-sizing:border-box; padding:20px 30px 20px; background:var(--gray150);} .brand_list *[role=tablist] {display:flex; flex:none; padding-right:59px} .brand_list *[role=tablist] li {padding-right:20px;} .brand_list *[role=tablist] li + li:before {display:inline-block; width:1px; height:18px; background:var(--gray250); content:'';} .brand_list *[role=tablist] li span {display:inline-block; vertical-align:top; font-weight:bold; font-size:31px; line-height:40px; color:var(--gray400);} .brand_list *[role=tablist] li + li span {padding-left:20px;} .brand_list *[role=tablist] li[aria-selected=true] span {color:var(--gray900);} .brand_list .alphabetize {font-size:0;} .brand_list .alphabetize a {display:inline-block; margin-right:12px; color:var(--gray400); font-size: 31px; line-height:40px; vertical-align:top; font-weight:bold;} .brand_list .alphabetize a:nth-last-child(2){margin-right:28px;} .brand_list .alphabetize a:last-child {margin-right:0;} .brand_list .result h2 {margin-top:58px; height:42px; overflow:hidden; font-weight: bold; font-size: 51px; line-height: 42px;} .brand_list .result ul + h2 {margin-top:17px;} .brand_list .result ul {display:flex; flex-wrap: wrap; padding:25px 0 30px; } .brand_list .result ul > li {position:relative; box-sizing:border-box; padding:19px 30px 23px 28px; width:20%;} .brand_list .result ul > li > a {display:block;} .brand_list .result ul > li > a > span {display:block; font-size:var(--F15); line-height: 19px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .brand_list .result ul > li > a > span:first-child {font-weight:bold;} .brand_list .result ul > li .heart {position:absolute; top:20px; left:0; width:20px; height:20px;} .brand_list .result ul > li .badge {display:block; position:absolute; left:0; top:0;} .brand_list .result ul > li .badge i {margin-left:0; height:15px; font-size:var(--F11);} .brand_list .result ul > li .badge i:after {display:inline-block; width:100%; height:100%; line-height:14px;} .brand_list .result ul > li .badge i + i {margin-left:4px;} .brand_list .result .none {display:none; padding:95px 0 0 0; color:var(--gray600); line-height:22px; font-size:var(--F15); text-align:center; color:var(--gray900);} .brand_list .result .none a {display:block; width:230px; margin:25px auto 0; font-size:var(--F17); line-height:60px; background:var(--gray900); color:var(--white);} @media only all and (max-width:1680px) { .brand_list .result ul > li {width:25%} } @media only all and (max-width:1280px) { .brand_list .result ul > li {width:33.333333%} } /* 브랜드 리스트 (e) ***************************************************/ /* 브랜드 소개 코너 (s) ************************************************/ .anshop_brandinfo {position:relative; display:flex; width:100%; height:300px; overflow:hidden; border:1px solid var(--gray200); box-sizing:border-box;} .anshop_brandinfo .img {flex:1; width:50%; height:100%; max-width:640px;} .anshop_brandinfo .txt {flex:1; box-sizing:border-box; padding:40px 42px;} .anshop_brandinfo .txt .anshop {display:block; /*width:85px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left top;} .anshop_brandinfo .txt .beaker {display:block; /*width:72px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left -70px;} .anshop_brandinfo .txt .outlet {display:block; /*width:72px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left -140px;} .anshop_brandinfo .txt .cc10 {display:block; /*width:72px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left -210px;} .anshop_brandinfo .txt .labelC {display:block; /*width:72px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left -280px;} .anshop_brandinfo .txt .garcons {display:block; /*width:72px;*/ height:21px; font-size:0; background: url(../images/ui/direct_shop.png?timestapm=20220901) no-repeat left -350px;} .anshop_brandinfo .txt h5 {margin-top:24px; width:100%; font-size:33px; line-height:38px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .anshop_brandinfo .txt p {margin-top:16px; height:120px; color:var(--gray800); line-height:22px; font-size:var(--F14); overflow:hidden;} /* 브랜드 소개 코너 (e) ************************************************/ /* 패밀리 세일 (s) *****************************************************/ #family_sale {margin-top:104px; padding:30px; width:900px; background:#f7f7f7;} #family_sale > div {position:relative; padding:50px 60px; background:var(--white); border:1px solid var(--gray200);} #family_sale > div > h2 {max-height:120px; line-height:60px; color:var(--purple400); font-size:49px; overflow:hidden;} #family_sale p {margin:18px 0 30px; line-height:var(--F15LL); color:var(--gray800); font-size:var(--F15);} #family_sale .input_box input {width:278px;} #family_sale .input_box + .btn {margin-left:5px; vertical-align:bottom; width:57px; padding:0;} #family_sale .notice {margin-top:30px; color:var(--gray600); line-height:24px; font-size:var(--F14);} .family_invite {width:400px;} .family_invite > div > p {margin-top:22px; color:var(--gray900); line-height:24px;} .family_invite > div + div {margin-top:26px; padding-top:23px; border-top:1px solid var(--gray900);} .family_invite > div h3 {font-size:var(--F15); font-weight:bold;} .family_invite > div .code_num {margin:10px 0 24px;} .family_invite > div .code_num > li {line-height:22px; color:var(--gray800); font-size:var(--F15);} .family_invite > div .code_num > li > span {display:inline-block; width:100px; color:var(--gray600); font-size:var(--F14);} .family_invite > div .send_msg {margin:10px 0 0;} .family_invite > div .send_msg > li {line-height:27px; color:var(--gray800); font-size:var(--F13);} .family_invite > div .send_msg > li + li {margin-top:10px;} .family_invite > div .send_msg > li > span {display:inline-block; line-height:37px; width:90px; color:var(--gray800); vertical-align:top; font-size:var(--F14);} .family_invite > div .send_msg > li > strong {color:var(--gray900);} .family_invite > div .send_msg > li > .input_box {margin:1px 12px 0 -3px; width:170px;} .family_invite > div .send_msg > li > .btn.kakao {padding-left:44px; background:url(../images/ui/bg_kakao.png) no-repeat 17px center;} .family_invite > div .send_msg > li > .txt_sms {display:inline-block; margin:16px 0 8px -3px; padding:16px 20px; /*width:270px;*/ min-height:80px; line-height:var(--F14L); font-size:var(--F14); background:var(--gray150); border:0; word-break:break-all} .family_invite > div > table {margin-top:10px; width:100%;} .family_invite > div > table th {line-height:42px; color:var(--gray600); text-align:center; font-weight:400; font-size:var(--F14); border-bottom:1px solid var(--gray250);} .family_invite > div > table td {line-height:42px; text-align:center; color:var(--gray800); font-size:var(--F14); border-bottom:1px solid var(--gray250);} .family_invite > div > table td.no_data {line-height:72px; color:var(--gray600);} /* 패밀리 세일 (e) *****************************************************/ /* RECOMMENDATION (s) *************************************************/ .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n-5), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n-10), .wrap .contents section.recommend > .list_goods > ul.row_4 > li:nth-child(1n-15) {display:block;} .wrap .contents section.recommend > .list_goods > ul.row_1 > li:nth-child(1n+6), .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n+11), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n+16) {display:none;} .wrap .contents .view_more.row_add {margin-bottom:20px;} @media only all and (max-width:1680px) { .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n-8), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n-12), .wrap .contents section.recommend > .list_goods > ul.row_4 > li:nth-child(1n-16) {display:block;} .wrap .contents section.recommend > .list_goods > ul.row_1 > li:nth-child(1n+5), .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n+9), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n+13), .wrap .contents section.recommend > .list_goods > ul.row_4 > li:nth-child(1n+17) {display:none;} } @media only all and (max-width:1280px) { /* .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n-6), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n-9), .wrap .contents section.recommend > .list_goods > ul.row_4 > li:nth-child(1n-12) {display:block;} .wrap .contents section.recommend > .list_goods > ul.row_1 > li:nth-child(1n+4), .wrap .contents section.recommend > .list_goods > ul.row_2 > li:nth-child(1n+7), .wrap .contents section.recommend > .list_goods > ul.row_3 > li:nth-child(1n+10), .wrap .contents section.recommend > .list_goods > ul.row_4 > li:nth-child(1n+13) {display:none;} */ } /* RECOMMENDATION (e) *************************************************/ /* #245270(s) */ .rental_wrap {margin:0 -110px;} .rental_wrap video {width:100%;} .rental_wrap .rental_page {position:relative;} .rental_wrap .rental_page .sub_mov {position:absolute; top:228px; right:170px; width:336px;} .rental_wrap .rental_page .icon_list {position:absolute; top:707px; left:78px; width:1244px; height:364px;} .rental_wrap .rental_page .icon_list li {float:left; width:119px; height:138px;} .rental_wrap .rental_page .icon_list li img {transform:translate(0, 138px); opacity:0; transition-duration:500ms;} .rental_wrap .rental_page .icon_list li:nth-child(2) {margin-left:305px;} .rental_wrap .rental_page .icon_list li:nth-child(2) img {transition-delay:0.2s;} .rental_wrap .rental_page .icon_list li:nth-child(3) {margin-left:265px;} .rental_wrap .rental_page .icon_list li:nth-child(3) img {transition-delay:0.4s;} .rental_wrap .rental_page .icon_list.active li img {transform:translate(0, 0); opacity:1;} .rental_wrap .rental_page .range_list {overflow:hidden; position:absolute; top:1240px; left:78px; width:1244px; height:288px;} .rental_wrap .rental_page .range_list img {width:auto; opacity:0; transition-duration:1000ms;} .rental_wrap .rental_page .range_list dt img {transform:translate(-359px, 0);} .rental_wrap .rental_page .range_list dd img {transform:translate(-1239px, 0); transition-delay:0.5s;} .rental_wrap .rental_page .range_list.active img {transform:translate(0, 0); opacity:1;} .rental_wrap .rental_page .btn_apply {position:absolute; top:2474px; left:375px; width:649px; height:120px;} /* #258842 */ /* #287830 */ /* #296377 */ /* #245270(e) */ /* 홈피팅 (s) *********************************************************/ .free_fitting {display:inline-block; margin:0 auto; padding-left:26px; color:#50506e; font-weight:bold; background:url("../images/ui/ico_fit.png") no-repeat left center;} span.free_fitting {padding-left:0; background:none;} .group_discount + .free_fitting {margin-top:5px;} .fit_img {position:relative;} .fit_img .size {position:absolute; right:8px; bottom:8px; padding:0 7px; height:30px; line-height:30px; color:var(--gray800); font-size:var(--F14); background:var(--white);} .fit_img .fit_item {position:absolute; left:8px; bottom:8px; padding:0 7px; height:30px; line-height:30px; color:var(--white); font-size:var(--F12); font-weight:bold; background:#50506e; opacity:0.8;} i.fit {display:inline-block; margin:0; padding:0 10px; height:20px; font-size:var(--F11); line-height:var(--F11L); color:#50506e; background:var(--white); font-weight:bold; border:1px solid #50506e; box-sizing:border-box;} #agree_auto_buying, #agree_privacy {margin-top:20px; padding:0; height:150px; text-align:left; overflow-y:hidden;} #agree_privacy .rules {padding:35px; padding-top:0; line-height:20px; color:var(--gray600); font-size:var(--F12);} #agree_privacy .rules h3 {margin-bottom:5px; color:var(--gray800); font-size:var(--F12);} #agree_privacy .rules span {margin-right:10px; color:var(--gray800);} /* 홈피팅 선택 */ .popup .free_fit {padding:10px 0; width:560px;} .popup .free_fit h3 {margin-bottom: 30px; font-size:var(--F20); line-height:38px; font-weight:bold;} .popup .free_fit h3 em {display: block; font-size:var(--F24); flex-wrap: 400;} .popup .free_fit .fit_img {position: relative;} .popup .free_fit .fit_img .size {position: absolute; right: 10px; bottom: 10px; width: 45px; height: 30px; background-color: rgba(255,255,255,0.9); line-height: 30px; text-align: center; font-size:var(--F14); color: var(--gray800); flex-wrap: 600;} .popup .free_fit .step1 .shipping {text-align:left;} .popup .free_fit .step1 .shipping .radio {display: inline-block; height: 40px; background-position: left center;} .popup .free_fit .step1 .shipping .radio label {line-height: 40px;} .popup .free_fit .step1 .shipping .type1 {padding-left: 55px; margin-right: 80px; background-image: url("../images/ui/ico_box.png"); background-repeat: no-repeat;} .popup .free_fit .step1 .shipping .type2 {padding-left: 65px; background-image: url("../images/ui/ico_delivery.png"); background-repeat: no-repeat;} .popup .free_fit .step1 .shipping .remote_wrap {margin-top:10px; padding:15px 20px; color:var(--gray600); font-size:var(--F12); background:#f7f7f7;} .popup .free_fit .step2 {margin-top: 60px;} .popup .free_fit .step2 .fit_status:after {content: ""; clear: both; display: block;} .popup .free_fit .step2 .fit_status .fit_img {width:132px; height:174px; border:2px solid var(--gray250);} .popup .free_fit .step2 .fit_status .fit_img img {display: block; width: 100%; height: 100%; object-fit: cover;} .popup .free_fit .step2 .fit_status .select {position: absolute; bottom: 0px; left:14px; height: 25px;} .popup .free_fit .step2 .fit_status .select > a label {padding-top: 0px; padding-bottom: 0px; background-position: right -298px; border: 1px solid var(--gray250); font-size:var(--F12); text-indent: 7px;} .popup .free_fit .step2 .fit_status .select .option > ul > li > a {font-size:var(--F12);} .popup .free_fit .step2 .fit_status .select.over .option > ul {margin-top: 24px;} .popup .free_fit .step2 .fit_status .select.over > a label {background-position: right -348px;} .popup .free_fit .step2 .fit_status .lside {float: left;} .popup .free_fit .step2 .fit_status .lside dl {height:174px;} .popup .free_fit .step2 .fit_status .lside dl:after {content: ""; clear: both; display: block;} .popup .free_fit .step2 .fit_status .lside dt {float: left;} .popup .free_fit .step2 .fit_status .lside dd {float: left; position: relative; padding-top:10px; width:128px; height:167px; padding-left:14px;} .popup .free_fit .step2 .fit_status .lside dd .txt {display: block; margin-bottom: 9px; font-size:var(--F14); color: var(--gray900); font-weight: 400; letter-spacing:-1px;} .popup .free_fit .step2 .fit_status .lside dd .sub-txt {display: block; margin-bottom: 17px; font-size:var(--F11); color: #8e8e8e; font-weight: 400; line-height:14px;} .popup .free_fit .step2 .fit_status .rside {float: right;} .popup .free_fit .step2 .fit_status .rside .fit_img {background: url("../images/ui/bg_free_fit.png") no-repeat;} .popup .free_fit .step2 .fit_status .rside ul:after {content: ""; clear: both; display: block;} .popup .free_fit .step2 .fit_status .rside li {float: left; position: relative;} .popup .free_fit .step2 .fit_status .rside li:first-child {margin-right: 10px;} .popup .free_fit .step2 .fit_status .remove {position: absolute; right: 0px; top: 0px; width: 32px; height: 32px; margin: 0px; padding: 0px; border: none; background:var(--black) url(../images/ui/btn_x_white.svg) no-repeat center center/15px auto;} .popup .free_fit .step2 .fit_select {margin:40px -31px 0 -37px; padding: 40px 0 40px 40px; background-color: #f7f7f7;} .popup .free_fit .step2 .fit_select h4 {font-size:var(--F14);} .popup .free_fit .step2 .fit_select h4 span {color: var(--gray600); font-size:var(--F12); font-weight: 400;} .popup .free_fit .step2 .fit_select .fit_img {width: 132px; height: 174px;} .popup .free_fit .step2 .fit_select ul {margin-top: 15px; margin-bottom: 20px;} .popup .free_fit .step2 .fit_select ul:after {content: ""; clear: both; display: block;} .popup .free_fit .step2 .fit_select li {float:left; margin-bottom:10px;} .popup .free_fit .step2 .fit_select li + li {margin-left:10px;} .popup .free_fit .step2 .fit_select li:nth-child(4n+5) {margin-left:0;} .popup .free_fit .step2 .fit_select li label {display: block; position: relative; width: 100%; height: 100%;} .popup .free_fit .step2 .fit_select .status {position: absolute; width: 0px; height: 0px;} .popup .free_fit .step2 .fit_select input.checked + .status {width: 100%; height: 100%; background: url("../images/ui/bg_free_fit_selected.png") no-repeat; z-index: 1;} .popup .free_fit .step2 .fit_select input.current + .status {width: 100%; height: 100%; background: url("../images/ui/bg_free_fit_current.png") no-repeat; z-index: 1;} .popup .free_fit .load_more {width: 557px; text-align: center;} .popup .free_fit .load_more a {display:inline-block; padding-right:20px; background:url(../images/ui/btn_down.svg) no-repeat right center/14px auto; color: #0d0b08; font-size:var(--F13); font-weight:bold;} /* 홈피팅 서비스안내 */ .popup .free_fit_info {width:630px;} .popup .free_fit_info .overlap {margin:-35px -30px 0; height:150px; background:#f7f7f7;} .popup .free_fit_info .overlap h2 {display:inline-block; margin:60px 30px; color:var(--gray900); font-size:28px;} .popup .free_fit_info .overlap h2 em {display:block; color:var(--gray900); font-size:var(--F16);} .popup .free_fit_info .overlap .btn {position:absolute; right:30px; top:60px; line-height:48px;} .popup > #popup > .free_fit_info > .tabs {margin:0 -30px;} .popup .free_fit_info .tabs .tab > li {width:33.33%;} .popup .free_fit_info .tabs .tab > li > a {background:#f7f7f7;} .popup .free_fit_info .tabs > div {margin-bottom:-35px; height:485px; text-align:center; color:var(--gray900); overflow-y:auto;} .popup .free_fit_info .tabs #fit_tab1 p {margin-top:60px; line-height:20px; font-size:var(--F13); font-weight:bold;} .popup .free_fit_info .tabs #fit_tab1 h3 {line-height:50px; font-size:28px;} .popup .free_fit_info .tabs #fit_tab1 dl dt {display:inline-block; padding-top:160px; width:30%; vertical-align:top; font-size:var(--F16); font-weight:bold; background:url(../images/ui/bg_fit_step.png) no-repeat;} .popup .free_fit_info .tabs #fit_tab1 dl dt span {display:block; margin-top:5px; line-height:16px; color:var(--gray600); font-size:var(--F12); font-weight:bold;} .popup .free_fit_info .tabs #fit_tab1 dl dt:first-child {background-position:52px 40px;} .popup .free_fit_info .tabs #fit_tab1 dl dt:nth-child(2) {background-position:-152px 40px;} .popup .free_fit_info .tabs #fit_tab1 dl dt:nth-child(3) {background-position:-352px 40px;} .popup .free_fit_info .tabs #fit_tab2 strong {display:block; margin-top:50px; line-height:50px; font-size:var(--F40);} .popup .free_fit_info .tabs #fit_tab2 span {display:block; margin-top:10px; line-height:36px; font-size:var(--F20); font-weight:bold;} .popup .free_fit_info .tabs #fit_tab2 em {display:block; margin-top:10px; line-height:var(--F14L); font-size:var(--F14);} .popup .free_fit_info .tabs #fit_tab2 img {display:block; margin:25px auto 40px; max-width:610px; width:auto;} .popup .free_fit_info .tabs #fit_tab3 h3 {margin-top:60px; line-height:20px; font-size:18px;} .popup .free_fit_info .tabs #fit_tab3 ul li span {display:inline-block; margin:40px auto 6px; padding-left:30px; line-height:22px; color:var(--gray900); font-size:var(--F16); font-weight:bold; background:url(../images/ui/ico_ir.png) no-repeat left center;} .popup .free_fit_info .tabs #fit_tab3 ul li em {display:block; line-height:var(--F12L); color:var(--gray600); font-size:var(--F12);} .popup .free_fit_info .tabs #fit_tab3 .list_wrap {display:inline-block; margin:50px auto 40px; text-align:left; line-height:var(--F12L); color:var(--gray600); font-size:var(--F12);} /* 홈피팅 구매확정 */ .popup .free_fit_confirm {width:486px;} .popup .free_fit_confirm h3 {color:var(--gray900); font-size:var(--F16);} .popup .free_fit_confirm h3 small {display:inline-block; margin-left:5px; color:var(--gray600); font-size:var(--F13);} .popup .free_fit_confirm .info {display:inline-block; margin-top:24px;} .popup .free_fit_confirm .info strong {display:inline-block; float:left; color:var(--gray900); font-size:var(--F13);} .popup .free_fit_confirm .info p {display:inline-block; float:left; margin-left:10px; line-height:var(--F13LL); color:var(--gray600); font-size:var(--F13);} .popup .free_fit_confirm .info p:after {display:block; clear:both; content:'';} .popup .free_fit_confirm .fit_select {margin-top:32px; padding-top:36px; border-top:2px solid #f7f7f7;} .popup .free_fit_confirm .fit_select h4 {color:var(--gray900);} .popup .free_fit_confirm .fit_select h4 + ul {margin-top:28px;} .popup .free_fit_confirm .fit_select ul li {float:left; margin:0 15px; width:132px;} .popup .free_fit_confirm .fit_select ul:after {display:block; clear:both; content:"";} .popup .free_fit_confirm .fit_select ul li .checkbox {display:block; margin-top:7px; text-align:center;} .popup .free_fit_confirm .fit_select .expire {margin-top:20px; text-align:center; color:var(--purple400);} .popup .free_fit_confirm .list_wrap {color:var(--gray600); font-size:var(--F12);} /* 홈피팅 개선 */ .fit_img .option {display:block; margin-top:-34px; width:calc(100% - 6px); height:34px; text-align:right; font-size:0;} .fit_img .option .color {display:inline-block; margin-right:4px; height:24px; overflow:hidden;} .fit_img .option .color span {float:left; width:22px; height:22px; line-height:14px; border:1px solid #dcdcdc; font-size:0;} .fit_img .option .size {display:inline-block; position:relative !important; right:0 !important; bottom:6px !important; padding:0 9px; width:auto !important; height:30px; line-height:30px; color:var(--gray800); font-size:var(--F14); background:var(--white);} .popup .free_fit_info .tabs #fit_tab2 span em {display:inline-block; margin:-5px 5px 0 0; padding:2px 10px; line-height:16px; vertical-align:middle; color:#50507a; font-size:var(--F12); border:1px solid #50507a;} .popup .free_fit_confirm .fit_select ul li {position:relative;} .popup .free_fit_confirm .fit_select .status {position:absolute; top:0; width:0px; height:0px;} .popup .free_fit_confirm .fit_select input:checked + label + .status {width:100%; height:174px; background:url("../images/ui/bg_free_fit_purchase.png") no-repeat; z-index:1;} /* 홈피팅 (e) *********************************************************/ /* popup (s) *********************************************************/ /* 재입고알림, Q&A, 상품리뷰작성 테이블 공통 */ .popup .form_popup .tbl_goods {table-layout:fixed; border-top:1px solid var(--gray900);} .popup .form_popup .tbl_goods {table-layout:fixed; width:100%;} .popup .form_popup .tbl_goods th {padding:30px 25px 30px 0; border-bottom:1px solid var(--gray250); font-weight:bold; text-align:right; vertical-align:top;} .popup .form_popup .tbl_goods th.set_name {padding-bottom:0; text-align:left; border-bottom:0;} .popup .form_popup .tbl_goods td {padding:30px 0; border-bottom:1px solid var(--gray250);} .popup .form_popup .tbl_goods .line th, .popup .form_popup .tbl_goods .line td {border-color:var(--gray900);} .popup .form_popup .tbl_goods .no_line th, .popup .form_popup .tbl_goods .no_line td {padding-bottom:0; border:0 none;} .popup .form_popup .tbl_goods td .info .brand, .popup .form_popup .tbl_goods td .info .name, .popup .form_popup .tbl_goods td .info .option {display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .popup .form_popup .tbl_goods td .info .brand, .popup .form_popup .tbl_goods td .info .name {line-height:20px; color:var(--gray900); font-size:var(--F15);} .popup .form_popup .tbl_goods td .info .name {margin-bottom:10px;} .popup .form_popup .tbl_goods td .info .option {font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} .popup .form_popup .tbl_goods td > img {float:left; width:60px; margin-right:25px;} /* #141816 */ .popup .form_popup .tbl_goods td dl {font-size:var(--F14); color:var(--gray800); line-height:16px;} .popup .form_popup .tbl_goods td dl dt {display:inline-block; width:45px; vertical-align:middle;} .popup .form_popup .tbl_goods td dl dd + dt {margin-left:35px;} .popup .form_popup .tbl_goods td dl dd {display:inline-block; vertical-align:middle;} .popup .form_popup .tbl_goods td dl dd .star {vertical-align:top;} .popup .form_popup .tbl_goods td dl dd .radio {display:inline-block; width:120px;} .popup .form_popup .tbl_goods td dl dd .radio:first-child {padding-left:45px;} .popup .form_popup .tbl_goods td dl dd .radio label {margin-right:0;} .popup .form_popup .tbl_goods td textarea {padding:15px 20px; height:110px; font-size:var(--F14); line-height:var(--F14L);} .popup .form_popup .tbl_goods td .txt {display:block; margin-top:10px; font-size:var(--F13); color:var(--gray600);} .popup .form_popup .tbl_goods td .txt span {float:right; color:var(--gray600);} /* 상품리뷰작성 */ .popup .form_popup .tbl_goods td .file_list:after {display:block; clear:both; content:"";} .popup .form_popup .tbl_goods td .file_list li {float:left; margin-left:10px;} .popup .form_popup .tbl_goods td .file_list li:first-child {margin-left:0;} .popup .form_popup .tbl_goods td .file_list li > img {width:94px; height:124px; border:1px solid var(--gray250);} .popup .form_popup .tbl_goods td .file_list + .txt {margin-top:25px;} .popup .form_popup .tbl_goods td dl + dl {margin-top:10px;} .popup .form_popup .tbl_goods td .review_dl + dl {margin-top:20px;} .popup .form_popup .tbl_goods td .sns_list li {display:inline-block; margin-left:30px;} .popup .form_popup .tbl_goods td .sns_list li:first-child {margin-left:0;} .popup .form_popup .tbl_goods td .sns_list li a {display:inline-block; position:relative; padding-left:30px; color:var(--gray800); line-height:21px;} .popup .form_popup .tbl_goods td .sns_list li a:after {position:absolute; top:0; left:0; width:21px; height:21px; background:url("../images/ui/bg_sns_purple.png") no-repeat 0 0; content:'';} .popup .form_popup .tbl_goods td .sns_list li span {display:none; width:12px; height:9px; margin-left:5px; background:url(../images/ui/bg_fin_check_em.svg) no-repeat 0 0/12px auto; vertical-align:0px;} .popup .form_popup .tbl_goods td .sns_list .site01:after {background-position:0 0;} .popup .form_popup .tbl_goods td .sns_list .site02:after {background-position:0 -21px;} .popup .form_popup .tbl_goods td .sns_list li.on a {color:var(--purple400);} .popup .form_popup .tbl_goods td .sns_list li.on span {display:inline-block;} .popup .form_popup .tbl_goods td .sns_list li.on .site01:after {background-position:-21px 0;} .popup .form_popup .tbl_goods td .sns_list li.on .site02:after {background-position:-21px -21px;} .popup .form_popup .tbl_goods td .mark {display:inline-block; width:56px; color:var(--purple400); vertical-align:middle; text-align:left;} .popup .form_popup .tbl_goods td .addr {display:inline-block; vertical-align:middle;} .popup .form_popup .tbl_goods td .addr span {display:block; overflow:hidden; max-width:500px; color:var(--gray900); line-height:24px; white-space:nowrap; text-overflow:ellipsis;} .popup .form_popup .tbl_goods td .mark + .addr {max-width:440px;} .popup .form_popup .tbl_goods td .btns {text-align:right;} .popup .form_popup .tbl_goods td .btns a {display:inline-block; margin-left:5px; padding:5px; font-size:var(--F13); color:var(--gray600);} .popup .form_popup .tbl_goods td .list_wrap {margin:0;} .popup .form_popup .tbl_goods td .btn {margin-top:12px; font-size:var(--F13);} /* 배송지 목록 */ .popup .form_popup .btn_right {margin-top:15px; text-align:right;} .popup .form_popup .btn_right .btn {padding:2px 10px; width:88px; font-size:var(--F13); color:var(--gray800);} .popup .form_popup .btn_right .btn.bk {border-color:var(--gray800); background-color:var(--gray800); color:var(--white);} .popup .guide_txt {margin-top:40px;} .popup .guide_txt h3 {font-size:var(--F15); color:var(--gray800); line-height:14px;} .popup .guide_txt p {margin-top:18px; font-size:var(--F15); color:var(--gray900); line-height:20px;} .popup .guide_txt ul li {font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} .popup .submit {justify-content: center;} .popup .submit .btn {flex:1; margin:0; min-width:auto; height:50px; line-height:48px; /*padding:0;*/ font-size:var(--F15); padding:0 20px;}/*//#141828 : 회원가입 재구성*/ .popup .submit .btn:first-child {margin-right:4px;} .popup .submit .btn:first-child + .btn {margin-left:4px;} .popup .order .submit {display:flex; justify-content: space-between;} .popup .order .submit a.btn {height:50px;} .popup .summary {margin-top:24px; padding-bottom:20px; border-bottom:1px solid var(--gray250);} .popup .summary .submit {margin-top:20px;} .popup .list_wrap {margin-top:20px; } .popup .list_wrap span {display:block; color:var(--gray800);} .popup .list_wrap span + ul {margin-top:15px;} .popup .list_wrap li {padding-left:7px; text-indent:-7px; color:var(--gray600); word-break: break-word} .popup .list_wrap.notice {margin-top:10px;} .popup .list_wrap.notice li {padding:16px 0 16px 7px; color:var(--gray800);} .popup .list_wrap.notice li + li {border-top:1px solid var(--gray250);} .popup .form {margin-top:10px; width:400px;} .popup .form li {display:inline-block; padding:10px 0; width:100%; height:35px; line-height:35px;} .popup .unview {margin-top:24px; color:var(--gray600); font-size:var(--F13);} /* 본인인증 */ .popup .certify {margin-top:40px; font-size:var(--F15);} .popup .certify > a {width:193px;} .popup .certify p {margin-bottom:15px; color:var(--gray600); text-align:center;} .popup .center_info {margin-top:20px; padding:23px 0; background-color:var(--gray150); color:var(--gray800); text-align:center;} .popup .center_info span {display:inline-block; margin-right:16px; padding-left:24px; background:url("../images/ui/bg_phone.png") no-repeat 0 center;} /* 이메일무단수집거부 */ .popup .email p {margin-top:30px; padding-top:90px; width:400px; line-height:24px; background:url(../images/ui/bg_rejection.png) no-repeat top center;} .popup .email p em {color:var(--gray600); font-size:var(--F13);} .popup .top_img {display:block; margin-bottom:32px; height:310px; text-align:center;} .popup .top_img img {width:auto;} .popup .exist_wrap h2 {padding-top:70px; background:url(../images/ui/bg_warn.svg) no-repeat 0 0/auto 57px; font-size:var(--F21); color:var(--gray900); line-height:32px; font-weight:bold; letter-spacing:-1px;} .popup .exist_wrap h3 {font-size:19px; color:var(--gray800); line-height:28px;} .popup .exist_wrap h4 {padding-top:70px; background:url(../images/ui/bg_warn.svg) no-repeat 0 0/auto 57px; font-size:var(--F21); color:var(--gray900); line-height:32px; font-weight:bold; letter-spacing:-1px;} .popup .exist_wrap p {margin-top:36px; color:var(--gray600);} /*#141828 : 회원가입 재구성*/ .popup .exist_wrap p.case {font-size:19px; color:var(--gray800); line-height:32px;} .popup .exist_wrap p.case span {display:inline-block; margin:-3px 0 0 5px; font-size:var(--F15); vertical-align:middle;} /*//#141828 : 회원가입 재구성*/ .popup .exist_wrap .list_wrap {padding-top:35px; border-top:1px solid var(--gray250);} .popup .exist_wrap .list_wrap p {margin:0 0 10px 0; font-size:var(--F15); line-height:20px;} .popup .exist_wrap .info {margin-top:25px;} .popup .exist_wrap .info div {display:flex; align-items: center; width:100%; padding-bottom:14px;} .popup .exist_wrap .info div span {color:var(--gray800);} .popup .exist_wrap .info div span em {margin-left:5px;} .popup .exist_wrap .info div span:last-child {margin-left:auto;} .popup .exist_wrap .info div span .btn {width:136px; height:40px; line-height:38px;} .popup .exist_wrap + .list_wrap.notice + .submit {margin-top:30px;} .popup .form_wrap .checkbox .all-check + label {display:block; margin:13px 0 13px; padding-bottom:13px; border-bottom:1px solid var(--gray250);} .popup .form_wrap .checkbox.all-group label {min-width:184px; margin:0; color:var(--gray600); } .popup h3 + .form_wrap {margin-top:36px; padding-top:13px; border-top:1px solid #d5d5d5;} .popup #popup_marketing {margin-top:13px; padding:10px; height:150px; text-align:left; background:var(--gray150);} /*#143775*/ #alert .links {margin:20px 0 -25px 0; text-align:center;} #alert .links a {display:inline-block; padding-right:12px; font-size:var(--F15); text-decoration:underline; background:url(../images/ui/btn_next.svg) no-repeat right center/auto 10px;} #alert .links a span {display:inline-block; padding-left:24px; font-weight:bold; background:url(../images/ui/ico_basket.png) no-repeat 0 2px} /* //#143775*/ /* Popup : 태그 상품 보기 */ .popup .tag_goods .list_goods .info {margin-bottom:20px !important; height:70px;} .popup .tag_goods .list_goods .color, .popup .tag_goods .list_goods .badge {display:none;} /* Popup : 주소록 */ .popup .pop_addr strong {display:block; margin-top:36px; font-size:var(--F17); color:var(--purple400); line-height:14px;} .popup .pop_addr li {padding:36px 0;} .popup .pop_addr li {border-top:1px solid var(--gray250);} .popup .pop_addr li:after {display:block; clear:both; content:"";} .popup .pop_addr li:first-child {border:0 none;} .popup .pop_addr li:last-child {padding-bottom:10px;} .popup .pop_addr .default + li {border-color:var(--gray800);} .popup .pop_addr .default + .default {border-color:var(--gray250);} .popup .pop_addr p {float:left; width:330px; font-weight:bold;} .popup .pop_addr p span + span {display:block;} .popup .pop_addr a {float:right;} /* Popup : 쿠폰 */ .popup .pop_coupon .total {padding:36px 0; border-bottom:1px solid var(--gray800); font-size:var(--F17);} .popup .pop_coupon .total strong {color:var(--gray800);} .popup .pop_coupon .total span {float:right; color:var(--purple400); font-weight:bold;} .popup .pop_coupon .type {padding-bottom:40px; border-top:1px solid var(--gray250);} .popup .pop_coupon .type:first-child {border-top:0 none;} .popup .pop_coupon .type:last-child {padding-bottom:10px;} .popup .pop_coupon .type strong {display:block; margin-top:40px; font-weight:bold; color:var(--gray900); line-height:12px;} .popup .pop_coupon .type p {margin-top:40px; color:var(--gray800); line-height:12px;} .popup .pop_coupon .type strong + p {margin-top:30px;} .popup .pop_coupon .type .detail {margin-top:20px;} .popup .pop_coupon .type .detail .select {width:166px;} .popup .pop_coupon .type .detail .select > a label {color:var(--gray600);} .popup .pop_coupon .type .detail .select ul {position:relative;} .popup .pop_coupon .type .detail .select + span {float:right; height:35px; color:var(--gray900); line-height:35px;} .popup .pop_coupon .type .detail .input_box {display:inline-block; padding-top:3px;} .popup .pop_coupon .type .detail .input_box + .btn {float:right;} /* 쿠폰 다운로드 */ .popup .view_coupon {width:720px;} .popup .view_coupon .coupon_wrap {margin-top:26px;} .popup .view_coupon .coupon_wrap:after {display:block; clear:both; content:"";} .popup .view_coupon .coupon_wrap li {position:relative; float:left; margin:0 0 12px 12px; overflow:hidden;} .popup .view_coupon .coupon_wrap li:nth-child(2n-1) {clear:both; margin-left:0} .popup .view_coupon .coupon_wrap li .coupon_box {position:relative; width:292px; height:192px; padding:30px; border:1px solid var(--gray250);} .popup .view_coupon .coupon_wrap li .coupon_box .mark {display:block; height:14px; line-height:14px; color:var(--purple400); font-size:var(--F15);} .popup .view_coupon .coupon_wrap li .coupon_box strong {display:block; margin-top:10px; line-height:22px; font-size:23px; color:var(--gray900); font-weight:bold;} .popup .view_coupon .coupon_wrap li .coupon_box p {display:block; margin-top:14px; height:44px; line-height:22px; font-size:var(--F17); color:var(--gray800); overflow:hidden;} .popup .view_coupon .coupon_wrap li .coupon_box .date {display:block; margin-top:20px; height:16px; line-height:16px; color:var(--gray600); font-size:var(--F14); overflow:hidden;} .popup .view_coupon .coupon_wrap li .coupon_box .btn {margin-top:20px; padding:2px 26px; font-size:var(--F13); background:var(--gray800);} .popup .view_coupon .list_wrap, .popup .view_coupon .list_wrap u {color:var(--gray600);} .popup .view_coupon .coupon_wrap li.null {padding:100px 0; width:100%; line-height:50px;} .popup .view_coupon .coupon_wrap li.null span {display:block; color:var(--gray600); font-size:var(--F14);} .popup .view_coupon .submit {margin-top:28px;} .popup .view_coupon .submit .btn {padding:12px 80px; font-weight:normal;} .popup .view_coupon .submit .btn .download {display:inline-block; margin-right:12px; width:13px; height:16px; vertical-align:middle; background:url(../images/ui/ico_download.png) var(--gray900) no-repeat left center;} .popup .view_coupon .banners {margin-top:36px;} .popup .view_coupon .banners.slider .lSAction {width:auto; z-index:1;} .popup .view_coupon .banners.slider .lSAction a {position:absolute; margin:10px; width:10px; height:17px;} .popup .view_coupon .banners.slider .lSAction a.lSPrev {background:url(../images/ui/btn_prev.svg) no-repeat center center /10px auto;} .popup .view_coupon .banners.slider .lSAction a.lSNext {margin-left:700px; background:url(../images/ui/btn_prev.svg) no-repeat center center / 10px auto;} /* 온라인 회원 혜택 지급 개선 */ .popup .join_coupon {text-align:center;} .popup .join_coupon img {margin-top:34px; width:auto;} .popup .join_coupon .txt {display:block; margin-top:10px; color:var(--purple400); font-size:var(--F17); font-weight:bold;} .popup .join_coupon .period {display:block; margin-top:30px; color:var(--gray800); font-size:var(--F15);} .popup .join_coupon em {display:block; margin-top:10px; line-height:20px; color:var(--gray600); font-size:var(--F13);} /* Popup : 매장찾기(픽업, 수선, 교환/반품) */ .popup .pop_shop p {margin-top:35px; color:var(--gray800); line-height:22px;} .popup .pop_shop p + h2 {margin-top:60px;} .popup .pop_shop h3 {margin-top:60px; font-size:var(--F17); color:var(--gray800); line-height:16px;} .popup .pop_shop ul {margin-top:25px;} .popup .pop_shop li {font-size:var(--F13); color:var(--gray600); line-height:20px;} .popup .pop_shop li a {display:inline-block; margin-top:6px; padding:0 16px 0 10px; background:url(../images/ui/btn_next.svg) no-repeat 100% 50%/auto 12px; font-size:var(--F12); color:var(--gray600); line-height:20px;} /* 8Seconds 구매혜택 */ .popup .benefit_8s {width:500px;} .popup .benefit_8s > p {margin-top:24px; color:var(--gray800);} .popup .benefit_8s > p > span {display:block; margin-top:12px; font-size:var(--F14); color:var(--gray600);} .popup .benefit_8s .date {padding:30px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5;} .popup .benefit_8s .date ul li {line-height:26px;} .popup .benefit_8s .date ul li > span {display:inline-block; width:140px; color:var(--gray600);} .popup .benefit_8s .date ul li > p {display:inline-block; width:358px; vertical-align:top;} .popup .benefit_8s .rule h3 {margin-top:20px; line-height:52px; font-size:var(--F15);} .popup .benefit_8s .rule dl:after {display:block; clear:both; content:'';} .popup .benefit_8s .rule dt, .popup .benefit_8s .rule dd {float:left; width:50%; line-height:24px; text-align:center; border-bottom:1px solid var(--gray250);} .popup .benefit_8s .rule dt {padding:16px 0; color:var(--gray600); font-size:var(--F13); border-top:1px solid var(--gray250);} .popup .benefit_8s .rule dd {padding:11px 0; color:var(--gray600); font-size:var(--F14);} .popup .benefit_8s .list_wrap {margin-top:36px;} .popup .benefit_8s .list_wrap li {padding-left:6px; text-indent:-6px; color:var(--gray600); font-size:var(--F13); word-wrap:break-word; word-break:keep-all;} .popup .benefit_8s .list_wrap h3 {margin-top:20px;} /* 결제하기 */ .popup .order {width:530px;} .popup .order .sum {margin-top:10px; border-top:1px solid var(--gray900);} .popup .order .sum h4 {display:inline-block; margin:0; padding:40px 0; line-height:56px; color:var(--gray600); font-size:var(--F17);} .popup .order .sum span {float:right; padding:40px 0; line-height:56px; color:var(--gray900); font-size:35px; } .popup .order .payment {border-top:1px solid #d5d5d5;} .popup .order .payment h4 {margin-top:35px; color:var(--gray600); font-size:var(--F17);} /*#135270 : 결제수단_네이버페이추가*/ /* 2021-8-10 배포 소스*/ .popup .order .payment .tabs {margin-top:20px;} .popup .order .payment .tabs .tab {height:60px; font-size:0; margin-bottom:20px; border:0; } .popup .order .payment .tabs .tab li {display:inline-block; width:20%; height:60px; border:1px solid var(--gray250); border-right:0; box-sizing:border-box;} .popup .order .payment .tabs .tab li:last-child {border-right:1px solid var(--gray250);} .popup .order .payment .tabs .tab li > label {display:block; height:58px; line-height:58px; color:var(--gray600); font-size:var(--F15); border-bottom:0; text-align:center;} .popup .order .payment .tabs .tab li > label span { letter-spacing:-1;} .popup .order .payment .tabs .tab li > label.on {color:var(--white); background:var(--purple400);} .popup .order .payment .tabs .tab li > label.on span {font-weight:bold; color:var(--white);} /* 배송지/수거지 변경 */ .popup .to_contact {width:400px; margin:35px 30px 0;} .popup .to_contact h2 {padding-bottom:10px; border-bottom:1px solid var(--gray900);} .popup .to_contact h4 {margin-top:40px; font-size:var(--F15);} .popup .to_contact .contact {padding-bottom:40px;} .popup .to_contact .contact span {display:block; line-height:22px; color:var(--gray800); font-size:var(--F14);} .popup .to_contact .contact span.name {margin-top:10px;} .popup .to_contact .contact span.message {margin-top:8px;} .popup .to_contact .contact span.message em {margin-left:20px;} .popup .to_contact .gray_box {margin:40px 0; padding:20px; font-size:var(--F14);} .popup .to_contact .contact + .gray_box {margin-top:0;} .popup .to_contact .form_popup {border-top:1px solid var(--gray250);} .popup .to_contact .form_popup .no_service {color:var(--purple400); font-size:var(--F13);} /* #210502:20230724 start */ .popup .to_contact .form_popup h4{position:relative;} .popup .to_contact .form_popup h4 > .btn{position:absolute;right:0px;top:-8px;} /* #210502:20230724 end */ .popup .to_contact .form_popup .input_select ul {margin-top:-3px;} .popup .to_contact .check_txt {position:relative; float:right; padding-left:14px; font-size:var(--F14); color:var(--gray800); line-height:30px;} .popup .to_contact .check_txt:after {position:absolute; top:14px; left:0; width:4px; height:4px; background-color:var(--purple400); border-radius:3px; content:'';} /* 빠른배송서비스 */ .popup .to_contact.fast .contact{ padding-bottom:30px; border-bottom:1px solid #DDDDDD;} .popup .to_contact.fast h4 {margin-top:30px; line-height: 20px; margin-bottom:30px;} .popup .to_contact.fast .contact .message { font-weight: bold;} .popup .to_contact.fast .form_wrap .row {padding-left:140px; margin-top:20px;} .popup .to_contact.fast .form_wrap .row input[type="text"] {padding:0 10px;} .popup .to_contact.fast .form_wrap .row .input_box + .input_box { margin-top: 10px;} .popup .to_contact.fast .form_wrap .row select {width:100%; padding: 2px 30px 2px 10px;background: url(../images/ui/btn_down_gray.svg) no-repeat 97% center/ 12px auto;} .popup .to_contact.fast .form_wrap .row span {display: block; margin-top:10px; color:var(--purple500); font-size:var(--F13); line-height: var(--F13L);} .popup .to_contact.fast .form_wrap .row textarea{ width:100%; height:200px; padding:9px 10px;}/* #205947 */ .popup .to_contact.fast .form_wrap h3 {margin-top:30px; margin-bottom:30px;font-size:18px; line-height: 19px; font-weight: bold; } /* //빠른배송서비스 */ /* 픽업번호 */ .popup .pickup_wrap {text-align:center;} .popup .pickup_wrap h2 {margin-top:50px; font-size:23px; color:var(--gray800);} .popup .pickup_wrap .barcode {display:block; margin-top:25px; padding:0 30px;} .popup .pickup_wrap em {display:block; margin-top:30px; font-weight:bold; font-size:19px; color:var(--gray800); line-height:14px;} /* 카드혜택 */ .popup .benefit_card {width:350px;} .popup .benefit_card h4 {margin-top:30px; margin-bottom:10px; font-size:var(--F15); line-height:22px; font-weight:bold; color:var(--gray900);} .popup .benefit_card dl {display:flex; width:100%; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} .popup .benefit_card dl + dl {border-top:0;} .popup .benefit_card dl dt {padding:20px 0; width:26%; text-align:left; color:var(--gray800);} .popup .benefit_card dl dd {padding:20px 0; width:26%; color:var(--gray600); word-wrap:break-word; word-break:keep-all;} .popup .benefit_card dl dd:last-child {width:48%;} .popup .benefit_card .list_wrap {margin-top:0;} /* 혜택안내 */ .popup .benefit_info {width:480px;} .popup .benefit_info .summary em {font-weight:bold; font-size:var(--F15); line-height:22px; color:var(--gray900);} .popup .benefit_info .summary em + em:before {content:' · ';} .popup .benefit_info h4 {margin-top:30px; margin-bottom:10px; font-size:var(--F15); line-height:22px; font-weight:bold; color:var(--gray900);} .popup .benefit_info .list {margin-top:10px; margin-bottom:22px;} .popup .benefit_info .list li {padding:0 0 0 10px; line-height:var(--F14L); text-indent:-10px; color:var(--gray600); font-size:var(--F14);} .popup .benefit_info .list li:before {content:"· ";} .popup .benefit_info img {width:100%;}/*//#146036 :리사이징*/ .popup .benefit_info .link_wrap {margin:20px 0;} .popup .benefit_info .link_wrap a.btn {display:inline-block; padding:2px 20px; min-width:170px; color:var(--gray900); font-size:var(--F13); font-weight:normal; letter-spacing:-1px} /*#154874*/ .popup .benefit_info .link_wrap a.btn + a.btn {margin-left:4px;} /* 최적가 안내 */ .popup .discount_info {width:350px;} .popup .discount_info .discount {margin-bottom:15px; padding:25px 0; border-bottom:1px solid var(--gray250);} .popup .discount_info .discount dl {display:table; width:100%;} .popup .discount_info .discount dl dt {display:table-cell; height:22px; line-height:22px; color:var(--gray600);} .popup .discount_info .discount dl dd {display:table-cell; height:22px; line-height:22px; text-align:right; color:var(--gray800); font-weight:bold;} .popup .discount_info .discount dl dd em {font-weight:normal;} .popup .discount_info .discount dl.sum {margin-top:10px;} .popup .discount_info .discount dl.sum dt, .popup .discount_info .discount dl.sum dd {color:var(--gray800); font-size:19px; font-weight:bold;} .popup .discount_info > span {color:var(--gray600); } .popup .discount_info > span > em {display:block; margin-top:3px; color:var(--gray800);} .popup .discount_info > span > em.gmt {margin-top:10px; color:var(--gray600);} /* 퀵배송비 */ .popup .quick_info {width:350px;} .popup .quick_info h2 small {color:var(--gray600);} .popup .quick_info .date {display:block; margin-top:24px; color:var(--gray800); font-size:var(--F14);} .popup .quick_info .date em {font-weight:bold;} .popup .quick_info .time {margin:15px 0;} .popup .quick_info .time dl {display:table; width:100%; font-size:var(--F14);} .popup .quick_info .time dl dt {display:table-cell; padding:10px 0; width:35%; height:20px; line-height:20px; text-align:center; color:var(--gray600); border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250);} /* #158276 */ .popup .quick_info .time dl dt:last-child {width:65%;}/* #158276 */ .popup .quick_info .time dl dd {display:table-cell; padding:10px 0; width:35%; height:20px; line-height:20px; text-align:center; color:var(--gray800); border-bottom:1px solid var(--gray250);}/* #158276 */ .popup .quick_info .time dl dd:last-child {width:65%;}/* #158276 */ .popup .quick_info > span {color:var(--gray600); font-size:var(--F13);} /* 매장픽업 이용안내 */ .popup .pickup_info {width:350px;} .popup .pickup_info p {color:var(--gray600); } .popup .pickup_info p span {display:block; color:var(--gray900); font-size:var(--F15); line-height:22px; padding:20px 0 5px;} /* #194784: 23030215 start */ /* button */ .pop_find_size .btnWrap {*width:100%; text-align:center;} .pop_find_size .btnWrap .btn {display:inline-block;} .pop_find_size .btnWrap .btn a {display:block; margin:0 5px; min-width:68px; height:40px; line-height:40px; padding:0 30px; font-size:var(--F15); text-align:center; color:var(--white); background:#b4b4b4; text-decoration:none !important; font-weight:bold;} /* IE10, IE11 Hack */ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active){ .pop_find_size .btnWrap.bot-type .btn a { line-height: 38px; } } .pop_find_size .form_wrap {width:100%;} .pop_find_size .form_wrap > .check_txt {position:relative; float:right; margin-right:290px; padding-left:14px; font-size:var(--F13); color:var(--gray600); line-height:12px;} .pop_find_size .form_wrap > .check_txt:after {position:absolute; top:5px; left:0; width:4px; height:4px; background-color:var(--purple400); border-radius:3px; content:'';} .pop_find_size .form_wrap > ul > li {display:table; padding:10px 0; width:100%; min-height:35px; line-height:35px;} .pop_find_size .form_wrap > ul > li + li {*border-top:1px solid #aaa;} .pop_find_size .form_wrap > ul > li .item {display:table-cell; padding:5px 0 6px; width:140px; line-height:var(--F14L); font-size:var(--F14); vertical-align:middle; color:var(--gray600);} .pop_find_size :lang(en) .form_wrap > ul > li .item {letter-spacing:1px;} .pop_find_size .form_wrap > ul > li .item.check {position:relative;} .pop_find_size .form_wrap > ul > li .item.check:after {position:absolute; top:10px; width:4px; height:4px; margin-left:6px; background-color:var(--purple400); border-radius:3px; content:'';} .pop_find_size .form_wrap > ul > li .input_box {display:inline-block; width:100%;} .pop_find_size .form_wrap > ul > li .desc, .pop_find_size .form_wrap > ul > li .txt {margin-top:5px; line-height:20px; font-size:var(--F12);} .pop_find_size .form_wrap > ul > li .desc {display:block; margin-top:10px; color:var(--gray600);} .pop_find_size .form_wrap > ul > li.valid .desc, .pop_find_size .form_wrap > ul > li.invalid .desc {display:none;} .pop_find_size .form_wrap > ul > li .txt {display:none;} .pop_find_size .form_wrap > ul > li.valid .txt, .pop_find_size .form_wrap > ul > li.invalid .txt {display:block;} .pop_find_size .form_wrap > ul > li.valid .txt {color:var(--purple400) !important;} .pop_find_size .form_wrap > ul > li.invalid .txt {color:#f0394d !important;} .pop_find_size .form_wrap > ul > li .file_box input[type="file"] {display:none;} .pop_find_size .form_wrap > ul > li #agree_marketing {width:380px;} .pop_find_size .form_wrap > ul.unit_list {margin-bottom:10px;} .pop_find_size .form_wrap > ul.unit_list li {position:relative; padding:0 0 10px 0;} .pop_find_size .form_wrap > ul.unit_list li .input_box {width:170px; margin-top:10px;} .pop_find_size .form_wrap > ul.unit_list .txt {position:absolute; bottom:-15px; left:0;} .pop_find_size {height:100%; background:var(--white); overflow-y:auto;} .pop_find_size .btnWrap {margin-bottom:0px;} .pop_find_size .wrap_find_size {margin:30px; padding:40px 0; border-top:2px solid var(--gray900); border-bottom:2px solid var(--gray900);} .pop_find_size .wrap_find_size h1 {line-height:var(--F24L); color:var(--gray900); text-align:center; font-size:var(--F24); font-weight:bold; font-weight:600;} .pop_find_size .wrap_find_size .info_text {margin-top:5px; text-align:center; color:#888; font-size:var(--F14);} .pop_find_size .wrap_find_size .content_find_size {margin:auto; margin-top:30px; width:608px;} .pop_find_size .wrap_find_size .content_find_size h3 {margin-bottom:26px; color:#333; line-height:24px; text-align:center; font-size:18px; font-weight:bold;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec {display:block; position:relative; margin:auto; width:257px;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .input_box input {margin-top:0;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .selWrap {margin-bottom:16px;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .inputWrap {margin-bottom:16px; width:255px !important;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .inputWrap.error {margin-bottom:0;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .save_size {/* position:absolute; */} .pop_find_size .wrap_find_size .content_find_size .recommend_spec p.desc {margin-top:0; line-height:16px; font-size:var(--F12);} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .checkWrap {margin-left:57px; padding:0; text-align:center;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .checkWrap .lb_cb {color:var(--gray900);} .pop_find_size .wrap_find_size .content_find_size .recommend_spec p.info {margin:10px -70px; line-height:var(--F12L); text-align:left; color:#888; font-size:var(--F12);} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .btnWrap {/* position:absolute; */ width:210px; bottom:0; margin-top:16px; margin-left:23px;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .btnWrap .btn {width:100%;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .btnWrap .btn a {margin:0; background:var(--gray900);} /* 사이즈 추천받기 */ .pop_find_size .wrap_find_size .under_title {display:block; margin-top:10px; color:var(--gray800); text-align:center; font-size:var(--F14); font-weight:normal;} .pop_find_size .wrap_find_size .under_title .result {display:block; margin-top:2px; color:var(--purple400); font-size:28px; font-weight:bold;} .pop_find_size .wrap_find_size .under_title .rate {display:block; margin-top:10px; color:var(--gray600); font-size:var(--F14);} .pop_find_size .wrap_find_size .under_title .rate em {font-size:var(--F16); font-weight:bold;} .pop_find_size .wrap_find_size .recommend_size {margin-top:20px; width:100%;} .pop_find_size .wrap_find_size .recommend_size .edit_spec {margin:30px auto 0; width:442px;} .pop_find_size .wrap_find_size .recommend_size .edit_spec:after {display:block; clear:both; content:'';} .pop_find_size .wrap_find_size .recommend_size .edit_spec .goods {display:inline-block; width:150px;} .pop_find_size .wrap_find_size .recommend_size .edit_spec .goods img {width:100%;} .pop_find_size .wrap_find_size .recommend_size .edit_spec .values {float:right; margin-top:20px; width:262px;} .pop_find_size .wrap_find_size .recommend_size .edit_spec .values .form_wrap > ul li {padding:10px 0;} .pop_find_size .wrap_find_size .recommend_size .save_size {display:flex; flex-wrap: wrap; margin:29px auto; max-width:510px; text-align:center;} .pop_find_size .wrap_find_size .recommend_size .save_size .remote {width:26px; height:34px;} .pop_find_size .wrap_find_size .recommend_size .save_size .remote_wrap {width:100%;} .pop_find_size .wrap_find_size .recommend_size .btnWrap {margin-bottom:10px;} .pop_find_size .wrap_find_size .recommend_size .btnWrap .btn a {height:48px; line-height:48px; font-size:var(--F16); border:1px solid var(--gray900);} .pop_find_size .wrap_find_size .recommend_size .btnWrap .btn.ln a {color:var(--gray900); background:var(--white);} .pop_find_size .wrap_find_size .recommend_size .btnWrap .btn.bk a {color:var(--white); background:var(--gray900);} .pop_find_size .wrap_find_size .recommend_size .btnWrap .btn a.disabled {color:var(--white) !important; background:#d5d5d5 !important; border-color:#d5d5d5;} .pop_find_size .wrap_find_size .recommend_size + .under_title {padding-top:60px; border-top:1px solid var(--gray250);} .pop_find_size .wrap_find_size .content_find_size .recommend_prod {float:right; display:inline-block; margin-right:54px; width:210px;} .pop_find_size .wrap_find_size .content_find_size .recommend_prod p {text-align:center; height:252px; line-height:252px; font-size:var(--F14);} .pop_find_size .wrap_find_size .content_find_size .recommend_prod p.smile {background:url('../images/suit_finder/ico_smile.png') no-repeat center 70px;} .pop_find_size .wrap_find_size .content_find_size .recommend_prod .btnWrap .btn {width:100%;} .pop_find_size .wrap_find_size .content_find_size .recommend_prod .btnWrap .btn a {margin:0; background:var(--gray900);} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .form_wrap .unit_list > li + li {margin-top:0;} .pop_find_size .response_size {text-align:center;} .pop_find_size .response_size .text_size {margin:auto; width:280px; padding-bottom:20px; border-bottom:2px solid var(--gray250);} .pop_find_size .response_size .text_size span {position:relative; width:130px; display:inline-block; vertical-align:top; color:#333; line-height:56px; font-size:50px; font-weight:bold; word-break:keep-all;} .pop_find_size .response_size .text_size span + span {margin-left:10px;} .pop_find_size .response_size .text_size span em {display:block; padding-bottom:22px; line-height:28px; font-size:22px; font-weight:normal;} .pop_find_size .response_size .text_size span em.soltout {position:absolute; width:130px; margin-top:-22px; color:var(--purple400); line-height:22px; font-size:var(--F14);} .pop_find_size .response_size .my_size {margin-top:24px;} .pop_find_size .response_size .my_size span {display:inline-block; color:#888; line-height:28px; font-size:22px;} .pop_find_size .response_size .my_size span + span {margin-left:30px;} .pop_find_size .response_size .btnWrap {margin:auto; margin-bottom:2px; width:280px;} .pop_find_size .response_size .btnWrap .btn a {margin:0; width:220px; height:50px; line-height:50px; background:var(--gray900);} .pop_find_size .response_size .btnWrap .btn:first-child a {margin-top:50px;} .pop_find_size .response_size .btnWrap .btn:nth-child(2) a {background:#888;} .pop_find_size .response_size .btnWrap .btn + .btn {margin-top:10px;} .pop_find_size .response_size .soldout {margin-top:49px; color:var(--gray900); font-size:var(--F14);} .pop_find_size .wrap_find_list .btnWrap {margin:auto; margin-bottom:2px; width:280px;} .pop_find_size .wrap_find_list .btnWrap .btn a {margin:0; margin-bottom:40px; width:220px; height:50px; line-height:50px; background:var(--gray900);} .pop_find_size .wrap_find_list {margin-top:40px; background:var(--white);} .pop_find_size .wrap_find_list h3 {margin-bottom:26px; color:#333; line-height:24px; text-align:center; font-size:18px; font-weight:bold; font-weight:600;} .pop_find_size .wrap_find_list ul {margin:auto; width:480px;} .pop_find_size .wrap_find_list ul li {float:left; width:150px; height:320px; margin-bottom:0; text-align:center; padding-left:0;} .pop_find_size .wrap_find_list ul li {margin-right:15px;} .pop_find_size .wrap_find_list ul li:nth-child(3n+3) {margin-right:0;} .pop_find_size .wrap_find_list ul li > a {display:block; font-weight:normal; font-size:var(--F14);} .pop_find_size .wrap_find_list ul li .name, .pop_find_size .wrap_find_list ul li .productTitle, .pop_find_size .wrap_find_list ul li .price {display:block; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .pop_find_size .wrap_find_list ul li .name {margin-top:13px; width:100%;} .pop_find_size .wrap_find_list ul li .productTitle {font-weight:normal;color:#333;margin-top:0;} .pop_find_size .wrap_find_list ul li img {max-width:100%; height:auto;} .pop_find_size .wrap_find_list ul li .price {overflow:hidden; color:#333; font-weight:normal; font-size:var(--F14);} .pop_find_size .wrap_find_list ul li .price .prc.line-th {color:#999;} .pop_find_size .wrap_find_list ul li .price .prc {display:block; float:left; color:var(--purple400); font-weight:normal; margin-right:5px;} .pop_find_size .wrap_find_size .content_find_buy {margin:auto; /*width:608px;*/} .pop_find_size .wrap_find_size .content_find_buy .dateSearchWrap-small {border-top:2px solid var(--gray250); border-bottom:2px solid var(--gray250);} .pop_find_size .wrap_find_size .content_find_buy .dateSearchWrap-small .datePickerWrap {margin:auto; text-align:center;} .pop_find_size .wrap_find_size .content_find_buy .dateSearchWrap-small .datePickerWrap .bt-cal{display:none;} .pop_find_size .wrap_find_size .content_find_buy .dateSearchWrap-small .dateSelWrap .dateSel {float:none; margin:auto; width:190px;} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap {margin:10px 0;} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap table {margin:auto;} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap td {padding-top:20px; padding-bottom:20px; font-size:var(--F14); border-bottom:1px solid var(--gray250);} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap td .prdInfo .prdName {margin-top:5px; max-height:36px; white-space:normal; overflow:visible; word-break:keep-all; cursor:default;} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap td .prdInfo .buy_date {color:#888;} .pop_find_size .wrap_find_size .content_find_buy .tbl-wrap td.nodata {width:725px; line-height:180px; text-align:center;} .pop_find_size .wrap_find_size .content_find_buy .btnWrap {margin-top:30px;} /* 구매상품 사이즈로 추천받기 - 삭제 */ .pop_find_size .wrap_find_size .content_find_size .recommend_spec .form_wrap > ul.unit_list li .input_box {margin-right:10px; width:215px;} .pop_find_size .wrap_find_size .content_find_size .recommend_spec .form_wrap > ul > li .desc, .pop_find_size .wrap_find_size .content_find_size .recommend_spec .form_wrap > ul > li .txt {bottom:-10px;} .pop_find_size .wrap_find_size .content_find_size .recommend_prod {display:none;} /* 실측사이즈 : 상품상세 & 사이츠추천 */ .pop_find_size .data_ruler {text-align:center;} .pop_find_size .data_ruler .ruler {display:inline-block; position:relative;} .pop_find_size .data_ruler .ruler dl.values dd {display:block; position:absolute; top:0; left:0; width:100%; height:100%; background-position:center top;} .pop_find_size .data_ruler .ruler dl.values dd > span {display:block; position:absolute; z-index: 1; top:0; left:0; width:200px; text-align:center; color:var(--gray600); font-size:var(--F12);} .pop_find_size .data_ruler .ruler dl.values dd > span > em {margin-left:5px; color:var(--gray900); font-size:var(--F13); font-weight:bold;} /* SHIRT_LS */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W001, .pop_find_size .data_ruler .ruler.SHIRT_LS .E107 {background-image:url(../images/size_gd/SHIRT_LS_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SHIRT_LS .W002 {background-image:url(../images/size_gd/SHIRT_LS_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W003 {background-image:url(../images/size_gd/SHIRT_LS_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W004 {background-image:url(../images/size_gd/SHIRT_LS_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W005 {background-image:url(../images/size_gd/SHIRT_LS_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W006 {background-image:url(../images/size_gd/SHIRT_LS_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W007 {background-image:url(../images/size_gd/SHIRT_LS_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W008 {background-image:url(../images/size_gd/SHIRT_LS_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W010 {background-image:url(../images/size_gd/SHIRT_LS_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .E015 {background-image:url(../images/size_gd/SHIRT_LS_E015.png?timestamp=20220204);} /* 목둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W001 span, .pop_find_size .data_ruler .ruler.SHIRT_LS .E107 span {top:154px; left:-153px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SHIRT_LS .W002 span {top:83px; left:189px; text-align:left;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W003 span {top:131px; left:189px; text-align:left;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W004 span {top:231px; left:189px; text-align:left;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W005 span {top:288px; left:142px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W006 span {top:154px; left:370px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W007 span {top:154px; left:76px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W008 span {top:277px; left:346px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .W010 span {top:30px; left:280px; text-align:left;} /* 화장 */ .pop_find_size .data_ruler .ruler.SHIRT_LS .E015 span {top:-1px; left:142px;} /* 목둘레 */ /* FORMAL_PANTS */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B001 {background-image:url(../images/size_gd/FORMAL_PANTS_B001.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B002 {background-image:url(../images/size_gd/FORMAL_PANTS_B002.png?timestamp=20220204);} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B004 {background-image:url(../images/size_gd/FORMAL_PANTS_B004.png?timestamp=20220204);} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B006 {background-image:url(../images/size_gd/FORMAL_PANTS_B006.png?timestamp=20220204);} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B007 {background-image:url(../images/size_gd/FORMAL_PANTS_B007.png?timestamp=20220204);} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B009 {background-image:url(../images/size_gd/FORMAL_PANTS_B009.png?timestamp=20220204);} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .E033 {background-image:url(../images/size_gd/FORMAL_PANTS_E033.png?timestamp=20220204);} /* 허벅지너비 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B001 span {top:21px; left:-83px; text-align:right;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B002 span {top:84px; left:-93px; text-align:right;} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B004 span {top:60px; left:110px; text-align:right; line-height: 1.2;} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B006 span {top:207px; left:-105px; text-align:right; line-height: 1.2;} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B007 span {top:168px; left:58px; text-align:right; line-height: 1.2;} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .B009 span {top:329px; left:259px;} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.FORMAL_PANTS .E033 span {top:134px; left:-101px; text-align:right;} /* 허벅지너비 */ /* DRESS */ .pop_find_size .data_ruler .ruler.DRESS .W001, .pop_find_size .data_ruler .ruler.DRESS .E107 {background-image:url(../images/size_gd/DRESS_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.DRESS .W002 {background-image:url(../images/size_gd/DRESS_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.DRESS .W003 {background-image:url(../images/size_gd/DRESS_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W004 {background-image:url(../images/size_gd/DRESS_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W005 {background-image:url(../images/size_gd/DRESS_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W006 {background-image:url(../images/size_gd/DRESS_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.DRESS .W007 {background-image:url(../images/size_gd/DRESS_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.DRESS .W008 {background-image:url(../images/size_gd/DRESS_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.DRESS .W010 {background-image:url(../images/size_gd/DRESS_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.DRESS .W001 span, .pop_find_size .data_ruler .ruler.DRESS .E107 span {top:154px; left:-136px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.DRESS .W002 span {top:49px; left:161px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.DRESS .W003 span {top:87px; left:161px;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W004 span {top:141px; left:161px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W005 span {top:312px; left:161px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.DRESS .W006 span {top:47px; left:365px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.DRESS .W007 span {top:74px; left:102px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.DRESS .W008 span {top:141px; left:353px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.DRESS .W010 span {top:7px; left:291px; text-align:left;} /* 화장 */ /* JACKET */ .pop_find_size .data_ruler .ruler.JACKET .W001, .pop_find_size .data_ruler .ruler.JACKET .E107 {background-image:url(../images/size_gd/JACKET_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.JACKET .W002 {background-image:url(../images/size_gd/JACKET_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.JACKET .W003 {background-image:url(../images/size_gd/JACKET_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.JACKET .W004 {background-image:url(../images/size_gd/JACKET_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.JACKET .W006 {background-image:url(../images/size_gd/JACKET_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.JACKET .W007 {background-image:url(../images/size_gd/JACKET_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.JACKET .W008 {background-image:url(../images/size_gd/JACKET_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.JACKET .W010 {background-image:url(../images/size_gd/JACKET_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.JACKET .W001 span, .pop_find_size .data_ruler .ruler.JACKET .E107 span {top:151px; left:-143px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.JACKET .W002 span {top:2px; left:158px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.JACKET .W003 span {top:147px; left:204px; text-align:left;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.JACKET .W004 span {top:232px; left:204px; text-align:left;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.JACKET .W006 span {top:151px; left:375px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.JACKET .W007 span {top:151px; left:95px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.JACKET .W008 span {top:276px; left:342px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.JACKET .W010 span {top:35px; left:302px; text-align:left;} /* 화장 */ /* KNIT */ .pop_find_size .data_ruler .ruler.KNIT .K001 {background-image:url(../images/size_gd/KNIT_K001.png?timestamp=20220204);} /* 옷길이 */ .pop_find_size .data_ruler .ruler.KNIT .K002 {background-image:url(../images/size_gd/KNIT_K002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.KNIT .K003 {background-image:url(../images/size_gd/KNIT_K003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K004 {background-image:url(../images/size_gd/KNIT_K004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K005 {background-image:url(../images/size_gd/KNIT_K005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K006 {background-image:url(../images/size_gd/KNIT_K006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.KNIT .K007 {background-image:url(../images/size_gd/KNIT_K007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.KNIT .K008 {background-image:url(../images/size_gd/KNIT_K008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.KNIT .K011 {background-image:url(../images/size_gd/KNIT_K011.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.KNIT .K013 {background-image:url(../images/size_gd/KNIT_K013.png?timestamp=20220204);} /* 목둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K001 span {top:141px; left:-160px; text-align:right;} /* 옷길이 */ .pop_find_size .data_ruler .ruler.KNIT .K002 span {top:73px; left:195px; text-align:left;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.KNIT .K003 span {top:137px; left:195px; text-align:left;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K004 span {top:212px; left:195px; text-align:left;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K005 span {top:257px; left:150px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.KNIT .K006 span {top:141px; left:375px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.KNIT .K007 span {top:141px; left:79px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.KNIT .K008 span {top:292px; left:360px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.KNIT .K011 span {top:24px; left:299px; text-align:left;} /* 화장 */ .pop_find_size .data_ruler .ruler.KNIT .K013 span {top:-4px; left:150px;} /* 목둘레 */ /* KNIT_VEST */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K001 {background-image:url(../images/size_gd/KNIT_VEST_K001.png);} /* 옷길이 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K002 {background-image:url(../images/size_gd/KNIT_VEST_K002.png);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K003 {background-image:url(../images/size_gd/KNIT_VEST_K003.png);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K004 {background-image:url(../images/size_gd/KNIT_VEST_K004.png);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K005 {background-image:url(../images/size_gd/KNIT_VEST_K005.png);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K013 {background-image:url(../images/size_gd/KNIT_VEST_K013.png);} /* 목둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K001 span {top:125px; left:-52px; text-align:right;} /* 옷길이 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K002 span {top:48px; left:150px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K003 span {top:126px; left:150px;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K004 span {top:202px; left:150px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K005 span {top:243px; left:150px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.KNIT_VEST .K013 span {top:10px; left:150px;} /* 목둘레 */ /* OUTER */ .pop_find_size .data_ruler .ruler.OUTER .W001, .pop_find_size .data_ruler .ruler.OUTER .E107 {background-image:url(../images/size_gd/OUTER_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.OUTER .W002 {background-image:url(../images/size_gd/OUTER_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.OUTER .W003 {background-image:url(../images/size_gd/OUTER_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W004 {background-image:url(../images/size_gd/OUTER_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W005 {background-image:url(../images/size_gd/OUTER_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W006 {background-image:url(../images/size_gd/OUTER_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.OUTER .W007 {background-image:url(../images/size_gd/OUTER_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.OUTER .W008 {background-image:url(../images/size_gd/OUTER_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.OUTER .W010 {background-image:url(../images/size_gd/OUTER_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.OUTER .W001 span, .pop_find_size .data_ruler .ruler.OUTER .E107 span {top:171px; left:-127px; text-align:right;} /* 옷길이 */ .pop_find_size .data_ruler .ruler.OUTER .W002 span {top:-1px; left:157px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.OUTER .W003 span {top:119px; left:249px; text-align:left;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W004 span {top:190px; left:249px; text-align:left;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W005 span {top:351px; left:156px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.OUTER .W006 span {top:119px; left:362px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.OUTER .W007 span {top:171px; left:102px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.OUTER .W008 span {top:248px; left:332px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.OUTER .W010 span {top:25px; left:305px; text-align:left;} /* 화장 */ /* PANTS */ .pop_find_size .data_ruler .ruler.PANTS .B001 {background-image:url(../images/size_gd/PANTS_B001.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.PANTS .B002 {background-image:url(../images/size_gd/PANTS_B002.png?timestamp=20220204);} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.PANTS .B004 {background-image:url(../images/size_gd/PANTS_B004.png?timestamp=20220204);} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.PANTS .B006 {background-image:url(../images/size_gd/PANTS_B006.png?timestamp=20220204);} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.PANTS .B007 {background-image:url(../images/size_gd/PANTS_B007.png?timestamp=20220204);} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.PANTS .B009 {background-image:url(../images/size_gd/PANTS_B009.png?timestamp=20220204);} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.PANTS .E033 {background-image:url(../images/size_gd/PANTS_E033.png?timestamp=20220204);} /* 허벅지너비 */ .pop_find_size .data_ruler .ruler.PANTS .B001 span {top:15px; left:-85px; text-align:right;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.PANTS .B002 span {top:60px; left:-85px; text-align:right;} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.PANTS .B004 span {top:55px; left:118px; text-align:right; line-height:1.2;} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.PANTS .B006 span {top:194px; left:-92px; text-align:right; line-height:1.2;} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.PANTS .B007 span {top:161px; left:66px; text-align:right; line-height:1.2;} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.PANTS .B009 span {top:326px; left:269px;} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.PANTS .E033 span {top:116px; left:-96px; text-align:right;} /* 허벅지너비 */ /* SHIRT_SS */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W001, .pop_find_size .data_ruler .ruler.SHIRT_SS .E107 {background-image:url(../images/size_gd/SHIRT_SS_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SHIRT_SS .W002 {background-image:url(../images/size_gd/SHIRT_SS_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W003 {background-image:url(../images/size_gd/SHIRT_SS_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W004 {background-image:url(../images/size_gd/SHIRT_SS_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W005 {background-image:url(../images/size_gd/SHIRT_SS_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W006 {background-image:url(../images/size_gd/SHIRT_SS_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W007 {background-image:url(../images/size_gd/SHIRT_SS_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W008 {background-image:url(../images/size_gd/SHIRT_SS_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W010 {background-image:url(../images/size_gd/SHIRT_SS_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .E015 {background-image:url(../images/size_gd/SHIRT_SS_E015.png?timestamp=20220204);} /* 목둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W001 span, .pop_find_size .data_ruler .ruler.SHIRT_SS .E107 span {top:147px; left:-153px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SHIRT_SS .W002 span {top:70px; left:194px; text-align:left;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W003 span {top:128px; left:194px; text-align:left;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W004 span {top:224px; left:194px; text-align:left;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W005 span {top:288px; left:144px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W006 span {top:56px; left:346px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W007 span {top:147px; left:97px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W008 span {top:140px; left:350px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .W010 span {top:23px; left:280px; text-align:left;} /* 화장 */ .pop_find_size .data_ruler .ruler.SHIRT_SS .E015 span {top:-3px; left:145px;} /* 목둘레 */ /* SHORTS */ .pop_find_size .data_ruler .ruler.SHORTS .B001 {background-image:url(../images/size_gd/SHORTS_B001.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHORTS .B002 {background-image:url(../images/size_gd/SHORTS_B002.png?timestamp=20220204);} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.SHORTS .B004 {background-image:url(../images/size_gd/SHORTS_B004.png?timestamp=20220204);} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.SHORTS .B006 {background-image:url(../images/size_gd/SHORTS_B006.png?timestamp=20220204);} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.SHORTS .B007 {background-image:url(../images/size_gd/SHORTS_B007.png?timestamp=20220204);} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.SHORTS .B009 {background-image:url(../images/size_gd/SHORTS_B009.png?timestamp=20220204);} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.SHORTS .E033 {background-image:url(../images/size_gd/SHORTS_E033.png?timestamp=20220204);} /* 허벅지너비 */ .pop_find_size .data_ruler .ruler.SHORTS .B001 span {top:49px; left:-121px; text-align:right;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SHORTS .B002 span {top:109px; left:-125px; text-align:right;} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.SHORTS .B004 span {top:97px; left:252px; width:50px; text-align:right; line-height:1.2;} /* 앞 밑위길이 */ .pop_find_size .data_ruler .ruler.SHORTS .B004 span em {display:block;} .pop_find_size .data_ruler .ruler.SHORTS .B006 span {top:177px; left:18px; width:50px; text-align:right; line-height:1.2;} /* 옷길이(인심) */ .pop_find_size .data_ruler .ruler.SHORTS .B006 span em {display:block;} .pop_find_size .data_ruler .ruler.SHORTS .B007 span {top:138px; left:226px; width:50px; text-align:right; line-height:1.2;} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.SHORTS .B007 span em {display:block;} .pop_find_size .data_ruler .ruler.SHORTS .B009 span {top:247px; left:277px;} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.SHORTS .E033 span {top:129px; left:-125px; text-align:right;} /* 허벅지너비 */ /* SKIRT */ .pop_find_size .data_ruler .ruler.SKIRT .B001 {background-image:url(../images/size_gd/SKIRT_B001.png);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SKIRT .B003 {background-image:url(../images/size_gd/SKIRT_B003.png);} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.SKIRT .B007 {background-image:url(../images/size_gd/SKIRT_B007.png);} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.SKIRT .B009 {background-image:url(../images/size_gd/SKIRT_B009.png);} /* 밑단너비 */ .pop_find_size .data_ruler .ruler.SKIRT .B001 span {top:14px; left:164px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SKIRT .B003 span {top:115px; left:164px;} /* 엉덩이둘레 */ .pop_find_size .data_ruler .ruler.SKIRT .B007 span {top:145px; left:-45px; text-align:right;} /* 옷길이(아웃심) */ .pop_find_size .data_ruler .ruler.SKIRT .B009 span {top:282px; left:164px;} /* 밑단너비 */ /* SLEEVELESS */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W001, .pop_find_size .data_ruler .ruler.SLEEVELESS .E107 {background-image:url(../images/size_gd/SLEEVELESS_W001.png);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SLEEVELESS .W002 {background-image:url(../images/size_gd/SLEEVELESS_W002.png);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W003 {background-image:url(../images/size_gd/SLEEVELESS_W003.png);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W004 {background-image:url(../images/size_gd/SLEEVELESS_W004.png);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W005 {background-image:url(../images/size_gd/SLEEVELESS_W005.png);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W001 span, .pop_find_size .data_ruler .ruler.SLEEVELESS .E107 span {top:146px; left:-95px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.SLEEVELESS .W002 span {top:23px; left:142px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W003 span {top:120px; left:142px;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W004 span {top:220px; left:142px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.SLEEVELESS .W005 span {top:274px; left:142px;} /* 밑단둘레 */ /* TOP_LS */ .pop_find_size .data_ruler .ruler.TOP_LS .W001, .pop_find_size .data_ruler .ruler.TOP_LS .E107 {background-image:url(../images/size_gd/TOP_LS_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.TOP_LS .W002 {background-image:url(../images/size_gd/TOP_LS_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W003 {background-image:url(../images/size_gd/TOP_LS_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W004 {background-image:url(../images/size_gd/TOP_LS_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W005 {background-image:url(../images/size_gd/TOP_LS_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W006 {background-image:url(../images/size_gd/TOP_LS_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.TOP_LS .W007 {background-image:url(../images/size_gd/TOP_LS_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W008 {background-image:url(../images/size_gd/TOP_LS_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W010 {background-image:url(../images/size_gd/TOP_LS_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.TOP_LS .W001 span, .pop_find_size .data_ruler .ruler.TOP_LS .E107 span {top:143px; left:-157px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.TOP_LS .W002 span {top:73px; left:142px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W003 span {top:129px; left:142px;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W004 span {top:219px; left:142px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W005 span {top:272px; left:142px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.TOP_LS .W006 span {top:141px; left:375px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.TOP_LS .W007 span {top:141px; left:69px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W008 span {top:268px; left:358px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.TOP_LS .W010 span {top:22px; left:293px; text-align:left;} /* 화장 */ /* TOP_SS */ .pop_find_size .data_ruler .ruler.TOP_SS .W001, .pop_find_size .data_ruler .ruler.TOP_SS .E107 {background-image:url(../images/size_gd/TOP_SS_W001.png?timestamp=20220204);} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.TOP_SS .W002 {background-image:url(../images/size_gd/TOP_SS_W002.png?timestamp=20220204);} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W003 {background-image:url(../images/size_gd/TOP_SS_W003.png?timestamp=20220204);} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W004 {background-image:url(../images/size_gd/TOP_SS_W004.png?timestamp=20220204);} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W005 {background-image:url(../images/size_gd/TOP_SS_W005.png?timestamp=20220204);} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W006 {background-image:url(../images/size_gd/TOP_SS_W006.png?timestamp=20220204);} /* 소매길이 */ .pop_find_size .data_ruler .ruler.TOP_SS .W007 {background-image:url(../images/size_gd/TOP_SS_W007.png?timestamp=20220204);} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W008 {background-image:url(../images/size_gd/TOP_SS_W008.png?timestamp=20220204);} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W010 {background-image:url(../images/size_gd/TOP_SS_W010.png?timestamp=20220204);} /* 화장 */ .pop_find_size .data_ruler .ruler.TOP_SS .W001 span, .pop_find_size .data_ruler .ruler.TOP_SS .E107 span {top:147px; left:-153px; text-align:right;} /* 옷길이 *//*//#168143*/ .pop_find_size .data_ruler .ruler.TOP_SS .W002 span {top:79px; left:142px;} /* 어깨너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W003 span {top:120px; left:142px;} /* 가슴둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W004 span {top:224px; left:142px;} /* 허리둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W005 span {top:278px; left:142px;} /* 밑단둘레 */ .pop_find_size .data_ruler .ruler.TOP_SS .W006 span {top:45px; left:348px; text-align:left;} /* 소매길이 */ .pop_find_size .data_ruler .ruler.TOP_SS .W007 span {top:54px; left:97px; text-align:left;} /* 소매통너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W008 span {top:124px; left:357px; text-align:left;} /* 소맷부리너비 */ .pop_find_size .data_ruler .ruler.TOP_SS .W010 span {top:22px; left:281px; text-align:left;} /* 화장 */ .pop_find_size .data_ruler .ruler + .size {margin-top:30px !important;} .pop_find_size .data_ruler .size {display:block; margin:100px auto 25px; max-width:721px; text-align:center;} .pop_find_size .data_ruler .size ul {display:inline-block; position:relative; text-align:center;} .pop_find_size .data_ruler .size li {margin-left:-1px; display:table-cell; float:left; width:119px; height:34px; border:1px solid var(--gray250); z-index:0;} .pop_find_size .data_ruler .size li:nth-child(1n+7) {margin-top:-1px;} .pop_find_size .data_ruler .size li label {display:block; position:absolute; width:119px; height:34px; line-height:33px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .pop_find_size .data_ruler .size li input[type=radio]:checked + label { margin:-1px 0 0 -1px; color:var(--purple400); border:1px solid var(--purple400); z-index:1;} .pop_find_size .data_ruler .size li input[type=radio]:disabled + label {cursor:default;} .pop_find_size .data_ruler .size li label.recomanded:before {display:inline-block; margin-top:8px; margin-right:3px; padding:0 6px; vertical-align:top; line-height:18px; content:"추천"; color:var(--white); font-size:var(--F11); background:var(--purple400); border-radius:9px;} .pop_find_size .data_ruler .size:after {display:block; clear:both; content:"";} .pop_find_size .data_ruler .size {max-width:361px;} .pop_find_size .data_ruler .size li {margin-bottom:42px;} .pop_find_size .data_ruler .size li:nth-child(1n+7) {margin-top:0;} .pop_find_size .data_ruler .size li .stock {position:relative; top:42px; left:0; width:119px; text-align:center; color:var(--gray600); font-size:var(--F13);} /*product info*/ .pop_find_size .prdInfoWrap {position:relative; display: table; width:100%; /*margin:0 15px; */} .pop_find_size .prdInfoWrap .prdImg {overflow: hidden; width:100px; height:132px; margin-right:20px; display:table-cell; float:left;} .pop_find_size .prdInfoWrap .prdImg, .pop_find_size .prdInfoWrap .prdInfo {width:100%; display: table-cell; vertical-align: top; text-align: left;} .pop_find_size .prdInfoWrap .prdImg img {width:100px; height:132px;} .pop_find_size .prdInfoWrap .prdInfo > a > span {display:block} .pop_find_size .prdInfoWrap .prdInfo > span.add-config, .pop_find_size .prdInfoWrap .prdInfo > a {display:block} .pop_find_size .prdInfoWrap .prdInfo > a ~ .prdBrand {display:block; margin-top:8px} .pop_find_size .prdInfoWrap .prdInfo > span.add-config .prdName { cursor: inherit; } .pop_find_size .prdInfoWrap .prdInfo .ic_order {margin-right:5px;} .pop_find_size .prdInfoWrap .prdInfo .ic_prd span {font-size:var(--F13);} .pop_find_size .prdInfoWrap .prdInfo .prdBrand {color:#333} .pop_find_size .prdInfoWrap .prdInfo .prdStore {color:var(--purple400);} .pop_find_size .prdInfoWrap .prdInfo .prdStore span {font-size:var(--F14);} .pop_find_size .prdInfoWrap .prdInfo .prdName {display:block; color:#333; line-height:18px; max-height:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer} .pop_find_size .prdInfoWrap .prdInfo .prdOption {padding-top:10px; line-height:22px;} .pop_find_size .prdInfoWrap .prdInfo .prdOption .option {*color:#999; padding-right:6px;} .pop_find_size .prdInfoWrap .prdInfo .btn_prdOpt {color:var(--gray700); text-decoration:underline; position:relative;} .pop_find_size .prdInfoWrap .prdInfo .btn_prdOpt:hover {text-decoration:underline;} .pop_find_size .prdInfoWrap .prdInfo .prdPrice {*padding-top:3px; font-weight:normal;} .pop_find_size .prdInfoWrap .prdInfo .prdPrice .price {*color:#333; line-height:22px;} .pop_find_size .prdInfoWrap .prdInfo .prdPrice .price em {*font-weight:bold;} .pop_find_size .prdInfoWrap .prdInfo .prdPrice .special {color:#333; padding-left:0;} /*product info 묶음할인*/ .pop_find_size .prdInfoWrap .prdInfo .prdSale {float:left; position:relative; height:18px; margin-top:5px; overflow:hidden; border:1px solid var(--purple400); padding:0 54px 0 10px; color:var(--purple400); font-size:var(--F11); line-height:16px} .pop_find_size .prdInfoWrap .prdInfo .prdSale span {display:inline-block; float:left} .pop_find_size .prdInfoWrap .prdInfo .prdSale span * {vertical-align:middle;} .pop_find_size .prdInfoWrap .prdInfo .prdSale span em {display:inline-block; max-width:210px; /*max-width:181px; margin-right:32px; */word-break:break-all; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} .pop_find_size .prdInfoWrap .prdInfo .prdSale .btnMore {position:absolute; top:0; right:0px; color:var(--white); padding-right:10px; padding-left:180px; line-height:40px} .pop_find_size .prdInfoWrap .prdInfo .prdSale .ic_more {position:absolute; top:6px; right:0; width:5px; height:7px; background:url('../images/suit_finder/ic.png') no-repeat; background-position:0 -320px;} /*radio button*/ .pop_find_size .radioWrap {position:relative; display:inline-block; font-size:var(--F14);} .pop_find_size .lb_rd {position:relative; line-height:22px; padding-left:30px; margin-right:15px; cursor:pointer;} .pop_find_size .radioWrap input[type=radio] {position:absolute; width:0; height:0; opacity:0;} .pop_find_size .ic_rd {position:absolute; top:50%; left:0; margin-top:-10px; text-indent:-9999em; font-size:0; width:22px; height:22px; background:url('../images/suit_finder/ic_box.png') no-repeat; background-position:0 -448px; color:transparent} .pop_find_size .radioWrap .lb_rd.on .ic_rd {background-position:0 -424px;} .pop_find_size .radioWrap .disabled {cursor:pointer;} .pop_find_size .radioWrap .disabled .ic_rd {background-position:0 -472px;} .pop_find_size .radioWrap.option {font-size:var(--F11); color:#333; vertical-align:middle; font-weight:bold;} .pop_find_size .radioWrap.option .lb_rd {float:left; width:23px; height:23px; padding:0; margin-right:5px; border:1px solid #ccc; font:11px/23px Lato-Bold; text-align:center} .pop_find_size .radioWrap.option .lb_rd.on {color:var(--white); background:var(--gray900); border-color:var(--gray900);} .pop_find_size .radioWrap.option .lb_rd.disabled {border-color:#ccc; color:#999; background:url(../images/suit_finder/bg_size.gif) no-repeat 0 0} .pop_find_size .radioWrap.option .lb_rd .ic_rd {background:none; width:100%; height:100%; top:0; margin-top:0;} .pop_find_size .radioWrap.option .lb_rd.on .ic_rd {width:25px; height:25px; top:-1px; left:-1px} .pop_find_size .radioWrap.color .lb_rd {float:left; width:23px; height:23px; margin-right:5px; padding:1px; border-width:0} .pop_find_size .radioWrap.color .lb_rd.color09, .pop_find_size .radioWrap.color .lb_rd.color10, .pop_find_size .radioWrap.color .lb_rd.color13, .pop_find_size .radioWrap.color .lb_rd.color17, .pop_find_size .radioWrap.color .lb_rd.color25, .pop_find_size .radioWrap.color .lb_rd.color29 {padding:0; border:1px solid #ccc} .pop_find_size .radioWrap.color .lb_rd.on {width:21px; height:21px; padding:0; border:2px solid var(--gray900);} .pop_find_size .radioWrap.color .lb_rd .ic_rd {width:19px; height:19px; top:0; margin-top:0; ; border:1px solid var(--white); background:none; display:none} .pop_find_size .radioWrap.color .lb_rd.on .ic_rd {display:block} .pop_find_size .popCnt .option_sel {font-size:var(--F14); color:#333;} .pop_find_size .popCnt .option_sel:after {content:""; display:block; clear:both;} .pop_find_size .popCnt .option_sel strong {display:block; margin:0 0 10px; font-weight:bold;} .pop_find_size .popCnt .option_sel .label {display:inline-block; vertical-align:middle; width:85px; height:40px; line-height:40px;} /* dateSearchWrap-small */ .pop_find_size .dateSearchWrap-small {position:relative; padding:20px 0; margin-top:30px;} .pop_find_size .dateSearchWrap-small .datePickerWrap {border:0; background:none;} .pop_find_size .dateSearchWrap-small .datePickerWrap .inputWrap .inputBox .inp_txt {width:240px; height:24px; line-height:24px; text-align:left; text-indent:0; font-size:var(--F16); color:#333; font-weight:bold; letter-spacing:-0.2px; border:0;} .pop_find_size .dateSearchWrap-small .datePickerWrap .bt-sch {position:absolute; top:20px; right:0; display:block; width:96px; height:35px; text-indent:0; border:2px solid var(--gray250); line-height:35px; font-size:var(--F14); color:#333; text-align:center; font-weight:bold;} .pop_find_size .dateSearchWrap-small .datePickerWrap .bt-request {position:absolute; right:0; top:0; display:block; width:150px; height:42px; text-indent:0; border:2px solid var(--purple400); line-height:42px; font-size:var(--F16); color:var(--white); text-align:center; font-weight:bold; background:var(--purple400);} .pop_find_size .dateSearchWrap-small .datePickerWrap .cal-area {left:72px;} .pop_find_size .dateSearchWrap-small .dateSelWrap {display:block; margin-top:20px; clear:both;} .pop_find_size .dateSearchWrap-small .dateSelWrap ul.dateSel li {padding-left:19px; background: url('../images/suit_finder/bul_dashed_light.gif') no-repeat left center;} .pop_find_size .dateSearchWrap-small .dateSelWrap ul.dateSel li:first-child {margin-left:0; padding-left:0; background:none;} .pop_find_size .dateSearchWrap-small .dateSelWrap ul.dateSel li a {color:#888; font-size:var(--F14); line-height:22px;} .pop_find_size .dateSearchWrap-small .dateSelWrap ul.dateSel li.current a {color:var(--purple400); padding-left:24px; background:url(../images/ui/bg_fin_check_em.svg) no-repeat left center/ 10px auto;} .pop_find_size .dateSearchWrap-small .ui-datepicker {position:absolute; margin-top:70px; margin-left:-26px; width:642px !important; background:var(--white); z-index:9;} .pop_find_size .dateSearchWrap-small .ui-datepicker .ui-datepicker-group {padding:0 20px;} /* #194784: 23030215 end */ /* 사이즈 가이드 */ .popup .size_info {width:900px; min-height:645px;} .popup .size_info .tabs {margin-top:40px;} .popup .size_info .tabs .tab li {width:33.33%;} .popup .size_info .tabs .tab.t1 li {width:100%;} .popup .size_info .tabs .tab.t2 li {width:50%;} .popup .size_info .check_size {margin-top:40px; text-align:left;} .popup .size_info .check_size h4 {padding-bottom:15px; color:var(--gray800); font-size:var(--F15);} .popup .size_info .check_size .data_size table {width:100%;} .popup .size_info .check_size .data_size table tr th, .popup .size_info .check_size .data_size table tr td {line-height:36px; font-size:var(--F14); font-weight:normal;} .popup .size_info .check_size .data_size table tr th {text-align:left; text-indent:10px; color:var(--gray600);} .popup .size_info .check_size .data_size table tr td {text-align:center;} .popup .size_info .check_size .data_size table tr:first-child th, .popup .size_info .check_size .data_size table tr:first-child td {color:var(--gray600); background:#f7f7f7;} .popup .size_info .check_size .data_sheet {display:table; margin-top:30px; height:310px;} .popup .size_info .check_size .data_sheet .list_wrap {display:table-cell; vertical-align:middle; color:var(--gray600); font-size:var(--F14);} .popup .size_info .check_size .data_sheet + h4 {margin-top:40px;} .popup .size_info .guide_size {margin-top:40px; text-align:left;} .popup .size_info .guide_size h3 {margin-bottom:35px; line-height:30px; font-size:25px;} .popup .size_info .guide_size .data_size_guide .sizeguideArea {margin-top:40px;} .popup .size_info .guide_size .data_size_guide .sizeguideArea .area-tit {font-size:var(--F14); font-weight:bold;} .popup .size_info .guide_size .data_size_guide .sizeguideArea table {margin-top:10px; width:100%; font-size:var(--F14);} .popup .size_info .guide_size .data_size_guide .sizeguideArea table tr th {padding:10px 0; line-height:20px; text-align:center; color:var(--gray600); font-weight:normal; background:#f7f7f7; font-weight:normal;} .popup .size_info .guide_size .data_size_guide .sizeguideArea table tr td {padding:10px 0; line-height:20px; text-align:center; color:var(--gray800); font-weight:normal;} .popup .size_info .guide_size .data_size_guide .lst-default {margin-top:40px;} .popup .size_info .guide_size .data_size_guide .lst-default li {padding:0 0 0 7px; line-height:var(--F14L); text-indent:-7px; color:var(--gray600); font-size:var(--F14);} .popup .size_info .guide_size .data_size_guide .lst-default li:before {content:' · ';} /* 사이즈 가이드 ASIS html reset */ .popup .size_info .guide_size .data_size_guide .popClose, .popup .size_info .guide_size .data_size_guide .popTlt {display:none;} .popup .size_info .review_size {margin-top:40px; text-align:left;} .popup .size_info .review_size h3 {margin-bottom:35px; line-height:30px; font-size:25px;} .popup .size_info .review_size .select {margin-left:15px;} .popup .size_info .review_size table {margin-top:30px; width:100%;} .popup .size_info .review_size table tr th, .popup .size_info .review_size table tr td {line-height:40px; font-size:var(--F14); font-weight:normal;} .popup .size_info .review_size table tr th {color:var(--gray600); background:#f7f7f7;} .popup .size_info .review_size table tr td {text-align:center; border-bottom:1px solid var(--gray250);} .popup .size_info .review_size table tr td .null {line-height:204px;} /*#167658: [개선개발/상품] 상품상세 About 영역 개선*/ /* 모델사이즈 */ .popup .size_model {width: 400px;} .popup .size_model > strong {display: block; font-weight: bold; font-size:var(--F21); line-height: 38px; color: var(--gray900);} .popup .size_model img {display: inline-block; width: 228px;} .popup .size_model p {display: inline-block; width:calc(100% - 245px - 25px); margin-left:25px;} .popup .size_model p span {display: block; font-size:var(--F14); line-height: 22px; word-break:keep-all;} .popup .size_model p span ~ span {margin-top: 10px;} .popup .size_model p span em {display: block; font-weight: 700; font-size:var(--F15); color: var(--gray900);} /* 소재/추가정보 */ .popup .wear {width: 370px;} .popup .wear > strong {display: block; font-weight: bold; font-size:var(--F21); line-height: 38px; color: var(--gray900);} .popup .wear span {display: block; font-size:var(--F14); line-height: 19px;} .popup .wear span ~ span {margin-top: 17px !important;} .popup .wear span em {display: block; margin-bottom: 8px; font-weight: 700; color: var(--gray900);} .popup .wear > div > em {display: block; margin-bottom: 8px; font-weight: 700; color: var(--gray900); font-size:var(--F14); line-height: 19px;} .popup .wear dl {margin-top:5px !important; line-height:36px; font-size:var(--F14); border-top:1px solid var(--gray250);} .popup .wear dl + em {margin-top: 13px;} .popup .wear dl dt {float:left; width:70px; color:var(--gray800); border-bottom:1px solid var(--gray250);} .popup .wear dl dd {display:flex; color:var(--gray600); border-bottom:1px solid var(--gray250);} .popup .wear dl dd em {display:inline-block; width:25%; color:#a4a4a4; letter-spacing:-0.3px; text-align:center; white-space:nowrap;} .popup .wear dl dd em.on {color:var(--purple400); font-weight:bold;} /*//#167658: [개선개발/상품] 상품상세 About 영역 개선*/ /* 할인혜택 */ .popup .sale_box {margin-top:20px; padding:39px; border:1px solid var(--gray250);} .popup .sale_box h3 {font-size:19px; color:var(--gray900); text-align:center;} .popup .sale_box p {margin-toP:15px; font-size:var(--F14); color:var(--gray800); line-height:22px; text-align:center;} .popup .sale_box > div {margin-top:45px;} .popup .sale_box > div:after {display:block; clear:both; content:'';} .popup .sale_box > div .sel {float:left; width:100px;} .popup .sale_box > div .list {float:left; width:320px; margin-left:40px;} .popup .sale_box > div em {display:block; margin-bottom:10px; font-size:var(--F14); line-height:12px;} .popup .sale_box > div .sel em {color:var(--purple400);} .popup .sale_box > div .list em {color:var(--gray600);} .popup .sale_box > div .list .slider li {float:left; width:100px;} .popup .sale_box > div .list .none {display:block; padding-top:67px; font-size:var(--F14); color:var(--gray800); text-align:center;} .popup .sale_box > div .list .lSAction a {margin-top:-70px;} .popup .sale_box > div .list .lSAction .lSPrev {left:0; width:35px; height:92px; margin-left:-35px; background:url(../images/ui/btn_prev.svg) var(--white) no-repeat center center /10px auto; z-index:8; cursor:pointer;} .popup .sale_box > div .list .lSAction .lSNext {right:0; width:35px; height:92px; margin-right:-35px; background:url(../images/ui/btn_next.svg) var(--white) no-repeat center center /10px auto; z-index:8; cursor:pointer;} .popup .sale_box > div a span {display:block; overflow:hidden; font-weight:bold; font-size:var(--F13); color:var(--gray900); white-space:nowrap; text-overflow:ellipsis; line-height:18px;} .popup .sale_box > div .brand {margin-top:10px;} .popup .sale_box .submit .btn { background-color:var(--gray900); color:var(--white); } /*#142595*/ .popup .sale_box + .list_wrap {padding:35px 0 0 20px} .popup .sale_box + .list_wrap li {color:var(--gray600); letter-spacing:-1px;} /* 일모 잔액 안내 */ .popup .item_wrap {margin-top:35px;} .popup .item_wrap li {padding:25px 0; border-bottom:1px solid var(--gray250); line-height:20px;} .popup .item_wrap li:after {display:block; clear:both; content:'';} .popup .item_wrap li:first-child {border-top:1px solid var(--gray250);} .popup .item_wrap li .item {float:left; color:var(--gray600);} .popup .item_wrap li .item + span {float:right; color:var(--gray800);} /* 옵션 변경 */ .popup .option_wrap > ul {margin-top:14px;} .popup .option_wrap > ul > li {padding:12px 0; border-bottom:1px solid var(--gray250);} .popup .option_wrap > ul > li .color-select {padding-bottom:14px; vertical-align:top;} .popup .option_wrap > ul > li .color-select > label {width:24px !important;} .popup .option_wrap > ul > li .color-select > label:nth-child(2n) {margin:2px 4px 2px 0;} .popup .option_wrap > ul > li .select {width:100%;} .popup .option_wrap > ul > li .select label {/*padding-right:0;*/ height:34px; box-sizing:border-box; border:0 none; color:var(--gray600);} .popup .option_wrap:not(.new) > ul > li .quantity {display:block;} .popup .option_wrap:not(.new) > ul > li .quantity input {color:var(--gray600); text-align:left; border:0 none;} .popup .option_wrap:not(.new) > ul > li .quantity a {overflow:hidden; width:23px; height:23px; top:5px; background:url("../images/ui/bg_quantity.png") no-repeat 0 0; white-space:nowrap; text-overflow:ellipsis; text-indent:100%;} .popup .option_wrap:not(.new) > ul > li .quantity .minus {background-position:-42px -7px; left:auto; right:-5px;} .popup .option_wrap:not(.new) > ul > li .quantity .plus {background-position:-6px -6px; right:28px;} /* 퀵배송 서비스 이용불가 안내 팝업 */ .popup .line_box {margin-top:30px; padding:28px 0; border:1px solid var(--gray250); color:var(--gray900); line-height:24px; text-align:center;} .popup .line_box li {color:var(--purple400);} .popup .line_box li.c444 {color:var(--gray800);} .popup .line_box em {display:block; font-weight:bold;} .popup .line_box span {display:block;} .popup .line_box + .txt {display:block; margin-top:35px; color:var(--gray600); text-align:center;} .popup .line_box + .txt + .submit {margin-top:35px;} /* 수선 */ .popup .repair_info {margin-top:15px; border-top:1px solid var(--gray900);} .popup .repair_info h3 {margin-top:35px; font-size:19px; color:var(--gray800); line-height:28px;} .popup .repair_info .num {display:block; margin-top:30px; font-weight:bold; font-size:19px; color:var(--gray800);} .popup .repair_info .list_wrap {margin-top:30px;} .popup .repair_info .list_wrap {margin-top:30px;} .popup .repair_info .list_wrap p {margin:15px 0;} .popup .repair_info .list_wrap p span {display:inline-block; width:50px; margin-right:60px; font-size:var(--F13); color:var(--gray600); text-align:center; vertical-align:top;} .popup .repair_info .list_wrap p span i {display:block; width:50px; height:50px; margin-bottom:5px; background:url("../images/ui/bg_repair_popup.png") no-repeat 0 0;} .popup .repair_info .list_wrap p span:first-child i {background-position:0 -50px;} /* #222001 */ .popup .repair_info .list_wrap p span:last-child i {background-position:0 -100px;} /* 품절 및 수량 부족 안내 */ .popup .form_popup .tbl_goods.type_1 {border:0 none;} .popup .form_popup .tbl_goods.type_1 th {padding:20px 0; font-weight:bold; font-size:var(--F13); font-weight:normal; color:var(--gray600); text-align:center;} .popup .form_popup .tbl_goods.type_1 td .info .brand, .popup .form_popup .tbl_goods.type_1 td .info .name {font-size:var(--F14);} .popup .form_popup .tbl_goods.type_1 td .info .option {font-size:var(--F13);} .popup .form_popup .tbl_goods.type_1 td:last-child {color:var(--gray600); text-align:center;} /* 수선 신청하기 */ .popup .box_wrap {display:flex; margin-top:15px; padding-top:60px; border-top:1px solid var(--gray900);} .popup .box_wrap:after {display:block; clear:both; content:'';} .popup .box_wrap a {display:table; float:left; width:calc(49% - 2px); height:180px; border:1px solid var(--gray250); text-align:center;} .popup .box_wrap a:last-child {margin-left:2%;} .popup .box_wrap a span {display:table-cell; font-weight:bold; font-size:19px; color:var(--gray800); line-height:28px; vertical-align:middle;} .popup .box_wrap + .list_wrap {margin-top:35px;} /* 상품선택 */ .popup .repair_goods {margin-top:15px; border-top:1px solid var(--gray250);} .popup .repair_goods .search-date {margin:35px 0;} .popup .repair_goods .none {padding:20px 40px; color:var(--gray600); line-height:22px;} .popup .repair_goods ul:after {display:block; clear:both; content:'';} .popup .repair_goods ul li {float:left; width:33.33%; margin-top:35px;} .popup .repair_goods ul li:first-child, .popup .repair_goods ul li:first-child + li, .popup .repair_goods ul li:first-child + li + li {margin-top:0;} .popup .repair_goods ul li:nth-child(3n+1) {clear:both;} .popup .repair_goods ul li .radio label {position:relative; padding-left:40px; width:100%; /*width:100px;*/} .popup .repair_goods ul li .radio label i {position:absolute; top:58px; left:0;} .popup .repair_goods ul li .radio label img {height:132px;} .popup .repair_goods ul li .radio label .info {padding-top:15px;} .popup .repair_goods ul li .radio label .info .brand, .popup .repair_goods ul li .radio label .info .name, .popup .repair_goods ul li .radio label .info .option {display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:var(--gray600);} .popup .repair_goods ul li .radio label .info .brand {font-weight:bold;} .popup .repair_goods ul li .radio label .info .brand, .popup .repair_goods ul li .radio label .info .name {line-height:22px; color:var(--gray900); font-size:var(--F14);} .popup .repair_goods ul li .radio label .info .name {margin-bottom:10px;} .popup .repair_goods ul li .radio label .info .option {line-height:var(--F14L); font-size:var(--F14);} .popup .repair_goods .date_wrap {text-align:right;} .popup .repair_goods .date_wrap .search-date, .popup .repair_goods .date_wrap .btn {vertical-align:middle;} .popup .repair_goods .date_wrap .search-date input {margin-top:0;} .popup .repair_goods .date_wrap .btn {height:36px; line-height:34px;} .popup .repair_goods .date_wrap + p {letter-spacing:-0.5px;} /*#148417*/ .popup .repair_goods .divide {padding:30px 0; border-top:1px solid var(--gray250);} .popup .repair_goods p + .divide {border:0 none;} .popup .repair_goods .divide ul li {width:50%; margin-top:15px !important;} .popup .repair_goods .divide ul li .radio label {width:auto; min-height:20px; line-height:20px;} .popup .repair_goods .divide ul li .radio label i {top:50%; margin-top:-10px;} .popup .repair_goods .divide ul li .radio label img {width:100px;} .popup .repair_goods .divide .num {display:block; padding-bottom:15px; font-weight:bold; font-size:var(--F14); color:var(--gray900);} .popup .repair_goods .divide .num em {font-weight:normal;} .popup .repair_goods .btn_more {displaY:block; border:1px solid var(--gray250); text-align:center; line-height:38px;} .popup .repair_goods .btn_more span {display:inline-block; padding-right:20px; background:url(../images/ui/btn_down_gray.svg) no-repeat right center/14px auto; font-weight:bold; font-size:var(--F14); color:var(--gray800);} /* 사진등록 */ .popup .file_wrap {display:table; width:100%; margin-top:15px; padding-top:35px; border-top:1px solid var(--gray900); vertical-align:top;} .popup .file_wrap em {display:block; margin-bottom:20px; font-size:var(--F14); line-height:12px;} .popup .file_wrap .file_img {width:108px; height:140px;} .popup .file_wrap .sel {display:table-cell; width:110px; vertical-align:top;} .popup .file_wrap .file_box {display:table-cell; padding-left:30px; vertical-align:top;} .popup .file_wrap .file_box:after {display:block; clear:both; content:'';} .popup .file_wrap .file_box li {float:left; margin:0 10px 0 0; width:108px; height:140px;} .popup .file_wrap .file_box li:last-child {margin-right:0;} .popup .file_wrap .file_box li:nth-child(1), .popup .file_wrap .file_box li:nth-child(2), .popup .file_wrap .file_box li:nth-child(3) {margin-bottom:10px;} .popup .file_wrap + .desc {display:block; margin-top:25px; line-height:20px; color:var(--gray600); font-size:var(--F15);} .popup .desc + .submit {margin-top:15px;} /* 상품선택 2단계 */ .popup .form_popup ul > li.v_top .item {vertical-align:top;} .popup .form_popup ul > li .input_box {vertical-align:middle;} .popup .form_popup ul > li .input_box.type_1 {padding-bottom:30px;} .popup .form_popup ul > li .input_box.type_1 .desc {position:absolute; top:32px; left:0; white-space:nowrap;} .popup .form_popup ul > li .btn {width:110px; margin-left:10px; padding:0; vertical-align:middle;} .popup .form_popup ul > li .img {display:table-cell; width:auto; vertical-align:middle;} .popup .form_popup ul > li .img img {width:100px;} .popup .form_popup ul > li .info {display:table-cell; width:305px; padding-left:25px; vertical-align:middle;} .popup .form_popup ul > li .info .brand, .popup .form_popup ul > li .info .name, .popup .form_popup ul > li .info .option {display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;} .popup .form_popup ul > li .info .brand, .popup .form_popup ul > li .info .name {line-height:20px; color:var(--gray900); font-size:var(--F15);} .popup .form_popup ul > li .info .name {margin-bottom:10px;} .popup .form_popup ul > li .info .option {font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} /* 수선사항 선택 및 기재 */ .popup .repair_wrap {margin-top:15px; padding-top:40px; border-top:1px solid var(--gray900);} .popup .repair_wrap p {font-size:var(--F15); color:var(--gray800); line-height:12px;} .popup .repair_wrap table {width:100%;} .popup .repair_wrap table th {border-bottom:1px solid var(--gray250); color:var(--gray600); vertical-align:middle;} .popup .repair_wrap table td {padding:34px 0; border-bottom:1px solid var(--gray250);} .popup .repair_wrap table td .item {padding:7px 0; text-align:left; display:flex;} .popup .repair_wrap table td .item .name {display:inline-block; width:80px; color:var(--gray600);} .popup .repair_wrap table td .item .input_box {display:inline-block; width:160px;} .popup .repair_wrap table td .item .radio > label {margin-right:25px;} .popup .repair_wrap table td .item .unit {display:inline-block; width:50px; color:var(--gray800); text-align:right;} .popup .repair_wrap textarea {width:calc(100% - 62px); margin-top:40px; padding:35px 30px; line-height:20px;} .popup .repair_wrap .radio_list {margin-top:12px;} .popup .repair_wrap .radio_list:after {display:block; clear:both; content:'';} .popup .repair_wrap .radio_list label {float:left; width:25%; margin:0; padding:5px 0;} .popup .repair_wrap .part .sel_body {position:relative; margin-top:30px; width:543px; height:295px; background:url("../images/ui/bg_body.png") no-repeat center center;} .popup .repair_wrap .part .sel_body .check_as label {display:block; font-weight:bold; text-align:center; color:var(--gray800); font-size:var(--F15); font-weight:bold; border:1px dashed #959595;} .popup .repair_wrap .part .sel_body .check_as input:checked + label {color:var(--purple400); border-color:var(--purple400); background:url(../images/common/bg_check_as.png);} .popup .repair_wrap .part .sel_body .check_as input {width:0; height:0;} .popup .repair_wrap .part .sel_body .check_as.type01 label {width:40px; height:40px; line-height:40px; border-radius:20px;} .popup .repair_wrap .part .sel_body .check_as.type02 label {width:34px; height:34px; line-height:34px; border-radius:17px;} .popup .repair_wrap .part .sel_body .check_as.type03 label {width:28px; height:28px; line-height:28px; border-radius:14px;} .popup .repair_wrap .part .sel_body .check_as.type04 label {width:33px; height:15px; line-height:15px;} .popup .repair_wrap .part .sel_body .check_as.type05 label {width:100px; height:20px; line-height:20px;} .popup .repair_wrap .part .sel_body .check_as.type06 label {width:33px; height:28px; line-height:28px;} .popup .repair_wrap .part .sel_body .check_as.type07 label {width:32px; height:60px; line-height:52px;} .popup .repair_wrap .part .sel_body .check_as {position:absolute;} .popup .repair_wrap .part .site {margin-top:30px;} .popup .repair_wrap .part .site:after {display:block; clear:both; content:'';} .popup .repair_wrap .part .site .radio {display:flex} /*.popup .repair_wrap .part .site label {float:left; width:50%; margin-right:0;}*/ .popup .repair_wrap .desc {margin-top:5px; line-height:20px; color:var(--gray600); font-size:var(--F13);} /* 수선 상세정보 */ .popup .repair_detail {margin-top:10px;} .popup .repair_detail dl:after {display:block; clear:both; content:'';} .popup .repair_detail dd {float:left; width:205px; font-size:var(--F13); color:var(--gray600); line-height:30px;} .popup .repair_detail dd:nth-child(2n) {margin-left:5px;} .popup .repair_detail dd span {float:right; width:120px; margin-left:5px;font-size:var(--F15); color:var(--gray900); text-align:left;} /* 수선 신청 취소 */ .popup .form_popup.type_1 {margin-top:25px;} .popup .form_popup.type_1 table {margin-top:0; border:0 none;} .popup .form_popup.type_1 th, .popup .form_popup.type_1 td {padding:20px 0;} .popup .form_popup.type_1 + .submit .btn {display:inline-block; float:none;} /* 쿠폰선택 팝업 */ .popup .select_coupon {width:555px;} .popup .select_coupon > div:not(.submit) {margin-bottom:25px} .popup .select_coupon > div > strong {display:inline-block; width:121px; line-height:29px; color:var(--gray800); vertical-align:top; font-size:var(--F15); font-weight:bold;} .popup .select_coupon .detail {display:inline-block; width:430px;} .popup .select_coupon .detail .input_box {display:inline-block;} .popup .select_coupon .detail > .btn {float:right;} .popup .select_coupon .price {display:inline-block; width:148px; text-align:right; color:var(--gray900); font-size:15px !important;} .popup .select_coupon .grid_wrap.goods th, .popup .select_coupon .grid_wrap.goods td {vertical-align:top; border-top-color:var(--gray800); vertical-align: top;} .popup .select_coupon .grid_wrap.goods .info .brand, .popup .select_coupon .grid_wrap.goods .info .name {line-height:20px; color:var(--gray900); font-size:14px !important; font-weight:bold; margin-bottom:1px;} .popup .select_coupon .grid_wrap.goods .info .name {width:294px; font-weight:normal; margin-bottom:0;} .popup .select_coupon .grid_wrap.goods .info .checked {display:block; padding:0 0 12px 0; height:40px; line-height:40px; font-size:var(--F14); color:var(--purple400); /*background:url(../images/ui/bg_fin_check_em.svg) no-repeat 0 17px/12px auto;*/} .popup .select_coupon .select {width:100%;} .popup .select_coupon .select a {font-size:14px !important;} .popup .select_coupon .select + .txt, .popup .select_coupon .select + .price + .txt {margin:7px 0 0 0; line-height:var(--F14L); text-align:left; color:var(--gray600); font-size:var(--F14);} .popup .select_coupon.resets .select {flex:none; width:430px; height:40px; padding:0 0 0 20px; border:1px solid var(--gray250); box-sizing:border-box;} .popup .select_coupon.resets .select .option {margin-top:-35px;} .popup .select_coupon.resets .select a label, .popup .select_coupon.resets .select .option a {overflow:hidden; display:block;} .popup .select_coupon.resets .select label {display:flex; justify-content:flex-start; align-items:center; border:none; padding: 7px 20px 7px 0;} .popup .select_coupon.resets .select a label em, .popup .select_coupon.resets .select .option a em {float:left; width:80px; line-height:20px; color:var(--gray900); } .popup .select_coupon.resets .select .option a span {float:left; width:calc(100% - 70px); line-height:20px; display:inline-block; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;} .popup .select_coupon.resets .select a label span {float:left; width:calc(100% - 70px); line-height:20px; display:inline-block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; height:20px;} .popup .select_coupon.resets .select .option .special * {font-weight:bold} .popup .select_coupon.resets .select .option > ul {overflow-x:hidden;} .popup .select_coupon.resets .submit .btn {width:290px; flex:none; margin-right:0;} /* 매장찾기 팝업 */ .popup .shop > h3 {font-size:25px; color:var(--gray800); line-height:40px;} .popup .shop .brand_sel {position:relative; z-index:20; margin-top:30px;} .popup .shop .brand_sel .select {margin-top:0; width:500px;} .popup .shop .brand_sel .select h3 {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .popup .shop .brand_sel .select h3 a {display:inline-block; position:relative; padding-right:42px; font-size:25px; color:var(--gray800); line-height:40px;} .popup .shop .brand_sel .select h3 a:after {position:absolute; top:50%; right:0; margin-top:-6px; width:23px; height:13px; background:url(../images/ui/btn_down.svg) no-repeat left top/23px auto; content:'';} .popup .shop .brand_sel .select.over h3 a:after {background-position:0 0;} .popup .shop .search_wrap {margin-top:25px; padding-top:40px; border-top:1px solid var(--gray250);} .popup .shop .size_wrap {position:relative; z-index:12; margin-top:15px; line-height:30px;} .popup .shop .size_wrap h4 {padding-right:350px; font-size:var(--F17); color:var(--gray800); line-height:30px;} .popup .shop .size_wrap .size_sel {position:absolute; top:0; right:0;} .popup .shop .size_wrap .size_sel .select {height:30px;} .popup .shop .size_wrap .size_sel .select > a label {height:18px; line-height:18px; background-position:100% -296px;} .popup .shop .size_wrap .size_sel .select.over > a label {background-position:100% -346px;} .popup .shop .size_wrap .size_sel .select.over .option > ul {margin-top:29px;} .popup .shop .size_wrap ul {margin-top:10px;} .popup .shop .size_wrap ul li {display:block; margin:2px 0; height:36px; line-height:36px; color:var(--gray600); font-size:var(--F14);} .popup .shop .size_wrap ul li .name:before {content:'· ';} .popup .shop .size_wrap ul li .size_sel {position:relative; float:right;} .popup .shop .size_wrap ul li .btn {margin-top:-2px; margin-left:7px; padding:2px 15px; vertical-align:middle; line-height:24px; font-size:var(--F14);} .popup .shop .list_wrap {min-height:30px; margin-top:0; padding:28px 0 10px 0;} .popup .shop .result_wrap .tabs .tab li {width:15%;} .popup .shop .result_wrap .option_area {position:absolute; top:0; right:0; left:auto;} .popup .shop .result_wrap .result_list li .service em {display:block; padding:0 3px; font-weight:bold; font-size:var(--F13); color:var(--purple400);} .popup .shop .result_wrap .list_check .checkbox:last-child label {margin-right:0;} .popup .shop .result_wrap .list_type {position:relative; padding-top:0;} .popup .shop .result_wrap .list_type .tab {position:absolute; top:-44px; right:0; height:34px; border:0 none; line-height:34px;} .popup .shop .tip_content {top:460px !important;} /* 태그 상품 슬라이드 */ .popup .tag_goods .list_goods {position:relative;} .popup .tag_goods .list_goods ul:after {display:block; content:""; clear:both;} .popup .tag_goods .list_goods li {position:relative; float:left; width:150px;} .popup .tag_goods .list_goods li a {display:block; position:relative;} .popup .tag_goods .list_goods li a .hover {display:block; position:absolute; top:0; width:100%; opacity:0;} /* 팝업 슬라이더 */ .popup .pop_slider {padding:40px; width:490px; height:490px;} .popup .pop_slider .slider li {max-width:490px; text-align:center;} .popup .pop_slider .slider li img {width:auto; max-width:490px; height:auto; max-height:490px;} .popup .pop_slider .slider_pager .lSSlideWrapper .no-trans {transition:none;} /*#188634*/ .popup .pop_slider .slider_pager .lSSlideWrapper .trans {transition:all .2s;} /*#188634*/ .popup .pop_slider .slider_pager .lSSlideWrapper ul.lightSlider {height:490px !important;} .popup .pop_slider .slider_pager .lSSlideWrapper ul {display:flex; justify-content:center; align-items:center;} .popup .pop_slider .slider_pager .lSSlideWrapper ul li {display:table; text-align:center;} .popup .pop_slider .slider_pager img {width:auto; max-width:490px; max-height:490px;} .popup .pop_slider .slider_pager .lSPager {display:inline-block; top:0; margin-top:-36px; max-width:100px; text-align:left;} .popup .pop_slider .slider_pager .lSPager li.active a {display:inline-block !important; width:100px; color:var(--white); font-size:var(--F21); text-indent:0 !important; font-weight:bold; cursor:default;} .popup .pop_slider .slider_pager .lSPager li a {display:none !important; background:none !important;} .popup .pop_slider .slider_pager .lSAction a {margin-top:-20px; width:22px; height:40px; } .popup .pop_slider .slider_pager .lSAction a.lSPrev {left:-30px; background:url(../images/ui/btn_prev_disabled.svg) no-repeat left center / 22px auto; } .popup .pop_slider .slider_pager .lSAction a.lSNext {right:-30px; background:url(../images/ui/btn_next_disabled.svg) no-repeat left center / 22px auto;} /* 카카오톡 알림 톡 설정확인방법 */ .popup .img_list {margin-top:15px;} .popup .img_list li {margin-top:35px;} .popup .img_list li:first-child {margin-top:0;} .popup .img_list li span {display:block; margin-top:25px; font-size:var(--F14); color:var(--gray600);} /* VIP 등급 혜택 */ .popup .grade_list > ul > li {display:table; width:100%; margin-top:60px;} .popup .grade_list > ul > li:first-child {margin-top:40px;} .popup .grade_list > ul > li .tit {display:table-cell; width:164px; text-align:center; vertical-align:middle;} .popup .grade_list > ul > li .tit span {display:inline-block; position:relative; padding-left:54px; font-weight:bold; font-size:27px; color:var(--purple400); line-height:32px; text-align:left;} .popup .grade_list > ul > li .tit span:after {position:absolute; top:50%; left:0; height:40px; margin-top:-20px; background:url("../images/ui/bg_grade_benefit.png") no-repeat 0 0; content:'';} .popup .grade_list > ul > li .tit .gift:after {width:41px; background-position:0 0;} .popup .grade_list > ul > li .tit .as:after {width:41px; background-position:0 -40px;} .popup .grade_list > ul > li .tit .vip:after {width:41px; background-position:0 -80px;} .popup .grade_list > ul > li .tit .point:after {width:41px; background-position:0 -120px;} .popup .grade_list > ul > li .tit .percent:after {width:41px; background-position:0 -160px;} .popup .grade_list > ul > li .tit .coin:after {width:41px; background-position:0 -200px;} .popup .grade_list > ul > li .tit .feeting:after {width:41px; background-position:0 -240px;} .popup .grade_list > ul > li.coupon {padding-bottom:50px; border-bottom:1px solid var(--gray250);} .popup .grade_list > ul > li.coupon .tit {vertical-align:top;} .popup .grade_list > ul > li.coupon dl {vertical-align:top;} .popup .grade_list > ul > li dl {display:table-cell; padding-left:40px; vertical-align:middle;} .popup .grade_list > ul > li dl dt {position:relative; font-size:19px; color:var(--gray800); line-height:24px; font-weight:bold;} .popup .grade_list > ul > li dl dt + dt {margin-top:10px; font-weight:normal;} .popup .grade_list > ul > li dl dt .btn {position:absolute; top:-7px; right:0; height:18px; font-size:var(--F13); color:var(--gray800); line-height:18px;} .popup .grade_list > ul > li dl dd {position:relative; padding-left:10px; font-size:var(--F14); color:var(--gray600); line-height:22px;} .popup .grade_list > ul > li dl dd:before {position:absolute; top:9px; left:0; width:3px; height:3px; background-color:var(--gray600); content:'';} .popup .grade_list > ul > li dl dd.none {padding-left:0;} .popup .grade_list > ul > li dl dd.none:before {display:none;} .popup .grade_list > ul > li dl dd span {display:block; color:var(--gray600);} .popup .grade_list > ul > li dl dt + dd {margin-top:15px;} .popup .grade_list > ul > li dl dd ol li {font-size:var(--F14); color:var(--gray600); line-height:22px;} .popup .grade_list > ul > li dl dd ul li {position:relative; padding-left:10px; font-size:var(--F14); color:var(--gray600); line-height:22px;} .popup .grade_list > ul > li dl dd ul li:before {position:absolute; top:0; left:0; content:'-';} .popup .grade_list > ul > li dl dd table {width:100%; margin-top:15px;} .popup .grade_list > ul > li dl dd table th {padding:13px 20px; border-top:1px solid var(--gray250); border-bottom:1px solid var(--gray250); font-size:var(--F13); color:var(--gray600); text-align:center;} .popup .grade_list > ul > li dl dd table td {padding:15px 20px; border-bottom:1px solid var(--gray250); font-size:var(--F14); color:var(--gray600); text-align:center;} .popup .grade_list > ul > li dl dd table th:first-child, .popup .grade_list > ul > li dl dd table td:first-child {padding:15px 0;} .popup .grade_list > ul > li dl dd table + span {margin-top:17px;} /* 오늘 하루 보지 않기 */ .popup .popBtm {position:absolute; bottom:0; left:0; width:100%; background-color:#f7f7f7;} .popup .popBtm .btmCheck {padding-left:15px;} .popup .popBtm .checkWrap .lb_cb { font-size:var(--F14); } .popup .popBtm .bt-close { position: absolute; right: 15px; top:50%; margin-top:-6px; display: block; width: 12px; height: 12px; text-indent: -999em; text-align: left; background: url("../images/ui/bg_pop_close.png") no-repeat 0 0; background-size:100% auto;} /* 글로벌 유저 가이드 */ .popup.gb_guide {padding:0 38px; height:100%; overflow-y:scroll;} .popup.gb_guide h1 {margin:30px auto 0; width:860px; color:var(--gray900); font-size:31px; border-bottom:0;} .popup.gb_guide .tabs {margin:24px auto 50px; width:860px;} .popup.gb_guide .tabs .tab li {width:25%;} .popup.gb_guide .tabs > div > h3 {margin-top:60px; line-height:50px; color:var(--gray800); font-size:25px;} .popup.gb_guide .tabs > div > p {line-height:var(--F15LL); color:var(--gray900); font-size:var(--F15);} .popup.gb_guide .tabs > div > img {display:block; margin-top:30px; margin-bottom:24px; width:auto;} .popup.gb_guide .tabs > div > a {display:inline-block; padding-right:12px; line-height:22px; color:var(--gray800); font-size:var(--F15); background:url(../images/ui/btn_next.svg) no-repeat right center/auto 12px;} .popup.gb_guide .tabs > div > .list_wrap + span {display:block; margin-top:20px; text-indent:7px;} .popup.gb_guide .tabs > div .info {margin-top:40px;} .popup.gb_guide .tabs > div .info > div {display:inline-block; width:400px; height:100px;} .popup.gb_guide .tabs > div .info .mail {padding-left:85px; width:315px; background:url("../images/ui/bg_mail.jpg") no-repeat left center;} .popup.gb_guide .tabs > div .info .talk {padding-left:85px; width:315px; background:url("../images/ui/bg_talk.jpg") no-repeat left center;} .popup.gb_guide .tabs > div .info span {display:block; width:260px; line-height:49px; color:var(--gray600); border-bottom:1px solid var(--gray250);} .popup.gb_guide .tabs > div .info em, .popup.gb_guide .tabs > div .info a {line-height:50px; color:var(--gray800); font-size:var(--F17);} /*비밀번호 변경*/ .popup.changePW {width:400px;} .popup.changePW h3 + .form_wrap {padding:0; border:none;} /* popup (e) **********************************************************/ @media only all and (max-width:1680px) { .wrap .contents section.click_ranking > .list_goods > ul > li:nth-child(1n+9), /*#145480*/ .wrap .contents section.top_sellers > .list_goods > ul > li:nth-child(1n+9), .wrap .contents section.click_now > .list_goods > ul > li:nth-child(1n+9), .wrap .contents section.new_in > .list_goods > ul > li:nth-child(1n+9), .wrap .contents section.last_piece > .list_goods > ul > li:nth-child(1n+9), .wrap .contents:not(.search) section.recommend > .list_goods > ul > li:nth-child(1n+5), .wrap .contents section.item_typeA > .list_goods > ul > li:nth-child(1n+5), .wrap .contents section.item_typeB > .list_goods > ul > li:nth-child(1n+5), .wrap .contents section.on_sale > .list_goods > ul > li:nth-child(1n+5), .wrap .contents section.instagram > .list_goods > ul > li:nth-child(1n+5), .wrap .contents section.prdSlider .list_goods > ul > li:nth-child(1n+9) {display:none;} /*//20210315 : 신규 코너 생성*/ .wrap .contents section.recommend.rank > .list_goods > ul > li:nth-child(1n+5) {display:inherit;} /*#145480*/ } @media only all and (max-width:1280px) { .wrap .contents section.click_ranking > .list_goods > ul > li:nth-child(1n+7), .wrap .contents section.top_sellers > .list_goods > ul > li:nth-child(1n+7), .wrap .contents section.click_now > .list_goods > ul > li:nth-child(1n+7), .wrap .contents section.new_in > .list_goods > ul > li:nth-child(1n+7), .wrap .contents section.last_piece > .list_goods > ul > li:nth-child(1n+7), .wrap .contents:not(.search) section.recommend > .list_goods > ul > li:nth-child(1n+4), .wrap .contents section.item_typeA > .list_goods > ul > li:nth-child(1n+4), .wrap .contents section.item_typeB > .list_goods > ul > li:nth-child(1n+4), .wrap .contents section.on_sale > .list_goods > ul > li:nth-child(1n+4), .wrap .contents section.instagram > .list_goods > ul > li:nth-child(1n+4), .wrap .contents section.prdSlider .list_goods > ul > li:nth-child(1n+7) {display:none;} } /* #180226 [퍼블/PC][운영/상품] 상품 리뷰 작성자 신고 및 차단 기능 */ .popup .protest p {font-size:var(--F12);} .popup .protest p:nth-of-type(2) {margin-top:30px;} .popup .protest ul {margin-top:10px;} .popup .protest ul li {margin-top:5px; font-size:var(--F12);} .popup .protest ul li textarea {background:#fafafa; margin-top:15px; height:70px;} .popup .protest ul:nth-of-type(1) {display:flex; justify-content:flex-start; flex-wrap:wrap;} .popup .protest ul:nth-of-type(1) li {margin-right:20px;} .popup .protest ul:nth-of-type(1) li:last-child {margin-right:0px;} .popup .protest ~ .submit {margin-top:8px; margin-bottom:20px;} .popup .protest ~ .submit .btn:first-child {margin-right:0px;} .popup .protest ~ .submit ~ a {font-size:var(--F12); color:var(--gray600); text-decoration:underline;} /* //#180226 [퍼블/PC][운영/상품] 상품 리뷰 작성자 신고 및 차단 기능 */ /* #187118 [퍼블/PC][상품 상세] 상품 리뷰 작성자 신고 및 차단 기능 (s) */ .ui-dialog.layer .layer-report {display:flex; flex-direction:column; gap:32px 0;} .ui-dialog.layer .layer-report .report-group {display:flex; flex-direction:column; gap:13px 0;} .ui-dialog.layer .layer-report .report-group .report-title {line-height:var(--F15L); font-size:var(--F15); font-weight:700; color:var(--gray900);} .ui-dialog.layer .layer-report .report-group .report-list {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.layer .layer-report .report-group .report-list.row {flex-direction:row; gap:0 26px;} .ui-dialog.layer .layer-report .report-group .report-list .count-textbox {overflow:hidden; position:relative; display:flex; flex-direction:column; align-items:flex-end; gap:4px 0; margin-bottom:23px; height:120px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.layer .layer-report .report-group .report-list .count-textbox.focused {border-color:var(--gray900);} .ui-dialog.layer .layer-report .report-group .report-list .count-textbox textarea {padding:15px; width:100%; height:100%; border:0; line-height:var(--F15L); font-size:var(--F15); resize:none; box-sizing:border-box;} .ui-dialog.layer .layer-report .report-group .report-list .count-textbox textarea::placeholder {color:var(--gray500);} .ui-dialog.layer .layer-report .report-group .report-list .count-textbox .count {position:absolute; right:0; bottom:-23px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray400);} .ui-dialog.layer .layer-report .report-group .report-block {margin-top:7px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900); text-decoration: underline;} /* #187118 [퍼블/PC][상품 상세] 상품 리뷰 작성자 신고 및 차단 기능 (e) */ /* #187118 [퍼블/PC][상품 상세] 기프트포인트 (s) */ .ui-dialog.layer .layer-point {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.layer .layer-point .point-group {display:flex; flex-direction:column; align-items:flex-start;} .ui-dialog.layer .layer-point .point-group .point-text {line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-point .point-group .point-info dt {margin-top:12px; font-size:var(--F14); font-weight:700; color:var(--gray900); line-height:var(--F14L);} .ui-dialog.layer .layer-point .point-group .point-info dt:first-child {margin-top:0;} .ui-dialog.layer .layer-point .point-group .point-info dd {margin-top:2px; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L);} .ui-dialog.layer .layer-point .point-group .point-list li {position:relative; padding-left:9px; line-height:var(--F14LL); font-size:var(--F14); color:var(--gray600);} .ui-dialog.layer .layer-point .point-group .point-list li:before {content:""; position:absolute; top:10px; left:0; width:3px; height:3px; background-color:var(--gray600); border-radius:2px;} /* #187118 [퍼블/PC][상품 상세] 기프트포인트 (e) */ /* #187118 [퍼블/PC][상품 상세] 재입고 알림 신청 (s) */ .ui-dialog.layer .layer-restock {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-restock .restock-item {display:flex; flex-wrap:wrap; gap:0 12px;} /* #235616 */ .ui-dialog.layer .layer-restock .restock-item .restock-img {width:128px; height:168px; } .ui-dialog.layer .layer-restock .restock-item .restock-img img {height:100%; object-fit:contain;} .ui-dialog.layer .layer-restock .restock-item .restock-info {display:flex; flex:1; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-restock .restock-item .restock-info .title {display:flex; flex-direction:column;} .ui-dialog.layer .layer-restock .restock-item .restock-info .title .brand {line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900);} .ui-dialog.layer .layer-restock .restock-item .restock-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-restock .restock-item .restock-info .title .name.text-line1 {-webkit-line-clamp:1; max-height:20px;} /* #244755 */ .ui-dialog.layer .layer-restock .restock-item .restock-info .option li {line-height:var(--F14L); font-size:var(--F14); color:var(--gray600);} /* #235616(s) */ .ui-dialog.layer .layer-restock .restock-item .restock-info .title .price {margin-top:8px; color:var(--gray900); font-size:var(--F14); font-weight:bold;} .ui-dialog.layer .layer-restock .restock-item .restock-info .title .price .sale {display:inline-block; margin-right:2px; color:var(--purple500);} .ui-dialog.layer .layer-restock .restock-item .restock-info .title .color {display:flex; flex-wrap:wrap; gap:4px 2px; margin-top:10px; width:100%; position:relative;} .ui-dialog.layer .layer-restock .restock-item.reorder .reorder-title {display:flex; align-items:center; gap:0 4px; margin-bottom:12px; width:100%; font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} .ui-dialog.layer .layer-restock .restock-item.reorder .reorder-title::before { content: ""; width: 16px; height: 16px; background-color: var(--gray600); --url: url(../images/uxui/icon/information-16.svg); mask: var(--url) center right / 16px auto no-repeat; } .ui-dialog.layer .layer-restock .restock-item.reorder .restock-img {width:96px; height:128px; } .ui-dialog.layer .layer-restock .restock-item.reorder .badge {display:flex; align-items:center; gap:0 2px; margin-bottom:7px;} .ui-dialog.layer .layer-restock .restock-item.reorder .badge span {padding:0 4px; border:1px solid var(--gray250); border-radius:4px; box-sizing:border-box; font-size:var(--F11); line-height:15px; color:var(--gray900);} .ui-dialog.layer .layer-restock .restock-form .invalid-txt, .ui-dialog.layer .layer-restock .restock-agree .invalid-txt {margin-top:4px !important; font-size:var(--F13); line-height:var(--F13L);} .ui-dialog.layer .layer-restock .restock-agree .chk_txt {margin-bottom:-2px;} /* #235616(e) */ .ui-dialog.layer .layer-restock .restock-agree {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-restock .restock-agree .agree_terms {overflow:auto; height:180px; background-color:var(--gray150);} .ui-dialog.layer .layer-restock .bullet-list {display:flex; flex-direction:column; gap:8px 0;} /* #267770 */ .ui-dialog.layer .layer-restock .bullet-list li {position:relative; padding-left:13px; line-height:var(--F14LL); font-size:var(--F14); color:var(--gray600);} .ui-dialog.layer .layer-restock .bullet-list > li:before {content:""; position:absolute; top:10px; left:0; width:3px; height:3px; background-color:var(--gray600); border-radius:2px;} .ui-dialog.layer .layer-restock .bullet-list > li li:before {content:""; position:absolute; top:11px; left:0; width:4px; height:1px; background-color:var(--gray600);} /* #187118 [퍼블/PC][상품 상세] 재입고 알림 신청 (e) */ /* #187118 [퍼블/PC][상품 상세] 쿠폰혜택 (s) */ .ui-dialog.layer .layer-coupon {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-coupon .coupon-desc {line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-coupon .coupon-list {display:flex; flex-direction:column; gap:10px 0;} .ui-dialog.layer .layer-coupon .coupon-list .coupon-item {overflow:hidden; position:relative; } .ui-dialog.layer .layer-coupon .coupon-list .coupon-item:before {content:""; position:absolute; top:50%; right:-12px; width:24px; height:24px; border:1px solid var(--gray250); border-radius:50%; box-sizing:border-box; background-color:var(--white); transform:translateY(-50%);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box {display:flex; flex-direction:column; justify-content:space-between; height:166px; padding:20px 94px 20px 20px; border:1px solid var(--gray250); box-sizing:border-box; cursor:pointer;} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box:before {content:""; position:absolute; top:50%; right:32px; width:24px; height:24px; background:url(../images/svgs/download-20-gray900.svg) no-repeat; transform:translateY(-50%);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box .coupon-tags {display:flex; gap:0 4px;} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box .coupon-tags li {line-height:var(--F17); padding:0 4px; border:1px solid var(--gray250); border-radius:4px; box-sizing:border-box; font-size:var(--F11); color:var(--gray900);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box .coupon-price {display:block; margin-top:6px; line-height:var(--F24L); font-size:var(--F24); font-weight:700; color:var(--purple500);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box .coupon-title {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:38px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F13L); font-size:var(--F13); color:var(--gray900);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box .coupon-date {margin-top:4px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray900);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled {cursor:default;} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled:before {background-image:url(../images/svgs/download-20-gray250.svg);} .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled .coupon-tags li, .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled .coupon-price, .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled .coupon-title, .ui-dialog.layer .layer-coupon .coupon-list .coupon-box.disabled .coupon-date {color:var(--gray500);} /* #187118 [퍼블/PC][상품 상세] 쿠폰혜택 (e) */ /* #187118 [퍼블/PC][상품 상세] 소재정보 (s) */ .ui-dialog.layer .layer-material {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.layer .layer-material .material-group dl dt {line-height:var(--F14LL); font-size:var(--F14); font-weight:700; color:var(--gray900);} .ui-dialog.layer .layer-material .material-group dl dt + dd {margin-top:2px;} .ui-dialog.layer .layer-material .material-group dl dd {line-height:var(--F14LL); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-material .material-group .bullet-list {margin-top:8px;} .ui-dialog.layer .layer-material .material-group .bullet-list li {position:relative; padding-left:9px; line-height:var(--F14LL); font-size:var(--F14); color:var(--gray600);} /* #187118: 20230406 */ .ui-dialog.layer .layer-material .material-group .bullet-list li:before {content:""; position:absolute; top:10px; left:0; width:3px; height:3px; background-color:var(--gray600); border-radius:2px;} .ui-dialog.layer .layer-material .material-group table {margin-top:30px; width:100%; border-bottom:1px solid var(--gray250);} .ui-dialog.layer .layer-material .material-group table tr {border-top:1px solid var(--gray250);} .ui-dialog.layer .layer-material .material-group table th, .ui-dialog.layer .layer-material .material-group table td {line-height:var(--F14L); height:43px; font-size:var(--F14); color:var(--gray600);} .ui-dialog.layer .layer-material .material-group table th {padding:0 12px; background-color:var(--gray150); text-align:left;} .ui-dialog.layer .layer-material .material-group table td {text-align:center;} .ui-dialog.layer .layer-material .material-group table td.on {font-weight:700; color:var(--gray900);} /* #187118 [퍼블/PC][상품 상세] 소재정보 (e) */ /* #187118 [퍼블/PC][상품 상세] 사이즈 추천 (s) */ .ui-dialog.layer .layer-size-recmd {display:flex; flex-direction:column; gap:30px 0;} .ui-dialog.layer .layer-size-recmd .size-recmd-group {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form .form-item {display:flex; flex-wrap:wrap; align-items:center; gap:0 10px;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form .form-item label {min-width:60px; font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form .form-item label em {color:var(--red500)} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form .form-item .input_box {flex:1;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .size-recmd-form .form-item .invalid {width:100%; margin-top:4px; padding-left:70px; box-sizing:border-box; font-size:var(--F13); color:var(--red500); line-height:var(--F13L);} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box .group-title {line-height:var(--F15L); font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box .group-title b {font-weight:700;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box .agree_terms {overflow:auto; height:180px; background-color:var(--gray150);} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box .checkbox label {position:relative; padding-left:28px; min-height:24px; white-space:pre-wrap;} .ui-dialog.layer .layer-size-recmd .size-recmd-group .group-box .checkbox label i {position:absolute; top:0; left:0;} /* #187118 [퍼블/PC][상품 상세] 사이즈 추천 (e) */ /* #187118 [퍼블/PC][상품 상세] 사이즈 추천 결과 (s) */ /* #187118: 20230406-2 (s) */ .ui-dialog.layer .layer-size-result .size-result-box {display:flex; flex-wrap:wrap; gap:16px;} .ui-dialog.layer .layer-size-result .size-result-box .size-box-group {display:flex; flex:1; flex-direction:column; min-width:calc(50% - 8px);} .ui-dialog.layer .layer-size-result .size-result-box .size-box-group .main-title {font-size:var(--F17); color:var(--gray900); line-height:var(--F17L);} .ui-dialog.layer .layer-size-result .size-result-box .size-box-group .sub-title {margin-top:22px; font-size:var(--F15); color:var(--gray900); line-height:var(--F15L);} .ui-dialog.layer .layer-size-result .size-result-box .size-box-group .size-box {display:flex; align-items:center; justify-content:center; margin-top:10px; height:160px; background-color:var(--gray100); border-radius:var(--radius); font-size:var(--F40); font-weight:700; color:var(--gray900);} .ui-dialog.layer .layer-size-result .size-result-box .size-box-group .select {margin-top:10px;} /* #187118: 20230406-2 (e) */ .ui-dialog.layer .layer-size-result .size-result-group .size-spec {margin-top:30px; padding-top:30px; border-top:1px solid var(--gray900);} .ui-dialog.layer .layer-size-result .size-result-group .size-spec .spec-box {padding:17px 20px; background-color:var(--gray100); border-radius:var(--radius);} .ui-dialog.layer .layer-size-result .size-result-group .size-spec .spec-box table {font-size:var(--F14); color:var(--gray900); line-height:var(--F14L);} .ui-dialog.layer .layer-size-result .size-result-group .size-spec .spec-box table th {padding:3px 0; text-align:left;} .ui-dialog.layer .layer-size-result .size-result-group .size-spec .spec-box table td {padding:3px 0 3px 12px; text-align:left;} /* #187118 [퍼블/PC][상품 상세] 사이즈 추천 결과 (e) */ /* #187118 [퍼블/PC][상품 상세] 함께 코디한 상품 담기 (s) */ .ui-dialog.layer .layer-coordi .coordi-item {display:flex; gap:0 12px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img {position:relative; width:128px; height:168px; } .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .list-col-6 {height:168px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .god-item {margin:0; padding:0; height:168px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .god-item .god-img {padding-top:168px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img img {height:100%; object-fit:contain;} /* #187118: 20230323 (s) */ .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep {position:absolute; bottom:6px; right:6px; width:24px; height:24px; z-index:11; cursor:pointer;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart > label {width:auto !important; height:30px; font-weight:bold;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart > label input[type=checkbox] + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center top;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart > label input[type=checkbox]:checked + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center bottom;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart > .dummy {display:block; width:0px; height:24px; padding-left:24px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart:after {position:absolute; right:0; width:24px; height:24px; content:""; background:url('../images/svgs/like-28-white.svg') no-repeat center top / 24px auto;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-img .keep .heart[aria-pressed="true"]:after {background:url('../images/svgs/like-28-fill-red.svg') no-repeat center top / 24px auto;} /* #187118: 20230323 (e) */ .ui-dialog.layer .layer-coordi .coordi-item .coordi-info {flex:1; margin-bottom:0; padding:0;} /* #187118: 20230407 */ .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .title {display:flex; flex-direction:column;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .price {margin-top:6px; color:var(--gray900); font-weight:bold} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .price del {display:block; font-size:var(--F13); line-height:var(--F13L); color:var(--gray500); font-weight:500} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .price .sale {display:inline-block; margin-right:2px; color:var(--purple500)} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .colors {margin-top:10px;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .badges > span {margin-right:3px;} /* #187118: 20230407 */ .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .score {display:flex; align-items:center; margin-top:10px; width:100%; max-height:16px; font-size:var(--F11); line-height:var(--F11L); color:var(--gray450); font-weight:500; overflow:hidden;} /* #187118: 20230407 */ .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .score * {display:flex; align-items:center;} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .score .review {margin-right:8px} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .score .point [aria-label="rate"] {width:16px; height:16px; margin-right:2px; background:url(../images/svgs/star-fill-gray.svg) center / 16px auto no-repeat} .ui-dialog.layer .layer-coordi .coordi-item .coordi-info .score .heart [aria-label="like"] {width:16px; height:16px; margin-right:2px; background:url(../images/svgs/like-fill-gray.svg) center / 16px auto no-repeat} /* #187118: 20230323 (s) */ .ui-dialog.layer .layer-coordi .coordi-form {display:flex; flex-direction:column; margin-top:20px; padding:20px 0; border-top:1px solid var(--gray250);} /* #248657 */ .ui-dialog.layer .layer-coordi .coordi-form .select-list + .rdo_group, .ui-dialog.layer .layer-coordi .coordi-form .rdo_group + .select-list {margin-top:30px;} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option {display:flex; gap:10px; flex-wrap:wrap;} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option.gap-high {gap:20px 10px;} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option dt {width:80px; font-size:var(--F17); color:var(--gray900); line-height:36px; word-break:break-all;} /* #248657 */ .ui-dialog.layer .layer-coordi .coordi-form .coordi-option dt.dropbox-tit {line-height:44px;} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option dd {width:calc(100% - 90px);} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option dd .option-txt {font-size:var(--F17); color:var(--gray900); line-height:36px;} .ui-dialog.layer .layer-coordi .coordi-form .coordi-option dd .option-txt.invalid {color:var(--red500);} /* #248657 */ .ui-dialog.layer .layer-coordi .coordi-form .select-list {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-coordi .coordi-form .size-list {display:flex; flex-wrap:wrap;} .ui-dialog.layer .layer-coordi .coordi-form .size-list label {position:relative; min-width:72px; height:36px; margin-right:6px; margin-bottom:6px; border-radius:var(--radius); border:1px solid var(--gray250); overflow:hidden; cursor:pointer; box-sizing:border-box} .ui-dialog.layer .layer-coordi .coordi-form .size-list label span {display:block; width:100%; height:100%; padding:8px 15px 8px; font-size:var(--F13); line-height:var(--F13L); text-align:center; box-sizing:border-box;} .ui-dialog.layer .layer-coordi .coordi-form .size-list label img {width:100%; height:100%} .ui-dialog.layer .layer-coordi .coordi-form .size-list input[type=radio]:checked + label {border: 2px solid var(--gray900) !important} .ui-dialog.layer .layer-coordi .coordi-form .size-list input[type=radio]:checked + label span {padding:7px 14px 8px} /* #187118: 20230407 */ .ui-dialog.layer .layer-coordi .coordi-form .size-list input[type=radio]:disabled + label {color:var(--gray400); cursor:default} .ui-dialog.layer .layer-coordi .coordi-form .size-list input[type=radio]:disabled + label .sold-out {position:absolute; left:0; bottom:0; width:100%; height:20px; padding:0; background:rgba(0, 0, 0, 0.4); font-size:var(--F11); line-height:20px; color:var(--white); font-weight:500; text-align:center} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group {display:flex; flex-wrap:wrap; gap:6px;} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group li {padding:0;} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group li label {position:relative; min-width:72px; height:36px; padding:0 15px; border-radius:var(--radius); border:0; overflow:hidden; cursor:pointer; box-sizing:border-box; line-height:36px;} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group li label:after {display:none;} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group li input[type=radio] + label:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.layer .layer-coordi .coordi-form .rdo_group li input[type=radio]:checked + label:before {border:2px solid var(--gray900);} .ui-dialog.layer .layer-coordi .coordi-desc {padding-top:20px; border-top:1px solid var(--gray250); font-size:var(--F15); color:var(--gray600); line-height:var(--F24);} /* #187118: 20230323 (e) */ /* #187118 [퍼블/PC][상품 상세] 함께 코디한 상품 담기 (e) */ /* #187118 [퍼블/PC][상품 상세] 카드사별 혜택 안내 (s) */ .ui-dialog.layer .layer-credit {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-credit .credit-group {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-credit .credit-group .credit-info {display:flex; flex-direction:column; gap:4px 0;} .ui-dialog.layer .layer-credit .credit-group .credit-info .credit-title {font-size:var(--F14); font-weight:700; color:var(--gray900); line-height:var(--F14L);} .ui-dialog.layer .layer-credit .credit-group .credit-info table {width:100%; border-bottom:1px solid var(--gray250);} .ui-dialog.layer .layer-credit .credit-group .credit-info table th, .ui-dialog.layer .layer-credit .credit-group .credit-info table td {padding:12px; line-height:var(--F14L); height:43px; border-top:1px solid var(--gray250); box-sizing:border-box; font-size:var(--F14); color:var(--gray900); text-align:left; vertical-align:top;} .ui-dialog.layer .layer-credit .credit-group .credit-info table th {background-color:var(--gray150); font-weight:700;} .ui-dialog.layer .layer-credit .credit-group .credit-info table th .card-th {display:block; margin-top:4px;} .ui-dialog.layer .layer-credit .credit-group .credit-info table th .card-th:first-child {margin-top:0;} .ui-dialog.layer .layer-credit .credit-group .credit-info table td {padding:12px 20px;} .ui-dialog.layer .layer-credit .credit-group .credit-info table td .card-text {display:block; font-size:var(--F12); color:var(--gray600); line-height:var(--F12L);} .ui-dialog.layer .layer-credit .credit-decc {font-size:var(--F14); color:var(--gray700); line-height:var(--F14LL);} .ui-dialog.layer .layer-credit .credit-decc li {position:relative; padding-left:12px;} .ui-dialog.layer .layer-credit .credit-decc li:before {content:""; position:absolute; top:10px; left:0; width:2px; height:2px; border-radius:2px; background-color:var(--gray700);} .ui-dialog.layer .layer-credit .credit-note {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-credit .credit-note span {font-size:var(--F14); color:var(--gray600); line-height:var(--F14L); font-weight:700;} .ui-dialog.layer .layer-credit .credit-note ul {font-size:var(--F14); color:var(--gray700); line-height:var(--F14LL);} .ui-dialog.layer .layer-credit .credit-note ul li {position:relative; padding-left:12px;} .ui-dialog.layer .layer-credit .credit-note ul li:before {content:""; position:absolute; top:10px; left:0; width:2px; height:2px; border-radius:2px; background-color:var(--gray700);} /* #187118 [퍼블/PC][상품 상세] 카드사별 혜택 안내 (e) */ /* #187118 [퍼블/PC][상품 상세] 상품 문의 (s) */ .ui-dialog.popup-new .layer-inquiry {display:flex; flex-direction:column; gap:12px 0; width:100%;} /* #187118: 20230421 */ .ui-dialog.popup-new .layer-inquiry .inquiry-title {padding-left:18px; background:url("../images/svgs/information-16-gray900.svg") no-repeat left center / 16px auto; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} /* #267770(s) */ .ui-dialog.popup-new .layer-inquiry .t-list li {position:relative; padding-left:13px; line-height:var(--F14LL); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-inquiry .t-list li:before {content:""; position:absolute; top:10px; left:0; width:3px; height:3px; background-color:var(--gray600); border-radius:2px;} /* #267770(e) */ .ui-dialog.popup-new .layer-inquiry .count-textbox {position:relative; padding:15px 15px 47px 15px; width:100%; min-height:320px; max-height:320px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.popup-new .layer-inquiry .count-textbox.focused {border-color:var(--gray900);} .ui-dialog.popup-new .layer-inquiry .count-textbox textarea {padding:0; width:100%; height:100%; border:0; line-height:var(--F24); font-size:var(--F15); resize:none;} .ui-dialog.popup-new .layer-inquiry .count-textbox textarea::placeholder {color:var(--gray500);} .ui-dialog.popup-new .layer-inquiry .count-textbox .count {position:absolute; right:15px; bottom: 15px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray400);} .ui-dialog.popup-new .layer-inquiry .count-textbox .guide {position:absolute; left:15px; bottom: 15px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray400);} .ui-dialog.popup-new .layer-inquiry .inquiry-form {display:flex; gap:0 6px;} .ui-dialog.popup-new .layer-inquiry .inquiry-form .form-item {flex:1;} .ui-dialog.popup-new .layer-inquiry .inquiry-check {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.popup-new .layer-inquiry .agree_terms {overflow:auto; min-height:180px; max-height:180px; background-color:var(--gray150);} .ui-dialog.popup-new .layer-inquiry .inquiry-check .checkbox {position:relative;} .ui-dialog.popup-new .layer-inquiry .inquiry-check .checkbox .remote {display:inline-flex; align-items:center; gap:2px; width:63px; height:20px; background:none; color:var(--gray500); position:absolute; top:2px; right:0;} .ui-dialog.popup-new .layer-inquiry .inquiry-check .checkbox .remote::after {content:''; display:inline-block; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.popup-new .layer-inquiry .inquiry-check .checkbox .remote::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } .ui-dialog.popup-new .layer-inquiry .inquiry-check .checkbox .remote.on::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_up-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } /* #187118 [퍼블/PC][상품 상세] 상품 문의 (e) */ /* #187118 [퍼블/PC][상품 상세] 사이즈 비교 (s) */ .ui-dialog.popup-new .layer-size-compare {display:flex; flex:1;} .ui-dialog.popup-new .layer-size-compare .tab-rects {display:flex; flex:1; flex-direction:column; gap:20px 0; margin-bottom:0;} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list {display:flex; flex-wrap:wrap; gap:0 6px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list label {position:relative; min-width:72px; height:36px; margin:0; border-radius:var(--radius); border:1px solid var(--gray250); overflow:hidden; cursor:pointer; box-sizing:border-box} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list label span {display:block; width:100%; height:100%; padding:8px 15px 8px; font-size:var(--F13); line-height:var(--F13L); text-align:center; box-sizing:border-box;} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list label img {width:100%; height:100%} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list input[type=radio]:checked + label {border: 2px solid var(--gray900) !important} .ui-dialog.popup-new .layer-size-compare .tab-rects .radio-list input[type=radio]:checked + label span {padding:7px 15px 8px} .ui-dialog.popup-new .layer-size-compare .tab-rects div[role="tabpanel"][aria-hidden=false] {display:flex; flex:1; flex-direction:column;} .ui-dialog.popup-new .layer-size-compare .tab-rects .form-space {display:flex; justify-content:space-between;} .ui-dialog.popup-new .layer-size-compare .tab-rects .form-space .left-form {display:flex; gap:0 6px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .form-space .right-form .calendar-wrap {display:flex; gap:0 6px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .form-space .right-form .calendar-wrap .btn {border-color:var(--gray700); background-color:var(--gray700); color:var(--white);} .ui-dialog.popup-new .layer-size-compare .tab-rects .bullet-text {position:relative; margin-top:10px; padding-left:13px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray500);} .ui-dialog.popup-new .layer-size-compare .tab-rects .bullet-text:before {content:""; position:absolute; top:8px; left:0; width:3px; height:3px; background-color:var(--gray500); border-radius:2px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .bullet-text + .compare-list {margin-top:4px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .compare-item {display:flex; align-items:center; justify-content:space-between; gap:0 50px; padding:16px 0; border-top:1px solid var(--gray250);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .compare-item:first-child {padding-top:0; border-top:0;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-cont {display:flex; gap:0 12px; width:100%;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-img {width:128px; height:168px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-img img {height:100%; object-fit:contain;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info {display:flex; flex:1; flex-direction:column; gap:12px 0;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .title {display:flex; flex-direction:column; width:246px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .item-option {display:flex; align-items:flex-start; justify-content:space-between;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .item-option .select-group {display:flex; flex-wrap:wrap; gap:4px; width:246px;} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .item-option .select-group .select.md {flex:1; width:calc(50% - 2px);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .item-option .btn {width:184px; height:44px; border-radius:var(--radius); border-color:var(--gray900); line-height:44px; color:var(--gray900);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .item-option .btn.disabled {border-color:var(--gray250); color:var(--gray250);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-info .option span {line-height:var(--F14L); font-size:var(--F14); color:var(--gray600);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-btn .btn {width:184px; height:44px; border-radius:var(--radius); border-color:var(--gray900); line-height:44px; color:var(--gray900);} .ui-dialog.popup-new .layer-size-compare .tab-rects .compare-list .item-btn .btn.disabled {border-color:var(--gray250); color:var(--gray250);} .ui-dialog.popup-new .layer-size-compare .tab-rects .no-content {display:flex; flex:1; align-items:center; justify-content:center; line-height:var(--F15L); font-size:var(--F15); color:var(--gray500);} /* #187118 [퍼블/PC][상품 상세] 사이즈 비교 (e) */ /* #187118 [퍼블/PC][상품 상세] 사이즈 비교 상세 (s) */ .ui-dialog.popup-new .layer-size-detail {display:flex; flex-direction:column; gap:20px 0; width:100%;} .ui-dialog.popup-new .layer-size-detail .size-detail-list {display:flex; gap:0 24px;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item {display:flex; flex:1; flex-direction:column; gap:12px 0; min-width:calc(50% - 12px);} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-cont {display:flex; gap:0 12px;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-img {min-width:128px; max-width:128px; height:168px; } .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-img img {height:100%; object-fit:contain;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info {overflow:hidden; display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:6px 0; width:100%;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .badge {height:20px; padding:0 6px; border-radius:4px; font-size:var(--F12); color:var(--white);} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .badge.now {background-color:var(--purple500);} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .badge.buy {background-color:var(--gray450);} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .title {display:flex; flex-direction:column; width:100%;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.popup-new .layer-size-detail .size-detail-list .detail-item .item-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-size-detail .size-detail-table {display:flex; flex-direction:column; align-items:flex-end; gap:6px 0;} .ui-dialog.popup-new .layer-size-detail .size-detail-table .table-unit {line-height:20px; font-size:var(--F20); color:var(--gray500);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table {width:100%; border:1px solid var(--gray250);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table thead {background-color:var(--gray150);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table thead th {height:50px; font-size:var(--F15); color:var(--gray600);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table thead th:first-child {padding-left:20px; text-align:left; border-right:1px solid var(--gray250);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table thead th.bold {font-weight:700; color:var(--gray900);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td {padding:6px 0; line-height:var(--F15L); font-size:var(--F15); color:var(--gray900); border-right:1px solid var(--gray250); text-align:center;} .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td:first-child {padding-left:20px; text-align:left; color:var(--gray600);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table thead th:last-child, .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td:last-child {border-left:2px solid var(--gray250);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td:last-child {color:var(--gray500);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td.plus {color:var(--blue500);} .ui-dialog.popup-new .layer-size-detail .size-detail-table table tbody td.minus {color:var(--red500);} /* #187118 [퍼블/PC][상품 상세] 사이즈 비교 상세 (e) */ /* #187118 [퍼블/PC][상품 상세] 포토 리뷰 + 다이버 스타일 리뷰 (s) */ .ui-dialog.popup-new.popup-photo {background-color:transparent; height:608px !important;} .ui-dialog.popup-new .layer-photo {margin:0 !important; width:928px; padding:0 60px !important; } .ui-dialog.popup-new .layer-photo:focus {outline:none;} .ui-dialog.popup-new .layer-photo .photo-content {display:flex; height:608px; background-color:var(--white);} /* #224854(s) */ .ui-dialog.popup-new .layer-photo .photo-content .gallery {position:relative; min-width:456px;} /* #187118: 20230417 */ .ui-dialog.popup-new .layer-photo .photo-content .gallery .badge-ad {position:absolute; top:6px; right:6px; z-index:10; height:26px; padding:0 8px; border-radius:var(--radius); background:rgba(0, 0, 0, 0.4); font-size:var(--F13); line-height:var(--F20L); color:var(--white); box-sizing:border-box} /* #224854(e) */ .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSSlideWrapper {height:608px !important; background-color:#f7f7f7;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSSlideOuter li img {height:100%; object-fit:contain;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery {position:absolute; bottom:92px; right:-436px; margin-top:0px; width:400px !important; transform:translate(0px, 0px) !important;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery ul {display:flex; flex-wrap:wrap; gap:6px;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li {width:52px !important; height:52px; margin-right:0 !important; cursor:pointer;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-color:var(--white); opacity:0.6;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li.active:after {display:none !important;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li a {display:block; position:relative; height:100%;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li a:before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSGallery li a img {object-fit:cover;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction {display:block !important; position:absolute; top:50%; margin-top:-22px;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction a {position:absolute; width:44px; height:44px;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction .lSPrev {margin-left:-60px; background-color:var(--white); --url:url(../images/svgs/chevron-left-44-white.svg); mask:var(--url) center / 44px auto no-repeat; -webkit-mask:var(--url) center / 44px auto no-repeat;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction .lSNext {margin-left:944px; background-color:var(--white); --url:url(../images/svgs/chevron-right-44-white.svg); mask:var(--url) center / 44px auto no-repeat; -webkit-mask:var(--url) center / 44px auto no-repeat;} .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction .lSPrev.disabled, .ui-dialog.popup-new .layer-photo .photo-content .gallery .lSAction .lSNext.disabled {background-color:var(--gray450);} .ui-dialog.popup-new .layer-photo .photo-content .review-area {flex:1; padding:36px; width:calc(100% - 456px) !important; box-sizing:border-box;} /* #187118: 20230417 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl {display:flex; flex-direction:column; justify-content:space-between; height:100%;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd:first-child {height:100%;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary {display:flex; flex-direction:column; height:100%;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .score {display:flex; margin-bottom:6px;} /* #224854 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star {margin-top:1px; background:url(../images/base/starpoint_gray.png?timestamp=20210907) no-repeat;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point0 {background-position:left 0;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point0h {background-position:left -16px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point1 {background-position:left -32px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point1h {background-position:left -48px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point2 {background-position:left -64px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point2h {background-position:left -80px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point3 {background-position:left -96px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point3h {background-position:left -112px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point4 {background-position:left -128px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point4h {background-position:left -144px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .star.point5 {background-position:left -160px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .tag-list {display:flex; gap:0 4px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .tag-list .tag {padding:0 4px; background-color:#F2F9FE; border-radius:4px; line-height:var(--F17); font-size:var(--F11); color:var(--gray800);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .tag-list .gray {background-color:var(--gray600); color:var(--white);} /* #245325 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .diver-nick {font-size:var(--F14); color:var(--gray900); line-height:var(--F14L);} /* #245325 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list {display:flex;} /* #224854 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list .recode {position:relative; padding:0 11px 0 10px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray500); white-space:nowrap;} /* #187118: 20230417 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list .recode a {display:block; line-height:var(--F14L); font-size:var(--F14); color:var(--gray500); text-decoration:underline;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list .recode:first-child {overflow:hidden; padding-left:0; text-overflow:ellipsis;} /* #187118: 20230417 */ .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list .recode:before {content:""; position:absolute; top:4px; right:0; width:1px; height:12px; background-color:var(--gray250);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .recode-list .recode:last-child:before {display:none;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll {overflow-y:auto; margin-top:20px; padding-right:10px; max-height:368px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .option-list {overflow:hidden; display:flex; flex-wrap:wrap; gap:4px 21px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .option-list .option {position:relative; line-height:var(--F14L); font-size:var(--F14); color:var(--gray500);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .option-list .option:first-child {padding-left:0;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .option-list .option:before {content:""; position:absolute; top:4px; left:-10px; width:1px; height:12px; background-color:var(--gray250);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .comment {line-height:var(--F17LL); font-size:var(--F17); color:var(--gray900); word-break:break-word;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .cmt-scroll .option-list + .comment {margin-top:12px;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .summary .support {margin-top:6px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray500);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .help-count {display:flex; align-items:center; gap:0 5px; padding:0 12px; width:fit-content; height:36px; border:1px solid var(--gray250); border-radius:18px; box-sizing:border-box; font-size:var(--F13); color:var(--gray900);} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .help-count:before {content:""; width:16px; height:16px; background:url(../images/svgs/thumb-up-16.svg) no-repeat center center / 16px auto;} .ui-dialog.popup-new .layer-photo .photo-content .review-area dl dd .help-count.thanks:before {background: url(../images/svgs/thumb-up-red-16.svg) no-repeat center / 16px auto;} .ui-dialog.popup-new .layer-photo .photo-content.diver-type .gallery .lSGallery {bottom:36px;} .ui-dialog.popup-new .layer-photo .photo-content.diver-type .review-area dl dd .summary .cmt-scroll {max-height:490px;} /* #187118 [퍼블/PC][상품 상세] 포토 리뷰 + 다이버 스타일 리뷰 (e) */ /* #187118 [퍼블/PC][상품 상세] 픽업매장 선택 (s) */ .ui-dialog.popup-new .layer-pickup {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.popup-new .layer-pickup .pickup-group {display:flex; flex-direction:column; gap:10px 0;} .ui-dialog.popup-new .layer-pickup .pickup-group .pickup-form {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.popup-new .layer-pickup .pickup-group .pickup-form .form-row {display:flex; gap:0 6px;} .ui-dialog.popup-new .layer-pickup .pickup-group .pickup-form .form-row .select {flex:1;} .ui-dialog.popup-new .layer-pickup .pickup-group .bullet-list {margin-top:8px;} .ui-dialog.popup-new .layer-pickup .pickup-group .bullet-list li {position:relative; padding-left:13px; line-height:var(--F13L); font-size:var(--F13); color:var(--gray500);} .ui-dialog.popup-new .layer-pickup .pickup-group .bullet-list li:before {content:""; position:absolute; top:8px; left:0; width:3px; height:3px; background-color:var(--gray500); border-radius:2px;} /* #211456 */ .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist {overflow-x:auto; display:flex; gap:0 6px; height:auto; border:0;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist::-webkit-scrollbar {height:3px;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist::-webkit-scrollbar-thumb {background:rgba(0, 0, 0, 0.1); border-radius:2px;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist::-webkit-scrollbar-thumb:hover {background:rgba(0, 0, 0, 0.2);} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li {height:auto;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li button {padding:0 15px; min-width:75px; height:44px; box-sizing:border-box; border:1px solid var(--gray250); border-radius:22px; font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li[aria-selected="true"] button {background-color:var(--gray900); color:var(--white);} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li label .label {display:flex; align-items:center; justify-content:center; padding:0 15px; min-width:75px; height:44px; box-sizing:border-box; border:1px solid var(--gray250); border-radius:22px; font-size:var(--F14); color:var(--gray900); white-space:nowrap;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li label .label::after {display:none;} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round .tablist li label input[type=checkbox]:checked + .label {background-color:var(--gray900); color:var(--white);} /* //#211456 */ .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item {display:flex; flex-direction:column; gap:20px 0; border-top:1px solid var(--gray250);} .ui-dialog.popup-new .layer-pickup .pickup-group .tab-round + .store-list .store-item {padding:20px 0;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item:first-child {border-top:0;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item:last-child {padding-bottom:0;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail {max-width:396px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail .name {display:block; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail .addr {display:block; margin-top:4px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail .contact {display:flex; flex-wrap:wrap; flex-direction:column; gap:4px 0; margin-top:8px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail .contact li {display:flex; gap:0 8px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-detail .contact li b {color:var(--gray600);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-btn {width:184px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-info .info-btn .btn {width:100%; height:44px; border-radius:var(--radius); line-height:42px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location {display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 0;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .tag-list {display:flex; gap:0 4px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .tag-list .tag {padding:0 6px; border:1px solid var(--gray250); border-radius:4px; line-height:var(--F12L); font-size:var(--F12); color:var(--gray900);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .toggle-btn {position:relative; padding-right:18px; line-height:var(--F14L); font-size:var(--F14); color:var(--gray600);} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .toggle-btn::after {content:""; position:absolute; top:2px; right:1px; width:16px; height:16px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .toggle-btn::after { background-color:var(--gray600); --url:url(../images/uxui/icon/chevron_circle_down-16.svg); mask:var(--url) center right / 16px auto no-repeat; -webkit-mask:var(--url) center right / 16px auto no-repeat; } .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location.open .toggle-btn::after { --url:url(../images/uxui/icon/chevron_circle_up-16.svg); } } .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location .map-area {display:none; width:100%; overflow:hidden; height:250px;} .ui-dialog.popup-new .layer-pickup .pickup-group .store-list .store-item .store-location.open .map-area {display:block;} /* #187118 [퍼블/PC][상품 상세] 픽업매장 선택 (e) */ /* #187118 [퍼블/PC][상품 상세] 빠른배송 가능 지역 확인 (s) */ .ui-dialog.popup-new .layer-shipping {display:flex; flex-direction:column; gap:40px 0; width:100%;} .ui-dialog.popup-new .layer-shipping .shipping-group {display:flex; flex-direction:column;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-desc {line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-title {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-desc + .shipping-title {margin-top:30px;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-title em {line-height:var(--F17L); font-size:var(--F17); font-weight:700; color:var(--gray900);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-title p {line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-form {display:flex; gap:0 6px; margin-top:20px;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-form .input_box {flex:1;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-form .btn {width:124px; border-color:var(--gray700); background-color:var(--gray700); border-radius:var(--radius); color:var(--white); line-height:48px;} .ui-dialog.popup-new .layer-shipping .shipping-group .sample-table {margin-top:20px;} .ui-dialog.popup-new .layer-shipping .shipping-group .sample-table th, .ui-dialog.popup-new .layer-shipping .shipping-group .sample-table td {padding:3px 0; line-height:var(--F14L); font-size:var(--F14); color:var(--gray600); text-align:left;} .ui-dialog.popup-new .layer-shipping .shipping-group .sample-table th {white-space:nowrap;} .ui-dialog.popup-new .layer-shipping .shipping-group .sample-table td {padding-left:10px;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .list-count {line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table {margin-top:10px; width:100%;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table th {height:40px; background-color:var(--gray150); font-size:var(--F14); font-weight:700; color:var(--gray900);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table td {padding:12px 0; border-bottom:1px solid var(--gray250); line-height:var(--F14L); font-size:var(--F14); color:var(--gray900); text-align:center;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table td:first-child {text-align:left;} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table td dl {display:flex; flex-wrap:wrap; gap:6px 0; line-height:var(--F14L); font-size:var(--F14);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table td dl dt {width:53px; color:var(--gray600);} .ui-dialog.popup-new .layer-shipping .shipping-group .shipping-list .shpping-table td dl dd {width:calc(100% - 53px); color:var(--gray900);} /* #187118 [퍼블/PC][상품 상세] 빠른배송 가능 지역 확인 (e) */ /* #269977: [퍼블]빠른배송 서비스 자세히 알아보기 (레이어) 관련 일치화(s) */ .ui-dialog.popup-new .layer-fast .fast-summary {font-size:var(--F14); color:var(--gray900); line-height:var(--F14L);} .ui-dialog.popup-new .layer-fast .fast-group {margin-top:30px;} .ui-dialog.popup-new .layer-fast .fast-group .group-title {font-size:var(--F20); font-weight:bold; color:var(--gray900); line-height:var(--F20L);} .ui-dialog.popup-new .layer-fast .fast-group .fast-btns {margin-top:12px; display:flex; gap:0 6px;} .ui-dialog.popup-new .layer-fast .fast-group .fast-btns .btn {flex:1; font-size:var(--F17); color:var(--gray900);} .ui-dialog.popup-new .layer-fast .fast-group .guide-list {margin-top:20px;} .ui-dialog.popup-new .layer-fast .fast-group .guide-list > ul > li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600);} .ui-dialog.popup-new .layer-fast .fast-group .guide-list > ul > li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} .ui-dialog.popup-new .layer-fast .fast-group .guide-list + .group-title {margin-top:30px;} .ui-dialog.popup-new .layer-fast .fast-group .fast-type {margin-top:12px;} .ui-dialog.popup-new .layer-fast .fast-group .fast-type table {width:100%; border-bottom:1px solid var(--gray250);} .ui-dialog.popup-new .layer-fast .fast-group .fast-type table th, .ui-dialog.popup-new .layer-fast .fast-group .fast-type table td {height:45px; border-bottom:1px solid var(--gray250); border-left:1px solid var(--gray250); box-sizing:border-box; font-size:var(--F14); color:var(--gray600); text-align:center; line-height:var(--F14L);} .ui-dialog.popup-new .layer-fast .fast-group .fast-type table th {background-color:var(--gray150);} .ui-dialog.popup-new .layer-fast .fast-group .fast-type table tr th:first-child, .ui-dialog.popup-new .layer-fast .fast-group .fast-type table tr td:first-child {border-left:0 none;} .ui-dialog.popup-new .layer-fast .fast-group .fast-type table td.txt-black {color:var(--gray900);} /* #269977: [퍼블]빠른배송 서비스 자세히 알아보기 (레이어) 관련 일치화(e) */ /* #187118 [퍼블/PC][상품 상세] 라벨 (s) */ .ui-dialog.popup-new .layer-label {display:flex; align-items:center; position:relative; margin:0; width:454px; max-height:100%; border:1px solid var(--gray900); background-color:var(--white);} .ui-dialog.popup-new .layer-label h2 {position:absolute; top:0; left:0; width:0; height:0; font-size:0; opacity:0;} .ui-dialog.popup-new .layer-label h2 + img {margin-top:0 !important;} .ui-dialog.popup-new .layer-label .label-box {max-height:100%; overflow-y:auto; margin-top:0 !important;} .ui-dialog.popup-new .layer-label .label-box img {margin-top:0 !important;} /* #187118 [퍼블/PC][상품 상세] 라벨 (e) */ /* #222690 임직원 유의사항 팝업 (s) */ .ui-dialog.layer .layer-staff-notice {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.layer .layer-staff-notice .notice-text {font-size:var(--F17); line-height:27px; color:var(--gray900);} .ui-dialog.layer .layer-staff-notice .notice-list {font-size:var(--F14); line-height:22px; color:var(--gray600);} .ui-dialog.layer .layer-staff-notice .notice-list strong {font-weight:700;} /* #222690 임직원 유의사항 팝업 (e) */ /* #211456 [퍼블] [23년 4분기] 마이페이지 개선 - PC 팝업 */ .ui-dialog [class*='layer-mp-'] .count-textbox {position:relative; width:100%; height:181px; padding:15px 15px 47px 15px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog [class*='layer-mp-'] .count-textbox.focused {border-color:var(--gray900);} .ui-dialog [class*='layer-mp-'] .count-textbox .guide {position:absolute; bottom:15px; left:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog [class*='layer-mp-'] .count-textbox .total-txt {position:absolute; bottom:15px; right:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog [class*='layer-mp-'] .count-textbox textarea {width:100%; height:100%; resize:none; border:0; padding:0;} .ui-dialog [class*='layer-mp-'] .count-textbox textarea::placeholder {font-size:var(--F15); line-height:var(--F15L); color:var(--gray500);} .ui-dialog [class*='layer-mp-'] .count-textbox textarea::-webkit-scrollbar {width:3px;} .ui-dialog [class*='layer-mp-'] .count-textbox textarea::-webkit-scrollbar-thumb {background:var(--gray450); border-radius:2px;} .ui-dialog [class*='layer-mp-'] .count-textbox textarea::-webkit-scrollbar-thumb:hover {background:var(--gray600);} /* #211456 : 전시/상품 > 상품리뷰 작성 */ .ui-dialog .layer-mp-review-edit .review-topbox {display:flex; flex-wrap:wrap; gap:6px 0; margin-bottom:20px;} .ui-dialog .layer-mp-review-edit .review-guide {background-color:var(--gray150); border-radius:var(--radius); padding:12px 16px;} .ui-dialog .layer-mp-review-edit .review-guide .title {display:block; margin-bottom:4px; font-size:var(--F15); line-height:var(--F15L); font-weight:700;} .ui-dialog .layer-mp-review-edit .review-guide .txt {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog .layer-mp-review-edit .review-guide .link-td {display:block; font-size:var(--F14); line-height:var(--F14L); margin-top:6px;} .ui-dialog .layer-mp-review-edit .review-guide .link-td span {display:inline-flex; align-items:center; gap:0 2px; color:var(--gray500); font-size:var(--F14); line-height:var(--F14L);} .ui-dialog .layer-mp-review-edit .review-guide .link-td span::after {content:""; width:12px; height:12px; background:url(../images/uxui/icon/chevron_right-16.svg) center right / 12px no-repeat;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-mp-review-edit .review-guide .link-td span::after { background-image:none; background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_right-16.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ui-dialog .layer-mp-review-edit table {width:100%; table-layout:fixed;} .ui-dialog .layer-mp-review-edit table tbody tr {border-bottom:1px solid var(--gray150);} .ui-dialog .layer-mp-review-edit table tbody tr:first-child {border-bottom:1px solid var(--gray250);} .ui-dialog .layer-mp-review-edit table tbody tr:last-child {border-bottom:0px;} .ui-dialog .layer-mp-review-edit table tbody td {padding:28px 0; vertical-align:top;} .ui-dialog .layer-mp-review-edit table tbody tr:first-child td {padding:0 0 16px 0;} .ui-dialog .layer-mp-review-edit table tbody td .goods-img {display:block; position:relative; max-width:150px; height:168px;} .ui-dialog .layer-mp-review-edit table tbody td .goods-img:before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog .layer-mp-review-edit table tbody td .goods-img img {width:100%; height:100%; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item {padding-left:20px;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap {display:flex; align-items:flex-start; gap: 0 12px;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info {text-align:left;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .brand {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900); font-weight:700;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .name {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .option {display:flex; gap:0 6px; margin-top:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600);} /* #241162:20240605 */ .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .option dt {font-weight:700;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .option dd {flex:1;} .ui-dialog .layer-mp-review-edit table tbody td .goods-item .goods-wrap .goods-info .amount {display:block; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600); margin-top:8px;} .ui-dialog .layer-mp-review-edit table tbody td .edit-title {display:block; font-size:var(--F17); line-height:var(--F17L); font-weight:700; text-align:center; margin-bottom:16px;} .ui-dialog .layer-mp-review-edit table tbody td .edit-title em {margin-left:6px; color:var(--gray500); font-weight:400;} .ui-dialog .layer-mp-review-edit table tbody td .edit-title .title-desc {display:block; font-size:var(--F17); line-height:var(--F17L); font-weight:400; color:var(--gray500); text-align:center; margin-left:0px; margin-bottom:16px;} .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap {display:flex; flex-wrap:nowrap; margin-top:16px; justify-content:center; align-items:center;} .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .title {font-size:var(--F14); line-height:var(--F14L); font-weight:700; } .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .rate {font-size:0; direction:rtl; margin-left:16px; height:32px; margin-right:16px; background-image:none;} .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .rate i[aria-label="star"] {display:inline-block; position:relative; width:32px; height:32px; margin:0 8px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .rate input[type=radio] ~ label i[aria-label="star"] { background-color:var(--gray450); --url:url(../images/uxui/icon/star-32.svg); mask:var(--url) center right / 32px auto no-repeat; -webkit-mask:var(--url) center right / 32px auto no-repeat; } .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .rate input[type=radio]:checked ~ label i[aria-label="star"] { background-color:var(--purple500); --url:url(../images/uxui/icon/star_solid.svg); mask:var(--url) center right / 32px auto no-repeat; -webkit-mask:var(--url) center right / 32px auto no-repeat; } } .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .btn { height:28px; font-size:var(--F14); line-height:12px; font-weight:400; padding:8px 15px; background-color:var(--gray700); border:0px; border-radius:var(--radius); box-sizing:border-box; color:var(--white); } .ui-dialog .layer-mp-review-edit table tbody td .rate-wrap .btn:disabled { background-color:var(--gray250); } .ui-dialog .layer-mp-review-edit table tbody td .size-rev-group > ul, .ui-dialog .layer-mp-review-edit table tbody td .select-set-group > ul {display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px;} .ui-dialog .layer-mp-review-edit table tbody td .size-rev-group > ul > li, .ui-dialog .layer-mp-review-edit table tbody td .select-set-group > ul > li {flex:1; width:calc(50% - 2px);} .ui-dialog .layer-mp-review-edit table tbody td .size-rev-group > ul > li > label {display:block; margin-bottom:6px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog .layer-mp-review-edit table tbody td .size-rev-group > ul > li .input_box input {height:36px; font-size:var(--F14); line-height:var(--F14L);} .ui-dialog .layer-mp-review-edit table tbody td .size-rev-group > ul > li .input_box .skills .unit_txt {font-size:var(--F14); line-height:var(--F14L); height:36px; line-height:36px; white-space:nowrap;} .ui-dialog .layer-mp-review-edit table tbody td .select-group .group-title {display:block; margin-bottom:6px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog .layer-mp-review-edit table tbody td .select-group .select {height:36px;} .ui-dialog .layer-mp-review-edit table tbody td .select-group .select > label em {font-size:var(--F14); line-height:var(--F14L);} .ui-dialog .layer-mp-review-edit table tbody td .select-group .select > label:after {top:10px;} .ui-dialog .layer-mp-review-edit table tbody td .select-group .select .option > ul > li > a {padding:8px 46px 7px 15px;} .ui-dialog .layer-mp-review-edit table tbody td .select-group .select .option > ul > li > a em {font-size:var(--F14); line-height:var(--F14L);} .ui-dialog .layer-mp-review-edit table tbody td .check-group {margin-top:16px; position:relative;} .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox label {display:flex; gap:0 6px; margin-right:64px; font-size:var(--F14); line-height:var(--F14L);} .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox label i {width:34px; margin-right:0px;} .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox label span {margin-right:10px; white-space:normal;} .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox .remote {display:inline-flex; align-items:center; gap:2px; width:63px; height:20px; background:none; color:var(--gray500); position:absolute; top:0; right:0;} .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox .remote::after {content:''; display:inline-block; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox .remote::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } .ui-dialog .layer-mp-review-edit table tbody td .check-group .checkbox .remote.on::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_up-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ui-dialog .layer-mp-review-edit table tbody td .agree_terms {overflow:auto; min-height:180px; max-height:180px; background-color:var(--gray150); margin-top:10px;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress {position:relative; z-index:0; margin-bottom:16px;} /* #239730 */ .ui-dialog .layer-mp-review-edit table tbody td .review-progress .review-point .point-tip {display:flex; justify-content:space-between;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .review-point .point-tip .point {font-size:var(--F14); line-height:var(--F14L); font-weight:700;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .review-point .point-tip .txt {color:var(--gray600); font-size:var(--F14); line-height:var(--F14L); font-weight:400;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .review-point .gauge {width:100%; height:8px; background-color:var(--gray100); border-radius:4px; overflow:hidden; margin-top:4px; margin-bottom:12px;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .review-point .gauge span {display:inline-block; vertical-align:top; height:10px; width:0; background:var(--purple400);} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint {display:flex; flex-direction:column; justify-content:center; width:100%; height:44px; background-color:var(--gray100); border-radius:var(--radius);} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint ul {height:44px !important; overflow:hidden;} /*//#151740*/ .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint ul li {width:100%; font-size:var(--F14); color:var(--gray600); line-height:44px; text-align:center;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint .slide {-webkit-transform:translate(0px, 0px); -ms-transform:translate(0px, 0px); transform:translate(0px, 0px); -webkit-transition:all 1s; transition:all 1s;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint .lSFade {position:relative;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint .lSFade > li {position:absolute !important; top:0; left:0; opacity:0; z-index:1;} .ui-dialog .layer-mp-review-edit table tbody td .review-progress .input-hint .lSFade > li.active {opacity:1; z-index: 10;} .ui-dialog .layer-mp-review-edit table tbody td .limited-textarea {height:181px; margin-top:16px;} .ui-dialog .layer-mp-review-edit table tbody td .limited-textarea textarea {height:120px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-btn {width:100%; height:44px; border:1px solid var(--gray250); border-radius:var(--radius); margin-bottom:12px; box-sizing:border-box; position:relative;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-btn input[type=file] {width:100%; height:100%; padding:0; border:0; opacity:0; cursor:pointer; position:absolute; z-index:2} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-btn .btn-name::before {content:''; display:inline-block; width:20px; height:20px; margin-right:4px; background:url(../images/uxui/icon/photo-20.svg) no-repeat center / 20px auto;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-btn .btn-name {display:inline-flex; justify-content:center; align-items:center; width:100%; height:100%; font-size:var(--F14); line-height:var(--F14L); text-align:center;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-btn .total-txt {color:var(--gray600); margin-left:4px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list {margin-bottom:12px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul {display:flex; flex-wrap:wrap; gap:7px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul li {width:122px; height:122px; overflow:hidden; position:relative;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul li img {width:100%; height:100%; object-fit:cover;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul li .del {display:block; width:20px; height:20px; position:absolute; top:6px; right:6px; background:rgba(0,0,0,0.2); border-radius:var(--radius); text-indent:-9999px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul li .del a {display:block; width:20px; height:20px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-mp-review-edit table tbody td .photo-add-list ul li .del a { background-color:var(--white); --url:url(../images/uxui/icon/cancel-16.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } } .ui-dialog .layer-mp-review-edit table tbody td .photo-tip {margin:12px 0;} .ui-dialog .layer-mp-review-edit table tbody td .photo-tip span {display:block; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900); margin-bottom:4px;} .ui-dialog .layer-mp-review-edit table tbody td .photo-tip p {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-header {position:relative; padding:24px 0; border-top:1px solid var(--gray250); font-size:var(--F17); line-height:var(--F17L); color:var(--gray900);} .ui-dialog .layer-mp-review-edit .info-content .accordion-header .accordion-toggle {position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer;} .ui-dialog .layer-mp-review-edit .info-content .accordion-header .accordion-toggle::after {content:""; position:absolute; top:24px; right:0; width:24px; height:24px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-header .accordion-toggle[role="button"][aria-expanded="false"]::after {background: url(../images/uxui/icon/chevron_down.svg) no-repeat right center / 24px auto;} .ui-dialog .layer-mp-review-edit .info-content .accordion-header .accordion-toggle[role="button"][aria-expanded="true"]::after {background: url(../images/uxui/icon/chevron_up.svg) no-repeat right center / 24px auto;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content[aria-hidden="true"] {display:none;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content[aria-hidden="false"] {display:block;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list {margin-bottom:30px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list .list-title {font-size:var(--F14); line-height:var(--F14L); font-weight:700; color:var(--gray600); margin-bottom:6px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li:has(ol)::before {display:none;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li:last-child {margin-bottom:0px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li a {position:relative;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li a::before {content:""; position:absolute; bottom:0; left:0; width:100%; height:1px; background-color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table {border-bottom:1px solid var(--gray250); margin:12px 0 12px -20px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody tr {border-bottom:1px solid var(--gray250);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody th {background:var(--gray150); line-height:47px; padding:0px 12px; text-align:center; border-right:1px solid var(--gray250);} /* #237704, #239281:20240521 */ .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody th:last-child {border-right:0px;} /* #239281:20240521 */ .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody td {padding:12px 24px 12px 12px; color:var(--gray900);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody td:last-child {border-left:1px solid var(--gray250); padding:12px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list > ul > li .inner-table tbody td.txt-gray600 {color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list ol {counter-reset:item;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list ol > li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600);} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list ol > li::before {content:counter(item) ". "; counter-increment:item; position:absolute; top:0px; left:4px;} .ui-dialog .layer-mp-review-edit .info-content .accordion-content .guide-list .guide-dl {display:flex; gap:0 4px;} /* #211456 : 메인 > 포인트 사용 방법 */ .ui-dialog.popup-new .layer-pointuse {display:flex; flex-direction:column; width:100%;} .ui-dialog.popup-new .layer-pointuse .tab-rects {margin-bottom:0;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab {margin-top:20px;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-info {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-info b {font-weight:700;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list {margin-top:12px;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list > li {margin-top:10px;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list > li:first-child {margin-top:0;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list > li .list-title {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list > li ul {margin-top:6px;} .ui-dialog.popup-new .layer-pointuse .pointuse-tab .pointuse-list > li ul li {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.popup-new .layer-pointuse .pointuse-guide {overflow:hidden; position:relative; margin-top:12px; width:100%; border-radius:12px;} /* //#211456 : 메인 > 포인트 사용 방법 */ /* #211456 : 프로모션 > 퍼플코인 */ .ui-dialog .layer-mp-coin .coin-title:first-of-type {margin-top:0px;} .ui-dialog .layer-mp-coin .coin-title {font-size:var(--F15); line-height:var(--F15L); font-weight:700; margin-top:40px;} .ui-dialog .layer-mp-coin .coin-content {margin-top:10px; padding:12px 0; border-top:1px solid var(--gray900); border-bottom:1px solid var(--gray900);} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li {display:flex; justify-content:space-between; margin-top:10px;} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li:first-child {margin-top:0px;} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li .txt {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li .point {font-size:var(--F14); line-height:var(--F14L); text-align:right;} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li .point .include {display:block; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600);} .ui-dialog .layer-mp-coin .coin-content .coin-list ul li .txt-red {color:var(--red500)} .ui-dialog .layer-mp-coin .coin-content .coin-expiry {border-radius:var(--radius); background-color:var(--skyBlue150); margin-top:8px; padding:12px 14px; box-sizing:border-box;} /* #214929:20231016 */ .ui-dialog .layer-mp-coin .coin-content .coin-expiry ul li {display:flex; justify-content:space-between; margin-bottom:5px;} .ui-dialog .layer-mp-coin .coin-content .coin-expiry ul li:last-child {margin-bottom:0px;} .ui-dialog .layer-mp-coin .coin-content .coin-expiry ul li span {color:var(--gray600);} .ui-dialog .layer-mp-coin .coin-refund-info {display:flex; justify-content:space-between; align-items:center; margin-top:10px; margin-bottom:30px;} .ui-dialog .layer-mp-coin .coin-refund-info .title {font-size:var(--F14); line-height:var(--F14L); font-weight:700;} .ui-dialog .layer-mp-coin .coin-refund-info .point {font-size:var(--F20); line-height:var(--F20L); font-weight:700;} .ui-dialog .layer-mp-coin .coin-account {margin-bottom:40px;} .ui-dialog .layer-mp-coin .coin-account .select {margin-bottom:8px;} .ui-dialog .layer-mp-coin .coin-account .account-input {display:flex; flex-wrap:wrap; gap:6px;} .ui-dialog .layer-mp-coin .coin-account .account-input .btn {flex:1; border-radius:var(--radius);} .ui-dialog .layer-mp-coin .coin-agree {position:relative;} .ui-dialog .layer-mp-coin .coin-agree #agree_privacy {margin-top:12px; height:180px; overflow-y:auto !important;} /* #241334 */ .ui-dialog .layer-mp-coin .coin-agree .remote {display:inline-flex; align-items:center; gap:2px; width:63px; height:20px; background:none; color:var(--gray500); position:absolute; top:0; right:0;} .ui-dialog .layer-mp-coin .coin-agree .remote::after {content:''; display:inline-block; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-mp-coin .coin-agree .remote::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } .ui-dialog .layer-mp-coin .coin-agree .remote.on::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_up-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ui-dialog .layer-mp-coin .coin-guide-list {margin-top:12px;} .ui-dialog .layer-mp-coin .coin-guide-list ul li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600); margin-bottom:3px;} .ui-dialog .layer-mp-coin .coin-guide-list ul li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} .ui-dialog .layer-mp-coin .coin-guide-list ul li :last-child {margin-bottom:0px;} /* //#211456 : 프로모션 > 퍼플코인 */ /* #211456 : 전시/상품 > 상품 Q&A 작성 */ .ui-dialog.popup-new .layer-mp-qna {width:100%; gap:8px 0;} .ui-dialog.popup-new .layer-mp-qna .inquiry-check {margin-top:12px; gap:10px 0;} /* #216525:20231011 */ .ui-dialog.popup-new .layer-mp-qna .agree_terms {min-height:168px !important; max-height:168px !important; margin-top:2px;} /* #216525:20230915,20231012 */ /* #211456 : 클레임 > 주문취소,교환,반품 추가 */ .ui-dialog.popup-new .layer-mp-claim .claim-repair {display:flex; align-items:center; gap:0 8px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--gray250);} .ui-dialog.popup-new .layer-mp-claim .claim-repair .checkbox label {margin-right:0; font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .laye+r-mp-claim .claim-repair .checkbox label i {margin-right:12px;} /* #215242 20230905 */ .ui-dialog.popup-new .layer-mp-claim .claim-repair .repair-number {position:relative; display:flex; align-items:center; gap:0 8px; padding-left:9px; font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .claim-repair .repair-number::before {content:""; position:absolute; top:5px; left:0; width:1px; height:16px; background-color:var(--gray250);} .ui-dialog.popup-new .layer-mp-claim .item-list + .item-list {margin-top:16px;} .ui-dialog.popup-new .layer-mp-claim .item-list ul {display:flex; flex-direction:column; align-items:center; gap:16px 0;} .ui-dialog.popup-new .layer-mp-claim .item-list ul li {width:100%;} .ui-dialog.popup-new .layer-mp-claim .set-title {display:block; background:var(--gray150); padding:15px 20px; border-radius:var(--radius);} .ui-dialog.popup-new .layer-mp-claim .item-list + .set-title, .ui-dialog.popup-new .layer-mp-claim .set-list + .set-title {margin-top:30px;} .ui-dialog.popup-new .layer-mp-claim .set-title span {font-size:var(--F15); line-height:var(--F15L);} .ui-dialog.popup-new .layer-mp-claim .set-title span em {font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .set-order {display:block; background:var(--gray150); padding:15px 20px; margin-top:30px; margin-bottom:20px; border-radius:var(--radius);} .ui-dialog.popup-new .layer-mp-claim .set-order span {font-size:var(--F15); line-height:var(--F15L);} .ui-dialog.popup-new .layer-mp-claim .set-order .order-dl {display:flex; gap:0 8px;} .ui-dialog.popup-new .layer-mp-claim .set-order .order-dl dt span {font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .set-order .order-dl dd span {display:flex; align-items:center; gap:0 8px; color:var(--gray600);} .ui-dialog.popup-new .layer-mp-claim .set-order .order-dl dd span::before {content:''; width:1px; height:12px; background:var(--gray250);} .ui-dialog.popup-new .layer-mp-claim .set-list {margin-top:20px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl {margin-bottom:26px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dt {font-size:var(--F15); line-height:var(--F15L); margin-bottom:12px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dt .claim-check {margin-bottom:12px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dt .claim-check label {font-size:var(--F15); line-height:var(--F15L); margin-right:0px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dt .claim-check label i {margin-right:12px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dd {margin-bottom:12px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dd .claim-goods {margin-left:34px;} .ui-dialog.popup-new .layer-mp-claim .set-list .set-item-dl > dd .set-item-list li {margin-bottom:12px;} .ui-dialog.popup-new .layer-mp-claim .claim-item {display:flex; align-items:flex-start;} .ui-dialog.popup-new .layer-mp-claim .claim-item .checkbox label {margin-right:4px;} .ui-dialog.popup-new .layer-mp-claim .claim-title {font-size:var(--F15); line-height:var(--F15L); color:var(--gray600); margin-bottom:30px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods {display:flex; align-items:flex-start; gap: 0 20px; padding-right:30px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-img {position:relative; min-width:126px; max-width:126px; height:168px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-img:before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-img img {width:100%; height:100%; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info {display:flex; flex-direction:column; justify-content:space-between; flex:1; text-align:left;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .badge {display:flex; align-items:center; gap:0 4px; margin-bottom:8px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .badge span {padding:0 4px; border:1px solid var(--gray900); border-radius:4px; box-sizing:border-box; font-size:var(--F11); line-height:var(--F11L); color:var(--gray900);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .badge span.bd-green {border-color:var(--mint500); color:var(--mint500);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .badge span.bd-blue {border-color:var(--blue200); color:var(--blue500);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .brand {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .name {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .addon {display:grid; grid-template-columns:auto 1fr; gap:2px 6px; align-items:flex-start; margin-top:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray900);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .addon dt {font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .addon .option {color:var(--gray600);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .addon .option span {display:block; word-break:break-all;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .amount {display:block; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount {display:flex; align-items:center; margin-top:8px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount .price span {font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount .amount {position:relative; margin-left:12px; padding-left:13px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount .amount::before {content:""; position:absolute; top:5px; left:0; width:1px; height:12px; background-color:var(--gray250);} /* #215242:20230905 start */ .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount .amount:only-child {margin:0px; padding:0px;} .ui-dialog.popup-new .layer-mp-claim .claim-goods .goods-info .price-amount .amount:only-child::before {display:none;} /* //#215242:20230905 end */ .ui-dialog.popup-new .layer-mp-claim .claim-top-check {margin-top:30px; margin-bottom:20px; border-bottom:1px solid var(--gray250);} .ui-dialog.popup-new .layer-mp-claim .claim-top-check .claim-check {padding-bottom:20px;} .ui-dialog.popup-new .layer-mp-claim .claim-top-check .claim-check .checkbox.lg > label > i {margin-right:4px;} .ui-dialog.popup-new .layer-mp-claim .claim-radio {margin-bottom:30px;} .ui-dialog.popup-new .layer-mp-claim .nodata-box {margin:60px 0; font-size:var(--F17); line-height:var(--F17LL); text-align:center;} .ui-dialog.popup-new .layer-mp-claim .btn.more {width:100%; height:44px; margin:16px 0 20px; border:0px;} .ui-dialog.popup-new .layer-mp-claim .btn.more span {display:inline-flex; justify-content:center; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L);} .ui-dialog.popup-new .layer-mp-claim .btn.more span::after {content:""; width:12px; height:12px; background:url(../images/uxui/icon/chevron_down-12.svg) center / 12px no-repeat;} /* #211456 : 클레임 > 주문전체취소 */ .ui-dialog .layer-cancel-all .title {display:block; font-size:var(--F15); line-height:var(--F15L); font-weight:700;} .ui-dialog .layer-cancel-all .cancel-info .title {margin-bottom:16px;} .ui-dialog .layer-cancel-all .cancel-info .desc-dl {display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:flex-start; margin-top:6px; font-size:var(--F15); line-height:var(--F15L); margin-top:12px;} .ui-dialog .layer-cancel-all .cancel-info .desc-dl dt {color:var(--gray600);} .ui-dialog .layer-cancel-all .cancel-info .desc-dl dd {color:var(--gray900);} /* #216359:20230913 */ .ui-dialog .layer-cancel-all .cancel-input {display:flex; flex-wrap:wrap; flex-direction:column; gap:8px 0; margin-top:30px;} /* #216359:20230913 */ .ui-dialog .layer-cancel-all .cancel-input .title {margin-bottom:6px;} .ui-dialog .layer-cancel-all .with-btn {display:flex; flex-wrap:wrap; gap:6px;} .ui-dialog .layer-cancel-all .with-btn .input_box {width:calc(100% - 126px);} /* #216359:20230913 */ .ui-dialog .layer-cancel-all .with-btn .btn {flex:1; border-radius:var(--radius); border:1px solid var(--gray900);} /* #216359:20230913 */ /* #211456 아이디 변경/비밀번호 변경 */ .ui-dialog .layer-form .tbl-form {width:100%;} .ui-dialog .layer-form .tbl-form tbody th, .ui-dialog .layer-form .tbl-form tbody td {padding-top:8px; text-align:left;} .ui-dialog .layer-form .tbl-form tbody th {font-size:var(--F15); line-height:50px; color:var(--gray900); vertical-align:top;} .ui-dialog .layer-form .tbl-form tbody th.require::after {content:"*"; color:var(--red500); font-weight:700;} .ui-dialog .layer-form .tbl-form tbody tr:first-child th, .ui-dialog .layer-form .tbl-form tbody tr:first-child td {padding-top:0;} .ui-dialog .layer-form .tbl-form tbody td {vertical-align:middle;} .ui-dialog .layer-form .tbl-form tbody td .valid-td {display:flex; flex-direction:column; gap:6px 0;} .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status {display:flex; flex-direction:column; gap:2px 0; padding-top:0;} .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status > span {display:flex; align-items:center; gap:0 4px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray600);} .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status > span::before {width:12px; height:12px; background-image:none;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status > span::before { background-color:var(--gray600); --url:url(../images/uxui/icon/check-12.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status > span.ok::before { background-color:var(--purple500); } } .ui-dialog .layer-form .tbl-form tbody td .valid-td .valid-status > span.ok {color:var(--purple500);} .ui-dialog .layer-form .tbl-form tbody td .input_box.lg .skill {position:absolute; top:0; right:0; width:50px; height:100%;} .ui-dialog .layer-form .tbl-form tbody td .input_box.lg .skill .btn-pass {overflow:hidden; display:block; width:100%; height:100%; cursor:pointer; text-indent:200%; white-space:nowrap;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog .layer-form .tbl-form tbody td .input_box.lg .skill .btn-pass { background-image: none; background-color:var(--gray500); --url:url(../images/uxui/icon/media_hidden.svg); mask:var(--url) center center / 24px auto no-repeat; -webkit-mask:var(--url) center center / 24px auto no-repeat; } .ui-dialog .layer-form .tbl-form tbody td .input_box.lg[aria-hidden="false"] .skill .btn-pass { background-color:var(--gray900); --url:url(../images/uxui/icon/media_view.svg); } } /* //#211456 아이디 변경/비밀번호 변경 */ /* #211456 사이즈 추가/사이즈 수정 */ .ui-dialog.layer .layer-size-mypage {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-size-mypage .size-mypage-group {display:flex; flex-direction:column; gap:24px 0;} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form .form-item {display:flex; flex-wrap:wrap; align-items:center; gap:0 10px;} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form .form-item label {min-width:60px; font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form .form-item label em {color:var(--red500)} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form .form-item .input_box {flex:1;} .ui-dialog.layer .layer-size-mypage .size-mypage-group .size-mypage-form .form-item .invalid {width:100%; margin-top:4px; padding-left:70px; box-sizing:border-box; font-size:var(--F13); color:var(--red500); line-height:var(--F13L);} .ui-dialog.layer .layer-size-mypage .size-mypage-group .group-box {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-size-mypage .size-mypage-group .group-box .group-title {line-height:var(--F15L); font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-size-mypage .size-mypage-group .group-box .group-title b {font-weight:700;} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header label {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header .accordion-toggle {display:flex; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header .accordion-toggle::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header .accordion-toggle::after { background-color:var(--gray600); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-header .accordion-toggle[aria-expanded="true"]::after { --url:url(../images/uxui/icon/chevron_up-12.svg); } } .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-content {margin-top:12px;} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-content[aria-hidden="true"] {display:none;} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-content .terms-scroll {overflow:auto; padding:30px; height:300px; box-sizing:border-box; background-color:var(--gray150);} .ui-dialog.layer .layer-size-mypage .accordion-group .accordion-content .terms-scroll .agreeContents {margin:0; padding:0; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} /* //#211456 사이즈 추가/사이즈 수정 */ /* #211456 환불계좌 등록/환불계좌 수정 */ .ui-dialog.layer .layer-account-mypage {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-account-mypage .account-mypage-group {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form .form-item {display:flex; flex-wrap:wrap; align-items:center; gap:0 10px;} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form .form-item label {min-width:60px; font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form .form-item label em {color:var(--red500)} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form .form-item .input_box {flex:1;} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-mypage-form .form-item .invalid {width:100%; margin-top:4px; padding-left:70px; box-sizing:border-box; font-size:var(--F13); color:var(--red500); line-height:var(--F13L);} .ui-dialog.layer .layer-account-mypage .account-mypage-group .group-box {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-account-mypage .account-mypage-group .group-box .group-title {line-height:var(--F15L); font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-account-mypage .account-mypage-group .group-box .group-title b {font-weight:700;} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header label {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header .accordion-toggle {display:flex; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header .accordion-toggle::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header .accordion-toggle::after { background-color:var(--gray600); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-header .accordion-toggle[aria-expanded="true"]::after { --url:url(../images/uxui/icon/chevron_up-12.svg); } } .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-content {margin-top:12px;} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-content[aria-hidden="true"] {display:none;} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-content .terms-scroll {overflow:auto; padding:30px; height:300px; box-sizing:border-box; background-color:var(--gray150);} .ui-dialog.layer .layer-account-mypage .accordion-group .accordion-content .terms-scroll .agreeContents {margin:0; padding:0; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-guide-list > li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600);} .ui-dialog.layer .layer-account-mypage .account-mypage-group .account-guide-list > li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} /* //#211456 환불계좌 등록/환불계좌 수정 */ /* #211456 결제수단 변경 */ .popup-content .popup-paychange {width:100%;} .popup-content .popup-paychange .pay-total {display:flex; align-items:center; justify-content:space-between; padding:20px 0 40px; border-bottom:1px solid var(--gray250);} .popup-content .popup-paychange .pay-total dt {font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .popup-content .popup-paychange .pay-total dd {font-size:var(--F24); line-height:var(--F24L); color:var(--gray900); font-weight:700;} .popup-content .popup-paychange .pay-selector {margin-top:30px;} .popup-content .popup-paychange .pay-selector .pay-header {display:flex; align-items:center; justify-content:space-between;} .popup-content .popup-paychange .pay-selector .pay-header .header-title {font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .popup-content .popup-paychange .pay-selector .pay-header .header-btn {position:relative; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .popup-content .popup-paychange .pay-selector .pay-header .header-btn::before {content:""; position:absolute; bottom:2px; left:0; width:100%; height:1px; background-color:var(--gray600);} .popup-content .popup-paychange .pay-selector .pay-list {display:grid; grid-template-columns:repeat(5, 1fr); gap:8px; margin-top:20px;} .popup-content .popup-paychange .pay-selector .pay-list li label {position:relative;} .popup-content .popup-paychange .pay-selector .pay-list li label input[type="radio"] + .pay-name {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px 0; height:72px; border:1px solid var(--gray250); border-radius:var(--radius); font-size:var(--F13); line-height:var(--F13L); color:var(--gray900); box-sizing:border-box;;} .popup-content .popup-paychange .pay-selector .pay-list li label input[type="radio"]:checked + .pay-name {border-color:var(--gray900);} .popup-content .popup-paychange .pay-selector .pay-list li label input[type="radio"] + .pay-name::before {content:""; width:100%; height:28px; --label-offset: calc(13px); --label-height: calc(28px + 44px); background:url(../images/ui/ico_paywith_2x.png) no-repeat center calc(var(--label-offset) * -1) / 80px auto;} .popup-content .popup-paychange .pay-selector .pay-list li label.account input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -2 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.deposit input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -1 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.kakao input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -3 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.toss input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -4 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.naver input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -5 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.ss input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -6 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.mobile input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -7 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.payco input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -8 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label.apple input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -9 - var(--label-offset));} .popup-content .popup-paychange .pay-selector .pay-list li label .pay-badge {overflow:hidden;position:absolute; top:0; left:0; padding:2px 10px; border-radius:4px; background-color:rgba(0, 0, 0, 0.6);} .popup-content .popup-paychange .pay-selector .pay-list li label .pay-badge span {font-size:var(--F12); line-height:var(--F12L); color:var(--white);} .popup-content .popup-paychange .pay-selector .pay-item {display:flex; flex-direction:column; margin-top:30px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .pay-box .select-wrap {display:flex; align-items:center; gap:0 8px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .pay-box .select-wrap .select:last-child {width:204px; min-width:204px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .pay-box .pay-desc {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .pay-box .select-wrap + .pay-desc {margin-top:8px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .pay-box[aria-hidden="true"] {display:none;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .card {padding-bottom:12px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .card .checkbox-wrap {margin-top:20px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .account {padding-bottom:20px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .account .pay-switch {display:flex; align-items:center; justify-content:space-between; margin-top:10px; padding:28px 40px 28px 20px; border-radius:var(--radius); background-color:var(--gray100);} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .account .pay-switch dt {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .account .pay-switch dd .radio {display:flex; align-items:center; gap:0 40px;} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .account .pay-switch dd .radio label {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .popup-content .popup-paychange .pay-selector .pay-item .pay-use .apple {padding-bottom:20px;} /* //#211456 결제수단 변경 */ /* #245696(s) */ .popup-content .popup-paychange .pay-term {display:flex; flex-direction:column; gap:12px 0; margin-top:30px;} .popup-content .popup-paychange .pay-term .pay-title {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:700;} .popup-content .popup-paychange .pay-term .term-list {display:grid; grid-template-columns:auto 1fr; gap:8px 0; align-items:center;} .popup-content .popup-paychange .pay-term .term-list dt {flex:1; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .popup-content .popup-paychange .pay-term .term-list dd {text-align:right;} .popup-content .popup-paychange .pay-term .term-list dd button {position:relative; padding-right:14px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray500);} .popup-content .popup-paychange .pay-term .term-list dd button::after {position:absolute; top:4px; right:0; content:''; display:inline-block; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .popup-content .popup-paychange .pay-term .term-list dd button::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_right-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .popup-content .popup-paychange .pay-term .pay-check {margin-top:3px; padding-top:15px; padding-bottom:20px; border-top:1px solid var(--gray250);} .popup-content .popup-paychange .pay-term .pay-check p {overflow:hidden; font-size:var(--F14); color:var(--gray900); line-height:var(--F14L); white-space:nowrap; text-overflow:ellipsis; text-align:center;} /* #245696(e) */ /* #211456 교환/반품 진행 단계 */ .ui-dialog.layer .layer-order-step .order-step-title {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-order-step .order-step-box {position:relative;} .ui-dialog.layer .layer-order-step .order-step-box::before {content:""; position:absolute; top:0; left:13px; width:0; height:100%; border-right:2px dotted var(--gray250);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list {display:flex; flex-direction:column; gap:10px 0; margin-top:36px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item {overflow:hidden; position:relative; display:flex; flex-direction:column; gap:2px 0; padding-left:32px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item:first-child {padding-bottom:20px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item:last-child {padding-top:20px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item::after {content:""; position:absolute; top:-4px; left:0; width:12px; height:12px; border:8px solid var(--white); border-radius:50%;background-color:var(--gray350);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.sub-list::after {top:22px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item .order-step-title {font-size:var(--F14); line-height:var(--F14L); color:var(--gray500); font-weight:700;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.sub-list .order-step-title {margin-bottom:4px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item .order-step-sub {font-size:var(--F14); line-height:var(--F14L); color:var(--gray500);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item ul {display:flex; flex-direction:column; gap:4px 0;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item ul li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray500);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item ul li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item:last-child::before {content:""; position:absolute; top:30px; left:13px; width:0; height:100%; border-right:2px solid var(--white);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.sub-list:last-child::before {top:40px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item:last-child::after {top:16px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.sub-list:last-child::after {top:42px;} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.active::after {background-color:var(--gray900);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.active .order-step-title, .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.active .order-step-sub, .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.active .order-step-sub ul li {color:var(--gray900);} .ui-dialog.layer .layer-order-step .order-step-box .order-step-list .order-step-item.active ul li {color:var(--gray600);} /* //#211456 교환/반품 진행 단계 */ /* #211456 합배송 주문관련 교환/반품 신청 취소안내 */ .ui-dialog.popup-new .layer-order-cancel .order-cancel-sub {font-size:var(--F15); line-height:var(--F15L); color:var(--gray600);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-title {display:block; margin-top:30px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list {margin-top:4px;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item {display:flex; gap:0 12px; width:100%; padding:16px 0; border-bottom:1px solid var(--gray250);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item:last-child {border-bottom:0;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-img {position:relative; width:128px; height:168px;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-img::before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-img img {height:100%; object-fit:contain; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info {display:flex; flex:1; flex-direction:column;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .title {display:flex; flex-direction:column; width:246px;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .addon {display:grid; grid-template-columns:auto 1fr; gap:2px 6px; align-items:flex-start; margin-top:6px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .addon dt {font-weight:700;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .addon .option {color:var(--gray600);} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .addon span {display:block; word-break:break-all;} .ui-dialog.popup-new .layer-order-cancel .order-cancel-list .order-cancel-item .item-info .amount {display:block; margin-top:8px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} /* //#211456 합배송 주문관련 교환/반품 신청 취소안내 */ /* #211456 배송지 수정 */ .ui-dialog.popup-new .layer-address-change {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.popup-new .layer-address-change .address-group {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.popup-new .layer-address-change .address-group .address-header {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-title {font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-require {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-require::after {content:"*"; color:var(--red500);} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-btns {display:flex; align-items:center; gap:0 20px;} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-btns button {position:relative; font-size:var(--F15); line-height:var(--F15L); color:var(--gray600);} .ui-dialog.popup-new .layer-address-change .address-group .address-header .address-btns button::before {content:""; position:absolute; bottom:2px; left:0; width:100%; height:1px; background-color:var(--gray600);} .ui-dialog.popup-new .layer-address-change .address-group .info-table .table-dl {display:grid; grid-template-columns:90px 1fr; gap:8px 16px;} .ui-dialog.popup-new .layer-address-change .address-group .info-table .table-dl dt {width:136px; font-size:var(--F15); line-height:var(--F15L); color:var(--gray600);} .ui-dialog.popup-new .layer-address-change .address-group .info-table .table-dl dd {display:flex; align-items:center; gap:0 12px; font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); word-break:break-all;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form {width:100%;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody th, .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td {text-align:left;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody th {padding-top:8px; font-size:var(--F15); line-height:50px; color:var(--gray900); vertical-align:top;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody th.require::after {content:"*"; color:var(--red500); font-weight:700;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody tr:first-child th, .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody tr:first-child td {padding-top:0;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody tr th:not(:first-child) {padding-left:36px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td {vertical-align:middle;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody th + td {padding-top:8px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .with-btn {display:flex; align-items:center; gap:0 6px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .with-btn .input_box {flex:1;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .with-btn .btn {width:160px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .multi-td {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .invaild-text {display:block; font-size:var(--F13); line-height:var(--F13L); color:var(--red500);} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox {position:relative; width:100%; height:181px; padding:15px 15px 47px 15px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox.focused {border-color:var(--gray900);} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox .guide {position:absolute; bottom:15px; left:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox .total-txt {position:absolute; bottom:15px; right:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox textarea {width:100%; height:100%; resize:none; border:0; padding:0;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox textarea::placeholder {font-size:var(--F15); line-height:var(--F15L); color:var(--gray500);} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox textarea::-webkit-scrollbar {width:3px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox textarea::-webkit-scrollbar-thumb {background:var(--gray450); border-radius:2px;} .ui-dialog.popup-new .layer-address-change .address-group .tbl-form tbody td .count-textbox textarea::-webkit-scrollbar-thumb:hover {background:var(--gray600);} /* //#211456 배송지 수정 */ /* #211456 배송지 추가/수정 */ .ui-dialog.layer .layer-address-mypage {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-address-mypage .address-mypage-group {display:flex; flex-direction:column; gap:20px 0;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item {display:flex; flex-wrap:wrap; align-items:center; gap:0 10px;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item label {min-width:72px; font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item label em {color:var(--red500)} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-multi {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item .with-btn {display:flex; flex:1; gap:0 6px;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item .with-btn .btn {width:112px;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item .input_box {flex:1;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .address-mypage-form .form-item .invalid {width:100%; margin-top:4px; padding-left:70px; box-sizing:border-box; font-size:var(--F13); color:var(--red500); line-height:var(--F13L);} .ui-dialog.layer .layer-address-mypage .address-mypage-group .group-box {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-address-mypage .address-mypage-group .group-box .group-title {line-height:var(--F15L); font-size:var(--F15); color:var(--gray900);} .ui-dialog.layer .layer-address-mypage .address-mypage-group .group-box .group-title b {font-weight:700;} .ui-dialog.layer .layer-address-mypage .accordion-group {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header label {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header .accordion-toggle {display:flex; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header .accordion-toggle::after {content:""; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header .accordion-toggle::after { background-color:var(--gray600); --url:url(../images/uxui/icon/chevron_down-12.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-header .accordion-toggle[aria-expanded="true"]::after { --url:url(../images/uxui/icon/chevron_up-12.svg); } } .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-content[aria-hidden="true"] {display:none;} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-content .terms-scroll {overflow:auto; padding:30px; height:300px; box-sizing:border-box; background-color:var(--gray150);} .ui-dialog.layer .layer-address-mypage .accordion-group .accordion-content .terms-scroll .agreeContents {margin:0; padding:0; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} /* //#211456 배송지 추가/수정 */ /* #211456 무료사이즈 수선 안내 */ .ui-dialog.layer .layer-mp-repair .repair-guide {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900); margin-bottom:30px;} .ui-dialog.layer .layer-mp-repair .repair-process .title {font-size:var(--F14); line-height:var(--F14L); font-weight:700; margin-bottom:12px;} .ui-dialog.layer .layer-mp-repair .repair-process dl dt {font-size:var(--F14); line-height:var(--F14L); font-weight:700; color:var(--gray600); margin-bottom:6px;} /* #215241:20230905 */ .ui-dialog.layer .layer-mp-repair .repair-process dl dd {margin-bottom:24px;} .ui-dialog.layer .layer-mp-repair .repair-process dl dd ul > li {position:relative; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600); margin-bottom:3px;} .ui-dialog.layer .layer-mp-repair .repair-process dl dd ul > li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} .ui-dialog.layer .layer-mp-repair .repair-process dl dd ul > li:last-child {margin-bottom:0px;} .ui-dialog.layer .layer-mp-repair .repair-process dl dd .repair-img {display:flex; justify-content:space-between; width:337px; margin-top:10px; margin-left:20px;} /* //#211456 무료사이즈 수선 안내 */ /* #211456 무료사이즈 수선 - 배송지 목록 */ .ui-dialog.layer .layer-mp-addrlist .address-list {display:flex; flex-direction:column; gap:16px 0;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item {position:relative;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label {display:flex; align-items:center; justify-content:space-between; padding:20px 40px 20px 20px; border:1px solid var(--gray150); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item.active .address-label {border-color:var(--gray900);} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner {display:flex; align-items:flex-start; gap:0 8px;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner::before {content:""; min-width:30px; height:24px; background:url(../images/uxui/icon/radiobutton_uncheck.svg) center / 24px no-repeat;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item input[type="radio"]:checked + .address-label .address-inner::before {background:url(../images/uxui/icon/radiobutton_checked.svg) center / 24px no-repeat;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner .address-info {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner .address-info .address-name {display:flex; align-items:center; gap:0 6px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner .address-info .address-name .badge {padding:0 4px; border:1px solid var(--purple500); border-radius:4px; box-sizing:border-box; font-size:var(--F11); line-height:var(--F11L); color:var(--purple500);} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner .address-info .address-basic {display:flex; flex-direction:column; gap:2px 0;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-inner .address-info .address-basic span {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); word-break:break-all;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-btns {display:flex; align-items:center; gap:0 6px;} .ui-dialog.layer .layer-mp-addrlist .address-list .address-item .address-label .address-btns .btn {width:102px;} .ui-dialog.layer .layer-mp-addrlist .btn.more {width:100%; height:44px; margin:16px 0 20px; border:0px;} .ui-dialog.layer .layer-mp-addrlist .btn.more span {display:inline-flex; justify-content:center; align-items:center; gap:0 2px; font-size:var(--F14); line-height:var(--F14L);} .ui-dialog.layer .layer-mp-addrlist .btn.more span::after {content:""; width:12px; height:12px; background:url(../images/uxui/icon/chevron_down-12.svg) center / 12px no-repeat;} /* //#211456 무료사이즈 수선 - 배송지 목록 */ /* #211456 AS수선신청 */ .ui-dialog.popup-new .layer-repair-apply {display:flex; flex-direction:column; width:100%;} .ui-dialog.popup-new .layer-repair-apply .repair-btns {display:flex; flex-direction:column; gap:10px 0;} .ui-dialog.popup-new .layer-repair-apply .repair-guide {margin-top:40px;} /* #295559:20251219 */ .ui-dialog.popup-new .layer-repair-apply .repair-guide > li {position:relative; padding-left:20px; font-size:var(--F17); line-height:var(--F17LL); color:var(--gray600);} .ui-dialog.popup-new .layer-repair-apply .repair-guide > li::before {content:""; position:absolute; top:12px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} /* //#211456 AS수선신청 */ /* #211456 AS수선신청 > 구매상품중신청 */ .ui-dialog.popup-new .layer-repair-buy {display:flex; flex-direction:column; width:100%;} .ui-dialog.popup-new .layer-repair-buy .nodata-box {padding-top:120px; border-top:1px solid var(--gray250); font-size:var(--F15); line-height:var(--F15L); color:var(--gray600); text-align:center;} .ui-dialog.popup-new .layer-repair-buy .repair-list {display:flex; flex-direction:column; gap:16px 0; padding-top:20px; border-top:1px solid var(--gray250);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item {display:flex; align-items:flex-start;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-title {font-size:var(--F15); line-height:var(--F15L); color:var(--gray600);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods {display:flex; align-items:flex-start; gap: 0 20px; padding-right:30px;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-img {position:relative; min-width:165px; height:220px;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-img:before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-img img {width:100%; height:100%; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info {display:flex; flex-direction:column; justify-content:space-between; flex:1; text-align:left;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .badge {display:flex; align-items:center; gap:0 4px; margin-bottom:8px;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .badge span {padding:0 4px; border:1px solid var(--gray900); border-radius:4px; box-sizing:border-box; font-size:var(--F11); line-height:var(--F11L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .badge span.bd-green {border-color:var(--mint500); color:var(--mint500);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .badge span.bd-blue {border-color:var(--blue500); color:var(--blue500);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .brand {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .name {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .addon {display:grid; grid-template-columns:auto 1fr; gap:2px 6px; align-items:flex-start; margin-top:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .addon dt {font-weight:700;} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .addon .option {color:var(--gray600);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-goods .goods-info .amount {display:block; margin-top:8px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.popup-new .layer-repair-buy .repair-list .repair-item .repair-check .radio label i {margin-right:12px;} .ui-dialog.popup-new .layer-repair-buy .page {margin:40px 0 20px;} /* //#211456 AS수선신청 > 구매상품중신청 */ /* #211456 AS수선신청 > 상품코드 */ .ui-dialog.popup-new .layer-repair-code {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.popup-new .layer-repair-code .code-group {display:flex; flex-direction:column;} /* #239466:20240522 */ .ui-dialog.popup-new .layer-repair-code .code-group:not(:has(*)) { display:none; } /* #239466:20240529 */ .ui-dialog.popup-new .layer-repair-code .code-group .code-title {display:block; font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:700; margin-bottom:12px;} /* #239466:20240522 */ .ui-dialog.popup-new .layer-repair-code .code-group .code-input {display:flex; align-items:center; gap:0 6px;} .ui-dialog.popup-new .layer-repair-code .code-group .code-input .input_box {flex:1;} .ui-dialog.popup-new .layer-repair-code .code-group .code-input .btn {width:120px;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods {display:flex; align-items:flex-start; gap: 0 20px; padding-right:30px;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-img {position:relative; width:126px; min-width:126px; height:168px;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-img:before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-img img {width:100%; height:100%; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info {display:flex; flex-direction:column; justify-content:space-between; flex:1; text-align:left;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .badge {display:flex; align-items:center; gap:0 4px; margin-bottom:8px;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .badge span {padding:0 4px; border:1px solid var(--gray900); border-radius:4px; box-sizing:border-box; font-size:var(--F11); line-height:var(--F11L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .badge span.bd-green {border-color:var(--mint500); color:var(--mint500);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .badge span.bd-blue {border-color:var(--blue500); color:var(--blue500);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .brand {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .name {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .addon {display:grid; grid-template-columns:auto 1fr; gap:2px 6px; align-items:flex-start; margin-top:6px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .addon dt {font-weight:700;} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .addon .option {color:var(--gray600);} .ui-dialog.popup-new .layer-repair-code .code-group .code-goods .goods-info .amount {display:block; margin-top:8px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.popup-new .layer-repair-code .code-group .code-img {max-width:250px;} /* #295559:20251217 */ /* //#211456 AS수선신청 > 상품코드 */ /* #211456 AS수선신청 > 사진등록 및 수선종류 선택 */ .ui-dialog.popup-new .layer-repair-option {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.popup-new .layer-repair-option .option-group {display:flex; flex-direction:column;} /* #239466:20240522 */ .ui-dialog.popup-new .layer-repair-option .option-group .option-title {display:block; font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:700; margin-bottom:12px;} /* #239466:20240522 */ .ui-dialog.popup-new .layer-repair-option .option-group .option-btns {display:flex; align-items:center; gap:0 8px;} .ui-dialog.popup-new .layer-repair-option .option-group .option-btns .photo-add-btn {flex:1; height:50px; border:1px solid var(--gray900); border-radius:var(--radius); box-sizing:border-box; position:relative;} .ui-dialog.popup-new .layer-repair-option .option-group .option-btns .photo-add-btn input[type=file] {width:100%; height:100%; padding:0; border:0; opacity:0; cursor:pointer; position:absolute; z-index:2} .ui-dialog.popup-new .layer-repair-option .option-group .option-btns .photo-add-btn .btn-name::before {content:''; display:inline-block; width:20px; height:20px; margin-right:4px; background:url(../images/uxui/icon/photo-20.svg) no-repeat center / 20px auto;} .ui-dialog.popup-new .layer-repair-option .option-group .option-btns .photo-add-btn .btn-name {display:inline-flex; justify-content:center; align-items:center; width:100%; height:100%; font-size:var(--F14); line-height:var(--F14L); text-align:center;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos {display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin:20px 0;} /* #239466:20240522 */ .ui-dialog.popup-new .layer-repair-option .option-group .option-photos:not(:has(*)) {display:none;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li {width:100%; height:200px; overflow:hidden; position:relative;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li img {width:100%; height:100%; object-fit:cover;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li .del {display:block; width:20px; height:20px; position:absolute; top:6px; right:6px; background:rgba(0,0,0,0.2); border-radius:4px; text-indent:-9999px;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li .del a {display:block; width:20px; height:20px;} .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li .badge {position:absolute; bottom:6px; left:6px; padding:0 4px; height:17px; border-radius:4px; background:rgba(0, 0, 0, 0.60); font-size:var(--F11); line-height:var(--F11L); color:var(--white);} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.popup-new .layer-repair-option .option-group .option-photos li .del a { background-color:var(--white); --url:url(../images/uxui/icon/cancel-16.svg); mask:var(--url) center center / 12px auto no-repeat; -webkit-mask:var(--url) center center / 12px auto no-repeat; } } .ui-dialog.popup-new .layer-repair-option .option-group .option-btns + .option-guide, .ui-dialog.popup-new .layer-repair-option .option-group .option-photos:not(:has(*)) + .option-guide {margin-top:8px;} /* #239466:20240529 */ .ui-dialog.popup-new .layer-repair-option .option-group .option-guide > li {position:relative; padding-left:20px; font-size:var(--F17); line-height:var(--F17LL); color:var(--gray600);} .ui-dialog.popup-new .layer-repair-option .option-group .option-guide > li::before {content:""; position:absolute; top:12px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} /* //#211456 AS수선신청 > 사진등록 및 수선종류 선택 */ /* #211456 AS수선신청 > 수선부위 선택 및 상세내용 입력 */ .ui-dialog.popup-new .layer-repair-select {display:flex; flex-direction:column; align-items:center; gap:40px 0; width:100%;} .ui-dialog.popup-new .layer-repair-select .tab-radio {display:flex; align-items:center; width:100%;} .ui-dialog.popup-new .layer-repair-select .tab-radio .tab-item {flex:1;} .ui-dialog.popup-new .layer-repair-select .tab-radio .tab-item label {display:block; padding:18px 0 19px; border:1px solid var(--gray250); box-sizing:border-box; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); text-align:center;} .ui-dialog.popup-new .layer-repair-select .tab-radio .tab-item input[type="radio"]:checked + label {border-color:var(--gray900); background-color:var(--gray900); color:var(--white);} .ui-dialog.popup-new .layer-repair-select .tab-radio .tab-item + .tab-item {border-left:0;} .ui-dialog.popup-new .layer-repair-select .sel_body {position:relative; width:543px; height:295px; background:url("../images/ui/bg_body.png") no-repeat center center;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as label {display:block; font-weight:bold; text-align:center; color:var(--gray800); font-size:var(--F15); font-weight:bold; border:1px dashed #959595;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as input:checked + label {color:var(--purple400); border-color:var(--purple400);} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as input {width:0; height:0;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type01 label {width:40px; height:40px; line-height:40px; border-radius:20px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type02 label {width:34px; height:34px; line-height:34px; border-radius:17px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type03 label {width:28px; height:28px; line-height:28px; border-radius:14px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type04 label {width:33px; height:15px; line-height:15px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type05 label {width:100px; height:20px; line-height:20px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type06 label {width:33px; height:28px; line-height:28px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as.type07 label {width:32px; height:60px; line-height:52px;} .ui-dialog.popup-new .layer-repair-select .sel_body .check_as {position:absolute;} .ui-dialog.popup-new .layer-repair-select .count-textbox {position:relative; width:100%; height:133px; padding:15px 15px 47px 15px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.popup-new .layer-repair-select .count-textbox.focused {border-color:var(--gray900);} .ui-dialog.popup-new .layer-repair-select .count-textbox .guide {position:absolute; bottom:15px; left:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-repair-select .count-textbox .total-txt {position:absolute; bottom:15px; right:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-repair-select .count-textbox textarea {width:100%; height:100%; resize:none; border:0; padding:0;} .ui-dialog.popup-new .layer-repair-select .count-textbox textarea::placeholder {font-size:var(--F15); line-height:var(--F15L); color:var(--gray500);} .ui-dialog.popup-new .layer-repair-select .count-textbox textarea::-webkit-scrollbar {width:3px;} .ui-dialog.popup-new .layer-repair-select .count-textbox textarea::-webkit-scrollbar-thumb {background:var(--gray450); border-radius:2px;} .ui-dialog.popup-new .layer-repair-select .count-textbox textarea::-webkit-scrollbar-thumb:hover {background:var(--gray600);} /* //#211456 AS수선신청 > 수선부위 선택 및 상세내용 입력 */ /* //#211456 AS수선신청 > 수선부위 선택 및 상세내용 입력 */ .ui-dialog.popup-new .layer-repair-detail {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.popup-new .layer-repair-detail .detail-group {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-title {font-size:var(--F20); line-height:var(--F20L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-name {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-option {display:flex; align-items:center; gap:0 30px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-option .item-radio {display:flex; align-items:center; gap:0 24px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-option .item-radio label {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-option .item-radio label i {margin-right:6px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .detail-list .detail-item .item-option .input_box {width:302px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox {position:relative; width:100%; height:133px; padding:15px 15px 47px 15px; border:1px solid var(--gray250); border-radius:var(--radius); box-sizing:border-box;} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox.focused {border-color:var(--gray900);} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox .guide {position:absolute; bottom:15px; left:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox .total-txt {position:absolute; bottom:15px; right:15px; font-size:var(--F13); line-height:var(--F13L); color:var(--gray400);} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox textarea {width:100%; height:100%; resize:none; border:0; padding:0;} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox textarea::placeholder {font-size:var(--F15); line-height:var(--F15L); color:var(--gray500);} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox textarea::-webkit-scrollbar {width:3px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox textarea::-webkit-scrollbar-thumb {background:var(--gray450); border-radius:2px;} .ui-dialog.popup-new .layer-repair-detail .detail-group .count-textbox textarea::-webkit-scrollbar-thumb:hover {background:var(--gray600);} /* //#211456 AS수선신청 > 수선부위 선택 및 상세내용 입력 */ /* #211456 수선 비용 결제 */ .ui-dialog.layer .layer-repair-pay {display:flex; flex-direction:column; gap:30px 0; width:100%;} .ui-dialog.layer .layer-repair-pay .pay-group {display:flex; flex-direction:column; gap:12px 0;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-title {font-size:var(--F15); line-height:var(--F15L); color:var(--gray900); font-weight:700;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-mobile p {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-mobile .btn-mobile {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px 0; margin-top:20px; width:100%; height:90px; border:1px solid var(--gray900); border-radius:var(--radius); box-sizing:border-box; font-size:var(--F13); line-height:var(--F13L); color:var(--gray900);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-mobile .btn-mobile::before {content:""; width:28px; height:28px; background:url(../images/uxui/icon/mobile-28.svg) center center / 28px no-repeat;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-list {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item {display:flex; align-items:center; justify-content:space-between;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item .item-title, .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item .item-value {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item .item-value {color:var(--gray900);} /* #239448 */ .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item.total {margin-top:6px; padding-top:15px; border-top:1px solid var(--gray900);} /* #215242:2023090 */ .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item.total .item-title, .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item.total .item-value {color:var(--gray900);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item.total .item-title b, .ui-dialog.layer .layer-repair-pay .pay-group .pay-list .pay-item.total .item-value b {font-weight:700;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point {display:flex; flex-direction:column; gap:4px 0;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point .pay-input {display:flex; align-items:center; gap:0 6px; flex-wrap:wrap;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point .pay-input .input_box {flex:1;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point .pay-input .btn {width:120px;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point .pay-input .invaild-text {display:block; width:100%; margin-top:8px; font-size:var(--F13); line-height:var(--F13L); color:var(--red500);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point dl {display:flex; flex-direction:column; gap:8px 0;} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point dl dt {font-size:var(--F13); line-height:var(--F13L); color:var(--gray500);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point dl dd {display:flex; align-items:center; gap:0 2px; font-size:var(--F12); line-height:var(--F12L); color:var(--gray500);} .ui-dialog.layer .layer-repair-pay .pay-group .pay-point dl dd::before {content:""; width:16px; height:16px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-repair-pay .pay-group .pay-point dd::before { background-color:var(--gray500); --url:url(../images/uxui/icon/information-16.svg); mask:var(--url) center center / 16px auto no-repeat; -webkit-mask:var(--url) center center / 16px auto no-repeat; } } .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list {display:grid; grid-template-columns:repeat(2, 1fr); gap:0 10px;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label {position:relative;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label input[type="radio"] + .pay-name {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px 0; height:90px; border:1px solid var(--gray250); border-radius:var(--radius); font-size:var(--F13); line-height:var(--F13L); color:var(--gray900); box-sizing:border-box;;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label input[type="radio"]:checked + .pay-name {border-color:var(--gray900);} /* .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label input[type="radio"] + .pay-name::before {content:""; width:100%; height:28px; --label-offset: calc(13px); --label-height: calc(28px + 44px); background:url(../images/ui/ico_paywith.png) no-repeat center calc(var(--label-offset) * -1) / 80px auto;} */ .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label input[type="radio"] + .pay-name::before {content:""; width:100%; height:28px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.card input[type="radio"] + .pay-name::before { background-color:var(--gray900); --url:url(../images/uxui/icon/credit-28.svg); mask:var(--url) center center / 28px auto no-repeat; -webkit-mask:var(--url) center center / 28px auto no-repeat; } .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.account input[type="radio"] + .pay-name::before { background-color:var(--gray900); --url:url(../images/uxui/icon/bank-28.svg); mask:var(--url) center center / 28px auto no-repeat; -webkit-mask:var(--url) center center / 28px auto no-repeat; } } .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.account input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -2 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.deposit input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -1 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.kakao input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -3 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.toss input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -4 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.naver input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -5 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.ss input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -6 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.mobile input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -7 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.payco input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -8 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label.apple input[type="radio"] + .pay-name::before {background-position:center calc((var(--label-height)) * -9 - var(--label-offset));} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label .pay-badge {overflow:hidden;position:absolute; top:0; left:0; padding:2px 10px; border-radius:4px; background-color:rgba(0, 0, 0, 0.6);} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-list li label .pay-badge span {font-size:var(--F12); line-height:var(--F12L); color:var(--white);} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-item {display:flex; flex-direction:column; margin-top:8px;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-item .pay-use .pay-box .select-wrap {display:flex; flex-direction:column; align-items:center; gap:8px 0;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-item .pay-use .pay-box .pay-desc {display:flex; align-items:center; gap:0 2px; font-size:var(--F12); line-height:var(--F12L); color:var(--gray500);} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-item .pay-use .pay-box .select-wrap + .pay-desc {margin-top:8px;} .ui-dialog.layer .layer-repair-pay .pay-selector .pay-item .pay-use .pay-box[aria-hidden="true"] {display:none;} /* #244987(s) */ .ui-dialog.layer .layer-repair-pay .pay-term {display:grid; grid-template-columns:auto 1fr; gap:8px 0; align-items:center;} .ui-dialog.layer .layer-repair-pay .pay-term dt {flex:1; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.layer .layer-repair-pay .pay-term dd {text-align:right;} .ui-dialog.layer .layer-repair-pay .pay-term dd button {position:relative; padding-right:14px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray500);} .ui-dialog.layer .layer-repair-pay .pay-term dd button::after {position:absolute; top:4px; right:0; content:''; display:inline-block; width:12px; height:12px;} @supports (mask-image:url("")) or (-webkit-mask-image:url("")){ .ui-dialog.layer .layer-repair-pay .pay-term dd button::after { background-color:var(--gray500); --url:url(../images/uxui/icon/chevron_right-12.svg); mask:var(--url) center right / 12px auto no-repeat; -webkit-mask:var(--url) center right / 12px auto no-repeat; } } .ui-dialog.layer .layer-repair-pay .pay-check {margin-top:3px; padding-top:15px; padding-bottom:20px; border-top:1px solid var(--gray250);} /* #244987(e) */ /* //#211456 수선 비용 결제 */ /* #211456 AS현황 상세 */ .ui-dialog.layer .layer-repair-view .view-list .view-item {display:flex; align-items:center; justify-content:space-between; padding:16px 0; border-bottom:1px solid var(--gray150);} .ui-dialog.layer .layer-repair-view .view-list .view-item:first-child {padding-top:0;} .ui-dialog.layer .layer-repair-view .view-list .view-item:last-child {border-color:var(--gray250);} .ui-dialog.layer .layer-repair-view .view-list .view-item .view-title {font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.layer .layer-repair-view .view-list .view-item .view-value {font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} /* //#211456 AS현황 상세 */ /* #211456 AS수선 안내 */ .ui-dialog.popup-new .layer-repair-info {display:flex; flex-direction:column; width:100%;} .ui-dialog.popup-new .layer-repair-info .tab-rects {margin-bottom:20px;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list {display:flex; flex-direction:column; gap:10px 0;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list + .order-list {margin-top:30px;} /* #295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl {display:flex; flex-direction:column;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dt {margin-bottom:6px; font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd {position:relative; margin-bottom:4px; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd:last-child {margin-bottom:0;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd.add-txt {margin-top:12px; padding-left:0;} /* #295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd.add-txt::before {display:none;} /* #295559:20251219 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd.add-txt ul li {position:relative; padding-left:17px;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd.add-txt ul li::before {content:"※"; position:absolute; top:0px; left:0px;} /* //#295559:20251219 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd .repair-img {display:block; max-width:80px; margin-top:6px;} /* #295559:20251217 */ /* #295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd .ex-group {position:relative;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd .ex-group .ex-title {position:absolute; top:0; left:0;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list li dl dd .ex-group .ex-detail {padding-left:36px;} /* //#295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .unorder-list li {position:relative; margin-bottom:4px; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .unorder-list li b {font-weight:700;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .unorder-list li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .unorder-list li:last-child {margin-bottom:0;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .list-detail {margin:12px 0; padding:20px; border-radius:var(--radius); background-color:var(--gray100);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .list-detail dd {position:relative; margin-bottom:4px; padding-left:20px; font-size:var(--F14); line-height:var(--F14LL); color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .list-detail dd::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray900);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .list-detail dd:last-child {margin-bottom:0;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .tbl-group .group-title {font-size:var(--F17); line-height:var(--F17L); font-weight:700;} /* #295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .tbl-detail {margin-top:12px; width:100%; border-top:1px solid var(--gray250);} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .tbl-detail th {padding:12px; height:44px; border-bottom:1px solid var(--gray250); background-color:var(--gray150); font-size:var(--F14); line-height:var(--F14LL); color:var(--gray600); vertical-align:top; text-align:left;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .tbl-detail td {padding:12px; height:44px; border-bottom:1px solid var(--gray250); font-size:var(--F14); line-height:var(--F14LL); color:var(--gray900); vertical-align:top;} /* #295559:20251217 */ .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] .order-list + .tbl-group {margin-top:30px; margin-bottom:30px;} .ui-dialog.popup-new .layer-repair-info div[role="tabpanel"] p + .order-list {margin-top:30px;} /* //#295559:20251217 */ /* //#211456 AS수선 안내 */ /* //#211456 [퍼블] [23년 4분기] 마이페이지 개선 - PC 팝업 */ /* #244987(s) */ .ui-dialog.layer .layer-term .agreeContents {margin:0; padding:0;} /* #244987(e) */ /*.ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit {padding-bottom:20px;}*/ .ui-dialog.popup-new .layer-cart-wrap {margin-top:60px;} .ui-dialog.popup-new .layer-cart-wrap:first-child {margin-top:0;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-info {padding-right:24px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-info h3 {font-size:var(--F20); font-weight:700; color:var(--gray900); line-height:var(--F20L);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-info p {font-size:var(--F15); color:var(--gray900); line-height:var(--F15L);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-info span {display:block; margin-top:8px; font-size:var(--F14); color:var(--gray600); line-height:var(--F14L);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-info h3 + p {margin-top:4px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item {display:flex; gap:0 20px; width:100%;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item:last-child {border-bottom:0;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-img {position:relative; width:128px; height:168px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-img::before {position:absolute; left:0; top:0; z-index:10; width:100%; height:100%; content:''; background-color:rgba(0,0,0,.03);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-img img {height:100%; object-fit:contain; background-color:var(--gray150); animation:skeleton 2s infinite;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info {display:flex; flex:1; flex-direction:column; max-width:408px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .title {display:flex; flex-direction:column;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .addon {display:grid; grid-template-columns:auto 1fr; gap:2px 6px; align-items:flex-start; margin-top:6px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray900);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .addon dt {font-weight:700;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .addon .option {color:var(--gray600);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .addon .invalid {color:var(--red500);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .addon span {display:block; word-break:break-all;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount {display:flex; align-items:center; margin-top:8px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount .price span {font-size:var(--F17); line-height:var(--F17L); color:var(--gray900); font-weight:700;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount .amount {position:relative; margin-left:12px; padding-left:13px; font-size:var(--F14); line-height:var(--F14L); color:var(--gray600);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount .amount::before {content:""; position:absolute; top:5px; left:0; width:1px; height:12px; background-color:var(--gray250);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount .amount:only-child {margin:0px; padding:0px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-summary .benefit-item .item-info .price-amount .amount:only-child::before {display:none;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-rows h3 {margin-top:20px; padding:20px 0; border-top:1px solid var(--gray250); font-size:var(--F17); font-weight:bold; color:var(--gray900); line-height:var(--F17L);} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-rows .god-lists .god-item .god-info {padding-right:20px; padding-top:8px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-rows .god-lists .god-item .god-img {padding-top:190px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-rows .page {margin-top:40;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-cols {display:flex; flex-direction:column; gap:16px 0; margin-top:30px;} .ui-dialog.popup-new .layer-cart-wrap .layer-cart-benefit .benefit-empty {padding-top:40px; padding-bottom:80px; font-size:var(--F15); color:var(--gray500); line-height:var(--F15L); text-align:center;} .ui-dialog.popup-new .layer-cart-wrap .btn-wrap {display:flex; justify-content:center; margin-top:40px;} .ui-dialog.popup-new .layer-cart-wrap .btn-wrap .btn {flex:1; max-width:354px;} .ui-dialog.popup-new .layer-benefit-guide {margin-top:40px;} .ui-dialog.popup-new .layer-benefit-guide ul li {position:relative; margin-top:4px; padding-left:20px; font-size:var(--F14); color:var(--gray600); line-height:var(--F14LL);} .ui-dialog.popup-new .layer-benefit-guide ul li::before {content:""; position:absolute; top:10px; left:9px; width:2px; height:2px; border-radius:2px; background-color:var(--gray600);} /* #248657: 함께할인 혜택보기(e) */ /* #248657: 옵션/수량 변경(s) */ .ui-dialog.layer .layer-cart-option .option-tit {overflow:hidden; padding-right:24px; font-size:var(--F17); color:var(--gray900); line-height:var(--F17L); text-overflow:ellipsis; white-space:nowrap;} .ui-dialog.layer .layer-cart-option .option-wrap {margin-top:20px;} .ui-dialog.layer .layer-cart-option .cart-item + .option-wrap {padding-top:20px; border-top:1px solid var(--gray250);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list {display:flex; flex-direction:column; gap:20px 0; } .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item {display:flex; align-items:flex-start; gap:0 10px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .opt-name {min-width:80px; max-width:80px; font-size:var(--F17); color:var(--gray900); line-height:var(--F17LL); word-break:break-all;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item.align-36 .opt-name {margin-top:5px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item.align-44 .opt-name {margin-top:9px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item.opt-center {align-items:center;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item.opt-center .opt-name {margin-top:0 !important;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view {flex:1;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .opt-value {font-size:var(--F17); color:var(--gray900); line-height:var(--F17L);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .opt-select {gap:6px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .opt-select label {margin:0;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .opt-select input[type=radio][checked] + label:before {display:none;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .opt-select input[type=radio]:checked + label:before {display:block;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group {display:flex; flex-wrap:wrap; gap:6px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group:after {display:none;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group li {padding:0;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group li label {position:relative; min-width:72px; height:36px; padding:0 15px; border-radius:6px; border:0; overflow:hidden; cursor:pointer; box-sizing:border-box; line-height:36px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group li label:after {display:none;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group li input[type=radio] + label:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #e5e5e5; border-radius:6px; box-sizing:border-box;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .rdo_group li input[type=radio]:checked + label:before {border:2px solid var(--gray900);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box {display:inline-block; position:relative; width:111px} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box:before {content:""; position:absolute; top:0; left:37px; width:1px; height:100%; background-color:var(--gray250);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box:after {content:""; position:absolute; top:0; right:37px; width:1px; height:100%; background-color:var(--gray250);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box input[type=number] {font-weight:normal; padding:0; height:36px; border-radius:6px; box-sizing:border-box; color:var(--gray900) !important; text-align:center; text-indent:0; border-color:var(--gray250) !important;} /* #265398 */ .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box .minus {position:absolute; width:36px; height:36px; top:0; left:1px; font-size:0; border-radius:6px 0 0 6px; background-color:var(--gray900); mask:url(../images/svgs/minus-16.svg) center / 16px auto no-repeat; -webkit-mask:url(../images/svgs/minus-16.svg) center / 16px auto no-repeat; box-sizing:border-box; cursor:pointer;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box .plus {position:absolute; width:36px; height:36px; top:0; right:1px; font-size:0; border-radius:0 6px 6px 0; background-color:var(--gray900); mask:url(../images/svgs/plus-16.svg) center / 16px auto no-repeat; -webkit-mask:url(../images/svgs/plus-16.svg) center / 16px auto no-repeat; box-sizing:border-box; cursor:pointer;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box .minus.disabled, .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box .plus.disabled {background-color:var(--gray250);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box.disabled input {background-color:var(--gray100); color:var(--gray350) !important;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box.disabled .minus, .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .quantity-box.disabled .plus {background-color:var(--gray250);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .sel-opt {display:block;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .sel-opt .sel-item {margin-top:6px; font-size:var(--F17); color:var(--gray900); line-height:var(--F17LL);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .sel-opt .sel-item:first-child {margin-top:0;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .sel-opt .sel-item.invalid {color:var(--red500);} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .select-group .select {margin-top:8px; max-width:294px;} .ui-dialog.layer .layer-cart-option .option-wrap .opt-list .opt-item .detail-view .select-group .select:first-child {margin-top:0px;} .ui-dialog.layer .layer-cart-option .cart-item {display:flex; gap:0 12px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img {position:relative; width:128px; height:168px; } .ui-dialog.layer .layer-cart-option .cart-item .cart-img .list-col-6 {height:168px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .god-item {margin:0; padding:0; height:168px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .god-item .god-img {padding-top:168px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img img {height:100%; object-fit:contain;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep {position:absolute; bottom:6px; right:6px; width:24px; height:24px; z-index:11; cursor:pointer;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart > label {width:auto !important; height:30px; font-weight:bold;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart > label input[type=checkbox] + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center top;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart > label input[type=checkbox]:checked + i {width:30px; height:30px; background:url('../images/base/heart04.png') no-repeat center bottom;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart > .dummy {display:block; width:0px; height:24px; padding-left:24px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart:after {position:absolute; right:0; width:24px; height:24px; content:""; background:url('../images/svgs/like-28-white.svg') no-repeat center top / 24px auto;} .ui-dialog.layer .layer-cart-option .cart-item .cart-img .keep .heart[aria-pressed="true"]:after {background:url('../images/svgs/like-28-fill-red.svg') no-repeat center top / 24px auto;} .ui-dialog.layer .layer-cart-option .cart-item .cart-info {flex:1; margin-bottom:0; padding:0;} /* #187118: 20230407 */ .ui-dialog.layer .layer-cart-option .cart-item .cart-info .title {display:flex; flex-direction:column;} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .title .brand {overflow:hidden; line-height:var(--F14L); font-size:var(--F14); font-weight:700; color:var(--gray900); white-space:nowrap; text-overflow:ellipsis;} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .title .name {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:40px; text-overflow:ellipsis; overflow:hidden; line-height:var(--F14L); font-size:var(--F14); color:var(--gray900);} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .price {margin-top:6px; color:var(--gray900); font-weight:bold} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .price del {display:block; font-size:var(--F13); line-height:var(--F13L); color:var(--gray500); font-weight:500} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .price .sale {display:inline-block; margin-right:2px; color:var(--purple500)} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .colors {margin-top:10px;} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .badges > span {margin-right:3px;} /* #187118: 20230407 */ .ui-dialog.layer .layer-cart-option .cart-item .cart-info .score {display:flex; align-items:center; margin-top:10px; width:100%; max-height:16px; font-size:var(--F11); line-height:var(--F11L); color:var(--gray450); font-weight:500; overflow:hidden;} /* #187118: 20230407 */ .ui-dialog.layer .layer-cart-option .cart-item .cart-info .score * {display:flex; align-items:center;} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .score .review {margin-right:8px} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .score .point [aria-label="rate"] {width:16px; height:16px; margin-right:2px; background:url(../images/svgs/star-fill-gray.svg) center / 16px auto no-repeat} .ui-dialog.layer .layer-cart-option .cart-item .cart-info .score .heart [aria-label="like"] {width:16px; height:16px; margin-right:2px; background:url(../images/svgs/like-fill-gray.svg) center / 16px auto no-repeat} /* #248657: 옵션/수량 변경(e) */