/* BASIC css start */ h1, .topMenu, #hdSchFrm, .topMenu , .topBanner { position: absolute; } body { min-width: 1265px !important; height: 100%; overflow-y: scroll !important; background: none !important; } /* header */ #header { position: relative; /* height: 228px; */ } #header .Wrap { position: relative; width: 1260px !important; margin: 0 auto; padding-left: 0 !important; } #header .bi, #header #gnb, #header #favLink { position: absolute; } /* bi */ #header .bi { left: 30px; top: 30px; } #topWrap { /* position: fixed; */ width:100%; border-bottom: 1px solid #dcdcdc; height: 39px; background: #fff; } #topWrap > div { width: 100%; z-index: 40000; background: #fff; height: 40px; border-bottom: 1px solid #eee; } .pFixed { top:0; position: fixed; z-index: 20000; } /* topMenu */ .topMenu { top: 11px; right: 0; } .topMenu > ul > li { float: left; padding-bottom:20px; } .topMenu > ul > li:after { content: "|"; padding: 0 8px; font-size: 10px; color:#afafaf; } .topMenu > ul > li:last-child:after { content: ""; padding: 0; } .topMenu > ul > li a { font-size: 11px; color:#afafaf; display:inline-block; text-transform: uppercase; } .topMenu > ul > li a:hover { color: #000; }ah1, .topMenu, #hdSchFrm, .topMenu , .topBanner { position: absolute; } body { min-width: 1265px !important; height: 100%; overflow-y: scroll !important; background: none !important; } /* header */ #header { position: relative; /* height: 228px; */ } #header .Wrap { position: relative; width: 1260px !important; margin: 0 auto; padding-left: 0 !important; } #header .bi, #header #gnb, #header #favLink { position: absolute; } /* bi */ #header .bi { left: 30px; top: 30px; } #topWrap { /* position: fixed; */ width:100%; border-bottom: 1px solid #dcdcdc; height: 39px; background: #fff; } #topWrap > div { width: 100%; z-index: 40000; background: #fff; height: 40px; border-bottom: 1px solid #eee; } .pFixed { top:0; position: fixed; z-index: 20000; } /* topMenu */ .topMenu { top: 11px; right: 0; } .topMenu > ul > li { float: left; padding-bottom:20px; } .topMenu > ul > li:after { content: "|"; padding: 0 8px; font-size: 10px; color:#afafaf; } .topMenu > ul > li:last-child:after { content: ""; padding: 0; } .topMenu > ul > li a { font-size: 11px; color:#afafaf; display:inline-block; text-transform: uppercase; } .topMenu > ul > li a:hover { color: #000; } #logo-sns-search { height: 129px; } /* 상단 gnb메뉴 */ .top_gnb { position: relative;} .top_gnb > a { background:url(/design/epampas1/s024/images/top_gnb_off.gif) no-repeat right center; padding-right:12px;font-size:11px; color:#999; text-transform:uppercase; } .top_gnb:hover > a { background:url(/design/epampas1/s024/images/top_gnb_on.gif) no-repeat right center; color:#333; } .top_gnb .top_lnb { display:none; position:absolute; top:23px; background:#fff; border:1px solid #666; padding:11px; z-index:10006; width:100%;} .top_gnb .top_lnb li { padding-left:5px;} .top_gnb .top_lnb li a { display:block; font-size:11px; color:#666; font-family:'Dotum','sans-serif'; line-height:20px;} .top_gnb .top_lnb li a:hover { color:#000; text-decoration:underline;} .tM01 { margin-left:-31px; width:100px !important;} .tM02 { margin-left:-65px; width:100px !important;} /* topBanner */ .topSns { position: absolute; top: 6px; z-index: 10; left: 0; width: 229px; overflow: hidden; display: table; } .topSns > a i { vertical-align: middle; } .topSns > a, .topSns > ul { display: inline-block; vertical-align: middle; } .topSns > a:hover { color: #000; } .topSns > ul { margin-left: 15px; } .topSns > ul li { display: inline-block; } .topSns > ul li a { background: #ededee; border-radius: 50%; width: 27px; height: 28px; text-align: center; line-height: 28px; display: block; } .topSns > ul li a:hover { color:#333; background: #d3d3d3; } /* h1 */ h1 { top: 49px; z-index:1; } h1 a { text-align: left; display: block; } /* hdSchFrm */ #header #hdSchFrm { left: 434px; top: 29px; z-index: 20; width:485px; } #header #hdSchFrm i { font-size: 1.5em; line-height: 1.9em; } #header #hdSchFrm form { overflow: hidden; } #header #hdSchFrm fieldset { width: auto; border: 2px solid #be4a42; width: 100%; } #header #hdSchFrm fieldset > div { display: table; width:100%; } #header #hdSchFrm .MS_search_word { display: table-cell; } #header #hdSchFrm .btn-sch { float: left; width: auto; padding-top: 8px; } #header #hdSchFrm .MS_search_word { border: 0px; width: 100%; height: 39px; padding: 0px 0 0 5px; } #header #hdSchFrm a { display: table-cell; text-align: center; color: #fff; background: #be4a42; width: 50px; padding-left: 5px; } #hdSchFrm p { margin-bottom: 5px; text-align: left; font-size: 11px; color: #999; } #hdSchFrm .fa-search { font-size: 1.3em; } /* favLink */ #header #favLink { right: 30px; top: 44px; } #header #langLink {position: absolute; left:0px; top: 9px} #header #langLink > a { padding-right:2px;} /* 슬라이드 */ #slider1 { width: 240px; height: 101px; } div.example { display: inline-block; position: relative; } div.example code { display: block; } div.example button { position: absolute; bottom: -5px; padding: 10px; z-index: 900; width: 17px; height: 26px; text-indent: -999em; display: block; } div.example button.prev { background: url(/design/epampas1/s024/images/btn_a_l.gif) no-repeat; left: 73px } div.example button.last { background: url(/design/epampas1/s024/images/btn_a_r.gif) no-repeat; left: 89px; } #slider1 > ul > li { position: relative; width: 240px; height: 101px; float: left; } /* gnbWrap */ #gnbWrap { position: relative; width: 100%; } #gnbWrap .gnb-boardWrap { position: relative; width: 100%; z-index: 10005; color: #fff; height: 52px; background: #444; } #gnbWrap .fixed { position: fixed; top: 39px; box-shadow: 0px 0 10px #dcdcdc; } /* gnbWrap */ .gnb {width:1260px; margin: 0 auto; position: relative; height: 48px; } .gnbCate { position: relative; padding-left: 208px; box-sizing: border-box; width: 100%; display: table; } .gnbCate ul { display: table-cell; } .gnbCate ul:last-child { width: 228px; background: #222; } .gnbCate ul li { display: inline-block; line-height: 50px; position: relative;} .gnbCate ul:first-child { padding-left: 20px; } .gnbCate ul:first-child li { padding: 0 30px; } .gnbCate ul:last-child li { padding: 0 20px; border-left: 1px solid #444; width: 49%; box-sizing: border-box; text-align: center; } .gnbCate li a { color: #fff; font-size: 15px; } .gnbCate li a span { position: absolute; top: -1px; width:100%; height: 3px; background: #be4a42; z-index: 20000; left: 0; } .category_menu { width: 208px; padding: 10px 0 30px; } .category_menu > li { position:relative; line-height:25px; height: 32px; z-index:9000; /* width: 115px; */ box-sizing: border-box; padding: 0 20px 0 30px; box-sizing: border-box; } .category_menu > li:first-child { margin-top: 10px; } .category_menu > li > a { color: #666; font-size:1.2em; display:block; text-align:left; font-weight: bold; } .category_menu > li > a > i { display: inline-block; position: absolute; right: 10px; top: 0px; font-size: 1.5em; } .category_menu .twoD > li > a > img { vertical-align: middle !important; padding-right: 10px; } .category_menu li.select { /* background:#437e00; border: 1px solid #ff0000; border-top:1px solid #343434;*/ } .category_menu .on { background:#fff; color: #333; /* border-top:1px solid #343434; */ } /* 마우스오버시 색변화 */ .category_menu .category_menu .on > a { color: #333; } .category_menu .deps2 { display:none; width: 200px; position:absolute; top: -5px; left: 208px; z-index:9001; border:1px solid #e8e8e8; padding: 15px 0 15px 0; background: #fff; overflow: visible !important; } /* top추가 */ .category_menu .deps2 > li { display:block; background:#fff; padding-left: 15px; line-height: 20px !important; height: 25px !important; position: relative; } .category_menu .deps2 > li a:hover { color:#333; } .lifloat > li { float: left; width: 45%;} .category_menu .m9 .deps2 { right: 0px !important; } .category_menu .deps2 .deps3 { display:none; min-width: 200px; max-width:100%; position:absolute; top: -15px; left: 200px; z-index:9002; border:1px solid #e8e8e8; padding: 15px 0 15px 0; background: #fff; } .category_menu .deps2 .deps3 li { display:block; background:#fff; padding-left: 15px; line-height: 20px !important; height: 25px !important; } .category_menu .deps2 li i { position: absolute; right: 10px; top: 5px; } #cateWrap { width: 208px; position: absolute; left: 50%; margin-left: -631px; top: 52px; z-index: 10000; background: #fff; border:1px solid #ddd; } #cateWrap #category_menuWrap { position: relative; overflow: hidden; word-wrap: break-word; width: 208px; } #cateWrap #category_menuWrap.sel { height: 800px !important; } #cateWrap .category_menu { height: 500px;box-sizing: border-box; } #cateWrap .cate_more { position: absolute; bottom: 0; width:208px; text-align: center; z-index: 10001; background: #fff; height: 40px; } #cateWrap .cate_more a { position: absolute; bottom: 0; height: 25px; line-height: 25px; background: #444; color: #fff; display: block; font-size: 20px; width:100%; } /* 전체카테고리 */ #fullCate { position: absolute; top: 0; left: 0; z-index: 10001; } #fullCate > a { height: 52px; line-height: 52px; color: #fff; background: #be4a42; display: block; width: 208px; text-align: center; font-size: 1.2em; font-weight: bold;} #fullCate > a > i { font-size: 1.4em; vertical-align: middle; padding-right: 5px; } #fullCate > div { position: absolute; top: 52px; width: 1258px; /* height: 300px; */ background: #fff; border: 1px solid #555; background: #fff; overflow: hidden; display: none; } #fullCate > div > a { position: absolute; bottom: 3px; right: 7px; } #fullCate > div > div { display: table; width: 100%; background:#fff; box-sizing: border-box; vertical-align: top; } #fullCate > div > div > div { display: table-cell; border-right: 1px solid #e1e1e1; padding: 30px 10px; box-sizing: border-box; background: #fff;} #fullCate .c-gnbMenu > div { display: inline-block; vertical-align: top; padding: 0 20px 30px; width: 24%; box-sizing: border-box; } #fullCate .c-community, #fullCate .c-mypage { width: 15%;box-sizing: border-box; padding-left: 20px; background: #fbfbfb; vertical-align: top; } #fullCate .c-deps2 { } #fullCate .c-gnbMenu > div > ul > li { padding: 0 20px 0 0; position: relative; max-width: 200px; } #fullCate .c-deps3 { display: none; position: absolute; top: 0px; width: 200px; left: 100%; background: #fff; z-index: 20000; box-shadow: 3px 3px 3px #e1e1e1; } /* #fullCate > div > div+div+div+div+div{ border-right: none; } */ #fullCate .c-gnbMenu h3 { margin-bottom: 15px; } #fullCate .c-gnbMenu h3 a, #fullCate .c-community h3, #fullCate .c-mypage h3 { font-size: 1.3em; color: #333; margin-bottom: 15px; } #fullCate .c-gnbMenu > div > ul > li > a, #fullCate .c-community > ul > li > a, #fullCate .c-mypage > ul > li > a { line-height: 22px; height: 22px; display: block; } #fullCate .c-gnbMenu > div > ul > li > a:hover, #fullCate .c-gnbMenu > div > ul > li li a:hover, #fullCate .c-community li > a:hover, #fullCate .c-mypage li > a:hover{ color: #000; /*background: #f9f9f9; */ } #fullCate .c-gnbMenu > div > ul > li .on { font-size: 1.1em !important; } #fullCate .c-gnbMenu > div > ul > li > ul { /* margin-left: 10px; */ } #fullCate .c-gnbMenu > div > ul > li > ul li:before { content: "-"; padding: 0 4px; vertical-align: middle; color: #666;line-height: 25px; height: 25px; } .page-body { margin-bottom: 150px; } .paging { padding-top: 70px; } #fullCate .c-gnbMenu .c-deps2 > i { position: absolute; right: 2px; top: 6px; /* display: none; */ display: none; } #fullCate .c-gnbMenu > div > ul > li ul { border: 1px solid #e1e1e1; padding: 7px 10px 7px 10px; } #fullCate .c-gnbMenu > div > ul > li li a { line-height: 1.4em; } /* #topBanner */ #topBanner { position: relative; width: 100%; overflow: hidden; height: 100px; } #topBanner li { position: absolute; height: 100px; width: 100%; left: 50%; margin-left: -1000px; } #topBanner .tClose { position: absolute; bottom: 7px; right: 20px; } #topBanner .tClose input { border: 1px solid #777; width: 25px; height:25px; display: inline-block; font-size: 13px; } #topBanner .tClose label { display: none; border: 1px solid #ddd; width: 125px; height:23px; line-height: 23px; padding: 0 10px; background: rgba(255,255,255,0.8); position: absolute; top: -4px; right: 25px; } #topBanner .tClose i { font-size: 3.0em; color: #777; cursor:pointer; vertical-align: middle; } #topBanner #check { position: relative; } /* #topBanner */ #top_ombs { position: absolute; right:0; bottom: 0; width: 264px; overflow: hidden; height: 128px; } /** * BxSlider v4.1.2 - Fully loaded, responsive content slider * http://bxslider.com * * Written by: Steven Wanderski, 2014 * http://stevenwanderski.c om * (while drinking Belgian ales and listening to jazz) * * CEO and founder of bxCreative, LTD * http://bxcreative.com */ /** RESET AND LAYOUT ===================================*/ .bx-wrapper { position: relative; padding: 0; *zoom: 1; top: 0; } /** THEME ===================================*/ .topBanner .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } .topBanner .bx-pager { width: 229px; left: 50%; z-index: 9999; bottom: 42px; /*top: 58%; */ position: absolute; margin-left: -45px; display:none; } .topBanner .bx-pager-item a { width: 17px; height: 16px; text-indent: -999em; margin-right: 7px; display: inline-block; background: url(../_image/bull_mainImg_off.png) no-repeat; float: left; } .topBanner .bx-pager-item a.active { background: url(../_image/bull_mainImg_on.png) no-repeat; } /* DIRECTION CONTROLS (NEXT / PREV) */ .topBanner .bx-wrapper .bx-prev { left: 0px; background: url(/design/epampas1/s024/images/btn_a_l.gif) no-repeat; } .topBanner .bx-wrapper .bx-next { left: 16px; background: url(/design/epampas1/s024/images/btn_a_r.gif) no-repeat; } .topBanner .bx-wrapper .bx-controls-direction { margin-left: 97px; position: relative; } .topBanner .bx-wrapper .bx-controls-direction a { position: absolute; bottom: 10px; margin-top: -16px; outline: 0; width: 16px; height: 13px; text-indent: -9999px; z-index: 9999; } .topBanner .bx-wrapper .bx-controls-direction a.disabled { display: none; } .topBanner .bx-wrapper .bx-controls-direction a { text-indent: -999em; } /* .banner01 DIRECTION CONTROLS (NEXT / PREV) */ #topBanner .bx-wrapper .bx-controls-direction { width: 1000px; left: 50%; margin-left: -630px; position: absolute; top: 0px; z-index: 39999; display: none; } #topBanner .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; text-indent: -9999px; z-index: 19999; height: 30px; opacity: 0.3; width: 30px; background: #000; } #topBanner .bx-wrapper .bx-controls-direction a.disabled { display: none; } #topBanner .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #topBanner .bx-wrapper .bx-prev { } #topBanner .bx-wrapper a.bx-next { top:31px; } #topBanner .bx-wrapper .bx-controls-direction a i { text-indent: 0px !important; color: #fff; font-size: 1.5em; width:100%; height:100%; position: absolute; top:5px; left:0; text-align: center; } #topBanner .bx-wrapper .bx-controls-direction a:hover { opacity: 0.5; } #topBanner .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } #topBanner .bx-pager { width: 100%; z-index: 9999; bottom: 10px; position: absolute; display: table; text-align: center; display:none; } #topBanner .bx-pager > div { display: inline-block; text-align: center; margin: 0 5px; } #topBanner .bx-pager-item { } #topBanner .bx-pager-item a { text-indent: -999em; width: 9px; height: 9px; border-radius: 50%; background: #fff; display: block; } #topBanner .bx-pager-item a.active { background: #555;} /* #top_ombs */ #top_ombs .bx-pager { display: none; } /* DIRECTION CONTROLS (NEXT / PREV) */ #top_ombs .bx-wrapper .bx-controls-direction { position: absolute; bottom: 40px; width: 100%; } #top_ombs .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 18px; height: 16px; text-indent: -9999px; z-index: 9999; border: 1px solid #eee; } #top_ombs .bx-wrapper .bx-controls-direction a i { display: inline-block; width:100%; position: absolute; text-align: center; font-size:1.0em; height: 16px; line-height: 16px; text-indent: 0; left:0; top: 0; color: #000; } #top_ombs .bx-wrapper .bx-controls-direction a.disabled { display: none; } #top_ombs .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #top_ombs .bx-wrapper .bx-prev { left: 120px; } #top_ombs .bx-wrapper .bx-next { left: 139px; } /* 상품들 */ /* 상품 preview */ .preview { position: absolute; bottom: 10px; left: 0px; background:rgba(0, 0, 0, 0.6); /*background: #000; opacity: 0.6; */ width: 30px; text-align: center; display: none; border-radius: 2px; z-index:9000; } .preview > div:first-child a { padding-top: 8px; } .preview > div:last-child a { padding-bottom: 6px; } .preview > div { position: relative !important; } .preview > div a { display: block; padding: 4px 0 3px; vertical-align: middle; border-radius: 2px; } .preview > div span { position: absolute; display: none; top:0; z-index: 100; left: 30px; width: 50px; font-size: 11px; background:rgba(0, 0, 0, 0.8); color: #fff; padding: 0 7px 0 5px; line-height: 2.5em; display: inline; border-radius: 2px; margin-left: 2px; } .preview a i { color: #dedede; } .preview a:hover { background:rgba(0, 0, 0, 0.7); } .preview a:hover i { background:rgba(0, 0, 0, 0.7); color: #fff; } .preview i { font-size: 1.5em; color: #fff; } .discount { position: absolute; top: -4px; right: 0px; width: 100%; min-width: 200px; text-align: right; } .discount span.sale { background: #000; color: #fff; width: 45px; height: 45px; line-height: 45px; display: inline-block; font-size: 1.05em; text-align: center; font-weight: bold; border-radius: 2px; } .hit { position: absolute; bottom: 10px; right: 3px; background: #fff; box-shadow: 3px 1px 3px #cfcfcf; padding: 3px 10px; border-radius: 2px; display: none; font-size:11px; } .hit i { font-size: 1.2em; line-height: 1.2em; vertical-align: middle;} .soldOut { position: absolute; z-index: 9999; display: inline-block; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.5); top: 0; left: 0; color: #fff; text-align: center; padding-top: 45%; } .font { width: 15px; height: 4px; display: inline-block; } .brand { margin: 3px 0 5px 0; color: #333; } .MK-product-icons { } .MK-product-icons img { margin: 5px 5px 0 0; } /* 상품 리스트 */ .listPrd { padding: 40px 20px 20px; } .listPrd .list { position: relative; overflow: hidden; padding: 3px 4px 0 0; box-sizing: border-box; } .listPrd .list > a { width: 100%; height: 100%; border:1px solid #eee; border-bottom: 1px solid #eee; overflow: hidden; display: block; box-sizing: border-box; } .listPrd .list > a > img { width: 100%; } /* 상품 정보 */ .suj { word-break:break-all; padding: 0px 0 10px; color: #333; margin-top: 10px; } .suj a { color: #555; font-size: 13px; letter-spacing: -0.05em;} .suj a:hover { color: #000; } .price { margin-bottom: 5px; color: #333; font-size: 13px;} .price strike { color: #777; } .color_name { margin: 3px 0 0px 0; } .sub_content { word-break:break-all; padding: 0 0 5px 0; } .sub_content a { font-size: 12px; } /* tit */ .hd { display: table; width:100%; margin-bottom: 20px; text-align: center; } .hd > h2 { font-size: 2.5em; font-family:"Open Sans",'sans-serif'; color:#222; line-height:40px; text-transform: uppercase; display: block; } .hd span { color:#999; font-size: 13px; display: inline-block; margin: 8px 0 0 10px; } .hd > a { position: absolute; top: 15px; right: 10px; font-size: 0.85em; text-transform: lowercase; font-family:'Dotum','sans-serif'; } /* total */ .total-sort { padding: 0 10px; } .total-sort .sort li { margin-left: 0; } .total-sort .sort li a:hover { color: #000; } .total-sort .sort li a:after { content: "|"; padding: 0 5px; } .total-sort .sort li:last-child a:after { content: ""; padding: 0; } .total-sort .total dt { padding-right: 5px; } .prd_listWrap { display: table; width:100%; overflow: hidden; padding-left:7px; } .prd_listWrap > li { display: inline-block; box-sizing: border-box; vertical-align: top; } .prd_listWrap.col3 > li { width: 33%; } .prd_listWrap.col4 > li { width: 24.7%; } .prd_listWrap.col5 > li { width: 19.7%; } .prd_listWrap .listPrd { padding: 30px 10px 20px 10px; } .prd_listWrap > li .suj { border-bottom: 1px solid #eee; margin-bottom: 10px; } .prd_listWrap > li .price strike { display: block !important; font-size: 0.9em; margin-bottom: 5px; } .prd_listWrap > li .brand { margin: 7px 0 10px 0; } /* padding */ .pt_5 { padding-top: 5px; } .pt_10 { padding-top: 10px; } /* margin */ .mt_5 { margin-top: 5px; } .mt_10 { margin-top: 10px; } .mb_5 { margin-bottom: 5px; } .mb_10 { margin-bottom: 10px; } .mb_20 { margin-bottom: 20px; } @media screen and (max-width:1200px){ body { overflow-x: visible; } } #logo-sns-search { height: 129px; } /* 상단 gnb메뉴 */ .top_gnb { position: relative;} .top_gnb > a { background:url(/design/epampas1/s024/images/top_gnb_off.gif) no-repeat right center; padding-right:12px;font-size:11px; color:#999; text-transform:uppercase; } .top_gnb:hover > a { background:url(/design/epampas1/s024/images/top_gnb_on.gif) no-repeat right center; color:#333; } .top_gnb .top_lnb { display:none; position:absolute; top:23px; background:#fff; border:1px solid #666; padding:11px; z-index:10006; width:100%;} .top_gnb .top_lnb li { padding-left:5px;} .top_gnb .top_lnb li a { display:block; font-size:11px; color:#666; font-family:'Dotum','sans-serif'; line-height:20px;} .top_gnb .top_lnb li a:hover { color:#000; text-decoration:underline;} .tM01 { margin-left:-31px; width:100px !important;} .tM02 { margin-left:-65px; width:100px !important;} /* topBanner */ .topSns { position: absolute; top: 6px; z-index: 10; left: 0; width: 229px; overflow: hidden; display: table; } .topSns > a i { vertical-align: middle; } .topSns > a, .topSns > ul { display: inline-block; vertical-align: middle; } .topSns > a:hover { color: #000; } .topSns > ul { margin-left: 15px; } .topSns > ul li { display: inline-block; } .topSns > ul li a { background: #ededee; border-radius: 50%; width: 27px; height: 28px; text-align: center; line-height: 28px; display: block; } .topSns > ul li a:hover { color:#333; background: #d3d3d3; } /* h1 */ h1 { top: 20px; z-index:1; left: 40px; } h1 a { text-align: left; display: block; } /* hdSchFrm */ #header #hdSchFrm { left: 434px; top: 29px; z-index: 20; width:485px; } #header #hdSchFrm i { font-size: 1.5em; line-height: 1.9em; } #header #hdSchFrm form { overflow: hidden; } #header #hdSchFrm fieldset { width: auto; border: 2px solid #be4a42; width: 100%; } #header #hdSchFrm fieldset > div { display: table; width:100%; } #header #hdSchFrm .MS_search_word { display: table-cell; } #header #hdSchFrm .btn-sch { float: left; width: auto; padding-top: 8px; } #header #hdSchFrm .MS_search_word { border: 0px; width: 100%; height: 39px; padding: 0px 0 0 5px; } #header #hdSchFrm a { display: table-cell; text-align: center; color: #fff; background: #be4a42; width: 50px; padding-left: 5px; } #hdSchFrm p { margin-bottom: 5px; text-align: left; font-size: 11px; color: #999; } #hdSchFrm .fa-search { font-size: 1.3em; } /* favLink */ #header #favLink { right: 30px; top: 44px; } #header #langLink {position: absolute; left:0px; top: 9px} #header #langLink > a { padding-right:2px;} /* 슬라이드 */ #slider1 { width: 240px; height: 101px; } div.example { display: inline-block; position: relative; } div.example code { display: block; } div.example button { position: absolute; bottom: -5px; padding: 10px; z-index: 900; width: 17px; height: 26px; text-indent: -999em; display: block; } div.example button.prev { background: url(/design/epampas1/s024/images/btn_a_l.gif) no-repeat; left: 73px } div.example button.last { background: url(/design/epampas1/s024/images/btn_a_r.gif) no-repeat; left: 89px; } #slider1 > ul > li { position: relative; width: 240px; height: 101px; float: left; } /* gnbWrap */ #gnbWrap { position: relative; width: 100%; } #gnbWrap .gnb-boardWrap { position: relative; width: 100%; z-index: 10005; color: #fff; height: 52px; background: #444; } #gnbWrap .fixed { position: fixed; top: 39px; box-shadow: 0px 0 10px #dcdcdc; } /* gnbWrap */ .gnb {width:1260px; margin: 0 auto; position: relative; height: 48px; } .gnbCate { position: relative; padding-left: 208px; box-sizing: border-box; width: 100%; display: table; } .gnbCate ul { display: table-cell; } .gnbCate ul:last-child { /* width: 228px; */ width: 130px; background: #222; } .gnbCate ul li { display: inline-block; line-height: 50px; position: relative;} .gnbCate ul:first-child { padding-left: 20px; } .gnbCate ul:first-child li { padding: 0 70px; } .gnbCate ul:last-child li { padding: 0 20px; border-left: 1px solid #444; /* width: 49%; */ width: 100%; box-sizing: border-box; text-align: center; } .gnbCate li a { color: #fff; font-size: 15px; } .gnbCate li a span { position: absolute; top: -1px; width:100%; height: 3px; background: #be4a42; z-index: 20000; left: 0; } .category_menu { width: 208px; padding: 10px 0 30px; } .category_menu > li { position:relative; line-height:25px; height: 32px; z-index:9000; /* width: 115px; */ box-sizing: border-box; padding: 0 20px 0 30px; box-sizing: border-box; } .category_menu > li:first-child { margin-top: 10px; } .category_menu > li > a { color: #666; font-size:1.2em; display:block; text-align:left; font-weight: bold; } .category_menu > li > a > i { display: inline-block; position: absolute; right: 10px; top: 0px; font-size: 1.5em; } .category_menu .twoD > li > a > img { vertical-align: middle !important; padding-right: 10px; } .category_menu li.select { /* background:#437e00; border: 1px solid #ff0000; border-top:1px solid #343434;*/ } .category_menu .on { background:#fff; color: #333; /* border-top:1px solid #343434; */ } /* 마우스오버시 색변화 */ .category_menu .category_menu .on > a { color: #333; } .category_menu .deps2 { display:none; width: 200px; position:absolute; top: -5px; left: 208px; z-index:9001; border:1px solid #e8e8e8; padding: 15px 0 15px 0; background: #fff; overflow: visible !important; } /* top추가 */ .category_menu .deps2 > li { display:block; background:#fff; padding-left: 15px; line-height: 20px !important; height: 25px !important; position: relative; } .category_menu .deps2 > li a:hover { color:#333; } .lifloat > li { float: left; width: 45%;} .category_menu .m9 .deps2 { right: 0px !important; } .category_menu .deps2 .deps3 { display:none; min-width: 200px; max-width:100%; position:absolute; top: -15px; left: 200px; z-index:9002; border:1px solid #e8e8e8; padding: 15px 0 15px 0; background: #fff; } .category_menu .deps2 .deps3 li { display:block; background:#fff; padding-left: 15px; line-height: 20px !important; height: 25px !important; } .category_menu .deps2 li i { position: absolute; right: 10px; top: 5px; } #cateWrap { width: 208px; position: absolute; left: 50%; margin-left: -631px; top: 52px; z-index: 10000; background: #fff; border:1px solid #ddd; } #cateWrap #category_menuWrap { position: relative; overflow: hidden; word-wrap: break-word; width: 208px; } #cateWrap #category_menuWrap.sel { height: 800px !important; } #cateWrap .category_menu { height: 500px;box-sizing: border-box; } #cateWrap .cate_more { position: absolute; bottom: 0; width:208px; text-align: center; z-index: 10001; background: #fff; height: 40px; } #cateWrap .cate_more a { position: absolute; bottom: 0; height: 25px; line-height: 25px; background: #444; color: #fff; display: block; font-size: 20px; width:100%; } /* 전체카테고리 */ #fullCate { position: absolute; top: 0; left: 0; z-index: 10001; } #fullCate > a { height: 52px; line-height: 52px; color: #fff; background: #be4a42; display: block; width: 208px; text-align: center; font-size: 1.2em; font-weight: bold;} #fullCate > a > i { font-size: 1.4em; vertical-align: middle; padding-right: 5px; } #fullCate > div { position: absolute; top: 52px; width: 1258px; /* height: 300px; */ background: #fff; border: 1px solid #555; background: #fff; overflow: hidden; display: none; overflow-y: scroll; height: 650px; } #fullCate > div > a { position: absolute; bottom: 3px; right: 7px; } #fullCate > div > div { display: table; width: 100%; background:#fff; box-sizing: border-box; vertical-align: top; } #fullCate > div > div > div { display: table-cell; border-right: 1px solid #e1e1e1; padding: 30px 10px; box-sizing: border-box; background: #fff;} #fullCate .c-gnbMenu > div { display: inline-block; vertical-align: top; padding: 0 20px 30px; width: 24%; box-sizing: border-box; } #fullCate .c-community, #fullCate .c-mypage { width: 15%;box-sizing: border-box; padding-left: 20px; background: #fbfbfb; vertical-align: top; } #fullCate .c-deps2 { } #fullCate .c-gnbMenu > div > ul > li { padding: 0 20px 0 0; position: relative; max-width: 200px; } #fullCate .c-deps3 { display: none; position: absolute; top: 0px; width: 200px; left: 100%; background: #fff; z-index: 20000; box-shadow: 3px 3px 3px #e1e1e1; } /* #fullCate > div > div+div+div+div+div{ border-right: none; } */ #fullCate .c-gnbMenu h3 { margin-bottom: 15px; } #fullCate .c-gnbMenu h3 a, #fullCate .c-community h3, #fullCate .c-mypage h3 { font-size: 1.3em; color: #333; margin-bottom: 15px; } #fullCate .c-gnbMenu > div > ul > li > a, #fullCate .c-community > ul > li > a, #fullCate .c-mypage > ul > li > a { line-height: 22px; height: 22px; display: block; } #fullCate .c-gnbMenu > div > ul > li > a:hover, #fullCate .c-gnbMenu > div > ul > li li a:hover, #fullCate .c-community li > a:hover, #fullCate .c-mypage li > a:hover{ color: #000; /*background: #f9f9f9; */ } #fullCate .c-gnbMenu > div > ul > li .on { font-size: 1.1em !important; } #fullCate .c-gnbMenu > div > ul > li > ul { /* margin-left: 10px; */ } #fullCate .c-gnbMenu > div > ul > li > ul li:before { content: "-"; padding: 0 4px; vertical-align: middle; color: #666;line-height: 25px; height: 25px; } .page-body { margin-bottom: 150px; } .paging { padding-top: 70px; } #fullCate .c-gnbMenu .c-deps2 > i { position: absolute; right: 2px; top: 6px; /* display: none; */ display: none; } #fullCate .c-gnbMenu > div > ul > li ul { border: 1px solid #e1e1e1; padding: 7px 10px 7px 10px; } #fullCate .c-gnbMenu > div > ul > li li a { line-height: 1.4em; } /* #topBanner */ #topBanner { position: relative; width: 100%; overflow: hidden; height: 100px; } #topBanner li { position: absolute; height: 100px; width: 100%; left: 50%; margin-left: -1000px; } #topBanner .tClose { position: absolute; bottom: 7px; right: 20px; } #topBanner .tClose input { border: 1px solid #777; width: 25px; height:25px; display: inline-block; font-size: 13px; } #topBanner .tClose label { display: none; border: 1px solid #ddd; width: 125px; height:23px; line-height: 23px; padding: 0 10px; background: rgba(255,255,255,0.8); position: absolute; top: -4px; right: 25px; } #topBanner .tClose i { font-size: 3.0em; color: #777; cursor:pointer; vertical-align: middle; } #topBanner #check { position: relative; } /* #topBanner */ #top_ombs { position: absolute; right:0; bottom: 0; width: 264px; overflow: hidden; height: 128px; } /** * BxSlider v4.1.2 - Fully loaded, responsive content slider * http://bxslider.com * * Written by: Steven Wanderski, 2014 * http://stevenwanderski.c om * (while drinking Belgian ales and listening to jazz) * * CEO and founder of bxCreative, LTD * http://bxcreative.com */ /** RESET AND LAYOUT ===================================*/ .bx-wrapper { position: relative; padding: 0; *zoom: 1; top: 0; } /** THEME ===================================*/ .topBanner .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } .topBanner .bx-pager { width: 229px; left: 50%; z-index: 9999; bottom: 42px; /*top: 58%; */ position: absolute; margin-left: -45px; display:none; } .topBanner .bx-pager-item a { width: 17px; height: 16px; text-indent: -999em; margin-right: 7px; display: inline-block; background: url(../_image/bull_mainImg_off.png) no-repeat; float: left; } .topBanner .bx-pager-item a.active { background: url(../_image/bull_mainImg_on.png) no-repeat; } /* DIRECTION CONTROLS (NEXT / PREV) */ .topBanner .bx-wrapper .bx-prev { left: 0px; background: url(/design/epampas1/s024/images/btn_a_l.gif) no-repeat; } .topBanner .bx-wrapper .bx-next { left: 16px; background: url(/design/epampas1/s024/images/btn_a_r.gif) no-repeat; } .topBanner .bx-wrapper .bx-controls-direction { margin-left: 97px; position: relative; } .topBanner .bx-wrapper .bx-controls-direction a { position: absolute; bottom: 10px; margin-top: -16px; outline: 0; width: 16px; height: 13px; text-indent: -9999px; z-index: 9999; } .topBanner .bx-wrapper .bx-controls-direction a.disabled { display: none; } .topBanner .bx-wrapper .bx-controls-direction a { text-indent: -999em; } /* .banner01 DIRECTION CONTROLS (NEXT / PREV) */ #topBanner .bx-wrapper .bx-controls-direction { width: 1000px; left: 50%; margin-left: -630px; position: absolute; top: 0px; z-index: 39999; display: none; } #topBanner .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; text-indent: -9999px; z-index: 19999; height: 30px; opacity: 0.3; width: 30px; background: #000; } #topBanner .bx-wrapper .bx-controls-direction a.disabled { display: none; } #topBanner .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #topBanner .bx-wrapper .bx-prev { } #topBanner .bx-wrapper a.bx-next { top:31px; } #topBanner .bx-wrapper .bx-controls-direction a i { text-indent: 0px !important; color: #fff; font-size: 1.5em; width:100%; height:100%; position: absolute; top:5px; left:0; text-align: center; } #topBanner .bx-wrapper .bx-controls-direction a:hover { opacity: 0.5; } #topBanner .bx-wrapper .bx-controls-auto { position: absolute; bottom: 0; width: 100%; } #topBanner .bx-pager { width: 100%; z-index: 9999; bottom: 10px; position: absolute; display: table; text-align: center; display:none; } #topBanner .bx-pager > div { display: inline-block; text-align: center; margin: 0 5px; } #topBanner .bx-pager-item { } #topBanner .bx-pager-item a { text-indent: -999em; width: 9px; height: 9px; border-radius: 50%; background: #fff; display: block; } #topBanner .bx-pager-item a.active { background: #555;} /* #top_ombs */ #top_ombs .bx-pager { display: none; } /* DIRECTION CONTROLS (NEXT / PREV) */ #top_ombs .bx-wrapper .bx-controls-direction { position: absolute; bottom: 40px; width: 100%; } #top_ombs .bx-wrapper .bx-controls-direction a { position: absolute; top: 0; outline: 0; width: 18px; height: 16px; text-indent: -9999px; z-index: 9999; border: 1px solid #eee; } #top_ombs .bx-wrapper .bx-controls-direction a i { display: inline-block; width:100%; position: absolute; text-align: center; font-size:1.0em; height: 16px; line-height: 16px; text-indent: 0; left:0; top: 0; color: #000; } #top_ombs .bx-wrapper .bx-controls-direction a.disabled { display: none; } #top_ombs .bx-wrapper .bx-controls-direction a { text-indent: -999em; } #top_ombs .bx-wrapper .bx-prev { left: 120px; } #top_ombs .bx-wrapper .bx-next { left: 139px; } /* 상품들 */ /* 상품 preview */ .preview { position: absolute; bottom: 10px; left: 0px; background:rgba(0, 0, 0, 0.6); /*background: #000; opacity: 0.6; */ width: 30px; text-align: center; display: none; border-radius: 2px; z-index:9000; } .preview > div:first-child a { padding-top: 8px; } .preview > div:last-child a { padding-bottom: 6px; } .preview > div { position: relative !important; } .preview > div a { display: block; padding: 4px 0 3px; vertical-align: middle; border-radius: 2px; } .preview > div span { position: absolute; display: none; top:0; z-index: 100; left: 30px; width: 50px; font-size: 11px; background:rgba(0, 0, 0, 0.8); color: #fff; padding: 0 7px 0 5px; line-height: 2.5em; display: inline; border-radius: 2px; margin-left: 2px; } .preview a i { color: #dedede; } .preview a:hover { background:rgba(0, 0, 0, 0.7); } .preview a:hover i { background:rgba(0, 0, 0, 0.7); color: #fff; } .preview i { font-size: 1.5em; color: #fff; } .discount { position: absolute; top: -4px; right: 0px; width: 100%; min-width: 200px; text-align: right; } .discount span.sale { background: #000; color: #fff; width: 45px; height: 45px; line-height: 45px; display: inline-block; font-size: 1.05em; text-align: center; font-weight: bold; border-radius: 2px; } .hit { position: absolute; bottom: 10px; right: 3px; background: #fff; box-shadow: 3px 1px 3px #cfcfcf; padding: 3px 10px; border-radius: 2px; display: none; font-size:11px; } .hit i { font-size: 1.2em; line-height: 1.2em; vertical-align: middle;} .soldOut { position: absolute; z-index: 9999; display: inline-block; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.5); top: 0; left: 0; color: #fff; text-align: center; padding-top: 45%; } .font { width: 15px; height: 4px; display: inline-block; } .brand { margin: 3px 0 5px 0; color: #333; } .MK-product-icons { } .MK-product-icons img { margin: 5px 5px 0 0; } /* 상품 리스트 */ .listPrd { padding: 40px 20px 20px; } .listPrd .list { position: relative; overflow: hidden; padding: 3px 4px 0 0; box-sizing: border-box; } .listPrd .list > a { width: 100%; height: 100%; border:1px solid #eee; border-bottom: 1px solid #eee; overflow: hidden; display: block; box-sizing: border-box; } .listPrd .list > a > img { width: 100%; } /* 상품 정보 */ .suj { word-break:break-all; padding: 0px 0 10px; color: #333; margin-top: 10px; } .suj a { color: #555; font-size: 13px; letter-spacing: -0.05em;} .suj a:hover { color: #000; } .price { margin-bottom: 5px; color: #333; font-size: 13px;} .price strike { color: #777; } .color_name { margin: 3px 0 0px 0; } .sub_content { word-break:break-all; padding: 0 0 5px 0; } .sub_content a { font-size: 12px; } /* tit */ .hd { display: table; width:100%; margin-bottom: 20px; text-align: center; } .hd > h2 { font-size: 2.5em; font-family:"Open Sans",'sans-serif'; color:#222; line-height:40px; text-transform: uppercase; display: block; } .hd span { color:#999; font-size: 13px; display: inline-block; margin: 8px 0 0 10px; } .hd > a { position: absolute; top: 15px; right: 10px; font-size: 0.85em; text-transform: lowercase; font-family:'Dotum','sans-serif'; } /* total */ .total-sort { padding: 0 10px; } .total-sort .sort li { margin-left: 0; } .total-sort .sort li a:hover { color: #000; } .total-sort .sort li a:after { content: "|"; padding: 0 5px; } .total-sort .sort li:last-child a:after { content: ""; padding: 0; } .total-sort .total dt { padding-right: 5px; } .prd_listWrap { display: table; width:100%; overflow: hidden; } .prd_listWrap > li { display: inline-block; box-sizing: border-box; vertical-align: top; } .prd_listWrap.col3 > li { width: 33%; } .prd_listWrap.col4 > li { width: 24.7%; } .prd_listWrap.col5 > li { width: 19.7%; } .prd_listWrap .listPrd { padding: 30px 10px 20px 10px; } .prd_listWrap > li .suj { border-bottom: 1px solid #eee; margin-bottom: 10px; } .prd_listWrap > li .price strike { display: block !important; font-size: 0.9em; margin-bottom: 5px; } .prd_listWrap > li .brand { margin: 7px 0 10px 0; } /* padding */ .pt_5 { padding-top: 5px; } .pt_10 { padding-top: 10px; } /* margin */ .mt_5 { margin-top: 5px; } .mt_10 { margin-top: 10px; } .mb_5 { margin-bottom: 5px; } .mb_10 { margin-bottom: 10px; } .mb_20 { margin-bottom: 20px; } @media screen and (max-width:1200px){ body { overflow-x: visible; } } /* JM start */ #header .bx-controls-direction {position:absolute;top:100px;left:-100px;} #header #top_ombs .xi-angle-left-thin {background-color:#dedede; opacity:0.7;} #header #top_ombs .xi-angle-right-thin {background-color:#dedede; opacity:0.7;} /* JM salemall hidden */ .category_menu li:nth-child(17)>a {display:none;} .category_menu li:nth-child(17)>ul li {display:none;} .category_menu li:nth-child(17)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(17)>a {display:none;} .c-gnbMenu div:nth-child(17)>ul li {display:none;} .c-gnbMenu div:nth-child(17)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(17)>h3 {display:none;} /* JM bestlist hidden */ .category_menu li:nth-child(18)>a {display:none;} .category_menu li:nth-child(18)>ul li {display:none;} .category_menu li:nth-child(18)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(18)>a {display:none;} .c-gnbMenu div:nth-child(18)>ul li {display:none;} .c-gnbMenu div:nth-child(18)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(18)>h3 {display:none;} /* JM eventhall hidden */ .category_menu li:nth-child(19)>a {display:none;} .category_menu li:nth-child(19)>ul li {display:none;} .category_menu li:nth-child(19)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(19)>a {display:none;} .c-gnbMenu div:nth-child(19)>ul li {display:none;} .c-gnbMenu div:nth-child(19)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(19)>h3 {display:none;} /* JM eventhall(Temporary) hidden */ .category_menu li:nth-child(20)>a {display:none;} .category_menu li:nth-child(20)>ul li {display:none;} .category_menu li:nth-child(20)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(20)>a {display:none;} .c-gnbMenu div:nth-child(20)>ul li {display:none;} .c-gnbMenu div:nth-child(20)>ul {border:none; padding:0px;} .c-gnbMenu div:nth-child(20)>h3 {display:none;} /* JM fontred */ .category_menu .m1>a {color:red;} /* JM TRblue */ /* .category_menu .m1>a {color:blue;} */ /* JM topBanner */ #topBannerkim { position: relative; width: 100%; overflow: hidden; height: 100px; } #topBannerkim li { position: absolute; height: 100px; width: 100%; left: 50%; margin-left: -1000px; } #topBannerkim .tClose { position: absolute; bottom: 7px; right: 20px; } #topBannerkim .tClose input { border: 1px solid #777; width: 25px; height:25px; display: inline-block; font-size: 13px; } #topBannerkim .tClose label { display: none; border: 1px solid #ddd; width: 125px; height:23px; line-height: 23px; padding: 0 10px; background: rgba(255,255,255,0.8); position: absolute; top: -4px; right: 25px; } #topBannerkim .tClose i { font-size: 3.0em; color: #777; cursor:pointer; vertical-align: middle; } #topBannerkim #check { position: relative; } /* JM end */ /* BASIC css end */