@import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');



/*common*/
h1, h2{font-size: 0;}
a{text-decoration: none;}



/*title*/
h1{text-align: center; padding-top: 16px;}
.cate_tit{ display:block; height:47px; width: 197px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; 
overflow: hidden;
}
.footer_tit{font-size: 17px; font-weight: bold; padding-bottom: 22px;}
.best_tit{font-size: 24px; text-align: center; border: 0; width: 100%; display: block; padding-top: 64px; margin-bottom:22px; letter-spacing: -0.09em; }


/*quick_bar*/
.quick_bar{position: fixed; top:145px; left: 50%; margin-left: 610px; width:93px; height: 510px; text-align: center; z-index: 999;}
.quick_bar .replay{position: relative; width:91px; height:280px; background: #efefef; border: 1px solid #014c9f; margin-top: 2px; }
.quick_bar .replay span{font-family : 'Nanum Gothic'; font-size: 14px;  line-height: 1.5; border-bottom: 1px solid #014c9f; display: block; width: 80%; margin: 0 auto; padding: 5px 0;}
.quick_bar .replay .quick_arrow{position: absolute; height:250px; top:34px; left: 0;}
.quick_bar .replay .quick_arrow .quick_top_arrow{position: absolute; top:10px; display:block; left: 34px;}
.quick_bar .replay .quick_arrow .quick_down_arrow{position: absolute; bottom: 10px; display:block;left: 34px;}
.replay ul#quick_product_list{width:90%; overflow: hidden; position: absolute; top:56px; left: 5px; }
.replay ul#quick_product_list li{margin: 5px 0;}
/*header*/
#header_topBar_wrap{background:#f1f1f1; height: 35px;}
#header_topBar_wrap #header_topBar{width:1200px; margin: 0 auto; display: block;  font-family:'Nanum Gothic', sans-serif; }


#header_topBar_wrap .topBar_sns a{display: block; float: left;}
#header_topBar_wrap .topBar_sns a span{display:inline-block; margin-right: 10px; font-size: 13px; line-height: 35px;  font-family : 'Nanum Gothic';color:#575757;}
#header_topBar_wrap .topBar_sns a img{ display: inline-block; padding-top:10px; }
#header_topBar_wrap .topBar_sns .topBar_tit{ padding-left:17px;}


.topBar_sns .tbar_bg01{background:url(../img/cacao.png)no-repeat center left;}
.topBar_sns .tbar_bg02{background:url(../img/face_b.png)no-repeat center left;}
.topBar_sns .tbar_bg03{background:url(../img/blog.png)no-repeat center left;}
.topBar_sns .tbar_bg04{background:url(../img/cs.png)no-repeat center left;}
.topBar_sns .tbar_bg05{background:url(../img/insta.png)no-repeat center left;}

.choose-lang{width: 83px; float: left; margin-right: 15px;}
.choose-lang .goog-te-gadget img{display: none;}
.choose-lang .goog-te-menu-value span:nth-child(1){padding-right:8px;}
.choose-lang #google_translate_element{overflow: hidden;}
.choose-lang .goog-te-menu-value{line-height: 33px;}
.choose-lang .goog-te-gadget-simple{height: 35px; box-sizing: border-box; padding: 0;}


#header_topBar_wrap .topBar_memberArea{float: right;}
.topBar_memberArea a {font-family : 'Nanum Gothic'; color:#575757; font-size: 13px; line-height: 35px;}
.topBar_memberArea .divide{font-size: 13px; color:#a4a4a4;padding:0 9px; }

#header_wrap #header{width: 1200px; height: 110px; margin: 0 auto; position: relative;}
#header_wrap #header .search_area{position: absolute; top:30px; left: 0; }

/*검색*/
#header_wrap #header #search_area{position:relative;}
.searchBox{width:280px;height:42px; border:2px solid #014c9f; position: relative; padding-left: 10px; font-size: 13px;}
.search_btn{position: absolute; top:2px; right: 2px; border:0; width:67px;  height:45px; display: block; background:url(../img/search_btn.png)no-repeat center; }




/*탑배너*/
#header_wrap #header .header_ban{position: absolute; width:296px; height: 80px; display: block; right: 0; top:15px; overflow: hidden;}





/*main_banner*/
#main_banner{width:1199px; height:447px; margin: 0 auto;  border:1px solid #ccc; }


/*카테고리*/
#main_banner #category{width:198px; height:auto; display: block; float: left; }

#main_banner #category .cate_box ul li{ width:50%; 
     -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -o-box-sizing: border-box;
            -ms-box-sizing: border-box;
    box-sizing: border-box; height: 100px; float: left; display: block; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; text-align: center;}

#main_banner #category .cate_box ul li:hover {background-color:#f4f4f4;}
/*#main_banner #category .cate_box ul li:last-child{border-bottom: 0;}*/
#main_banner #category .cate_box ul li a{font-size: 15px; color: #282828; line-height: 18px; letter-spacing: -0.09em; }
.cate_box ul li span{padding-bottom: 7px; display: block; text-align: center;}
.cate_box ul li .cate_img{margin-top: 29px;}
.cate_box ul li .cate_img01{ margin-top: 25px; }
.cate_box ul li .cate_img02{ margin-top: 20px; }


/*메인배너영역*/
#main_banner #main_ban{width:1001px; height:448px; display: block; float: left; overflow: hidden; position: relative;}

  #main_banner #center_banner {
            position: relative;
        
        }

        #center_banner ul {
            height: 48px;
            padding: 0;
            margin: 0;
            width: 1000px;
           
        }

        #center_banner ul li {
            position: relative;
            float: left;
            width: 25%;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -o-box-sizing: border-box;
            -ms-box-sizing: border-box;
            box-sizing: border-box;
            
            height: 48px;
            display: block;
            border-bottom: 1px solid #ccc;
             border-right: 1px solid #ccc;
        }

        #center_banner ul li:last-child {
              border-right: 0;
        }

        #center_banner ul li a {
            display: block;
            width: 100%;
            height: 48px;
            text-align: center;
            line-height:48px;
            letter-spacing: -0.09em;
            color:#282828;
            font-weight: 500;
            
            position: relative;
        }

    #center_banner ul li a:hover {
            background-color: #014c9f;
            color:#fff;
           
             
        }

        #center_banner ul .active img {
            display: none;
            position: absolute;
            bottom: -8px;
            left: 112px;
            z-index: 1000;
        }

        #center_banner ul .active img {
            display: block;
        }

        #center_banner #center_banner_image {
            position: relative;
            width: 1001px;
            height: 399px;
            overflow: hidden !important;
        }
