@charset "UTF-8";


* {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
html {width: 100%;height: 100%; min-height: 100%; font-size: 10px; }
body {
	min-width: 28rem; min-height: 100%;
	font-family: "Pretendard", sans-serif;
	font-size:1.4rem; font-weight:400; color:#000; line-height: normal;
	outline: 0;
	-webkit-overflow-scrolling: touch !important;
	overflow: auto;
	height: 100% !important;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

}
body.off{overflow: hidden; touch-action: none;}
a {text-decoration:none; color:inherit;}
#wrapper{width: 100%; min-height: 100%; overflow-x: hidden;}
#header {width: 100%;}
#container {width: 100%; padding-top: 11rem; padding-bottom: 0; min-height: calc(100vh - 9.5rem);}
#container.sub{padding-top: 5.4rem;}

/* position */
.abs {position:absolute !important}
.rel {position:relative !important}
.fixed {position:fixed !important}
.sticky {position: sticky !important;}


.nobd {border:none !important;}
.noBg {background:none !important}
.nopd{padding: 0 !important;}
.notpd{padding-top: 0 !important;}
.notmg{margin-top: 0 !important;}
.nonebpd{padding-bottom: 0 !important;}

.overHidden {overflow:hidden !important}
.inline {display:inline !important;}
.inblock {display:inline-block !important;}
.block {display:block !important;}

/* vertical-align */
.vab {vertical-align: bottom !important;}
.vat {vertical-align: top !important;}
.vam {vertical-align: middle !important;}

/* 감추기 */
.blind {display:none !important}
.hidden {visibility: hidden !important}

img {max-width: 100%; max-height: 100%; vertical-align: top;margin: 0;padding: 0;}



/* text 정렬 */
.tac {text-align:center !important;}
.tal {text-align:left !important;}
.tar {text-align:right !important;}

input::placeholder{color: rgb(170, 174, 179);}


/********** layout **********/
/* header */

#header {
	position: fixed; top: 0;left: 0;
	width: 100%;
	background-color: #fff; z-index: 100;
	max-height: 11.1rem;
}
#header.sub {
	position: fixed; top: 0;left: 0;
	width: 100%;
	background-color: #fff; z-index: 100;
	max-height: 5.4rem;
}
#header.shHeader {
	position: fixed; top: 0;left: 0;
	width: 100%;
	background-color: #fff; z-index: 100;
	max-height: 17.5rem;
}


#header .headerTop{
	width: 100%; display: flex; height: 5.4rem; justify-content: space-between; align-items: center;
	border-bottom: 1px solid #ececec; padding: 0 15px;
}
#header .headerTop > h3{
	vertical-align: middle;
	text-align: center;
}
#header .headerTop > h3 > a{
	font-size: 1.8rem; text-align: center; font-weight: 500;
	letter-spacing: -0.06rem;
	color: #000;
}
#header .headerTop > button{background: none; width: 20px; padding: 0;}

#header.main .headerTop .btnPrev{visibility: hidden}

