/* BASIC css start */
#header {
    width: 100%;
	
}
#header .header_top {
	position: relative;
	background: #fff;
	z-index: 2;
	padding: 10px 15px;
	font-size: 0;
	text-align: center;
    border-bottom: 1px solid #955251;
}
#header .header_top div {
	display: inline-block;
	vertical-align: middle;
	font-size: 12px;
}
#header .header_top .menu {
	width: 24px;
	left: 17px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
#header .header_top .allmenu_btn {
	width: 100%;
}
#header .header_top .basket {
	width: 34px;
	right: 14px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
#header .header_top .basket a {
	position: relative;
	/*display: block;*/
}
#header .header_top .basket a img {
	width: 32px;
}
#header .header_top .basket a span {
    position: absolute;
    top: 7px;
    right: -9px;
    width: 20px;
    height: 14px;
    line-height: 13px;
    border-radius: 8px;
    color: #fff;
    font-size: 10px;
    font-family: 'Lato', sans-serif;
    vertical-align: bottom;
    background: #955251;
}
#header .header_top .logo {
	width: 164px;
}
#header .header_top .logo img {
	width: 100%;
	vertical-align: middle;
}



#header .searchBox{background:#d6bab2; position:relative; height:30px; border: 1px solid #955251; margin-top:-1px;}
#header .searchBox input#keyword{display:block; width:100%; height:30px; background:transparent; border:0; padding:0 35px 0 10px; box-sizing:borderbox;  }
#header .searchBox a.btn_search{position:absolute; top: 0; right:0; display:block; width:30px; height:30px; line-height:30px; }
#header .searchBox a.btn_search span{font-size: 1.5em;}
#header .searchBox a.btn_search span:before{vertical-align:middle; color:#955251;}
#header .categoryBox{}
#header .categoryBox ul

#header .headerBottom .searchArea .search input { padding-left:15px; width:188px; height:28px; line-height:28px; border:none; }


/* ¸Þ´º */
.backmask{display:none; position: fixed; top: 0; left:0; z-index: 9; width:100%; height:100%; background: rgba(255,255,255,0.8);}
.backmask .closeBox{position: absolute;
    right: 13px;
    top: 15px;
    z-index: 100000;}
.backmask .closeBox img{width: 24px;}
#menuWrap{ position: fixed; width:87%; height:100%; background: #252525; top: 0; z-index: 10; display:none; overflow-x: auto;}
#menuWrap .menuIn{}
#menuWrap .menuIn .menu_middle{ background: #252525;}
#menuWrap .menuIn .menu_middle:after{content: ''; display: block; clear: both}
#menuWrap .menuIn .menu_middle .middle_text, #menuWrap .menuIn .menu_middle .middle_icon{text-align: center;}
#menuWrap .menuIn .menu_middle .middle_text li{float:left; width:33.3%;  height:100px;  border-right: 1px solid #434343;
    border-bottom: 1px solid #434343;
    box-sizing: border-box;}
#menuWrap .menuIn .menu_middle .middle_text li a{display: block;
    width: 100%;
    height: 100%;
    font-family: 'Lato', 'NanumBarunGothic', sans-serif;
    color: #fff;}
#menuWrap .menuIn .menu_middle .middle_text li a img{padding: 20px 0 10px; margin:0 auto; display: block;}

.m_banner{text-align:center; padding: 25px 0;}
.m_banner img{width: 92%;}

/**/
#menuWrap .menuIn .menu_contents{padding-top: 32px; display: flex;}
#menuWrap .menuIn .menu_contents .a_menu, #menuWrap .menuIn .menu_contents .a_center{width: 100%;}
#menuWrap .menuIn .menu_contents .a_menu ul, #menuWrap .menuIn .menu_contents .a_center ul{line-height: 35px;}
#menuWrap .menuIn .menu_contents .a_menu > ul{border-top: 1px solid #434343; background: #323232;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li{border-bottom: 1px solid #434343; position: relative;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li > a{ font-size: 1.2em; font-family: 'NanumBarunGothic', sans-serif; color: #9d9d9d;  display: block; margin-right: 40px; padding: 7px 0 7px 20px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu{display:none; background: #323232; padding: 20px 32px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu::after{content: ''; display: table; clear: both}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li{ line-height: 16px; margin-bottom: 20px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li:last-of-type{margin-bottom: 0px;}
#menuWrap .menuIn .menu_contents .a_menu > ul > li .sub_menu li a{color: #cccccc; font-family: 'NanumBarunGothic', sans-serif;}
#menuWrap .menuIn .menu_contents .a_menu .fa-angle-down:before{font-size: 18px;}
#menuWrap .menuIn .menu_contents .a_menu .fa-angle-down{
    width: 40px;
    height: 45px;
    text-align: center;
    line-height: 45px;
    position: absolute;
    right: 0;
    top: 0;
    color: #9d9d9d;}
#menuWrap .menuIn .menu_contents .a_menu .main_menu.oncol{background: #965251; -webkit-tap-highlight-color:rgba(0,0,0,0); outline:none;}
#menuWrap .menuIn .menu_contents .a_menu .main_menu.oncol > a{color:#fff}
#menuWrap .menuIn .menu_contents .a_menu .fa-angle-down.active{
    -webkit-transform: rotate(180deg);
     -moz-transform: rotate(180deg);
     -o-transform: rotate(180deg);
     -ms-transform: rotate(180deg);
     transform: rotate(180deg);
     background: #965251;
     color:#fff;
     }
     

.categoryBox .swiper-wrapper .swiper-slide{width: initial !important;}
.categoryBox .swiper-wrapper .swiper-slide a{display:inline-block; vertical-align:top; padding:5px 10px; line-height:27px;}
.categoryBox .swiper-wrapper .swiper-slide a span.heart{display:inline-block; width:16px; height:21px; vertical-align:middle; line-height:21px; margin:5px 2px 5px 0; background:url(/design/josephn/natures/pc/icon/heart_16.png) 0 center no-repeat; background-size:100% auto; }

     

/* BASIC css end */