@charset "utf-8";

#wrapper {width:100% !important;}
#container {width:100% !important;}
#footer {margin-top:0 !important}

.mainVisual {position:relative}
#main_bn, #main_bn .bx-viewport, #main_bn .bx-viewport img {min-height:370px}

.mainQuick {position: absolute; top: 20px;left: 50%; width: 200px; height: 320px; margin: 0 0 0 -600px; z-index:5;  background-color:#fff; border-radius:5px;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.2);
-ms-box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.2);}
.mainQuick > h1 {position:relative; width:100%; height: 40px; padding-left:58px; line-height: 40px; font-family: 'NanumSquareNeoVariable',sans-serif; background: #ff8601; color: #fff; font-size: 14px; border-radius: 5px 5px 0 0;}
.mainQuick > h1:before {content:""; background: url(/img/layout_splite.png) no-repeat left -200px top 0px; width: 15px; height: 14px; position:absolute; top:13px; left:30px;}
.mainQuick > ul.order_now {width:100%; cursor: pointer;position: relative; font-size:14px;}
.mainQuick > ul.order_now > li {clear:both; position:relative; height: 56px; line-height: 57px;}
.mainQuick > ul.order_now > li:hover {background: url(/img/subCateArrow.jpg) no-repeat right 10px top 24px;}
.mainQuick > ul.order_now > li:hover:before {left: 0; top:0; width:100%; height: 101%; border:1px solid #ff8601; border-right:0; border-radius:4px 0 0 4px; z-index: 2} 
.mainQuick > ul.order_now > li:hover:before, .mainQuick > ul.order_now > li:hover:after {content:''; position: absolute; }

.mainQuick > ul.order_now > li:hover:after {right:-1px; top:1px; height:54px; width:2px; border:1px solid #fff;  z-index: 3}
.mainQuick > ul.order_now > li .sub-cate {position: absolute; width:190px; top:0; left:175px; background-color:#fff; border-top:1px solid #ff8601; border-bottom:1px solid #ff8601; float:left; display:none}
.mainQuick > ul.order_now > li:first-child .sub-cate {width:350px;}
.mainQuick > ul.order_now > li:nth-child(2) .sub-cate {width:250px;}
.mainQuick > ul.order_now > li .sub-cate ul > li {height:36px; padding:0 10px; line-height:36px; border-left:1px solid #ff8601; border-right:1px solid #ff8601;}
.mainQuick > ul.order_now > li .sub-cate ul > li:not(:last-child) {border-bottom:1px solid #eeeeee}
.mainQuick > ul.order_now > li .sub-cate ul > li span, .mainQuick > ul.order_now > li .sub-cate ul > li > a {font-size:13px;}
.mainQuick > ul.order_now > li .sub-cate ul > li span:hover, .mainQuick > ul.order_now > li .sub-cate ul > li > a:hover {color:#ff8601; display:inline-block}
.mainQuick > ul.order_now > li .sub-cate ul > li strong {display: inline-block; float: right;}
.mainQuick > ul.order_now > li .sub-cate ul > li strong a {font-size:12px; font-weight:normal; display: inline-block; text-align:center;  width:72px; height:26px; line-height:26px; border-radius:15px; position: relative; top:-1px;}
.mainQuick > ul.order_now > li .sub-cate ul > li strong a:first-child {background-color:#ff8601; color:#fff}
.mainQuick > ul.order_now > li .sub-cate ul > li strong a:last-child {border:1px solid #ff8601; color:#ff8601}
.mainQuick > ul.order_now > li:not(:last-child) {border-bottom: #e5e5e5 1px solid;}
.mainQuick > ul.order_now > li > a {display:block; padding-left:50px; letter-spacing:-1.5px; font-weight: 500;}
.mainQuick > ul.order_now > li > a:before {content:""; position:absolute; width: 36px; top:5px;left:8px; height:50px; overflow:hidden;}
.mainQuick > ul.order_now > li:first-child > a:before {background: url(/img/layout_splite.png) no-repeat left 0 top -188px;}
.mainQuick > ul.order_now > li:nth-child(2) > a:before {background: url(/img/layout_splite.png) no-repeat left 0 top -262px;}
.mainQuick > ul.order_now > li:nth-child(3) > a:before {background: url(/img/plentybeaf.jpg) no-repeat center center !important; background-size:31px 43px !important;}
.mainQuick > ul.order_now > li:nth-child(4) > a:before {background: url(/img/layout_splite.png) no-repeat left 0 top -410px;}
.mainQuick > ul.order_now > li:nth-child(5) > a:before { background: url(/img/layout_splite.png) no-repeat left 0 top -483px;}

.infoSection {width:100%; overflow:hidden;}
.infoSection .ifinner {width: 1200px; margin: 60px auto 30px auto; height:260px; text-align: center;}
.infoSection01 .ifinner > ul > li {position:relative; float: left; width: 16.6%; height: 260px; padding: 15px;display:inline-block; text-align: center;}
.infoSection01 .ifinner > ul > li span { position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 190px; color: #fff; background: rgba(0,0,0,.4); z-index: 99; font-size:18px; display:none;}
.infoSection01 .ifinner > ul > li:hover span {display:block;}
.infoSection01 .ifinner > ul > li img {width:170px; height:170px;}
.infoSection01 .ifinner > ul > li > a > div {position:relative; width:170px; height:170px; border-radius:100%; overflow:hidden; width:100%;}
.infoSection01 .ifinner > ul > li > a > h1 {padding: 15px 20px 10px 20px; font-weight:normal; font-size:14px; font-weight: 500; }
.infoSection01 .ifinner > ul > li:hover > a > h1 {color:#ff8601}

.reco_product {display:inline-block; width:100%; margin-bottom:60px;}
.reco_product ul {width:1012px; margin:0 auto;}
.reco_product ul > li {float:left; width:25%;     margin: 0 0 10px 0;     border-radius: 5px;     text-align: center; overflow:hidden;}
.reco_product ul > li:first-child {width:50%; padding:0 20px 0 0; }
.reco_product ul > li:first-child a { width:100%; overflow: hidden; display:inline-block; height:477px; }
/*.reco_product ul > li:first-child a img { width:auto; height:100%; }*/
.reco_product ul > li a { width:100%; overflow: hidden; display:inline-block; border-radius: 20px; }
.reco_product ul > li a img { width:100%; height:auto; }

.reco_product > ul > li:first-child .bn_title { display:inline-block; width:100%; padding:10px 10px; }
.reco_product > ul > li:first-child .bn_title > .subtitle { font-size:13px; font-weight: bold; color:#ff8601; display:inline-block; width:100%; margin:0 0 5px 0;}
.reco_product > ul > li:first-child .bn_title > .maintitle { font-size:24px; font-weight: normal; color:#000; display:inline-block; width:100%; }
.reco_product > ul > li:first-child .bn_title > .strongtitle { font-size:24px; font-weight: bold; color:#000; display:inline-block; width:100%; }
.reco_product > ul > li:first-child .bn_title > .smalltitle { font-size:14px; font-weight: bold; color:#888; display:inline-block; width:100%; margin:5px 0 0 0; }

.reco_product > ul > li:not(:first-child) { padding:0 5px; }
.reco_product > ul > li:not(:first-child) .bn_title { display:inline-block; width:100%; padding:10px 5px;}
.reco_product > ul > li:not(:first-child) .bn_title > .subtitle { font-size:12px; font-weight: bold; color:#ff8601; display:inline-block; width:100%; margin:0 0 5px 0;}
.reco_product > ul > li:not(:first-child) .bn_title > .maintitle { font-size:18px; font-weight: normal; color:#000; display:inline-block; width:100%; } 


.onlyBanner {height:200px; margin-bottom:90px; width:100%;}
.mainBig {width: 1000px;margin: 0 auto 90px auto;}
.mainBig > ul {display:inline-block; width:100%; overflow:hidden;}
.mainBig > ul > li {width: 49%; float: left}
.mainBig > ul > li:first-child {margin: 0 10px 0 0;}
.mainBig > ul li img {max-width: 100%;}


/*사회공헌 ~ 고객센터*/
.mainBoard { width:100%; margin:0 0 0 0 !important; padding:0 0 30px 0 !important; text-align: center; display:inline-block; border:0 !important; background:#f4efe9; }
.bo_wrap { width:1000px; margin:0 auto; text-align: left; display:inline-block;}
.bo_wrap > li { width:50%; float: left;}
.bo_wrap > li.mainMedia a { display:inline-block; }
.bo_wrap > li.mainMedia > .pic_lt {float:left;}
.bo_wrap > li .mainFaq, .bo_wrap > li .mainNotice {background:#fff; border-radius: 10px; padding:15px; margin:0 0 0 30px !important; height:150px;}
.bo_wrap > li .mainFaq {display:none;}
.bo_wrap > li .mainFaq > div, .bo_wrap > li .mainNotice > div {width:50%; float:left;} 
.bo_wrap > li:last-child h3 { font-size:12px; font-weight: bold; color:#000; }
.bo_wrap > li:last-child h1 { font-size:32px; font-family: 'NanumSquareNeoVariable'; color:#000; margin:0 0 10px 0;}
.bo_wrap > li:last-child h1 > strong { color:#ff8601 }
.bo_wrap > li:last-child h4 { font-size:12px; font-weight: normal; color:#777; }
.bo_wrap > li:last-child h5 { font-size:12px; font-weight: bold; color:#000; }

.mainCustomTab { width:100%; text-align: center; font-size:12px; display:inline-block; margin:0 0 10px 0;}
.mainCustomTab > span { color:#adacab; display:inline-block; padding:0 5px; margin:0 5px; cursor:pointer;}
.mainCustomTab > span.on { color:#000; font-weight: bold;}

.lat_title { text-align:center; height:25px; font-family:'NanumSquareNeoVariable'; font-size:22px; font-weight: bold; margin:40px 0 40px 0; padding:0; display:inline-block; width: 100%; position:relative; vertical-align:middle;}
.lat_title > strong { position:relative; display:inline-block; margin:0 0 0 0; }
.lat_title > strong i { display:inline-block; width:25px; height:25px; position:absolute; margin:0; }
.lat_title > strong i:first-child { background: url('/img/layout_splite.png') no-repeat left -74px top -349px; left:-40px; }
.lat_title > strong i:last-child { background: url('/img/layout_splite.png') no-repeat left -122px top -349px; right:-40px; }

.pic_lt > ul > li.empty_li {width:100% !important}

#main_bn .slide-wrap > li a {display:block; height:370px;}
#main_bn .slide-wrap > li img{height:auto; position: absolute; top:0; left:50%; margin-left:-1000px;} 

.infoSection .ifinner {
	margin: 20px auto 10px auto !important; 
    height: auto !important;
}
.infoSection01 .ifinner > ul {
	display:flex; flex-direction: row; justify-content: center; align-items: center;
}
.infoSection01 .ifinner > ul > li {  
	height: auto !important;
	padding:15px 0 !important;
	width:14% !important;
}
.infoSection01 .ifinner > ul > li > a > div {
	width:120px !important;
	height:120px !important;
	margin:0 auto !important;
}
.infoSection01 .ifinner > ul > li img {
	width:120px !important;
	height:120px !important;
}
.infoSection01 .ifinner > ul > li span { 
    line-height: 120px !important; 
    font-size: 12px !important; 
}

.infoSection .ifinner_dx {
	margin: 20px auto 10px auto !important;
	height: auto !important;
}
.infoSection01 .ifinner_dx > ul {
	display:flex; flex-direction: row; justify-content: center; align-items: center;
}
.infoSection01 .ifinner_dx > ul > li {
	height: auto !important;
	padding:15px 0 !important;
	width:14% !important;
}
.infoSection01 .ifinner_dx > ul > li > a > div {
	width:120px !important;
	height:120px !important;
	margin:0 auto !important;
}
.infoSection01 .ifinner_dx > ul > li img {
	width:120px !important;
	height:120px !important;
}
.infoSection01 .ifinner_dx > ul > li span.thumbBg {
	line-height: 120px !important;
	font-size: 12px !important;
}

.infoSection .ifinner_dx {width: 1200px; margin: 60px auto 30px auto; height:260px; text-align: center;}
.infoSection01 .ifinner_dx > ul > li {position:relative; float: left; width: 16.6%; height: 260px; padding: 15px;display:inline-block; text-align: center;}
.infoSection01 .ifinner_dx > ul > li span.thumbBg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 190px; color: #fff; background: rgba(0,0,0,.4); z-index: 99; font-size:18px; display:none;}
.infoSection01 .ifinner_dx > ul > li:hover span.thumbBg {display:block;}
.infoSection01 .ifinner_dx > ul > li img {width:170px; height:170px;}
.infoSection01 .ifinner_dx > ul > li > a > div {position:relative; width:170px; height:170px; border-radius:100%; overflow:hidden; width:100%;}
.infoSection01 .ifinner_dx > ul > li > a > h1 {padding: 15px 20px 10px 20px; font-weight:normal; font-size:14px;}
.infoSection01 .ifinner_dx > ul > li:hover > a > h1 {color:#ff8601}

.brandsBanner { width: 1200px;margin:10px auto 50px auto }
.brandsBanner > h1 { font-size: 24px; margin-bottom: 50px;;color:#ff9902;font-family: 'NanumSquareNeoVariable'; }
.brandsBanner > ul { display: flex; justify-content: space-evenly; }
.brandsBanner > ul > li  { border: 2px solid #eee; border-radius: 30px; }
.brandsBanner > ul > li img { border-radius: 30px; width: 400px; height: 300px; }

.photoReview { width: 1200px;margin:10px auto 50px auto; }
.photoReview > h1 { font-size: 24px; margin-bottom: 20px;;color:#ff9902;font-family: 'NanumSquareNeoVariable'; }
.photoReview > p { margin:5px 0 20px; font-size: 16px; }

.photoReview > div { display:flex; flex-direction: row; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.photoReview > div > a { width: 23.5%; margin:0 0 30px 0; }
.photoReview > div .photos { width: 100%;display: inline-block; }
.photoReview > div .photos > div.photo-file { height:282px;background:#eee; overflow: hidden; border-radius: 10px; }
.photoReview > div .photos > div.photo-file > img { width:100%;height: auto;object-fit: fill }
.photoReview > div .photos > div.photo-file > img.height { width:auto; height:100%; }

.photoReview > div .photos > h6 { margin: 15px 0 10px 0;width: 100%;display: flex;justify-content: flex-start; }
.photoReview > div .photos > h6 > span { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: normal; }
.photoReview > div .photos > h6 > div { display: flex;width: 10%;justify-content: space-evenly;align-items: baseline; margin:0 10px 0 0; }
.photoReview > div .photos > h6 > div > span { font-size: 16px }

.photoReview > div .photos > .scores { margin-bottom: 10px }
.photoReview > div .photos > .scores > ul { display: flex }
.photoReview > div .photos > .scores > ul > li { font-size:11px;display:flex; justify-content: flex-start; align-items: center; background:#f8f8f8; height:20px; padding:0 5px; border-radius: 2px; margin:0 2px 2px 0; }
.photoReview > div .photos > .scores > ul > li > span { margin:0 5px 0 0 }

.photoReview .is_content { width:100%; display:flex; }
.photoReview .is_content > p  { width:100%;  overflow: hidden; line-height: 18px; color:#555; font-size: 12px;
	display: -webkit-box; letter-spacing: -0.03em;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis; }