#center_banner #center_banner_image a img{width: 100%;}
        #center_banner_image a {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
        }

        #center_banner_image a:first-child {
            display: block;
        }

        #center_banner_image #center_banner_bg {
            width: 100%;
            height: 100%;
            background: white;
        }

        #center_banner #center_banner_prev {
            position: absolute;
            top: 212px;
            left: 20px;
        }

        #center_banner #center_banner_next {
            position: absolute;
            top: 212px;
            right: 20px;
        }

#center_banner_image a div{position: absolute; top:180px; left:106px; letter-spacing: -0.09em;}
#center_banner_image a div .center_banTxt01{font-size:24px; color:#061b29;font-weight: 500; padding-bottom: 11px;} 
#center_banner_image a div .center_banTxt02{font-size:40px; color:#fff; font-weight: bold; padding-bottom: 28px;} 
#center_banner_image a div .center_banTxt03{font-size:17px; color:#003e6a; letter-spacing: -0.04em; line-height:25px;  } 







/*제품배너영역*/
#product_ban_wrap{width:100%; height:200px; background: #fdbd34; margin-top: 53px; overflow:hidden;}
#product_ban_wrap #product_ban{ width: 1200px;  margin: 0 auto; }
#product_ban_wrap #product_ban .bx-prev,
#product_ban_wrap #product_ban .bx-prev{z-index: 9 !important;}

