@charset "utf-8";
/* CSS Document */

@import url('../css/common.css');
@import url('../css/main.css');
@import url('//cdn.jsdelivr.net/font-nanum/1.0/nanumbarungothic/nanumbarungothic.css');



/*상단 상품 노출영역*/
.top_pro_wrap{ overflow:hidden; width:960px}
.top_pro_wrap .pro_box{ width:473px; }
.top_pro_wrap .pro_box .tap{ overflow:hidden; margin:0}
.top_pro_wrap .pro_box .tap li{ float:left;width:226px; text-align:center; line-height:34px; font-size:14px; border:1px solid #efefef}
.top_pro_wrap .pro_box .tap li.on{ background:url(../img/sub/tap_on_bg.png) no-repeat; width:245px; height:39px; border:none;}
.top_pro_wrap .pro_box .tap li.on a{ color:#fff;}
.top_pro_wrap .pro_box .b_pro{ height:561px; overflow:hidden; border:1px solid #efefef;width:471px; margin-top:-5px}
.top_pro_wrap .pro_box .b_pro .pro_img{ border:none; width:399px; height:399px; margin: 30px auto; position:relative}
.top_pro_wrap .pro_box .b_pro .pro_img a img{width:399px ; height:399px;}
.top_pro_wrap .pro_box .b_pro .pro_img .new_icon {position:absolute; top:0; left:0}
.top_pro_wrap .pro_box .b_pro .pro_txt{ border:none; width:399px; margin: 30px auto; position:relative}
.top_pro_wrap .pro_box .b_pro .pro_txt .pro_tit{ line-height:35px; font-size: 18px; color:#a8a8a8}
.top_pro_wrap .pro_box .b_pro .pro_txt .pro_price{ float:left; line-height:35px; font-size: 18px; color:#000; font-weight:700}

.list_pro{ height:529px; overflow:hidden; border:1px solid #efefef;width:471px; margin-top:-5px; padding-top:32px}
.list_pro li{ width:409px; overflow:hidden; margin:0 auto 30px}
.list_pro li>a img{ float:left; width:141px; display:block}
.list_pro li .pro_txt{ width:240px; float:right; height:141px; overflow:hidden; position:relative}
.list_pro li .pro_txt .pro_tit{line-height:24px; font-size: 16px; color:#a8a8a8}
.list_pro li .pro_txt .pro_price{ display:block; margin:20px 0;font-size:18px; font-weight:bold;color:#000}
.list_pro li .pro_txt a.btn_style05{ position:absolute; bottom:0; left:0;}







/*하단 리스트형 상품 노출영역*/
.bott_pro_wrap{ overflow:hidden; margin-bottom:50px}
.bott_pro_wrap .list_cate_tab{}
.bott_pro_wrap .list_cate_tab span a{width:238px; display:block; float:left}
.bott_pro_wrap .list_cate_tab span a.on{ width:px; display:block;}
.pro_table{width:100%;}
.pro_table tr{}
.pro_table tr td{ border:1px solid #efefef ; height:350px; overflow:hidden; width:240px;}
.pro_table tr td .pro_img{ display:block; overflow:hidden; margin: 20px auto 10px; width:193px}
.pro_table tr td .pro_img img{width:193px; height:193px;}
.pro_table tr td div{ padding:0 25px 10px 25px; line-height:20px}
.pro_table tr td .pro_table_price{ font-weight:bold; color:#000; font-size:16px; margin-top:10px}
.pro_table tr td .price{ font-weight:bold; color:#000; font-size:16px; margin-top:10px}



.head .head_right .main_menu{display:block; clear:both; height:28px; padding-top:25px; }
.head .head_right .main_menu .menu{float:right; font-size:15px; height:28px; line-height:28px; color:#000; font-weight:bold; }
.head .head_right .main_menu .menu a.last{margin-right:15px !important;}
.head .head_right .main_menu .menu a{margin-right:45px;}
.head .head_right .main_menu .search{float:right;}
.head .head_right .main_menu .search span{display:inline-block;height:28px; vertical-align:middle; float:left;}
.head .head_right .main_menu .search .top_search_bg{  background:url(../img/main/head_search_input_bg.jpg) top left no-repeat; width:177px; height:28px; }
.head .head_right .main_menu .search .top_search_bg input{border:none; height:28px; width:160px; vertical-align:middle;}

/*화물전용관*/
.oil_goods_wrap{clear:both; position:relative; width:960px;  margin:auto; padding:20px 0; font-size:14px;}
.oil_goods_wrap .ft_bl{color:#4c81c7; font-size:14px;}
.oil_goods_wrap .info_btn{float:right;}
.oil_btn_blue{ background: #4c81c7; display:block; text-align: left;  color:#fff; border:0; font-size:14px; background: #4c81c7;}
#goods_info_pop{ background:#4c81c7  url(../img/icon_arrow_down01.png) no-repeat ; background-position:125px 50% ;   width:150px; padding:10px 15px;margin-top:-10px;}
#bonus_card{ background:#4c81c7  url(../img/icon_bonuscard.png) no-repeat top ;  background-position:20px 50%;  padding:15px 15px 15px 75px; margin-top:15px; width:100%;}

.goods_pop_login_wrap{ position:absolute; z-index:1000; width:450px;  border:1px solid #4c81c7; background:#fff; padding:5px; right:0; top:10px; }
.good_pop_login_arrow{background: url(../img/layer_pop_aroow.png); display:block; width:20px; height:15px; position:absolute; right:150px; top:-3px; z-index: 1001;}


.good_pop_arrow{background: url(../img/layer_pop_aroow.png); display:block; width:20px; height:15px; position:absolute; right:50px; top:37px; z-index: 1001;}
.goods_pop_wrap{ position:absolute; z-index:1000; width:300px;  border:1px solid #4c81c7; background:#fff; padding:35px; right:0; top:50px; }
.goods_pop_wrap .tit{font-size:22px; font-weight: bold; color:#4c81c7;}
.goods_pop_wrap .sub_tit{ display: block;  font-size:16px; color:#4c81c7; border:1px solid #4c81c7; padding:7px 10px; margin-top:15px; }
.goods_pop_wrap .pop_con{font-size:14px; color:#7c7c7c; line-height:19px;}
.goods_pop_wrap .pop_con{font-size:13px; color:#7c7c7c; margin-top:10px;}
.goods_pop_wrap .pop_con02{font-size:12px; padding:10px; margin-top:10px; background:#f5f5f5; border:1px solid #cecece;}
.oil_pop_layer02_wrap{position: absolute; width:380px; left:0; top:0; z-index:1001;}
.oil_pop_layer02_wrap .oil_pop_layer02{position:relative; }

/*할인율 추가*/
.oil_salerate_wrap{position:absolute;  display: block; z-index: 1002; width:50px;  right:0; top:0;}
.oil_salerate{text-align: center; width:50px; padding:13px 0; font-size:18px;background:#e70000; color:#fff; font-family:tanoma; letter-spacing:-1px;}


/*170127 추가*/
#truck_wrap{width:100%;}
#truck_wrap .tk_content_tit_event{width:100%; background: url(../img/truck_tit_bg.jpg) top center; height:672px; }
#truck_wrap .tk_content_tit_event .tk_event{width:960px; position:relative; margin:auto;  top:198px; }
#truck_wrap .tk_content_tit_event .tk_event .tk_event_icon{ position: absolute;  background:url('../img/oil_icon_event.png'); left:-5px; top:-5px; width:113px; height:111px; z-index:100;}

.tk_bl_wrap{width:100%; background:#2270D1; overflow:hidden; padding-bottom:30px;}
.tk_content_A{width:980px; margin:auto;  }
.tk_content_A .tit{width:960px; text-align: center; margin-top:20px; height:145px;}
.tk_content_A .roll_ban{width:960px; height:520px; position:relative; padding-left:15px;  margin-top:-9px;}
.tk_content_A .roll_ban ul{width:800px; margin:auto; height:463px; overflow:hidden; padding-top:9px;}
.tk_content_A .roll_ban ul li{float:left; position: relative; margin-right:10px; background: #fff; width:380px; }
.tk_content_A .roll_ban ul li .pro_wrap{width:340px;}
.tk_content_A .roll_ban ul li .proimg{width:inherit; margin:15px auto;}
.tk_content_A .roll_ban ul li .protxt{width:inherit; margin:10px auto; font-size:16px; line-height:18px; height:36px; overflow: hidden;}
.tk_content_A .roll_ban ul li .price_leftnum{width:inherit;  margin: auto; margin-bottom:30px; height:25px; }
.tk_content_A .roll_ban ul li .price_leftnum span{display: inline-block;}
.tk_content_A .roll_ban ul li .price{float:left; font-size:16px;  color:#2270D1; text-decoration:none;}
.tk_content_A .roll_ban ul li .price strong{ font-size:20px; font-family: tahoma;  color:#2270D1}
.tk_content_A .roll_ban ul li .leftnum{ float: right; margin-top:7px;}
.tk_content_A .roll_ban .arrow_wrap{width:960px; margin:auto; position: absolute; top:200px; left:0; z-index: 100;}
.tk_content_A .roll_ban .arrow_wrap .arrow_back{position: absolute; left:0; }
.tk_content_A .roll_ban .arrow_wrap .arrow_next{position: absolute; right:0;}
.tk_content_A .roll_ban ul li .sale_rate{position: absolute; left:10px; top:-9px; background:url(../img/truck_icon_sale.png); width:119px; height:85px; color:#fff; font-size:16px; text-align: center; font-family: tahoma;}
.tk_content_A .roll_ban ul li .sale_rate span{padding-top:17px; display: block; letter-spacing:-1px;}
.tk_content_A .roll_ban ul li .sale_rate strong{font-weight: bold; font-size:30px;}
.tk_content_A .roll_ban .item {width:800px; height:463px; position:absolute;top:0;left:100px;display:block;float:left;margin-left:-1px}


.tk_grey_wrap{width:100%; background:#e6e6e6; overflow:hidden; padding-bottom:30px;}
.tk_wt_wrap{width:100%; background:#fff; overflow:hidden; padding-bottom:30px;}
.tk_content_B{width:980px; margin:auto;  }
.tk_content_B .tit{width:960px; text-align: center; margin-top:20px; height:145px;}
.tk_content_B .pro_list_wrap{width:inherit; overflow: hidden; }
.tk_content_B .pro_list_wrap ul{width:1000px;}
.tk_content_B .pro_list_wrap ul li{float:left; position: relative;  width:320px; background: #fff; border:1px solid #d4d4d4; padding-top:15px; margin-right:7px; margin-top:10px;}
.tk_content_B .pro_list_wrap ul li .pro_wrap{width:280px; margin:auto;}
.tk_content_B .pro_list_wrap ul li .proimg{width:inherit; margin:auto; position: relative;}
.tk_content_B .pro_list_wrap ul li .protxt{font-size:16px; width:inherit; margin:15px auto; line-height:18px; height:36px;  overflow: hidden; }
.tk_content_B .pro_list_wrap ul li .price01{width:inherit; margin:auto; display: block; clear:both; height:20px;}
.tk_content_B .pro_list_wrap ul li .price01 .txt{float:left; font-size:12px; }
.tk_content_B .pro_list_wrap ul li .price01 .price{float:right; font-size:12px; text-decoration: line-through; }
.tk_content_B .pro_list_wrap ul li .price02{width:inherit; margin:auto; display: block; clear:both; height:20px;}
.tk_content_B .pro_list_wrap ul li .price02 .txt{float:left; font-size:12px; }
.tk_content_B .pro_list_wrap ul li .price02 .price{float:right; font-size:14px; color:#000; font-weight:bold;text-decoration:none;}
.tk_content_B .pro_list_wrap ul li .price03{width:inherit; background: #f5f5f5; padding:10px 19px; margin:auto; margin-top:7px; display: block; clear:both; height:20px; color:#2270D1; border-top:1px solid #ebebeb; font-size:16px;}
.tk_content_B .pro_list_wrap ul li .price03 .txt{float:left;  }
.tk_content_B .pro_list_wrap ul li .price03 .price{float:right; font-weight:bold; color:#2270D1;  font-size:18px; font-weight:bold;text-decoration:none;}
.tk_content_B .pro_list_wrap ul li .proimg .salerate{position: absolute;width:inherit;  height:35px; line-height:35px; text-align: center; bottom:0px; left:0px; font-size:16px;} 
.tk_content_B .pro_list_wrap ul li .proimg .salerate .sale_num{color:#FFFFFF; display: inline-block; float:left;  width:50%; background:#47907a;}
.tk_content_B .pro_list_wrap ul li .proimg .salerate .txt{color:#FFFFFF; display: inline-block; float:left;  width:50%; background:#57c1a1;}
.tk_content_B .pro_list_wrap ul li .proimg .salerate #tk_salerate_num{background: #476a90;}
.tk_content_B .pro_list_wrap ul li .proimg .salerate #tk_salerate_txt{background: #5788c1;}
.tk_content_B .pro_list_wrap ul li .pronum{position: absolute; background: url(../img/truck_icon_num.png); width:74px; height:71px; left:10px; top:-6px; z-index: 100; color:#fff; text-align: center; font-size:20px; font-family: tahoma;}
.tk_content_B .pro_list_wrap ul li .pronum span.txt{padding-top:17px; font-weight: bold; display: block; margin-left:-5px;}
.tk_content_B .pro_list_wrap ul li .salerate02{width:80px; height:80px; position: absolute; right:0; top:0;  background:#2270d1; z-index: 100; text-align: center; }
.tk_content_B .pro_list_wrap ul li .salerate02 span p{display: block; font-size:18px;color:#fff; }
.tk_content_B .pro_list_wrap ul li .salerate02 span.txt{display: block; font-size:18px;padding-top:20px; }
.tk_content_B .pro_list_wrap ul li .salerate02 span.txt strong{ font-family: tahoma;font-size:18px;}
.btn_goshop{width:320px; background:#2270D1; color:#fff; display: block; color:#fff; border:0; padding:20px 0;  font-size:20px; margin:20px auto;}

/*170208_탭추가*/
#tk_tabmenu_wrap{ clear:both; width:100%;  overflow: hidden; bottom:0px;  margin-top:20px;}
#tk_tabmenu_wrap .tk_tabmenu{width:960px; margin:auto;}
#tk_tabmenu_wrap .tk_tabmenu a{float:left; width:190px; background: #fff;  text-align: center; font-size:16px; padding:15px 0; border:1px solid #2270d1; margin-left:-1px; vertical-align: bottom;color:#2270d1;}
#tk_tabmenu_wrap .tk_tabmenu a.active{background:#2270d1; font-weight:bold;color:#fff;}
#tk_tabmenu_wrap .tk_tabmenu a:hover{background:#2270d1; font-weight:bold;color:#fff; }