/* Written By MJS */

*{-webkit-text-size-adjust:none}
body,form,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,fieldset,th,td,input,textarea,button,select{margin:0;padding:0;font-family:'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif;font-weight:normal}
body{-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}
li{list-style:none}
a{border:0;padding:0;margin:0;text-decoration:none;color:#333}
ol,ul,dl{list-style:none}
img{float:left;border:0;padding:0;margin:0;}
legend,caption{display:none}
table{border-collapse:collapse;border-spacing:0}
input{vertical-align:middle;padding:0;border:0;margin:0;}
select{padding:0;border:0;margin:0;}

body{min-width:320px;max-width:1000px;height:100%;margin:0 auto;}





/*================================== 최상단 ==================================*/
#main-navbar{position:relative;float:left;z-index:10;width:94%;padding:3%;background:#fff;border-bottom:1px solid #ccc;text-align:center;}
#toggle-sidebar,#toggle-sidebar2{float:left;width:6%;cursor:pointer;}

#main-navbar ul{float:left;width:80%;margin:1% 4%}
#main-navbar ul li{float:left;width:24.5%;line-height:90%;border-left:1px solid #ccc;text-align:center;}
#main-navbar ul li:first-child{border-left:none;}
#main-navbar ul li a{float:left;width:100%;display:block;font-size:14px;font-weight:400;text-align:center;}

#main-sidebar,#main-sidebar2{position:fixed;top:0;bottom:0;background:#e5e5e5;}
#main-sidebar .close-sb,#main-sidebar2 .close-sb{height:54px;line-height:54px;background:#333;padding:0 0 0 5%;border-bottom:1px solid #000;font-size:18px;color:#fff;cursor:pointer;}
#main-sidebar ul li > a,#main-sidebar2 ul li > a{display:block;height:42px;line-height:42px;padding:0 0 0 5%;border-bottom:1px solid #ccc;font-size:16px;font-weight:600;color:#555;}
#main-sidebar ul li > a:hover,#main-sidebar2 ul li > a:hover{background:#333;border-bottom:1px solid #010101;color:#fff;}
#main-sidebar ul li li > a,#main-sidebar2 ul li li > a{display:block;padding:0 0 0 3%;background:#f7f7f7;border-bottom:1px solid #dedee0;font-size:13px;font-weight:600;color:#555;}

.right_box{float:left;width:96%;margin:2%;}
.right_box a{float:left;width:44.5%;background:#fff;border:1px solid #ccc;border-radius:10px;padding:9% 0;margin:2%;font-size:13px;text-align:center;}
.right_box a img{float:left;width:40%;margin:3% 30%;}


/* 로고, 전화걸기 */
#logo_icon{position:relative;float:left;width:94%;padding:3%;}
#logo_icon a.logo{float:left;width:40%;margin:0 30%;}


/* 메뉴 */
#menu{position:relative;float:left;width:94%;padding:2% 3%;background:#fff;border:1px solid #ccc;border-left:none;border-right:none;}
#menu .icon_w{float:left;width:50%;}
#menu .icon_w a{float:left;width:18%;margin-right:3%;}
.search{float:left;width:50%;background:#e5e5e5;}
.search .search_bar{float:left;width:80%;padding:2%;line-height:100%;font-size:16px;background:none;}
.search .search_btn{float:left;width:20%;}
.search input{
border:0;
border-radius: 0px;
-webkit-appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}





/*================================== 메인 ==================================*/
/* 메인 슬라이드 */
.promotion{position:relative;float:left;margin:0;padding:0;min-width:320px;max-width:1080px;width:100%;overflow-x:hidden;}
.slidings{margin:0;padding:0;}
#promotionBanner{margin:0;padding:0;}
.wrap{margin:0;padding:0;}
figure{margin:0;padding:0;}
#promotionBannerPagination{margin:0;padding:0;}
.pagination{margin:0;padding:0;}


/* 베스트상품 슬라이드 */
.swiper-container{position:relative;float:left;width:96%;margin:0;padding:5% 2% 0 2%;background:#e5e5e5;}
div.swiper-slide{position:relative;float:left;width:100%;margin:0;padding:0;text-align:center;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;}
.best_w{float:left;width:46%;margin:0 2%;}
.best_w a{float:left;width:100%;}
.best_w a img{float:left;width:99%;border:1px solid #ccc;}
.best_w .pro_text{float:left;width:100%;line-height:16px;font-size:13px;font-weight:600;color:#555;margin:2% 0;text-align:left;}
.best_w .pro_price{float:left;width:70%;line-height:20px;font-size:16px;font-weight:600;color:#000;margin-top:2%;text-align:right;}
.best_w .pro_price span{float:left;width:100%;text-decoration:line-through;color:#aaa;font-size:13px;}
.best_w .percent{float:left;width:30%;line-height:100%;font-size:36px;letter-spacing:-2px;color:#b80000;text-align:left;margin-top:5%;}
.best_w .percent span{font-size:20px;}
.best_w .icons{float:left;width:100%;height:12px;margin:4% 0 2% 0 ;text-align:left;}
.best_w .icons img{float:left;margin-right:3px;}


#product{position:relative;float:left;width:92%;margin:6% 4% 0 4%;}
.p_title{float:left;width:100%;font-size:20px;color:#000;font-weight:bold;text-align:center;margin-bottom:3%;}
ul.p_list{float:left;width:104%;margin-left:-2%;}
ul.p_list li{float:left;display:block;width:45.7%;margin:0 2%;}
ul.p_list li a{float:left;width:100%;}
ul.p_list li a img{float:left;width:99%;border:1px solid #ccc;}
ul.p_list li .pro_text{float:left;width:100%;line-height:16px;font-size:13px;font-weight:600;color:#555;margin-top:3%;text-align:left;}
ul.p_list li .pro_price{float:left;width:70%;line-height:100%;font-size:16px;font-weight:600;color:#000;margin-top:10px;text-align:right;}
ul.p_list li .pro_price span{float:left;width:100%;text-decoration:line-through;color:#aaa;font-size:13px;}
ul.p_list li .percent{float:left;width:30%;line-height:100%;font-size:36px;letter-spacing:-3px;color:#b80000;text-align:left;margin-top:5%;}
ul.p_list li .percent span{font-size:20px;}
ul.p_list li .icons{float:left;width:100%;height:12px;margin-top:3%;text-align:left;}
ul.p_list li .icons img{float:left;margin-right:3px;}


p.p_img{width:98%;}
p.p_imgm{width:100%;margin-bottom:6%;}
p.p_imgm img{width:100%;border:1px solid #e0e0e0;}
p.pr_subject{width:96%;margin:1%;font-size:90%;}
p.price2{width:98%;font-size:95%;letter-spacing:-1px;color:#999;text-decoration:line-through;}
p.price{width:98%;font-size:95%;letter-spacing:-1px;color:#ff9000;}





/*================================== 하단 ==================================*/
/* 카피라이트 */
#footer{position:relative;float:left;width:100%;border-top:1px solid #aaa;margin-top:6%;}
.copy{position:relative;float:left;width:94%;padding:3% 3% 0 3%;color:#898989;font-size:70%;}
.copy p{text-align:center;}

/* 버튼 style */
#button{position:relative;float:left;width:100%;padding:4% 0;text-align:center;}
.btn{margin:0 1%;padding:2% 4%;font-size:76%;color:#898989;
background:#f5f5f5;
border:1px solid #e0e0e0;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
behavior:url(ie-css3.htc);}





/*================================== 서브 ==================================*/
#sub_content{position:relative;float:left;width:100%;}

/* 서브 카테고리 */
.sub_title{position:relative;float:left;width:94%;padding:4% 3%;line-height:100%;font-size:120%;font-weight:bold;background:#f1f1f1;border-top:1px solid #ccc;border-bottom:1px solid #ccc;}/* 페이지 타이틀 */

/* 서브탭 2개 */
.sub_tab{position:relative;float:left;width:100%;margin-top:1px;background:#cde7ff;}
.sub_tab li{float:left;width:49.8%;}
.sub_tab li a{display:block;width:100%;background:#cde7ff;font-size:90%;font-weight:400;text-align:center;padding:4% 0;color:#0058ab;border-left:1px solid #fff;}
.sub_tab li a.select{background:#0058ab;color:#fff;}
/* 서브탭 3개 */
.sub_tab3{position:relative;float:left;width:100%;margin-top:1px;background:#cde7ff;}
.sub_tab3 li{float:left;width:33.1%;}
.sub_tab3 li a{display:block;width:100%;background:#cde7ff;font-size:90%;font-weight:400;text-align:center;padding:4% 0;color:#0058ab;border-left:1px solid #fff;}
.sub_tab3 li a.select{background:#0058ab;color:#fff;}
/* 서브탭 4개 */
.sub_tab4{position:relative;float:left;width:100%;margin-top:1px;background:#cde7ff;}
.sub_tab4 li{float:left;width:24.8%;}
.sub_tab4 li a{display:block;width:100%;background:#cde7ff;font-size:90%;font-weight:400;text-align:center;padding:8% 0;color:#0058ab;border-left:1px solid #fff;}
.sub_tab4 li a.select{background:#0058ab;color:#fff;}


/* 서브 정렬값 */

.snb2_tab{position:relative;float:left;width:100%;background:#fff;}
.snb2_tab li{float:left;width:33.1%;}
.snb2_tab li a{display:block;width:100%;background:#fff;line-height:140%;font-size:90%;font-weight:bold;text-align:center;padding:6% 0;color:#898989;border-left:1px solid #eaeaea;border-bottom:1px solid #eaeaea;}
.snb2_tab li a.select{background:#fff;color:#fff;}


.sub_list ul{float:left;width:100%;}
.sub_list ul li{float:left;width:28%;text-align:left;padding:0 2%;font-size:70%;border-left:1px solid #ccc;}
.sub_list ul li:first-child{padding-left:0;border-left:0;}

.sub_list{position:relative;float:left;width:93.3%;margin:0 3%;border-right:1px solid #eee;}
.sub_list ul{float:left;width:100%}
.sub_list ul li{float:left;width:29%;padding:2%;text-align:left;font-size:70%;border-left:1px solid #eee;border-bottom:1px solid #eee;}

.sub_align{position:relative;float:left;width:94%;margin:0 3%;}
.sub_align span{float:left;display:block;width:98%;font-size:90%;margin:6% 0 3% 0;color:#333;}
.sub_align ul{float:left;width:99.5%;border-top:1px solid #eee;border:1px solid #eee;border-left:none;background:#f9f9f9;margin-bottom:6%;}
.sub_align ul li{float:left;width:19%;padding:1% 0;text-align:center;border-left:1px solid #eee;background:#f9f9f9;}
.sub_align ul li a{font-size:66%;}





/*=================================== 상세페이지 ===================================*/
#detail{position:relative;float:left;width:100%;}
.dtl_title{float:left;width:96%;font-size:100%;font-weight:600;color:#000;padding-left:3%;margin-bottom:3%;border-left:4px solid #f50f06;}

.dtl_top{position:relative;float:left;width:98%;border:5px solid #000;}
.dtl_top img{width:100%;}

/* 상세보기타이틀, 상세 내용 */
.dtl_btm{position:relative;float:left;width:100%;}
.dtl_tt{float:left;width:96%;font-size:90%;font-weight:600;color:#000;padding-left:3%;margin-bottom:3%;border:1px solid #ccc;background:#f7f7f7;margin-top:5%;}
.dtl_cont{float:left;width:100%;}


/* 제품상세설명 */
.dtl_cont_list{position:relative;float:left;width:93%;background:#fff2e8;border:3px solid #ff811b;padding:3%;}
.dtl_cont_list ul{float:left;}
.dtl_cont_list ul li{float:left;width:100%;font-size:90%;font-weight:600;color:#000;}
table.dtl_tbl{position:relative;float:left;width:100%;border-top:1px solid #ccc;margin-top:2%;}
table.dtl_tbl th{width:30%;background:#f0f0f0;font-weight:600;color:#000;}
table.dtl_tbl td{color:#4b4b4b;}
table.dtl_tbl th,table.dtl_tbl td{padding:2%;font-size:90%;border-bottom:1px solid #ccc;}


/* 페이징 고정 소스 */
.paging_w{position:relative;float:left;width:100%;margin:5% 0;}
.paging{text-align:center;}
.paging ul{display:inline-block;zoom:1;*display:inline;}
.paging ul li{float:left;text-align:center;}
.paging ul li a{float:left;display:block;font-size:90%;padding:0 5px;margin:0 2px;color:#898989;background:#fafafa;border:1px solid #e0e0e0;}
.paging ul li.on{float:left;display:block;font-size:90%;padding:0 5px;margin:0 2px;border:1px solid #555;background:#898998;color:#fff;font-weight:600;}




/* 자동차리스트 */
.car_list{position:relative;float:left;width:100%;}
.car_list ul{float:left;width:100%;margin-left:1px;}
.car_list ul li{float:left;width:33%;border:1px solid #ccc;margin:-1px 0 0 -1px}
.car_list ul li a{float:left;width:100%;line-height:40px;font-size:13px;font-weight:600;text-align:center;color:#333;background:#fff;}
.car_list ul li a:hover{color:#fff;background:#72bcef;}









/* 이미지 크기 제멋대로일때 잡아주는 소스 */
@media screen and (min-width:320px) and (max-width:420px) {
ul.p_list li{height:330px;}
ul.p_list li a img{height:170px;}
p.p_imgm img{height:170px;}
}

@media screen and (min-width:421px) and (max-width:767px) {
ul.p_list li{height:400px;}
ul.p_list li a img{height:250px;}
p.p_imgm img{height:280px;}
}

@media screen and (min-width:768px) and (max-width:1023px) {
ul.p_list li{height:460px;}
ul.p_list li a img{height:320px;}
p.p_imgm img{height:350px;}
}

@media screen and (min-width:1024px) and (max-width:1920px) {
ul.p_list li{height:540px;}
ul.p_list li a img{height:400px;}
p.p_imgm img{height:440px;}
}


