@charset 'utf-8';


aside.cate {width:14rem; min-height:calc(100vh - 20rem); float:left}
aside.cate + article {width:calc(100% - 16rem); padding-left:2rem; display:inline-block}
.banner_wrap{width:1920px; margin:0 auto; overflow-x:hidden}


.src li:not(.date_range, .sel_are, .btn_area) {width:30rem}
.src li:not(:last-child){margin-right:1.5rem}
.src li.date_range {width:40rem}
.src li.sel_area {width:20rem}


.cate_cont {width:100%; padding:1rem 0 2rem}
.cate_cont a {width:calc((100% / 3) - 0.5rem); text-align:center; margin-top:3rem}
.cate_cont .cate_img {width:9rem; height:9rem; line-height:9rem; padding:1rem; text-align:center; background-color:var(--bs-gray-200); border-radius:50%; margin:0 auto 1.5rem}
.cate_cont .cate_img > span {font-size:4rem;  font-weight:100; line-height:7rem; color:var(--bs-gray-600)}
.cate_cont .cate_img > span.cloth{display:block; width:70%; height:70%; margin:15%; background:center / cover no-repeat; background-image:url('../img/shirts.png'); background-position:0 0}


.cate_cont .cate_img + div p {font-weight:bold; font-size:1.6rem}
.cate_cont a:hover .cate_img {background-color:var(--sellu-point)}
.cate_cont a:hover .cate_img span {color:var(--bs-white)}
.cate_cont a:hover p,
.cate_cont a:hover span {color:var(--sellu-point)}
.cate_cont a:hover span.cloth {background-position:-5.2rem 0 }




.prd_detail_swiper {width:40rem; margin:0 auto}


.prd_cont {padding:5rem 0rem}
.prd_cont .tit {padding-bottom:2rem}
.prd_cont .tit strong {font-size:1.8rem}
.prd_cont .sub_tit {width:100%; display:inline-block; color:var(--bs-gray-700)}
.prd_wrap {display:inline-block; width:calc(100% + 2rem)}
.prd_wrap li {margin-right:2rem; float:left; border-radius:2rem; border:0.1rem solid var(--bs-gray-200); overflow:hidden; box-shadow:0px 2px 10px -2px rgba(0, 0, 0, 0.06), 0px 0px 1px 0px rgba(0, 0, 0, 0.28); cursor:pointer}
.prd_wrap.col_5 li{width:calc(20% - 2rem);}
.prd_wrap.col_3 li{width:calc(33.33% - 2rem);}
/*.prd_wrap li:hover {box-shadow:0px 6px 32px -8px rgba(0, 0, 0, 0.2), 0px 0px 1px 0px rgba(0, 0, 0, 0.7)}*/
.prd_list li {margin-top:2rem; margin-bottom:2rem}

.prd_wrap .prd_img {height:22.2rem}
.prd_wrap .prd_img > div {width:100%; height:100%}
.prd_wrap .prd_img .front.active,
.prd_wrap .prd_img .back{display:none}
.prd_wrap .prd_img .front.active + .back{/*background-size:contain;*/ display:block}
.prd_wrap .prd_adult .prd_img .bg_img {display:none !important}
.prd_wrap .prd_adult .prd_img{position:relative}
.prd_wrap .prd_adult .prd_img:before {content:''; display:flex; align-items:center; justify-content:center; height:100%; background:var(--bs-gray-300)}
.prd_wrap .prd_adult .prd_img:after {content:'19'; width:10rem; height:10rem; line-height:10rem; border-radius:50%; background-color:rgba(255,255,255,0.8); display:block; position:absolute; top:calc(50% - 5rem); left:calc(50% - 5rem); color:var(--bs-danger); border:0.2rem solid var(--bs-danger); text-align:center; font-size:2rem}

.prd_wrap .prd_info {padding:1rem 1.5rem 1.5rem; background-color:var(--bs-white)}
.prd_wrap .writer {height:5rem; padding-bottom:1rem}
.prd_wrap .writer > * {display:inline-block}
.prd_wrap .writer_img {width:4rem; height:4rem; border-radius:50%; margin-right:1rem}