/***슬라이더 페이지 배경,text***/
.slider .pro_01{height: 200px; width: 80%; margin: 0 auto; background:url(
../img/ban_pro01.png)no-repeat right;}
.slider .pro_02{height: 200px; width: 80%; margin: 0 auto; background:url(
../img/ban_pro02.png)no-repeat right;}
.slider .pro_03{height: 200px; width: 80%; margin: 0 auto; background:url(
../img/ban_pro03.png)no-repeat right;}
.slider .pro_04{height: 200px; width: 80%; margin: 0 auto; background:url(
../img/ban_pro04.png)no-repeat right;}
.slider .pro_05{height: 200px; width: 80%; margin: 0 auto; background:url(
../img/ban_pro05.png)no-repeat right;}

.slider .pro_txt{padding-top:35px;}
.slider .pro_txt .pro_line01{ display:block;font-size:16px;  padding-bottom: 10px; font-weight:600;}
.slider .pro_txt .pro_line02{display:block; font-size:26px;font-weight: bold;padding-bottom:17px; letter-spacing:-0.08em; }
.slider .pro_txt .pro_line03{display:block; font-size:15px; line-height: 21px; letter-spacing:-0.04em;  }

.product_banBox .proBnr_img{float:right; display: block;  width: 40%;}
.product_banBox .proBnr_img img{float: right;}


/*product*/
#main_product_wrap{background:rgba(204,204,204,0.1);}
#main_product{width:1200px; margin: 0 auto; }
#main_product .product_list{ width: 100%; height: auto; text-align: center; padding-bottom:30px; }
#main_product .product_list li{width:31.2%; height:500px; display:inline-block; padding:1%; float: left;text-align: center;}

#main_product .product_list li .Pro_img{border: 1px solid #cdcdcd; overflow: hidden; background: #fff; height:65%;}
#main_product .product_list li .Pro_img a img{ width: 100%;}
#main_product .product_list li h3 a{ font-size: 20px; color:#333333;padding: 20px 0 10px 0; display: block;  line-height: 26px; font-weight: 600; letter-spacing: -0.09em;}
#main_product .product_list li p{font-size: 14px; line-height: 18px; letter-spacing: -0.05em;}
#main_product .product_list li .price{
    font-size:22px; color:#ae1c23; font-weight: bold; margin-top: 13px; display: inline-block; 
}
#bestProduct_wrap{ background: rgba(238, 252, 225, 0.2); border-top:1px solid #ccc;}

#main_Bestproduct{width:1200px; margin: 0 auto;}
#main_Bestproduct .product_list{ width: 100%; height: auto; text-align: center;}
#main_Bestproduct .product_list li{width:31.2%; height:500px; display:inline-block; padding:1%; float: left;text-align: center; margin-bottom: 60px;}

#main_Bestproduct .product_list li .Pro_img{border: 1px solid #cdcdcd; overflow: hidden; background: #fff; height:65%;}
#main_Bestproduct .product_list li .Pro_img a img{ width: 100%;}
#main_Bestproduct .product_list li h3 a{ font-size: 20px; color:#333333;padding: 20px 0 10px 0; display: block;  line-height: 26px; font-weight: 600; letter-spacing: -0.09em;}
#main_Bestproduct .product_list li p{font-size: 14px; line-height: 18px; letter-spacing: -0.05em;}
#main_Bestproduct .product_list li .price{
    font-size:22px; color:#ae1c23; font-weight: bold; margin-top: 13px; display: inline-block; 
}





.topBar_memberArea{position: relative!important;}
#google_lang #google_translate_element{position: absolute !important; top: 0 !important; right: 0 !important;}

/*footer*/
#footer_wrap{ border-top:1px solid #b9b6b6;}
#footer_wrap #footer_top{ width: 1200px; margin: 0 auto;
padding-top: 30px; padding-bottom: 20px;}
#footer_wrap #footer_middle{width: 1200px; margin: 0 auto; overflow: hidden;
   }
