@charset "utf-8";
@import url('reset.css');
html, body {position: relative;height: 100%;}
img{max-width: 100%;}
body{font-size: 14px;}
.mt0{margin-top: 0;}
#wrap{width: 100%;height: 100%;position: relative;}
#header{text-align: center;}
#header h1{background: url('../img/mob/m_h1_log.png') no-repeat 0 12px;background-size:93px auto;text-indent: -9999px;display: block;/*padding-top:12px;*/width: 93px;margin:0 auto;}
#header {height: 90px;background:url('../img/mob/bg_header.png') repeat-x 0 0; background-size: auto 90px;}
#header form{width: 100%;margin-top:5px;}
#header .m_search_wrap{margin:0 8px;position: relative;}
#header .m_search_wrap input[type="text"]{width:calc(100% - 40px);height: 25px;border-radius: 18px;border:none;padding:5px 20px;}
#header .m_search_wrap button{width:28px;height:28px;background: url('../img/mob/m_icon_search.png') no-repeat 0 0; background-size:28px auto;position: absolute;top:5px;right:12px; text-indent: -9999px;}

#footer{height:58px;background-color: #a1a6b0;font-size: 8px;color:#fff;}
#footer div{padding:20px 0 0 0px;text-align:center;letter-spacing: -1px;}
.m_search_wrap ::-webkit-input-placeholder { color: #000;font-size: 14px;}
.m_search_wrap ::-moz-placeholder { color: #000;font-size: 14px;}
.m_search_wrap ::-ms-input-placeholder { color: #000;font-size: 14px;}

#container{}
#container .tab_top{background: transparent url('../img/mob/m_tab_bg.png') repeat-x 0 bottom;height: 40px;}
#container  .tab{overflow:hidden; font-size:15px;} /* 2016-08-31 추가 font-size:15px; */
#container .tab li{float:left;width: 33.3%;height: 35px;background: url('../img/mob/m_tab_bg.png') repeat-x 0 top;}
#container .tab li a{display:block;text-align: center;line-height: 37px;}
#container .tab li.on{background: url('../img/mob/m_tabon_bg.png') repeat-x 0 top;height: 35px;}
#container .tab li.on a{color: #fff;}

.tab_wrap{}
.tab_wrap .drop_list > li{position: relative;}
.tab_wrap .drop_list > li.on a > .product_top p{font-family: 'notokr-bold'; font-size:15px; font-weight:bold;} /* 2016-08-31 추가 font-size:15px; font-weight:bold; */
.tab_wrap .drop_list > li > a{display: block;overflow: hidden;}
.drop_list li img{width:45px;height: 45px; }
.drop_list > li {vertical-align: middle;border-top:1px solid #e1e1e1;}
.drop_list > li:first-child{border-top:none;}
.drop_list > li > a{min-height: 45px;padding:5px 0px 8px 9px;background-color: #fff;}
.drop_list > li > a div.product_top{display: table;}
.drop_list > li:first-child div.product_top img{}
.product_top img{display: table-cell;padding-right:10px;}
.product_top p{display: table-cell;vertical-align: middle; font-size:15px;} /* 2016-08-31 추가 font-size:15px; */
.product_top p .prosub_txt{font-size:11px;color:#7c7c7c;display: inline-block;margin-left:4px;} /* 2016-08-31 수정 font-size:10px; */
.product_top p em{color: #333;font-size: 11px;} /* 2016-08-31 수정 font-size:10px; */
.m_color{position: absolute;top:13px;right:8px;}
.m_color ul li span{display: inline-block;width:16px;height: 16px;border-radius: 8px;text-indent: -9999px;}
.m_color ul li:first-child span:nth-child(1){display:inline-block;border:1px solid #939393;}
.m_color ul li:first-child span:nth-child(2) {background-color: #b2b2b2;}
.m_color ul li:first-child span:nth-child(3) {background-color: #787f89;}
.m_color ul li:last-child span:nth-child(1){background-color:  #686d71;}
.m_color ul li:last-child span:nth-child(2) {background-color: #f1ecd9;}
.m_color ul li:last-child span:nth-child(3) {background-color: #7f4d2f;}

/* 2016-08-31 추가 시작 */
.m_color2{position: absolute;top:21px;right:8px;}
.m_color2 ul li span{display: inline-block;width:16px;height: 16px;border-radius: 8px;text-indent: -9999px;}
.m_color2 ul li:first-child span:nth-child(1){display:inline-block;border:1px solid #939393;}
.m_color2 ul li:first-child span:nth-child(2) {background-color: #b2b2b2;}
/* 2016-08-31 추가 끝 */


.product_view{background-color:#f4f4f4;padding:15px;display: none;}
.product_view > div{}
.product_view .btn_cat{display: block;width: 100%; border:1px solid #95a5ad;padding:10px 0 9px 0;color: #496a7a;font-size: 14px; background:#fff;} /* 2016-08-31 수정 font-size: 12px; 추가  background:#f8f8f8; */
.product_view .btn_cat span{display: block;padding-left:23px; padding-top:1px; background: url('../img/mob/icon_catalog.png') no-repeat;background-size:auto 15px;width: 100px;margin:0 auto;vertical-align: middle;} /* 2016-08-31 추가 padding-top:1px; */
.product_view dl{margin-top:18px; margin-bottom:5px; font-size: 14px;} /* 2016-08-31 수정 font-size: 12px; 추가 margin-bottom:5px; */
.product_view dl dt{font-family: 'notokr-bold';position: relative;margin-top:18px;font-size: 15px; font-weight:bold; padding:2px 0 5px 10px;} /* 2016-08-31 추가 font-weight:bold; padding:2px 0 5px 10px; 폰트사이즈변경 font-size: 14px; */
.product_view dl dt:after{content: '';display: block;width:6px;height: 6px;background-color: #2c81ac;position: absolute;top:7px;left:0;}
.product_view ol li{padding-top:5px;color:#000;} /* 2016-08-31 수정 padding-top:10px; */
.product_view ol li p{padding-top:5px;color: #666;}
.product_view ol li span{color: #666;} /* 2016-08-31 추가 */
.product_view .st2 li {padding-bottom:5px;}  /* 2016-08-31 추가 */
.product_view ul{padding:5px 0 0 0;} /* 2016-08-31 수정 */
.product_view ul li{color:#666;padding-bottom:6px;}
.product_view ul li span{display: inline-block;color:#000;padding-left:4px;}
.product_view .mtbl{width: 100%;margin-top:2px; margin-bottom:12px; border:1px solid #cfcdcd;border-left:none;border-bottom:none;} /* 2016-08-31 추가 margin-bottom:12px; */
.product_view .mtbl th{font-size:14px;background-color:#e7e7e7;color: #333;text-align: center;padding:6px 0;border-left:1px solid #cfcdcd;border-bottom:1px solid #cfcdcd;} /* 2016-08-31 수정 font-size: 12px; */
.product_view .mtbl tbody td{font-size:14px;background-color: #fff;text-align: center;border-left:1px solid #cfcdcd;border-bottom:1px solid #cfcdcd;padding:9px 0;} /* 2016-08-31 수정 font-size: 12px; */
.product_view .mtbl .tbl_type td{padding:9px 0;} /* 2016-08-31 수정 padding:25px 0; */
.product_view .mtbl_txt{font-size: 14px;margin:8px 0 10px; color:#666; line-height:18px;} /* 2016-08-31 추가 color:#666; line-height:18px; 폰트사이즈변경 font-size: 12px; */

/*swiper*/
.swiper_top{background-color: #f9f9f9;height: 35px;width: 100%;} /* 2016-08-31 수정 height: 33px; */
.swiper_top p{padding-top:10px;font-size:16px;margin-left:23px; font-weight:bold;} /* 2016-08-31 추가 font-weight:bold; */
.swiper_wrap{width:100%;height:468px;position: absolute;top:0;z-index: 100;background-color: #fff; }
.swiper-slide {text-align: center;background: #fff;}
.swiper-container { margin: 0 auto; position: relative; overflow: hidden; z-index: 1; width:calc(100% - 6px);background-color: #fff;
  border:1px solid #cfcdcd;  border-top:none;}
.swiper-container-no-flexbox .swiper-slide { float: left;}
.swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-flex-direction: column;
  -webkit-flex-direction: column; flex-direction: column;}
.swiper-wrapper {
		position: relative;height: 100%; z-index: 1; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}
.swiper-container-android .swiper-slide,.swiper-wrapper {
  -webkit-transform: translate3d(0px, 0, 0); -moz-transform: translate3d(0px, 0, 0); -o-transform: translate(0px, 0px);
  -ms-transform: translate3d(0px, 0, 0);  transform: translate3d(0px, 0, 0);
}
.swiper-slide {-webkit-flex-shrink:0; -ms-flex:0 0 auto; flex-shrink:0; position:relative; width:100%;}  /* 2017-01-04 height: 468px; 삭제    width:100%; 추가 */
/* Auto Height */
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto;}
.swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start;  -webkit-transition-property: -webkit-transform, height; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform;  -ms-transition-property: -ms-transform;  transition-property: transform, height;}
/* IE10 Windows Phone 8 Fixes */
/*.swiper-wp8-horizontal { -ms-touch-action: pan-y; touch-action: pan-y;}
.swiper-wp8-vertical { -ms-touch-action: pan-x; touch-action: pan-x;}*/
/* Arrows */
.swiper-button-prev,
.swiper-button-next { position: absolute; top: 50%; width: 45px; height: 45px; margin-top: -22px; z-index: 10;  cursor: pointer;  -moz-background-size: 45px 45px;  -webkit-background-size: 45px 45px;  background-size: 45px 45px;  background-position: center;
  background-repeat: no-repeat;}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next { background-image: url('../img/mob/btn_pre.png');  left: 10px;  right: auto;}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {  background-image: url('../img/mob/btn_next.png');  right: 10px;  left: auto;}

.btn_close{width:15px;height: 15px;background: url('../img/mob/btn_close.png') no-repeat 0 0;background-size: 15px auto;position: absolute;	top:10px;right:20px;text-indent: -9999px;}
.btn_view {padding:45px 10px 10px 10px; position:absolute; top:10px; right:10px; border:1px solid #ccc; background:#f8f8f8 url(../img/bul_zoom.png) center 15px no-repeat; border-radius:2px;}

/*추가(2016-11-20)*/
.dim{width: 100%;height: 100%;min-height:100%;background:#000;opacity: 0.8;position: absolute;top: 0;left: 0;}