.prd_wrap .writer_name {line-height:4rem; float:right; width:calc(100% - 5.5rem); text-align:left; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:1.2rem}
.prd_wrap .writer_date {font-size:1.2rem; color:var(--bs-gray-600)}
.prd_wrap .name {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:1.8rem; font-weight:bold; margin-bottom:0rem}
.prd_wrap .cate,
.prd_wrap .tag{color:var(--bs-gray-500); width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.prd_wrap .tag span:not(:last-child):after{content:','; padding-right:0.5rem}

.prd_wrap .price {text-align:right; display:block; color:var(--bs-gray-700); border-width:0.1rem 0 0 0; border-style:solid; border-color:var(--bs-gray-200); padding-top:1rem}
.prd_wrap .price:after {content:'\005c\000a'; padding-left:0.3rem}

.prd_wrap .writer_info {width:calc(100% - 6rem); float:right}
.prd_wrap .writer_info .name {font-size:1.3rem}
.prd_wrap .writer_info .date {font-size:1.2rem; color:var(--bs-gray-600); display:block}

.prd_wrap .btn_area {border-top:0.1rem solid var(--bs-gray-200); padding-top:1rem; margin-top:0.8rem; text-align:center}
.prd_wrap .btn_area button {margin:0 0.5rem}
.prd_wrap .btn_area.bnt_3 button {width:calc(33.33% - 1.5rem)}
.prd_wrap .btn_area.bnt_2 button {width:calc(50% - 1.5rem)}
.prd_wrap .btn_area.bnt_1 button {width:100%}





.prd_mark a {line-height:2.5rem; color:var(--bs-gray-600)}
.prd_mark .material-icons, .prd_mark .material-outline-icons {float:left; margin-right:0.5rem}

.prd_opt li {border:0.1rem solid var(--bs-gray-300); padding:0.8rem 3.7rem 0.8rem 1.5rem; position:relative; margin-top:1rem}

.prd_opt li span {width:100%; height:100%; overflow:hidden; text-overflow:ellipsis; display:block; white-space:nowrap}
.prd_opt li a {position:absolute; top:0; right:0.1rem; width:3.7rem; height:3.5rem; line-height:3.5rem; font-size:1.6rem; color:var(--bs-danger); text-align:Center; background-color:var(--bs-white); border-left:0.1rem solid var(--bs-gray-300)}

.prd_btn a:not(.btn_down) {padding-top:1rem; padding-bottom:0.8rem}
.prd_btn a.btn_down{float:right; display:none}
.prd_btn:not(.down) a:not(.btn_down){width:calc(calc(50% - 1rem))}
.prd_btn:not(.down) a.btn_pay {margin-left:1.5rem}
.prd_btn.down a:not(.btn_down){width:calc(50% - 3.8rem)}
.prd_btn.down a.btn_pay {margin:0 0.5rem 0 1.5rem}
.prd_btn.down a.btn_down{display:block}

.prd_tag a {border:0.1rem solid var(--bs-gray-200); border-radius:0.5rem; padding:0.8rem 1.5rem 0.5rem; color:var(--sellu-point) !important}
.prd_tag a:hover, .prd_tag a.active {background-color:var(--sellu-point) !important; color:var(--bs-white) !important;}
.prd_tag a:not(:first-child) {margin-left:1rem}


.prd_detail .tit{padding-bottom:2rem}
.prd_detail .writer {width:100%; display:inline-block; padding-bottom:2rem}
.prd_detail .writer:not(:first-child) {padding-top:2rem}
.prd_detail .writer:not(:last-child) {border-bottom:0.1rem solid var(--bs-gray-300)}
.prd_detail .writer .writer_img {width:4rem; height:4rem; border-radius:50%; margin:0 1rem; float:left}
.prd_detail .writer .writer_img + div {width:calc(100% - 6rem); display:inline-block; float:right}
.prd_detail .writer .writer_date {font-size:1rem; color:var(--bs-gray-600); position:relative; padding-left:1.5rem}
.prd_detail .writer .writer_date:before {content:'\00B7'; font-size:1.2rem; position:absolute; left:0.5rem}
.prd_detail .writer .prd_btn {display:inline-block; font-size:1.8rem; vertical-align:middle}
.prd_detail .writer .prd_review_del {color:var(--bs-danger)}
.prd_detail .writer .prd_review_edit {color:var(--sellu-point)}

.prd_detail .writer_question .writer_info{ line-height:4rem}
.prd_detail .writer_cont + .writer_question {margin-top:2rem; border-top:0.1rem solid var(--bs-gray-200)}
.prd_detail .writer_cont ~ .writer_question {position:relative; border-color:var(--bs-gray-200)}
.prd_detail .writer_cont ~ .writer_question:before {content:'ㄴ'; position:absolute; top:calc(50% - 2rem); left:-2rem}
.prd_detail .writer_cont ~ .writer_question:last-child {padding-bottom:0}



.prd_upload li .btn_del {float:left}
.prd_upload li:not(:last-child){margin-bottom:1rem}


.cmt_list {padding:1rem}
.cmt_list .write_info {padding-bottom:1rem}
.cmt_list .write_info .date{font-size:1rem; color:var(--bs-gray-600); position:relative; padding-left:1.5rem}
.cmt_list .write_info .date:before {content:'\00B7'; font-size:1.2rem; position:absolute; left:0.5rem}
.cmt_list:not(:last-child) {border-bottom:0.1rem solid var(--bs-gray-200)}

.table_wrap {width:100%; overflow-x:auto}
.table_wrap .table{position:relative; table-layout:fixed}

.table_wrap .table td,
.table_wrap .table td a{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle}

/*
.table_wrap .table thead {position:absolute; left:0; top:0; right:0}
.table_wrap .table tbody {padding-top:3rem}
*/




.swiper-button-next:hover, .swiper-button-prev:hover { color: #b72019 }