#header .gnb{width: 100%;}
#header .gnb > ul{width: 100%; font-size: 0;  display: flex; justify-content: space-between; align-items: center;}
#header .gnb > ul > li{vertical-align: middle; text-align: center; width: 33.3%;
}
#header .gnb > ul > li > a{
	display: block;
	font-size: 1.6rem; line-height: 5.4rem; letter-spacing: -0.05rem; color: #666;
	border-bottom: 1px solid #ececec; padding: 0 15px;
}
#header .gnb > ul > li.active > a{
	font-size: 1.6rem; line-height: 5.4rem; letter-spacing: -0.05rem;
	font-weight: 700; border-bottom: 2px solid #9c65ff; color: #111111;
}
#header .sh_box{width: 100%; height: 64px; background: rgba(243, 243, 243, 1); padding: 10px 20px; font-size: 0;}
#header .sh_box > span{display: inline-block; width: calc(100% - 100px); padding-left: 12px; vertical-align: middle;}
#header .sh_box > span:first-child{width: 100px; padding-left: 0;}
#header .sh_box > span .nice-select{width: 100%;}
#header .sh_box > span .inputWrap{position: relative; width: 100%;}
#header .sh_box > span .inputWrap > input{width: 100%; height: 42px; background: #fff; font-size: 1.6rem; border: solid 1px #e8e8e8; padding: 0 44px 0 18px; box-sizing: border-box; border-radius: 5px;}
#header .sh_box > span .inputWrap .btnClear {position: absolute; top: 10px; right: 38px; width: 24px; height: 24px; background: url(../images/cancel_btn.png) center center no-repeat; background-size: 24px; border: none; outline: none; cursor: pointer; }
#header .sh_box > span .inputWrap .btnSearch {position: absolute; top: 12px; right: 10px; width: 20px; height: 20px; background: url(../images/btn_sh.png) center center no-repeat; background-size: 20px; border: none; outline: none; cursor: pointer; }
#header.border_line{border: 1px solid rgba(238, 238, 238, 1);}
.mainVisual{width: 100%;}
.mainVisual img{width: 100%;}
.mainVisual .swiper-pagination{display: inline-block; width: 40px; background: rgba(0, 0, 0, 0.3); border-radius: 10px; padding: 2px 0; left: auto; right: 10px; color: rgba(255, 255, 255, 0.5); font-size: 1rem; line-height: 1.6rem; bottom: 10px !important;}
.mainVisual .swiper-pagination-current{color: #fff;}
.cateSwiper{box-shadow: 0px 3px 10px 0px #00000014; padding: 12px 5px 9px 0px;}
.cateSwiper > ul{display: flex; flex-wrap: nowrap; overflow-x: auto; -ms-overflow-style: none;
	scrollbar-width: none;}
.cateSwiper > ul::-webkit-scrollbar{display: none;}
.cateSwiper > ul > li{flex: 0 0 auto; margin-left: 10px; width: 20%;}


.cateSwiper > ul > li .cate_img{width: 60px; margin: 0 auto; }
.cateSwiper > ul > li > p{text-align: center;}
.cateSwiper > ul > li > p > span{display: inline-block; line-height: 2rem; border-radius: 1rem; padding: 0 9px; margin-top: 2px; font-size: 1.2rem; font-weight: 700; color: rgba(0, 0, 0, 0.8);}
.cateSwiper > ul > li.active > p > span{background: #9C65FF; color: #fff;}

.main_product{width: 100%; padding: 40px 20px 30px;}
.main_product > h4{font-size: 2rem; font-weight: 700; color: rgba(51, 51, 51, 1);}
.main_product .tabContent{width: 100%; margin-top: 30px;}
.productTab{margin-top: 21px; width: 100%; display: flex; justify-content: space-between; align-items: center;}
.productTab > li{width: calc(25% - 4.5px); margin-left: 6px; text-align: center;}
.productTab > li:first-child{margin-left: 0;}
.productTab > li > span{display: block; line-height: 4.2rem; border-radius: 2.1rem; text-align: center; font-size: 1.2rem; color: rgba(136, 136, 136, 1); background: rgba(247, 247, 248, 1);}
.productTab > li.on > span{background: rgba(245, 241, 251, 1); color: rgba(119, 70, 221, 1);}

.brand_box{width: 100%;}
.brand_box > h3{font-size: 2rem; line-height: 2.4rem; font-weight: 700; color: rgba(51, 51, 51, 1); padding: 20px 16px; padding: 20px 16px 12px;}
.brand_box > h3 > span{font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: rgba(119, 70, 221, 1);}
.brandSwiper{background: rgba(243, 243, 243, 1);}
.brandList{padding: 16px 16px 42px; font-size: 0;}
.brandList > li{display: inline-block; width: calc(25% - 6px); margin:4px 0 4px 8px; background: #fff; padding: 0 0 8px; border-radius: 8px; overflow: hidden; border: 1px solid #fff;}
.brandList > li.active{border: 1px solid rgba(119, 70, 221, 1);}
.brandList > li:first-child{margin-left: 0;}
.brandList > li:nth-child(4n+1){margin-left: 0;}
.brandList > li .logo_img{width: 100%; padding: 8px 8px 4px; text-align: center;}
.brandList > li .logo_img > img{width: 100%;}
.brandList > li > p{font-size: 1.2rem; color: rgba(136, 136, 136, 1); text-align: center; padding: 0 8px; height: 24px; line-height: 12px; text-overflow: ellipsis !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; white-space: normal; overflow: hidden;}

.couponList_A{padding: 16px 16px 40px; font-size: 0;}
.couponList_A > li{display: inline-block; width: calc(33.3% - 6px); margin:4px 0 4px 9px; background: #fff; padding: 0 0 10px; border-radius: 8px; overflow: hidden; border: 1px solid #fff;}
.couponList_A > li.active{border: 1px solid rgba(119, 70, 221, 1);}
.couponList_A > li:first-child{margin-left: 0;}
.couponList_A > li:nth-child(3n+1){margin-left: 0;}
.couponList_A > li .logo_img{width: 100%; padding: 5px; text-align: center;}
.couponList_A > li .logo_img > img{width: 100%;}
.couponList_A > li > p{font-size: 0.8rem; margin-top: 12px; color: rgba(136, 136, 136, 1); text-align: center; padding: 0 5px; height: 14px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.couponList_A > li > p > i{font-size: 1rem; font-weight: 600; padding-left: 4px;}
.couponSwiper{position: relative; background: rgba(243, 243, 243, 1);}
.couponSwiper .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 16px !important;}
.couponSwiper .swiper-pagination-bullet{background: rgba(255, 255, 255, 1) !important; opacity: 1; width: 10px; height: 10px;}
.couponSwiper .swiper-pagination-bullet-active{background: rgba(119, 70, 221, 1) !important;}

.list_inner_B{width: 100%; padding: 20px; background: rgba(243, 243, 243, 1);}
.list_inner_B ul{width: 100%;}
.list_inner_B ul > li{width: 100%; background: #fff; border-radius: 12px; padding: 20px 20px 32px; margin-top: 20px; position: relative;}
.list_inner_B ul > li:first-child{margin-top: 0;}
.list_inner_B ul > li .dateAr{position: relative; display: block; padding-bottom: 13px; border-bottom: 1px solid rgba(238, 238, 238, 1);}
.list_inner_B ul > li .dateAr > p{display: inline-block; width: auto; vertical-align: middle; background: rgba(247, 247, 248, 1); padding: 0 4px; border-radius: 4px; font-size: 1rem; line-height: 2rem;}
.list_inner_B ul > li .dateAr > span{font-size: 1.2rem; color: rgba(102, 102, 102, 1); margin-left: 8px; display: inline-block; vertical-align: middle;}
.list_inner_B ul > li .dateAr > button{position: absolute; height: 28px; background: #fff; padding: 0 12px; border-radius: 6px; border: 1px solid rgba(216, 216, 216, 1); font-size: 1.4rem; color: rgba(99, 99, 99, 1); right: 0; bottom: 9px;}
.list_inner_B ul > li .couponcard{width: 100%; font-size: 0; margin-top: 14px; position: relative;}
.list_inner_B ul > li .couponcard .dim {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: rgba(255, 255, 255, 0.80);}
.list_inner_B ul > li .couponcard .dim .state {position: absolute; top: 5.2rem; left: 2.6rem; width: auto; margin: 0;}
.list_inner_B ul > li .couponcard .dim .state i {margin: 0;}
.list_inner_B ul > li .couponcard .prd_img{width: 96px; display: inline-block; vertical-align: middle;}
.list_inner_B ul > li .couponcard .prd_info{width: calc(100% - 96px); padding-left: 20px; display: inline-block; vertical-align: middle;}
.list_inner_B ul > li .couponcard .prd_info > i{display: inline-block;  padding: 0 4px; border-radius: 4px; font-size: 1rem; line-height: 2rem; background: rgba(245, 239, 255, 1); color: rgba(119, 70, 221, 1);}
.list_inner_B ul > li .couponcard .prd_info .brand_name{font-size: 1.2rem; line-height: 1.4rem; color: rgba(136, 136, 136, 1); margin-top: 14px;}
.list_inner_B ul > li .couponcard .prd_info .prd_name{width: 100%; word-break: break-all; margin-top: 4px; font-size: 1.4rem; color: rgba(32, 32, 32, 1); letter-spacing: -0.06rem; height: auto; padding-top: 0; margin-bottom: 0; text-overflow: ellipsis !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-height: unset !important; -webkit-box-orient: vertical !important; white-space: normal; overflow: hidden; line-height: 1.6rem; font-weight: 700;}
.list_inner_B ul > li .couponcard .price{ margin-top: 8px;}
.list_inner_B ul > li .couponcard .price > em{display: inline-block; vertical-align: middle; font-size: 1.2rem; line-height: 1.4rem;}
.list_inner_B ul > li .couponcard .price > p{display: inline-block; font-size: 1.6rem; line-height: 1.9rem; vertical-align: middle; font-weight: 700; width: auto; color: rgba(119, 70, 221, 1); padding-left: 5px;}
.list_inner_B ul > li .cancelDim{display: none;}
.list_inner_B ul > li .prd_img{position: relative;}
.list_inner_B ul > li .prd_img > span{display: none;}
.list_inner_B ul > li.buyCancel .cancelDim{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(255, 255, 255, 0.75); z-index: 3; display: block;}
.list_inner_B ul > li.buyCancel .prd_img > span{display: block; text-align: center; width: 100%; height: 100%; position: absolute; z-index: 5;}
.list_inner_B ul > li.buyCancel .prd_img > span > img{width: 56px; margin-top: 40px; display: inline-block;}
.list_inner_B .massgeBox{width: 100%; background: rgba(243, 243, 243, 1); padding: 2.4rem; margin-top: 2.4rem; border-radius: 0.6rem; border: 0.1rem solid #E9E9E9;}
.list_inner_B .massgeBox .masInner{font-size: 1.4rem; line-height: 1.6rem; color: rgba(96, 96, 96, 1);}
.list_inner_B .buyInfoList{margin-top: 27px; width: 100%;}
.list_inner_B .buyInfoList > h4{font-size: 1.4rem; line-height: 1.7rem; color: rgba(17, 17, 17, 1); padding-bottom: 10px; border-bottom: 1px solid rgba(238, 238, 238, 1);}
.list_inner_B .buyInfoList > ul{width: 100%; margin-top: 10px; padding-bottom: 10px;}
.list_inner_B .buyInfoList > ul > li{width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 0; margin-top: 8px;}
.list_inner_B .buyInfoList > ul > li:first-child{margin-top: 0;}
.list_inner_B .buyInfoList > ul > li > span{font-size: 1.4rem; line-height: 2.1rem; color: rgba(51, 51, 51, 1); text-align: right;}
.list_inner_B .buyInfoList > ul > li > span:first-child{color: rgba(136, 136, 136, 1); text-align: left;}
.list_inner_B .buyInfoList > button{width: 100%; background: rgba(199, 199, 199, 1); height: 40px; border-radius: 14px; font-size: 1.4rem; font-weight: 700; color: #fff;}
.list_inner_B .acceptList{margin-top: 27px; width: 100%;}
.list_inner_B .acceptList > h4{font-size: 1.4rem; line-height: 1.7rem; color: rgba(17, 17, 17, 1); padding-bottom: 10px; border-bottom: 1px solid rgba(238, 238, 238, 1);}
.list_inner_B .acceptList > ul{width: 100%; margin-top: 10px; padding-bottom: 10px;}
.list_inner_B .acceptList > ul > li{width: 100%; display: table; padding: 0; margin-top: 10px;}
.list_inner_B .acceptList > ul > li:first-child{margin-top: 0;}
.list_inner_B .acceptList > ul > li .info{display: table-cell;  width: auto; vertical-align: middle;}
.list_inner_B .acceptList > ul > li .info > p{ font-size: 1.4rem; line-height: 2.1rem; color: rgba(51, 51, 51, 1); font-weight: 700;}
.list_inner_B .acceptList > ul > li .info > span{font-size: 1.4rem; line-height: 2.1rem; color: rgba(51, 51, 51, 1);}
.list_inner_B .acceptList > ul > li .btnAr{text-align: right; display: table-cell;  width: auto; vertical-align: middle;}
.list_inner_B .acceptList > ul > li .btnAr > button{background: #fff; height: 28px; border-radius: 6px; padding: 0 1.2rem; border: 1px solid rgba(216, 216, 216, 1); font-size: 1.4rem; color: rgba(99, 99, 99, 1);}
.list_inner_B .acceptList > ul > li .btnAr > button.btn_p{border-color: rgba(119, 70, 221, 1); color: rgba(119, 70, 221, 1);}
.list_inner_B .detail_text{display: block; padding: 20px 10px;}
.buyList{width: 100%; background: rgba(243, 243, 243, 1); padding: 18px 16px 21px;}
.buyList > ul{width: 100%; margin-top: 15px;}
.buyList > ul.mgt0{margin-top: 0;}
.buyList > ul > li{font-size: 1.2rem; line-height: 1.4rem; margin-top: 14px; color: rgba(96, 96, 96, 1); padding-left: 0.9rem; text-indent: -0.9rem;}
.buyList > ul > li:first-child{margin-top: 0;}

.couponDetail{width: 100%;}
.couponDetail .pdImg{width: 180px; margin: 0 auto; border-radius: 8px; overflow: hidden; position: relative;}
.couponDetail .pdImg .dim {width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background: rgba(255, 255, 255, 0.80);}
.couponDetail .pdImg > img{width: 100%;}
.couponDetail .pdInfo{margin-top: 20px; text-align: center;}
.couponDetail .pdInfo > span{font-size: 1.2rem; line-height: 1.4rem; color: rgba(136, 136, 136, 1); display: block;}
.couponDetail .pdInfo > p{font-size:1.4rem; font-weight: 700; line-height: 1.7rem; color: rgba(0, 0, 0, 1); margin-top: 8px;}
.couponDetail .pdInfo .date{margin-top: 8px;}
.couponDetail .pdInfo .date > i{display: inline-block; line-height: 20px; padding: 0 4px; background: rgba(247, 247, 248, 1); border-radius: 4px; vertical-align: middle; font-size: 1rem; color: rgba(102, 102, 102, 1);}
.couponDetail .pdInfo .date > em{display: inline-block; font-size: 1.2rem; color: rgba(102, 102, 102, 1); vertical-align: middle; margin-left: 8px; }
.couponDetail .barcode{margin: 8px auto 0; max-width: 240px;}
.couponDetail .barcode > img{width: 100%;}

.state{width: 100%; text-align: center; margin-top: 8px;}
.state > i{display: inline-block; padding: 0 4px; margin: 0 4px; border-radius: 4px; font-size: 10px; line-height: 20px;}
.state > i.unUse{background: rgba(245, 239, 255, 1); color: rgba(119, 70, 221, 1);}
.state > i.use{background: rgba(240, 250, 232, 1); color: rgba(16, 168, 31, 1);}
.state > i.expire{background: rgba(255, 243, 239, 1); color: rgba(232, 18, 18, 1);}
.state > i.refund{background: #EFF7FF; color: rgba(18, 89, 232, 1);}






.listType_A{width: 100%;}
.listType_A > li{width: 100%; font-size: 0; padding-bottom: 16px; border-bottom: 1px solid rgba(233, 233, 233, 1); margin-top: 20px;}
.listType_A > li:first-child{margin-top: 0;}
.listType_A > li a{display: block;}
.listType_A > li .p_img{width: 96px; display: inline-block; vertical-align: middle;}
.listType_A > li .p_info{width: calc(100% - 96px); padding-left: 16px; display: inline-block; vertical-align: middle;}
.listType_A > li .p_info .brand{font-size: 1.2rem; line-height: 1.432rem; color: rgba(136, 136, 136, 1);}
.listType_A > li .p_info .p_name{font-size: 1.4rem; line-height: 1.671rem; font-weight: 700; color: rgba(0, 0, 0, 1); margin-top: 8px;}
.listType_A > li .p_info .p_price{margin-top: 8px; height: 20px; font-size: 0;}
.listType_A > li .p_info .p_price .sale{display: inline-block; line-height: 20px; font-size: 1rem; font-weight: 700; text-align: center; padding: 0 4px; color: #fff; background: rgba(156, 101, 255, 1); border-radius: 4px; vertical-align: middle;}
.listType_A > li .p_info .p_price > strong{font-size: 1.6rem; display: inline-block; line-height: 2rem; font-weight: 700; color: rgba(119, 70, 221, 1); margin-left: 8px; vertical-align: middle;}
.listType_A > li .p_info .p_price > strong > span{font-size: 1.6rem; vertical-align: middle; font-weight: 700;}
.listType_A > li .p_info .p_price > em{display: inline-block; margin-left: 8px; font-size: 1.2rem; color: rgba(136, 136, 136, 1); vertical-align: middle; text-decoration: line-through;}

.list_section{width: 100%; padding: 3rem 2rem 1rem;}
.list_section .list_area{width: 100%;}
.list_section .list_area > h4{text-align: center; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.06rem; line-height: 2.7rem;}
.list_inner{width: 100%; padding: 0 20px;}
.list_type_01{width: 100%; background: #fff;  }
.list_type_01 > ul{width: 100%; font-size: 0;}
.list_type_01 > ul > li{display: inline-block; width: 50%; height: auto !important;  vertical-align: top; padding: 30px 16px 30px 0; border-top: 1px solid rgba(233, 233, 233, 1); }
.list_type_01 > ul > li:first-child, .list_type_01 > ul > li:nth-child(2){border-top: 0;}
.list_type_01 > ul > li:nth-child(2n){padding: 30px 0 30px 16px;}
.list_type_01 > ul > li .prd_img {width: 100%; position: relative; overflow: hidden; border-radius: 0.8rem;}
.list_type_01 > ul > li .prd_img .img_prd{width: 100%;}
.list_type_01 > ul > li .prd_img .img_prd > img{width: 100%;}
.list_type_01 > ul > li .prd_img .img_cover{width: 100%; position: absolute; left: 0; top: 0; height: 100%; background: rgba(0,0,0,0.08); display: none;}
.list_type_01 > ul > li .prd_img .img_cover > p{display: none;}
.list_type_01 > ul > li.soldout .prd_img .img_cover{background: rgba(255, 255, 255, 0.75); display: table; z-index: 15;}
.list_type_01 > ul > li.soldout .prd_img .img_cover > p{display: table-cell; font-size: 0; color: #fff; vertical-align: middle; text-align: center; background: url(../images/soldout.png) center center no-repeat; background-size: 43px; height: 38px;}
.list_type_01 > ul > li.soldout .prd_info{opacity: 0.25;}
.list_type_01 > ul > li.paymentComp .prd_img .img_cover{background: rgba(0, 0, 0, 0.7); display: table;}
.list_type_01 > ul > li.paymentComp .prd_img .img_cover > p{display: table-cell; font-size: 1.6rem; color: #fff; vertical-align: middle; text-align: center;}


.list_type_01 > ul > li .prd_info{width: 100% ; padding-top: 16px; text-align: left;}
.list_type_01 > ul > li .prd_info .brand_name{width: 100%; font-size: 1.2rem; line-height: 1.6rem; color: rgba(136, 136, 136, 1); font-weight: 500;}
.list_type_01 > ul > li .prd_info .prd_name{width: 100%; word-break: break-all; margin-top: 4px; font-size: 1.4rem; color: rgba(32, 32, 32, 1); letter-spacing: -0.06rem; height: auto; padding-top: 0; margin-bottom: 0; text-overflow: ellipsis !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-height: unset !important; -webkit-box-orient: vertical !important; white-space: normal; overflow: hidden; line-height: 1.6rem; font-weight: 700;}
.list_type_01 > ul > li .prd_info .prd_name > span{position: absolute; display: inline-block; top: 0; left: 0; padding: 0; border: 0; overflow: hidden; width: 0; height: 0; line-height: 0;}
.list_type_01 > ul > li .prd_info .price{padding-top: 8px; width: 100%; font-size: 1.6rem;}
.list_type_01 > ul > li .prd_info em.dc{height: 20px; padding: 0 4px; color: #fff; background: rgba(119, 70, 221, 1); font-size: 1rem; font-weight: 700; border-radius: 4px; display: inline-block; line-height: 20px; margin-top: 8px;}
.list_type_01 > ul > li .prd_info .price > p{vertical-align: middle; font-size: 1.6rem; font-weight: 700; line-height: 1.9rem; color: rgba(119, 70, 221, 1); display: inline-block; width: auto;}
.list_type_01 > ul > li .prd_info .price > em{display: inline-block; font-size: 1.2rem; font-weight: 400; color: rgba(136, 136, 136, 1); vertical-align: bottom; line-height: 1.9rem; margin-left: 8px; text-decoration: line-through;}


.list_type_01 > ul > li .prd_img .tag_ar{font-size: 0; position: absolute; width: 38px;}
.list_type_01 > ul > li .prd_img .tag_ar > i{display: inline-block; width: 100%; height: 18px; line-height: 18px; border-radius: 9px; text-align: center; color: #fff; font-size: 10px; font-weight: 700; margin-bottom: 4px;}
.list_type_01 > ul > li .prd_img .tag_ar > i.best{ background: rgba(255, 64, 121, 1);}
.list_type_01 > ul > li .prd_img .tag_ar > i.new{background: rgba(255, 189, 60, 1);}


.product_detail{padding-top: 2rem;}
.product_detail .product_img{width: 100%; padding: 0 2rem; text-align: center; position: relative;}
.product_detail .product_img .tag_ar{font-size: 0; position: absolute; width: 50px;}
.product_detail .product_img .tag_ar > i{display: inline-block; width: 100%; height: 24px; line-height: 24px; border-radius: 12px; text-align: center; color: #fff; font-size: 12px; font-weight: 700; margin-bottom: 4px;}
.product_detail .product_img .tag_ar > i.best{ background: rgba(255, 64, 121, 1);}
.product_detail .product_img .tag_ar > i.new{background: rgba(255, 189, 60, 1);}

.product_detail .product_img > img{width: 100%;}
.product_info{width: 100%; padding: 25px 20px 0;}
.product_info .tag_ar{padding: 1.2rem 0; font-size: 0;}
.product_info .tag_ar > i{display: inline-block; width: auto; height: 2rem; padding: 0 0.8rem; line-height: 2rem; font-size: 1.1rem; font-weight: 500; color: #fff; border-radius: 0.4rem; margin-right: 0.2rem;}
.product_info .tag_ar > i.best{ background: #00a175;}
.product_info .tag_ar > i.new{background: #00a1cf;}
.product_info .tag_ar > i.pink{color: #ff4582;}
.product_info .tag_ar > i.cy{color: #3bb0c5;}
.product_info .brand_name{font-size: 1.6rem; color: rgba(136, 136, 136, 1); line-height: 2.4rem; margin-top: 4px;}
.product_info .prd_name{width: 100%; word-break: break-all; margin-top: 0.1rem; font-size: 2rem;  color: rgba(0, 0, 0, 1); height: auto; padding-top: 0; margin-bottom: 0; text-overflow: ellipsis !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; line-height: unset !important; -webkit-box-orient: vertical !important; white-space: normal; overflow: hidden; font-weight: 700; }
.product_info .price{width: 100%; padding: 27px 0 16px;}
.product_info .price > li{width: 100%; display: flex; justify-content: space-between; align-items: center;}
.product_info .price > li > strong > em{background: rgba(248, 248, 248, 1); display: inline-block; padding: 0 4px; border-radius: 4px; height: 20px; font-size: 10px; color: rgba(102, 102, 102, 1); line-height: 20px;}
.product_info .price > li > span{text-align: right; font-size: 16px; font-weight: 700; color: rgba(17, 17, 17, 1);  }
.product_info .price > li.sPrice{margin-top: 8px;}
.product_info .price > li.sPrice > span{color: rgba(136, 136, 136, 1); }
.product_info .price > li.sumPrice{margin-top: 21px;}
.product_info .price > li.sumPrice > strong{font-size: 1.4rem; font-weight: 700; color: rgba(119, 70, 221, 1);}
.product_info .price > li.sumPrice > span{font-size: 1.8rem; font-weight: 900; color: rgba(119, 70, 221, 1);}
.detail_info{padding: 0; border-top: 8px solid rgba(248, 248, 248, 1);}
.detail_info > h3{font-size: 1.6rem; line-height: 2.4rem; color: rgba(51, 51, 51, 1); font-weight: 700; padding: 16px;}
.detail_info > h4{font-size: 1.6rem; line-height: 2.4rem; color: rgba(51, 51, 51, 1); font-weight: 700; background: url(../images/expand_more.png) calc(100% - 16px) center  no-repeat; background-size: 14px; padding: 16px;}
.detail_info > h4.active{background: url(../images/expand_close.png) calc(100% - 16px) center  no-repeat; background-size: 14px;}
.detail_text {width: 100%; padding: 20px 30px; display: none; border-top: 1px solid rgba(238, 238, 238, 1);}
.detail_text > div {width: 100%; margin-top: 1.6rem;}
.detail_text  > div:first-child{margin-top: 0;}
.detail_text  > div > h3{ font-size: 1.2rem;  font-weight: 700; color: rgba(96, 96, 96, 1); padding-bottom: 0.5rem;}
.detail_text  > div > p{margin-top: 0; font-size: 1.2rem; color: rgba(96, 96, 96, 1); font-weight: 400;}

.buyInfo{border-top: 1px solid rgba(238, 238, 238, 1); padding: 17px 16px 21px;}
.buyInfo > li{display: flex; width: 100%; justify-content: space-between; padding: 17px 0;}
.buyInfo > li > strong{width: 80px; font-size: 1.4rem; color: rgba(96, 96, 96, 1); font-weight: 400;}
.buyInfo > li .rCont{ text-align: right;}
.buyInfo > li .rCont > p{display: inline-block; vertical-align: middle; width: auto;}
.buyInfo > li .rCont .num_count > input{width: 47px; height: 22px; font-size: 1.4rem; color: rgba(32, 32, 32, 1); text-align: center; font-weight: 700; border: 0;}
.buyInfo > li .rCont .num_count > button{width: 22px; height: 22px; vertical-align: middle;}
.buyInfo > li .rCont .num_count .min{background: url(../images/icon_min.png) no-repeat; background-size: 22px;}
.buyInfo > li .rCont .num_count .plus{background: url(../images/icon_plus.png) no-repeat; background-size: 22px;}
.buyInfo > li .rCont > span{display: block; text-align: right; margin-top: 12px; font-size: 1.4rem; color: rgba(136, 136, 136, 1);}
.buyInfo > li:last-child{padding-bottom: 0;}

.radio_wrap{font-size: 0; margin-left: 2rem;}
.radio_wrap label {color: rgba(32, 32, 32, 1); padding-left: 8px; font-size: 1.4rem;}
.radio_wrap .radio {display: inline-block; position: relative; width: 2.2rem; height: 2.2rem; border: 0.1rem solid #cfcfcf; background-color: #fff; border-radius: 50%; vertical-align: middle; box-sizing: border-box; top: 0;}
.radio_wrap .radio input[type='radio'] {width: 2.2rem; height: 2.2rem}
.radio_wrap .radio input[type='radio']:checked + i {width: 2.2rem; height: 2.2rem; position: absolute; top: -0.1rem; left: -0.1rem; background: none;}
.radio_wrap .radio input[type='radio']:checked + i:after { display: block; content: ""; width: 1.2rem; height: 1.2rem; background-color: rgba(156, 101, 255, 1); border-radius: 100%; position: absolute; top: 0.5rem; left: 0.5rem;}

.present_ar .addPhone{padding: 0 16px;}
.present_ar .addPhone .title{width: 100%; padding: 14px 0 0; display: flex; justify-content: space-between; align-items: center;}
.present_ar .addPhone .title > span > button{padding: 0 12px; height: 28px; border: 1px solid rgba(216, 216, 216, 1); border-radius: 6px; font-size: 1.4rem; color: rgba(99, 99, 99, 1); background: #fff;}
.present_ar .addPhone > ul{width: 100%; padding: 14px 4px 10px;}
.present_ar .addPhone > ul > li{width: 100%; position: relative; font-size: 0; text-align: right; margin-top: 16px;}
.present_ar .addPhone > ul > li:first-child{margin-top: 0;}
.present_ar .addPhone > ul > li > button{width: 24px; height: 24px; padding: 0; vertical-align: middle; background: transparent;}
.present_ar .addPhone > ul > li .input_box{width: calc(100% - 76px); display: inline-table; vertical-align: middle; padding-right: 8px;}
.present_ar .addPhone > ul > li .input_box > span{display: table-cell; width: calc(64%); vertical-align: bottom;}
.present_ar .addPhone > ul > li .input_box > span:first-child{width: 88px; padding-right: 4px;}
.present_ar .addPhone > ul > li .input_box > span > input{border: 0; width: 100%; font-size: 1.4rem; font-weight: 400; color: rgba(0, 0, 0, 1); border: 1px solid rgba(216, 216, 216, 1); border-radius: 6px; height: 44px; padding: 0 16px; text-align: left;}

.present_ar .massgeAr{padding: 30px 16px 16px;}
.present_ar .massgeAr > h4{font-size: 14px; color: rgba(96, 96, 96, 1); line-height: 1.7rem;}
.present_ar .massgeAr .txtBox{width: calc(100% - 8px); margin: 20px auto 0; border: 1px solid rgba(233, 233, 233, 1); padding: 24px; border-radius: 8px;}
.present_ar .massgeAr .txtBox > textarea{height: 48px; border: 0; outline: 0; padding: 0; font-size: 1.4rem; line-height: 1.6rem;}
.present_ar .massgeAr .txtBox > p{text-align: right; margin-top: 8px; font-size: 1rem; line-height: 1.4rem; color: rgba(99, 99, 99, 1);}

.paymemtAr{padding: 34px 20px 30px; background: rgba(243, 243, 243, 1);}
.paymemtAr .title{display: flex; width: 100%; justify-content: space-between; align-items: center; margin-bottom: 32px;}
.paymemtAr .title > span{font-size: 20px; font-weight: 900; line-height: 2.4rem; color: rgba(119, 70, 221, 1);}
.paymemtAr .title > span:first-child{font-size: 1.6rem; font-weight: 700; color: rgba(51, 51, 51, 1); }
.paymemtAr .checkAr{margin-top: 12px; background: #fff; border-radius: 16px; background: rgba(255, 255, 255, 1); padding: 20px;}

.checkBox {width: 100%; position: relative; display: inline-block;}
.checkBox input[type="checkbox"] + label {display: inline-block; min-height: 23px; background: url("../images/icon_checkL_off.png") no-repeat; background-size: 23px auto; background-position:left center; padding: 3px 0 3px 45px; font-size: 1.4rem; line-height: 1.7rem; color: #4c5459; letter-spacing: -0.04rem; color: rgba(0, 0, 0, 1);}
.checkBox input[type="checkbox"]:disabled + label {background: #eeeeee; border-radius: 0.5rem;}
.checkBox input[type="checkbox"] + label > em{color: rgb(102, 102, 102);}
.checkBox input[type="checkbox"]:checked + label{background: url("../images/icon_checkL_on.png") no-repeat; background-size: 23px auto; background-position:left center; padding: 3px 0 3px 45px; font-size: 1.4rem; line-height: 1.7rem; color: #4c5459; letter-spacing: -0.04rem; color: rgba(0, 0, 0, 1); }

.paymemtAr .checkAr.inTxt{position: relative; font-size: 0;}
.paymemtAr .checkAr.inTxt .btn_acd{width: 23px; height: 23px;  background: url(../images/expand_more.png) center center  no-repeat; background-size: 14px; vertical-align: middle;}
.paymemtAr .checkAr.inTxt .btn_acd.active{ background: url(../images/expand_close.png) center center no-repeat; background-size: 14px; }
.paymemtAr .checkAr.inTxt .checkBox{display: inline-block; vertical-align: middle; width: calc(100% - 23px); padding-right: 10px; vertical-align: middle;}
.paymemtAr .checkAr.inTxt .inTxtAr{font-size: 1rem; color: rgba(136, 136, 136, 1); line-height: 1.2rem; padding: 16px 9px 0 45px; display: none;}

.btnBottom{margin-top: 30px;}
.btnBottom > p{color: rgba(255, 64, 121, 1) ; font-size: 1.2rem; line-height: 1.4rem; text-align: center; padding-bottom: 10px;}
.btnBottom > button{width: 100%; height: 50px; border-radius: 14px; background: rgba(156, 101, 255, 1); color: #fff; font-size: 1.4rem; font-weight: 700;}

.productList .list_top{width: 100%; display: table; padding: 18px 20px;}
.productList .list_top > span{width: 50%; text-align: right; vertical-align: middle; display: table-cell; font-size: 2rem; font-weight: 700; line-height: 2.4rem;}
.productList .list_top > span > i{vertical-align: baseline; color: rgba(119, 70, 221, 1); line-height: 2.4rem; font-size: 1.6rem; }
.productList .list_top > span:first-child{text-align: left;}
.productList .list_top > span > em{line-height: 24px; font-size: 16px;}
.productList .list_top > span .nice-select{border: none; height: 24px; line-height: 24px; font-size: 1.6rem;}
.productList .list_top > span .nice-select .option{text-align: right; font-size: 1.6rem;}
.myCoupon{width: 100%; padding: 2px 0;}
.myCoupon .list_top{width: 100%; display: table; padding: 18px 20px;}
.myCoupon .list_top > span{width: 50%; text-align: right; vertical-align: middle; display: table-cell; font-size: 2rem; font-weight: 700; line-height: 2.4rem;}
.myCoupon .list_top > span > i{vertical-align: baseline; color: rgba(119, 70, 221, 1); line-height: 2.4rem; font-size: 1.6rem; }
.myCoupon .list_top > span:first-child{text-align: left;}
.myCoupon .list_top > span .nice-select{border: none; height: 24px; line-height: 24px; font-size: 1.6rem;}
.myCoupon .list_top > span .nice-select .option{text-align: right; font-size: 1.6rem;}




footer{width: 100%; background: #FFF; border-top: 8px solid #F8F8F8;}
footer.pdb_btn{padding-bottom: 9.4rem;}
footer .foot-top{width: 100%; padding: 1.8rem 3.5rem 1.2rem;}
footer .foot-top > ul{width: 100%; display: flex; justify-content: space-between;}
footer .foot-top > ul > li{vertical-align: middle;}
footer .foot-top > ul > li > a.terms{font-size: 1.2rem; display: inline-block; line-height: 1; color: #4c5459; letter-spacing: -0.06rem; padding-right: 0.9rem;}
footer .foot-top > ul > li > a.svCancel{font-size: 1.2rem; display: inline-block; line-height: 1; color: #4c5459; letter-spacing: -0.06rem; padding-left: 0.8rem; padding-right: 0.9rem;}
footer .foot-top > ul > li > a.privacy{font-size: 1.2rem; display: inline-block; line-height: 1; color: #4c5459; letter-spacing: -0.06rem; padding-left: 0.8rem; padding-right: 0.9rem; font-weight: 600;}
footer .foot-top > ul > li > a.btn_cs_center{font-size: 1.2rem; display: inline-block; line-height: 1; color: #4c5459; letter-spacing: -0.06rem; padding-left: 0.8rem; padding-right: 0.9rem;}
footer .foot-top > ul > li > a.btn_customer_info{font-size: 1.2rem; display: inline-block; line-height: 1; color: #4c5459; letter-spacing: -0.06rem; padding-left: 0.8rem;}
footer .foot-top > ul > li > a{font-size: 1.2rem; color: #4c5459; line-height: 1;}
footer .foot-top > ul > li > a > span{transform: rotate(0); display: inline-block; margin-left: 0.6rem; background: url(../images/arrow_l.png) right center no-repeat; width: 1rem; height: 1.2rem; background-size: 1rem;  vertical-align: middle;}
footer .foot-top > ul > li > a.on > span{transform: rotate(180deg);}

footer .foot_info{ padding: 1.2rem 3rem 1.2rem; text-align: left; display: none;}
footer .foot_info .compm{padding-top: 0;}
footer .foot_info .compm > p{font-size: 1rem; color: #848a92; line-height: 1.5rem; font-weight: 400; letter-spacing: -0.05rem;}
footer .cs_info{ padding: 1.2rem 3rem 1.2rem; text-align: left; display: none;}
footer .cs_info > p{font-size: 1rem; color: #848a92; line-height: 1.5rem; letter-spacing: -0.05rem; font-weight: 400;}
footer .cs_info > p.tit{color: #333a40;}
footer .cs_info > p > i{color: #c4c4c4; display: inline-block; padding:0 0.4rem;}
footer .cs_info > button{margin-top: 11px; width: 100px; height: 24px; border: 1px solid rgba(216, 216, 216, 1); border-radius: 4px; background: #fff; font-size: 1rem; color: rgba(99, 99, 99, 1);}
footer .copy_right{padding: 1.2rem 2rem 2rem; color: #c3cbd3; font-size: 1.1rem; text-align: center;}


.none_data{width: 100%; min-height: 290px; display: table; background: rgba(243, 243, 243, 1);}
.none_data.wtBg{background: #fff;}
.none_data > div{display: table-cell; width: 100%; vertical-align: middle; text-align: center;}
.none_data > div > span{display: inline-block; width: 30px; height: 30px; border-radius: 15px; background: rgba(119, 70, 221, 1) url(../images/icon_combined.png) center center no-repeat; background-size: 3.6px; text-align: center;}
.none_data > div > span > img{width: 3.6px;}
.none_data > div > p{padding-top: 10px; font-size: 1.4rem; letter-spacing: -0.05rem; text-align: center; color: rgba(0, 0, 0, 1);}


.chack_inner{ width: 100%;}
.chack_inner > h3{font-size: 1.3rem; font-weight: 400; color: #848a92; line-height: 1.9rem; padding-bottom: 1.6rem;}
.chack_inner .choice_btn{display: none;}
.chack_inner.choice{font-size: 0;}
.chack_inner.choice .check_box_all{display: none;}
.chack_inner.choice .choice_btn{display: block;}
.chack_inner.choice .choice_btn .radio_box{display: inline-block; width: calc(50% - 0.4rem); margin-left: 0.8rem; position: relative;}
.chack_inner.choice .choice_btn .radio_box:first-child{margin-left: 0;}
.chack_inner.choice .choice_btn .radio_box > input[type="radio"] + label {display: block; width: 100%; height: 5rem; border: 1px solid #e4eaf2; background: #e4eaf2; color: #333a40; border-radius: 0.8rem; text-align: center; line-height: 4.8rem; font-size: 1.6rem}
.chack_inner.choice .choice_btn .radio_box > input[type="radio"]:checked + label {background: #1290ef; color: #fff; }
.chack_inner.choice .choice_btn .radio_box > input[type="radio"] {position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 10; opacity: 0; width: 100%; height: 100%; letter-spacing: 0; border: none; background: none; vertical-align: middle; -webkit-appearance: none; -ms-appearance: none;}

.popWrap{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; text-align: center; display: flex; align-items: center; z-index: 1000;}
.popWrap .pop_container{background: #fff;}
.popWrap .pop_container.full{width: 100%; height: 100vh;}
.pop_header{position: relative; width: 100%; height: 54px; display: flex; align-items: center; text-align: center; justify-content: center; border-bottom: 1px solid rgba(238, 238, 238, 1) ;}
.pop_header > h2{font-size: 1.8rem; font-weight: 500; color: rgba(0, 0, 0, 1);}
.pop_header > button{width: 24px; height: 24px; background: url(../images/close.png) no-repeat; background-size: 100%; position: absolute; right: 13px;}
.pop_content .contactAr{padding: 20px 20px 0; width: 100%;}
.pop_content .contactAr .search_box{position: relative; width: 100%;}
.pop_content .contactAr .search_box > input{width: 100%; height: 44px; border-radius: 6px; border: 1px solid rgba(216, 216, 216, 1); padding: 0 60px 0 16px; font-size: 1.4rem;}
.pop_content .contactAr .search_box .btn_cl{width: 24px; height: 24px; background: url(../images/cancel_cir.png) no-repeat;  background-size: 100%; position: absolute ; right: 36px; top: 10px;}
.pop_content .contactAr .search_box .btn_sh{width: 24px; height: 24px; background: url(../images/btn_sh.png) center center no-repeat;  background-size: 20px; position: absolute ; right: 10px; top: 10px;}
.pop_content .contactAr .terms_top{padding-top: 0;}
.pop_content .contactAr .terms_content{padding: 0; text-align: left;}
.pop_content .contactAr .terms_content .terms_text{height: calc(100vh - 215px);}
.pop_content .contactAr .terms_top .nice-select{border: none;}
.btnbox{padding: 25px 20px 20px; font-size: 0; background: linear-gradient(to bottom, transparent 0%, white 10px, white 100%);}
.btnbox.fixed{bottom: 0; z-index: 2; position: fixed; width: 100%; left: 0;}

.pop_content:has(.agreeWrap.btmAgree) {height: calc(100vh - 54px); overflow-y: auto;}
.pop_content:has(.agreeWrap.btmAgree) .contactAr {height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.pop_content:has(.agreeWrap.btmAgree) .contactAr .agreeWrap {overflow-y: inherit;}
.pop_content:has(.agreeWrap.btmAgree) .btnbox {padding:50px 0 20px;}
/* 20250122 퍼블리싱 수정 */

.btnbox .agreeBox{width: 100%; text-align: left; }
.btnbox > button{font-size: 14px; font-weight: 700; border-radius: 14px; letter-spacing: -0.5px; text-align: center; height: 52px; color: #000; color: #fff;}
.btnbox > button.helf{width: calc(50% - 5px); margin-left: 10px; background: rgba(156, 101, 255, 1);}
.btnbox > button.helf:first-child{margin-left: 0; background: rgba(199, 199, 199, 1); }
.btnbox > button.unLine{padding: 0; color: rgba(136, 136, 136, 1); text-decoration: underline; background: none;}
.btnbox > button.full{width: 100%; background: rgba(156, 101, 255, 1);}
.sh_list{margin: 30px 0 0;}
.sh_list > ul{padding: 0px 20px; max-height: calc(100vh - 240px); overflow-y: auto;}
.sh_list > ul > li{width: 100%; margin-top: 24px;}
.sh_list > ul > li:first-child{margin-top: 0;}
.sh_list .radio_wrap{margin-left: 0;}
.sh_list label{ vertical-align: middle; width: calc(100% - 22px); display: inline-table; text-align: left;}
.sh_list label > span{display: table-cell; text-align: right;}
.sh_list label > span:first-child{text-align: left;}


.event_product{width: 100%; padding: 0 20px 30px;}
.event_product .list_top{width: 100%; display: table; padding: 18px 0px;}
.event_product .list_top > span{width: 50%; text-align: right; vertical-align: middle; display: table-cell; font-size: 20px; font-weight: 700; line-height: 24px;}
.event_product .list_top > span > i{vertical-align: baseline; color: rgba(119, 70, 221, 1); line-height: 24px; font-size: 16px; }
.event_product .list_top > span:first-child{text-align: left;}
.event_product .list_top > span > em{line-height: 24px; font-size: 16px;}
.event_product .list_top > span .nice-select{border: none; height: 24px; line-height: 24px; font-size: 1.6rem;}
.event_product .list_top > span .nice-select .option{text-align: right; font-size: 1.6rem;}


.terms_container{width: 100%;}
.terms_container > ul{width: 100%; font-size: 0;}
.terms_container > ul > li{width: 50%; display: inline-table; height: 4.9rem; box-sizing: content-box; border-bottom: 0.1rem solid #e4eaf2; vertical-align: bottom;}
.terms_container > ul > li.active{border-bottom: 0.2rem solid rgba(119, 70, 221, 1); height: 4.8rem;}
.terms_container > ul > li > span{display: table-cell; vertical-align: middle; font-size: 1.6rem; width: 100%; text-align: center; letter-spacing: -0.06rem; color: #333a40; }
.terms_container > ul > li.active > span{color: rgba(17, 17, 17, 1);}
.terms_content{width: 100%; padding: 0 1.6rem;}
.terms_top {width: 100%; padding: 2rem 0; text-align: right;}
.terms_top .nice-select{border: none; padding-left: 0;}
.terms_top .nice-select > span{width: 100%; text-align: right; display: block;}
.terms_top .nice-select .option{text-align: right;}

.terms_content .terms_text{width: 100%;  padding: 0; height: calc(100vh - 185px); overflow-y: auto;}
.terms_content .terms_text > h5{padding-top: 2.2rem; font-size: 1.3rem; color: #333a40; font-weight: 400; letter-spacing: -0.06rem;}
.terms_content .terms_text > h5:first-child{padding-top: 0;}
.terms_content .terms_text > h4{font-size: 1.3rem; color: #333a40; font-weight: 400; letter-spacing: -0.06rem; padding-top: 0.8rem;}
.terms_content .terms_text > p{font-size: 1.3rem; color: #848a92; padding-top: 0.8rem; line-height: 2.2rem; letter-spacing: -0.06rem;}
.terms_content .terms_text > p > img{width: 100%;}

.terms_content > button{width:100%; margin: 1.1rem 0 1.6rem; background: #1490ef; border-radius: 0.6rem; height: 5.6rem; font-size: 1.5rem; letter-spacing: -0.06rem; color: #fff;}

table.terms{border-bottom: 1px solid #dedede; border-right: 1px solid #dedede; width: 100%;}
table.terms th{padding: 1rem; text-align: center; background: #efefef; font-size: 1.4rem; border-top: 1px solid #dedede; border-left: 1px solid #dedede; color: #848a92; vertical-align: middle;}
table.terms td{padding: 1rem; text-align: center; background: #fff; font-size: 1.4rem; border-top: 1px solid #dedede; border-left: 1px solid #dedede; color: #848a92; vertical-align: middle;}
.etcAr {text-align: center;}
.etcAr .tit{text-align: center; margin-top: 86px;}
.etcAr .tit > i{width: 50px; height: 50px; display: inline-block; border-radius: 25px; background: rgba(156, 101, 255, 1) url(../images/icon_combined.png) center center no-repeat; }
.etcAr .tit > span{width: 50px; display: inline-block;}
.etcAr .tit > span > img{width: 100%;}
.etcAr .tit > strong{display: block; margin-top: 20px; font-size: 1.8rem; font-weight: 700; line-height: 2.1rem;}
.etcAr .tit .logoBox{display: inline-block; width: 100px;}
.etcAr .tit .logoBox > img{width: 100%;}
.etcAr .subTxt{margin-top: 38px; font-size: 1.4rem; color: rgba(131, 131, 131, 1); text-align: center; }
.etcAr .subTxt > a{font-weight: 700; color: rgba(119, 70, 221, 1);}
.etcAr .listBr{display: inline-block; width: auto; margin-top: 40px;}
.etcAr .listBr > ul{width: 100%; }
.etcAr .listBr > ul > li{margin-top: 8px; display: table;}
.etcAr .listBr > ul > li > span {display: table-cell; padding-left: 16px; font-size: 1.2rem; line-height: 1.4rem; vertical-align: middle; text-align: left;}
.etcAr .listBr > ul > li > span:first-child{padding-left: 0; }
.etcAr .listBr > ul > li > span > i{display: inline-block;  padding: 0 4px; border-radius: 4px; font-size: 1rem; line-height: 2.2rem; background: rgba(245, 239, 255, 1); color: rgba(119, 70, 221, 1);}
.etcAr ~ .btnbox .agreeBox {padding: 0 1.2rem 2rem 2rem !important;}
.eventTop{padding: 18px 20px;}
.eventTop > h2{font-size: 1.8rem; font-weight: 700; color: #000; line-height: 2.4rem;}
.eventTop > p{font-size: 1.2rem; line-height: 2.4rem; margin-top: 4px; color: rgba(136, 136, 136, 1);}
.eventTop > p > i{display: inline-block;  padding: 0 4px; border-radius: 4px; font-size: 1rem; line-height: 2.2rem; background: rgba(245, 239, 255, 1); color: rgba(119, 70, 221, 1);}

/*
24.12.30 수정 z-index 추가
역할 : 홈으로 버튼에 사용 */
.fixBtm{position: fixed; bottom: 0; text-align: center; background: #fff; z-index: 999;}

#btm_pop {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;

	transition: 1s;

	/* 서서히 나타나는 효과 */
	visibility: hidden;
	opacity: 1;
}

#btm_pop.active {
	/* 서서히 나타나는 효과 */
	visibility: visible;
	opacity: 1;
}
#btm_pop .btm_inner{
	box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.15);
	background-color: #fff;
	height: 168px;
	/* 아래에서 위로 나타나는 효과, max-height과 동일하게 작성 */
	position: relative;
	bottom: -168px;

	transition: 1s;
}
#btm_pop.active .btm_inner {
	/* 아래에서 위로 나타나는 효과, max-height과 동일하게 작성 */
	bottom: 0;
}
#btm_pop .btm_contnet{padding: 20px; font-size: 0;}
#btm_pop .btm_contnet > button{width: calc(50% - 4px); height: 74px; border-radius: 14px; display: inline-block; vertical-align: middle;}
#btm_pop .btm_contnet > button.kko_share{background: rgba(246, 226, 75, 1); text-align: center;}
#btm_pop .btm_contnet > button.kko_share > img{width: 90px;}
#btm_pop .btm_contnet > button.sms_share{margin-left: 8px; background: rgba(156, 101, 255, 1);}
#btm_pop .btm_contnet > button.sms_share > p{font-size: 1.8rem; font-weight: 700; text-align: center; line-height: 2.148rem; color: #fff;}
#btm_pop .btm_contnet > button.sms_share > i{ display: block;font-size: 1.2rem; font-weight: 400; text-align: center; line-height: 1.432rem; color: #fff;}


/* 탑버튼 */
.btn_top{width: 4rem; height: 4rem; background: url(../images/top.png) no-repeat; position: fixed; right: 2rem; bottom: 10.4rem; background-size: 100%; padding: 0; z-index: 100; opacity: 0; transition: opacity 0.5s ease-in-out;}
.btn_top.on{opacity: 1;}

/*모달팝업*/
.modalWrap{width: 100%; height: 100vh; padding: 0 40px; left: 0; top: 0; position: fixed; display: none; z-index: 100; background: rgba(0, 0, 0, 0.7); align-items: center;}
.modalWrap.active{display: flex;}
.modalWrap .modalContainer{width: 100%; background: #fff; border-radius: 14px; padding: 32px 20px 20px;}
.modalContent{width: 100%; min-height: 32px; max-height: 250px; overflow-y: auto; font-size: 1.4rem; color: #000; line-height: 2.2rem;}

/* 20250109 애니메이션 팝업 */
.drawerPopup {padding: 0; align-items: end;}
.drawerPopup .modalContainer {border-radius: 20px; border-end-end-radius: 0; border-end-start-radius: 0; padding: 0; position: absolute; left: 0;bottom: -100%; animation: slideDown 0.7s ease forwards;  opacity: 0;}

.drawerPopup .modalTop {display: flex; justify-content: space-between; align-items: center; padding: 15px 13px 15px 20px; border-bottom: 1px solid #eeeeee;}
.drawerPopup .modalTop p {font-size: 14px; font-weight: 500; letter-spacing: -0.5px;}

.drawerPopup .modalTop button {width: 24px; height: 24px; background: url(../images/close.png) center no-repeat; background-size: 24px; padding: 0;}
.drawerPopup .modalContent {padding: 32px 20px calc(env(safe-area-inset-bottom) + 30px); max-height: initial;}
.drawerPopup .modalContent .title {font-size: 18px; line-height: 20px; letter-spacing: -0.5px; text-align: center; margin-bottom: 24px;}
.drawerPopup .modalContent .txtBox {max-height: 200px; overflow-y: auto;}
.drawerPopup .modalContent .txtBox p {font-size: 14px; line-height: 18px; margin-top: 16px; color: #606060;}
.drawerPopup .modalContent .txtBox p:first-child {margin-top: 0;}
.drawerPopup .modalContent .imgBox {text-align: center;}

/* 20250109 퍼블리싱 추가 및 수정 */

.btnArea{padding-top: 32px; font-size: 0;}
.btnArea > button{width: calc(50% - 5px); height: 52px; display: inline-block; vertical-align: middle; background: rgba(156, 101, 255, 1); font-size: 14px; color: #fff; border-radius: 14px; margin-left: 10px;}
.btnArea > button:first-child{background: rgba(199, 199, 199, 1); margin-left: 0;}
.btnArea > button.full{width: 100%; background: rgba(156, 101, 255, 1);}

.txtList{width: 100%;}
.txtList > li{padding-left: 1.5rem; text-indent: -1.5rem; margin-top: 5px;}
.txtList > li:first-child{margin-top: 0;}

.samp{padding: 20px;}
.samp > button{height: 52px; display: inline-block; vertical-align: middle; background: rgba(156, 101, 255, 1); font-size: 14px; color: #fff; border-radius: 14px; margin-left: 10px; width: 100%; margin: 5px 0;}

.agreeWrap{height: calc(100vh - 170px); overflow-y: auto; padding-bottom: 20px; }
.agreeWrap.btmAgree{height: auto;}
/* 20250122 퍼블리싱 수정 */
.agreeWrap .tit{text-align: center; padding-top: 27px;}
.agreeWrap .tit > i{width: 50px; height: 50px; display: inline-block; border-radius: 25px; background: rgba(156, 101, 255, 1) url(../images/icon_agree.png) center center no-repeat; background-size: 25px; }
.agreeWrap .tit > strong{display: block; margin-top: 20px; font-size: 1.6rem; font-weight: 700; line-height: 1.9rem;}
.agreeWrap .subTxt{margin-top: 16px; font-size: 1.4rem; color: rgba(131, 131, 131, 1); text-align: center; padding-bottom: 60px; }
.agreeWrap .subTxt > a{font-weight: 700; color: rgba(119, 70, 221, 1);}
.agreeListWrap{ text-align: left; width: 100%;}
.agreeListWrap > h5{font-size: 1.4rem; line-height: 1.7rem; font-weight: 700; color: rgba(0, 0, 0, 1);}
.agreeList{width: 100%; margin-top: 12px;}
.agreeList > li{width: 100%; margin-top: 12px; background: rgba(248, 248, 248, 1); border-radius: 14px; padding: 13px 20px 13px 20px; display: flex; align-items: center; min-height: 66px; position: relative;}
.agreeList > li:first-child{margin-top: 0;}
.agreeList > li > a{position: absolute; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; right: 15px; z-index: 2; }
.agreeList > li > a > img{width: 14px;}

.agreeBox {padding-bottom: 18px;}
.agreeBox .checkBox input[type="checkbox"] + label {display: inline-block; min-height: 23px; background: url("../images/icon_checkL_off.png") no-repeat; background-size: 23px auto; background-position:left center; padding: 3px 0 3px 37px; font-size: 1.2rem; line-height: 1.5rem; color: #4c5459; letter-spacing: -0.04rem; color: rgba(102, 102, 102, 1);}
.agreeBox .checkBox input[type="checkbox"]:disabled + label {background: #eeeeee; border-radius: 0.5rem;}
.agreeBox .checkBox input[type="checkbox"] + label > em{color: rgb(102, 102, 102);}
.agreeBox .checkBox input[type="checkbox"]:checked + label{background: url("../images/icon_checkL_on.png") no-repeat; background-size: 23px auto; background-position:left center; padding: 3px 0 3px 37px; font-size: 1.2rem; line-height: 1.5rem; color: #4c5459; letter-spacing: -0.04rem; color: rgba(102, 102, 102, 1); }
.btn_user{width: 44px !important;  height: 44px !important; border: 1px solid rgba(216, 216, 216, 1); border-radius: 6px; background: url(../images/btn_user.png) center center no-repeat !important; background-size: 24px !important; margin-right: 8px;}


.agreeBox:has(.checkBox.type2) {padding: 0 20px 20px;}
.agreeBox .checkBox.type2 input[type="checkbox"] + label  {color: #000; font-size: 14px; line-height: 16px; letter-spacing: -0.4px;}

.myCoupon .list_top > span > button{padding: 0 12px; background: rgba(247, 247, 248, 1); border-radius: 20px;}
.myCoupon .list_top > span > button > span{display: inline-block; padding-right: 20px; text-align: left; background: url(../images/icon_arrow_left.png) right center no-repeat; background-size: 1rem; font-size: 1.4rem; color: rgba(51, 51, 51, 1); font-weight: 700; vertical-align: middle; line-height: 36px;}


.notice_box {width: calc(100% - 40px); margin: 20px; box-sizing: border-box; padding: 32px 20px; border-radius: 1.6rem; background: #F3F3F3;}
.notice_box strong {font-size: 1.2rem; line-height: 1.6rem; margin-bottom: 1.6rem; display: block;}
.notice_box .list {display: flex; text-align: left; margin-top: 1.6rem; color: #606060; font-size: 1.2rem; line-height: 1.6rem;}
.notice_box .list span {color: #FF4079; font-weight: 700;}
.notice_box .list:first-child {margin-top: 0;}
.notice_box .list::before {display: flex; content: "·"; font-size: 1.2rem; width: 4px; padding-right: 8px;}


/* 팝업레이아웃 전용 모달팝업*/
.popupModalWrap{width: 100%; height: 100vh; padding: 0 40px; left: 0; top: 0; position: fixed; display: none; z-index: 9999; background: rgba(0, 0, 0, 0.7); align-items: center;}
.popupModalWrap.active{display: flex;}
.popupModalWrap .modalContainer{width: 100%; background: #fff; border-radius: 14px; padding: 32px 20px 20px;}

/* 25.01.07 브랜드 slide 속성 추가 */
.brandSwiper .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {bottom: 16px !important;}


/* 20250122 퍼블리싱 추가 */
.cancel_member {display: flex; flex-direction: column; justify-content: space-between;}
#container.cancel_member {min-height: 100vh;}
#container.cancel_member .agreeBox {padding-left: 0;}

/* 미디어쿼리 설정 24.12.30 추가 */
@media (max-width: 321px) {
	html {font-size: 8px;}
}

@media (min-width: 322px) and (max-width: 354px) {
	.cateSwiper > ul > li > p > span {
		font-size: 1rem;
	}
}

@media (min-width: 321px) and (max-width: 358px) {
	footer .foot-top > ul > li > a.terms {
		font-size: 1rem;
	}
	footer .foot-top > ul > li > a.privacy {
		font-size: 1rem;
	}
	footer .foot-top > ul > li > a.btn_cs_center {
		font-size: 1rem;
	}
	footer .foot-top > ul > li > a.btn_customer_info {
		font-size: 1rem;
	}
}