#footer_wrap #footer_bottom{width: 1200px; margin: 0 auto; }


#footer_wrap #footer_top .footer_top_left{width: 60%;  display: block; float: left; height: 170px;}
#footer_wrap #footer_top .footer_top_left .cs_center{width: 45%; display: block; float: left; border-right:1px solid #dedede; padding:0 2%}

#footer_wrap #footer_top .footer_top_left .bank{width: 45%; display: block; float: left; border-right:1px solid #dedede; padding:0 2%}


#footer_wrap #footer_top .footer_top_right{width:40%; display: block; float: left; height: 170px;}
.footerTop_right_list li{float: left; display: block; padding: 0 3%; width: 25%; box-sizing: border-box;}
.footerTop_right_list li a{display: block; text-align: center;}
.footerTop_right_list li a span{padding-top:10px; display: block; color:#555;}
#footer_middle_wrap{background-color:#dedede; }
#footer_wrap #footer_middle ul.mid_list li{display:block; float: left; padding:20px;}
#footer_wrap #footer_middle ul li a{display: block; font-size:16px; color:#323232;}
#footer_wrap #footer_middle ul li:first-child{padding-left: 0;}

#footer_wrap #footer_bottom{padding-top: 25px; padding-bottom: 15px;}
#footer_wrap #footer_bottom #footer_logo{width:232px; height: 162px; float:left; display: block;}
#footer_wrap #footer_bottom #footer_info{ width:900px; height: 162px;float: right; display: block; padding-top: 16px;}
#footer_bottom #footer_info ul{width: 50%; float: left; display: block;}
#footer_bottom #footer_info ul li{vertical-align: top; display: block; line-height: 24px;}
#footer_bottom #footer_info ul li:after{content:''; display: block; height: 0; clear:both;}
#footer_bottom #footer_info ul li p{display: block; float: left;}
#footer_bottom #footer_info ul li p.info_tit{font-size: 14px; color:#949494; width: 25%;}
#footer_bottom #footer_info ul li p.info_txt{font-size: 13px; color:#4d4d4d; width:75%;  }
#footer_wrap #footer_middle ul li:last-child{padding: 18px;}
#footer_wrap #footer_middle ul li .goog-te-gadget img{display: none;}
#footer_wrap #footer_middle ul li .goog-te-menu-value span:nth-child(1){padding-right:8px;}
#footer_wrap #footer_middle ul li #google_translate_element{overflow: hidden;}

#main_ban .bx-prev{background: url(../img/mainimage_leftbtn.png) no-repeat; width: 40px; height: 68px; z-index: 9;}
#main_ban .bx-next{background: url(../img/mainimage_rightbtn.png) no-repeat; width: 40px; height: 68px; right: 0; z-index: 9;}

.close{text-align: right;}
#chkbox1{vertical-align: middle; cursor: pointer;}
#chkbox1 + label{cursor: pointer;}


/*************************반응형*****************************/


@media screen and (max-width:1200px) {
    #header_topBar_wrap #header_topBar{width: 95%;}
    #main_banner, #product_ban{width:100%;}
    .bx-wrapper .bx-viewport{width: 100%;}
    #header_wrap #header{width: 100%;}
    #header_wrap #header .header_ban{display: none;}
    #header_wrap #header .search_area{display: none;}
    /*메인배너*/
    #main_banner #main_ban{width:75%;}
    #main_banner #category{width:25%;}
    .cate_tit{width:99.5%;}   
    #center_banner ul{width: 100%;}
    #center_banner ul li a{font-size: 15px;}
    
    /*제품배너*/
    #product_ban_wrap #product_ban{width:95%;}
    .slider .pro_01{width:90%;}
    /*제품*/
    #main_product{width:90%;}
    .product_list li .Pro_img{width:100%;}
    #bestProduct_wrap #main_Bestproduct{width:90%;}
    #main_Bestproduct .product_list li .Pro_img{width:100%;}
    
    #footer_wrap #footer_top .footer_top_left{width: 100%; float:none; height: 190px; border-bottom: 1px solid #ccc; overflow: hidden;}
    #footer_wrap #footer_top .footer_top_right{width: 45%; float:none; padding-top:22px; height: 115px; margin: 0 auto; overflow: hidden;}
     #footer_wrap #footer_top .footer_top_right .m_footerTit_hid{display: none;}
    #footer_wrap #footer_top .footer_top_left .bank{border-right:0;}
    #footer_wrap #footer_top .footer_top_left .cs_center{width: 45%;}
    #footer_wrap #footer_middle, #footer_wrap #footer_bottom{ width: 95%; margin: 0 auto;}
    #footer_wrap #footer_top{ width: 100%; margin: 0 auto;}
    #footer_wrap #footer_bottom #footer_logo{display: none;}
    #footer_wrap #footer_bottom #footer_info{width: 100%;}
}

@media screen and (max-width:1060px){
    #footer_wrap #footer_top .footer_top_left .cs_center{width: 40%;}
    #footer_wrap #footer_top .footer_top_right{width: 50%;}
}

@media screen and (max-width:980px){
    
 
    
    /*메인배너*/
    #main_banner #category{width: 100%;}
    
    ory{float: none; width: 100%;}
    #main_banner #main_ban{float: none; width: 100%;}
    .cate_tit{display: none;}
    #center_banner ul{display: none;}
    #main_banner #category .cate_box ul li{ width: 25%;
    
    
    }
    #main_banner #category .cate_box ul li:nth-child(4){border-right: 0;}
     #main_banner #category .cate_box ul li:last-child{border-right: 0;}
     #center_banner ul{display: none;}
    #main_banner #main_ban{height: 400px;}
    #main_banner{height:600px; }
    
    #product_ban_wrap{display: none;}
    #center_banner #center_banner_next{top:168px;}
    #center_banner #center_banner_prev{top:168px;}
 
    
}
@media screen and (max-width:960px){
       #footer_wrap #footer_top .footer_top_left .cs_center{width: 37%;}
    #footer_wrap #footer_top .footer_top_right{width:60%;}
       #footer_wrap #footer_middle ul li.info_hidn{display: none;}
}
@media screen and (max-width:929px){
       #footer_wrap #footer_top .footer_top_left .cs_center{width: 35%;}
    #footer_wrap #footer_top .footer_top_right{width:64%;}
    #footer_bottom #footer_info ul{width: 100%; float: none;}
    #footer_bottom #footer_info ul:last-child{margin-bottom: 30px;}
}
@media screen and (max-width:899px){
    /*제품*/
    #main_product .product_list li{ width:48%; padding:1%; }
     #main_Bestproduct .product_list li{ width:48%; padding:1%; height: 450px; }
     #footer_wrap #footer_top .footer_top_left .cs_center{width:46%;}
    #footer_wrap #footer_top .footer_top_right{width:60%;}
}


