/** * Swiper 3.4.1 * Most modern mobile touch slider and framework with hardware accelerated transitions * * http://www.idangero.us/swiper/ * * Copyright 2016, Vladimir Kharlampidi * The iDangero.us * http://www.idangero.us/ * * Licensed under MIT * * Released on: December 13, 2016 */ .swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-moz-box-orient:vertical;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate(0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-box-lines:multiple;-moz-box-lines:multiple;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex:0 0 auto;flex-shrink:0;width:100%;height:100%;position:relative}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-ms-flex-align:start;-webkit-align-items:flex-start;align-items:flex-start;-webkit-transition-property:-webkit-transform,height;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform,height}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-wp8-horizontal{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-wp8-vertical{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;-moz-background-size:27px 44px;-webkit-background-size:27px 44px;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-white .swiper-pagination-bullet{background:#fff}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-o-transform:translate(0,-50%);-ms-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:5px 0;display:block}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px}.swiper-pagination-progress{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progress .swiper-pagination-progressbar{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar{-webkit-transform-origin:right top;-moz-transform-origin:right top;-ms-transform-origin:right top;-o-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progress{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progress{width:4px;height:100%;left:0;top:0}.swiper-pagination-progress.swiper-pagination-white{background:rgba(255,255,255,.5)}.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar{background:#fff}.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar{background:#000}.swiper-container-3d{-webkit-perspective:1200px;-moz-perspective:1200px;-o-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-coverflow .swiper-wrapper,.swiper-container-flip .swiper-wrapper{-ms-perspective:1200px}.swiper-container-cube,.swiper-container-flip{overflow:visible}.swiper-container-cube .swiper-slide,.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-cube .swiper-slide .swiper-slide,.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active,.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-slide{visibility:hidden;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-moz-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-moz-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;-moz-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:"";width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;-webkit-background-size:100%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}} /* ------------- urban Type A1 --------------*/ /* main.css */ /* main.css */ .main_visual.swiper-container{width:100%;height:100%} .main_visual .swiper-wrapper{height:100%;} .main_visual .swiper-slide{ height:100%;text-align:center;background:#fff; display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex; -webkit-box-pack:center;-ms-flex-pack:center; -webkit-justify-content:center;justify-content:center; -webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; } .main_visual .swiper-slide a{display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center 0;background-size:auto 100%;} .main_visual .swiper-slide a img{width:100%;height:auto} .main_visual .swiper-button-prev, .main_visual .swiper-button-next{display:none;width:29px;height:47px;margin-top:-26px;background-color:#fff;background-color:rgba(255,255,255,0.1);background-size:auto;border-radius:6px} .main_visual .swiper-button-prev{right:auto;left:50%;margin-left:-260px;background-image:url("//solidpop.co.kr/jeonyul/images/main/btn_visual_prev.gif")} .main_visual .swiper-button-next{left:auto;right:50%;margin-right:-260px;background-image:url("//solidpop.co.kr/jeonyul/images/main/btn_visual_next.gif")} .main_visual .swiper-pagination-bullets{bottom:20px !important;text-align:right;left:auto;right:20px;} .main_visual .swiper-pagination-bullet{width:10px;height:10px;background:#fff;opacity:1;border-radius:0;margin:0 1px;border-radius:5px} .main_visual .swiper-pagination-bullet-active{background:#aaa} .grid_top{width:100%;max-width:1523px;min-width:1200px;margin:0 auto 90px;overflow:hidden} .grid_top .main_big_banner{width:59.056%;float:left} .grid_top .main_right_banner{float:right;width:40.944%} .grid_top .main_right_banner .main_bnnList img{width:100%;height:auto} .grid_top .main_right_banner .main_bnnList div{padding-left:3.3%;background:#fff;opacity:1;transition:all 0.3s ease;-webkit-transition:all 0.3s ease;-khtml-transition:all 0.3s ease;-ms-transition:all 0.3s ease;-o-transition:all 0.3s ease} .grid_top .main_right_banner .main_bnnList div+div{padding-top:3.2%} .grid_top .main_right_banner .main_bnnList div:hover{opacity:0.7} #JD-MAIN .tit_common{margin:0 auto 5px!important} #JD-MAIN .tit_common span{position:relative;display:inline-block;zoom:1;*display:inline;font-size:16px;letter-spacing:2px;color:#000;line-height:28px;font-weight:400} .tit_text{margin:0 auto 60px;text-align:center;color:#999;line-height:1.7;letter-spacing:2px;font-size:12px} .sub_ban{max-width:1483px;margin:0 auto 100px;} .sub_ban:after{content:"";display:block;clear:both;} .sub_ban div{width:32.5%;max-width:481px;float:left;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease;background:#fff;opacity:1} .sub_ban div+div{padding-left:1.25%} .sub_ban div:hover{opacity:0.7} .sub_ban div img{width:100%} .main_tab_banner .over{display:none;position:absolute;left:0;top:0;width:100%;height:100%;} /* over 공통*/ .over{display:none;position:absolute;left:0;bottom:-100%;width:100%;background:rgba(0,0,0,0.85)} .over > ul{display:block;overflow:hidden} .over > ul > li{line-height:1.2} .over > ul > li > span{display:block} /* ------------- urban Type A1 --------------*/ /* Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess */ @font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 400; src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot); src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff2) format('woff2'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.woff) format('woff'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Regular.ttf) format('truetype'); } @font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 700; src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot); src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype'); } @font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 800; src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot); src: url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.eot?#iefix) format('embedded-opentype'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff2) format('woff2'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.woff) format('woff'), url(//fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-ExtraBold.ttf) format('truetype'); } @font-face { font-family : 'Lato-Regular'; src :url("//solidpop.co.kr/urban/font/Lato-Regular.eot"); src :url("//solidpop.co.kr/urban/font/Lato-Regular.eot?#iefix") format('embeded-opentype'), url("//solidpop.co.kr/urban/font/Lato-Regular.ttf") format("truetype"), url("//solidpop.co.kr/urban/font/Lato-Regular.woff") format('woff'); } @font-face {font-family: "MalgunGothic"; src: url("//solidpop.co.kr/urban/font/MalgunGothic.eot"); src: url("//solidpop.co.kr/urban/font/MalgunGothic.eot?#iefix") format("embedded-opentype"), url("//solidpop.co.kr/urban/font/MalgunGothic.ttf") format("truetype"); } @font-face {font-family: "tw-cen-mt"; src: url("//solidpop.co.kr/urban/font/tw-cen-mt.eot"); src: url("//solidpop.co.kr/urban/font/tw-cen-mt.eot?#iefix") format("embedded-opentype"), url("//solidpop.co.kr/urban/font/tw-cen-mt.woff2") format("woff2"), url("//solidpop.co.kr/urban/font/tw-cen-mt.woff") format("woff"), url("//solidpop.co.kr/urban/font/tw-cen-mt.ttf") format("truetype"), url("//solidpop.co.kr/urban/font/tw-cen-mt.svg#Tw Cen MT") format("svg"); } /* latin-ext */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 300; src: local('Lato Light'), local('Lato-Light'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh7USSwaPGR_p.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 300; src: local('Lato Light'), local('Lato-Light'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh7USSwiPGQ.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* latin-ext */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v14/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v14/S6uyw4BMUTPHjx4wXg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* latin-ext */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* latin-ext */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 900; src: local('Lato Black'), local('Lato-Black'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh50XSwaPGR_p.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 900; src: local('Lato Black'), local('Lato-Black'), url(https://fonts.gstatic.com/s/lato/v14/S6u9w4BMUTPHh50XSwiPGQ.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family : 'Lato'; src :url("//solidpop.co.kr/urban/font/Lato-Light.ttf") format("truetype"); } @font-face { font-family : 'Lato'; src :url("//solidpop.co.kr/urban/font/Lato-Bold.ttf") format("truetype"); } @font-face { font-family : 'Lato'; src :url("//solidpop.co.kr/urban/font/Lato-Black.ttf") format("truetype"); } @font-face { font-family : 'Lato'; src :url("//solidpop.co.kr/urban/font/Lato-Regular.ttf") format("truetype"); } /* urban.css - common style */ body#JD-MAIN, body#JD-COMMON{min-width:1100px} body#JD-MAIN #JD-Container{padding-top:70px} *{padding:0;margin:0;font-family:'Lato',NanumGothic, sans-serif;font-size:12px} textarea{resize:none} .contents{position:relative;width:100%;max-width:1522px;margin:0 auto;padding:70px 20px 50px;box-sizing:border-box;} .contents_detail{position:relative;width:1230px;margin:0 auto;padding-bottom:50px} .contents:after, .contents:before{content:"";display:block;clear:both;zoom:1;width:100%;height:0;font-size:0;line-height:0;overflow:hidden} #JD-COMMON .contents{padding-top:135px} .contents.wide{width:100%;max-width:100%;min-width:1240px} #JD-COMMON .contents.wide{padding-top:90px} #JD-COMMON .contents.lookbook_detail{width:100%;max-width:100%;min-width:1240px;padding:0} .path{display:none} .titleArea{margin:0 auto 90px;text-align:center} .titleArea h2{position:relative;display:inline-block;zoom:1;*display:inline;font-size:24px;letter-spacing:3px;color:#222;line-height:28px} .titleArea > p{width:100%;color:#888} .ec-base-box{border:1px solid #ccc;background:#fafafa} .titHeader{padding:0 0 30px} .tit_common{margin:0 auto 50px;text-align:center} .tit_common span{position:relative;display:inline-block;zoom:1;*display:inline;font-size:24px;letter-spacing:3px;color:#222;line-height:28px} .tit_common.sub span{font-size:30px;font-weight:600;color:#222} .relation .tit_common {margin-left:400px} .relation .tit_common span {position:relative;display:inline-block;zoom:1;*display:inline;min-width:420px;height:32px;font-size:14px;letter-spacing:3px;color:#222;line-height:28px;background:#fff;top:-15px;border-bottom:1px solid;} .iconBox{display:block;text-align:center;opacity:0;position:absolute;bottom:0;left:1px;width:100%;background:#ededed;padding:8px 0} .iconBox span{position:relative;display:inline-block;vertical-align:middle;margin-left:5px;cursor:pointer;padding:0 15px} .iconBox span:first-child{margin-left:0} .iconBox span.option{margin-right:20px} .list_common > li:hover .iconBox{opacity:1;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease} .list_normal{position:relative;max-width:1512px;margin:0 auto 30px} .list_normal.lookbook{width:1230px} .list_cate_sub{text-align:center;padding:5px 10px 0} .list_cate_sub li{display:inline-block;zoom:1;*display:inline;vertical-align:top;} .list_cate_sub li a{display:inline-block;zoom:1;*display:inline;padding:10px;color:#555;font-size:14px;position:relative} .list_cate_sub li a:before{content:"#";display:inline-block;margin:0 4px 0 0} .cate_list_top{margin-bottom:65px;} .cate_list_top .list_over{overflow:hidden;} .cate_list_top .list_over li{float:left} .cate_list_top .list_over li .inWrap{padding:0 5px;} .cate_list_top .list_over.list_type4 li{width:25%} .cate_list_top .list_over.list_type5 li{width:20%} .cate_list_top .list_over.list_type6 li{width:16.5%} .cate_list_top .thumb{position:relative;} .cate_list_top .thumb .img img{width:100%} .cate_list_top .over{display:none;position:absolute;left:0;top:0;width:100%;height:100%;background:#999;background:rgba(0,0,0,0.6);} .cate_list_top .list_over li:hover .over{display:block;} .cate_list_top .list_over li .over span{display:inline-block;zoom:1;*display:inline;} .cate_list_top .txtWrap{position:absolute;left:0;top:140px;width:86%;padding:0 7%;} .cate_list_top .txtWrap .name{margin-bottom:4px;width:100%;text-align:center;} .cate_list_top .txtWrap .opt{width:100%;text-align:center} .cate_list_top .txtWrap .opt_txt{width:100%;margin-bottom:10px;text-align:center;line-height:1.6} .cate_list_top .best_icon, .cate_list_top .new_icon{position:absolute;left:8px;top:8px;display:inline-block;zoom:1;*display:inline;background:#fff;font-size:10px;color:#333;padding:0 5px;} .prd_align{padding:15px 15px 50px} .prd_align:after{content:"";display:block;clear:both;zoom:1} .prd_align .prd_count{float:left;font-size:14px;color:#555;line-height:28px} .prd_align .prd_count strong{font-weight:600;color:#222} .prd_align .align_opt{float:right;overflow:hidden;} .prd_align .align_opt li{float:left;margin-left:10px} .prd_align .align_opt li a{font-size:11px;color:#999} .prd_align .align_opt .sort{color:#666} .list_paging{margin-bottom:80px !important;} .location{position:relative;padding-top:66px;} .location li a{font-size:11px;color:#999;} .common_tabWrap{margin-bottom:60px;} .common_tab{height:48px;border-bottom:1px solid #ddd} .common_tab:after{content:"";display:block;clear:both;zoom:1} .common_tab li{float:left} .common_tab li a{display:block;min-width:210px;height:48px;padding:0 20px;border:1px solid #ddd;background:#f5f5f5;font-size:14px;color:#555;line-height:49px;text-align:center;margin:-1px -1px 0 0} .common_tab li:first-child a{border-left-color:#ddd} .common_tab li.selected a{height:48px;border-top:2px solid #222;border-bottom:0;color:#222;font-weight:600;background:#fff;} .xans-mall-faq .common_tab{margin:0 0 20px} .xans-mall-faq .common_tab li a{min-width:134px} .btn_sbmWrap{padding:30px 0 50px;text-align:center} .btn_sbm{display:inline-block;zoom:1;*display:inline;width:180px;height:52px;background:#222;font-size:13px;color:#fff;line-height:52px;text-align:center;border:1px solid #222;} .btn_sbm.normal{background:#fff;color:#222;border-color:#ccc} .btn_sbm + .btn_sbm{margin-left:5px} .btn_small{display:inline-block;zoom:1;*display:inline;min-width:26px;height:16px;padding:0 8px;text-align:center;font-size:11px;line-height:16px;color:#666;background:#fff;border:1px solid #ddd;vertical-align:middle} .btn_small.gray{background:#444;border-color:#444;color:#fff} .btn_small.black{background:#222;border-color:#222;color:#fff} .btn_small + .btn_small{margin-left:5px} .btn_normal{display:inline-block;zoom:1;*display:inline;min-width:74px;height:22px;padding:0 5px;text-align:center;background-color:#fff;border:1px solid #ddd;font-size:11px;line-height:22px;color:#777;} .btn_normal.black{background-color:#111;border-color:#111;color:#fff} .btn_normal.gray{background-color:#444;border-color:#444;color:#fff} .btn_normal.gray2{background-color:#666;border-color:#666;color:#fff} .btn_normal.big{min-width:104px;height:34px;line-height:34px} .btn_normal + .btn_normal{margin-top:4px} .gLeft .btn_normal + .btn_normal, .gRight .btn_normal + .btn_normal, .justify .btn_normal + .btn_normal{margin-top:0} .prd_main .thumb{display:block;position:relative;} .prd_main .thumb img.on{position:absolute;left:0;top:0;opacity:0} .xans-product-additional div.board p.nodata {color:#555} /* header.css */ #JD-Header{position:fixed;left:0;top:0;width:100%;padding:0;z-index:10;box-sizing:border-box;background:#fff;} #JD-COMMON .multishopList{display:none} #JD-COMMON #JD-Header{border-bottom:1px solid #f2f2f2} a:hover{text-decoration:none !important} .headerWrap{position:relative;min-width:980px;max-width:1523px;margin:0 auto} .headerTop{width:100%;position:relative;width:100%;height:82px;margin:0 auto;padding:0 124px 0 10px;box-sizing:border-box;} .headerTop a:hover{text-decoration:none} .headerWrap .multishopList{display:inline-block;vertical-align:top;line-height:0;margin:0 0 0 10px} .headerWrap .multishopList .thumb ul li{display:inline-block;} .headerWrap .multishopList .thumb ul li a{display:block;} .headerTop .menu_mem{text-align:left;display:inline-block} .headerTop .menu_mem:after{content:"";display:block;zoom:1;clear:both;height:0;font-size:0;line-height:0} .headerTop .menu_mem > li{display:inline-block;zoom:1;*display:inline;vertical-align:middle} .headerTop .menu_mem > li > a{position:relative;display:inline-block;min-height:82px;line-height:82px;padding:0 6px 2px;box-sizing:border-box;text-align:center;vertical-align:middle} .headerTop .menu_mem > li > a i{font-size:22px;margin-top:2px} .headerTop .menu_mem > li .sub {display:none;position:absolute;left:0;top:54px;border:1px solid #777;background:#fff;padding:10px 0} .headerTop .menu_mem > li:hover .sub{display:block} .headerTop .menu_mem > li .sub li a{display:block;height:26px;line-height:26px;white-space:nowrap;padding:0 15px 0 10px} .headerTop .menu_mem > li .sub li a span{position:relative;display:inline-block;font-size:11px;color:#333;letter-spacing:1px} .headerTop .menu_mem > li .sub li a:hover span:after{content:"";position:absolute;display:block;left:0;bottom:5px;width:100%;height:1px;background:#333;} .headerTop .menu_mem > li.btn_search a:after{display:none} .headerTop .menu_mem > li > a > span{display:inline-block;position:relative;font-size:11px;color:#333;letter-spacing:1px;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease} .headerTop .menu_mem > li > a > span #xans_myshop_basket_cnt{background:#555;padding:1px 4px 2px;border-radius:3px;color:#fff} .headerTop .menu_mem .count{position:absolute;right:3px;top:0;display:inline-block;min-width:13px;height:13px;line-height:13px;padding:0 1px;box-sizing:border-box;text-align:center;font-size:10px;color:#fff;background:#000;border-radius:8px;} .headerTop .menu_mem .count span{font-size:10px;font-weight:normal} .headerTop .section_right{position:absolute;right:0;top:50%;margin-top:-13px} .headerTop .section_right .member{float:left} .btnAttend{float:left;display:inline-block;width:100px;overflow:hidden} .btnAttend > a{margin-top:-10px} .headerTop .logo{float:left;height:100%;box-sizing:border-box;padding:24px 0 0 0} .headerTop .logo a > span{display:none;letter-spacing:1px;font-weight:600;font-size:24px;color:#000} .headerTop .logo a img{max-height:35px} .headerTop .gnb{white-space:nowrap;margin:0;text-align:center} .headerTop .gnb > li{position:relative;display:inline-block;height:82px} .headerTop .gnb > li > a{display:block;height:82px;line-height:82px;font-size:11px;color:#333;padding:0 20px;letter-spacing:1px} .headerTop .gnb > li > div{display:none;position:absolute;left:50%;top:82px;min-width:140px;background:rgba(0,0,0,0.6);padding:0;margin:0 0 0 -70px;border-top:2px solid #000} .headerTop .gnb > li:hover > div{display:block} .headerTop .gnb > li > div:after{content:"";display:block;position:absolute;top:-7px;left:50%;margin-left:-7px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000} .headerTop .gnb > li > div > ul > li{position:relative;padding:0;} .headerTop .gnb > li > div > ul > li > a{display:block;height:36px;line-height:36px;font-size:11px;color:#fff;padding:0 16px;box-sizing:border-box} .headerTop .gnb > li > div > ul > li:hover > a{background:rgba(0,0,0,0.5)} .headerTop .gnb > li > div > ul > li > div{position:absolute;left:100%;top:0;width:auto;border:0;background:rgba(0,0,0,0.55)} .headerTop .gnb > li > div > ul > li > div > ul > li{border:0;padding:0} .headerTop .gnb > li > div > ul > li > div > ul > li > a{display:block;border:0;padding:0 16px;height:36px;line-height:36px;font-size:11px;color:#fff} .headerTop .gnb > li > div > ul > li > div > ul > li > a:hover{background:rgba(0,0,0,0.5)} .headerTop .gnb > li.community li div{display:none} .search_section{display:none;position:fixed;width:100%;height:100%;top:0;left:0;z-index:99} .search_bg{position:fixed;background:rgba(0,0,0,0.64);width:100%;height:100%;top:0;left:0;} .searchWrap{position:absolute;width:784px;right:50%;top:30%;margin-right:-392px} .searchWrap .txt{text-align:center;margin:40px 0;font-size:28px;letter-spacing:3px;color:#fff;font-weight:600} .search_section fieldset{width:100%;margin:0 auto;position:relative} .search_section form{display:inline-block;zoom:1;*display:inline;margin-right:-6px;vertical-align:middle;float:left} .search_section .inputTypeText{height:55px;border:0;margin-right:7px;padding:0;width:100%;font-size:18px;font-weight:600;text-align:center;border:3px solid #222} .search_section .btn_mask_seach{width:55px;height:55px;background:#222;position:absolute;right:-3px;top:3px} .search_section .icon_search{position:absolute;right:16px;top:15px} .searchWrap .popular{text-align:center;color:#fff;margin-top:20px} .searchWrap .popular span{font-size:18px;color:#fff;vertical-align:middle} .searchWrap .popular p{margin:20px 0;text-align:center} .searchWrap .popular a{display:inline-block;height:22px;line-height:22px;font-size:18px;color:#fff;margin:0 12px 0 0;position:relative;padding:0 0 0 12px;vertical-align:middle} .searchWrap .popular a + a:after{content:"";display:inline-block;height:10px;width:1px;background:#fff;top:5px;left:0;position:absolute} .xans-layout-multishoplist.list { float:left; position:relative; z-index:10; height:41px; margin:0 0 0 6px; } .xans-layout-multishoplist.list .toggle { display:block; height:41px; padding:0 0 0 10px; color:#757575; line-height:42px; font-size:12px; background:url("//img.echosting.cafe24.com/skin/base/common/ico_bar.gif") no-repeat 0 17px; } .xans-layout-multishoplist.list .toggle span { padding:0 20px 0 2px; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_multishop1.png") no-repeat 100% 4px; } .xans-layout-multishoplist.list .toggle span > img { vertical-align:middle;margin:-1px 2px 0 0} .xans-layout-multishoplist.list > ul { display:none; position:absolute; left:0; top:40px; overflow:auto; width:248px;border:1px solid #d5d5d5; background:#fff; } .xans-layout-multishoplist.list > ul li { position:relative;display:block; height:39px; margin:-1px 0 0; border-top:1px solid #d5d5d5; line-height:39px; } .xans-layout-multishoplist.list > ul li a { display:block; overflow:hidden; padding:0 62px 0 48px; color:#353535; white-space:nowrap; text-decoration:none; text-overflow:ellipsis; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_multishop2.png") no-repeat 100% -24px; } .xans-layout-multishoplist.list > ul li.selected a { background:#f3f3f3 url("//img.echosting.cafe24.com/skin/base/layout/ico_multishop2.png") no-repeat 100% 16px; } .xans-layout-multishoplist.list > ul li a img { position:absolute; left:10px; top:9px; } .xans-layout-multishoplist.list > ul li a .name{display:inline;background:none} .xans-layout-multishoplist.list > ul li a .name strong { font-weight:normal; } .xans-layout-multishoplist.list > ul li a .unit {display:inline; position:absolute;width:auto; left:auto;right:38px;line-height:40px; top:0; font-size:11px; color:#757575; background:none} .xans-layout-multishoplist.list.show > ul { display:block; } .xans-layout-multishoplist.thumb {float:left;margin:8px 0 0 20px} .xans-layout-multishoplist.thumb > ul { overflow:hidden; } .xans-layout-multishoplist.thumb > ul li { float:left; width:32px; margin:0 4px 0 0; } .xans-layout-multishoplist.thumb > ul li a { text-decoration:none; } .xans-layout-multishoplist .multiOption a { display:inline-block; height:24px; line-height:24px; color:#666; } .xans-layout-multishoplist .multiOption a:hover { text-decoration:none; } .xans-layout-multishoplist .multiOption .ship, .xans-layout-multishoplist .multiOption .language { margin:0 15px 0 0; } .xans-layout-multishoplist .multiOption .language img { margin:0 6px 0 1px; } /* footer */ #foot{padding:40px 0;border-top:1px solid #ddd} #foot .footer{max-width:1482px;margin:0 auto;font-size:11px;letter-spacing:0.5} .footer .foot_menu li{display:inline-block;position:relative} .footer .foot_menu li+li{padding-left:15px} .footer .foot_menu li:after{content:' \002F';position:absolute;right:-11px;color:#555} .footer .foot_menu li:last-child:after{display:none} .footer .foot_menu li a{color:#555;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease} .footer .foot_menu li a:hover{color:#999} .footWrap{overflow:hidden;padding-top:30px;color:#555;line-height:2} .footWrap div{float:left} .footWrap .customer{width:25%} .footWrap .customer h3{color:#222;font-size:14px} .footWrap .company{width:45%} .footWrap .sns_menu{width:30%} .footWrap .sns_menu ul{text-align:right} .footWrap .sns_menu ul li{display:inline-block} .footWrap .sns_menu ul li > a{width:48px;height:48px;border-radius:100%;background:#ccc;display:block;text-align:center;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease} .footWrap .sns_menu ul li > a > i{font-size:18px;line-height:48px;color:#fff} .footWrap .sns_menu ul li > a:hover{background:#aaa} .footWrap .sns_menu p{margin-top:10px;text-align:right} .btn_sns{display:none;position:fixed;bottom:88px;right:33px;z-index:100} .btn_sns li + li{margin-top:4px} .btn_sns li a{display:block} .btn_sns li a img{opacity:0.9} /* reset */ li { list-style:none; } table { width:100%; border:0; border-spacing:0; border-collapse:collapse; } caption { display:none; } h1, h3 { margin:0; } /* common */ .ec-base-layer { position:absolute; z-index:100; border:1px solid #757575; background:#fff; } .ec-base-layer .header { padding:7px 35px 7px 19px; color:#fff; background:#495164; } .ec-base-layer .header > h1, .ec-base-layer .header > h3 { font-size:14px; line-height:1.5; } .ec-base-layer .content { padding:20px; font-size:12px; } .ec-base-layer div.ec-base-help { margin-top:0; } .ec-base-layer .ec-base-button { padding:9px; border-top:1px solid #d7d5d5; text-align:center; background:#fbfafa; } .ec-base-layer .close { position:absolute; right:0; top:0; padding:11px 20px; cursor:pointer; } /* popup */ #popup .ec-base-layer { position:relative; border:0; } #popup .ec-base-layer .header { padding:12px 35px 12px 19px; } #popup .ec-base-layer .close { top:5px; } /* ec-base-table */ .ec-base-layer .content > .ec-base-table table:first-child { margin-top:0; } .ec-base-layer .ec-base-table table { line-height:1.4; } .ec-base-layer .ec-base-table thead th { padding:9px 0 8px; } .ec-base-layer .ec-base-table tbody th { padding:9px 0 8px 10px; } .ec-base-layer .ec-base-table td { padding:9px 10px 8px; } /* 가로형 - 쓰기타입 */ .ec-base-layer .ec-base-table.typeWrite td { padding:5px 10px 4px; } /* 세로형 - 목록타입 */ .ec-base-layer .ec-base-table.typeList tfoot td { padding:10px 10px 12px; } /* 테두리 타입 */ .ec-base-layer .ec-base-table.typeBorder tfoot td { padding:10px 10px 12px; } .xans-layout-multishopshipping { display:none; } .xans-layout-multishopshipping .worldshipLayer { top:303px; left:50%; width:448px; margin:0 0 0 -225px; } .xans-layout-multishopshipping .worldshipLayer .content { padding:153px 20px 30px; line-height:1.8; background:url("//img.echosting.cafe24.com/skin/base/link/bg_worldship.gif") center 21px no-repeat; } .xans-layout-multishopshipping .worldshipLayer .content .desc { display:block; margin:4px 0 14px; } .xans-layout-multishopshipping .worldshipLayer .select { margin:10px 0 0; } .xans-layout-multishopshipping .worldshipLayer .select select { width:100%; } .xans-layout-conversionpc { background:#fff; padding:45px; text-align:center; } .xans-layout-conversionpc a { margin:20px; padding:20px 40px 20px 110px; font-size:68px; color:#63666e; text-decoration:none; text-align:center; border:4px solid #9d9db0; border-radius:10px; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_mobile.png") no-repeat 40px 50%; } @charset "utf-8"; /* **************************** //필수 CSS 수정 및 삭제 불가 **************************** */ /* tag reset */ html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,img { margin:0; padding:0; } html { width:100%; height:100%; } body,code { font:0.75em Verdana,Dotum,AppleGothic,sans-serif; color:#353535; background:#fff; } body { min-width:1480px; } body#popup { min-width:0; } li { list-style:none; } img,fieldset { border:none; vertical-align:top; } table { width:100%; border:0; border-spacing:0; border-collapse:collapse; } caption { display:none; } th,td { border:0; vertical-align:top; } input,select,textarea { font-size:100%; font-family:"돋움", Dotum; color:#353535; vertical-align:middle; } input[type=radio], input[type=checkbox] { width:13px; height:13px; border:0; } input[type=text], input[type=password] { height:18px; line-height:20px; padding:2px 4px; border:1px solid #d5d5d5; color:#353535; font-size:12px; } input[type=radio] + label, input[type=checkbox] + label { margin:0 4px 0 2px; } select { height:24px; border:1px solid #d5d5d5; } textarea { padding:5px 6px; border:1px solid #d5d5d5; line-height:1.5; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color:#c1c1c1; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#c1c1c1; } input::-moz-placeholder, textarea::-moz-placeholder { color:#c1c1c1; opacity:1; } legend { visibility:hidden; position:absolute; left:-9999px; top:-9999px; width:0; height:0; line-height:0; } button { overflow:visible; padding:0; margin:0; border:0; cursor:pointer; } hr.layout { display:none; } a { text-decoration:none; color:#000; } a:hover { text-decoration:none; } a:active { text-decoration:none; } .objHidden { visibility:hidden; position:absolute; left:-1000px; top:-1000px; height:0; width:0; } table tr.radioType input, span.noBorder input { border:none !important; width:auto !important; height:auto !important; margin:0 3px 0 0 !important; vertical-align:middle !important; background:none !important; } #content_CONTAINER table, #bi_inquire_content_CONTAINER table { border:0; margin:0 0 -1px; } #content_CONTAINER table:before, #bi_inquire_content_CONTAINER table:before { display:none; } #content_CONTAINER td, #bi_inquire_content_CONTAINER td { width:auto !important; padding:0; } table.nneditor-table { width:auto !important; } .gLabel { display:inline-block; } .gLabel label { margin-right:20px; line-height:22px; } .fWidthFull input[type=text] { width:100%; height:24px; -webkit-box-sizing:border-box; -moz-webkit-box:border-box; box-sizing:border-box; } .fWidthFull textarea { width:100%; -webkit-box-sizing:border-box; -moz-webkit-box:border-box; box-sizing:border-box; } .fList.typeHor .gLabel { margin-right:20px; } .fList.typeVer .gLabel { display:block; } /* 결제진행바 */ #progressPaybarBackground { position:absolute; z-index:99; left:0; top:0; width:100%; height:100%; } #progressPaybarView { position:absolute; z-index:100; top:160px; left:20px; width:471px; font-size:12px; } #progressPaybarView .box { height:180px; background:url(//img.cafe24.com/images/ec_hosting/popup/layer_guide/bg_layer_box1.gif) 0 0 no-repeat; } #progressPaybarView .box .graph { padding:15px 0 0 0; text-align:center;} #progressPaybarView .box .graph span { display:block; text-align:center; margin:20px 0; } #progressPaybarView .box .txt { text-align:center; padding:15px 0 0; color:#555555; } div.layerProgress { filter:alpha(opacity=40); opacity:0.4; -moz-opacity:0.4; background-color:#999; } /* contents */ #skipNavigation {position:absolute; top:0; left:0; z-index:100; width:100%; height:0;} #skipNavigation p, #skipNavigation ul, #skipNavigation ul li {height:0;} #skipNavigation p a {position:absolute; left:0; top:0; display:block; overflow:hidden; width:1px; height:1px; margin-left:-1px; margin-bottom:-1px; text-align:center; color:#000; white-space:nowrap;} #skipNavigation p a:focus, #skipNavigation p a:hover, #skipNavigation p a:active {width:100%; height:auto; padding:10px 0; background:#c4122f; color:#fff; z-index:100;} .displaynone { display:none; } .dimmed { position:fixed; top:0; left:0; z-index:99; width:100%; height:100%; background:#fff; opacity:0.8; filter:alpha(opacity=80); } /* **************************** 필수 CSS 수정 및 삭제 불가 **************************** */ @charset "utf-8"; /* Layout */ #header { background:url("//img.echosting.cafe24.com/skin/base/layout/bg_body.gif") repeat-x 0 0; } #header .inner { position:relative; width:1218px; margin:0 auto; *zoom:1; } #header .inner:after { content:""; display:block; clear:both; } #header .topArea { height:112px; padding:83px 0 0; text-align:center; *zoom:1; } #header .topArea:after { content:""; display:block; clear:both; } #header .special { float:left; border-left:1px solid #d8d8d8; } #header .special li { float:left; } #header .special a { display:block; height:20px; padding:16px 15px 9px; border-right:1px solid #d8d8d8; color:#353535; text-decoration:none; } #header .special a:hover { color:#008bcc; padding-bottom:7px; border-bottom:2px solid #008bcc; } #header .link { position:absolute; left:0; top:0; height:35px; line-height:35px; } #header .link > a, #header .link > span { float:left; } #header .link > a { margin:0 9px 0 0; padding:0 10px 0 0; color:#666; text-decoration:none; background:url("//img.echosting.cafe24.com/skin/base/common/ico_bar.gif") no-repeat 100% 12px; } #header .link > span img { vertical-align:middle; } #header .link .xans-layout-bookmark span { padding-left:17px; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_bookmark.png") no-repeat 0 1px; } #wrap { position:relative; width:1460px; margin:27px auto 0; } #container { width:1218px; margin:0 auto; *zoom:1; } #container:after { content:""; display:block; clear:both; } #sidebar { float:left; width:180px; } #sidebar .banner { padding:0 0 20px; border-bottom:1px solid #e8e8e8; } #sidebar .banner p a { display:block; } #contents { float:right; width:1014px; } #contents .visual img { max-width:100%; } #banner { position:absolute; top:0; left:0; width:90px; } #quick { position:absolute; top:0; right:0; width:90px; } #quick .banner a { display:block; margin:15px 0 0; } #footer { background:url("//img.echosting.cafe24.com/skin/base/layout/bg_footer.gif") repeat-x 0 100%; } #footer .inner { overflow:hidden; position:relative; width:1218px; margin:40px auto 0; *zoom:1; } /* Main */ #boardArea { overflow:hidden; margin:50px 0 0; border-top:1px solid #d8d8d8; } #bannerArea { margin:22px 0 0; } #bannerArea h2 { margin:0 0 16px; font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; } /* 탐색경로바 */ .path { overflow:hidden; height:30px; line-height:30px; *zoom:1; } .path span { overflow:hidden; position:absolute; width:0; height:0; white-space:nowrap; text-indent:100%; } .path ol { float:right; } .path li { float:left; padding:0 0 0 12px; margin:0 0 0 8px; color:#757575; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_path.gif") no-repeat 0 10px; } .path li:first-child { background:none; } .path li a { color:#757575; } .path li strong, .path li strong a { color:#2e2e2e; } /* 타이틀 */ /* .titleArea { min-height:30px; margin:10px 0 20px; border-bottom:1px solid #e8e8e8; } .titleArea h2 { display:inline-block; padding:0 0 0 12px; color:#2e2e2e; font-size:16px; *display:inline; *zoom:1; background:url("//img.echosting.cafe24.com/skin/base/layout/ico_heading.gif") 0 50% no-repeat; } .titleArea p { display:inline-block;color:#939393;} */ .titleArea ul { padding:5px 0; color:#939393; line-height:18px; } .titleArea ul li { padding:0 0 0 9px; background:url("//img.echosting.cafe24.com/skin/base/common/ico_square2.gif") no-repeat 4px 7px; } /* 게시판 메인 */ .boardMain { overflow:hidden; *zoom:1; } .boardMain td img { vertical-align:middle; margin:1px; } .boardMain .board { position:relative; margin:0 0 65px; } .boardMain .leftArea { float:left; width:50%; } .boardMain .leftArea .board { margin:0 23px 65px 0; } .boardMain .rightArea { float:right; width:50%; } .boardMain .rightArea .board { margin:0 0 65px 23px; } .boardMain .board h3 { margin:0 0 13px; height:28px; font-size:16px; color:#2e2e2e; border-bottom:2px solid #626672; } .boardMain .board .more { position:absolute; top:0; right:0; padding:2px; } .boardMain .board .ec-base-table.typeList td { color:#a4a4a4; } .boardMain .board .ec-base-table.typeList td.title a, .boardMain .board .ec-base-table.typeList td.title a:hover { color:#4f4f4f; } .boardMain .board .galleryList { overflow:hidden; } .boardMain .board .galleryList ul { overflow:hidden; margin:0 -10px; } .boardMain .board .galleryList li { float:left; position:relative; width:20%; padding:0 0 12px 0; word-break:break-all; } .boardMain .board .galleryList li span { display:block; margin:0 10px; font-size:11px; color:#a4a4a4; } .boardMain .board .galleryList li .imgLink, .boardMain .board .galleryList li .imgLink:hover { display:block; margin:0 10px 5px; font-size:12px; } .boardMain .board .galleryList li .imgLink img { width:100%; max-height:110px; border:1px solid #ededed; } /* 퀵뷰 모달 */ #modalBackpanel { display:none; position:absolute; top:0; left:0; z-index:10000; width:100%; height:100%; background:#000; } #modalContainer { display:none; position:absolute; top:100px; left:100px; z-index:10001; width:975px; height:720px; border:1px solid #333; background:#fff; } #modalContainer #modalContent { width:100%; height:100%; } /* Font */ .txtInfo { color:#707070; } .txtWarn { color:#f76560; } .txtEm { color:#008bcc; } .txtDel, .strike, .discount { text-decoration:line-through; font-weight:normal; } .strike strong, .discount strong { font-weight:normal; } .txtNormal { font-weight:normal; font-style:normal; } .txtNum { font-size:11px; color:#939393; } .txt11 { font-size:11px; } .txt12 { font-size:12px; } .txt14 { font-size:14px; } .txt16 { font-size:16px; } .txt18 { font-size:18px; letter-spacing:-1px; } .txtIcon { font-size:12px; font-style:normal; } .txtBreak { word-break:break-all; word-wrap:break-word; } /* JP, TW, CN */ html:lang(ja) .txt11, html:lang(zh) .txt11, html:lang(zh-tw) .txt11 { font-size:12px; } /* grid */ .gBlank5 { display:block; margin-top:5px; } .gBlank10 { display:block; margin-top:10px; } .gBlank20 { display:block; margin-top:20px; } .gBlank30 { display:block; margin-top:30px; } .gIndent10 { margin-left:10px; } .gIndent20 { margin-left:20px; } .gSpace10 { margin-right:10px; } .gSpace20 { margin-right:20px; } .gMerge { position:relative; z-index:1; margin-top:-1px; } /* ec-base-qty */ .ec-base-qty { position:relative; display:inline-block; width:50px; margin:0 1px 0 0; text-align:left; } .ec-base-qty input[type="text"] { width:22px; height:23px; padding:0 0 0 5px; line-height:25px; border:1px solid #d4d8d9; border-radius:3px 0 0 3px; } .ec-base-qty .up { position:absolute; left:27px; top:0; } .ec-base-qty .down { position:absolute; left:27px; bottom:0; } /* ec-base-chk */ .ec-base-chk { display:inline-block; position:relative; margin:0 8px 0 0; width:22px; height:22px; vertical-align:top; cursor:pointer; } .ec-base-chk input { z-index:1; position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer; } .ec-base-chk .checkbox { position:absolute; top:0; left:0; width:100%; height:100%; background:url("//img.echosting.cafe24.com/skin/base/common/bg_join_check.png") no-repeat 0 0; } .ec-base-chk input:checked + .checkbox { background-position:-34px 0; } /* 공통 css */ .ec-base-tooltip { display:none; z-index:2; position:absolute; top:24px; padding:15px; border:1px solid #565960; background:#fff; -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); -moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); } .ec-base-tooltip h3 { margin:0 0 8px; padding:0 10px; font-size:12px; border-bottom:0; background:url("//img.echosting.cafe24.com/skin/base/common/ico_layer_title.gif") no-repeat 0 50%; } .ec-base-tooltip h3 + p { margin:0 5px 10px; } .ec-base-tooltip h4 { margin:15px 10px 8px 5px; font-size:12px; } .ec-base-tooltip h4:before { display:inline-block; content:""; margin:0 5px 0 0; width:3px; height:3px; background:#666; vertical-align:middle; } .ec-base-tooltip .btnClose { position:absolute; right:14px; top:14px; } .ec-base-tooltip .edge { z-index:20; position:absolute; left:50%; top:-6px; display:block; margin:0 0 0 -5px; width:10px; height:6px; } .ec-base-tooltip .edge:before, .ec-base-tooltip .edge:after { display:inline-block; content:""; position:absolute; top:0; width:0; height:0; border:solid transparent; } .ec-base-tooltip .edge:before { margin:1px 0 0; border-bottom-color:#565960; border-width:0 5px 5px 5px; } .ec-base-tooltip .edge:after { left:1px; margin:2px 0 0; border-bottom-color:#fff; border-width:0 4px 4px 4px; } .ec-base-tooltip table th, .ec-base-tooltip table td { padding:8px 10px 7px 10px; border:1px solid #e8e8e8; line-height:1.5em; } .ec-base-tooltip table th { padding-right:0; background:#fbf9fa; } .ec-base-tooltip table thead th { text-align:center; } .ec-base-tooltip table tbody th { text-align:left; } .ec-base-tooltip table .left { text-align:left; } .ec-base-tooltip table .center { text-align:center; } .ec-base-tooltip table .right { text-align:right; } .ec-base-tooltip table .info { padding:0; color:#757575; } .ec-base-tooltip table p.info:before, .ec-base-tooltip table ul.info li:before { display:inline-block; content:""; margin:0 3px 0 0; width:4px; height:1px; background:#757575; vertical-align:middle; } .ec-base-tooltip .info { padding:10px 10px 0; margin:5px 0 0; } .ec-base-tooltip p.bullet, .ec-base-tooltip ul.bullet { margin:8px 10px; } .ec-base-tooltip p.bullet:before, .ec-base-tooltip ul.bullet li:before { display:inline-block; content:""; margin:-3px 3px 0 0; width:0; height:0; border:solid transparent; border-left-color:#333; border-width:2px 0 2px 2px; vertical-align:middle; } .ec-base-tooltip ul.bullet li { line-height:1.5em; } .ec-base-tooltip .txtEm { color:#008bcc; } .ec-base-tooltip .txtWarn { color:#f65b54; } /* typeUpper */ .ec-base-tooltip.typeUpper { top:auto; bottom:34px; } .ec-base-tooltip.typeUpper .edge { top:auto; bottom:-6px; } .ec-base-tooltip.typeUpper .edge:before { margin:0 0 -5px; border-top-color:#565960; border-width:5px 5px 0 5px; } .ec-base-tooltip.typeUpper .edge:after { left:1px; margin:0 0 -4px; border-top-color:#fff; border-width:4px 4px 0 4px; } /* 빨간느낌표 */ span.ec-base-help, p.ec-base-help, ul.ec-base-help li { margin:2px 9px; padding:1px 0 1px 20px; line-height:1.4; background:url('//img.echosting.cafe24.com/skin/base/common/ico_info.gif') no-repeat 0 2px; } /* 블록 공통 */ div.ec-base-help { margin:20px 0; border:1px solid #d6d4d4; line-height:18px; } div.ec-base-help > h2, div.ec-base-help > h3 { padding:9px 0 6px 10px; border-bottom:1px solid #e8e7e7; color:#101010; font-size:12px; background:#fbfbfb; } div.ec-base-help .inner { padding:0 9px 12px; } div.ec-base-help h4 { margin:22px 0 -4px; color:#404040; font-size:12px; font-weight:normal; } div.ec-base-help h4:first-child { margin-top:13px; } div.ec-base-help p { margin:15px 0 0 10px; color:#707070; } div.ec-base-help ul, div.ec-base-help ol { margin:15px 0 0 11px; } div.ec-base-help li { color:#707070; } /* 숫자형 */ div.ec-base-help ol li { padding:0 0 0 25px; background:url('//img.echosting.cafe24.com/skin/base/common/ico_number.png') no-repeat; } div.ec-base-help ol .item1 { background-position:-484px 0; } div.ec-base-help ol .item2 { background-position:-434px -100px; } div.ec-base-help ol .item3 { background-position:-384px -200px; } div.ec-base-help ol .item4 { background-position:-334px -300px; } div.ec-base-help ol .item5 { background-position:-284px -400px; } div.ec-base-help ol .item6 { background-position:-234px -500px; } div.ec-base-help ol .item7 { background-position:-184px -600px; } div.ec-base-help ol .item8 { background-position:-134px -700px; } div.ec-base-help ol .item9 { background-position:-84px -800px; } div.ec-base-help ol .item10 { background-position:-34px -900px; } /* 대쉬형 */ div.ec-base-help ul li { padding:0 0 0 11px; background:url('//img.echosting.cafe24.com/skin/base/common/ico_dash.gif') no-repeat 0 7px; } /* urban css */ div.ec-base-help > h2, div.ec-base-help > h3{padding:14px 0 12px 14px;background:#fff;font-size:13px} div.ec-base-help h4:first-child, div.ec-base-help h4{margin:15px 10px -4px} div.ec-base-help .inner{padding:0 9px 20px} /* 공통 */ .ec-base-product { margin:22px 0 0; } .ec-base-product .title { margin:0 0 17px; } .ec-base-product .title h2 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; } .ec-base-product .title h3 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; } .ec-base-product img { vertical-align:middle; } .ec-base-product a[href^='/product/detail.html'] > img { border:1px solid #ececec; } .ec-base-product .prdList { display:table; width:100%; min-width:756px; margin:-20px 0 0; font-size:0; line-height:0; } .ec-base-product .prdList > li { position:relative; display:inline-block; margin:30px 0 20px; color:#757575; vertical-align:top; } .ec-base-product .prdList .chk { position:absolute; top:-10px; left:0; right:0; display:block; margin:0 0 10px; } .ec-base-product .prdList .thumbnail { position:relative; margin:10px 7px; text-align:center; } .ec-base-product .prdList .thumbnail .prdImg { position:relative; } .ec-base-product .prdList .thumbnail a img { max-width:100%; box-sizing:border-box; } .ec-base-product .prdList .thumbnail .wish { position:absolute; right:3px; bottom:4px; z-index:1; cursor:pointer; } .ec-base-product .prdList .thumbnail .prdIcon { position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; } .ec-base-product .prdList .thumbnail .icon { margin:10px 0 0; border-bottom:1px solid #e8e8e8; vertical-align:middle; } .ec-base-product .prdList .thumbnail .icon:after { content:""; display:block; clear:both; } .ec-base-product .prdList .thumbnail .promotion { float:left; margin:0 0 4px; text-align:left; } .ec-base-product .prdList .thumbnail .promotion img { margin:0 4px 0 0; } .ec-base-product .prdList .thumbnail .button { float:right; margin:0 0 4px; } .ec-base-product .prdList .thumbnail .button img { cursor:pointer; } .ec-base-product .prdList .thumbnail .button .option { display:inline; position:relative; } .ec-base-product .prdList .thumbnail .button .likeButton { display:inline-block; margin:0 5px; } .ec-base-product .prdList .thumbnail .button .likeButton button { font-family:verdana; color:#9a9a9a; letter-spacing:-1px; background:none; } .ec-base-product .prdList .thumbnail .button .likeButton button img { margin-bottom:0; vertical-align:middle; } .ec-base-product .prdList .thumbnail .button .likeButton button strong {height:16px; vertical-align:middle; } .ec-base-product .prdList .thumbnail .button .likeButton.selected button { color:#353535; } .ec-base-product .prdList .description { margin:0 auto; padding:0 7px; font-size:12px; line-height:18px; text-align:center; } .ec-base-product .prdList .description .name { display:block; text-align:left font-weight:normal; } .ec-base-product .prdList .description .name a { color:#2e2e2e; } .ec-base-product .prdList .description .mileage { display:block; } .ec-base-product .prdList .description span.grid { display:block; } /* 진열방식 */ .ec-base-product ul.grid2 > li { width:50%; } .ec-base-product ul.grid3 > li { width:33.33%; } .ec-base-product ul.grid4 > li { width:25%; } .ec-base-product ul.grid5 > li { width:20%; } .ec-base-product ul.grid3 > li .color { max-width:230px; } .ec-base-product ul.grid4 > li .color { max-width:190px; } .ec-base-product ul.grid5 > li .color { max-width:130px; } /* 우측진열 */ .ec-base-product ul.grid2 li:after { content:""; display:block; clear:both; } .ec-base-product ul.grid2 li .thumbnail { float:left; width:220px; text-align:left; margin:0; } .ec-base-product ul.grid2 li .description { float:left; width:247px; padding:0 20px; } .ec-base-product ul.grid2 li .description .chk { position:static; text-align:left; } /* module="product_ListItem" */ .ec-base-product .spec { margin:0; } .ec-base-product .spec li { text-align:left; } .ec-base-product .spec li .title { font-weight:normal; vertical-align:top; } .ec-base-product .spec li .title span { vertical-align:top; } .ec-base-product .spec li .color { overflow:hidden; display:inline-block; margin:3px 0 0 0; } .ec-base-product .spec li .chips { float:left; width:10px; height:10px; margin:0 2px 2px 0; border:1px solid #e3e3e3; font-size:0; line-height:0; } /* 할인기간 레이어 */ .ec-base-product .discountPeriod { display:inline-block; z-index:10; position:relative; width:55px; height:19px; vertical-align:middle; } .ec-base-product .layerDiscountPeriod { left:50%; top:26px; width:247px; margin:0 0 0 -124px; } .ec-base-product .layerDiscountPeriod strong.title { display:block; margin:0 0 12px; padding:0 35px 0 0; font-weight:bold; color:#2e2e2e; } .ec-base-product .layerDiscountPeriod .content p { margin:2px 0 0; font-size:11px; line-height:16px; color:#757575; letter-spacing:-1px; } .ec-base-product .layerDiscountPeriod .content p strong { font-weight:normal; font-size:12px; color:#2e2e2e; } .ec-base-product .layerDiscountPeriod .content p strong span { font-size:11px; } /* 배송비레이어 */ .ec-base-product .prdList .shippingFee { position:relative; display:inline-block; } .ec-base-product .prdList .shippingFee .button { display:inline-block; float:none; } .ec-base-product .prdList .shippingFee .ec-base-tooltip { z-index:11; display:block; margin:0 0 0 -170px; width:360px; } .ec-base-product .prdList .shippingFee .ec-base-tooltip table th { width:40px; } .ec-base-product .prdList .shippingFee .ec-base-tooltip table th, .ec-base-product .prdList .shippingFee .ec-base-tooltip table td { padding:7px 10px 8px 10px; } /* 배송비 차등부과 레이어 */ .ec-base-product .btnTooltip { position:relative; display:inline-block; } .differentialShipping { display:none; overflow:hidden; position:absolute; left:50%; top:17px; z-index:100; width:350px; margin:0 0 0 -176px; } .differentialShipping h3.title { margin:0; height:35px; padding:0 35px 0 19px; border:0; color:#fff; font-size:14px; line-height:35px; background:#495164; } .differentialShipping .content { padding:12px 18px 14px 18px; border:1px solid #757575; border-top:0; text-align:center; background:#fff; } .differentialShipping .close { position:absolute; right:14px; top:12px; } .differentialShipping .close img { cursor:pointer; } .differentialShipping .content ul { color:#757575; line-height:25px; } .differentialShipping .content li { overflow:hidden; } .differentialShipping .content li strong { float:left; font-weight:normal; } .differentialShipping .content li span { float:right; color:#2e2e2e; } .differentialShipping .content .info { margin:7px 0 0; padding:7px 0 0; border-top:1px dotted #b0b1b3; color:#80aeef; text-align:right; } /* 썸네일 아이콘 위치 */ .ec-product-bgLT { background-position:left top; } .ec-product-bgLC { background-position:left center; } .ec-product-bgLB { background-position:left bottom; } .ec-product-bgRT { background-position:right top; } .ec-product-bgRC { background-position:right center; } .ec-product-bgRB { background-position:right bottom; } .ec-product-bgCT { background-position:center top; } .ec-product-bgCC { background-position:center center; } .ec-product-bgCB { background-position:center bottom; } /***************** urban css *****************/ /* 공통 */ .ec-base-product { width:100%;max-width:1512px;margin:0 auto 100px; } .ec-base-product .title { margin:0 0 17px; } .ec-base-product .title h2 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; } .ec-base-product .title h3 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; } .ec-base-product img { vertical-align:middle; } .ec-base-product a[href^='/product/detail.html'] > img { border:1px solid #ececec; } .ec-base-product .prdList { display:table; width:100%; min-width:756px; max-width:1512px; margin:0 auto; font-size:0; line-height:0; } .ec-base-product .prdList > li { position:relative; display:inline-block; margin:0 0 50px; color:#757575; vertical-align:top; } .ec-base-product .prdList .chk { position:absolute; top:-10px; left:0; right:0; display:block; margin:0 0 10px; } .ec-base-product .prdList .thumbnail { position:relative; margin:0 15px 15px; text-align:center; } .ec-base-product .prdList .thumbnail .prdImg { position:relative; } .ec-base-product .prdList .thumbnail .prdImg > a > img { width:100%; box-sizing:border-box} .ec-base-product .prdList .thumbnail .wish { position:absolute; right:3px; bottom:4px; z-index:1; cursor:pointer; } .ec-base-product .prdList .thumbnail .prdIcon { position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; } .ec-base-product .prdList .thumbnail .icon { margin:0; vertical-align:middle; padding:0; width:100%; border:0} .ec-base-product .prdList .thumbnail .icon:after { content:""; display:block; clear:both; } .ec-base-product .prdList .thumbnail .promotion { float:left; margin:0 0 4px; text-align:left; } .ec-base-product .prdList .thumbnail .promotion img { margin:0 4px 0 0; } .ec-base-product .prdList .thumbnail .button { float:left; margin:0; } .ec-base-product .prdList .thumbnail .button img { cursor:pointer; } .ec-base-product .prdList .thumbnail .button .option{display:inline-block;float:left} .ec-base-product .prdList .thumbnail .button .option .xans-product-optionpreview .prdOption{left:50%;margin:0 0 0 -150px;top:32px} .ec-base-product .prdList .thumbnail .button .option a{ display:inline; position:relative;background:rgba(255,255,255,0.5);width:37px;height:auto;text-align:center;display:inline-block;float:left;line-height:33px;transition:all 0.4s} .ec-base-product .prdList .thumbnail .button .option a:hover{background:rgba(255,255,255,0.9)} .ec-base-product .prdList .thumbnail .button > span{background:rgba(255,255,255,0.5);width:37px;height:auto;text-align:center;display:inline-block;float:left;;transition:all 0.4s} .ec-base-product .prdList .thumbnail .button > span:hover{background:rgba(255,255,255,0.9)} .ec-base-product .prdList .thumbnail .button .likeButton { display:inline-block; margin:0 5px; } .ec-base-product .prdList .thumbnail .button .likeButton button { font-family:verdana; color:#9a9a9a; letter-spacing:-1px; background:none; } .ec-base-product .prdList .thumbnail .button .likeButton button img { margin-bottom:0; vertical-align:middle; } .ec-base-product .prdList .thumbnail .button .likeButton button strong {height:16px; vertical-align:middle; } .ec-base-product .prdList .thumbnail .button .likeButton.selected button { color:#353535; } .ec-base-product .prdList .description { margin:0 auto; padding:0 15px; font-size:12px; line-height:18px; text-align:center; position:relative; } .ec-base-product .prdList .description .name { display:block; font-weight:normal; padding-bottom:5px; letter-spacing:1.5px} .ec-base-product .prdList .description .name a { color:#2e2e2e; } .ec-base-product .prdList .description .mileage { display:block; } .ec-base-product .prdList .description span.grid { display:block; } .ec-base-product .prdList .promotion{text-align:center;margin:6px 0 0;} .ec-base-product .prdList .icon{position:absolute;bottom:0;left:0;opacity:0;} .ec-base-product .prdList .option{position:relative;display:inline-block;vertical-align:middle;cursor:pointer} .ec-base-product .prdList .button img{vertical-align:middle;margin-right:6px;cursor:pointer} .ec-base-product .prdList .likeButton{float:right;position:relative;background:rgba(255,255,255,0.5);width:51px;height:auto;transition:all 0.4s} .ec-base-product .prdList .likeButton:hover{background:rgba(255,255,255,0.9)} .ec-base-product .prdList .likeButton button{background:none;color:#999} .ec-base-product .prdList .likeButton.selected button{color:#333;} .ec-base-product .prdList .likeButton strong{position:absolute;top:0;right:9px;line-height:34px} .ec-base-product .prdList li:hover .icon{opacity:1;transition:all 1s} /* 진열방식 */ .ec-base-product ul.grid2 > li { width:50%; } .ec-base-product ul.grid3 > li { width:33.33%; } .ec-base-product ul.grid4 > li { width:25%; } .ec-base-product ul.grid5 > li { width:20%; } .ec-base-product ul.grid3 > li .color { max-width:230px; } .ec-base-product ul.grid4 > li .color { max-width:190px; } .ec-base-product ul.grid5 > li .color { max-width:130px; } /* 우측진열 */ .ec-base-product ul.grid2 li:after { content:""; display:block; clear:both; } .ec-base-product ul.grid2 li .thumbnail { float:left; width:220px; text-align:left; margin:0; } .ec-base-product ul.grid2 li .description { float:left; width:247px; padding:0 20px; } .ec-base-product ul.grid2 li .description .chk { position:static; text-align:left; } /* module="product_ListItem" */ .ec-base-product .spec { margin:0;padding:0 } .ec-base-product .spec li { text-align:center;padding:2px 0;letter-spacing:1px } .ec-base-product .spec li .title { font-weight:normal; vertical-align:top; } .ec-base-product .spec li .title span { vertical-align:top; } .ec-base-product .spec li .color { overflow:hidden; display:inline-block; margin:0; background:#fff; padding:4px 0; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 1%, rgba(255,255,255,1) 26%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 26%); background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 26%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );} .ec-base-product .spec li .chips { float:left; width:8px; height:8px; margin:0 0 0 4px; border:1px solid #ccc; border-radius:100%; font-size:0; line-height:0; } .recommend_wrap .ec-base-product .spec li .color { background:#f5f5f5; background: -moz-linear-gradient(left, rgba(245,245,245,0) 0%, rgba(245,245,245,0) 1%, rgba(245,245,245,1) 26%); background: -webkit-linear-gradient(left, rgba(245,245,245,0) 0%,rgba(245,245,245,0) 1%,rgba(245,245,245,1) 26%); background: linear-gradient(to right, rgba(245,245,245,0) 0%,rgba(255,255,255,0) 1%,rgba(245,245,245,1) 26%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );} /* 메인 오버 */ .ec-base-product .prdList .thumbnail .over{display:block;opacity:0;bottom:-5%;background:rgba(0,0,0,0.7);transition:all 0.7s} .ec-base-product .prdList .thumbnail:hover .over{opacity:1;bottom:0;transition:all 0.2s;} .week_best .prdList > li{margin:0 0 6px} .week_best .prdList .thumbnail{margin:0 6px 6px;overflow:hidden} .week_best .prdList .thumbnail .prdImg a{display:block;position:relative} .week_best .prdList .thumbnail .prdImg a:after{content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;background:rgba(255,255,255,0.1);opacity:0;transition:all 0.5s} .week_best .prdList .thumbnail:hover .prdImg a:after{opacity:1;transition:all 0.5s} .week_best .prdList .description{padding:18px 15px} .week_best .prdList .description .name{text-align:center;border:0;margin:0;padding:2px 0} .week_best .spec li{text-align:center} .week_best .color_chips{padding:0 0 2px} .week_best .color_chips .color{max-width:none !important;width:100%} .week_best .color_chips .color span{display:inline-block; width:8px; height:8px; margin:0 2px 0; border:1px solid #555; border-radius:100%; font-size:0; line-height:0;} /* 메인 탭 */ .main_tab_banner{max-width:1482px;margin:0 auto 100px} .main_tab_banner .ec-base-product{width:100%} .main_tab_banner > ul{height:41px;border-bottom:1px solid #222;text-align:center} .main_tab_banner > ul:after{content:"";zoom:1;clear:both;display:block;width:100%;height:0;font-size:0;line-height:0;overflow:hidden} .main_tab_banner .tab li{text-align:center;width:20%;float:left} .main_tab_banner .tab li a{display:block;height:40px;font-size:12px;color:#555;line-height:40px;text-align:center;background:#fff} .main_tab_banner .tab li.on a{height:41px;color:#000;border:1px solid #222;line-height:37px;border-bottom:0} .main_tab_banner div[class^=tabView]{display:none;padding:16px 0 0;} .main_tab_banner div.tabView1{display:block} .main_tab_banner div[class^=tabView] > div{margin:0} .main_tab_banner div[class^=tabView] ul{min-width:100%;padding:0} .main_tab_banner div[class^=tabView] ul:after{content:"";display:block;clear:both} .main_tab_banner div[class^=tabView] > ul > li{position:relative;float:left;padding:0 0 5px} .main_tab_banner div[class^=tabView] .thumb{margin:0 15px 5px} .main_tab_banner div[class^=tabView] .thumb > a > img{width:100%;min-height:100%} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList{display:block;max-width:calc(100% + 8px);width:calc(100% + 8px);margin-left:-8px;} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li{float:left;width:20%;margin:0} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail{margin:0 0 8px 8px} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li:first-child{width:40%} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail img{max-width:100%;height:auto;} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over{ display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; width:100%; height:100%; background:rgba(0,0,0,0.8); opacity:0; transition:all 0.5s; } .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li:hover .thumbnail .over{opacity:1;transition:all 0.5s} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over p, .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over p span{display:block;} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .name{position:relative;text-align:center;border:0;margin-bottom:20px;padding-bottom:20px} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .name:after{content:"";display:block;width:18px;height:1px;position:absolute;left:50%;bottom:0;margin-left:-9px;background:#bcbcbc} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .name span{letter-spacing:1.3px} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .spec li{text-align:center} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .spec span{text-align:center;;margin-bottom:5px} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .spec .color{position:relative;padding:0;background:none;right:auto;vertical-align:middle} .main_tab_banner div[class^=tabView] .ec-base-product ul.prdList > li .thumbnail .over .description .spec .chips{margin:0 2px 0} /* 공통 css */ .ec-base-paginate { margin:30px 0; text-align:center; font-size:0; line-height:0; } .ec-base-paginate ol { display:inline-block; font-size:0; line-height:0; vertical-align:top; *display:inline; *zoom:1; *margin:0; } .ec-base-paginate li { display:inline-block; margin:0 0 0 -1px; border:1px solid #d7d5d5; font-size:12px; color:#757575; vertical-align:top; *display:inline; *zoom:1; } .ec-base-paginate li:first-child { margin-left:0; } .ec-base-paginate img { vertical-align:top; } .ec-base-paginate li a { display:block; width:33px; padding:9px 0; font-weight:bold; color:#939393; line-height:14px; background:#fff; } .ec-base-paginate li a:hover { text-decoration:none; background:#f0f2f2; } .ec-base-paginate li a.this { padding-bottom:6px; border-bottom:3px solid #495164; color:#495164; } .ec-base-paginate a.nolink { cursor:default; } /* typeSub */ .ec-base-paginate.typeSub ol { margin:0 15px; vertical-align:middle; } .ec-base-paginate.typeSub li { font-size:12px; border:0; } .ec-base-paginate.typeSub img { vertical-align:middle; } .ec-base-paginate.typeSub li a { width:auto; margin:0 5px 0; padding:2px; color:#353535; background:none; } .ec-base-paginate.typeSub li a.this { color:#008bcc; text-decoration:underline; border:0; } .ec-base-paginate.typeSub .first { margin-right:3px; } .ec-base-paginate.typeSub .last { margin-left:3px; } /***************** urban css *****************/ .ec-base-paginate li{border:0;margin:0 3px} .ec-base-paginate li a{width:24px;height:24px;padding:0;line-height:24px;color:#555;font-weight:normal;border-radius:100%} .ec-base-paginate li a.this{padding:0;border:0;color:#222;background:#eee;font-weight:600} .ec-base-paginate > a > img{display:none} .ec-base-paginate > a{width:24px;height:24px;display:inline-block} .ec-base-paginate > a:nth-child(1){background:url("//solidpop.co.kr/urban/images/common/btn_page_first.png") no-repeat center} .ec-base-paginate > a:nth-child(2){background:url("//solidpop.co.kr/urban/images/common/btn_page_prev.png") no-repeat center} .ec-base-paginate > a:nth-last-child(2){background:url("//solidpop.co.kr/urban/images/common/btn_page_next.png") no-repeat center} .ec-base-paginate > a:nth-last-child(1){background:url("//solidpop.co.kr/urban/images/common/btn_page_last.png") no-repeat center} .ec-base-paginate ol{margin:0 15px} .ec-base-paginate.typeSub li{border:0;margin:0 3px} .ec-base-paginate.typeSub li a{width:24px;height:24px;padding:0;line-height:24px;color:#555;font-weight:normal;border-radius:100%} .ec-base-paginate.typeSub li a.this{padding:0;border:0;color:#222;background:#eee;font-weight:600} .ec-base-paginate.typeSub > a > img{display:none} .ec-base-paginate.typeSub > a{width:24px;height:24px;display:inline-block} .ec-base-paginate.typeSub > a:nth-child(1){background:url("//solidpop.co.kr/urban/images/common/btn_page_first.png") no-repeat center} .ec-base-paginate.typeSub > a:nth-child(2){background:url("//solidpop.co.kr/urban/images/common/btn_page_prev.png") no-repeat center} .ec-base-paginate.typeSub > a:nth-last-child(2){background:url("//solidpop.co.kr/urban/images/common/btn_page_next.png") no-repeat center} .ec-base-paginate.typeSub > a:nth-last-child(1){background:url("//solidpop.co.kr/urban/images/common/btn_page_last.png") no-repeat center} .ec-base-paginate.typeSub ol{margin:0 15px;vertical-align:top;} .ec-base-paginate.typeSub li a.this {text-decoration:none} /* 공통 css */ .ec-base-tab { position:relative; } .ec-base-tab .menu { margin:0 0 20px; border:1px solid #cbcdce; border-bottom-color:#202020; border-left:0; background:#f2f2f2; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; } .ec-base-tab .menu:after { content:""; display:block; clear:both; } .ec-base-tab .menu li { float:left; border-left:1px solid #cbcdce; background:#f2f2f2; } .ec-base-tab .menu li a { display:block; min-width:187px; margin:0 0 0 -1px; padding:12px 5px 11px; border-right:1px solid #cbcdce; color:#707070; text-decoration:none; outline:0; text-align:center; background:#f2f2f2; } .ec-base-tab .menu li:first-child a { margin-left:0; } .ec-base-tab .menu li.selected a { position:relative; top:-1px; left:-2px; margin:0 0 -1px; border:1px solid #202020; border-bottom:0; color:#fff; font-weight:bold; background:#4a5164; } .ec-base-tab .menu li.selected:first-child a { left:-1px; } .ec-base-tab > .right { position:absolute; top:8px; right:10px; line-height:24px; color:#909090; } /* 밝은형 타입 */ .ec-base-tab.typeLight .menu li.selected a { margin:0 0 -2px; border-bottom:1px solid #fff; color:#404040; background:#fff; } /* 넓이 가변형 grid(2~7) : 메뉴갯수만큼 grid 뒤의 숫자를 바꿔주세요 */ .ec-base-tab[class*="grid"] .menu { display:table; table-layout:fixed; width:100%; } .ec-base-tab[class*="grid"] .menu li { float:none; display:table-cell; vertical-align:middle; } .ec-base-tab[class*="grid"] .menu li a { display:inline-block; width:100%; min-width:0; margin:0; padding:11px 0; border:0; } .ec-base-tab[class*="grid"] .menu li.selected { position:relative; top:0; right:-1px; border:1px solid #292929; border-bottom:0; background:#4a5164; } .ec-base-tab[class*="grid"] .menu li:first-child.selected { right:0; } .ec-base-tab[class*="grid"] .menu li.selected a { position:static; background:none; } .ec-base-tab.grid2 .menu li { width:50.5%; } .ec-base-tab.grid3 .menu li { width:34%; } .ec-base-tab.grid4 .menu li { width:25.5%; } .ec-base-tab.grid5 .menu li { width:20.5%; } .ec-base-tab.grid6 .menu li { width:17%; } .ec-base-tab.grid7 .menu li { width:14.8%; width:15% \0/; } .ec-base-tab.grid7 .menu li:first-child { width:13% \0/; } /* 공통 */ .ec-base-button { padding:10px 0; text-align:center; } .ec-base-button.justify { position:relative; } .ec-base-button:after { display:block; content:""; clear:both; } .ec-base-button .gLeft { float:left; text-align:left; } .ec-base-button .gRight { float:right; text-align:right; } .ec-base-button.justify .gLeft { position:absolute; left:0; } .ec-base-button.justify .gRight { position:absolute; right:0; } .ec-base-button .text { margin:0 6px 0 10px; color:#353535; line-height:24px; } /* type */ .ec-base-button.typeBorder { margin-top:-1px; padding:10px 20px; border:1px solid #d7d5d5; } .ec-base-button.typeBG { padding:10px 20px; border:1px solid #d7d5d5; background:#fbfafa; } /* base */ .ec-base-box { padding:20px; margin-left:auto; margin-right:auto; border:5px solid #e8e8e8; color:#404040; } .ec-base-box.gHalf { position:relative; padding:20px 0; } .ec-base-box.gHalf:before { position:absolute; top:0; left:50%; display:block; content:""; width:1px; height:100%; background-color:#e6e6e6; } .ec-base-box.typeBg { background-color:#fbfafa; } .ec-base-box.typeThin { border-width:1px; border-color:#d7d5d5; } .ec-base-box.typeThinBg { border-width:1px; border-color:#d7d5d5; background-color:#fbfafa; } /* 약관 */ .ec-base-box.typeThinBg > .agree { padding:20px; border:1px solid #e6e6e6; background:#fff; } .ec-base-box.typeThinBg > .agree p { padding:0 0 17px; } /* typeMember */ .ec-base-box.typeMember { padding:0; } .ec-base-box.typeMember .information { display:table; table-layout:fixed; padding:10px 0; width:100%; box-sizing:border-box; } .ec-base-box.typeMember .information > .title, .ec-base-box.typeMember .information > .thumbnail { display:table-cell; padding:0 15px; width:70px; text-align:center; vertical-align:middle; } .ec-base-box.typeMember .information > .title { vertical-align:middle; } .ec-base-box.typeMember .information > .thumbnail img { max-width:70px; } .ec-base-box.typeMember .information .description { display:table-cell; padding:0 10px; width:auto; line-height:1.5em; border-left:1px solid #e8e8e8; vertical-align:middle; } .ec-base-box.typeMember.gMessage { border-width:1px; border-color:#d7d5d5; } .ec-base-box .message { display:block; padding:10px 0 10px 35px; border-bottom:1px solid #e8e7e7; background:#fbfbfb url("//img.echosting.cafe24.com/skin/base/common/ico_info.gif") no-repeat 10px center; } /* typeProduct */ .ec-base-box.typeProduct { display:table; table-layout:fixed; padding:15px 0; width:100%; box-sizing:border-box; } .ec-base-box.typeProduct .thumbnail, .ec-base-box.typeProduct .information { display:table-cell; padding:0 20px; vertical-align:middle; } .ec-base-box.typeProduct .thumbnail { width:100px; } .ec-base-box.typeProduct .thumbnail img { max-width:90px; border:1px solid #d7d5d5; } .ec-base-box.typeProduct .information { padding-left:0; } /* urban css */ .ec-base-box.typeThinBg{background:#fff} /* 공통 css */ .ec-base-table table { position:relative; margin:10px 0 0; border:1px solid #d7d5d5; border-top:0; color:#fff; line-height:1.5; } .ec-base-table.gLayoutFixed table { table-layout:fixed; } .ec-base-table.gLayoutFixed .gLayoutAuto table { table-layout:auto; } .ec-base-table table:before { position:absolute; top:0; left:0; display:block; content:""; width:100%; height:1px; background:#d7d5d5; } .ec-base-table thead th { padding:11px 0 10px; border-left:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; color:#353535; vertical-align:middle; font-weight:normal; background:#fbfafa; } .ec-base-table tbody th { padding:11px 0 10px 18px; border:1px solid #dfdfdf; color:#353535; text-align:left; font-weight:normal; background-color:#fbfafa; } .ec-base-table th { word-break:break-all; word-wrap:break-word; } .ec-base-table th:first-child { border-left:0; } .ec-base-table td { padding:11px 10px 10px; border-top:1px solid #dfdfdf; color:#353535; vertical-align:middle; word-break:break-all; word-wrap:break-word; } .ec-base-table td.clear { padding:0 !important; border:0 !important; } /* 여백, 테두리 상쇄 */ /* 가로형 */ /* 쓰기 타입 */ .ec-base-table.typeWrite td { padding:8px 10px 7px; } .ec-base-table.typeWrite img { max-width:100% !important; height:auto !important; } /* 세로형 */ /* 목록 타입 */ .ec-base-table.typeList table { border-top:1px solid #d7d5d5; } .ec-base-table.typeList table:before { display:none; } .ec-base-table.typeList td { padding:8px 10px 7px; } .ec-base-table.typeList tfoot td { padding:15px 10px 17px; background:#fbfafa; } /* 내역 없음 */ .ec-base-table .message { border:1px solid #d7d5d5; padding:50px 0; text-align:center; color:#757575; font-weight:bold; } .ec-base-table table + .message { margin:-1px 0 0; } .ec-base-table table td.message { padding:50px 0; } .ec-base-table .scroll .message { border:0; } /* 세로 스크롤 */ .ec-base-table.typeList .head td { padding:11px 0 10px; border-left:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; color:#353535; vertical-align:middle; text-align:center; background:#fbfafa; } .ec-base-table.typeList .head td:first-child { border-left:0; } .ec-base-table.typeList .scroll { position:relative; overflow-x:hidden; overflow-y:scroll; max-height:185px; min-height:100px; border:1px solid #d7d5d5; border-top-width:0; margin-top:-1px; } .ec-base-table.typeList .scroll table { border:0; margin:0; } .ec-base-table.typeList .scroll table:before { display:none; } .ec-base-table.typeList .scroll .message { border: 0; } /* thead - blind */ .ec-base-table thead.blind, .ec-base-table thead.blind th { display:none; } .ec-base-table thead.blind + tbody tr:first-child th, .ec-base-table thead.blind + tbody tr:first-child td { border-top-width:0; } /* 라인형 */ .ec-base-table.typeList.gLine table { border-width:0; border-bottom-width:1px; } /* 공통 */ /* 테두리, 배경 없는 타입 */ .ec-base-table.typeClear table:before { display:none; } .ec-base-table.typeClear table, .ec-base-table.typeClear th, .ec-base-table.typeClear td { border:0 none; background:none; } .ec-base-table.typeClear th { font-weight:bold; } /* 셀 테두리 */ .ec-base-table.gBorder td { border-left:1px solid #dfdfdf; } .ec-base-table.gBorder td:first-child { border-left:0; } .ec-base-table.gBorder td.gClearLine { border-left:0; } .ec-base-table.typeList.gBorder tbody td { border-color:#eee; } /* 정렬 */ .ec-base-table .left { text-align:left; } .ec-base-table .center { text-align:center; } .ec-base-table .right { text-align:right; } .ec-base-table.typeList .center td, .ec-base-table.typeList td.center { padding-left:0; padding-right:0; } .ec-base-table.typeList .center td.left { padding-left:10px; } .ec-base-table.typeList .center td.right { padding-right:10px; } .ec-base-table .top th, .ec-base-table th.top, .ec-base-table .top td, .ec-base-table td.top { vertical-align:top; } .ec-base-table .middle th, .ec-base-table th.middle, .ec-base-table .middle td, .ec-base-table td.middle { vertical-align:middle; } /* 폼태그 */ .ec-base-table img { vertical-align:middle; } @media print { .ec-base-table table:before { display:none; } } /* urban css */ .ec-base-table thead th, .ec-base-table tbody th{background:#fff;border-left:0;color:#222} .ec-base-table thead th{padding:16px 0;font-size:13px} .ec-base-table td{font-size:13px;padding:16px 10px} .ec-base-table.typeList table{border-top:2px solid #222} .ec-base-table.typeList td{padding:16px 10px} .ec-base-table.typeList td{padding:14px 10px} .ec-base-table.typeList tfoot td{background:#f5f5f5} .ec-base-table table{border-right:0;border-left:0} .ec-base-table table:before{display:none} .join_tb tbody{border-top:2px solid #222} .ec-base-table.gBorder td{border-left:0} .ec-base-desc { overflow:hidden; text-align:left; } .ec-base-desc:after { content:""; display:block; claer:both; } .ec-base-desc dt, .ec-base-desc .term { float:left; width:100px; margin:0 0 2px; padding:0 4px 0 0; line-height:22px;-webkit-box-sizing:border-box; -moz-webkit-box:border-box; box-sizing:border-box; font-weight:normal; } .ec-base-desc dd, .ec-base-desc .desc { display:block; margin:0 0 2px; padding:0 5px 0 100px; min-height:22px; line-height:22px; word-wrap:break-word; word-break:break-all; } .ec-base-desc dd:after, .ec-base-desc .desc:after { content:""; display:block; clear:left; } /* size */ .ec-base-desc.gSmall dt, .ec-base-desc.gSmall .term { width:30%; } .ec-base-desc.gSmall dd, .ec-base-desc.gSmall .desc { padding-left:30%; } .ec-base-desc.gMedium dt, .ec-base-desc.gMedium .term { width:40%; } .ec-base-desc.gMedium dd, .ec-base-desc.gMedium .desc { padding-left:40%; } .ec-base-desc.gLarge dt, .ec-base-desc.gLarge .term { width:50%; } .ec-base-desc.gLarge dd, .ec-base-desc.gLarge .desc { padding:0 0 0 50%; } /* align */ .ec-base-desc.centerDT dt, .ec-base-desc.centerDD dd, .ec-base-desc.centerDT .term, .ec-base-desc.centerDD .desc, .ec-base-desc.center, .ec-base-desc .center { text-align:center; } .ec-base-desc.rightDT dt, .ec-base-desc.rightDD dd, .ec-base-desc.rightDT .term, .ec-base-desc.rightDD .desc, .ec-base-desc.right, .ec-base-desc .right { text-align:right; } .ec-base-desc.rightDD dd, .ec-base-desc.rightDD .desc { padding-right:0; } /* typeBullet */ .ec-base-desc.typeBullet dt, .ec-base-desc.typeBullet .term { padding:0 4px 0 10px; background:url("//img.echosting.cafe24.com/skin/base/common/ico_arrow.png") no-repeat 0 7px; } /* typeDot */ .ec-base-desc.typeDot dt, .ec-base-desc.typeDot .term { padding: 0 4px 0 6px; background: url("//img.echosting.cafe24.com/skin/base/common/ico_square3.gif") no-repeat left 10px; } /* popup.css */ .popupWrap1{display:none;position:absolute;left:0;top:0;background:#fff;z-index:12;} .popupWrap1 .popupView{position:relative;width:300px;height:380px;border:1px solid #ccc;margin:0 auto} .popupWrap1 .popupView > div{display:none;position:absolute;left:0;top:0;width:100%;height:100%} .popupWrap1 .popupView > div img{width:100%;height:100%} .popupWrap1 .popupView > div.view1{display:block} .popupWrap1 .btnList{position:relative;width:100%;border-left:1px solid #ddd;box-sizing:border-box;} .popupWrap1 .btnList ul:after{content:"";display:block;clear:both;zoom:1;width:100%;height:0;font-size:0;line-height:0;overflow:hidden} .popupWrap1 .btnList li{float:left;width:33.33%;box-sizing:border-box;height:80px;border-right:1px solid #ddd;border-bottom:1px solid #ddd;margin:0;background:#f0f0f0;cursor:pointer;text-align:center;} .popupWrap1 .btnList li a{position:relative;top:30%;text-align:center;font-size:11px;color:#666;line-height:1.6} .popupWrap1 .btnList li.on{background:#fff} .popupWrap1 .btnList .border{position:absolute;left:0;top:0;width:33.33%;height:80px;box-sizing:border-box;border:1px solid #333;} .popupWrap1 .close{padding:7px 5px 9px} .popupWrap1 .close input, .popupWrap .close label{vertical-align:middle;font-size:11px;color:#999} .popupWrap1 .close #close1{float:right;cursor:pointer} .hide{display:none !important} .top_popup{text-align:center;overflow:hidden;position:relative} .top_popup .inWrap{position:relative;display:inline-block;zoom:1;*display:inline;min-width:1200px;text-align:center} .top_popup .inWrap .bnn{position:relative;display:inline-block;zoom:1;*display:inline;min-height:70px;margin:0 auto;} .top_popup .btn_close_pop{position:absolute;left:50%;top:5px;margin-left:-592px;display:inline-block;zoom:1;*display:inline;/*background:rgba(255,255,255,0.1);*/display:none;z-index:10000} .top_popup .today{position:absolute;left:50%;bottom:5px;margin-left:-595px;text-align:right;display:none;z-index:10000} .top_popup .today label{vertical-align:middle;font-size:12px;color:#666;margin-right:5px} .top_popup .today input{vertical-align:middle;width:20px;height:20px} .top_popup:hover .btn_close_pop, .top_popup:hover .today{display:block} .leftWrap{position:fixed;z-index:100000;left:0;bottom:0;} .leftWrap .left_bnn{position:relative;padding:0;margin:0} .leftWrap .left_bnn .left_popup{position:absolute;width:120px;height:106px;bottom:13px;left:20px;z-index:998;padding:0;margin:0} .leftWrap .left_bnn .left_popup div{position:absolute;width:120px;height:106px} .leftWrap .left_bnn .left_popup div a{} .leftWrap .left_bnn .left_popup div a img{position:absolute;width:100%;height:100%} .leftWrap .left_bnn .ani_popup{position:absolute;bottom:37px;left:56px;z-index:999;width:301px;height:450px;overflow:hidden;} .leftWrap .left_bnn .ani_popup > div{} .leftWrap .left_bnn .ani_popup div a{width:100%} .leftWrap .left_bnn .ani_popup div a img{width:100%;height:100%} .leftWrap .left_bnn .ani_popup .popup_none{width:100%;margin:0 auto;position:relative;padding-left:60px} .leftWrap .left_bnn .ani_popup .popup_none span{margin-left:10px} .leftWrap .left_bnn .ani_popup .popup_none #left_close{cursor: pointer;} .top_popup .swiper-container{width:100%;height:100%} .top_popup .swiper-wrapper{height:100%;} .top_popup .swiper-slide{ height:100%;text-align:center;background:#fff; display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex; -webkit-box-pack:center;-ms-flex-pack:center; -webkit-justify-content:center;justify-content:center; -webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center; } .top_popup .swiper-slide a{display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center 0;background-size:auto 100%;} .top_popup .swiper-button-prev, .top_popup .swiper-button-next{width:27px;height:27px;margin-top:-26px;background-color:#fff;background-color:rgba(255,255,255,0.1);background-size:auto;border-radius:6px} .top_popup .swiper-button-prev{top:50%;left:auto;right:50%;margin-right:-600px;background-image:url("//solidpop.co.kr/urban/images/main/btn_top_prev.png");display:none} .top_popup .swiper-button-next{top:80%;left:auto;right:50%;margin-right:-600px;background-image:url("//solidpop.co.kr/urban/images/main/btn_top_next.png");display:none} .top_popup .swiper-pagination-bullets{width:100%;text-align:center;bottom:10px !important} .top_popup .swiper-pagination-bullet{width:10px;height:2px;background:#acacac;opacity:0.5; border-radius:0;margin-right:5px} .top_popup .swiper-pagination-bullet-active{background:#535353} .top_popup:hover .swiper-button-prev{display:block} .top_popup:hover .swiper-button-next{display:block} /* popup2.css */ .popupWrap2{display:none;position:absolute;left:0;top:0;width:530px;border:1px solid #ccc;background:#fff;z-index:12;} .popupWrap2 .popupView{position:relative;width:420px;height:300px} .popupWrap2 .popupView > div{display:none;position:absolute;left:0;top:0;width:100%;height:100%} .popupWrap2 .popupView > div img{width:100%;height:100%} .popupWrap2 .popupView > div.view1{display:block} .popupWrap2 .btnList{position:absolute;right:0;top:0;width:110px} .popupWrap2 .btnList ul:after{content:"";display:block;clear:both;zoom:1;width:100%;height:0;font-size:0;line-height:0;overflow:hidden} .popupWrap2 .btnList li{height:75px;background:#f0f0f0;cursor:pointer;text-align:center;border-top:1px solid #dfdfdf;box-sizing:border-box} .popupWrap2 .btnList li:first-child{border-top:0} .popupWrap2 .btnList li:hover{background:#f6f6f6} .popupWrap2 .btnList li a{position:relative;top:29%;text-align:center;font-size:11px;color:#666;line-height:1.6} .popupWrap2 .btnList li.on{background:#fff} .popupWrap2 .btnList li.on a{color:#000} .popupWrap2 .btnList .border{/* position:absolute;left:0;top:0;width:100%;height:80px;box-sizing:border-box;border:1px solid #333; */} .popupWrap2 .close{padding:7px 5px 8px} .popupWrap2 .close input, .popupWrap2 .close label{vertical-align:middle;font-size:11px;color:#999} .popupWrap2 .close #close2{float:right;cursor:pointer} .hide{display:none !important}