/* -------------------- */
/*  	  MEMBER        */
/* -------------------- */

/* 로그인 & 회원가입*/
.loginWrap{border:1px solid #ddd;padding: 60px 0;}
.loginArea, .JoinArea{position:relative;width: 360px;margin:0 auto;}
.loginArea .button, .JoinArea .button{ width:100%;}
.loginForm:before { content:''; display:block; margin-bottom:50px;width:100%; height:128px; background:url('../images/member/login.png') no-repeat 50% 0;}
.loginForm > ul{float:left;width: 67%; }
.loginForm > ul > li {overflow:hidden;margin-top:10px;}
.loginForm > ul > li:first-child {margin-top:0;}
.loginForm > ul > li input {padding:0 10px;width:100%;height:50px;vertical-align:middle;}
.loginForm > ul > li label {position:absolute;top:15px;left:10px;}
.loginForm .btnArea {float: right;width: 30%;display: table;}
.loginForm .btnArea .button.large {background-color: #1d56cc;border-color: #1d56cc;color:#fff;display: table-cell;vertical-align: middle;height: 110px;padding: 0;margin: 0;}
.loginForm .btnArea .button.large:hover {background-color: #0d40a9;border-color: #0d40a9;}
.loginForm .linkChk {overflow:hidden;line-height:20px;clear: both; }
.loginForm .linkChk .save {float:left;height:20px;}
.loginForm .linkChk .link {/* float:right; */text-align: center; margin-top: 35px;}
.loginForm .linkChk .link a {display:inline-block;color:#888;vertical-align:top;}
.loginForm .linkChk .link a:before{ content:''; display: inline-block; width:1px; height: 12px; background:rgba(0,0,0,0.2);margin:0 5px 0 5px;}
.loginForm .linkChk .link a:first-child:before {display:none;margin:0;padding:0;}

.JoinArea .loginForm .linkChk label { font-weight: 500;}
.JoinArea .loginForm .linkChk a { color: #9926c4;}
.JoinArea .loginForm .linkChk + .linkChk{margin-top:5px;}
.JoinArea .loginForm .btnArea {margin-top:25px;}

.FindArea{}
.FindArea .loginForm:before{ display:none;}
.FindArea .loginForm > ul,
.FindArea .loginForm .btnArea{width:100%;float:none;margin-bottom:10px;display: block;}
.FindArea .loginForm .btnArea .button.large{height:50px;}


.separator { clear:both; position: relative;margin: 20px 0;text-align: center;line-height: 16px;font-size: 12px;}
.separator:before {position: absolute;top: 50%;left: 0;background: rgba(0,0,0,.06);width: 100%;height: 1px;content: "";}
.separator span {display: inline-block;position: relative;background: #fff;padding: 0 16px;color: rgba(0,0,0,.54);}
.social-login { /*display: grid;grid-template-columns: repeat(2,1fr);grid-column-gap: 8px; grid-row-gap: 8px;*/ display: block; overflow: hidden;}
.social-login button {display: block;transition-property: border-color,background;transition-duration: .2s;border: 1px solid rgba(0,0,0,.15);border-radius: 0;background: #fff;padding-top: 12px;padding-bottom: 12px;height: 48px;line-height: 22px;color: rgba(0,0,0,.87);font-size: 15px;}
.social-login button:hover { background-color:#f2f2f2}
.social-login button i.icon {display: inline-block;margin-right: 5px;vertical-align: top; }
.social-login button:first-child {grid-column: 1/3;width: 100%;}
.social-login button.facebook {border-color: #304d8a;background: #304d8a;color: #fff;}
.social-login .facebook {margin-bottom: 5px;}
.social-login button i.icon.kakao {color: #3f2626;}
#kakaoLoginBtn,
#naverLoginBtn{width: 49%;float:left;}
#naverLoginBtn{ float:right;}

i.icon:before{content: "";display: inline-block;margin-top:0;width: 22px; height: 24px; background: url(../images/member/ico_sns.png) no-repeat 0 0;}
i.icon.facebook:before { background-position: 0 0}
i.icon.kakao:before {background-position: 0 -30px}
i.icon.naver:before {background-position: 0 -60px}
i.icon.google:before {background-position: 0 -90px}
i.icon.twitter:before {background-position: 0 -120px}

.loginForm .bottom-message {position: relative;margin-top:30px;}
.loginForm .bottom-message a {text-decoration: underline;color:#f39800; float: right; display: inline-block}

@media screen and (max-width : 614px ){
	.loginTit h2 {	font-size: 2em;}
	.JoinArea.joinStep01 { width:100%;}
	.loginWrap{border:0;padding: 0;}
	.loginForm:before{margin-bottom:20px;}
	.loginForm > ul,
	.loginForm .btnArea{width:100%;float:none;margin-bottom: 10px;}
	.loginForm .btnArea .button.large{height: auto;}
	.loginForm .linkChk .link{margin-top:10px;}
	.loginArea,.JoinArea {width: auto;}
	
}
@media screen and (max-width: 400px) {
	.loginArea,.JoinArea { width:100%;}
	
	.loginTit h2 {font-size:2em;}
	.loginForm > ul > li {margin-top:5px;}
	.loginForm .btnArea {margin: 10px 0 10px;}
	.loginForm > ul > li input {height:40px;}
}

/* 비밀번호 재확인 */
.signup_check.loginArea{ }
.signup_check .loginTit h2 {font-size:2em;}
.signup_check .loginTit p {margin:10px 0 30px;}
.signup_check .loginForm lable {}

/* messageSection */
.messageSection {overflow:hidden; border:4px solid #e4e4e4;  box-sizing:border-box; padding:40px; text-align:center; color:#666 }
.messageSection p {text-align:center;}
.messageSection p.tit { font-size:1.5em; margin-bottom:15px;}

@media only screen and (max-width: 450px) {
	.messageSection{ padding:20px;}
}

/* message-area */
.message-area {padding:50px 0 50px;}
.message-guide {color:#333;font-size:1.8em;text-align:center;line-height:32px;}
.message-guide em {display:inline-block;color:#f39800;font-style:normal;vertical-align:top;}
.message-guide span {display:block;padding:12px 0 0;color:#666;font-size:14px;line-height:22px;vertical-align:top;}
@media only screen and (max-width: 450px) {
	.message-guide {color:#333;font-size:1.4em;}
	.message-guide span {font-size: 12px;line-height:1.4}
}

/* step_join */
.step_join { position: relative; margin-bottom: 40px;}
.step_join ul{ display:block; margin: 0 auto; text-align:center;}
.step_join li {position:relative; display:inline-block; width:125px; margin:0 23px;}
.step_join li span{ font-size:1.05em; display:inline-block; }
.step_join li.on span{color:#1e55cc; text-decoration:underline;}
.step_join li:before{ content: ''; display: block; width:125px; height: 65px; background:url('../images/member/bg_member.png') no-repeat;}
.step_join li:after{ content: ''; display: block; position: absolute; right: -32px; top: 50%; margin-top:-7.5px;  width: 15px; height: 15px; border-top: 2px solid #b3b3b3; border-right: 2px solid #b3b3b3; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.step_join li:last-child:after{ display:none;}
.step_join li.step1:before {background-position:10px 0;}
.step_join li.step2:before {background-position:-90px 0;}
.step_join li.step3:before  {background-position:-290px 0;}
.step_join li.step4:before  {background-position:-190px 0;}
.step_join li.on.step1:before {background-position:10px -70px;}
.step_join li.on.step2:before {background-position:-90px -70px;}
.step_join li.on.step3:before {background-position:-290px -70px;}
.step_join li.on.step3:before {background-position:-190px -70px;}

@media only screen and (max-width :767px) {
	.step_join{ margin-bottom:20px;}
	.step_join li{width: 50px;margin: 0 9px;}
	.step_join li:last-child{ width:60px;}
	.step_join li:before{background-size: 350px;width: 50px;height: 45px;}
	.step_join li.step1:before {background-position:-9px 0;}
	.step_join li.step2:before {background-position: -81px 0px;}
	.step_join li.step3:before  {background-position: -219px 0px;}
	.step_join li.step4:before  {background-position: -144px 0px;}
	.step_join li.on.step1:before {background-position: -9px -47px;}
	.step_join li.on.step2:before {background-position:-81px -47px;}
	.step_join li.on.step3:before {background-position:-219px -47px;}
	.step_join li.on.step4:before {background-position:-144px -47px;}
	.step_join li:after{ right: -20px; margin-top: -5px; width: 10px; height: 10px; border-width: 1px 1px 0 0;}
	.step_join li span{letter-spacing: -0.05em;}
}


/* agreeBox */
.agreeBox{background:#fff;padding: 25px 25px 15px 25px;overflow: hidden;border: 1px solid #dfdfdf; max-height:250px; overflow-y:auto; margin-bottom:10px; font-size: 0.95em;}
.agreeBox h4:first-child{ margin-top: 0;}
@media only screen and (max-width :767px) {
	.agreeBox{background:#fff;padding: 10px;}
}

/* MYPAGE > MAIN */
.mypage-head {overflow:hidden;position:relative;width:100%;height:120px;margin:0 auto; border: 1px solid #ddd; background: #f6f6f6}
.mypage-head .text {float:left;padding:40px 0 0 0px;}
.mypage-head .iconGrade{ display: inline-block; float: left; margin: 30px 15px 0 30px; background:#fff url(../images/member/ico_member_upload1.jpg) no-repeat 50% 50%; width: 60px; height: 60px; text-indent: -9999px; border-radius: 50%}
.mypage-head .text span {display:inline-block;color:#333;vertical-align:top;}
.mypage-head .text strong {color:#111; font-size: 1.3em}
.mypage-head .infor {overflow:hidden;float:right; background: #fff}
.mypage-head .infor > li {float:left;position:relative;width:100px;height:120px;padding-top:40px;border-left:1px solid #ddd;text-align:center;cursor:pointer;}
.mypage-head .infor > li:first-child{width:130px;}
.mypage-head .infor > li:first-child .num {color:#f39800;}
.mypage-head .infor > li.cursor-text {cursor:text;}

.mypage-head .infor li .tit {display:block;font-weight:500; color: #999}
.mypage-head .infor li .num {display:block;color:#333;font-size:1.6em;line-height:22px;margin-top:5px;font-weight:700}
.mypage-head .infor li .num em {font-weight:400}
.mypage-head .infor li .unit {margin:0 0 0 3px;color:#999;font-style:normal;font-size:12px;line-height:16px;}

.mypage-head .iconGrade.iconGrade1 { background-image: url(../images/member/ico_member_upload1.jpg)}
.mypage-head .iconGrade.iconGrade2 { background-image: url(../images/member/ico_member_upload2.jpg)}
.mypage-head .iconGrade.iconGrade3 { background-image: url(../images/member/ico_member_upload3.jpg)}

.member-page .list-categories-nav {margin: 30px 0 0;}
.title-area + .table-responsive .tbl_prd_list thead th { border-top:none}


@media only screen and (max-width :1024px) {
	.mypage-head{ height: inherit;}
	.mypage-head .iconGrade {margin: 15px 15px 15px 20px; }
	.mypage-head .text {padding: 25px 0 0 0px;}
	.mypage-head .infor {float: none; clear: both; border-top: 1px solid #ddd; margin-top: 15px}
	.mypage-head .infor > li { width: 16%; height: 80px; padding-top: 20px;}
	.mypage-head .infor > li:first-child{border-left:none; width: 20%;}
}
@media only screen and (max-width :767px) {
	.mypage-head .iconGrade {margin: 10px 15px 10px 20px; width: 50px;height: 50px; background-size: cover}
	.mypage-head .text {padding: 20px 0 0 0px;}
	.mypage-head .infor {float: none; clear: both; border-top: 1px solid #ddd; margin-top: 15px}
	.mypage-head .infor > li { width: 15%; height: 80px; padding-top: 20px;}
	.mypage-head .infor > li:first-child{border-left:none; width: 25%;}
}
@media only screen and (max-width :450px) {
	.mypage-head .infor > li {height: 55px; padding-top: 10px;}
	.mypage-head .infor li .tit {font-size: 12px;}
	.mypage-head .infor li .num {font-size: 1.1em;margin-top: 0px;}
}

/* page 일반 */
.tab-content .form-layout,
.tab-content .list-customer ul {border-top: 2px solid #d6d6d6;}
.pageing + .usage-guide { margin-top: 50px}
.coupon img { vertical-align: middle; padding: 0 5px 3px}
.coupon strong { display: inline-block; color: #7da7d9}

/* order_step */
.order_step {clear:both; text-align: center;padding:10px 0; border: 1px solid #eee; margin: 10px 0 15px;border-radius: 10px ; overflow: hidden}
.order_step li { float: left;text-align: center; width: 16.6%; padding: 10px;border-left: 1px dotted #ddd }
.order_step li:first-child {border-left:none}
.order_step li dl { max-width: 130px; margin: 0 auto;line-height: 1; }
.order_step li dt { margin: 0 auto 10px; width: 80px; height: 80px; background-color: #fdf7fa; border: 1px solid #f9e4ef; color: #e7a2c0; border-radius: 50%;  font-size: 12px; }
.order_step li dt strong { display: block;font-size: 2.5em; line-height: 1; padding: 15px 0 0px; font-family:'Roboto', sans-serif;color: #d56c97 !important;  }
.order_step li dd {  min-height: 30px;font-size: 13px;}
.order_step li dd strong { color: crimson}
.order_step li dl dd:last-child { color: #888; margin-top: 5px;font-size: 12px;}
.order_step.col3 li {width: 33.3%;}
.order_step.col3 li dl { max-width: 160px; }

@media only screen and (max-width:1024px) {
	.order_step li dd:first-child br { display: none}
	.order_step li dd {  min-height: 30px;}
}
@media only screen and (max-width:768px) {
	.order_step {padding:0;}
	.order_step li {width: 50%; border-left: none;border-top: 1px dotted #ddd}
	.order_step li:first-child, .order_step li:nth-child(2){border-left: none; border-top:none}
	.order_step li dl { max-width: inherit !important; }
	.order_step li dt { float: left; margin-right: 15px}
	.order_step li dd {min-height: inherit; text-align: left; padding-top: 5px;}
	.order_step li dl dd:last-child { margin-top: 5px;padding-top: 0 !important}
	.order_step.col3 li {border-top:none}
}
@media only screen and (max-width:700px) {
	.order_step.col3 li {clear: both;float: none; width: inherit}
}
@media only screen and (max-width:450px) {
	.order_step li { clear: both;float: none; width: inherit !important}
	.order_step li:nth-child(2) ,.order_step li:nth-child(3) {border-top: 1px dotted #ddd}
	.order_step li dt {  width: 60px; height: 60px;margin-right: 5px}
	.order_step li dt strong { font-size: 2em;  padding: 7px 0 0px;}
	.order_step li dd {  padding-top: 5px; line-height: 13px;}
	.order_step li dl dd br { display: block}
	.order_step li dl dd:last-child br { display: none}
}

/* 주문배송 단계 */
.mypage-step {overflow:hidden;width:100%;border-bottom:1px solid #e6e6e6;}
.mypage-step li {float:left;position:relative;width:20%;height:119px;background:url("../images/comm/ico_arrow16x20.png") no-repeat 0 50%;font-size:0;line-height:0;}
.mypage-step li:first-child {background:none;}
.mypage-step li em, .mypage-step li span {display:block;position:absolute;left:0;width:100%;text-align:center;vertical-align:top}
.mypage-step li em {top:25px;color:#888;font-style:normal;font-size:40px;line-height:50px;font-weight:700}
.mypage-step li.on em {color:#333}
.mypage-step li span {top:71px;color:#666;font-size:16px;line-height:22px;}
.mypage-conts .list-customer {width:100% !important;}
.mypage-conts .list-customer ul {border-top:0;}
.mypage-conts .list-customer ul li {background:none;}
.mypage-conts .list-customer ul li.open .stit {}
.mypage-conts .list-customer ul li a {display:inline-block;overflow:hidden;width:200px;color:#222;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;font-weight:400}
.mypage-conts .list-customer ul li a > br {display:none}
.mypage-conts .list-customer ul li .stit .data {margin:0;}
.mypage-conts .list-customer ul li.nodata {padding:80px 0 !important;background:none !important}
.mypage-conts .list-customer ul li { background: none !important;}

.memberInfo {margin-top:5px;position:relative;overflow:hidden;padding:14px 15px 14px 0;}
.memberInfo div {float:left;overflow:hidden;width:50px;height:50px;border-radius:25px;text-indent:-9999px;}
.memberInfo .vvip {background:url("../images/comm/icon_membership_vvip2.png") no-repeat 0 0;background-size:50px auto;}
.memberInfo .vip {background:url("../images/comm/icon_membership_vip2.png") no-repeat 0 0;background-size:50px auto;}
.memberInfo .gold {background:url("../images/comm/icon_membership_gold2.png") no-repeat 0 0;background-size:50px auto;}
.memberInfo .silver {background:url("../images/comm/icon_membership_sliver2.png") no-repeat 0 0;background-size:50px auto;}
.memberInfo .blue {background:url("../images/comm/icon_membership_blue2.png") no-repeat 0 0;background-size:50px auto;}
.memberInfo p {display:inline-block;height:50px;padding-left:10px;line-height:50px;color:#111;vertical-align:middle;}
.memberInfo p >span{font-weight:700}
.memberInfo .btnGray {display:inline-block;margin-left:40px;padding:0;height:31px;width:130px;border:1px solid #888888;background:#fff;border-radius:20px;color:#888;line-height:31px;text-align:center;vertical-align:middle;}
.memberInfo .btnGray:after{display:inline-block;content:'';background:url("../images/comm/ico_arrow_mypage.png") no-repeat 0 0;width:6px;height:11px;vertical-align:middle;margin:0 0 3px 7px;}
.mypage-conts .usage-guide {padding-top:15px}
.mypage-conts .usage-guide h2.stit {display:none}
.mypage-conts .usage-guide li {color:#888} 


/* 적립 */
.point_header { overflow: hidden; margin-bottom: 30px; border: 1px solid #ddd}
.point_header dl { float: left; width: 28%; padding: 15px; border-right: 1px solid #ddd; background-color: #fbf2f2}
.point_header dl dt { float: left; font-weight: 400; line-height: 35px}
.point_header dl dd { font-size: 1.1em; float: right;line-height: 35px}
.point_header dl:first-child {background-color: #f6f6f6}
.point_header dl:last-child {width: 44%; border-right:none; background-color: #f2f7fb}
.point_header dl:last-child dd {font-size: 1.5em; }
@media only screen and (max-width: 768px) {
	.point_header dl { text-align: center; padding: 15px 0px; }
	.point_header dl dt { float: none; line-height:1; padding-top: 10px; font-size: 12px}
	.point_header dl dd { float: none;}
}
/* 쿠폰적립 */
.coupon_regist { padding:50px 0}
.coupon_price { overflow: hidden; margin-bottom: 20px; padding:5px 10px; border-bottom: 1px solid #ddd;}
.coupon_price .fL {color: #222;font-weight: 700; margin-top: 5px}
.coupon_price .fL .tx_price {margin-left: 10px; font-size: 1.3em;color: #e40000;}

/* 고객센터 > FAQ 검색 */
.search-faq {overflow:hidden;width:100%;height:110px;margin:0;padding:30px 0 0;background:#f6f6f6;text-align:center}
.search-faq label {display:inline-block;margin:0 20px 0 0;color:#222;font-size:20px;line-height:38px;vertical-align:middle}
.search-faq .input {display:inline-block;overflow:hidden;width:420px;height:48px;border-radius:30px;border:1px solid #ccc;background:#fff;vertical-align:middle;}
.search-faq .input input[type="text"] {float:left;width:75%;height:44px;padding:8px 10px 8px 18px;border:0;line-height:22px;}
.search-faq .input input[type="text"]:focus {outline:none;}
.search-faq .input input[type="submit"] {float:right;width:25px;height:27px;margin:10px 19px 0 0;background:url("../images/comm/ico_search25x27.png") no-repeat 0 0;font-size:0;text-indent:-99999px;line-height:0;}
/* 고객센터 탭 */
.area-customer { max-width: 860px; margin: 0 auto}
.comm2sTabs.iconTab {height:120px;margin-bottom:30px;margin-top:30px;border:1px solid #ddd;}
.comm2sTabs.iconTab > li {width:16.5%;float: left;margin: 0px;background: #fff;box-sizing: border-box;border-left: 1px solid #ddd;}
.comm2sTabs.iconTab > li:first-child {margin-left:0;width:17.5%;border-left:none}
.comm2sTabs.iconTab > li > button {width:100%;height:118px;padding-top:0px;color:#222;font-weight:400; border: none}
.comm2sTabs.iconTab > li > button:before { content: ""; display: block; width: 60px; height: 60px; margin: 0 auto;background:url("../images/comm/ico_tab_customer.png") no-repeat 0 0;}
.comm2sTabs.iconTab > li > button.icon_tab01:before {background-position:10px 0px}
.comm2sTabs.iconTab > li > button.icon_tab02:before {background-position:-132px 0px}
.comm2sTabs.iconTab > li > button.icon_tab03:before {background-position:-283px 0px}
.comm2sTabs.iconTab > li > button.icon_tab04:before {background-position:-425px 0px}
.comm2sTabs.iconTab > li > button.icon_tab05:before {background-position:-575px 0px}
.comm2sTabs.iconTab > li > button.icon_tab06:before {background-position:-715px 0px}
.comm2sTabs.iconTab > li > button.icon_tab07:before {background-position:-860px 0px}
.comm2sTabs.iconTab > li > button.icon_tab06+.twoTabs,
.comm2sTabs.iconTab > li > button.icon_tab07+.twoTabs {right:0}
.comm2sTabs.iconTab > li.on { background: #666;}
.comm2sTabs.iconTab > li.on > button {color:#fff}
@media only screen and (max-width: 700px) {
	.search-faq .input {width:300px;}
}
@media only screen and (max-width: 600px) {
	.comm2sTabs.iconTab {height: 202px;margin-bottom: 15px; margin-top: 15px;}
	.comm2sTabs.iconTab > li {height: 100px;width:33.3% !important;}
	.comm2sTabs.iconTab > li:first-child,.comm2sTabs.iconTab > li:nth-child(2),.comm2sTabs.iconTab > li:nth-child(3) {border-bottom: 1px solid #ddd;}
	.comm2sTabs.iconTab > li:first-child,.comm2sTabs.iconTab > li:nth-child(4){width:33.4%;border-left:none}
	.comm2sTabs.iconTab > li > button{height: 100px;}
	.comm2sTabs.iconTab > li > button:before {height: 55px;}
	
}
@media only screen and (max-width: 450px) {
	.search-faq { padding:0px;height:inherit;background:none;}
	.search-faq label { display: none}
	.search-faq .input { width: 100%;}
}

/* 고객센터 > 공통 게시판 */
.list-customer {margin:0 auto;}
.list-customer ul {overflow:hidden;width:100%;border-top:2px solid #888}
.list-customer ul li {background:url("../images/comm/ico_arrow21x12_off.png") no-repeat 98% 24px;border-bottom:1px solid #e6e6e6}
.list-customer ul li.nodata {padding:200px 15px 80px;background:url("../images/comm/ico_nodata.png") no-repeat center 80px;color:#888;text-align:center;line-height:20px;height:inherit; }
.list-customer ul li .tit, .list-customer ul li .stit {margin-left:20px;padding:20px 40px 20px 42px;background:url("../images/comm/ico_faq14x15.png") no-repeat 0 50%;color:#222;cursor:pointer;}
.list-customer ul li .stit {position:relative;margin:0;padding:20px 0 20px 30px;background:none}
.list-customer ul li .tit strong {display:inline-block;width:140px;margin-right:11px;vertical-align:middle;}
.list-customer ul li .stit strong {display:inline-block;width:70px;height:22px;margin:0 20px 0 0;padding:0 4px;border-radius:15px;box-sizing:border-box;text-align:center;background:#888;color:#fff;font-size:12px;line-height:22px}
.list-customer ul li .stit .data {position:absolute;right:60px;color:#888;line-height:18px;}
.list-customer ul li .conts {display:none;background:#fafafa;border:0;color:#222;/*font-size:0;line-height:0;*/}
.list-customer ul li .conts li {padding:28px 30px 25px;background:none;border-top:1px solid #e6e6e6;border-bottom:0}
.list-customer ul li .conts li strong {display:block;font-size:16px;line-height:22px;}
.list-customer ul li .conts li p,
.list-customer ul li .conts li div {padding:0;color:#222;line-height:22px;}
.list-customer ul li .conts li > ul+p,
.list-customer ul li .conts li > ul+div {padding:15px 0 0}
.list-customer ul li .conts li .phr {position:relative;margin:25px 0 0;padding:28px 0 0;/*background:url("../images/comm/bar_dott7x1.gif") repeat-x 0 0;*/border-top:1px dashed #e6e6e6;color:#888;line-height:18px;}
.list-customer ul li .conts li .btnGreenW {display:inline-block;position:absolute;top:17px;right:0;width:112px;height:38px;padding:4px 0 0;text-align:center;letter-spacing:-1px;}
.list-customer ul li .conts li.question {padding:28px 30px 25px 62px}
.list-customer ul li .conts li.question strong {color:#666;}
.list-customer ul li .conts li.answer {}
.list-customer ul li .conts li.answer strong {display:block;position:relative;color:#333}
.list-customer ul li .conts li.answer strong > .answer_date {position:absolute;top:0;right:0;font-size:14px}
.list-customer ul li .conts li.answer strong+p,
.list-customer ul li .conts li.answer strong+div {padding:15px 0 0}

.list-customer ul li .conts li ul {margin:18px 0 0;padding:0 0 0 8px;border:0;border-left:2px solid #ccc;}
.list-customer ul li .conts li ul li {padding:0;border:0;color:#888;line-height:22px;}
.list-customer ul li .conts li ul li em {display:inline-block;margin:0 6px 0 0;font-style:normal}
.list-customer ul li .conts li ul li.offline{color:#8f9100;font-weight:bold;}
.list-customer ul li.open .conts {display:block;}
.list-customer ul li.open {background:url("../images/comm/ico_arrow21x12_on.png") no-repeat 98% 24px;}
.list-customer ul li.open .tit, .list-customer ul li.open .stit {color:#f39800;font-weight:700}
.list-customer ul li.open .stit strong {background:#979900;}
.list-customer ul li.open .stit .data {}

.list-customer ul li .tit > span.tx_same {color:#333;font-weight:700}
.list-customer.onenone {margin-top:20px}
.list-customer.onenone ul li .stit.complete strong {background:#333}
.list-customer.onenone ul li .stit strong {background:#888}
.list-customer.onenone ul li .conts li.question {padding-left:30px}

@media only screen and (max-width: 650px) {
	.list-customer ul li .tit strong { margin-right: 0; width: 90px}
	.list-customer ul li .tit, .list-customer ul li .stit {margin-left: 5px;padding:20px 40px 20px 20px; text-overflow: ellipsis; white-space: nowrap; width: 350px; overflow: hidden}
	.list-customer ul li .conts li.question { padding: 20px 10px;}
}
@media only screen and (max-width: 400px) {
	.list-customer ul li { background-position: 99% 20px !important;}
	.list-customer ul li .tit, .list-customer ul li .stit {padding:15px 40px 15px 20px;width: 300px;}
}
/* 고객센터 > 전화번호 배너
.phone-banner {overflow:hidden;margin:60px 0 0;background-color:#f9f9f9}
.phone-banner > div {float:left;position:relative;width:50%;height:110px;border:1px solid #e6e6e6;}
.phone-banner .deposits {border-right:0;background:url("../images/comm/img_deposits.png") no-repeat 90% 50%;}
.phone-banner .online {background:url("../images/comm/img_onlinemoll.png") no-repeat 90% 50%;}
.phone-banner strong, .phone-banner em, .phone-banner span {display:inline-block;position:absolute;vertical-align:top;}
.phone-banner strong {top:30px;left:30px;color:#333;line-height:18px;}
.phone-banner .online strong {color:#ee782f;}
.phone-banner em {top:25px;left:120px;color:#222;font-style:normal;font-size:30px;line-height:40px;font-weight:700}
.phone-banner span {top:64px;left:123px;color:#888;line-height:18px}
 */

/* 고객센터 > 1:1문의 > 목록 */
.search-period {overflow:hidden;position:relative;width:100%;margin:20px 0 0;padding:20px;background:#ececec;box-sizing:border-box;border-radius:5px}
.search-period .select-month {overflow:hidden;}
.search-period .select-month li {float:left;width:70px;height:28px;margin:0 0 0 -1px;font-size:0;line-height:0;}
.search-period .select-month li:first-child {margin:0;}
.search-period .select-month button {width:100%;height:28px;border:1px solid #d0d0d0;background:#fff;color:#222;font-size:12px;font-weight:400}
.search-period .select-month li:first-child button {border-top-left-radius:5px;border-bottom-left-radius:5px;}
.search-period .select-month li:last-child button {border-top-right-radius:5px;border-bottom-right-radius:5px;}
.search-period .select-month li.on button {border:1px solid #848484;background:#848484;color:#fff;}
.search-period .select-range {padding:10px 0 0;line-height:38px}
.search-period .select-range select {height:28px;padding-right:0;color:#222;font-size:12px;line-height:16px;vertical-align:middle}
.search-period .select-range label {display:inline-block;margin:0 11px 0 1px;color:#222;font-size:12px;line-height:16px;}
.search-period .select-range .des {margin:0 15px 0 10px;}
.search-period button.btnLookup,
.search-period input[type="submit"] {display:inline-block;position:absolute;top:0;right:0;width:85px;height:100%;background:#333;border-radius:0;border-top-right-radius:5px;border-bottom-right-radius:5px;color:#fff;font-size:16px;line-height:22px;}
.search-period.mgT30 {margin-top:20px !important}

/* 고객센터 > 문의상품 팝업 */
.layer_pop_wrap .popup-contents {top:0 !important;margin-top:0 !important}
.layer_pop_wrap #dim{display:none;}
.popup-contents {z-index:11;position:absolute;top:20%;left:50%;width:758px;margin:0 0 0 -379px;border-radius:5px;background:#fff;}
.pop-conts {padding:0 30px 30px;}
.pop-conts .ptit {padding:30px 0 15px;border-bottom:2px solid #878787;color:#4c4c4c;font-size:24px;line-height:30px;}
.pop-conts .search-period {margin-top:15px;}
.pop-conts .search-period .select-range label {margin-right:7px;}
.pop-conts .search-period .select-range .des {margin:0 8px 0 0;}
.pop-conts {}
.pop-conts .ButtonClose {position:absolute;top:30px;right:30px;width:23px;height:23px;background:url("../images/comm/ico_close23x23.png") no-repeat 0 0;font-size:0;text-indent:-99999px;line-height:0;}
.popup-contents .sub-title5 {width:100%;}
.popup-contents2 .sub-title5 {width:100%;}
#popupLoading {width:360px;padding:20px 20px 20px;border:2px solid #d8da02;border-radius:15px;margin-left:-180px !important;}
#popupLoading .inprogress {padding:50px 0 0;text-align:center;color:#333;font-weight:bold;font-size:16px;line-height:22px;background:url("../images/comm/ico_inprogress_40x40.gif") no-repeat center 0;background-size:30px 30px;}
.listup-data > ul {border-top:2px solid #888;}
.listup-data > ul > li {position:relative;width:100%;border-bottom:1px solid #e6e6e6}
.listup-data > ul > li input[type="radio"] {width:12px;height:12px;-webkit-appearance:radio;-moz-appearance:radio;-webkit-appearance:radio;border:0 !important;}
.listup-data > ul > li .listup-main-data {display:block;position:relative;width:100%;height:40px;padding-left:125px;line-height:40px;font-size:12px}
.listup-data > ul > li .listup-main-data .btn-arrow {display:inline-block;position:absolute;top:7px;right:10px;padding-right:25px;color:#888;line-height:25px;background:url("../images/comm/ico_arrow17x10_off.png") no-repeat 100% 50%}
.listup-data > ul > li .listup-main-data input[type="radio"] {position:absolute;top:15px;left:20px}
.listup-data > ul > li .listup-main-data label {color:#333}
.listup-data > ul > li .listup-main-data label em {display:inline-block;font-style:normal;max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top}
.listup-data > ul > li .listup-main-data .state,
.listup-data > ul > li .listup-main-data .data {position:absolute;color:#888;text-align:center} 
.listup-data > ul > li .listup-main-data .data {top:0;left:30px;width:80px}
.listup-data > ul > li.open .listup-main-data .btn-arrow {color:#333;background-image:url("../images/comm/ico_arrow17x10_on.png")}
.listup-data > ul > li.open .listup-main-data label {color:#888}
.listup-data > ul > li .listup-main-data.disabled label {color:#888}
.listup-data > ul li .area-drop {display:none;border-top:1px solid #e6e6e6;background:#fafafa;}
.listup-data > ul li.open .area-drop {display:block;}
.listup-data > ul li .area-drop ul {width:100%;padding:0 0 15px 40px;}
.listup-data > ul li .area-drop ul li {position:relative;margin-top:13px}
.listup-data > ul li .area-drop ul li input[type="radio"] {margin-top:5px}
.listup-data > ul li .area-drop ul li label {padding-left:65px;font-size:12px;line-height:18px}
.listup-data > ul li .area-drop ul li label em {color:#333;font-style:normal;line-height:18px}
.listup-data > ul li .area-drop ul li label span {margin-left:10px;color:#888;line-height:18px}
.listup-data > ul li .area-drop ul li .state {position:absolute;top:1px;left:20px;width:65px;line-height:18px;margin:0}


.pop-conts .board-write-2s {width:100%;}
.pop-conts .area1sButton {margin:0;padding:20px 0 0;}
.pop-conts .area1sButton .btnGreen, .pop-conts .area1sButton .btnGray {width:100px;height:38px;padding:5px 0 0 0;}


/*Check out*/
.product-checkout .button-duck { margin-top: 20px; text-transform: uppercase !important; }
.product-checkout .checkout-element-wrap { margin-top: 70px; }
.title-join { color: #333333; font-size: 1.3em; margin: 40px 0 20px; text-transform: uppercase; position: relative; }
.title-join::before { content: ""; width: 50px; border-bottom: 1px solid #f39800; position: absolute; bottom: -10px; left: 0; }
.checkbox-wrap { text-align: left; font-size: 13px; font-weight: 300; color:  #666; margin-bottom: 10px;}
.checkbox-wrap label {font-weight: 300; color:  #666; line-height: 20px;}
.checkbox-wrap label input[type="radio"] {margin-right: 3px;}
.checkout_address > li { margin-bottom: 10px}
.checkout_address > li label { clear: both; color: #666; display: inline-block;  margin: 10px 0 5px; font-weight: 400;  width: 100%; }
.checkout_address > li input { width: 100%}
.checkout_address > li input + input {margin-top: 5px;}
.checkout_address > li input[type="checkbox"], .checkout_address > li input[type="radio"] { width: 18px; display: inline-block;}
h5+.checkbox-wrap { position: absolute; top:40px; right: 20px}
.checkout_address span.labelTit{ display:inline-block; margin: 10px 0 5px;}
.checkout_address .radioBox{padding: 8px 0;  border: 1px solid #ddd; border-width: 1px 0;}


.radioBox {padding:5px 0;}
.radioBox span {display:inline-block;font-size:14px;line-height:20px;}
.radioBox input[type="radio"]:first-child{ margin-left:0;}
.radioBox input[type="radio"] {margin-left:40px;vertical-align:middle;}
.radioBox input[type="radio"] + label{margin-left:6px;}
.radioBox label {  display: inline !important;  margin: 0; width: auto !important; }

.member-area .radioBox {margin-top:20px;padding:10px 0;}

.title-shopping-cart { color: #333333; font-size: 1.3em; margin: 40px 0 20px; text-transform: uppercase; position: relative; }
.title-shopping-cart::before { content: ""; width: 50px; border-bottom: 1px solid #f39800; position: absolute; bottom: -10px; left: 0; }
