@charset "utf-8";

/* 팝업레이어 */
#hd_pop {display:none}

/* 상단 레이아웃 */
#hd {width:100%;}
#logo {float:none;text-align:center}

#hd_sch {display:none;}
.wrap_cen{position:relative; width:100%; margin:0 auto;}
.btn_close{position:absolute; right:0; top:32px;}

#tnb {display:none}

#hd_menu{display:none}

/*사이드 메뉴(left)*/
#side_menu_left{display:none;}

/*사이드 메뉴*/
#side_menu{display:none}

#visual_box{ margin: 0 auto;}
.visual01 img{display:block; max-width:100%; margin: 0 auto;}
/*slide 전체 */
/*.dot {cursor:pointer; height: 13px; width: 13px; margin: 0 2px; background-color: #663399; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease;} */
.visual01{display:none;}
.fade { -webkit-animation-name: fade; -webkit-animation-duration: 5s; animation-name: fade; animation-duration: 5s;}
@-webkit-keyframes fade {from {opacity: .8} to {opacity: 1}}
@keyframes fade {from {opacity: .8} to {opacity: 1}}

#hd_btn {display:block}
#hd_btn button{display:block;height:50px;width:50px;border:0;background:0;font-size:32px;vertical-align:top;float:left}
#btn_hdcate{position:absolute;top:30px;left:0}
#hd_btn .btn_cart a{display:inline-block;height:50px;line-height:50px;width:40px;border:0;background:0;text-align:center;font-size:32px;vertical-align:top;float:left}
#hd_btn .btn_cart a{position:absolute;top:30px;right:5px}
#hd_btn .cart-count {position: absolute;top: 20%;right: 0px;display: block;height: 16px;line-height: 16px;border-radius: 8px;background: #ff4444;font-size: 11px;color: #fff;padding: 0 5px;}

#category{display:none;position:fixed;top:0;height:100%;;z-index:99999;-webkit-backface-visibility: hidden;}
#category .ct_wr{width:260px;height:100%;overflow-y:auto;background:#fff;padding:15px;position:relative;z-index:199919;
	-webkit-box-shadow: 0 0 5px rgba(55,55,5,0.4));
    -moz-box-shadow: 0 0 5px rgba(55,55,5,0.4));
         box-shadow: 0 0 5px rgba(55,55,5,0.4);}
#category h3{text-align:center; line-height:20px; font-weight:bold; border-bottom:1px solid #f3f3f3;font-size:20px; padding:10px}
#category ul:after {display:block;visibility:hidden;clear:both;content:""}
#category .cate a{display:block;padding:0 10px;border-bottom:1px solid #f3f3f3}
#category .cate li{position:relative;line-height:40px;}
#category .cate li button{position:absolute;top:10px;right:0;background:url;border:0;width:20px;height:20px;overflow:hidden;border:0;background:url(../img/mobile/gnb_bg.png) no-repeat 50% 50%;text-indent:-9999px}
#category .cate li button.ct_cl{background:url(../img/mobile/gnb_bg2.png) no-repeat 50% 50%}
#category .sub_cate{display:none}
#category .sub_cate a{border-bottom:1px solid #efefef;background:url(../img/btn_next.gif) no-repeat 21px 17px;padding-left:30px}
#category .cate_li_1 a{padding-left:40px;background-position:31px 17px}
#category a:hover{color:#c92033}
#category .close_btn{display:block;position:absolute;width:50px;height:50px;top:0; left:256px;background:#333949;border:0;color: #fff;font-size:24px;z-index:1999;float:left}

/* 중간 레이아웃 */
#wrapper {z-index:5;margin:0 auto;width:100%;position:relative;zoom:1}
#wrapper:after {display:block;visibility:hidden;clear:both;content:""}
#wrapper_title {margin:10px 0;font-size:1.667em;font-weight:bold}
.lt_wr {width: 49%;}
.lt_wr:nth-child(2n+1){clear:both}
/* aside wrapper */
#aside {display:none;}


#container {position:relative;float:left;width:100%;min-height:500px;height:auto !important;height:500px;background:#fff;zoom:1}
#container:after {display:block;visibility:hidden;clear:both;content:""}

/* 텍스트 크기 조절 */
#text_size {display:none;position:absolute;top:-31px;left:-1px}
#text_size button {padding:0 10px;height:30px;border:1px solid #cfded8;border-bottom:0;background:#000;color:#fff;cursor:pointer}

