/* BASIC css start */ /* BASIC css start */ body {min-width:1530px; overflow-x:hidden;} [id*='MAKESHOPLY'] {z-index:99999999999999 !important; } .dn {display: none !important} /* 띠배너 */ #topBnr {display:none;width:100%;text-align:center} #topBnr .topWrap {position:relative;min-width:1302px; } #topBnr .topWrap>a>img {width:100%; } #xbtn {position:absolute;top:50%;right:69px;transform:translateY(-50%); } #xbtn img {width: 16px; } /* 팝업배너 */ #popBnr {display:none;position:relative;position:fixed;right:20px;bottom:5%;z-index:2; } #popBnr a {display:block;text-align:center;width:180px;height:180px;border-radius:100%; } #popBnr a>img {width:100%; } #pop-xbtn {position:absolute;top:-2px;right:-2px;transform:translateY(-50%); } #pop-xbtn img {width:16px; } #header {width: 100%; } /* 헤더 공통 */ #header>div {width:100%;font-family:'Roboto','Noto Sans KR',sans-serif;margin:0 auto} #header>div>div { } #header>div li {/* text-align:left; */} #header>div li a {font-family: 'Montserrat',sans-serif; } /* 헤더 탑 */ #header .head_top {height:80px;background-color:#fff;position:relative;z-index:1000} #header .head_top_inner {height:100%;display:flex;justify-content:space-between;align-items:center;margin:0 50px; } #header .head_top_inner h1 { } #header .head_top_inner h1 a {display:block; } #header .head_top_inner h1 a img { } #header .head_top_inner .search {width:400px;margin-top:-6px} #header .head_top_inner .search fieldset {height:40px;width:100%;margin:0 auto;border-bottom:3px solid #000;position:relative; } #header .head_top_inner .search input {font-weight:bold;font-family:'Roboto','Noto Sans KR',sans-serif;font-size:22px;background:none !important;border:none;width:90%;height:100%;float:left} #header .head_top_inner .search input::placeholder {color:#c3c3c3} #header .head_top_inner .search .search_icon {position:absolute;top:50%;transform:translateY(-50%);right:0;display:inline-block;text-indent:-9999px;width:25px;height:25px;float:right;background:url(/design/bokuk7139/modeny/PC_img/b_search.png) no-repeat center center;background-size:contain} #header .head_top_inner .user_m { } #header .head_top_inner .user_m ul { } #header .head_top_inner .user_m ul li {display:inline-block;margin-left:10px; } #header .head_top_inner .user_m ul li a {display:block;font-size:15px;color:#a0a0a0;font-weight:400;font-family:'Roboto','Noto Sans KR',sans-serif; } #header .head_top_inner .user_m ul li a span {width:15px;height:15px;background-color:#db1443;border-radius:50%;text-align:center;color:white;line-height:15px;display:inline-block;font-size:10px;transform:translateY(-2px);margin-left: 2px} /* 헤더 바텀 */ #header .head_bottom {height:70px;background-color:white;transition:position .4s;position:relative;width:100%;z-index:1000} #header .head_bottom.fix {position:fixed;top:0;z-index:99999;left:50%;transform:translateX(-50%)} #header .head_bottom.fix .fix_logo {opacity:1; } #header .head_bottom.fix .user_icon {opacity:1; } #header .head_bottom_inner {height:100%;display:flex;justify-content:space-between;align-items:center;margin:0 50px; } #header .head_bottom_inner .fix_logo {opacity:0;transition:opacity .2s; } #header .head_bottom_inner .fix_logo a { } #header .head_bottom_inner .fix_logo a img { } #header .head_bottom_inner>nav {height:100%;min-width:1160px;margin:0 auto;position:absolute;left:50%;transform: translateX(-50%); } /* 공통 */ #header .head_bottom_inner>nav li {display:inline-block;line-height:70px;} #header .head_bottom_inner>nav li a {font-size:17px;font-weight:400;color:#000;font-family: 'Roboto','Noto Sans KR',sans-serif;} #header .head_bottom_inner>nav>ul.first_m {/* position:relative; */ font-family:'Roboto','Noto Sans KR',sans-serif;display:flex;position:absolute;left:50%;transform:translateX(-50%);justify-content:space-between;width:1100px; } #header .head_bottom_inner>nav>ul.first_m > li {height:100%;font-family:'Roboto','Noto Sans KR',sans-serif;text-align: center;} #header .head_bottom_inner>nav ul.first_m li:hover>a {color:#ef2660; } #header .head_bottom_inner>nav ul.first_m > li > a {transition:color .1s font-family:'Roboto','Noto Sans KR',sans-serif;width: 100%;display: inline-block;position: relative;} #header .head_bottom_inner>nav ul.first_m > li > a:after{content:'';position: absolute;left: 50%;transform: translateX(-50%);right: 0;top: 0;bottom: 0;width: 238%;height: 50px;z-index: -1;} #header .head_bottom_inner nav ul.second_m { } #header .head_bottom_inner nav ul.second_m li { } #header .head_bottom_inner nav ul.second_m li a {font-weight:400;font-family:'Roboto','Noto Sans KR',sans-serif;font-size:17px; } #header .head_bottom_inner .user_icon {height:100%;display:flex;align-items:center;opacity:0;transition:opacity .2s;/*position:relative;*/ } #header .head_bottom_inner .user_icon ul { } #header .head_bottom_inner .user_icon ul li {display:inline-block;margin-left:30px;line-height: 70px;} #header .head_bottom_inner .user_icon ul li a {display:block;width:100%;height:100%; } #header .head_bottom_inner .user_icon ul li.li_search {width:26px;height:26px;background:url(/design/bokuk7139/modeny/PC_img/w_search.png) no-repeat center center;background-size:contain;transition:background-image .1s; } #header .head_bottom_inner .user_icon ul li.li_mypage {width:26px;height:26px;background:url(/design/bokuk7139/modeny/PC_img/w_my.png) no-repeat center center;background-size:contain;} #header .head_bottom_inner .user_icon ul li.li_cart {width:26px;height:26px;background:url(/design/bokuk7139/modeny/PC_img/w_cart.png) no-repeat center center;background-size:contain; } #header .head_bottom_inner .user_icon ul li.li_cart a {width:100%;height:100%;position:relative; } #header .head_bottom_inner .user_icon ul li.li_cart a span {position:absolute;top:60%;left:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:500;color:#000} #header .head_bottom_inner .user_icon ul li.li_search.click {background-image:url(/design/bokuk7139/modeny/PC_img/search_close.png); } .search_area.click {display:block; } .search_area {display:none;width:500px;height:255px;position:absolute;top:69px;background-color:#fff;right:70px;border:1px solid #000;padding:30px 40px; } .search_area .search {width:100%;height:70px; } .search_area .search fieldset {height:40px;width:100%;margin:0 auto;border-bottom:3px solid #000;position:relative; } .search_area .search input {font-weight:bold;font-family:font-family:'Roboto','Noto Sans KR',sans-serif;font-size:22px;background:none !important;border:none;width:90%;height:100%;float:left} .search_area .search input::placeholder {color:#c3c3c3} .search_area .search .search_icon {position:absolute;top:50%;transform:translateY(-50%);right:0;display:inline-block;text-indent:-9999px;width:25px;height:25px;float:right;background:url(/design/bokuk7139/modeny/PC_img/b_search.png) no-repeat center center;background-size:contain} .search_area .reset {position:absolute;top:50%;transform:translateY(-50%);right:40px;display:block;width:22px;height:22px} .search_area .reset img {width:100%} .search_area ul {width:90%} .search_area ul li {margin-left:0 !important;margin-right:15px;margin-bottom:15px} .search_area ul li a {color:#000;font-family:'Noto Sans KR',sans-serif !important;font-size:16px;color:#818181;font-weight:500; } .gnb_area {transition:display .5s;display:none;width:100%;background-color:rgba(255,255,255,0.911);position:absolute;left:0;top:70px;color:#000;height:340px;z-index:100;_min-width:1860px} .gnb_area.show {display:block;transition: display .5s; } /* 상단 서브 메뉴,배너 */ #subwrapper {display:none;position:absolute;left:0;right:0;background:#fff;padding:30px 0;transition:.5s;width: 100vw;margin-left: calc(-50vw + 50%);} #subwrapper #subnav {width: 1100px;margin:0 auto;display:flex;justify-content:space-between;} #subwrapper #subnav #submenu__list {display:flex;justify-content:flex-start;gap: 0 36px;width: 52%;flex-wrap: wrap;} #subwrapper #subnav #submenu__list #submenu__menu {display:inline-block;line-height:normal;height: auto;margin-left: 0;text-align: left;} #subwrapper #subnav #submenu__list #submenu__menu>a {display:inline-block;font-size:16px;color:#303030;font-weight:500;margin-bottom:15px;font-family: 'Roboto','Noto Sans KR',sans-serif;} #subwrapper #subnav #submenu__list #submenu__menu>a:hover {color:#ef2660; } #subwrapper #subnav #submenu__list #submenu__menu ul { } #subwrapper #subnav #submenu__list #submenu__menu ul li {display:block;height:auto;line-height:normal;margin-bottom:10px; } #subwrapper #subnav #submenu__list #submenu__menu ul li a {display:inline-block;font-size:15px;color:#999; } #subwrapper #subnav #submenu__list #submenu__menu ul li a:hover {color:#ef2660; } .head_bnr_wrap { } .head_bnr_wrap ul { } .head_bnr_wrap ul li {width: 231px;height: auto;float:left;margin-left:20px;} .head_bnr_wrap ul li:first-child{margin-left:0;} .head_bnr_wrap ul li .thumb {width:100%;height: auto;} .head_bnr_wrap ul li .thumb a {display:block;width:100%;height:100%; } .head_bnr_wrap ul li .thumb a img {width:100%;height:100%;object-fit:cover; } .head_bnr_wrap ul li .info {padding-top:10px; } .head_bnr_wrap ul li .info p {white-space:wrap;overflow:hidden;text-overflow:ellipsis; } .head_bnr_wrap ul li .info .p_name {font-size:15px;color:#000;font-weight:500;line-height:1.25; } .head_bnr_wrap ul li .info .p_etc {font-size:12px;color:#606060;font-weight:500;margin:5px 0;line-height:1.25; } .head_bnr_wrap ul li .info .price { } .head_bnr_wrap ul li .info .price span {font-size:13px;color:#000;display:inline-block;font-weight:500; } .head_bnr_wrap ul li .info .price span.strike {text-decoration:line-through;font-size:11px;color:#606060;margin-left: 6px; } /* 다찾다 자동완성*/ .search-auto-complete-list {display:none;z-index:1;position:absolute;top:40px;left:0;border:1px solid #ddd;border-top:1px solid #000;line-height:14px;background:#fff; } .search-auto-complete-list ul {width:202px;padding:4px 0 6px;border-bottom:1px solid #ddd; } .search-auto-complete-list ul li {text-align:left; } .search-auto-complete-list ul li.on {background:#f3f3f3; } .search-auto-complete-list ul li a {display:block;padding:8px 14px 7px;color:#000;background:none;font-family:'dotum';font-size:12px;letter-spacing:-1px; } .search-auto-complete-list ul li a strong {color:#ab3e41; } .search-auto-complete-list ul li a:hover {background:#f2f2f2; } .search-auto-complete-list ul li a:hover span {border-bottom:1px solid #000; } .search-auto-complete-list .search-list-close {display:block;padding:10px 11px;text-align:right;color:#999;font-size: 11px; } /* 다찾다 검색 파인더 */ #allfinder-layer {z-index:9999;position:fixed;top:20%;right:110px;width:1000px;zoom:1;overflow:hidden; } #allfinder-layer .finder-body {display:none;z-index:1;position:relative;width:998px;*width:918px;padding:35px 40px 5px;max-height:800px;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;border:1px solid #666;background:#fff; } #allfinder-layer .finder-body .finder-close {position:absolute;top:15px;right:10px;font-size:24px;color:#000;*width:19px;*height:24px;*background:url('/images/common/btn_h11_close.gif') no-repeat center center;*background-size:19px 24px; } #allfinder-ctr {z-index:10000;position:fixed;top:20%;right:0;width:103px;height:86px; } #allfinder-ctr a {display:block;width:100%;height:100%;background:url('/images/common/allfinder_ctrl_pc.png') no-repeat right top;border:none;outline:none;font-size:0; } .all-finder-layer .finder-body .finder-tbl table {border:1px solid #ccc;border-top:1px solid #000; } .all-finder-layer .finder-body .finder-tbl th,.all-finder-layer .finder-body .finder-tbl td {height:40px;border-top:1px solid #e5e5e5;font-size:13px;font-family:'Malgun Gothic';color:#000; } .all-finder-layer .finder-body .finder-tbl tr:first-child th,.all-finder-layer .finder-body .finder-tbl tr:first-child td {border-top:none; } .all-finder-layer .finder-body .finder-tbl th {padding:5px 0;background:#f4f4f4;text-align:left;vertical-align:top; } .all-finder-layer .finder-body .finder-tbl th .txt-l {position:relative;height:34px;line-height:34px;padding:0 20px;margin:3px 0; } .all-finder-layer .finder-body .finder-tbl th .txt-l .fa {position:absolute;top:50%;right:15px;margin-top:-6px; } .all-finder-layer .finder-body .finder-tbl th .txt-l .finder-tooltip-btn {display:inline-block;width:20px;height:20px;line-height:22px;border:1px solid #cecece;border-radius:20px;color:#666;font-size:11px;background:#fff;text-align:center;outline:none; } .all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer {display:none;position:absolute;top:33px;left:52px;width:270px;padding:0 20px 18px;border:1px solid #000;background:#fff;text-align:left;font-weight:normal;color:#000;z-index:1} .all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-btn-close {display:inline-block;position:absolute;top:14px;right:20px;margin:0;font-size:21px;color:#000;outline:none;*width:19px;*height:22px;*background:url('/images/common/btn_h11_close.gif') no-repeat center center; } .all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-layer-tit {padding:18px 0;border-bottom:1px solid #e5e5e5;font-size:15px;font-weight:bold;line-height:15px; } .all-finder-layer .finder-body .finder-tbl th .txt-l .finder-comm-layer .finder-layer-cnt {padding-top:16px;line-height:1.5;font-size:13px; } .all-finder-layer .finder-body .finder-tbl td {padding:5px 10px; } .all-finder-layer .finder-body .txt-input {height:21px;line-height:21px;padding:0 5px;font-size:13px;font-family:'Malgun Gothic'; } .all-finder-layer .finder-body .finder-category {height:40px;overflow:hidden; } .all-finder-layer .finder-body .finder-category.open {height:100%;overflow:visible; } .all-finder-layer .finder-body tr.finder-child-category {display:none; } .all-finder-layer .finder-body tr.finder-child-category th,.all-finder-layer .finder-body tr.finder-child-category td {border-top:none; } .all-finder-layer .finder-body tr.finder-child-category td {background:#fbfbfb; } .all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2 {display:inline-block;margin:3px 5px 3px 0;padding:5px 10px;cursor:pointer;line-height:22px;vertical-align:top;word-break:break-all;color:#9a9a9a; } .all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2 .fa-check {display:none; } .all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2.on {font-weight:bold;color:#000;border:0;border-radius:0;box-shadow:unset; } .all-finder-layer .finder-body tr.finder-child-category td .finder-category2 .finder-cate2.on .fa-check {display:inline-block;margin-right:3px; } .all-finder-layer .finder-body .finder-color {padding-left:10px; } .all-finder-layer .finder-body .finder-price .finder-price-input {display:inline-block;padding-top:5px} .all-finder-layer .finder-body .finder-price .finder-price-input label {display:inline-block;width:110px;padding:0 10px;border:1px solid #ccc;border-radius:3px;color:#666; } .all-finder-layer .finder-body .finder-price .finder-price-input label .txt-input {display:inline-block;width:70px;height:29px;line-height:29px;padding:0;border:none;background:none;color:#333;text-align:right; } .all-finder-layer .finder-body .finder-search {position:relative;padding-left:5px; } .all-finder-layer .finder-body .finder-search label {display:inline-block;width:320px;padding:0 10px;border:1px solid #ccc;border-radius:3px; } .all-finder-layer .finder-body .finder-search label .txt-input {display:block;width:100%;height:29px;line-height:29px;padding:0;border:none;background:none;color:#333;text-align:left; } .all-finder-layer .finder-body .finder-btn-c {padding:30px 0;text-align:center; } .all-finder-layer .finder-body .finder-btn-c a.reset {display:inline-block;width:140px;height:60px;line-height:57px;border:none;border-radius:3px;background:#999;color:#fff;font-size:18px;font-weight:bold;letter-spacing:1px;font-family:'Malgun Gothic';margin-right:15px; } .all-finder-layer .finder-body .finder-btn-c button {display:inline-block;height:60px;line-height:57px;padding:0 30px;*padding:0;border:none;border-radius:3px;background:#000;color:#fff;font-size:18px;font-weight:bold;letter-spacing:-0.5px;font-family:'Malgun Gothic';cursor:pointer; } .all-finder-layer .finder-body .finder-btn-c button span.ico-search {visibility:visible;display:inline-block;width:16px;height:15px;margin-right:10px;margin-top:-4px;*margin-top:0;vertical-align:middle;background:url('/images/common/btn_h15_search.png') no-repeat 0 0; } .all-finder-layer .finder-body .finder-btn-c button span.finder-count {visibility:visible;display:inline-block;height:60px;color:#ffd800;font-size:23px;*vertical-align:middle; } .all-finder-layer .finder-body .finder-btn-c button span.finder-count-toggle {visibility:visible;display:none; } .all-finder-layer .finder-body .finder-options {display:inline-block;margin:3px 5px 3px 0;padding:5px 10px;cursor:pointer;line-height:22px;border:1px solid #fff;vertical-align:top;word-break:break-all; } .all-finder-layer .finder-body .finder-options.on {font-weight:bold;border:1px solid #000;border-radius:20px;box-shadow:2px 2px 3px #d2d2d2; } .all-finder-layer .finder-body .finder-option-color em {display:inline-block;width:22px;height:22px;border-radius:20px;font-size:0;vertical-align:top; } .all-finder-layer .finder-body .finder-option-color.color-picker {width:22px;height:22px;padding:0;border:none; } .all-finder-layer .finder-body .finder-option-color.color-picker.on {border:none; } .all-finder-layer .finder-body .finder-option-color.color-picker .fa-check {display:none;width:22px;height:22px;margin-top:-17px;color:#fff;text-align:center; } .all-finder-layer .finder-body .finder-option-color.color-picker.on .fa-check {display:block; } .all-finder-layer .finder-body .finder-option-color.color-picker.on.finder-option-color-white .fa-check {color:#000; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-black em {background-color:#000; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-white em {background-color:#FFF;width:20px;height:20px;border:1px solid #e5e5e5; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-gray em {background-color:#808080; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-beige em {background-color:#e5d0b2; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-brown em {background-color:#aa6810; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-navy em {background-color:#425583; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-blue em {background-color:#0000ff; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-light-blue em {background-color:#62acff; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-red em {background-color:#ff0000; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-orange em {background-color:#ffa500; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-yellow em {background-color:#ffff00; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-pink em {background-color:#ffc0cb; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-purple em {background-color:#800080; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-jaju em {background-color:#a63f7f; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-khaki em {background-color:#2f5e2f; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-green em {background-color:#008000; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-light-green em {background-color:#72dd95; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-silver em {background-color:#dfdfdf; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-gold em {background-color:#cfbc4e; } .all-finder-layer .finder-body .finder-option-color.finder-option-color-apricot em {background-color:#fbceb1; } .all-finder-layer .finder-body .search-auto-complete-list {display:none;z-index:1;position:absolute;top:30px;left:5px;border:1px solid #ddd;line-height:14px;background:#fff; } .all-finder-layer .finder-body .search-auto-complete-list ul {width:340px;padding:4px 0 6px;border-bottom:1px solid #ddd; } .all-finder-layer .finder-body .search-auto-complete-list ul li {text-align:left; } .all-finder-layer .finder-body .search-auto-complete-list ul li.on {background:#f3f3f3; } .all-finder-layer .finder-body .search-auto-complete-list ul li a {display:block;padding:8px 14px 7px;color:#000;background:none;font-family:'dotum';font-size:12px;letter-spacing:-1px; } .all-finder-layer .finder-body .search-auto-complete-list ul li a strong {color:#ab3e41; } .all-finder-layer .finder-body .search-auto-complete-list ul li a:hover {background:#f2f2f2; } .all-finder-layer .finder-body .search-auto-complete-list ul li a:hover span {border-bottom:1px solid #000; } .all-finder-layer .finder-body .search-auto-complete-list .search-list-close {display:block;padding:10px 11px;text-align:right;color:#999;font-size:11px; } .all-finder-layer .finder-body .finder-search-data .finder-options {border:1px solid #e5e5e5;box-shadow:none; } .all-finder-layer .finder-body .finder-search-data .finder-options .fa-close {margin-left:10px;color: #999; } .flicker-menu { position: relative; } .animate-flicker { word-break: keep-all; position: absolute; width: 100%; } #f-txt-1 { animation: flickerAnimation 5s infinite; display:inline-block; } #f-txt-2 { opacity: 0; display:inline-block; position:relative;} #f-txt-2 { animation: flickerAnimation 5s infinite; animation-delay: 2.5s; } @keyframes flickerAnimation { 0% { opacity: 0; } 5% { opacity: 1; } 45% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 0; } } @-webkit-keyframes blink { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes blink { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes blink { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes slideInUp { 0% { -webkit-transform: translate3d(0,80%,0); transform: translate3d(0,80%,0); visibility: visible } to { -webkit-transform: translateZ(0); transform: translateZ(0) } } .animate__slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp } /* BASIC css end */ /* BASIC css end */ /* BASIC css end */ /* BASIC css end */