@media screen and (max-width:850px){
    #header_topBar_wrap .topBar_sns .topBar_tit{text-indent: -1000px;}
    #center_banner #center_banner_image{width: 840px; height: 336px;}
    #main_banner{height:534px; }
    
}


@media screen and (max-width:750px){
       .footerTop_right_list li{padding: 0 2%;}

    

}
@media screen and (max-width:732px){

#main_product .product_list li .Pro_img{ height:60%;}   

}
@media screen and (max-width:690px){
 #main_product .product_list li .Pro_img{ height:60%;}
    #main_product .product_list li{height: 450px;}
  #main_Bestproduct .product_list li{ width:48%; padding:1%; height:400px; }
    
    .footerTop_right_list li{padding: 0 1%;}
  
}


@media screen and (max-width:660px){
  
   
    #center_banner #center_banner_image{width:700px; height: 280px;}
    #main_banner #main_ban {height:283px;}
    #main_banner {height: 480px;}
    #center_banner #center_banner_prev{top:118px; left: 0;}
    #center_banner #center_banner_prev img{width: 65%}
    #center_banner #center_banner_next{top:118px; right: 0;}
    #center_banner #center_banner_next img{width: 65%; float: right;}
    #footer_wrap #footer_top .footer_top_left{height: 380px;}
    #footer_wrap #footer_top .footer_top_left .cs_center{width: 100%; float: none; padding-bottom:15px;}
    #footer_wrap #footer_top .footer_top_left .bank{width: 100%; float: none; border-top:1px solid #ccc; padding-top: 20px;}
    #footer_wrap #footer_top{text-align: center;}
    #footer_wrap #footer_top .footer_top_right{width: 70%;}
    
    
}
@media screen and (max-width:640px){
#main_product .product_list li .price{font-size:18px;}
}
@media screen and (max-width:606px){
    #main_product .product_list li .Pro_img{height: 50%;}
	#header_topBar_wrap{height: auto;}
}


