﻿@import "https://fonts.googleapis.com/css?family=Noto+Sans+KR";
@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css";

* {box-sizing:border-box;font-family: 'Noto Sans CJK KR', 'Noto Sans KR', 'Malgun Gothic', sans-serif;}
html,body {padding:0;margin:0;}
a:link {text-decoration:none;color:#333;}
a:visited,a:hover {text-decoration:none;color:#000;}

#wrap {position:relative;min-width:1260px;}
.box1 {width:1260px;margin:0 auto;position:relative;}
.box1 .sort {text-align:right;padding-bottom:10px;;color:#333;}
.box1 h2{text-align: center;font-size:35px;margin: 15px 0px 15px 0px;font-weight:500;}
.box2 {width:100%;min-width:1260px;margin:0;position:relative;}
.ol, ul, li { list-style : none; }
	  
/* header */
#header {height:160px;position:relative;margin-top: 20px;}
#header .contact-box {position:absolute;right:0;top:4px;font-size: 30px;}
#header .contact-box .txt1{font-size:18px;font-weight:600;color:#333;margin-right:5px;}
#header .contact-box .txt2{font-size:30px;font-weight:700;letter-spacing:-1px;color:#542f82;}
#header .contact-box .txt3{height:23px;font-size:12px;line-height:1.9em;margin-top:0px;color:#fff;background-color:#3963ab;text-align:center;letter-spacing:0;}
#header .contact-box .txt4{display:inline-block;background:#000;vertical-align:middle;width:4px; height:4px;margin:0 3px 0 7px;}

#header .search-box {position:absolute;right:0;width:480px;height:40px; border:#542f82 solid 2px; box-sizing: border-box;position: absolute;left:400px;top:25px}
#header .search-box .btnSch {position: absolute;right:0px;top:0px;width:40px;height:36px;background: url(/img/icoBtnSchBox.png) no-repeat;text-indent: -9999px;overflow: hidden;border:none;cursor:pointer;}
#header .search-box input {height:36px;line-height:36px;width:100%;border:none;padding:0 5px;}
#header .search-box input:focus {outline:none;}
#header .logo-box {text-align:left;padding-top:10px;}
#header .logo-box a {font-size:40px;width:250px;font-weight:700;color:#542f82;display:inline-block;line-height:1;}
#header .logo-box a small {font-size:14px;font-weight:normal;display:block;margin-top:4px;}
   
/* header - menus */
#menus {position:absolute;left:0;bottom:0;width:100%;border-top:solid 3px #518ddd;border-bottom:solid 1px #999;font-size:0;z-index:2;}
#menus:after {content:'';clear:both;display:table;}
#menus .brands {padding:0;margin:0;list-style:none;float:left;}
#menus .brands li {display:inline-block;position:relative;font-size:20px;font-weight:500;}
#menus .brands > li:hover:after {content:'';position:absolute;left:0;top:-2px;height:4px;width:100%;background:#000;}
#menus .brands li a {display:inline-block;padding:14px 22px;font-size:18px;}
#menus .brands > li:hover > a,
#menus .brands li a:hover,
#menus .brands li a:focus{color:#f00;}
#menus .brands li ul {position:absolute;left:0;top:100%;display:block;width:auto;min-width:100%;padding:5px 0 10px 0;margin:0;list-style:none;background:#fff;border:solid 1px #ccc;display:none;border-top-color:#fff;box-shadow:#ccc 0 2px 2px;}
#menus .brands li:hover ul {display:block;}
#menus .brands li ul li {display:block;}
#menus .brands li ul li a {display:block;padding:5px 22px;font-size:16px;white-space:nowrap;}
#menus .brands li ul li a:focus,
#menus .brands li ul li a:hover {background:#fff;color:#ff0000;}
#menus .categories {padding:0;margin:0;list-style:none;float:right;}
#menus .categories li {display:inline-block;}
#menus .categories li a {display:inline-block;padding:18px 10px;font-size:14px; color:#518ddd;}
#menus .categories li a:hover,
#menus .categories li a:focus{background:#efefef;}
#menus .categories li a.more {background:#518ddd;color:#fff;}

/* header - menus 펼침 */
#menus.all {bottom:auto;top:100px;background:#fff;}
#menus.all .brands {display:table;}
#menus.all .brands li a.more {background:#333;color:#fff;}
#menus.all .brands li a.more i.fa-bars::before {content:"\f00d";}
#menus.all .brands > li {display:table-cell;border-right:solid 1px #ccc;}
#menus.all .brands > li > ul {display:block;position:static;border:none;box-shadow:none;border-top:solid 1px #ccc;}

/* footer */
#footer {clear:both;margin-top:40px;background:#333;}
#footer .copy {display:table;width:100%;border-left:solid 1px #ccc;table-layout:fixed;}
#footer .copy .copy-box {display:table-cell;padding:20px;color:#fff;border-right:solid 1px #ccc;}
#footer .copy a {color:#ccc;}
#footer .copy a:focus,
#footer .copy a:hover {color:#fff;}

/* products */
.products ol {display:block;padding:0;margin:0;list-style:none;}
.products ol:after {content:'';clear:both;display:table;}
.products ol li {display:block;float:left;width:303px;margin-left:16px;margin-bottom:16px;}
.products ol li:nth-child(4n+1) {margin-left:0;clear:left;}
.products ol li a {display:block;position:relative;border:solid 1px;}
.products ol li a img {width:100%;padding:0px;}
.products ol li a .thumb {font-size:0;background-color:#fff;}
.products ol li a .name {border-top:solid 1px;min-height:4.0em;padding:15px 0px 15px 10px;background:#f6f6f6;font-size: 20px;font-weight:500;}
.products ol li a .code {font-size:15px;color:#555; letter-spacing:1px;font-weight:500;}
.products ol li a .price {border-top:solid 1px;padding:20px;position:relative;}
.products ol li a .price .won{font-size: 13px;color: #444;}
.products ol li a .price strong {float:right;font-size:22px;}
.products ol li a,
.products ol li a .name,
.products ol li a .price {border-color:#ebebeb;}
.products ol li a:hover,
.products ol li a:focus,
.products ol li a:hover .name,
.products ol li a:focus .name,
.products ol li a:hover .price,
.products ol li a:focus .price {border-color:#999;}

.products ol.slide {white-space:nowrap;}
.products ol.slide li:nth-child(4n+1) {clear:none;}
.products .bx-wrapper {max-width:100% !important;}
.products .bx-viewport {height:auto !important;}

#fix-right {position:fixed;bottom:60px;left:0;width:100%;z-index:3;}
#fix-right .to-top {position:absolute;top:0;right:-40px;}
#fix-right .to-top i {display:block;width:36px;height:36px;line-height:32px;font-size:24px;text-align:center;background:#666;color:#fff;border-radius:4px;}

/* 1차 카테고리별 썸네일 bgcolor */
.product-basic.root-category-2 #photos img,
.products ol li.root-category-2 .thumb {background-color:#c1dae5;} /* 정수기 */
.product-basic.root-category-1 #photos img,
.products ol li.root-category-1 .thumb {background-color:#e2e6db;} /* 공기청정기 */
.product-basic.root-category-3 #photos img,
.products ol li.root-category-3 .thumb {background-color:#e8e1db;} /* 비데/연수기 */
.product-basic.root-category-4 #photos img,
.products ol li.root-category-4 .thumb {background-color:#ebeae8;} /* 침대/매트리스 */
.product-basic.root-category-5 #photos img,
.products ol li.root-category-5 .thumb {background-color:#ddded8;} /* 생활가전 */

