@charset "utf-8";

/*공통*/
input{outline: 0;}
#wrapper{width: 100%; height: 100%;}
header{width: 100%;}
#container{width: 100%; }
#container.tpd60{width: 100%; padding-top: 60px;}
#container.sh_cont{width: 100%; padding-top: 242px; }
#container.notice_cont{width: 100%; padding-top: 171px; min-height: calc(100% - 171px);}
#container.normal{width: 100%; padding-top: 60px; min-height: calc(100% - 212px);}
#container.search{width: 100%; padding-top: 130px; min-height: calc(100% - 172px);}
#container.h100{width: 100%; padding-top: 60px; height: calc(100% - 69px); box-sizing: border-box;}
#btn_top{background: url("../images/icon_top.png") 0 0 no-repeat;width: 37px;height: 37px;background-size: 100%;text-indent: -9999px;position: fixed;bottom: 75px;right: 10px;z-index: 10}/*20191226 수정*/
#container.bg_gr{ background: #f4f4f4 !important;}
img{width: 100%;}



/*포인트 폰트 색상 */
.txt_red{color:rgb(217, 55, 55) !important;}
.txt_sky{color: #2a9ed0 !important;}
.txt_grey{color: #909090;}


/*header*/
header.sub_header{width: 100%; height: 60px; background: #fff; position: fixed; z-index: 51; border-bottom: 1px solid #c1c1c1;}
header.sub_header > h1{text-align: center; font-size: 1.8rem; line-height: 60px; }
header.sub_header .prev{width: 2rem; height: 3rem; position: absolute; top: 15px; left: 20px; text-indent: -9999999px; background: url("../images/icon_prev.png") left center no-repeat; background-size: 1.1rem;}
header.sub_header .prev.invert {-webkit-filter: invert(100%); filter: invert(100%);}
header.sub_header .home{position: absolute; top: 15px; right: 20px; height: 3rem; line-height: 3rem;  font-size: 1.8rem;  padding-left:10px; font-weight: 400; }

header.code_header{width: 100%; background: #fff; position: relative; height: auto; padding-bottom: 23px; } 
header.code_header > h1{width: 268px; margin: 0 auto; height: auto; line-height: 1; font-size: 0; padding-top: 10px;}
header.code_header > h1 > img{vertical-align: top;}
header.code_header > h2{width: 100%; padding-top:26px; font-size:18px; color: rgb(25, 25, 25); text-align: center; font-weight: 600;}



header.product_header{width: 100%; background: #fff; position: relative; height: auto; padding-bottom: 23px; } 
header.product_header > h1{width: 268px; margin: 0 auto; height: auto; line-height: 1; font-size: 0; padding-top: 10px;}
header.product_header > h2{width: 100%; padding-top:26px; font-size:18px; color: rgb(25, 25, 25); text-align: center; font-weight: 600;}
header.product_header .tab_ar{padding: 0px 50px 0; margin-top: 23px; }
header.product_header .tab_ar > ul{width: 100%; background: url(../images/dot.png) center 16px repeat-x; background-size: auto 1px; display: table;}
header.product_header .tab_ar > ul > li{display: table-cell; width: 33.3%;}
header.product_header .tab_ar > ul > li:nth-child(2){text-align: center;}
header.product_header .tab_ar > ul > li:nth-child(3){text-align: right;}
header.product_header .tab_ar > ul > li:first-child > a{background: url(../images/h_bg_l.png) top left no-repeat; background-size: 32px;}
header.product_header .tab_ar > ul > li:nth-child(3) > a{background: url(../images/h_bg_r.png) top right no-repeat; background-size: 32px;}
header.product_header .tab_ar > ul > li > a{display: inline-block; text-align: center;}
header.product_header .tab_ar > ul > li > a > span{width: 32px; height: 32px; display: inline-block;}
header.product_header .tab_ar > ul > li > a > span.icon_01{background: url(../images/pd01_Off.svg);}
header.product_header .tab_ar > ul > li > a > span.icon_02{background: url(../images/pd02_Off.svg);}
header.product_header .tab_ar > ul > li > a > span.icon_03{background: url(../images/pd03_Off.svg);}
header.product_header .tab_ar > ul > li > a > p{font-size: 12px; color: rgb(25, 25, 25);}
header.product_header .tab_ar > ul > li.on > a > span.icon_01{background: url(../images/pd01_On.svg);}
header.product_header .tab_ar > ul > li.on > a > span.icon_02{background: url(../images/pd02_On.svg);}
header.product_header .tab_ar > ul > li.on > a > span.icon_03{background: url(../images/pd03_On.svg);}
header.product_header .tab_ar > ul > li.on > a > p{font-size: 12px; color: rgb(25, 25, 25); font-weight: 600;}
header.product_header .tab_ar > ul > li.done > a > span.icon_01{background: url(../images/pd01_Done.svg);}
header.product_header .tab_ar > ul > li.done > a > span.icon_02{background: url(../images/pd02_Done.svg);}


.code_container{width: 100%; background: #fff; }
.code_container .code_input{background: rgb(247, 247, 247); border-top-left-radius: 24px; border-top-right-radius: 24px; padding: 50px 30px; text-align: center; min-height: calc(100vh - 260px);}
.code_container .code_input > h3{font-weight: 400; font-size: 16px; color: rgb(25, 25, 25); line-height: 1; padding-bottom: 24px;}
.code_container .code_input > h3 > strong{font-weight: 600;}
.code_container .code_input .input_ar{width: 100%;}
.code_container .code_input .input_ar > input{width: 100%; height: 62px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); border: 0; border-radius: 12px; font-size: 20px; text-align: center; font-weight: 600; color: rgb(25, 25, 25);}
.code_container .code_input .input_ar > input:focus {border:1px solid rgb(25, 25, 25)}
.code_container .code_input .input_ar > span{display: none;}

.code_container .code_input .input_ar.error > input{border:1px solid rgb(217, 55, 55)}
.code_container .code_input .input_ar.error > span{display: block; text-align: center; padding-top: 15px;}
.code_container .code_input .input_ar.error > input:focus{border:1px solid rgb(217, 55, 55)}

.product_container{margin-top: 8px; background: #fff;}
.product_container .product_inner{padding: 30px 16px 88px; }
.product_container .product_inner > h3{font-size: 14px; line-height: 17px; color: rgb(85, 85, 85); font-weight: 600; padding-left: 8px; padding-bottom: 10px;}
.product_container .product_inner > h4{font-size: 22px; line-height: 28px; color: rgb(25, 25, 25); font-weight: 600; padding-left: 8px;}
.product_container .product_inner > h4 > span{display: inline-block; height: 26px; width: 56px; font-size: 11px; color: rgb(233, 143, 0); border-radius: 4px; border: 2px solid rgb(255, 185, 0); text-align: center; font-weight: 100; line-height: 22px; vertical-align: top; margin-left: 5px;}
.product_container .product_inner .detail_sw{width: 100%; overflow: hidden; margin-top: 28px; border-radius: 12px;}
.product_container .product_inner .detail_sw .inner_pd{width: 100%; padding: 24px 12px 12px; position: relative;}
.product_container .product_inner .detail_sw .inner_pd > h5{font-size: 16px; line-height: 16px; color: rgb(255, 255, 255); font-weight: 100; padding-left: 12px; text-align: left;}
.product_container .product_inner .detail_sw .inner_pd > h5 > strong{font-weight: 500;}
.product_container .product_inner .detail_sw .inner_pd .swiper-slide{width: 100%;  padding-top: 165px; display: table;}
.product_container .product_inner .detail_sw .inner_pd .swiper-slide > p {text-align: center; display: table-cell; width: 100%; vertical-align: middle; font-size: 18px; line-height: 22px; margin-top: 165px; height: 44px; color: rgb(25, 25, 25); position: relative;;}
.product_container .product_inner .detail_sw .inner_pd .swiper-pagination-bullets{position: relative; bottom: auto; margin-top: 16px; }
.product_container .product_inner .detail_sw .inner_pd .swiper-pagination-bullet {width: 6px; height: 6px;	display: inline-block;	border-radius: 100%; background: none !important;	opacity: 1; border: 1px solid rgb(25, 25, 25); margin: 0 3px;}
.product_container .product_inner .detail_sw .inner_pd .swiper-pagination-bullet-active{ background: rgb(25, 25, 25) !important;}
.product_container .product_inner .detail_sw .inner_pd .wh_box{margin-top: 20px; padding: 20px; background: #fff; border-radius: 8px; min-height: 0px;}
.product_container .product_inner .detail_sw .inner_pd .wh_box.line_at{min-height: auto;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul{width: 100%;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li{width: 100%; display: table; margin-top: 16px;} 
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li:first-child{margin: 0;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li > span{display: table-cell; text-align: right; font-size: 13px; color: rgb(25, 25, 25); width: 80px;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li > span:first-child{text-align: left; width: auto;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li > span > a{padding-right: 13px; background: url(../images/arl.svg) center right no-repeat; background-size: 4px ;}
.product_container .product_inner .detail_sw .inner_pd .wh_box > ul > li > span > a.full{width: 100%; display: block;}
.btn_ar{width: 100%; font-size: 0; position: fixed; bottom: 0; z-index: 15;}
.btn_ar > button{display: inline-block; width: 50%; height: 58px; background: rgb(255, 185, 0); color: rgb(25, 25, 25); font-size: 16px; line-height: 1;}
.btn_ar > button:first-child{background: rgb(82, 82, 82); color: #fff;}
.btn_ar > button.full_btn{display: inline-block; width: 100%; height: 58px; background: rgb(255, 185, 0); color: rgb(25, 25, 25); font-size: 16px; line-height: 1;}


.full_pop{width: 100%; height: 100vh; background: #fff; overflow-y: auto;}
.full_pop .pop_header{width: 100%;min-height: 45px;text-align: center;line-height: 1.4;font-size: 14px;color: rgb(25, 25, 25);border-bottom: 1px solid rgb(236, 236, 236);position: relative;padding: 14px 50px;}
.full_pop .pop_header > button{width: 14px; height: 14px; position: absolute; top: 15px; right: 24px; }
.full_pop .pop_header > button > img{vertical-align: top;}
.full_pop .pop_content{width: 100%;}
.full_pop .pop_content .pop_inner{width: 100%; padding: 24px;}
.full_pop .pop_content .pop_inner > h3{padding-top: 8.5px; font-size: 18px; line-height: 21px; font-weight: 600;}
.full_pop .pop_content .pop_inner > p{padding-top: 30px; font-size: 14px; color: rgb(25, 25, 25); line-height: 20px;}
.full_pop .pop_content .pop_inner > p.st_ol{padding: 12px 0 0 17px; text-indent: -17px; font-size: 14px;}
.full_pop .pop_content .pop_inner > p.st_dl{padding: 12px 0 0 10px; text-indent: -10px; font-size: 14px;}
.full_pop .pop_content .pop_inner > p.st_cl{padding: 12px 0 0 14px; text-indent: -14px; font-size: 14px;}
.full_pop .pop_content .pop_inner > p.st_el{padding: 12px 0 0 20px; text-indent: -20px; font-size: 14px;}
.full_pop .pop_content .pop_inner > p.st_fl{padding: 5px 0 0 16px; text-indent: -16px; font-size: 14px; line-height: 1.3; margin-left: 6px;}
.full_pop .pop_content .pop_inner > span{display: inline-block; margin-top: 30px; background: rgb(247, 247, 247); padding: 0 20px ; text-align: center; height: 40px; line-height: 40px; border-radius: 20px; font-size: 14px; font-weight: 500;}

.full_pop .pop_content .pop_inner2{width: 100%; padding: 24px;}
.full_pop .pop_content .pop_inner2 > h3{padding-top: 16px; font-size: 13px; line-height: 21px; font-weight: 600;}
.full_pop .pop_content .pop_inner2 > p{padding-top: 3px; font-size: 13px; color: rgb(25, 25, 25); }


.product_container2{margin-top: 8px; background: none;}
.trems_inner{width: 100%; background: none; padding: 0;}
.trems_inner > h3{ padding: 40px 24px 0; font-size:18px; color: rgb(25, 25, 25); font-weight: 600;}
.trems_inner > p{padding: 6px 24px 0; font-size: 13px; color: rgb(85, 85, 85);}
.trems_inner .agree_ar{padding-top: 24px; width: 100%;}

.trems_inner .agree_ar .all_agree{padding: 0 24px; width: 100%;}
.trems_inner .agree_ar .all_agree .check_box_all {width: auto; position: relative; display: inline-block; width: 100%;}
.check_box_all input{margin: 0;}
.check_box_all input[type="checkbox"] + label {display: inline-block; width: 100%; height: 64px; border: 1px solid rgb(233, 233, 233); background: #fff url(../images/checkOff.svg) 16px 26px no-repeat; background-size: 16px;
	padding: 0px 0 0px 46px; font-size: 1.6rem;line-height: 62px; color: rgb(25, 25, 25); border-radius: 14px;}
.check_box_all input[type="checkbox"]:checked + label{border: 1px solid rgb(255, 185, 0); background: #fff url(../images/checkOn.svg) 16px 26px no-repeat; background-size: 16px;
	padding: 0px 0 0px 46px; font-size: 1.6rem;line-height: 62px; color: rgb(25, 25, 25);}

.trems_inner .agree_ar > ul{padding: 20px 30px; }
.trems_inner .agree_ar > ul > li{padding-top: 21px; font-size: 0;}
.trems_inner .agree_ar > ul > li:first-child{padding-top: 0;}
.trems_inner .agree_ar > ul > li .check_ar{width:18px; display:inline-block; vertical-align: top; }
.trems_inner .agree_ar > ul > li .check_ar .check_box_c{width: 18px; height: 18px; position: relative; display: inline-block; vertical-align: middle;}
.trems_inner .agree_ar > ul > li > button{display: inline-block; width: calc(100% - 28px); margin-left: 10px; padding-right: 14px; vertical-align: top; font-size: 14px; color: rgb(25, 25, 25); text-align: left; background: url(../images/arl.svg)right 4px no-repeat; background-size: 6px;}
.check_box_c input[type="checkbox"]{width: 18px; height: 18px; margin: 0; left: auto; top: auto; bottom: auto; right: auto;}
.check_box_c input[type="checkbox"] + label {display: inline-block;	background: url(../images/checkSoff.svg) no-repeat; background-size: 18px auto; background-position:left top; padding: 0px 0 0px 18px; font-size: 0rem;line-height: 18px; color: #444; width: 18px; height: 18px;}
.check_box_c input[type="checkbox"]:disabled + label {background: #eeeeee;border-radius: 5px;}
.check_box_c input[type="checkbox"]:checked + label{background: url(../images/checkSOn.svg) no-repeat; background-size: 18px auto; background-position:left top; font-size: 0rem; line-height: 18px;}

.join_inner{padding: 0 16px 83px; }
.join_inner > h4{ padding: 40px 8px 0; font-size:18px; color: rgb(25, 25, 25); font-weight: 400;}
.join_inner > h4.tbg_16{padding-bottom: 16px;}
.join_inner > h4 > strong{font-weight: 600;}
.join_inner .hw_box{background: #fff; border-radius: 12px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); padding: 20px; margin-top: 24px; position: relative;}
.join_inner .hw_box .sc_line_box{padding: 15px; border-radius: 4px; border: 1px solid #ebebeb; margin-bottom: 10px;}
.join_inner .hw_box .sc_line_box .inner_box{width: 100%; height: 100px; overflow-y: scroll;}
.join_inner .hw_box .sc_line_box .inner_box > h4{font-size: 14px; padding-bottom: 0px;}
.join_inner .hw_box .sc_line_box .inner_box > h5{font-size: 12px; padding-top: 15px; }
.join_inner .hw_box .sc_line_box .inner_box > p{font-size: 12px; margin-top: 5px; padding-left: 11px; text-indent: -11px;}
.join_inner .hw_box > p{padding-left: 22px; background: url(../images/msg.svg) left top no-repeat; font-size: 13px; line-height: 18px; background-size: 16px; color: rgb(25, 25, 25);}
.join_inner .hw_box .rd_box{width: 244px; margin: 0 auto; border-radius: 8px; overflow: hidden; border: 1px solid rgb(244, 244, 244); font-size: 0; margin-top: 10px;}
.join_inner .hw_box .rd_box .radio_box {position: relative; display: inline-block; width: 50%;}

.join_inner .hw_box .rdi2{ width: 100%; display: inline-block; vertical-align: middle; margin-bottom: 0px; text-align: center; margin-top: 10px;}
.join_inner .hw_box .rdi2 .radio_box2 {position: relative; display: inline-block; margin-right: 20px;}
.join_inner .hw_box .rdi2 .radio_box2:last-child{margin-right: 0;}
.join_inner .hw_box .rdi2 .radio_box2 > input[type="radio"] + label {
  display: block;
  width: auto; height: 22px; line-height: 22px; padding-left: 25px;
  background-image: url(../images/icon_radio_off.png); background-position: left center;
  background-repeat: no-repeat; background-size: 18px; font-size: 14px
}
.join_inner .hw_box .rdi2 .radio_box2 > input[type="radio"]:checked + label {
  background-image: url(../images/icon_radio_on.png);
  background-size: 18px;
}

.join_inner .hw_box .rdi2 .radio_box2 > input[type="radio"] {
  position: absolute;  z-index: 10; opacity: 0;
  width: 100%;height: auto;letter-spacing: 0; margin: 0;
  border: none;  background: none;
  vertical-align: middle;
  -webkit-appearance: none;
  -ms-appearance: none;
}


.radio_box > input[type="radio"] { margin: 0; left: auto; top: auto; bottom: auto; right: auto;}
.radio_box > input[type="radio"] + label {display: block; width: 100%; height: 44px;line-height: 44px; padding-left: 0; font-size: 14px; text-align: center; font-weight: 400;}
.radio_box > input[type="radio"]:checked + label {background: rgb(151, 151, 151); color:#fff;}
.radio_box.correct > input[type="radio"]:checked + label {background: rgb(255, 185, 0); color:#fff;}
.join_inner .hw_box2{background: #fff; border-radius: 12px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); padding: 30px; margin-top: 8px; position: relative;}
.join_inner .hw_box2 > h5{font-size: 16px; padding-bottom: 10px;}
.join_inner .hw_box2 > p{padding-left: 22px; background: url(../images/msg.svg) left top no-repeat; font-size: 13px; line-height: 18px; background-size: 16px; color: rgb(25, 25, 25);}
.join_inner .hw_box2 > p.point{margin-top: 10px; color: rgb(85, 85, 85);}
.join_inner .hw_box2 > ul{width: 100%;}
.join_inner .hw_box2 > ul.tbg_08{padding-bottom: 8px;}
.join_inner .hw_box2 > ul.ttg_24{padding-top: 24px;}
.join_inner .hw_box2 > ul > li{width: 100%; border-bottom: 1px solid rgb(25, 25, 25); position: relative; margin-top: 10px; font-size: 0;}
.join_inner .hw_box2 > ul > li.none_bd{border-bottom: 0;}
.join_inner .hw_box2 > ul > li.disabled{opacity: 0.5;}
.join_inner .hw_box2 > ul > li:first-child{margin: 0;}
.join_inner .hw_box2 > ul > li:first-child > p{background: url(../images/icon_f1.png) 2px 6px no-repeat; background-size: 20px  ;}
.join_inner .hw_box2 > ul > li:nth-child(2) > p{background: url(../images/iconCake.svg) 2px 6px no-repeat;}
.join_inner .hw_box2 > ul > li:nth-child(4) > p{background: url(../images/iconGender.svg) 2px 7px no-repeat;}
.join_inner .hw_box2 > ul > li > p{background: url(../images/iconDog.svg) 2px 7px no-repeat; display: inline-block; width: 60%; height: 32px; line-height: 32px; padding-left:36px; padding-right: 10px; margin-bottom: 10px; font-size: 16PX; color: #222; vertical-align: middle;}
.join_inner .hw_box2 > ul > li > p.in_num{background: url(../images/iconNumber.svg) 2px 6px no-repeat !important;}
.join_inner .hw_box2 > ul > li.none_bottom > p.in_num{margin-bottom: 0;}
.join_inner .hw_box2 > ul > li > p.w_50{width: 50%; vertical-align: middle;}
.join_inner .hw_box2 > ul > li .dog{width: 100%; background: url(../images/iconDog.svg) 2px 7px no-repeat; padding-left:36px; padding-right: 0px; padding-bottom: 10px;}
.join_inner .hw_box2 > ul > li .dog .select2-chosen{font-weight: 600 !important; line-height: 35px !important;}
.join_inner .hw_box2 > ul > li .sel_ar{display: inline-block; width: 100%;  vertical-align: middle;}
.join_inner .hw_box2 > ul > li .rdi{ width: 50%; display: inline-block; vertical-align: middle; margin-bottom: 10px; text-align: right;}
.join_inner .hw_box2 > ul > li .rdi .radio_box2 {position: relative; display: inline-block; margin-right: 20px;}
.join_inner .hw_box2 > ul > li .rdi .radio_box2:last-child{margin-right: 0;}
.join_inner .hw_box2 > ul > li .rdi .radio_box2 > input[type="radio"] + label {
  display: block;
  width: auto; height: 22px;line-height: 22px; padding-left: 25px;
  background-image: url(../images/icon_radio_off.png); background-position: left center;
  background-repeat: no-repeat; background-size: 18px; font-size: 14px
}
.join_inner .hw_box2 > ul > li .rdi .radio_box2 > input[type="radio"]:checked + label {
  background-image: url(../images/icon_radio_on.png);
  background-size: 18px;
}

.join_inner .hw_box2 > ul > li .rdi .radio_box2 > 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; margin: 0;
  border: none;  background: none;
  vertical-align: middle;
  -webkit-appearance: none;
  -ms-appearance: none;
}
.join_inner .hw_box2 > ul > li > input{padding: 10px 36px 10px; border: 0; font-size: 16px; font-weight: 400; line-height: 1; height: auto;}
.join_inner .hw_box2 > ul > li > input.name{background: url(../images/iconName.svg) 3px center no-repeat; }
.join_inner .hw_box2 > ul > li > input.in_num{background: url(../images/iconNumber.svg) 2px center no-repeat; }
.join_inner .hw_box2 > ul > li > input.in_num2{background: url(../images/iconNum.svg) 2px center no-repeat; }
.join_inner .hw_box2 > ul > li > input.in_car{background: url(../images/icon_f2.png) 2px center no-repeat;  background-size: 24px;}
.join_inner .hw_box2 > ul > li > input.phone_num{background: url(../images/iconPhone.svg) 6px center no-repeat; }
.join_inner .hw_box2 > ul > li > input.mail{background: url(../images/iconmail.svg) 2px center no-repeat; }
.join_inner .hw_box2 > ul > li > input.date{background: url(../images/iconDate.svg) 2px center no-repeat; display: inline-block; width: 50%; padding-right: 10px; font-size: 14PX; }
.join_inner .hw_box2 > ul > li > input.date2{background: url(../images/icon_b.png) 2px center no-repeat; display: inline-block; width: 50%; padding-left: 18px; font-size: 14PX;}
.join_inner .hw_box2 > ul > li > input.date3{display: inline-block; width: 40%; height: 32px; line-height: 32px; padding-left: 18px; font-size: 14PX; padding: 0px 10px; background: rgb(247, 247, 247); border-radius: 6px; text-align: center; margin-bottom: 10px; vertical-align: middle;}
.join_inner .hw_box2 > ul > li.none_bottom > input.date3{margin-bottom: 0;}
.join_inner .hw_box2 .date_box{width: 100%; padding:10px 0 10px 36px; background: url(../images/iconDate.svg) 2px 7px no-repeat;}
.join_inner .hw_box2 .date_box .inner{width: 100%; display: block; padding-bottom: 10px; border-bottom: 1px solid rgb(216, 216, 216);}
.join_inner .hw_box2 .date_box .inner.sec{padding: 10px 0; border: 0;}
.join_inner .hw_box2 .date_box .inner > span{display: inline-block; width: 30%;}
.join_inner .hw_box2 .date_box .inner > span:first-child{display: inline-block; width: 50%;}
.join_inner .hw_box2 .date_box .inner > span > input.date{ display: block; padding: 0 5px !important; height: 32px; font-size: 13PX; border: 0; background: rgb(247, 247, 247); border-radius: 6px; text-align: center !important; line-height: 32px !important; vertical-align: middle;}
.join_inner .hw_box2 .date_box .inner > span > input.date2{ display: block; padding: 0px; height: 32px; font-size: 13PX; border: 0; background: rgb(247, 247, 247); border-radius: 6px; margin-left:6px ; text-align: center; line-height: 32px; vertical-align: middle;}
.join_inner .hw_box2 .date_box .inner > p{width: calc(20% - 7px); display: inline-block; vertical-align: middle; text-align: right; font-size: 14PX;}

.join_inner .hw_box2 > ul > li > span{width: 16px; height: 21px; background: url(../images/checkOff.svg) center center no-repeat; background-size: 16px; position: absolute; top: 10px; right:4px; display: none;}
.join_inner .hw_box2 > ul > li > span.count_up{width: auto; height: auto; font-size: 16px; background: none; color: rgb(231, 78, 15); }
.join_inner .hw_box2 > ul > li.ok > span{background: url(../images/checkOn.svg) center center no-repeat; background-size: 16px; display:inline-block; }
.join_inner .hw_box2 > ul > li.fail{border-bottom: 1px solid rgb(201, 0, 0);}
.join_inner .hw_box2 > ul > li.fail > span{background: url(../images/iconX.svg) center center no-repeat; background-size: 14px; display:inline-block; }

.info_txt{font-size: 13px; color: rgb(85, 85, 85); line-height: 18px; padding: 24px 8px;}

.modal{width: calc(100% - 56px); background: #fff; border-radius: 12px; overflow: hidden; display: none;}
.modal .modal_in{padding: 30px; border-bottom: 1px solid rgb(233, 233, 233);}
.modal .modal_in > p{font-size: 15px; line-height: 20px; color: rgb(25, 25, 25);}
.modal .modal_in > span{font-size: 14px; line-height: 18px; color: rgb(85, 85, 85); display: block;}
.modal > button{width: 50%; background: #fff; color: rgb(25, 25, 25); font-size: 16px; height: 60px;}
.modal > button:first-child{border-right: 1px solid rgb(233, 233, 233);}
.modal > button.full_btn{width: 100%; border: 0;}
.modal > button.close{ width: 14px; height: 14px; position: absolute; top: 20px; right: 20px;}
.modal .modal_in2{padding: 30px 20px;}
.modal .modal_in2 .md_sh{width: 100%;}
.modal .modal_in2 .md_sh > h4{font-size: 15px; color: rgb(25, 25, 25);}
.modal .modal_in2 .md_sh > p{font-size: 14px; padding-top: 8px; color: rgb(85, 85, 85);}
.modal .modal_in2 .md_sh .sh_box{width: 100%; position: relative; padding-right: 50px; border: 1px solid rgb(224, 224, 224);  border-radius: 6px; margin-top: 16px; overflow: hidden;}
.modal .modal_in2 .md_sh .sh_box > input{width: 100%; height: 46px; font-size: 14px; padding: 0 12px;}
.modal .modal_in2 .md_sh .sh_box > input::placeholder{color: rgb(211, 211, 211);}
.modal .modal_in2 .md_sh .sh_box > button{width: 25px; height: 25px; position: absolute; top: 12px; right: 16px;}
.modal .modal_in2 .sh_cont{width: 100%; margin-top:20px; min-height: 231px;}
.modal .modal_in2 .sh_cont .top_text{font-size: 14px; color: rgb(85, 85, 85); margin-bottom: 8px;}
.modal .modal_in2 .sh_cont .top_text > em{font-weight: bold; color: rgb(255, 185, 0);}
.modal .modal_in2 .sh_cont .sc_box{border-top: 1px solid rgb(25, 25, 25); border-bottom: 1px solid rgb(25, 25, 25); height: 202px; overflow-y: auto;}
.modal .modal_in2 .sh_cont .sc_box > ul{width: 100%;}
.modal .modal_in2 .sh_cont .sc_box > ul > li{width: 100%; padding: 16px 0; border-bottom: 1px solid rgb(244, 244, 244);}
.modal .modal_in2 .sh_cont .sc_box > ul > li > p{font-size: 13px; color: rgb(85, 85, 85); margin-top: 8px;}
.modal .modal_in2 .sh_cont .sc_box > ul > li > p > span{display: inline-block; padding-left: 20px; background: url(../images/iconDot2.svg) 8px center no-repeat;}
.modal .modal_in2 .sh_cont .sc_box > ul > li > p:first-child{font-size: 14px; color: rgb(25, 25, 25); margin: 0;}
.modal .modal_in2 .sh_cont .paging{width: 100%; padding: 16px 0 0; text-align: center;}
.modal .modal_in2 .sh_cont .paging > button{width: 18px; height: 18px; margin: 0 3px; color: rgb(85, 85, 85);font-size: 16px;}
.modal .modal_in2 .sh_cont .paging > button.on{color: rgb(25, 25, 25); font-weight: 700; }
.modal .modal_in2 .sh_cont .paging > button > img{width: 7px;}


.modal .modal_in2 .sh_cont > p{font-size: 14px; color: rgb(25, 25, 25); text-align: center; line-height: 20px; padding-top: 80px;}



















.line_box{padding: 20px; border: 1px solid rgb(233, 233, 233); border-radius: 12px; width: calc(100% - 32px); margin: 30px auto 0;}
.line_box > h5{background: url(../images/msg2.svg) left center no-repeat; padding-left: 22px; font-size: 13px; line-height: 18px; color: rgb(25, 25, 25); font-weight: 600;}
.line_box > p{padding-top: 6px; line-height: 18px; font-size: 13px; color: rgb(85, 85, 85);}

.address_box{width: 100%; background: url(../images/iconLocation.svg) 6px 18px no-repeat;  padding: 10px 0 20px 36px;}
.address_box .in_box{width: 100%; display: table;}
.address_box .in_box > span{display: table-cell; vertical-align: top; width: 100px;}
.address_box .in_box > span:first-child{width:calc(100% - 94px); padding-right: 6px;}
.address_box .in_box > span > input{width: 100%; height: 42px;border: 1px solid rgb(224, 224, 224); border-radius: 6px; font-size: 14px;}
.address_box .in_box > span > button{width: 100%; display: block; height: 42px; background: rgb(255, 185, 0); border-radius: 6px; font-size: 14px; color: #fff;}
.address_box .in_box2{width: 100%; padding-top: 6px;}
.address_box .in_box2 > input{width: 100%; height: 42px;border: 1px solid rgb(224, 224, 224); border-radius: 6px; font-size: 14px;}
.address_box .in_box2 > input:disabled{background: rgb(247, 247, 247); color: rgb(177, 177, 177);}

.filebox {
    display: block;
    text-align: center;
    
  } 
  
  .filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
    
  }
  
  .filebox label {
    margin: 10px auto 0 ;
    display: inline-block;
    width: 122px; height: 34px;
    color: #999;
    font-size: 14px;
    background-color: rgb(151, 151, 151);
    cursor: pointer;
    border: 0;
    border-radius: 8px;
    line-height: 34px;
    color: #fff;
  }
  
  /* named upload */
  .upload-name {
    display: inline;
    position: absolute;
    width: calc(100% - 200px);
    top: 21px; right: 30px;
    text-align: right;
    background: none;
    padding:0;
    border: 0px solid #ebebeb;
    height: auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-decoration: underline;
    
    
  }
  .filebox2 {display: block;
    text-align: center;}
  .filebox2 > div{text-align: center;}
  .filebox2 > div > input{display: none;}
  .filebox2 label {
    margin: 0px auto 0 ;
    display: inline-block;
    width: 122px; height: 34px;
    color: #999;
    font-size: 14px;
    background: rgb(255, 185, 0);
    cursor: pointer;
    border: 0;
    border-radius: 8px;
    line-height: 34px;
    color: #fff;
  }

  .filebox2 > span{
    position: relative; display: inline-block; text-align: center; top: 0; right: auto; margin-bottom: 10px; margin-top: 10px;
    display: inline-block;
    font-size: 13px;
    background: none;
    padding:0;
    border: 0px solid #ebebeb;
    height: auto;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-decoration: underline;
    line-height: 16px;
    padding-left: 16px;
    background: url(../images/iconFile.svg) left center no-repeat;
  }

  .comp{width: 100%; text-align: center;}
  .comp .img_box{width: 59px; margin: 17px auto 0; }
  .comp > h4{font-size: 22px; color: rgb(25, 25, 25); padding: 24px 0 16px;}
  .comp > p{margin-top: 8px; font-size: 14px; color: rgb(85, 85, 85);}


  .info_page{width: 100%; background: none; padding: 40px 16px 30px;}
  .info_page > h3{font-size: 18px; color: rgb(25, 25, 25); font-weight: 400; padding: 0 8px; line-height: 26px;}
  .info_page > h3 > strong{font-weight: 600;}
  .info_page > p{ padding: 8px 8px; font-size: 13px; line-height: 18px;  color: rgb(25, 25, 25);}
  .info_page .whbox{ width: 100% ; background: #fff; border-radius: 12px;  box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); padding: 30px 20px ; margin-top: 24px;}
  .info_page .whbox > h4{font-size:16px; line-height: 28px; color: rgb(25, 25, 25);}
  .info_page .whbox .table-out{width: 100%; border-top: 1px solid rgb(216, 216, 216); margin-top: 15px;}
  .info_page .whbox .table-out > table{padding: 0; margin: 0; width: 100%;}
  .info_page .whbox .table-out th{height: 50px; background: rgb(243, 243, 243) ; text-align: left; padding-left: 15px ; font-size: 14px; color: rgb(25, 25, 25); width: 112px; font-weight: 400; border-bottom: 1px solid rgb(216, 216, 216);;}
  .info_page .whbox .table-out th.bold{font-weight: 600;}
  .info_page .whbox .table-out td.bold{font-weight: 600;}
  .info_page .whbox .table-out td{height: 50px; background: none ; text-align: right; padding-right: 15px ;  font-size: 14px; color: rgb(25, 25, 25); border-bottom: 1px solid rgb(216, 216, 216);}


  .info_s2{width: 100%; background: #fff; padding: 26px 24px 30px; margin-top: 8px;}
  .info_s2 > h4{padding-left: 25px; background: url(../images/iconPaper.svg) left top no-repeat; font-size: 16px; color: rgb(25, 25, 25);}
  .info_s2 > ul{width: 100%; padding-top: 16px;}
  .info_s2 > ul > li{width: 100%; display: table; margin-top: 16px; } 
  .info_s2 > ul > li.dash{margin-top: 0; line-height: 20px; font-size: 13px; color: rgb(25, 25, 25);}
  .info_s2 > ul > li:first-child{margin: 0;}
  .info_s2 > ul > li > span{display: table-cell; text-align: right; font-size: 13px; color: rgb(25, 25, 25);}
  .info_s2 > ul > li > span:first-child{text-align: left;}
  .info_s2 > ul > li > span > a{padding-right: 13px; background: url(../images/iconArrow.svg) center right no-repeat; background-size: 6px ;}
  .info_s2 > p{font-size: 13px; padding-top: 24px; color: rgb(85, 85, 85);}

  .btn_box{padding-top: 16px; text-align: center;}
  .btn_box > button{width: 122px; height: 34px; background: rgb(255, 185, 0); color: #fff; font-size: 14px; border-radius: 8px;}

  .in_button{padding-top: 16px;}
  .in_button > button{width: 100%; height: 58px; border-radius: 12px; background: rgb(255, 185, 0); color: rgb(25, 25, 25); font-size: 16px; font-weight: bold;}

/*footer */

footer{background: rgb(241, 241, 241); width: 100%;   margin-top: 50px;}
footer.type2{margin-top: 0; padding-bottom: 60px;}
footer.bottom{position: absolute; left: 0; bottom:0;}
footer.bottom2{padding-top: 80px; border: 0;}
footer .foot-top{padding: 24px 0px; margin: 0 auto; border-bottom: 1px solid rgb(224, 224, 224); width: calc(100% - 40px);}
footer .foot-top > ul{width: 100%; display: table; }
footer .foot-top > ul > li{ display: table-cell;text-align: center;  line-height: 1; background: url(../images/iconDot.svg) center left no-repeat;  }
footer .foot-top > ul > li:first-child{background: none;}
footer .foot-top > ul > li > span{font-size: 11px; cursor: pointer; color:rgb(85, 85, 85);}
footer .foot-top > ul > li > span.btn_company_info{display: inline-block; color: rgb(25, 25, 25); padding-right: 15px; background: url(../images/iconArrowdw.svg) right no-repeat; background-size:8px; }
footer .foot-top > ul > li > span.btn_company_info.on{display: inline-block; padding-right: 15px; background: url(../images/iconArrowup.svg) right no-repeat; background-size:8px; }
footer .foot-top > ul > li > span.btn_customer_info{display: inline-block;  color: rgb(25, 25, 25); padding-right: 15px; background: url(../images/iconArrowdw.svg) right no-repeat; background-size:8px; }
footer .foot-top > ul > li > span.btn_customer_info.on{display: inline-block; padding-right: 15px; background: url(../images/iconArrowup.svg) right no-repeat; background-size:8px; }
footer .foot-top > ul > li > a{font-size: 12px; color: #999999;}
/* footer .foot-top > ul > li > a.privacy{color: #333; font-weight: bold;} */

footer .copy_right{font-size: 12px; padding:20px 0 ; text-align: center; font-weight: normal;  color: #999999;}
footer .foot_info{padding: 20px 20px 0px; font-size: 11px; display: none;}
footer .foot_info .compm{padding-bottom: 0px; color: rgb(85, 85, 85); text-align: left; margin: 0;}
footer .foot_info .compm > p {padding-bottom: 0px; margin: 0;}
footer .foot_info .compm > p.tit{font-weight: nomal; padding-bottom: 0px;}
footer .foot_info .compm > p.tx_t{padding-top: 8px;}
footer .foot_info .compm > p.tx_b{padding-top: 8px; color: rgb(184, 184, 184);}
footer .foot_info p > span {display: inline-block; padding: 0 8px; vertical-align: top; }
footer .foot_info p > span:first-child{background: none; padding-left: 0;}
footer .foot_info p > span:lest-child{padding-right: 0;}
footer .foot_info > strong{padding-top: 7px; display: block; font-weight: normal; color: #aaaaaa}
footer .foot_info > div{ display: block; font-weight: normal; }

footer .foot_info2{padding: 20px 20px 0px; font-size: 11px; display: none;}
footer .foot_info2 .compm{padding-bottom: 0px; color: #999999; padding: 0; text-align: left;}

footer .foot_info2 .compm > p.tit{font-weight: 700; margin-top: 0; font-size: 14px; padding-bottom: 6px;}
footer .foot_info2 .compm > p.tit > span{color: #333; font-size: 14px; font-weight: 700;}
footer .foot_info2 .compm > p.mail{margin-bottom: 6px0; width: 100%; display: table;}
footer .foot_info2 .compm > p.mail > span{display: table-cell;}
footer .foot_info2 .compm > p.mail > span:first-child{width: 50px;}
footer .foot_info2 .compm > p.time{margin-top: 0; width: 100%; display: table;}
footer .foot_info2 .compm > p.time > span{display: table-cell;}
footer .foot_info2 .compm > p.time > span:first-child{width: 50px;}
footer .foot_info2 p > span {display: inline-block; padding: 0 8px; vertical-align: top;}
footer .foot_info2 p > span:first-child{background: none; padding-left: 0;}
footer .foot_info2 p > span:lest-child{padding-right: 0;}
footer .foot_info2 > strong{padding-top: 7px; display: block; font-weight: normal; color: #aaaaaa}
footer .foot_info2 > div{padding-top: 10px; display: block; font-weight: normal; }





@media (max-width:320px){
    .drawer-menu .lnb_menu > ul{padding-top: 20px; padding-bottom: 20px; background: url(../images/bg_bd.jpg) center bottom repeat-x;}
    .drawer-menu .lnb_menu > ul:last-child{background: none;}
    .drawer-menu .lnb_menu > ul > h3{width: 100%; font-size: 20px; color: #fff; font-weight: normal; margin-bottom: 10px; }
    .drawer-menu .lnb_menu > ul > li{width: 100%; margin-bottom: 5px; }
    .purchase_info > p{font-size: 12px; color: #606060; padding-left: 13px; text-indent: -13px; letter-spacing: -0.8px; padding-top: 10px;}    
    .join_inner .hw_box{background: #fff; border-radius: 12px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); padding: 20px 15px; margin-top: 24px;}
    .join_inner .hw_box2{background: #fff; border-radius: 12px; box-shadow: 0 0 6px rgba(0, 0, 0, 0.06); padding: 20px 15px; margin-top: 8px; position: relative;}
    .join_inner .hw_box2 .date_box .inner > input.date{padding: 0 5px;}
    .join_inner .hw_box2 .date_box .inner > input.date2{padding: 0 5px;}
    .filebox2 > span{position: relative; display: inline-block; text-align: center; top: 0; right: auto; margin-bottom: 10px; margin-top: 10px;
      display: inline-block;}

      .join_inner .hw_box2 > ul > li > p{background: url(../images/iconDog.svg) 2px 7px no-repeat; display: inline-block; width: 162px; height: 32px; line-height: 32px; padding-left:36px; padding-right: 10px; margin-bottom: 10px; font-size: 16PX; color: #b6b6b6; vertical-align: middle;}  
      .join_inner .hw_box2 > ul > li > input.date3{display: inline-block; width: calc(100% - 162px); height: 32px; padding-left: 18px; font-size: 14PX; padding: 0px 10px; background: rgb(247, 247, 247); border-radius: 6px; text-align: center; margin-bottom: 10px;}
    }