@charset 'utf-8';

/*
 * Copyright    :    ONEDAYNET.CO.KR
 * SOLUTION     :    HYSSENCE 3.0
 * Directory    :    pages/css/
 * File         :    hyssence.css
 * SUMMARY      :    (스킨별) 헤더/푸터/메인페이지 영역
 */





/* ********************************************** *
 * HEADER
 * ********************************************** */
.header {background:#f6f6f6; overflow:hidden;}
.header img {max-width:100%}
.header li {list-style:none;}

.header .inner {display:table; width:100%; box-sizing:border-box; table-layout:fixed; border-bottom:1px solid #ddd;}
.header .inner li {display:table-cell; vertical-align:middle; height:50px; box-sizing:border-box; padding-top:3px;}
.header .this_logo {width:50%; text-align:center; }
.header .this_left {text-align:left; padding-left:5px;}
.header .this_right {text-align:right; padding-right:5px;}
.header .this_logo img {height:20px; width:auto !important; float:left;}
.header .this_logo a {overflow:hidden; padding:5px;}
.header .btn {float:left; height:35px; width:35px; overflow:hidden;}
.header .btn_slide {background:transparent url('../images/skin/header_slide.png') center center no-repeat; background-size:22px;}
.header .btn_search {background:transparent url('../images/skin/header_search.png') center center no-repeat; background-size:20px;}
.header .btn_cart {background:transparent url('../images/skin/header_cart.png') center center no-repeat; background-size:20px;}
.header .cart_num {display:block; text-align:center; font-weight:600; color:#cd3726; font-weight:600; font-size:11px; height:35px; line-height:42px;}

.header .search_box {background:#fff; overflow:hidden; position:absolute; left:0; top:52px; width:100%; padding:15px 20px; box-sizing:border-box; z-index:500; border-bottom:1px solid #ddd; display:none; }
.header .search_box .form_box {overflow:hidden; position:relative;}
.header .search_box .input_search {border:1px solid #ddd; width:100%; box-sizing:border-box; height:40px; padding-left:10px; padding-right:40px; font-size:14px;}
.header .search_box .input_search:focus {border-color:#999; color:#333;}
.header .search_box .btn_search {position:absolute; right:0; top:0; height:40px; width:40px; background:transparent url('../images/skin/header_search.png') center center no-repeat; z-index:1}
.header .search_box .btn_search {background-size:18px;}
.header .keyword_box {overflow:hidden; text-align:center; padding:15px 20px; padding-bottom:10px; font-size:0px;}
.header .keyword_box .link {display:inline-block; padding:0 5px; height:25px; line-height:26px; font-size:13px; border:1px solid #ddd; border-radius:100px; margin:2px; background:#fafafa;}

.header.if_search_open .search_box {display:block; }










/* ********************************************** *
 * FOOTER
 * ********************************************** */
.footer {overflow:hidden; background:#424342; text-align:center;}
.footer li {list-style:none;}
.footer .bottom_menu {background:#fff}
.footer img {width:100%; float:left;}

.footer .bottom_menu {background:#fff; overflow:hidden;}
.footer .bottom_menu li {float:left; width:50%; border-top:1px solid #e2e2e2; box-sizing:border-box;}
.footer .bottom_menu li:nth-of-type(2n) {border-left:1px solid #e2e2e2;}
.footer .bottom_menu .btn {display:block; height:40px; line-height:39px; font-size:12px;}

.footer .info_box {padding:30px;}
.footer .info_box .txt {color:#ccc; line-height:1.5; margin:0 7px; font-size:12px;}
.footer .info_box .shop_name {font-weight:600; color:#ccc; font-size:17px; margin-bottom:10px;}
.footer .info_box .copy {color:#999; margin-top:15px; font-size:12px;}

.footer .sns_box {overflow:hidden; margin-bottom:20px;}
.footer .sns_box ul {display:inline-block; overflow:hidden; font-size:0px;}
.footer .sns_box li {list-style:none; display:inline-block;}
.footer .sns_box .sns {padding:5px 8px; margin:0 3px;}
.footer .sns_box img {height:18px; width:auto;}

@media screen and (min-width:650px) {
	.footer .bottom_menu li {width:25%;}
	.footer .bottom_menu li+ li {border-left:1px solid #e2e2e2;}
}









/* ********************************************** *
 * 메인 : 바로가기메뉴
 * ********************************************** */
.main_nav {background:#fff; overflow:hidden;}
.main_nav ul {display:table; width:100%; box-sizing:border-box; table-layout:fixed; border-collapse:separate; border-spacing:0px;}
.main_nav li {list-style:none; display:table-cell; vertical-align:middle;}
.main_nav .btn {display:block; color:#333; font-size:14px; text-align:center; letter-spacing:-0.5px; height:40px; line-height:42px; position:relative; overflow:hidden;}
.main_nav li+ li .btn:before {content:""; width:1px; height:12px; background:#ddd; position:absolute; left:0; top:50%; margin-top:-6px;}







/* ********************************************** *
 * 메인 단락 타이틀
 * ********************************************** */
.main_title {text-align:center; font-size:23px; color:#000;}







/* ********************************************** *
 * 메인 비주얼배너
 * ********************************************** */
.main_visual {position:relative; overflow:hidden;}

/* 롤링배너 */
.main_visual .rolling_box {position:relative;}
.main_visual .visual_box {overflow:hidden;}
.main_visual .visual_box img {width:100%; float:left;}
.main_visual .visual_box a {width:100%; float:left;}

/* 롤링 아이콘 */
.main_visual .rolling_icon {position:absolute; left:0; bottom:10px; width:100%; text-align:center; z-index:11;}
.main_visual .rolling_icon .lineup {display:inline-block; overflow:hidden;}
.main_visual .rolling_icon .icon {width:10px; height:10px; float:left; margin:0 5px; background:rgba(51,51,51,0.3); border-radius:100px;}
.main_visual .rolling_icon .active {background:#333;}









/* ********************************************** *
 * 메인 MD'S PICK
 * ********************************************** */
.main_md {margin-top:30px; text-align:center; padding:0 15px;}
.main_md li {list-style:none;}

/* 카테고리 탭 */
.main_md .md_tab {text-align:center; overflow:hidden; margin-top:10px; height:35px;}
.main_md .md_tab ul {display:inline-block;}
.main_md .md_tab li {list-style:none; float:left; }
.main_md .md_tab .btn {display:block; text-align:center; min-width:100px; border:1px solid #ddd; border-left:0 !important; background:#f5f5f5; position:relative; box-sizing:border-box;}
.main_md .md_tab .btn {height:35px; line-height:35px; font-size:12px; color:#888; padding:0 5px;}
.main_md .md_tab li:first-child .btn {border-left:1px solid #ddd !important;}
.main_md .md_tab .hit .btn {border:1px solid #ddd !important; border-left:0 !important; color:#333; background:#fff;}
.main_md .md_tab .hit .btn:before {display:none;}
.main_md .md_tab .hit .btn:after {content:""; position:absolute; left:0; bottom:-1px; width:100%; height:2px; background:#fff;}

.main_md .rolling_box {overflow:hidden;}

/* 롤링 아이콘 */
.main_md .rolling_icon {text-align:center; position:relative;}
.main_md .rolling_icon .lineup {display:inline-block; position:relative; height:12px;}
.main_md .rolling_icon .icon {width:10px; height:10px; float:left; margin:0 5px; background:rgba(51,51,51,0.3); border-radius:100px;}
.main_md .rolling_icon .active {background:#333;}

/* 롤링페이징 */
.main_md .rolling_nate {text-align:center; margin-top:0;}
.main_md .rolling_nate .lineup {border-radius:100px;  border:1px solid #eee; overflow:hidden; box-sizing:border-box; height:25px;}
.main_md .rolling_nate .pagi {color:#aaa; display:inline-block; float:left; height:25px; line-height:25px;}
.main_md .rolling_nate .pagi strong {color:#000;}
.main_md .rolling_nate .btn {width:30px; height:24px; box-sizing:border-box; padding:0px; display:inline-block !important;}
.main_md .rolling_nate .btn.btn_prev {float:left !important;}
.main_md .rolling_nate .btn.btn_next {float:right !important}
.main_md .rolling_nate .btn {display:block; padding:5px; overflow:hidden; background:transparent url('../images/skin/main_nate_pv.png') center center no-repeat; background-size:7px;}
.main_md .rolling_nate .btn.btn_next {background:transparent url('../images/skin/main_nate_nx.png') center center no-repeat; background-size:7px;}


/* 롤링 이전다음버튼 */
.main_md .prevnext {position:absolute; top:-10px; z-index:10; display:none;}
.main_md .prevnext.prev {left:-35px; }
.main_md .prevnext.next {right:-35px;}
.main_md .prevnext a {display:block; padding:5px; overflow:hidden;}
.main_md .prevnext .icon {width:15px; height:20px; background:transparent url('../images/skin/main_nate_pv.png') center center no-repeat; background-size:8px;}
.main_md .prevnext.next .icon {background:transparent url('../images/skin/main_nate_nx.png') center center no-repeat; background-size:8px;}

/* 상품노출 */
.main_md .item_list {margin-top:20px;}

.main_md .item_box .item_name {font-weight:400; color:#666 !important; -webkit-line-clamp: 2 !important; height:32px; line-height:16px; padding-left:5px; padding-right:5px;}
.main_md .item_box .info {border:0 !important;}
.main_md .item_box .info .sub_name {display:none;}








/* ********************************************** *
 * 메인 중간배너
 * ********************************************** */
.main_ad {margin-top:30px; padding:0 15px;}
.main_ad li {list-style:none;}
.main_ad a {float:left; width:100%;}
.main_ad img {width:100%; float:left;}
.main_ad .banner {overflow:hidden;}

/* 배너 3개 */
.main_ad .triple {overflow:hidden;}
.main_ad .triple ul {margin-left:-10px; margin-top:-10px}
.main_ad .triple li {float:left; width:50%; overflow:hidden; margin-top:10px; box-sizing:border-box;}
.main_ad .triple .banner {margin-left:10px;}

/* 배너1개 */
.main_ad .single {overflow:hidden;}
.main_ad .single ul {margin-top:-10px}
.main_ad .single li {margin-top:10px; overflow:hidden;}

/* 배너 공간구분 */
.main_ad .triple+ .single {margin-top:10px}
.main_ad .single+ .triple {margin-top:10px}









/* ********************************************** *
 * 메인 카테고리베스트
 * ********************************************** */
.main_ctg {margin-top:30px; overflow:hidden;}
.main_ctg .best_box {background:#f5f5f5; margin-top:20px; overflow:hidden; padding:40px 0; position:relative;}
.main_ctg .main_title {background:#fff; padding-bottom:10px; }
.main_ctg  li {list-style:none;}

 /* 카테고리 탭 */
.main_ctg .best_tab {box-sizing:border-box; position:relative; height:37px; overflow:hidden; text-align:center;}
.main_ctg .best_tab:before {content:""; width:100%; height:1px; background:#ddd; position:absolute; left:0; bottom:0; z-index:-11}
.main_ctg .best_tab ul {display:inline-block; height:36px; margin-left:-1px;}
.main_ctg .best_tab li {float:left; border-top:1px solid #ddd; background:#f5f5f5; }
.main_ctg .best_tab li+ li .btn {margin-left:-1px;}
.main_ctg .best_tab .btn {display:block; text-align:center; height:35px; line-height:35px; letter-spacing:-0.5px; color:#888; position:relative; padding:0 15px; font-size:12px;}
.main_ctg .best_tab .btn {border:1px solid #ddd; border-top:0; }
.main_ctg .best_tab .hit .btn {color:#000; background:#fff !important; border-bottom:1px solid #fff;}

.main_ctg .rolling_box {margin-top:20px; padding:0 15px;}

/* 롤링 아이콘 */
.main_ctg .rolling_icon {text-align:center; position:relative;}
.main_ctg .rolling_icon .lineup {display:inline-block; position:relative; height:12px;}
.main_ctg .rolling_icon .icon {width:10px; height:10px; float:left; margin:0 5px; background:rgba(51,51,51,0.3); border-radius:100px;}
.main_ctg .rolling_icon .active {background:#333;}

/* 롤링 이전다음버튼 */
.main_ctg .prevnext {position:absolute; top:-10px; z-index:10; display:none;}
.main_ctg .prevnext.prev {left:-35px; }
.main_ctg .prevnext.next {right:-35px;}
.main_ctg .prevnext a {display:block; padding:5px; overflow:hidden;}
.main_ctg .prevnext .icon {width:15px; height:20px; background:transparent url('../images/skin/main_nate_pv.png') center center no-repeat; background-size:8px;}
.main_ctg .prevnext.next .icon {background:transparent url('../images/skin/main_nate_nx.png') center center no-repeat; background-size:8px;}

/* 롤링페이징 */
.main_ctg .rolling_nate {text-align:center; margin-top:10px;}
.main_ctg .rolling_nate .lineup {border-radius:100px;  border:1px solid #eee; overflow:hidden; box-sizing:border-box; height:25px;}
.main_ctg .rolling_nate .pagi {color:#aaa; display:inline-block; float:left; height:25px; line-height:25px;}
.main_ctg .rolling_nate .pagi strong {color:#000;}
.main_ctg .rolling_nate .btn {width:30px; height:24px; box-sizing:border-box; padding:0px; display:inline-block !important;}
.main_ctg .rolling_nate .btn.btn_prev {float:left !important;}
.main_ctg .rolling_nate .btn.btn_next {float:right !important}
.main_ctg .rolling_nate .btn {display:block; padding:5px; overflow:hidden; background:transparent url('../images/skin/main_nate_pv.png') center center no-repeat; background-size:7px;}
.main_ctg .rolling_nate .btn.btn_next {background:transparent url('../images/skin/main_nate_nx.png') center center no-repeat; background-size:7px;}


/* 상품노출 */
.main_ctg .item_box .item_name {color:#666 !important; -webkit-line-clamp: 2 !important; height:32px; line-height:16px; padding-left:5px; padding-right:5px;}
.main_ctg .item_box .sub_name {display:none !important;}
.main_ctg .item_box .info {border:0 !important; }





/* ********************************************** *
 * 메인 상품공간
 * ********************************************** */
.main_item {margin-top:30px; overflow:hidden; background:#fafafa; padding:30px 15px;}
.main_item .item_list {margin-top:10px}
.main_item .item_box .sub_name {display:none !important;}
.main_item .item_box .item_name {color:#666 !important}

.main_item+ .main_item {margin-top:0px; border-top:1px solid #eee; background:#fff;}






/* ********************************************** *
 * 메인 풀배너
 * ********************************************** */
.main_wide {overflow:hidden; position:relative; margin-top:30px;}

/* 배너이미지 */
.main_wide .banner {position:relative; overflow:hidden; text-align:center;}
.main_wide .banner img {max-width:100%; float:left;}
.main_wide .banner a {width:100%; float:left;}

/* 롤링 이전다음버튼 */
.main_wide .prevnext {position:absolute; top:50%; z-index:3; margin-top:-24px}
.main_wide .prevnext.prev {left:5px; }
.main_wide .prevnext.next {right:5px;}
.main_wide .prevnext a {display:block; padding:10px}
.main_wide .prevnext .icon {width:12px; height:25px; background:transparent url('../images/skin/main_full_pv.png') left center no-repeat; background-size:10px;}
.main_wide .prevnext.next .icon {background:transparent url('../images/skin/main_full_nx.png') right center no-repeat; background-size:10px;}








/* ********************************************** *
 * 메인 베스트리뷰
 * ********************************************** */
.main_review {margin-top:30px; padding:0 15px;}
.main_review li {list-style:none;}
.main_review .review {margin-top:10px; border:1px solid #e6e6e6;}
.main_review .review .li+ .li {border-top:1px solid #e6e6e6;}

/* 박스전체 */
.main_review .review_box {position:relative; padding:15px; box-sizing:border-box; overflow:hidden;}

/* 아이템 정보 */
.main_review .review_item {overflow:hidden; position:relative; box-sizing:border-box;}
.main_review .review_item .thumb {width:95px; background:#f5f5f5 url('../images/skin/none_photo.png') center center no-repeat; background-size:22px;}
.main_review .review_item .thumb {overflow:hidden; border:1px solid #eee; box-sizing:border-box; float:left;}
.main_review .review_item .thumb {position:relative;}
.main_review .review_item .thumb img {width:100%; float:left;}
.main_review .review_item .thumb .real_img {position:absolute; left:0; top:0; width:100%; height:100%;}
.main_review .review_item .thumb .fake_img {overflow:hidden;}
.main_review .review_item .info {padding-left:110px; box-sizing:border-box;}
.main_review .review_item .ctg {color:#666; letter-spacing:-0.5px; margin-top:3px;}
.main_review .review_item .item_name {font-size:14px; color:#333; letter-spacing:-0.5px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box;}
.main_review .review_item .price { margin-top:16px;  font-size:14px; color:#333; font-weight:600; letter-spacing:-0.5px; line-height:13px;}
.main_review .review_item .price .won {float:left; font-size:16px; float:left; line-height:15px; letter-spacing:-0.5px; margin-top:-0.05em;}

/* 리뷰 글목록 */
.main_review .review_list {padding-top:14px; box-sizing:border-box;}
.main_review .review_list li { list-style:none; overflow:hidden; margin:3px 0; position:relative;}
.main_review .review_list .mark { width:70px; height:11px; display: inline-block; margin:1px 13px 0 2px; position:absolute; left:0; top:0;}
.main_review .review_list .mark {background:transparent url('../images/skin/main_review_star.png') left top no-repeat; background-size:70px;}
.main_review .review_list .star {width:100%; height:100%; float:left;}
.main_review .review_list .star {background:transparent url('../images/skin/main_review_star.png') left bottom no-repeat; background-size:70px;}
.main_review .review_list .txt {letter-spacing:-0.5px; color:#666; font-size:12px; padding-left:80px;}
.main_review .review_list .txt {overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box;}

@media screen and (min-width:600px) {
	.main_review .review_item {float:left; width:50%; padding-right:15px; border-right:1px solid #eee;}
	.main_review .review_list {float:right; width:50%; padding-left:15px;}
	.main_review .review_item .item_name { -webkit-line-clamp: 2}
}








/* ********************************************** *
 * 메인 인스타그램
 * ********************************************** */
.main_insta {margin-top:40px; padding:0 15px;}
.main_insta li {list-style:none;}

/* 타이틀 */
.main_insta .insta_title {position:relative; text-align:center;}
.main_insta .insta_title .title {font-size:23px; color:#000; height:30px; line-height:30px; padding-left:30px; }
.main_insta .insta_title .title {background:transparent url('../images/skin/main_insta.png') left center no-repeat; background-size:22px;}
.main_insta .insta_title .insta_id {font-size:14px; color:#666; margin-top:5px;}

/* 사진목록 */
.main_insta .insta_list {margin-top:20px; overflow:hidden; text-align:center;}
.main_insta .insta_list ul {margin-left:-15px; margin-top:-15px;}
.main_insta .insta_list li {list-style:none; width:25%; overflow:hidden; float:left; margin-top:15px;}

/* 사진 하나 */
.main_insta .insta_box {overflow:hidden; position:relative; margin-left:15px; text-align:center; }
.main_insta .insta_box {background:#f5f5f5 url('../images/skin/main_insta_no.png') center center no-repeat; background-size:20px;}
.main_insta .insta_box img {width:100%; height:100%; float:left;}
.main_insta .insta_box .ov_box {position:absolute; left:0; top:0; width:100%; height:100%; padding:30px 15px 15px; box-sizing:border-box; text-align:center; z-index:2}
.main_insta .insta_box .ov_box {background:rgba(0,0,0,0.5);; display:none;}
.main_insta .insta_box .text {color:#fff; font-size:11px; letter-spacing:-0.5px; text-align:left; max-height:45px; line-height:15px;}
.main_insta .insta_box .text {overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;}
.main_insta .insta_box .date {color:#fff; font-size:11px; letter-spacing:-0.5px;}
.main_insta .insta_box .fake {overflow:hidden;}
.main_insta .insta_box .fake img {}
.main_insta .insta_box .real {position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #b2b2b2;  box-sizing:border-box;}

@media screen and (min-width:650px) {
	.main_insta .insta_list li {width:12.5%}
	.main_insta .insta_box {margin-left:5px;}
	.main_insta .insta_list ul {margin-left:-5px;}
}








/* ********************************************** *
 * 메인 고객센터
 * ********************************************** */
.main_cs {margin-top:40px}
.main_cs li {list-style:none;}
.main_cs .ul {}
.main_cs .li {padding:40px 15px; border-top:1px solid #e6e6e6; overflow:hidden;}

/* 단락 타이틀 */
.main_cs .title_box { overflow:hidden; margin-bottom:10px; }
.main_cs .title_box .tit {font-size:21px; color:#000; font-weight:600; float:left; line-height:1;}

/* 바로가기 버튼 */
.main_cs .btn_box {box-sizing:border-box; margin-top:15px; overflow:hidden;}
.main_cs .btn_box ul {display:table; width:100%; table-layout:fixed; box-sizing:border-box; background:#f5f5f5; }
.main_cs .btn_box li {display:table-cell; text-align:center; box-sizing:border-box; border:1px solid #e6e6e6;}
.main_cs .btn_box .btn {display:block; height:41px; line-height:41px; letter-spacing:-0.5px; color:#333; position:relative; font-size:12px;}

/* 고객센터 정보 */
.main_cs .cs_box {}
.main_cs .cs_box .cs_info {overflow:hidden; position:relative;}
.main_cs .cs_box .cs_info:before {content:""; border-radius:100px; width:40px; height:40px; position:absolute; left:0; top:0;}
.main_cs .cs_box .cs_info:before {background:#666 url('../images/skin/main_cs_tel.png') center center no-repeat; background-size:18px; }
.main_cs .cs_box .cs_info .tel {color:#cd3726; font-weight:600; font-size:25px; overflow:hidden; padding-left:45px; height:40px; box-sizing:border-box; line-height:45px;}
.main_cs .cs_box .cs_info .email { font-size:15px; color:#999; padding-left:45px;}
.main_cs .cs_box .cs_time { color:#666; margin-top:10px; line-height:18px; padding-left:45px;}

/* 은행정보 */
.main_cs .bank_box {}
.main_cs .bank {display:table; width:100%;}
.main_cs .bank ul {display:table-row;}
.main_cs .bank li {display:table-cell; list-style:none; vertical-align:top}
.main_cs .bank .left_tit {letter-spacing:-0.5px; color:#666; position:relative; padding-left:11px; padding-top:10px; width:68px; box-sizing:border-box;}
.main_cs .bank .left_tit:before {content:""; position:absolute; left:4px; top:18px; width:2px; height:2px; background:#666;}
.main_cs .bank .right_num {padding-top:10px}
.main_cs .bank .number { font-size:13px; color:#333;}
.main_cs .bank .name {color:#888; letter-spacing:-0.5px; margin-top:1px; font-size:12px;}

@media screen and (min-width:650px) {
	.main_cs {margin:50px 0;}
	.main_cs .ul {display:table; width:100%; box-sizing:border-box; table-layout:fixed; border-collapse:separate; border-spacing:0px;}
	.main_cs .li {display:table-cell; padding-top:0px; border-top:0; vertical-align:top; position:relative; padding-bottom:65px;}
	.main_cs .li+ .li {border-left:1px solid #e6e6e6;}
	.main_cs .btn_box {position:absolute; left:0; bottom:0; width:100%; box-sizing:border-box; padding:0 15px;}
}