/* BASIC css start */ /********************************* header *********************************/ #header .pointColor { } /* 띠배너 */ #header .one_top {position:relative;width:100%;overflow:hidden;-webkit-transition:all 0.1s;-moz-transition:all 0.1s;-o-transition:all 0.1s;transition:all 0.1s;} #header .one_top > ul {width:200%;} #header .one_top .carousel-cell {width:50%;float:left;} #header .one_top .carousel-cell img {width:100%;} #header.fixed .one_top {height:0;opacity:0;visibility:hidden;-webkit-transition:all 0.1s;-moz-transition:all 0.1s;-o-transition:all 0.1s;transition:all 0.1s;} #header .flickity-enabled {position: relative;transform: translateX(-25%);} #header { position:fixed; left:0; top:0; background:rgba(251,251,251,0.95); width:100%; z-index:500;} #header.fixed #logoArea { padding:11px 0;} #header.fixed #logoArea > a.btn_menu { top:4px;} #header.fixed #logoArea > a.btn_search { top:4px;} #header.fixed #logoArea > a i { font-size:21px;} #header.fixed #logoArea > a.btn_cart { top:4px;} #header.fixed #logoArea > a.cartNum {top:4px;} /* 로고영역 */ #logoArea { position:relative; padding:30px 0; text-align:center; height:26px;} #logoArea > h1 { font-size: 18px;letter-spacing: -1px;font-weight: 500;display: block;font-family: noto sans kr,montserrat;line-height:20px;margin-top:-1px;} #logoArea > h1 a { color: #000;} #logoArea > h1 a span { display:inline-block; vertical-align:middle; font-family:Poppins; font-weight:600; font-size:13px;} #logoArea > a { display:block; width:20px; height:20px; padding:10px; position:absolute; cursor:pointer;} #logoArea > a.btn_menu { top:20px; left:10px;background:rgba(0,0,0,0.15);border-radius:100%} #logoArea > a.btn_search { top:19px; right:10px;width:30px;} #logoArea > a.btn_cart { top:20px; right:46px; width:30px;} #logoArea > a i { font-size:19px; color:#000;} #logoArea > a.btn_search i { font-size:23px;} #logoArea > a.cartNum {right: 76px;top: 24px;width: 12px;height: 12px;background: #ff6b86;color: #fff;border-radius: 100%;padding: 3px;font-size: 9px;line-height: 12px;font-family: verdana;transform: scale(0.8);} /* 상단 박스 카테고리 */ #topCate { /* display:none; */ width:100%; background:#fff; border-radius:5px; box-shadow:0px 2px 5px 2px rgba(167, 167, 167, 0.04)} #topCate ul { font-size:0; line-height:0; letter-spacing:0;} #topCate ul li { display: inline-block;vertical-align: middle;width: 25%;border-bottom: 1px solid #f1f1f1;border-right: 1px solid #f1f1f1;background: #fff;box-sizing: border-box;} #topCate ul li:nth-child(4n) { border-right:0;} #topCate ul li a { display:block; padding:14px 0; line-height:18px; text-align:center;} /* 카테고리 추가작업 */ .one_cate {position: relative;background:#e8e8e8;} .one_cate > ul {font-size: 0;line-height: 0;letter-spacing: 0;} .one_cate > ul > li {display: inline-block;width:25%;position: relative;text-align: center;} .one_cate > ul > li a {display: block;color:#333;font-size: 13px;line-height: 40px;} .one_cate > ul > li:after {content: "";position: absolute;width:1px;height:15px;background:#999;right:-1px;top:13px;} .one_cate > ul > li.link a {color:#999} /********************************* side *********************************/ body { position:relative; height:100%; } #wrap { min-height:100%; } /* 확장 */ html.expand body {overflow:hidden; } html.expand #aside { left:0; overflow-x:hidden;visibility:visible;} html.expand #dimmedSlider {visibility:visible;opacity:1;} /* btnFoldLayout */ #btnFoldLayout { display:none; position:fixed; left:0; top:0; right:0; bottom:0; width:100%; height:100%; opacity:0;} /* aside */ #aside { z-index:503; visibility:hidden; position:fixed; left:-300px; top:0px; bottom:0; overflow:auto; overflow-x:hidden; width:300px; background:#f7f7f7;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s} /* 로그인상단 */ #aside .member p { line-height:26px; padding:15px; box-sizing:border-box; font-size:11px;} #aside .member p a strong { font-weight:400; font-weight:600; color:#535353; background:#fff; border-radius:20px; padding:4px 8px; margin-right:3px;} /* 닫기버튼 */ #aside .btnClose { display:block; position:absolute; top:0; right:10px; padding:21px 15px 17px;} #aside .btnClose i { font-size:13px; color:#757575;} /* 6개아이콘 */ #aside .member ul { box-sizing:border-box; margin:0 15px; font-size:0; line-height:0; letter-spacing:0; border-radius:6px; background:#fff;margin-bottom:20px;} #aside .member ul li { display:inline-block; vertical-align:middle; width:33.33%; text-align:center; box-sizing:border-box; border-right:1px solid #f7f7f7; border-top:1px solid #f7f7f7;} #aside .member ul li:nth-child(1), #aside .member ul li:nth-child(2), #aside .member ul li:nth-child(3) { border-top:0;} #aside .member ul li:nth-child(3n) { border-right:0;} #aside .member ul li a { display: block;padding: 13px 0;box-sizing: border-box;font-size: 11px;color: #b1b1b1;position: relative;;} #aside .member ul li a i { display: block;font-size: 24px;padding-bottom: 5px;color: #909090;} #aside .member ul li a span.count { display: block;position: absolute;top: 13px;right: 29px;width: 14px;height: 14px;line-height: 14px;text-align: center;border-radius: 20px;background: #111111;color: #fbfbfb;box-shadow: 2px 2px 2px -1px #ddd;font-size:0.82em;font-family: 'noto sans kr',AppleGothic,sans-serif;font-weight: 400;} /* 탭 */ .cateTab { margin:15px 15px 0; border-radius:6px 6px 0 0; overflow:hidden;} .cateTab ul { font-size:0; line-height:0; letter-spacing:0; text-align:left;} .cateTab ul li { display:inline-block; vertical-align:middle; width:50%;} .cateTab ul li a { display:block; width:100%; padding:12px 0; text-align:center; background:#e6e6e6; color:#bbb; text-align:center; font-size:11px;} .cateTab ul li.selected a { background:#f0f0f0; color:#757575;} .tabCon { margin:0 15px; padding:10px 22px; background:#f0f0f0; border-radius:0 0 6px 6px;} /* 닫으려면 h2에 selected 빼고, ul 클래스에 display:none; 처리 */ /* 카테고리 */ #shopping .categoryList { } /* 쇼핑 */ #slideProjectList .categoryList { display:none;} /* 기획전 */ #bookmarkCategory .bookmarkCategory { } /* 즐겨찾기 */ /* 커뮤니티 */ .slideEtc#board .slideEtc_con { } /* 게시판 */ .slideEtc#faqs .slideEtc_con { display:none;} /* 고객만족센터 */ .slideEtc#event .slideEtc_con { display:none;} /* 쇼핑과 이벤트 */ /* 리스트타이틀 */ #categoryCont { margin-bottom:12px;} #categoryCont h2 { position: relative;padding: 9px 18px 8px;background: #fff;font-weight: 400;cursor: pointer;box-sizing: border-box;border-radius: 6px;margin-bottom: 7px;font-size: 11px;} #categoryCont h2 .icoCategory { overflow:hidden; position:absolute; right:12px; top:0; width:30px; height:100%; padding:0; border:0; text-indent:100%; white-space:nowrap; cursor:pointer; background:url("/design/yool080831/onedesign/mobile/images/ico_catePlus1.png") no-repeat center / 13px auto;} #categoryCont h2.selected .icoCategory { background-image:url("/design/yool080831/onedesign/mobile/images/ico_cateMinus1.png"); } .conCate > div:last-child h2, .conCommu > div:last-child h2 { margin-bottom:0 !important;} /* 리스트 */ #aside .categoryList { font-weight:400; margin-bottom:10px;} /* 대분류 */ #aside .categoryList ul { display:none; } #aside .categoryList li { position:relative; border-bottom:1px solid #e6e6e6; line-height:13px;} #aside .categoryList li a { font-size:11px;} #aside .categoryList li.selected > ul { display: block;background: #fbfbfb;padding: 9px 11px 12px 20px;box-sizing: border-box;border-radius: 6px;margin: 14px 9px 26px;} #aside .categoryList li.selected > ul li { border-color:#f5f5f5; color:#666;} #aside .categoryList li.selected > a.cate { border:0;} #aside .categoryList li.noChild > a.cate { font-size: 12px;display: block;word-wrap: break-word; } #aside .categoryList li.noChild:last-child > a.cate { border-bottom:0; } #aside .categoryList li.selected.noChild { } #aside .categoryList > li.selected .slideSubMenu li { border-bottom: 0; } #aside .categoryList > li.selected .slideSubMenu li:last-child { border-bottom:0;} #aside .categoryList > li { } #aside .categoryList > li a { font-family:맑은 고딕;} #aside .categoryList > li:last-child { border-bottom:0; } #aside .categoryList > li > a.cate { background: url(/design/yool080831/onedesign/mobile/images/ico_catePlus2.png) no-repeat 5px center / 6px auto;font-size:12px;letter-spacing:-0.5px;padding:12px 18px ;} #aside .categoryList > li.selected > a.cate { background-image:url("/design/yool080831/onedesign/mobile/images/ico_cateMinus2.png"); } /* 중분류 */ #aside .categoryList > li > ul > li > a.cate { padding-left: 14px;background: url(/design/yool080831/onedesign/mobile/images/ico_catePlus2.png) no-repeat 3px center / 6px auto;font-size:12px;} #aside .categoryList > li > ul > li.selected > a.cate { background-image:url("/design/yool080831/onedesign/mobile/images/ico_cateMinus2.png");} /* 소분류 */ #aside .categoryList li.selected > ul ul { padding:0;margin:0;} #aside .categoryList > li > ul > li > ul > li > a.cate { padding-left: 31px;background: #fbfbfb url(/design/yool080831/onedesign/mobile/images/ico_catePlus2.png) no-repeat 17px center / 7px auto;font-size:10px;} #aside .categoryList > li > ul > li > ul > li.selected > a.cate { background-image:url("/design/yool080831/onedesign/mobile/images/ico_cateMinus2.png");} /* 소소분류 */ #aside .categoryList > li > ul > li > ul > li > ul > li a.cate { padding-left:38px !important } #aside .categoryList a.cate { display: block;padding:9px 18px ;word-wrap: break-word; font-size:12px; } #aside .categoryList a.view { display:none;position:absolute; right:32px; top:8px; padding:0 7px; border:1px solid #d5d5d5; line-height:24px; color:#676767; font-weight:normal; background-color:#ffffff;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;-o-border-radius:3px;border-radius:3px;} #aside .categoryList li.noChild > a.view { display:none; } /* 즐겨찾기 리스트 */ #aside .bookmarkCategory { font-size:11px; } #aside .bookmarkCategory li { position:relative; border-bottom:1px solid #e6e6e6; } #aside .bookmarkCategory li:last-child { border-bottom:0;} #aside .bookmarkCategory li.selected { background-color:#111111; } #aside .bookmarkCategory li a { display:block; padding:12px 25px 11px; word-wrap:break-word; font-size:11px;} #aside .bookmarkEmpty { padding: 10px;color: #9a9a9a;line-height: 14px;background: #e6e6e6;margin: 13px 0;border-radius: 5px;font-weight: 400;font-size: 10px;} #aside .bookmarkEmpty img { width:10px; height:10px; vertical-align:-1px; } /* 즐겨찾기 아이콘 */ #aside .xans-layout-category li .icoBookmark, #aside .bookmarkCategory li .icoBookmark { overflow:hidden; position:absolute; right:0px; top:0; width:25px; height:36px; padding:0; border:0; text-indent:100%; white-space:nowrap; background:url("/design/yool080831/onedesign/mobile/images/iconHeart.png") no-repeat center / 12px auto; cursor:pointer; } #aside .xans-layout-category li .icoBookmark.selected, #aside .bookmarkCategory li .icoBookmark.selected { background-image:url("/design/yool080831/onedesign/mobile/images/iconHeart2.png"); } /* 배송국가 */ #aside .multishop .xans-layout-multishoplistmultioptioncountry li a { padding:9px 10px 11px 17px; font-size:13px; } /* 멀티쇼핑몰 */ #aside .xans-multishop-listitem li { border-bottom:1px solid #cccccc; border-top:1px solid #e6e6e6; background-color:#f1f1f1; } #aside .xans-multishop-listitem li:first-child { border-top:0; } #aside .xans-multishop-listitem li a { display:block; padding:6px 10px 6px 14px; word-wrap:break-word; } #aside .xans-multishop-listitem li a .name { margin:0 0 0 5px; font-size:13px; vertical-align:middle; } /* 커뮤니티 */ .conCommu { display:none;} .slideEtc_con { font-weight:400; margin-bottom:10px;} .slideEtc_con li { position:relative; border-bottom:1px solid #e6e6e6; line-height:13px;} .slideEtc_con li:last-child { border-bottom:0;} .slideEtc_con li a { display: block;padding: 12px 18px;word-wrap: break-word;font-size: 12px;letter-spacing: -0.5px;background: url(/design/yool080831/onedesign/mobile/images/ico_catePlus2.png) no-repeat 5px center / 6px auto;font-family: 맑은 고딕\;} /***************** search ******************/ .searchheader { display:none;position:relative; z-index:200; padding:0 18px 18px; background:#f5f5f5;} .searchheader .searchForm { position:relative; width:100%; margin-top:18px;} .searchheader #keyword { width:100%; height:30px; padding:0 8px; border:0; border-radius:5px;} .searchheader .btnDelete { position:absolute; right:0px; top:0px; border:0; border-radius:5px; background:#fff; padding:6px 8px 5px;} .searchheader .btnDelete i{width:18px; height:18px; line-height:18px; font-size:15px; background:#eee; border-radius:20px;text-align:center;} .searchheader .btnClose {display:none !important; position:absolute; right:18px; top:-46px; padding:5px; font-size:16px; background:#fbfbfb; border:0;} /* 인기검색어 */ .searchheader .search-hotkeyword {background: #fff;margin-top: 20px;} .searchheader .search-hotkeyword ul { overflow-y:auto; max-height:100px; padding:7px; text-align:left; font-size:0; line-height:0; letter-spacing:0; } .searchheader .search-hotkeyword li { position:relative; display:inline-block; vertical-align:top;} .searchheader .search-hotkeyword li a { display:inline-block; padding:5.5px 10px; background:#f7f7f7; border-radius:30px; color:#535353; font-size:10px; margin:3px; } /* BASIC css end */