@media screen and (max-width:590px){
     #main_product .product_list li .Pro_img{ height:55%;}
    #main_product .product_list li{height: 420px;}
}
@media screen and (max-width:560px){
#main_product .product_list li .Pro_img{ height:50%;}
    .shotcut_btn img{width: 80%;}
    #footer_wrap #footer_top .footer_top_right{height: 99px; width: 60%;}
    .footerTop_right_list li{width: 79px; padding: 0;}
    #footer_wrap #footer_middle ul.mid_list li{padding: 15px;}
    #footer_wrap #footer_middle ul.mid_list li:last-child{padding: 12px;}
	.topBar_sns{font-size: 0;}
	#header_topBar_wrap .topBar_sns a{width: calc(100%/5); background-position: center !important; float: none; display: inline-block;}
	#header_topBar_wrap .topBar_memberArea{float: none; text-align: center;}
    
}
@media screen and (max-width:550px){
    #footer_wrap #footer_top .footer_top_right{width: 68%;}  
}


@media screen and (max-width:530px){
#main_product .product_list li .Pro_img{ height:50%;}
    .topBar_memberArea a{
    padding-left:5px;
    font-size: 12px;
    letter-spacing: -0.09em;
    }
    .topBar_memberArea .divide{display: none;}

}


@media screen and (max-width:500px){
    #main_Bestproduct .product_list li {width: 80%; padding:0 10%; height:430px;}
     #center_banner #center_banner_image{width:530px; height:212px;}
 #main_banner{height:412px;}
    #footer_wrap #footer_top .footer_top_right{width: 72%;}

}
@media screen and (max-width:480px){
    #main_product .product_list li .Pro_img{ height:48%;}

}
@media screen and (max-width:460px){
    #main_product .product_list li .Pro_img{ height:43%;}
    #footer_wrap #footer_top .footer_top_right{width: 77%;}

}


@media screen and (max-width:420px){
       #main_product .product_list li .Pro_img{height:34%;}

    #main_product .product_list li .Pro_img{height: 30%;}
    
      #center_banner #center_banner_image{width:500px; height: 202px;}
    #main_banner #main_ban {height:202px;}
    #main_banner {height:400px;}
    #center_banner #center_banner_prev{top:80px; left: 0;}
    #center_banner #center_banner_next{top:80px; right: 0;}
    #main_product .product_list li{height: 400px;}
    #main_product .product_list li .Pro_img{ height: 40%;}
}

@media screen and (max-width:430px){
    #footer_wrap #footer_top .footer_top_right{width:83%;}
    
}
@media screen and (max-width:400px){
        #footer_wrap #footer_top .footer_top_right{width:85%;}
    
}
@media screen and (max-width:378px){
    #main_product .product_list li .Pro_img{ height:38%;}
    #main_Bestproduct .product_list li {height: 360px; }
#footer_wrap #footer_top .footer_top_right{width:85%;}
    #footer_wrap #footer_middle ul.mid_list li{padding: 10px;}
}

@media screen and (max-width:340px){
    #main_product .product_list li .Pro_img{ height:33%;}
    .topBar_memberArea a{padding-left: 2px; font-size: 11px;}
    .footerTop_right_list li{width:75px;}
}