/* 하단 레이아웃 */
#ft {clear:both;padding:0 0 40px;width:100%;/*border-top:1px solid #e9e9e9*/;background:#fff;}
#ft h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#top_btn {position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:46px;border:2px solid #333;color:#333;text-align:center;font-size:15px;z-index:90;background:rgba(255,255,255,0.5)}
#top_btn:hover{border-color:#3059c7;background:#3059c7;color:#fff}
#ft .ft_wr{margin:0 auto;max-width:100%}
#ft .ft_wr:after {display:block;visibility:hidden;clear:both;content:""}
#ft .ft_ul{text-align:center;border-bottom:1px solid #e9e9e9;padding:15px 0;margin:0 0 20px}
#ft .ft_ul li{display:inline-block;font-weight:bold;margin:0 10px}
#ft_logo {display:none;float:left;width:200px;margin:10px 0 0 }
#ft .ft_info{float:left;width:70%;line-height:1.7em}
#ft .ft_cs{float:left;width:30%;text-align:right}
#ft .ft_cs strong{font-size:1.75em;margin:5px 0;display:block}
#ft .ft_cs p{font-size:0.92em;color:#877}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

/* 이미지 등비율 리사이징 */
.img_fix {width:100%;height:auto}


/* 테이블 그리드 padding 0 5px 고려한 넓이 */
.grid_1 {width:40px}
.grid_2 {width:90px}
.grid_3 {width:140px}
.grid_4 {width:190px}
.grid_5 {width:240px}
.grid_6 {width:290px}
.grid_7 {width:340px}
.grid_8 {width:390px}
.grid_9 {width:440px}
.grid_10 {width:490px}
.grid_11 {width:540px}
.grid_12 {width:590px}
.grid_13 {width:640px}
.grid_14 {width:690px}
.grid_15 {width:740px}
.grid_16 {width:790px}
.grid_17 {width:840px}
.grid_18 {width:890px}

/* 테이블 항목별 정의 */
.td_board {width:80px;text-align:center}
.td_chk {width:30px;text-align:center}
.td_date {width:40px;text-align:center}
.td_datetime {width:75px;text-align:center}
.td_default {width:60px;text-align:center}
.td_dvr {width:70px;text-align:center}
.td_group {width:70px;text-align:center}
.td_imgsmall {width:60px;text-align:center}
.td_num {width:35px;text-align:center}
.td_numbig {width:70px;text-align:center}
.td_nick {width:70px;text-align:center}
.td_name {width:70px;text-align:left}
.td_namesmall {width:35px;text-align:left}
.td_mb_id {width:70px;text-align:center}
.td_mng {width:60px;text-align:center}
.td_mngsmall {width:35px;text-align:center}
.td_statsmall {width:35px;text-align:center}

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

/*장바구니 주문서 공통*/
.od_prd_list .td_chk{border-left:0;}
.od_prd_list .td_prd{border-left:0;position:relative;padding-left:0;min-height:100px}
.od_prd_list .td_prd .sod_img{display:none}
.od_prd_list .td_prd .sod_name{min-height:80px}
.od_prd_list .td_prd .prd_name{font-size:1.067em}
.od_prd_list .total_prc{color:#ff006c;font-weight:bold;font-size:1.067em}

.sod_opt {}
.sod_opt ul {margin:0;padding:0;list-style:none}
.sod_opt li {padding-left:10px;background:url('../img/bullet.gif') no-repeat 3px 8px;color:#777;margin:3px 0;line-height:1.3em}
.sod_option_btn .mod_options {padding:0 7px;border:1px solid #38b2b9;color:#38b2b9;background:#fff;height:23px;margin:10px 0 0 }
.cp_btn {padding:0 7px;border:1px solid #38b2b9;color:#38b2b9;background:#fff;height:23px;margin:10px 0 0 }
.cp_cancel {padding:0 7px;border:1px solid #aaa;color:#666;background:#fff;height:23px;margin:10px 0 0 2px;}

/* 주문서 작성 */
.sod_left{display:block;width:100%;background:#fafafa;padding:20px;vertical-align:top;}
.sod_right{display:block;width:100%;background:#eceff4;padding:20px;vertical-align:top;
-webkit-box-shadow: inset 7px 0 9px -7px rgba(0,0,0,0.2);
-moz-box-shadow: inset 7px 0 9px -7px rgba(0,0,0,0.2);
box-shadow: inset 7px 0 11px -5px #ced8e5;height:100%}

/*기본리스트*/
.list_01 li{border:1px solid #dbdbdb;border-radius:3px;margin:8px 0;padding:10px 15px;list-style:none;position:relative;}
.list_01 li:after {display:block;visibility:hidden;clear:both;content:""}
.list_01 li:hover{background:#f9f9f9}

.list_02 ul:after {display:block;visibility:hidden;clear:both;content:""}


@media all and (max-width:800px){
/*기본리스트*/
.list_02 ul:after {display:block;visibility:hidden;clear:both;content:""}
.list_02 li{float:left;width:31%;margin:0 1% 15px}
}

@media all and (max-width:600px){
/*기본리스트*/
.list_02 li{float:left;width:48%;margin:0 1% 15px}
}