/* BASIC css start */ /* 상단 배너 */ #topBanner { position:relative; overflow:hidden } #topBanner .thmb { width:100%; } #topBanner .thmb img { width:100% } #btBnnrClose { margin-top:-9px; position:absolute; top:50%; right:7px; width:17px; height:17px; text-indent:-9999em; background:url(/design/fixntox/10276/m/common/btn_bnnr_close.png) 0 0 no-repeat; background-size:17px auto; cursor:pointer; z-index:10 } /* 상단 */ #header { position:relative; width:100%; z-index:981; } #header .headerNav {position:relative; height:25px; background:#2c2c2c; z-index:10 } #header .headerNav .book_mark { position:absolute; top:0; left:17px; width:31px; height:31px; text-indent:-9999em; background:url(/design/fixntox/10276/m/common/book_mark.png) 0 0 no-repeat; background-size:31px auto } #header .headerNav ul li { margin-left:-1px; position:relative; float:left; width:25%; height:25px } #header .headerNav ul li a { display:block; color:#fff; text-align:center; line-height:25px } #header .headerNav ul li .sp_bubble { margin-left:-20px; position:absolute; top:20px; left:50%; font-size:0; text-align:center } #header .headerNav ul li .sp_bubble .arr { display:block; margin-left:-2px; position:absolute; top:-3px; left:50%; width:6px; height:3px; background:url(/design/fixntox/10276/m/common/arr_bubble.png) 0 0 no-repeat; background-size:6px auto; vertical-align:top } #header .headerNav ul li .sp_bubble p { padding:0 3px; font-size:11px; color:#d72a2a; font-weight:bold; border-radius:15px; background:#fff } #header .headerLnb { position:relative; height:120px; background:white } #header .headerLnb .sideMenuOpen { position:absolute; top:25%; left:15px; font-size:24px; color:#fff; cursor:pointer; transform:translateY(-50%);} #header .headerLnb .sideMenuOpen img { width:36px; } #header .headerLnb .tlogo { position:absolute; top:25%; left:50%; text-align: center;transform:translate(-50%,-50%);} #header .headerLnb .tlogo img { width:100%;} #m_logo{ width: 40px; display: block;} #header .headerLnb .mypage { position:absolute; top:25%; right:15px; font-size:20px; color:#fff; cursor:pointer;transform:translateY(-50%);} #header .headerLnb .mypage img { width:32px;} #header .headerLnb .searchToggle { position:absolute; top:50%; right:15px; font-size:20px; color:#fff; cursor:pointer; transform:translateY(-50%);} #header .headerLnb .searchToggle img { width:17px;} #header .searchLy { display: block; position: absolute; top: 60px; left: 50%; width: 90%; height: 39px; z-index: 100; background: #dfdfdf; border: 2px solid #000; transform: translateX(-50%); border-radius: 30px; } #header .searchLy .search {padding:1px; position:relative; text-align:center; } #header .searchLy .search .delete_btn { display:none; position:absolute; top:10px; right:25px; width:30px; height:24px; font-size:18px; color:#adadad; line-height:24px; z-index:10 } #header .searchLy .search input { width:100%; height:38px; border:none; outline:none;padding-right:50px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border-radius: 30px; overflow: hidden;} #header .searchLy .search .btn_search { position: absolute; top: 9px; right: 10px; font-size: 25px; color: #666; } #header .searchLy .search fieldset{padding:0;border-radius: 30px; overflow: hidden;} #header .searchLy .clearTag { height:200px } .mask { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5; filter:alpha(opacity=50); z-index:982; } .scroll {white-space: nowrap;overflow-x: auto;-webkit-overflow-scrolling:touch;-ms-overflow-style: -ms-autohiding-scrollbar;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;} .scroll::-webkit-scrollbar {display: none;} .main_drag_box {position:relative;background:#fff;} .main_drag_box .navi_arrowleft {position:absolute;top:50%;left:-1px;width:15px;height:15px;transform:translateY(-50%);background: url('/design/fixntox/new/mobile/img/menu_l.png') center center no-repeat;background-size:60%;opacity:0;visibility:hidden;transition:all .3s;z-index:30;} .main_drag_box .navi_arrowright {position:absolute;top:50%;right:-1px;width:15px;height:15px;transform:translateY(-50%);background: url('/design/fixntox/new/mobile/img/menu_r.png') center center no-repeat;background-size:60%;opacity:1;transition:all .3s;z-index:30;} .main_drag_box .navi_hidden_left {position:absolute;top:50%;left:0px;width:65px;height:calc(100% - 1px);transform:translateY(-50%);background: url('/design/fixntox/mobile/img/common/navi_hidden_left.png') center center repeat-y;opacity:0;visibility:hidden;transition:all .3s;z-index:29;} .main_drag_box .navi_hidden_right {position:absolute;top:50%;right:0px;width:65px;height:calc(100% - 1px);transform:translateY(-50%);background: url('/design/fixntox/mobile/img/common/navi_hidden_right.png') center center repeat-y;opacity:1;transition:all .3s;z-index:29;} .main_drag_navi {font-size:0;width:100%;border-top:1px solid #efefef;border-bottom:1px solid #efefef;padding:0 5px;} .main_drag_navi > li {display:inline-block;vertical-align:middle;padding:15px 0} .main_drag_navi > li > a {display:block;width:auto;padding:0 24px;border-right:1px solid #efefef;font-size:14px;} .main_drag_navi > li > a.font-color-red {color:#d72a2a;} .main_drag_navi > li:last-child > a {border-right:0;} /* 사이드 메뉴 */ #asideMenu { position:fixed; top:0; left:-102%; width:70%; height:100%; background:#fff; z-index:985; overflow-y:auto; overflow-x:hidden;-webkit-overflow-scrolling:touch;} #asideMenu .sidemenu_login_box {width:100%;height:50px;background:#000;position:relative; display: flex; align-items: center; justify-content: space-between; padding: 5px 20px; box-sizing: border-box;} #asideMenu .sidemenu_login_box > div {padding:5px 20px;color:#fff;border:1px solid #fff;border-radius:15px;} #asideMenu .sidemenu_login_box > div a {color:#fff;} #asideMenu .quick_membermenu {margin-bottom:20px;} #asideMenu .quick_membermenu ul {font-size:0} #asideMenu .quick_membermenu ul li {display:inline-block;width:50%;vertical-align:middle;} #asideMenu .quick_membermenu ul li a {display:block; width:auto; font-size:14px; color:#333;padding:20px;text-align:center;background:#fff;border-right:1px solid #f5f5f5;border-bottom:1px solid #f5f5f5;position:relative;} #asideMenu .quick_membermenu ul li a .basket_num {display:inline-block;margin-left:13px;vertical-align:middle;position:relative;} #asideMenu .quick_membermenu ul li a .basket_num span.icon {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px;background:red;border-radius:100%;} #asideMenu .quick_membermenu ul li a .basket_num span.icon .num {position:absolute;display:block;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:11px;} #asideMenu .asideNav {position:relative; overflow:hidden;margin-bottom:20px;} #asideMenu .asideNav .aside_head {width:100%;height:50px;position:relative;background:#fff;} #asideMenu .asideNav .aside_head .title_icon {position:absolute;top:50%;left:10px;transform:translateY(-50%);width:20px;height:20px;background:url('/design/fixntox/mobile/img/common/brand_icon.png') center center no-repeat;background-size:100%;} #asideMenu .asideNav .aside_head .title_brand {position:absolute;top:50%;left:35px;transform:translateY(-50%);font-size:13px;font-weight:900;margin-left:10px;} #asideMenu .asideNav .aside_head .title_brand em {font-size:11px;font-weight:400;color:#aeaeae;} #asideMenu .asideNav .aside_head .title_arrow {position:absolute;right:10px;top:50%;transform:translateY(-50%);width:20px;height:20px;background: url(/design/fixntox/new/mobile/img/more_go.png) no-repeat 100%;} #asideMenu .asideNav nav {background:#fff;} #asideMenu .asideNav .scroll_box {position:relative;} #asideMenu .asideNav .scroll_box .arrowleft {position:absolute;top:35%;left:5px;transform:translateY(-50%);width:15px;height:15px;background:#fff url('/design/fixntox/mobile/img/common/m_arrowL.png') center center / 30% no-repeat;border-radius:100%;opacity:0;visibility:hidden;transition:all .3s;z-index:30;border:1px solid #eaeaea;} #asideMenu .asideNav .scroll_box .arrowright {position:absolute;top:35%;right:5px;transform:translateY(-50%);width:15px;height:15px;background:#fff url('/design/fixntox/mobile/img/common/m_arrowR.png') center center / 30% no-repeat;border-radius:100%;opacity:1;transition:all .3s;z-index:30;border:1px solid #eaeaea;} #asideMenu .asideNav .scroll_box .navi_hidden_left {position:absolute;top:50%;left:0px;width:65px;height:calc(100% - 1px);transform:translateY(-50%);background: url('/design/fixntox/mobile/img/common/navi_hidden_left.png') center center repeat-y;opacity:0;visibility:hidden;transition:all .3s;z-index:29;} #asideMenu .asideNav .scroll_box .navi_hidden_right {position:absolute;top:50%;right:0px;width:65px;height:calc(100% - 1px);transform:translateY(-50%);background: url('/design/fixntox/mobile/img/common/navi_hidden_right.png') center center repeat-y;opacity:1;transition:all .3s;z-index:29;} #asideMenu .asideNav .scroll {font-size:0;white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar;background:#fff;padding:0 10px;} #asideMenu .asideNav .scroll::-webkit-scrollbar {display: none;} #asideMenu .asideNav .scroll > div {font-size:12px;display:inline-block;vertical-align:middle;} #asideMenu .asideNav .scroll > div > a {display:block;width:auto;position:relative;padding:10px;} #asideMenu .asideNav .scroll > div > a > span {display:block;width:65px;height:65px;background:#ddd;border-radius:100%;margin-bottom:50px;position:relative;} #asideMenu .asideNav .scroll > div:nth-child(1) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu01.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(2) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu03.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(3) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu02.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(4) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu04.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(5) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu06.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(6) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu07.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(7) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu08.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div:nth-child(8) > a > span {background:#eaeaea url('/design/fixntox/mobile/img/common/sidebar_scrollmenu09.jpg') center center no-repeat;background-size:100%;} #asideMenu .asideNav .scroll > div > a > span > .brand_name {display:block;position:absolute;left:50%;bottom:-30px;transform:translateX(-50%);font-size:11px;} #asideMenu .category:after{clear: both; display: block;content: ""} #asideMenu .category { background: #f1f1f1; margin-top: 50px; padding: 20px 0;} #asideMenu .category .category_title {padding:20px;font-size:15px;font-weight:900;border-bottom:1px solid #000;position: relative;} #asideMenu .category .category_title > .go{ position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; background: url(/design/fixntox/new/mobile/img/more_go.png) no-repeat 100%; background-size: 90%; } #asideMenu .category > li {border-bottom:1px solid #efefef; width: 100%; box-sizing: border-box;text-align: center; font-size: 14px;} #asideMenu .category > li > a {display:block;width:auto;padding:20px; box-sizing: border-box;} #asideMenu .category.line > li{width: 100%;} #asideMenu .category.line > li a{text-align: left;} #asideMenu .customer {font-size:0;border-top:1px solid #efefef;border-bottom:1px solid #efefef;margin-top:20px;background:#fff;} #asideMenu .customer > li {font-size:12px;display:inline-block;width:50%;vertical-align:middle;text-align:center;line-height:0;} #asideMenu .customer > li > a {display:block;width:auto;padding:20px;color:#333;font-weight:100;border-right:1px solid #f5f5f5;border-bottom:1px solid #f5f5f5;vertical-align:middle;font-size: 14px;} #asideMenu .customer > li > a > i.customer_icon {display:inline-block;width:20px;height:20px;vertical-align:middle;margin-top:-2px;margin-right:10px;} #asideMenu .customer > li:nth-child(1) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/customer_special_icon.png') center center no-repeat;background-size:100%;} #asideMenu .customer > li:nth-child(2) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/customer_event_icon.png') center center no-repeat;background-size:100%;} #asideMenu .customer > li:nth-child(3) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/customer_noticel_icon.png') center center no-repeat;background-size:100%;} #asideMenu .customer > li:nth-child(4) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/customer_qna_icon.png') center center no-repeat;background-size:100%;} #asideMenu .review_list {font-size:0;border-top:1px solid #efefef;border-bottom:1px solid #efefef;margin-top:20px;background:#fff;} #asideMenu .review_list > li {font-size:12px;display:inline-block;width:50%;vertical-align:middle;text-align:center;line-height:0;} #asideMenu .review_list > li > a {display:block;width:auto;padding:20px;color:#333;font-weight:700;border-right:1px solid #f5f5f5;border-bottom:1px solid #f5f5f5;vertical-align:middle;} #asideMenu .review_list > li > a > i.customer_icon {display:inline-block;width:20px;height:20px;vertical-align:middle;margin-top:-2px;margin-right:10px;} #asideMenu .review_list > li:nth-child(1) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/icon_review.png') center center no-repeat;background-size:100%;} #asideMenu .review_list > li:nth-child(2) > a > i.customer_icon {background:url('/design/fixntox/mobile/img/common/icon_photo_review.png') center center no-repeat;background-size:100%;} #asideMenu .customer_info {background:#fff;border-top:1px solid #efefef;margin-top:20px;padding:0 10px;box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;} #asideMenu .customer_info > li {border-bottom:1px solid #efefef;} #asideMenu .customer_info > li > div {display:block;width:auto;} #asideMenu .customer_info > li > div > ul {font-size:0;} #asideMenu .customer_info > li > div > ul > li {font-size:12px;display:inline-block;vertical-align:middle;} #asideMenu .customer_info > li > div > ul > li:nth-child(1) {width:30px;} #asideMenu .customer_info > li > div > ul > li:nth-child(2) {width:calc(40% - 15px);} #asideMenu .customer_info > li > div > ul > li:nth-child(3) {width:clac(60% - 15px);} #asideMenu .customer_info > li > div > ul > li > a {display:block;width:auto;padding:10px 0;box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;} #asideMenu .customer_info > li > div > ul > li:nth-child(1) a {padding:5px;} #asideMenu .customer_info > li > div > ul > li > a img {vertical-align:middle;} #asideMenu .customer_info > li > div > ul > li:nth-child(2) a {font-weight:700;font-size:11px;} #asideMenu .mt20{margin-top: 20px;} #asideClose { background:url(/design/fixntox/new/mobile/img/btn_aside_close.png) 0 0 no-repeat; height:25px; background-size:100%; width:25px; cursor:pointer; z-index:9998 } .ft_info li { padding: 10px 20px;} .ft_info li h3 { text-align: left; font-weight: bold; margin-bottom: 10px; } .ft_info li p { text-align: left; font-size: 12px; } .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* 위로이동버튼 */ .btn_up {display:block;position:fixed;bottom:265px;right:10px;width:40px;height:40px;background:url('/design/fixntox/mobile/img/common/main_btn_02.png') center center / 100% no-repeat;z-index:500;} /* 최근 본 상품 */ .section_fixedFooter .btn_toggle_area .cart {} input[id^='shopping']{display:none;} input[id^='shopping'] + label {display:block;position:fixed;right:10px;bottom:310px;width:40px; height:40px;background:url('/design/fixntox/mobile/img/common/main_btn_01.png') center center / 100% no-repeat;z-index:500;} input[id^='shopping'] + label i {} input[id^='shopping'] + label + div {position:fixed;left:0;bottom:-100%;width:100%;height:250px;background:rgba(255,255,255,.9);visibility:hidden;transition:all .35s;z-index:980;} input[id^='shopping']:checked + label + div {visibility:visible;bottom:0;} .product_view_box {position:relative;} .product_view_box .history_done {text-align:center;padding:25px;} .product_view_box > .title_box {background:#000;position:relative;} .product_view_box > .title_box > h3 {display:block;text-align:center;font-size:14px;color:#fff;padding:10px 25px;} .product_view_box > .title_box > .history_close {display:block;width:20px;height:20px;position:absolute;top:50%;right:20px;transform:translateY(-50%);border:1px solid #fff;} .product_view_box > .title_box > .history_close > span {display:block;width:100%;height:1px;background:#fff;} .product_view_box > .title_box > .history_close > span:nth-child(1) {position:absolute;top:50%;transform:rotate(45deg) translateY(-50%);} .product_view_box > .title_box > .history_close > span:nth-child(2) {position:absolute;top:50%;transform:rotate(-45deg) translateY(-50%);} .product_view_box > .view_product_con {padding:20px;overflow-x:scroll;} .product_view_box > .view_product_con ul {font-size:0;} .product_view_box > .view_product_con ul li {display:inline-block;vertical-align:top;font-size:12px;width:150px;} .product_view_box > .view_product_con ul li a {display:block;width:auto;padding:15px;} .product_view_box > .view_product_con ul li a p {text-align:center;margin-top:10px;overflow:hidden;text-overflow:ellipsis} #header .user_basket_quantity{ position: absolute; width: 22px; height: 22px; background: #ff2d68; text-align: center;font-size: 16px; border-radius: 50%; line-height: 20px; right: -6px; top: -6px; font-weight: 100; } .brand_menu { width: 23px; position: absolute; right: -27px; top: 6px; } .pup_brand_box { width: 250px; margin: 0 auto; z-index: 9999; position: fixed; left: 50%;transform: translateX(-50%);top:30px;border-radius: 30px; overflow: hidden; display: none;} .pup_brand_box ul li { height: 50px; text-align: center; background: #fff; line-height: 40px;border-bottom: 1px solid #ddd; } .pup_brand_box ul li img{ height: 100%; } .pup_brand_box ul li:last-child{ line-height: 40px;} .pup_brand_box ul li:last-child a{ width: 100%; height: 100%; display: block; font-size: 16px; line-height: 48px; background: #dddddd; } .brand_mark { width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.6); position: fixed; top: 0; left: 0; z-index: 1600; display: none; } .pup_brand_box.on{display: block;} .brand_mark.on{display: block;} #select_list{position: absolute;width: 100%;z-index: 99999;background: #fff; top: 54px; border: 1px solid #ebebeb;} #select_list ul li{} #select_list ul li:hover{background: #f8f8f8} #select_list ul li a{color: #373737;font-size: 14px;line-height: 30px; display: block; padding: 0 20px; text-align: left;} #select_list span.off_btn { display: block; text-align: right; padding: 5px; border-top: 1px solid #ebebeb; } #asideMenu .mt20 { margin-top: 20px; display: flex; flex-direction: column; } .nav_item { list-style-type: none; padding: 0; margin: 0; display: flex; flex-direction: column; align-items: flex-start; } .nav_item > li { display: block; position: relative; } .nav_item a { display: block; color: #000; text-align: left; padding: 14px 16px; text-decoration: none; font-size: 17px; } .dropdown-content { display: none; min-width: 160px; padding-left: 13px; z-index: 1; } .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; font-weight: 400; font-size: 15px; } .dropdown-content a:hover { background-color: #f1f1f1; } .m_main_banner { height: calc(100% - 180px); } .bx-viewport{height: 100% !important;} .new-slider-wrap .bx-wrapper{height: 100%;max-height: 500px;} .slider-img{height: 100%;} .slider-img li{height: 100%;} .slider-img li a{height: 100%; display: block;} .slider-img li a img{height: 100%;} .new-slider-wrap{height: 100% !important;} /* BASIC css end */