@charset "utf-8";
/* Reset */
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
body {background:#fff; min-width:320px; -webkit-text-size-adjust:none;word-wrap:break-word; word-break:break-all;}
body,input,select,textarea,button {border:none; font-size:13px; font-family: 'Nanum Gothic', '맑은고딕',sans-serif; color:#333}
ul,ol,li{list-style:none;}
table{border-spacing:0; }
img,fieldset{border:0;}
address,cite,code{font-style:normal;font-weight:normal;}
em {font-style:normal; }
label,img,input,select,textarea,button{vertical-align:middle; color: inherit; font: inherit;}
.hide, legend {padding: 0; margin: 0; font-size: 0; width: 0; height: 0; line-height: 0; text-indent: -9999px;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:inherit; text-decoration:none;}
button {cursor: pointer; color: #333; background-color: transparent;}

html {}
body {font-size:13px; color:#333333; font-weight:400; letter-spacing:-0.05em; line-height:1.4;}
table {border-collapse: collapse;border-spacing: 0}

* {-webkit-box-sizing: border-box !important;-moz-box-sizing: border-box !important;box-sizing: border-box !important;}
*:before,*:after {-webkit-box-sizing: border-box !important;-moz-box-sizing: border-box !important;box-sizing: border-box !important;}

/* Form */
textarea {border:1px solid #d3d3d3;}
select {padding-left: 10px; height:42px; border-radius:3px;}
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file],
input[type=url],
input[type=number],
input[type=date],textarea {border-radius:3px; font-size:13px; color:#333333; border:1px solid #dddddd; background-color:#ffffff; transition: all 0.5s; box-sizing: border-box; vertical-align:middle; }
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file],
input[type=url],
input[type=number],
input[type=date]  {padding: 0  0 0 10px; height:35px;}
textarea {padding:10px; }



input::-webkit-input-placeholder {color:#888888;}
input:-moz-placeholder {color:#888888; opacity: 1;}
input::-moz-placeholder {color:#888888; opacity: 1;}
input::-ms-input-placeholder {color:#888888;}
input:-ms-input-placeholder {color:#888888;}
input::input-placeholder {color:#888888;}

textarea::-webkit-input-placeholder {color:#888888;}
textarea:-moz-placeholder {color:#888888; opacity: 1;}
textarea::-moz-placeholder {color:#888888; opacity: 1;}
textarea::-ms-input-placeholder {color:#888888;}
textarea:-ms-input-placeholder {color:#888888;}
textarea::input-placeholder {color:#888888;}




textarea:focus,
input:focus {border:1px solid #bc449f; outline: none; }
label {}

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly],
input[type=search][readonly],
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{height:35px; border-color: #dddddd; color:#333333; -webkit-appearance:none; font-size:13px; padding: 0 10px; background-color: #fff; }
input[type=text]::-ms-clear {display: none; }
select{-webkit-appearance:none; -moz-appearance:none; appearance:none; }
select::-ms-expand{display:none; }
select {min-width:90px; height: 35px; padding-right:30px; background: url('../images/icon_sel_arr.png') no-repeat right 9px center #fff; background-size:11px auto; border: 1px solid #dddddd; color:#333333; -moz-appearance: none; -webkit-appearance: none; appearance: none; }
select[disabled] {background-color: #fff !important;}



textarea[readonly],
textarea[disabled]{padding:12px; font-size:15px; color:#333333; font-weight:normal; line-height:140%; height:78px; background:#f6f7f8; border:1px solid #dddddd;}
.clear {clear:both;}
.clear:after {content:""; display:block; clear:both;}

/* 인풋스타일 (날짜) */
.inp_date { background: url('../images/icon_date.png') no-repeat right 13px center; }
.icon_from { display: inline-block; margin: 0 12px; font-style: normal; }
.number_stepper {display:inline-block; position:relative; width:101px; height:35px; padding:0 33px; border:1px solid #999999; border-radius:3px; font-size:0;}
.number_stepper button {position:absolute; top:-1px; width:33px; height:35px; background:no-repeat center #999999;}
.number_stepper input {width:100%; height:33px !important; border:0; text-align:center; padding:0;}
.number_stepper .btn_minus {left:-1px; border-radius:3px 0 0 3px; background-image: url('../images/icon_minus.png'); background-size:13px auto;}
.number_stepper .btn_plus {right:-1px; border-radius:0 3px 3px 0; background-image: url('../images/icon_plus.png'); background-size:13px auto;}



/* 인풋 스타일 ( 체크박스, 라디오 )*/
.checkbox {display:inline-block; position:relative;}
.checkbox input {position:absolute; left:0; top:50%; width:22px; height:22px; margin-top:-11px; opacity:0; appearance:none; -webkit-appearance:none; -moz-appearance:none; outline:0}
.checkbox label {display:inline-block; padding-left:31px; font-size:15px; color:#585858; line-height:35px;}
.checkbox label:before {position:absolute; top:50%; left:0; width:22px; height:22px; margin-top:-11px; background:url('../images/basic/un_check.png') no-repeat center; content:'';}
.checkbox input:checked + label:before {background-image:url('../images/basic/check.png');}
.checkbox input:focus + label:before {outline:1px dotted #000}
.checkbox +.checkbox {margin-left:20px;}
.checkbox.t_none {width:22px;}
.checkbox.t_none label {overflow:hidden; text-indent:-999px; text-align:left;}

.radio {display:inline-block; position:relative;}
.radio input {position:absolute; left:0; top:0px; width:20px; height:20px; border:0 !important; appearance:none; -webkit-appearance:none; -moz-appearance:none; outline:0}
.radio label {display:inline-block; padding-left:27px; font-size:13px; color:#585858; line-height:20px;}
.radio label:before {position:absolute; top:0px; left:0; width:20px; height:20px; border-radius:100%; background:url('../images/icon_radio.png') no-repeat center; background-size:contain; content:'';}
.radio input:checked + label:before {background-image:url('../images/icon_radio_on.png');}
.radio input:focus + label:before {outline:1px dotted #000}
.radio +.radio {margin-left:15px;}








.chk_list li+li {margin-top:8px;}

.filebox_list li+li {margin-top:10px;}

.filebox {position:relative; padding-right:82px;}
.filebox .btn {position:absolute; top:0; right:0; margin:0; width:79px !important; padding:0 !important;}
.filebox input {width:100%; background:#fff !important;}
.filebox+.filebox {margin-top:5px;}
.filebox .upload_hidden {position: absolute; top:-10px; left:0; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}

.tel_wrap {overflow:hidden; display:inline-block;}
.tel_wrap select,
.tel_wrap input {float:left; width:31%;}
.tel_wrap .bar {float:left; width:3.5%; line-height:35px; text-align:center;}
.tel_wrap .bar:after {display:none;}


/* 본문 바로가기 */
#skipnavigation a {position:absolute;left:-3000%;}
#skipnavigation a:focus {display:block;left:0;top:0;z-index:10000000000;width:100%;height:30px;line-height:30px;background:#3290ff;color:#fff;text-align:center;}




/* 사용자 페이지 공통 css */
/* 정렬 */
.f_left {float: left; }
.f_right {float: right; }
.con_box {margin: 0 15px; }



/* text-align */
.text_left {text-align: left !important; }
.text_center {text-align: center !important; }
.text_right {text-align: right !important; }

/* text 말줄임표 */
.text_over {white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

/* display */
.dis_inblock {display: inline-block; }

.o_hidden {overflow:hidden;}

/* Hidden Type */
.skip{position:absolute;top:0;height:0;visibility:hidden;font-size:0}
.sr_only {position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
.blind {overflow: hidden; color: transparent; white-space: nowrap;}
.m_visible {display:none;}
.d_none {display:none;}



.relative {position:relative;}
.abs_r {position:absolute; top:0; right:0;}


/* 가로사이즈 */
.w_140 {width:140px;}
.wp_30 {width:30%;}
.wp_30_password {width:20%;  -webkit-text-security:disc;}
.wp_60 {width:60%;}
.wp_70 {width:70%;}
.wp_80 {width:80%;}
.wp_90 {width:90%;}


.w_full {width:100% !important; }
.w_half {width:50% !important;}
.fsize1 {width:100%; max-width:210px;}



/* margin */
.mt_5 {margin-top: 5px;}
.mt_10 {margin-top: 10px;}
.mt_15 {margin-top: 15px;}
.mt_20 {margin-top: 20px;}
.mt_25 {margin-top: 25px;}
.mt_30 {margin-top: 30px;}
.mt_40 {margin-top: 40px;}
.mb_10 {margin-bottom: 10px;}
.ml_5 {margin-left:5px;}
.ml_10 {margin-left:10px;}
.ml_20 {margin-left:20px;}
.mr_5 {margin-right:5px;}
.mr_10 {margin-right:10px;}
.mr_20 {margin-right:20px;}


/* color */
.fc_blue {color:#3a7afe !important;}




.swiper-button-prev:after,
.swiper-button-next:after {display:none;}



#wrap {overflow:hidden; width:100%; min-width:320px;}

#header {position:fixed; top:0; left:0; z-index:10000; width:100%;}
.header_top {position:relative; height:61px; border-bottom:1px solid #dddddd; background:#fff;}
.header_top .btn_login {position:absolute; left:10px; top:10px; z-index:100; height:24px; padding-top:20px; font-size:13px; line-height:24px; color:#333333; font-weight:700; background:url('../images/ico_login.png') no-repeat center top; background-size:21px auto;}
.header_top .logout {position:absolute; left:10px; top:10px;}
.header_top .logout .name {display:inline-block; vertical-align:top; font-size:14px; font-weight:700; padding-top:10px; padding-right:5px;}
.header_top .btn_logout {display:inline-block; height:24px; padding-top:20px; font-size:13px; line-height:24px; color:#333333; font-weight:700; background:url('../images/ico_logout.png') no-repeat center top; background-size:21px auto;}
.header_top .btn_prev {/*display:none; */position:absolute; left:17px; top:50%; width:25px; height:24px; margin-top:-12px; background:url('../images/icon_prev.png') no-repeat center; background-size:contain;}
.header_top .btn_shop {position:absolute; right:17px; top:50%; width:24px; height:24px; margin-top:-12px; background:url('../images/icon_shop.png') no-repeat center; background-size:contain;}
.header_top .btn_cart {display:none; position:absolute; right:17px; top:50%; width:27px; height:27px; margin-top:-14px; background:url('../images/icon_cart.png') no-repeat center; background-size:contain;}
.header_top .btn_close {position:absolute; right:17px; top:50%; width:18px; height:18px; margin-top:-9px; background:url('../images/icon_close.png') no-repeat center; background-size:contain;}
.logo {width:125px; margin:auto;}
.logo a {display:block; height:60px; background:url('../images/logo.png') no-repeat center; background-size:contain;}

/*.member .header_top .btn_login {display:none;}*/
.member .header_top .btn_shop {display:none;}
.member .header_top .btn_prev {display:block;}

/*.cart .header_top .btn_login {display:none;}*/
.cart .header_top .btn_shop {display:none;}
.cart .header_top .btn_cart {display:block;}

/*.type4 .header_top .btn_login {display:none;}*/
.type4 .header_top .btn_shop {display:none;}
.type4 .header_top .btn_prev {display:block;}
.type4 .header_top .btn_cart {display:block;}

.type5 .header_top .btn_prev {display:none;}


#main {margin-top:60px;}

.fmenu_1 {overflow:hidden; background:#333333;}
.fmenu_1 li {float:left; width:33.333%;}
.fmenu_1 li+li {border-left:1px solid #555555}
.fmenu_1 a {display:block; line-height:40px; font-size:13px; color:#fff; text-align:center;}

.fmenu_2 {overflow:hidden;}
.fmenu_2 li {float:left; position:relative;}
.fmenu_2 li+li {margin-left:13px;}
.fmenu_2 li+li:before {position:absolute; top:50%; left:-7px; width:1px; height:10px; margin-top:-5px; background:#cccccc; content:'';}
.fmenu_2 a {display:block; font-size:13px; color:#000000; text-align:center;}

#footer {padding-bottom:70px;}
#footer .inbox {padding:15px;}
.address {margin-top:12px; font-size:12px; color:#666666; line-height:1.6;}


#quick {position:fixed; left:0; right:0; bottom:0; z-index:101; text-align:center; background:#f6f6f6; box-shadow: 0px 0px 3px rgba(0,0,0,0.5);}
#quick li {float:left; width:25%;}
#quick li a {display:block; padding:3px 0 10px; font-size:12px; line-height:1;}
#quick li a:before {display:block; width:40px; height:35px; margin:auto; background:url('../images/icon_quick.png') no-repeat; background-size:auto 100%; content:'';}
#quick li.s2 a:before {background-position:10% 0;}
#quick li.s3 a:before {background-position:20% 0;}
#quick li.s4 a:before {background-position:30% 0;}


#side_menu {position:fixed; top:0; right:-100%; bottom:0; z-index:10000; width:100%; overflow:auto; background:#fff; transition:right 0.4s;}
#side_menu.open {right:0;}
#side_menu .logo {position:relative; left:10px;}
.side_menu_qlink {overflow:hidden; padding:20px 20px 5px; border-top:1px solid #dddddd; border-bottom:1px solid #dddddd; text-align:center; background:#f5f5f5;}
.side_menu_qlink li {float:left; width:25%;}
.side_menu_qlink a {display:block; padding-bottom:15px; font-size:13px;}
.side_menu_qlink a:before {display:block; width:45px; height:45px; margin:0 auto 6px; background:url('../images/icon_side_menu_qlink.png') no-repeat; background-size:auto 100%; content:'';}
.side_menu_qlink .s2 a:before {background-position:10% 0;}
.side_menu_qlink .s3 a:before {background-position:20% 0;}
.side_menu_qlink .s4 a:before {background-position:30% 0;}
.side_menu_qlink .s5 a:before {background-position:40% 0;}
.side_menu_qlink .s6 a:before {background-position:50% 0;}
.side_menu_qlink .s7 a:before {background-position:60% 0;}
.side_menu_qlink .s8 a:before {background-position:70% 0;}

#gnb {position:relative; border-bottom:1px solid #dddddd;}
#gnb > ul {margin-bottom:-1px; padding-right:66.66%;}
#gnb > ul > li > a {display:block; border-bottom:1px solid #dddddd; border-right:1px solid #dddddd; padding-left:17px; font-size:15px; color:#333333; font-weight:700; line-height:48px; background:#f5f5f5;}
#gnb > ul > li.on .sub {display:block;}
#gnb > ul > li.on > a {color:#fff; background:#bc449f;}
#gnb .sub {position:absolute; top:8px; left:33.333%; display:none;}
#gnb .sub a {padding-left:25px; font-size:13px; line-height:33px;}

.etc_link {overflow:hidden; margin-top:13px; margin-left:17px;}
.etc_link li {float:left; position:relative;}
.etc_link li+li {margin-left:13px;}
.etc_link li+li:before {position:absolute; top:50%; left:-6px; width:1px; height:10px; margin-top:-5px; background:#cccccc; content:'';}
.etc_link a {display:block; font-size:13px; color:#333333; text-align:center;}





#best_product {padding:35px 12px; text-align:center; background:#f6f6f6;}
#best_product h2 {margin-bottom:15px; font-size:22px; color:#000; font-weight:800; line-height:1;}
#best_product .swiper-container {overflow:visible; padding:5px; padding-right:15px; margin-right:-15px;}
#best_product .swiper-slide {overflow:hidden; width:170px; padding-bottom:22px; border-radius:5px; border:1px solid #dddddd; background:#fff; box-shadow: 0px 0px 4px rgba(0,0,0,0.13);}
#best_product .img_wrap {position:relative; padding-bottom:100%;}
#best_product .img_wrap img {position:absolute; top:0; left:0; width:100%; height:100%;}
#best_product .txt {margin-top:-2px; font-size:14px; color:#000000; line-height:1.4;}
#best_product .swiper-pagination {position:relative; bottom:0; font-size:0; padding:0; margin-top:15px;}
#best_product .swiper-pagination-bullet {width:8px; height:8px; margin:0 4px; border-radius:4px; background:#dddddd; opacity:1; transition:all 0.4s;}
#best_product .swiper-pagination-bullet-active {width:18px; background:#333333;}

.btn_top {position:fixed; right:15px; bottom:80px; z-index:100;}
.btn_top img {width:60px;}