@charset "UTF-8";

/* 서브 고객센터 */
.sub .cs_info{overflow:hidden; background-color:#333;}
.sub .cs_info .cs_infoTxt{padding:30px 25px 30px;}
.sub .cs_info .cs_infoTxt h4{font-size:17px; color:#ddd; font-weight:400;}
.sub .cs_info .cs_infoTxt p.cs_call{font-size:21px; font-weight:700; color:#fff; font-family:"Roboto", sans-serif; margin-bottom:10px}
.sub .cs_info .cs_infoTxt p.cs_date{font-size:12px; color:#ddd;}
.sub .cs_info .cs_infoTxt p.cs_date span {display:block;}
.sub .cs_info .cs_infoLink{position:relative; display:block; background-color:#222; text-align:center; height:42px; line-height:42px; color:#fff; font-size:12px;}

/* 고객센터 */
.cs_search{position:relative; display:flex; -webkit-box-pack:center; justify-content:center; -webkit-box-align:center; align-items:center; padding:30px 0px; background-color:#f8f8f8;}
.cs_search h2{margin-right:15px; font-size:17px; line-height:1; color:#222; width:auto;}
.cs_search .search_bar{position:relative; background-color:#fff; right:0px; top:0px; width:410px; height:42px; padding-right:60px; border:1px solid #ddd; border-radius:30px; margin-left:10px;}
.cs_search .search_bar input{height:34px; padding:10px 0; border:0px;  margin-left:20px;}
.cs_search .search_bar button{position:absolute; right:0px; width:70px; height:40px; padding-top:4px; text-align:center;}
.cs_search .search_bar button span{position:absolute; display:block; overflow:hidden; height:1px; width:1px;}

.faq_wrap{position:relative;}
.faq_wrap .bic-arrow{position:absolute; top:10px; right:0;}
.notice_wrap{position:relative; margin-top:60px; display:flex; justify-content:space-between; flex-wrap: wrap;}
.notice_wrap .gcol{position:relative; flex-basis:45%;}
.notice_wrap .gcol + .gcol:before{content:''; position:absolute; top:50%; left:-10%; display:block; width:1px; height:210px; margin-top:-105px; background:#ddd;}
.notice_wrap .gcol .bic-arrow{position:absolute; top:6px; right:0;}
.notice_wrap .notice_list{margin:20px 0 20px 0;}
.notice_wrap .notice_list li{padding:4px 0 4px;}
.notice_wrap .notice_list li a{text-overflow:ellipsis; overflow:hidden; white-space:normal; overflow-wrap:break-word; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical;}
.notice_wrap .notice_list li a.spot{color:#000; font-weight:500}
.item_list_top {position:relative;}
.item_list_top .btn_right{position:absolute; top:6px; right:0;}

/* 회원가입 */
.join_area{position:relative; margin:0 auto;}
.join_area .join_box{display:table; table-layout:fixed; width:100%; margin-top:40px}
.join_area .join_box .join_box_item{vertical-align:top; display:table-cell;}
.join_area .join_box .join_box_item a{display:block; height:300px; border:1px solid #ddd; width:550px; box-sizing:border-box; text-align:center; margin-left:40px;}
.join_area .join_box .join_box_item a:first-child{margin-left:0}
.join_area .join_box .join_box_tt{margin:20px 0 0 20px;}
.join_form{position:relative; max-width:700px; margin:0 auto; padding:0 20px;}
.join_form h2{text-align:center; padding:0 0 40px; margin:0 0 10px; border-bottom:1px solid #ddd;}

/** 작성 폼 **/
.form_section {padding:0 20px;}
.form_section dl {display:table; table-layout:fixed; width:100%; border-collapse:collapse; margin:12px 0; border-spacing:0; padding:0;}
.form_section dt {display:table-cell; width:110px; color:#222; text-align:left; padding-top:6px;}
.form_section dd {display:table-cell; width:auto; vertical-align:middle;}
.form_section dt label {margin-right:0; color:#222;}
.form_section dd span.label_tit{display:inline-block; width:100px}
.form_section label{margin-right:20px;}
.form_section .join_input{height:40px; line-height:42px}
a.btn_link{font-weight:600; text-decoration:underline; margin-left:10px; color:#000; margin-top:-4px;}

.divide2 {overflow:hidden;}
.divide2 h2 {padding:10px 60px 0;}
.divide2 .form_info {display:inline-block; width:50%;}

.form_section_flex dl {margin:0 0 10px; padding:0 0 10px; border-bottom:1px solid #ddd; display:flex; align-items:center;}
.form_section_flex dt {padding:0 10px; width:140px; flex-shrink:0;}
.form_section_flex dd {flex-basis:100%; flex-grow:1; display:flex; flex-flow:row wrap; align-items:center;}
.form_section_flex dd input,
.form_section_flex dd select,
.form_section_flex dd span {/* flex-basis:52%; */}
.form_section_flex dd input.inp {-webkit-appearance:none;}
.form_section_flex dl.email_input dd input {flex-basis:40%;}
.form_section_flex dl.email_input dd span {flex-basis:7%; text-align:center;}
.form_section_flex dl.email_input dd select {flex-basis:30%;}

.form_section_flex dl.addr_input dd input:nth-child(1) {flex-basis:40%; width:40%; margin-right:10px;}
.form_section_flex dl.addr_input dd button {flex-basis:80px; width:80px; padding:0 10px;}
.form_section_flex dl.addr_input dd input:nth-child(3) {flex-basis:100%;}
.form_section_flex dl.addr_input dd input:nth-child(4) {flex-basis:100%;}

.form_section_flex dl.agree_input dd > div {flex-basis:100%;}
.form_section_flex dl.agree_input dd button {margin:0 0 0 10px; vertical-align:middle;}

/** UI 리스트 : 메모 스타일 **/
.memo_list{position:relative; margin:0 0 6px 0; font-size:13px; color:#89b942; line-height:18px;}
.memo_list > li{padding-left:10px}
.memo_list > li:before{display:block; content:'*'; position:absolute; left:0; margin-top:2px;}

/** tab **/
.my_tab{width:100%; border-bottom:1px solid #222; margin-bottom:20px}
.my_tab ul{display:flex; position:relative;}
.my_tab ul li{position:relative; z-index:1; display:inline-block; padding:0 10px; margin-right:30px}
.my_tab ul li a{display:block; width:100%; padding:16px 0;  font-size:17px; text-align:center; line-height:26px; letter-spacing:-.027em;}
.my_tab ul li a.on{color:#222; font-weight:600;}
.my_tab ul li a.on:after{content:""; display:block; position:absolute; left:0; bottom:0; width:100%; height:2px; background:#222;}

/** 텍스트박스 **/
.txt_box {background-color:#f5f5f5; padding:25px 30px; border:1px solid #ddd;}
.txt_box input {height:auto;}
.ul_dot {position:relative;}
.ul_dot > li{padding-left:20px;}
.ul_dot > li:before {display:block; content:''; position:absolute; left:12px; width:3px; height:3px; background-color:#484848; margin-top:11px; color:#000}
.ul_dot > li > ul{padding-bottom:5px}

/**  마이페이지 **/
.mypage_top{overflow:hidden; width:100%; display:flex; align-items:stretch;}
.mypage_top .grade_user{width:358px; height:190px; background-color:#f5f5f5; padding:26px 0 30px 30px;}
.mypage_top .grade_user .grade_wrap{display:flex; align-items:center;}
.mypage_top .grade_user .grade_wrap .grade_detail{margin-left:20px; overflow:hidden; float:left; max-width:263px;white-space:nowrap; text-overflow:ellipsis;}
.mypage_top .grade_user .grade_wrap .grade_detail .name{font-size:20px; font-weight:600; color:#222; line-height:28px; }
.mypage_top .grade_user .grade_bnenfit{overflow:hidden; margin-top:16px;}
.mypage_top .grade_user .grade_bnenfit span{line-height:18px; color:#222;}
.mypage_top .grade_user .grade_bnenfit strong{font-weight:700; color:#89b942; }
.mypage_top .next{display:flex; margin-top:18px;}
.mypage_top .next a{padding:4px 30px; border:1px solid #eee; border-radius:15px; background-color:#fff; font-size:12px; color:#222; line-height:18px; text-align:center;}

.mypage_top .list_mypage{display:flex; flex-grow:1; flex-direction:column; margin-left:4px;}
.mypage_top .list_mypage .list{display:flex; overflow:hidden; width:100%; height:100%;}
.mypage_top .list_mypage .link_wrap{width:268px; height:190px; background-color:#f5f5f5; padding:26px 0 30px 30px;; display:flex; flex-direction:column;}
.mypage_top .list_mypage .link_wrap:not(:last-of-type){flex-grow:1; margin-right:4px;}
.mypage_top .list_mypage .link_wrap .link_title{font-weight:600; display:flex; align-items:center; color:#222; position:relative;}
.mypage_top .list_mypage .link_wrap p.info{padding-top:30px}
.mypage_top .list_mypage .link_wrap p.info span{font-weight:700; font-size:22px; color:#89b942; line-height:28px; font-family:"Roboto", sans-serif; }

.mypage_order{height:116px; background-color:#f9f9f9; border:1px solid #89b942;}
.mypage_order ul{display:flex; justify-content:space-around;}
.mypage_order ul li{position:relative; text-align:center; height:116px; padding:25px 0px 0px;}
.mypage_order em{display:block; margin-bottom:15px;}
.mypage_order .num{display:inline-block; font-size:28px; font-weight:700; line-height:1;}

/**  회원등급 안내 **/
.grade_list .item:first-child{border-top:1px solid #eee;}
.grade_list .item{display:table; width:100%; padding:40px 0; border-bottom:1px solid #eee; line-height:1.5;}
.grade_list .item .tit_total{display:table-cell; width:200px; vertical-align:top; color:#89b942;}
.grade_list .item .txt_info{display:table-cell; font-weight:300; font-size:16px; line-height:28px; word-break:keep-all; vertical-align:top;}

/**  주문/배송 조회 **/
.order_wrap+.order_wrap{margin-top:-1px;}
.order_top_info{display:flex; padding:14px 20px 12px 20px; border-top:1px solid #eee; border-bottom:1px solid #eee; background-color: #f8f8f8;}
.order_top_info .info_txt{display:flex; -webkit-box-align:center; align-items:center; font-family:"Roboto", sans-serif;}
.order_top_info .info_txt .order_date{font-size:16px; font-weight:700; line-height:1.5; font-family:"Roboto", sans-serif;}
.order_top_info .info_txt .order_num{padding-left:6px; font-size:14px; font-weight:400; line-height:1.64; color:#999; font-family:"Roboto", sans-serif;}
.order_top_info .buttons{margin-left:auto; display:flex;}

.order_goodsitem{display:flex; flex-wrap:wrap; padding:20px 0; -webkit-box-align:center; align-items:center;}
.order_goodsitem:last-child {border-bottom:1px solid #eee;}
.order_goodsitem .goods_wrap{position:relative; margin:0 25px 0 32px; vertical-align:middle; width:74%; -webkit-box-flex:0.74; flex:0.74;}
.order_goodsitem .goods_wrap .imgWrap{display:inline-block; position:relative; overflow:hidden; width:80px; height:80px; background-color:#f8f8f8;}
.order_goodsitem .goods_wrap .imgWrap img{width:100%; height:100%}
.order_goodsitem .goods_wrap .imgWrap:after{position:absolute; top:0; left:0; right:0; bottom:0; background:#000; opacity:.03; content:"";}
.order_goodsitem .goods_wrap .textWrap{display:inline-block; width:calc(100% - 96px); vertical-align:top; margin-left:12px;  line-height:1.47;}
.order_goodsitem .goods_wrap .textWrap strong{font-weight:700; color:#222}
.order_goodsitem .goods_wrap .textWrap .option{display:inline-block; margin-top:3px; font-size:14px; line-height:1.5; color:#757575;}
.order_goodsitem .goods_wrap .textWrap .text{position:relative; margin-top:6px; line-height:1.46; font-size:12px; vertical-align:middle;}
.order_goodsitem .goods_wrap .textWrap .text .price{ font-weight:700; margin-right:1px; color:#222}
.order_goodsitem .goods_wrap .textWrap .text .count{position:relative; font-size:12px; line-height:1.42; color:#999; margin-left:7px; padding-left:8px;}
.order_goodsitem .goods_wrap .textWrap .text .count:after{content:""; position:absolute; top:50%; left:0; margin-top:-5px; width:1px; height:10px; background:#e5e5e5;}
.order_goodsitem .goods_wrap .textWrap a:hover {text-decoration:underline;}
.order_goodsitem .goods_wrap .txt_line{border-bottom:1px solid #eee; margin:8px 0;}
.order_goodsitem .cur_check{position:absolute; top:20px; left:-25px;}
.order_goodsitem .deleteItem{position:absolute; top:-10px; right:10px;}
.order_goodsitem .order_txt{font-size:13px; color:#999; margin-top:6px; line-height:18px; font-weight:300}
.order_goodsitem .order_txt strong{color:#666; font-weight:500}
.order_goodsitem .order_status{-webkit-box-flex:0.26; flex:0.26; display:flex; width:26%; min-width:70px; padding:0 20px; min-height:92px; border-left:1px solid #eee;}
.order_goodsitem .order_status .status_wrap{width:100%; position:relative; text-align:center; line-height:1.47; padding-top:25px}
.tt_status{ text-decoration:underline;}

/**  배송상태 안내 **/
.status_list{margin-top:10px; background-color:#f8f8f8; padding:20px}
.status_list .list_info{display:table; width:100%; padding:12px 0; line-height:1.5;}
.status_list .list_info .tt_total{display:table-cell; width:140px; vertical-align:top;  text-decoration:underline; padding-left:20px}
.status_list .list_info .tt_info{display:table-cell; font-size:13px; word-break:keep-all; vertical-align:top;}

/**  적립금 안내 **/
.point_info{position:relative; text-align:center; margin-bottom:30px}
.point_info .point_txt{color:#222; font-size:17px; line-height:26px; margin-bottom:10px;}
.point_info .point_txt span{font-size:24px; line-height:1.4; font-weight:700; font-family:"Roboto", sans-serif;}
.form_price{font-size:22px; font-weight:700; font-family:"Roboto", sans-serif; color:#89b942}

/* 장바구니 */
.priceList{border-bottom:1px solid #eee; padding-bottom:18px;}
.priceList dl{display:table; table-layout:fixed; width:100%; margin:8px 0;  line-height:normal;}
.priceList dl dt{position:relative; width:50%; display:table-cell; padding-top:3px; font-weight:400; color:#757575; line-height:1.57; letter-spacing:-.3px; vertical-align:top; white-space:normal;}
.priceList dl dd{font-size:16px; width:50%; display:table-cell; position:relative; text-align:right; font-weight:700; word-break:break-all; vertical-align:top; line-height:1.57;}
.priceList dl dd span{display:inline-block; margin-left:2px; font-weight:400; font-size:14px;}
.cur_hand{display:inline-block; width:18px; height:18px;; background-color:#89b942; margin-right:5px; vertical-align:middle;}
.item_totalPrice span{font-family:"Roboto", sans-serif;}

/* 상세검색 */
.cate_wrap{display:none; position:relative; border:1px solid #222; padding:20px 30px; margin-top:20px;}
.cate_wrap .cate_list{position:relative; width:100%; overflow:hidden; margin-bottom:20px; overflow:auto; height:90px;}
.cate_wrap .cate_list li{float:left; width:20%;}
.cate_check{position:absolute; right:0; margin-top:-30px}
.thumb_check{position:absolute; left:10px; top:10px; z-index:10;}
.line_black {display:block; width:100%; margin:25px 0 15px 0; padding:0; height:1px; border:0; border-top:1px solid #222;}
.line_gray {display:block; width:100%; border-bottom:1px solid #eee; }

/** ▼ 레이어 열고 닫기 : 버튼(class="layer_btn") 및 레이어(class="layer_area")를 같은 부모(class="layerSet")로 감싸서 구현, 레이어가 중복해서 열리면 안되는 경우는 부모 class에 onlyOne 추가(class="layerSet onlyOne") ▼ **/
.layerSet {}
.layerSet.Relative {position:relative;}
.layer_btn {margin-top:-3px}
.layer_area {position:absolute;}

/**  알림센터 **/
.notiSelect{cursor:pointer;}
.noticeLayer{display:none; width:300px; padding:20px; background-color:#fff; border:solid 1px #222; z-index: 10;}
.noticeLayer p{font-weight:600; color:#222; padding-bottom:10px}
.noticeLayer ul{overflow-x:hidden;}
.noticeLayer ul li{margin-bottom:8px; font-size:13px; line-height:17px; color:#666}
.noticeLayer > button{position:absolute; top:15px; right:15px;}

.alrim_list{position:relative; width:100%; border-top:solid 1px #d7d7d7; margin-top:20px}
.alrim_list dl{display:flex; margin-top:30px}
.alrim_list dt{width:80px; text-align:center;}
.alrim_list dd{width:100%; border-bottom:solid 1px #eee; padding-bottom:30px; font-size:16px;}
.alrim_list dd .date{color:#999; font-size:13px;}

/* 메인 슬라이드 */
.main_slider{position:relative; width:100%; height:500px; margin-top:-62px;}
.main_slider .main_img{height:500px; background:#f4f4f4 no-repeat 50% 50%; background-size:cover;}

/* 메인 배너 */
.main_banner{position:relative; display:block; width:100%; max-width: 1240px; margin-top:60px;}
.main_banner_m{display:none;}
.main_banner .btn_appdown{position:absolute; top:40px; right:80px;}
h2.main_tit {position:relative; margin:0 auto; width:100%; max-width: 1240px; font-weight:600; padding:80px 20px 0;}
h2.main_tit span{font-weight:300;}
h2.main_tit .btnMore{position:absolute; right:0; top:90px; width:100px; font-size:15px;}

/* 메인 고객센터 */
.mainNotice{position:relative; padding:40px 0; background-color:#f9f9f9; margin:60px 0 0;}
.mainNotice .fix_conArea {display:flex; flex-flow:row wrap;}
.mainNotice h3{font-weight:400;}
.mainNotice .m_notice,
.mainNotice .m_center,
.mainNotice .m_faq{width:33%; box-sizing:border-box; padding:35px;}
.mainNotice .m_center,
.mainNotice .m_faq{border-left:solid 1px #e5e5e5;}
.mainNotice .m_notice li,.mainNotice .m_faq li{position:relative; overflow:hidden; padding-right:70px; line-height:19px; margin-top:10px; white-space:nowrap; text-overflow:ellipsis;}
.mainNotice .m_notice span{position:absolute; right:0; top:0; color:#999;}
.mainNotice .m_center p.tel{font-size:30px; color:#89b942; font-weight:600; font-family:'Roboto'}
.mainNotice .m_notice h3, .mainNotice .m_center h3{background-color:#89b942; color:#f0ff00; display:inline-block; padding:0 20px; border-radius:30px;}

/* 메인 상품리스트 */
.item_list_top ul {margin:25px 0 0; display:flex; flex-flow:row wrap;}
.item_list_top ul li{margin:0 0 20px 1.2%; width:24%; flex-shrink:0; }
.item_list_top ul li:nth-child(4n+1){margin-left:0}
.item_list_top ul li .thumb_wrap{background-color:#fafafa;}

/* 메인 인기상품 텝 */
.popularItem .tab ul {justify-content:space-evenly;}
.popularItem .tab ul li a.on{color:#89b942; font-weight:500;}
.popularItem .tab ul li span{position:relative; display:block;line-height:25px;}
.popularItem .tab ul li span em{display:block; margin:0 auto; width:80px; height:80px; background-repeat:no-repeat; background-position:center top; background-size:100% auto;}
.popularItem .tab ul li span:hover em{background-position:center bottom;}
.popularItem .tab ul li span:hover{color:#89b942; font-weight:500;}
.popularItem .tab ul li a[rel="tabSet1"] span em{background-image:url('../img/btnIco1.png');}
.popularItem .tab ul li a[rel="tabSet2"] span em{background-image:url('../img/btnIco2.png');}
.popularItem .tab ul li a[rel="tabSet3"] span em{background-image:url('../img/btnIco3.png');}
.popularItem .tab ul li a[rel="tabSet4"] span em{background-image:url('../img/btnIco4.png');}
.popularItem .tab ul li a[rel="tabSet5"] span em{background-image:url('../img/btnIco5.png');}
.popularItem .tab ul li a[rel="tabSet6"] span em{background-image:url('../img/btnIco6.png');}
.popularItem .tab ul li a.on span em{background-position:center bottom;}

/* 상품리스트 리스트형식 */
.item_list_top .table-ty01{width:100%;}
.item_list_top .table-ty01 caption,.item_list_top .table-ty02 caption {width:0px; height:0px; overflow:hidden; text-indent:-9999px;}
.item_list_top .table-ty01 tr th {padding:16px 0; border-bottom:solid 1px #666; background-color:#fff; font-weight:normal; color:#222}
.item_list_top .table-ty01 tr td {padding:15px 0 15px 0; border-bottom:solid 1px #ddd;}
.item_list_top .table-ty01 tr td.b_line {padding:15px 0 0 0; border-bottom:none;}
.item_list_top .table-ty01 tr th, .item_list_top .table-ty01 tr td {vertical-align:middle; text-align:center; line-height:16px;}
.item_list_top .table-ty01 tr td a:hover,
.item_list_top .table-ty01 tr td a:active,
.item_list_top .table-ty01 tr td a:focus {text-decoration:none;}
.item_list_top .table-ty01 tr td span.date {display:block; color:#999; font-size:13px;}
.item_list_top .table-ty01 tr td.title-cell {position:relative; display:block; color:#666; width:100%; text-align:left;}
.item_list_top .table-ty01 tr td.title-cell .product_txt{margin-left:20px; min-height:120px;}
.item_list_top .table-ty01 tr td.title-cell .category{display:block; font-size:12px; color:#999; }
.item_list_top .table-ty01 tr td.title-cell .code{display:block; color:#89b942; margin-top: 15px;}
.item_list_top .table-ty01 tr td.title-cell .pro_title{margin-top: 5px;}
.item_list_top .table-ty01 tr td.title-cell .pro_title span{margin-top:10px; height:44px; line-height:1.47; width:auto; text-overflow:ellipsis; overflow:hidden; white-space:normal; overflow-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}
.item_list_top .table-ty01 tr td .product_check{position:absolute; left:0px; top:0px; z-index:10;}
.item_list_top .table-ty01 tr td .product_thumb{position:absolute; top:0; left:0; overflow:hidden;}
.item_list_top .table-ty01 tr td .product_wrap{position:relative;;min-height:120px; box-sizing:border-box;}
.item_list_top .table-ty01 tr td .product_wrap img{width:120px; height:120px;}
.item_list_top .table-ty01 tr td .price_wrap{display:block; color:#000; vertical-align:middle; text-align: right; margin-right: 20px;}
.item_list_top .table-ty01 tr td .price_wrap strong{font-size:24px; line-height:26px; letter-spacing:-0.5px; font-family:"Roboto", sans-serif;}

.m_detail_info{position:relative;}
.m_detail_info.bgw{background:#fff; padding:0 20px 40px}
.m_detail_info a{width: 100%;}
.m_detail_info .code{display:block; color:#89b942}
.m_detail_info .pro_title{margin-top:10px; width:auto; text-overflow:ellipsis; overflow:hidden; white-space:normal; overflow-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;}
.m_detail_info .priceWrap{display:block; vertical-align:middle;}
.m_detail_info .priceWrap strike{font-size:13px; color:#999;}
.m_detail_info .priceWrap strong{font-size:24px; line-height:26px; letter-spacing:-0.5px; font-family:"Roboto", sans-serif;}
.m_detail_info .priceWrap span{display:inline-block; padding-left:10px; font-size:18px; color:#f08200; font-weight:600}
.md_bgcolor{position:relative; margin-top:40px; padding:0 0 80px; background-color:#edf9f9;}
.m_detail_info .ic_free{display:inline-block; background-color:#89b942; color:#fff; font-size:13px; padding:3px 15px; border-radius:30px;}
.m_detail_info .ic_count{display:inline-block; background-color:#FFF844; font-size:13px; padding:3px 30px; border-radius:30px;}
.m_detail_info .ic_sold{display:inline-block; background-color:#FF6600; color:#fff; font-size:13px; padding:3px 15px; border-radius:30px;}

.item_list_top .prod_top{height:30px;}
.item_list_top .prod_top .tx_best{position:relative; padding-top:3px; line-height:24px; font-size:20px; letter-spacing:-0.5px; vertical-align:top; font-family:"Roboto", sans-serif;}
.item_list_top .prod_top .tx_best:before{content:""; position:absolute; top:0; left:0; width:100%; height:3px; background-color:#000;}

/** 콘텐츠 상단 카테고리 라인맵 **/
.lineMap_category {margin:-25px auto 0; z-index:9; width:100%; max-width:1240px; padding:0 20px;}
.lineMap_category > li {position:relative; display:inline-block; font-size:13px;}
.lineMap_category > li + li {cursor:pointer;}
.lineMap_category > li + li:before {content:"\e93f"; margin:-2px 4px 0 4px; display:inline-block; vertical-align:middle; font-family:'xeicon'; color:#ddd; font-size:16px;}
.lineMap_category > li > ul {display:none; position:absolute; left:26px; overflow:auto; padding:12px 22px 12px 12px; max-height:150px; border:1px solid #ddd; background:#fff;z-index:9;}
.lineMap_category > li a:hover {color:#89b942 ;}
.lineMap_category > li + li:hover > ul,
.lineMap_category > li > ul:hover {display:block;}

/** 상품 상세보기 **/
.products_area {}
.col_wrap {clear:both; overflow:hidden;}
.productBase {margin:10px 0 0; display:flex; flex-flow:row wrap; justify-content:space-between;}
.p_imgArea,
.p_oderArea {width:48%;}

/* 상품 이미지 슬라이드 */
.p_imgArea {position:relative;}
.productImg_slide {overflow:hidden;}
.productImg_slide img {width:100%;}
.productImg_slide_nav {margin:30px 60px 0 60px;}
.productImg_slide_nav .slick-list {margin:0 -10px; padding:2px 0;}
.productImg_slide_nav .slick-slide {margin:0 10px; cursor:pointer;}
.productImg_slide_nav .slick-slide.slick-current {box-shadow:0 0 0px 2px #89b942;}
.productImg_slide_nav .slick-prev,
.productImg_slide_nav .slick-next {width:25px; height:26px; border:1px solid #ddd;}
.productImg_slide_nav .slick-prev {left:-60px;}
.productImg_slide_nav .slick-next {right:-60px;}
.productImg_slide_nav .slick-prev:before,
.productImg_slide_nav .slick-next:before {color:#888; font-family:'xeicon'; font-size:14px;}
.productImg_slide_nav .slick-prev:before {content:"\e93b";}
.productImg_slide_nav .slick-next:before {content:"\e93e";}

/* 이미지 영역 버튼 등 기타 요소 */
.productImg_etc {padding:30px 0; text-align:right;}
.productImg_etc .p_state,
.productImg_etc .p_level {position:absolute; right:15px;}
.productImg_etc .p_state {top:15px;}
.productImg_etc .p_level {top:80px;}
.productImg_etc .p_state button,
.productImg_etc .p_level button {width:60px; height:60px; border-radius:100px;}
.productImg_etc .p_state button {border:1px solid #FF6600; color:#FF6600; font-size:16px; font-weight:400; background:#fff;}
.productImg_etc .p_level button {color:#fff; font-size:16px; font-weight:600; background:#89b942;}
.productImg_etc .level_1 button {background:#89b942;}
.productImg_etc .level_2 button {background:#e24c00;}
.productImg_etc .level_3 button {background:#ff6d23;}
.productImg_etc .level_4 button {background:#ecac00;}
.productImg_etc .level_5 button {background:#ed8e78;}
.productImg_etc .level_6 button {background:#666;}
.productImg_etc .level_7 button {background:#875eb3;}

.productImg_etc .p_button {display:inline-block; margin:0 0 0 10px;}
.productImg_etc .p_button button {width:40px; height:40px; border-radius:100px; border:1px solid #ddd; color:#222; font-size:11px; font-weight:600; background:#fff;}

/* 상품 일반정보 */
.p_oderArea {}
.generalInfo + .oderInfo {margin:20px 0;}
.generalInfo h2 {margin-bottom:7px; text-align:left; font-size:24px;}
.costText {margin:10px 0 0; font-size:30px; font-weight:600; color:#000; font-family:"Roboto", sans-serif;}
.costText i {font-size:20px;}
.costText span {display:inline-block; padding-left:10px; font-size:15px; color:#89b942;}
.costText + hr {border-color:#000;}
.generalInfo .makeTableSet dt {width:115px; padding:6px 5px; text-align:left; font-weight:400; vertical-align:top; color:#666;}
.generalInfo .makeTableSet dd {padding:6px 5px; color:#222;}

/* 주문정보 영역 */
.oderInfo + .generalInfo {margin:40px 0;}
.oderInfo .customSelect {margin:0 0 3px;}
.item_eachSet {position:relative; margin:10px 0 0; padding:10px 15px; border:1px solid #ddd; background:#f5f5f5;}
.item_eachSet dt {padding:0 0 5px; font-weight:400; color:#222;}
.item_btnCount {overflow:hidden; display:inline-block;}
.item_btnCount input,
.item_btnCount button {float:left; vertical-align:middle; height:30px; line-height:26px; margin:0;}
.item_btnCount input {text-align:center; width:50px; padding:0; font-size:13px; border-radius:0; border:1px solid #bbb;}
.item_btnCount button {width:30px; border:1px solid #bbb; background:#fff;}
.item_btnCount button:first-child {border-right:0;}
.item_btnCount button:last-child {border-left:0;}
.item_eachPrice {position:absolute; bottom:15px; right:15px; font-size:17px; font-weight:600; color:#222;}
.item_eachPrice i { margin:0 0 0 2px;}
.closeCircle {overflow:hidden; width:22px; height:22px; border-radius:100px; font-size:23px; background:#fff;}
.closeCircle i {vertical-align:middle; margin:-20px 0 0;}
.item_eachSet .closeCircle {position:absolute; top:12px; right:13px;}
.item_totalPrice {overflow:hidden; margin:35px 0 0; font-size:16px; color:#222;}
.item_totalPrice em {color:#888;font-size:14px;}
.item_totalPrice span {float:right; display:inline-block; vertical-align:middle; margin:-5px 0 0; font-size:24px; font-weight:600; color:#89b942;}
.item_totalPrice span i {font-size:20px; color:#222; margin: 0 0 0 2px;}
.orderBtn_set.btnArea {margin-top:20px;}
.orderBtn_set .btn_base {float:left; margin:0;}
.orderBtn_set .btn_base + .btn_base {margin-left:2%;}
.orderBtn_set .btn_base:nth-child(1) {width:49%;}
.orderBtn_set .btn_base:nth-child(2) {width:49%;}
.btn_modify{position:absolute; right:0; border:1px solid #bbb; height:30px; line-height:26px; padding:0 8px; font-size:12px; background:#f5f5f5;}

/* 구매후기 */
.review_box{margin:10px 0 30px 0; width:100%;}
.review_box .review_info{position:relative; flex-shrink:0; border:1px solid #e5e5e5; border-radius:10px; height:120px; margin-right:20px; width:300px; padding:10px 20px}
.review_box .review_info .review_stars{color:#89b942;}
.review_box .review_info .review-desc{font-size:13px;  width:60%; overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; min-height:38px;}
.review_box .review_info .writer{font-size:12px; font-weight:500; color:#555;}
.review_box .review_info .review_img{position:absolute; right:15px; top:20px; display:block; padding:0; max-width:80px;}

/* 상품상세설명 */
.productCont {display:flex; justify-content:space-between;}
.p_detailArea {width:930px;}
.p_detailArea h3 {font-size:17px; padding:40px 0 10px;}
.p_detailArea h3 span {font-size:14px; color:#666; padding:0 0 0 6px;}
.p_detailArea h3:first-child {padding-top:0;}

.fix_orderArea {width:260px; position:relative;}
.btn_oderInfo {display:none;}
.oderInfo_mini {padding:15px; width:260px; border:1px solid #ddd; background:#fff}
.oderInfo_mini h2 {font-size:16px; text-align:left; font-weight:400; margin:0 0 10px;}
.oderInfo_mini .customSelect {margin-top:5px}
.oderInfo_mini .item_eachSet {margin-top:10px}
.oderInfo_mini .orderBtn_set .btn_base:nth-child(1) {width:40%;}
.oderInfo_mini .orderBtn_set .btn_base:nth-child(2) {width:58%;}
.oderInfo_mini .orderBtn_set .btn_base:nth-child(3) {width:100%; margin:5px 0 0 0;}
.oderInfo_mini .item_totalPrice {margin:40px 0 0;}
.oderInfo_mini .item_totalPrice span {margin-top:0;}

/* 상품상세 텝메뉴 */
.tabDesign1 {display:flex; border-top:1px solid #ddd;margin:80px 0 50px;}
.tabDesign1 a {display:block; position:relative; height:70px; line-height:70px; color:#666; font-size:16px; text-align:center; border-bottom:1px solid #ddd;}
.tabDesign1 a:before {content:""; position:absolute; top:28px; left:0; display:block; height:16px; width:1px; background:#ddd;}
.tabDesign1 a:first-child:before {display:none;}
.tabDesign1 a:hover {color:#89b942;}
.p_tab1line .tabDesign1 a:nth-of-type(1) {color:#89b942; border-bottom:3px solid #89b942;}
.p_tab2line .tabDesign1 a:nth-of-type(2) {color:#89b942; border-bottom:3px solid #89b942;}
.p_tab3line .tabDesign1 a:nth-of-type(3) {color:#89b942; border-bottom:3px solid #89b942;}
.p_tab4line .tabDesign1 a:nth-of-type(4) {color:#89b942; border-bottom:3px solid #89b942;}
.p_tab1line .tabDesign1 {margin-top:0;}

/* 상품상세 데이터테이블 */
.p_detailArea .makeTableSet {border-top:1px solid #555;}
.p_detailArea .makeTableSet dl {border-bottom:1px solid #eee;}
.p_detailArea .makeTableSet dt,
.p_detailArea .makeTableSet dd {padding:12px 20px; font-size:13px;}
.p_detailArea .makeTableSet dt {width:38%; font-weight:400; color:#222; background:#f8f8f8;}
.p_detailArea .makeTableSet dd {}
.p_supplierInfo .makeTableSet dt {width:16%;}
.p_supplierInfo .item_list_top ul li{padding:5px 0 25px; width:189px; margin:0 14px;}
.p_supplierInfo .item_list_top ul li .thumb_wrap {width:189px; height:189px;}

.textBox {padding:15px; border:1px solid #eee; background:#fafafa;}

/* 메인 비주얼 슬라이드 */
.main_slider .slick-prev,
.main_slider .slick-next {width:80px; height:80px; z-index:8;}
.main_slider .slick-prev {left:60px;}
.main_slider .slick-next {right:60px;}
.main_slider .slick-prev:before,
.main_slider .slick-next:before {font-family:'xeicon'; font-size:80px; transition: all 0.3s ease;}
.main_slider .slick-prev:before {content:"\e93d";}
.main_slider .slick-next:before {content:"\e940";}
.main_slider .slick-prev:hover:before,
.main_slider .slick-prev:focus:before,
.main_slider .slick-next:hover:before,
.main_slider .slick-next:focus:before {opacity: 1; color:#89b942; text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.main_slider .slick-dots {bottom:20px;}
.main_slider .slick-dots li button:before {color:#fff; opacity:1;}
.main_slider .slick-dots li.slick-active button:before {color:#89b942;}

/* 이용약관 */
.policy_contents.mailbox {overflow:auto; height:inherit;}
.policy_article h4 {overflow:hidden; margin-bottom:10px; font-weight:600; color:#000;}
.policy_article .pointxt {color:#191919;}
.policy_article + .policy_article {margin-top:20px;}
.privacy_article .policy .hypen_list {margin-top:5px;}

/* sns */
.layerPopup_box .login_btn_area{margin-top:20px; display:inline-block;}
.layerPopup_box .login_btn_area li{display:inline-block; margin-left:20px;}
.layerPopup_box .login_btn_area li:first-child{margin-left:0;}
.layerPopup_box .login_btn_area li .login_btn{display:block; width:53px; height:53px; border-radius:50%; position:relative;}
.layerPopup_box .login_btn_area li i{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:30px;}
a.kakao{background-color:#FFEB02; color:#3c1d1e;}
a.facebook{background-color:#3a5a9b; color:#fff;}
a.twitter{background-color:#2aa9e0; color:#fff;}
.layerPopup_box .form-control{display:inline-block; margin-top:10px; width:100%; height:40px; background:#f6f6f6 url(../images/icon_url.png); background-repeat:no-repeat; background-size:16px 17px; background-position:12px center; padding-left:38px; -webkit-border-radius: 8px;}

/** 레이어팝업 **/
/* 클릭시 레이어팝업 뛰우기 버튼 : 버튼의 class에 OpenPop 추가 하고 rel에 고유의 문자 입력 */
/* 클릭시 레이어팝업 뛰우기 팝업 : 팝업 영역의 최상위 태그 class에 layerPopup_wrap 추가 하고 id에 고유의 문자 입력 */
.layerPopup_wrap {position:fixed; top:0; left:0; height:100%; width:100%; z-index:99999; display:none;}
.layerPop_btn {position:absolute; top:2px; right:8px; font-size:24px; color:#222;}
.layerPopup_bg {position:absolute;top:0; left:0; width:100%; height:100%; background:#000; opacity:0.7!important;z-index:1;}
.layerPopup_box {position:absolute;top:0; left:0; width:50%; display:block; padding:20px; background:#fff; border-radius:20px; z-index:2; border-top:4px solid #89b942; height:360px; overflow-y: auto;}
.layerPopup_box .con_area div.tt{font-size:17px; font-weight:500; border-bottom:1px solid #ddd; padding-bottom:10px;}

/********************************
 media query
*******************************/
@media screen and (max-width:1200px) {
	.main_slider,
	.main_slider .main_img {height:380px;}
}

@media screen and (max-width:1024px) {
	.contents_wrap h2.subtitle{font-size:20px; text-align:left;}
	.page_section h2.subtitle{font-size:20px;}
	.page_section h2.subtitle.m_t_60 {margin-top:40px !important;}
	.main_slider,
	.main_slider .main_img {height:280px;}
	h2.main_tit {font-size:20px; padding-top:30px;}
	.main_banner .btn_appdown {top:30px}
	.main_banner .btn_appdown img{width:130px}
}

@media screen and (max-width:980px) {
	.popularItem .tab ul li span em {width:60px; height:60px;}
	.mainNotice {padding:0;}
	.mainNotice .fix_conArea {justify-content:space-between;}
	.mainNotice h3{font-size:17px;}
	.mainNotice .m_center,
	.mainNotice .m_faq {border:none;}
	.mainNotice .m_notice,
	.mainNotice .m_center {flex-basis:46%;}
	.mainNotice .m_faq {display:none;}
}

@media screen and (max-width:940px) {
	.mo_LayoutSet .productCont {display:flex; flex-flow:column wrap;}
	.mo_LayoutSet .fix_orderArea {position:fixed; bottom:0; left:0; text-align:center; width:100%; z-index:9; opacity:1;}
	.mo_LayoutSet .oderInfo_mini {display:none; top:auto !important; padding:20px; border:0; border-top:1px solid #ccc; width:100%; text-align:left;}
	.mo_LayoutSet .btn_oderInfo {display:inline-block; box-shadow:0 -1px 3px 0 rgba(0,0,0,0.2); font-size:18px; border-radius:5px 5px 0 0; border:1px solid #ccc; border-bottom:0; padding:8px 0; width:140px; color:#fff; background:#89b942;}
	.mo_LayoutSet .btn_oderInfo.On {color:#333; background:#fff;}
	.mo_LayoutSet .btn_oderInfo i[class^="xi-"] {transition: all 0.3s ease;}
	.mo_LayoutSet .btn_oderInfo.On i[class^="xi-"] {transform: rotate(180deg);}
	.p_detailArea {width:100%;}
}

@media screen and (max-width:820px) {
	.main_banner .btn_appdown {top:28%; right:4%}
}

@media screen and (max-width:767px) {
	.main_slider,
	.main_slider .main_img {height:230px;}
	.item_list_top ul li {margin:0 0 20px 2%; width:49%;}
	.item_list_top ul li:nth-child(2n+1){margin-left:0}
	.main_banner {margin-top:30px}
	h2.main_tit {font-size:20px; padding-top:30px;}
	.mainNotice .m_notice {flex-basis:44%;}
	.mainNotice .m_center {flex-basis:56%;}
	.p_imgArea,
	.p_oderArea {width:100%;}
	.main_banner {margin-top:15px}
	.main_banner_h{display:none;}
	.main_banner_m{display:block;}
}

@media screen and (max-width:640px) {
	.main_slider,
	.main_slider .main_img {height:160px;}
	.popularItem .tab ul li span em {width:50px; height:50px;}
	.mainNotice .m_notice,
	.mainNotice .m_center {flex-basis:100%;}
	.mainNotice .m_center p,
	.mainNotice .m_center ul {display:inline-block; vertical-align:top;}
	.mainNotice .m_center p {margin-right:30px;}
	.mainNotice .m_center ul {margin-top:10px;}
	.m_detail_info .priceWrap strong{font-size:20px; line-height:16px;}
	.md_bgcolor{margin-top:20px; padding:0 0 20px;}
	.popularItem .tab ul {justify-content:space-around;}
	.mainNotice {margin-top:20px;}
	.notice_wrap {margin-top:30px;}
	.notice_wrap .gcol {margin-top:10px; flex-basis:100%; flex-shrink:0;}
	.notice_wrap .gcol + .gcol {padding:20px 0 0; border-top:1px solid #ddd;}
	.notice_wrap .gcol + .gcol:before {display:none;}
	.notice_wrap .gcol + .gcol .bic-arrow {top:26px}
	.form_section_flex dl {font-size:13px;}
	.form_section_flex dt {width:80px;}
	.productImg_etc {padding:20px 0;}
	.generalInfo + .oderInfo {margin:20px 0;}
	.generalInfo h2 {font-size:18px;}
	.generalInfo hr{display:none;}
	.costText {font-size:22px;}
	.generalInfo .makeTableSet dt {width:80px;}
	.tabDesign1 a {font-size:15px;}
	.policy_article,.textBox,.txt_box,.form_section{font-size:13px;}
	.mypage_order{font-size:12px;}
	.mainNotice .m_notice,
	.mainNotice .m_center,
	.mainNotice .m_faq{padding:20px 0;}
	.order_top_info .info_txt .order_num{display:block; margin-left:-5px}
	.order_goodsitem .goods_wrap {margin-left:0;}
	.order_goodsitem .order_status .status_wrap {line-height:1.0}
	.status_list,.form_section{padding:0}
	.status_list .list_info .tt_total{width:100px}
	.txt_box{padding:10px}
	.form_section dt{width:80px}
	.form_section dd label input{height:30px;}
	.table-box-over{width:100%; overflow-x:auto;}
	.order_goodsitem .goods_wrap{width:100%; -webkit-box-flex:1.00; flex:1.00; margin:0 0}
	.order_goodsitem .order_status{-webkit-box-flex:1.00; flex:1.00; width:100%; min-width:100%; padding:0 0; border-left:0; min-height:40px;}
	.order_goodsitem .order_status .status_wrap{text-align:left; margin-left:96px}
	.item_totalPrice span{font-size:16px; margin:0}
	.main_banner .btn_appdown {top:50%; right:25%}
	.main_banner .btn_appdown img{width:85px}
	.tabDesign1 {margin:50px 0 20px;}
	.tabDesign1 a {height:50px; line-height:50px;}
	.tabDesign1 a:before {top:18px;}
	.mainNotice{font-size:13px;}

	.alrim_list dl{margin-top:15px}
	.alrim_list dt{width:60px; text-align:center;}
	.alrim_list dd{padding-bottom:15px; font-size:15px;}
}

@media screen and (max-width:480px) {
	.popularItem .tab ul li a {padding:10px;}
	.popularItem .tab ul li span {font-size:14px;}
	.popularItem .tab ul li span em {width:40px; height:40px;}
	.mainNotice .m_center {padding-top:0; margin-top:20px}
	.tabDesign1 a {font-size:14px;}
	.mainNotice .m_notice li, .mainNotice .m_faq li{margin-top:5px;}
	.m_detail_info .ic_free,.m_detail_info .ic_count{font-size:12px; padding:2px 10px;}
}

@media screen and (max-width:430px) {
	.main_slider,
	.main_slider .main_img {height:145px;}
	.tabDesign1 a {font-size:13px;}
}