/*********** Fonts ***********/ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&family=Roboto:wght@400;500;700&display=swap'); @font-face { font-family:"Pretendard"; font-weight:Regular; font-style:normal; src:url("/assets/fonts/Pretendard/Pretendard-Regular.otf") format("opentype"),url("/assets/fonts/Pretendard/Pretendard-Regular.ttf") format("truetype") } @font-face { font-family:"PretendardExtraBold"; font-weight:Regular; font-style:normal; src:url("/assets/fonts/Pretendard/Pretendard-ExtraBold.otf") format("opentype"),url("/assets/fonts/Pretendard/Pretendard-ExtraBold.ttf") format("truetype") } @font-face { font-family:"Pretendard-SemiBold"; font-weight:Regular; font-style:normal; src:url("/assets/fonts/Pretendard/Pretendard-SemiBold.otf") format("opentype"),url("/assets/fonts/Pretendard/Pretendard-SemiBold.ttf") format("truetype") } *{margin:0;padding:0;} html { font-size: 16px } body{overflow-x: hidden; } body, div, p, blockquote, pre, address, ul, ol, li, dl, dt, dd, table, caption, th, td, form, fieldset, legend, hr, label, button { margin:0; padding:0; color:#333333; font-weight:400; font-family:'Pretendard','Roboto',sans-serif; } @media (max-width:992px) { html,body {font-size: 14px; } } i{font-style:normal;} i.color_r{color:#C5363C;} input { background:transparent; } input:focus, button { outline:none; } button:focus{ border: none; outline:none; } img{vertical-align:middle;} p{margin-bottom:0} button{cursor: pointer;} em{font-style:normal;} ul,li{list-style:none; box-sizing: border-box;} div { display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} td, input{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} a{text-decoration:none !important;outline:none; color:#333; } a:hover{color:#333; } .cls{clear:both;} .pc {display:block !important;} .mobile {display:none !important;} /*[상단] /////////////////////////////////////////////////////////// */ .header_area { position:relative; /* width:100%; top:0; left:0;*/ z-index:499; transition:all 0.3s ease-in; background:#fff; } /*최상단 배너*/ .header_area #top_benner_bg{ position: relative; width: 100%; height: 40px; overflow: hidden; background: #342016; } #top_benner_bg .topSlider{ position: relative; width: 100%; height: 40px; } #top_benner_bg .top_banner_img{ margin-left: -950px; position: absolute; top: 0; left: 50%; width: 100%; height: 40px; z-index:1999 } #top_benner_bg .topBannerClose{ position: absolute; top: -38px; right: 0; margin-top: 2px; z-index:2000; } #top_benner_bg .topBannerClose a { display: block; font-size: 20px; color: rgba(255,255,255, 0.5); text-align: center; vertical-align:middle; } .site-wrap:before { -webkit-transition:.3s all ease-in-out; -o-transition:.3s all ease-in-out; transition:.3s all ease-in-out; background:rgba(0,0,0,0.6); content:""; position:absolute; z-index:2000; top:0; left:0; right:0; bottom:0; opacity:0; visibility:hidden; } .topMain{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-align-items: center; align-items: center; width: 100%; text-align: left; padding: 23px 0 24px; } .topMain .logoArea{ width:380px; } .topMain .logoArea img{ height:30px } .topMain .searchArea{ width:440px; } .nav-cart #cartCnt{position:relative;} .nav-cart #cartCnt .cart_count{position:absolute; top:-6px; right:-10px; font-size:11px; width:15px; height:15px;display:block; text-align:center; background:#FF5151; border-radius:50%; color:#fff; } .search_input_box { width:100%; z-index:999; text-align:center; background:#f5f5f5; border-radius:5px } .top_search_inner{ width:100%; position:relative; margin:0 auto; height:46px; } .search_input_box .form-control { background:transparent; border:0; color:#222; font-weight:400; font-size:14px; padding:0px 15px 0 15px; } .search_input_box.form-control:focus { box-shadow:none; outline:none; } .search_input_box input.placeholder { color:#222; font-size:14px; } .search_input_box input:-moz-placeholder { color:#222; font-size:14px; } .search_input_box input::-moz-placeholder { color:#222; font-size:14px; } .search_input_box input::-webkit-input-placeholder { color:#222; font-size:14px; } .search_input_box .top_search_btn { padding-right:15px } .search_input_box .top_search_btn i{ color:#666; font-size:26px; } .top-search-icon{width:33px; text-align:center;} .topMain .btnArea{ width:calc(100% - 380px - 440px); } .topMain .btnArea ul{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-end; -ms-align-items: center; align-items: center; } .topMain .btnArea li{ text-align:center; margin-right:25px } .topMain .btnArea li:last-child{ margin-right:0 } .topMain .btnArea li a i{ font-size:25px; color:#666 } .topMain .btnArea li a, .topMain .btnArea li a p{ color:#666; font-size:12px } .main_menu{ height: 45px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } .main_menu .nav-main-category{ display: table; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: calc(100% - 225px); height: 43px; margin-left: 225px; } .main_menu .nav-main-category li { position: relative; display: table-cell; display: flex; -ms-align-items: center; align-items: center; } .main_menu .nav-main-category li a{ display: inline-block; padding: 0 0px; font-size: 16px; font-weight: 500; line-height: 41px; color: #333; } main_menu ._vl { position: absolute; top: 12px; left: 148px; width: 1px; height: 20px; background-color: #ddd; } .main_menu .button-category { position: relative; float: left; line-height:41px; width: 94px; height: 41px; border: 0 none; font-size: 16px; font-weight: 500; z-index: 12; padding-left:30px; } .main_menu .button-category[data-expanded="false"] { } .main_menu .button-category[data-expanded="false"]:before{ content: "\e68e"; display:block; position:absolute; top: 0px; left:0; font-size:20px; font-family: 'themify'; color:#4FB748; } .main_menu .button-category[data-expanded="true"]:before { content: "\e68e"; display:block; position:absolute; top: 0px; left:0; font-size:20px; font-family: 'themify'; color:#4FB748; } .main_menu .button-category ._text { visibility: hidden; } .dh3aa { position: absolute; top: 43px; left: 0; z-index: 100; } .common-category { zoom: 1; position: relative; border: 1px solid #ccc; background-color: #fff; letter-spacing: -1px; overflow: hidden; } .common-category:after { content: " "; display: block; clear: both; } .common-category[data-hidden="true"] { display: none; } .common-category:before { content: " "; position: absolute; top: 0; bottom: 0; left: 210px; width: 1px; background-color: #eee; } .common-category ul, .common-category li { margin: 0; padding: 0; } .common-category ul { list-style-type: none; } .common-category a { display: block; color: #222; font-size:14px; } .common-category .title { position: absolute; visibility: hidden; } .common-category .tabs { position: relative; float: left; border-top: 0 none; border-right: 0 none; width: 210px; background-color: #fff; } .common-category .item1 + .item1 { border-top: 1px solid #eee; } .common-category .tab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; padding-left: 30px; padding-right: 30px; height: 33px; line-height: 33px; font-size:14px } .common-category .tab:after { display: none; content: "\56"; position: absolute; top: 0; bottom: 0; right: 20px; font-family: dripicons-v2!important; } .common-category[data-current="1"] .tab[data-index="1"], .common-category[data-current="2"] .tab[data-index="2"], .common-category[data-current="3"] .tab[data-index="3"], .common-category[data-current="4"] .tab[data-index="4"], .common-category[data-current="5"] .tab[data-index="5"], .common-category[data-current="6"] .tab[data-index="6"], .common-category[data-current="7"] .tab[data-index="7"], .common-category[data-current="8"] .tab[data-index="8"], .common-category[data-current="9"] .tab[data-index="9"], .common-category[data-current="10"] .tab[data-index="10"], .common-category[data-current="11"] .tab[data-index="11"], .common-category[data-current="12"] .tab[data-index="12"], .common-category[data-current="13"] .tab[data-index="13"], .common-category[data-current="14"] .tab[data-index="14"], .common-category[data-current="15"] .tab[data-index="15"], .common-category[data-current="16"] .tab[data-index="16"], .common-category[data-current="17"] .tab[data-index="17"], .common-category[data-current="18"] .tab[data-index="18"], .common-category[data-current="19"] .tab[data-index="19"], .common-category[data-current="20"] .tab[data-index="20"], .common-category[data-current="21"] .tab[data-index="21"], .common-category[data-current="22"] .tab[data-index="22"], .common-category[data-current="23"] .tab[data-index="23"], .common-category[data-current="24"] .tab[data-index="24"], .common-category[data-current="25"] .tab[data-index="25"], .common-category[data-current="26"] .tab[data-index="26"], .common-category[data-current="27"] .tab[data-index="27"], .common-category[data-current="28"] .tab[data-index="28"], .common-category[data-current="29"] .tab[data-index="29"], .common-category[data-current="30"] .tab[data-index="30"] { font-weight: 500; background-color: #4FB748; color: #fff; font-size:14px } .common-category[data-current="1"] .tab[data-index="1"]:after, .common-category[data-current="2"] .tab[data-index="2"]:after, .common-category[data-current="3"] .tab[data-index="3"]:after, .common-category[data-current="4"] .tab[data-index="4"]:after, .common-category[data-current="5"] .tab[data-index="5"]:after, .common-category[data-current="6"] .tab[data-index="6"]:after, .common-category[data-current="7"] .tab[data-index="7"]:after, .common-category[data-current="8"] .tab[data-index="8"]:after, .common-category[data-current="9"] .tab[data-index="9"]:after, .common-category[data-current="10"] .tab[data-index="10"]:after, .common-category[data-current="11"] .tab[data-index="11"]:after, .common-category[data-current="12"] .tab[data-index="12"]:after, .common-category[data-current="13"] .tab[data-index="13"]:after, .common-category[data-current="14"] .tab[data-index="14"]:after, .common-category[data-current="15"] .tab[data-index="15"]:after, .common-category[data-current="16"] .tab[data-index="16"]:after, .common-category[data-current="17"] .tab[data-index="17"]:after, .common-category[data-current="18"] .tab[data-index="18"]:after, .common-category[data-current="19"] .tab[data-index="19"]:after, .common-category[data-current="20"] .tab[data-index="20"]:after, .common-category[data-current="21"] .tab[data-index="21"]:after, .common-category[data-current="22"] .tab[data-index="22"]:after, .common-category[data-current="23"] .tab[data-index="23"]:after, .common-category[data-current="24"] .tab[data-index="24"]:after, .common-category[data-current="25"] .tab[data-index="25"]:after, .common-category[data-current="26"] .tab[data-index="26"]:after, .common-category[data-current="27"] .tab[data-index="27"]:after, .common-category[data-current="28"] .tab[data-index="28"]:after, .common-category[data-current="29"] .tab[data-index="29"]:after, .common-category[data-current="30"] .tab[data-index="30"]:after { display: block; } .common-category .panels { margin-left: 210px; min-width: 210px; border-top: 0 none; border-left: 0 none; } .common-category .panels ._title { margin-bottom: 15px; padding-bottom: 9px; border-bottom: 1px solid #ddd; font-size: 23px; font-weight: normal; color: #666; } .common-category .panel { zoom: 1; display: none; } .common-category .panel:after { content: " "; display: block; clear: both; } .common-category .list { float: left; padding-top: 13px; padding-left: 30px; width: 210px; box-sizing: border-box; } .common-category .list[data-columns="true"] { border-right: 1px solid #eee; } .common-category[data-current="1"] .panel[data-index="1"], .common-category[data-current="2"] .panel[data-index="2"], .common-category[data-current="3"] .panel[data-index="3"], .common-category[data-current="4"] .panel[data-index="4"], .common-category[data-current="5"] .panel[data-index="5"], .common-category[data-current="6"] .panel[data-index="6"], .common-category[data-current="7"] .panel[data-index="7"], .common-category[data-current="8"] .panel[data-index="8"], .common-category[data-current="9"] .panel[data-index="9"], .common-category[data-current="10"] .panel[data-index="10"], .common-category[data-current="11"] .panel[data-index="11"], .common-category[data-current="12"] .panel[data-index="12"], .common-category[data-current="13"] .panel[data-index="13"], .common-category[data-current="14"] .panel[data-index="14"], .common-category[data-current="15"] .panel[data-index="15"], .common-category[data-current="16"] .panel[data-index="16"], .common-category[data-current="17"] .panel[data-index="17"], .common-category[data-current="18"] .panel[data-index="18"], .common-category[data-current="19"] .panel[data-index="19"], .common-category[data-current="20"] .panel[data-index="20"], .common-category[data-current="21"] .panel[data-index="21"], .common-category[data-current="22"] .panel[data-index="22"], .common-category[data-current="23"] .panel[data-index="23"], .common-category[data-current="24"] .panel[data-index="24"], .common-category[data-current="25"] .panel[data-index="25"], .common-category[data-current="26"] .panel[data-index="26"], .common-category[data-current="27"] .panel[data-index="27"], .common-category[data-current="28"] .panel[data-index="28"], .common-category[data-current="29"] .panel[data-index="29"], .common-category[data-current="30"] .panel[data-index="30"] { display: block; } .common-category .step2_link { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 38px; height: 28px; } .common-category .step2_link:hover { color: #4FB748; } .common-category .button-close { position: absolute; top: -5px; right: 0; width: 40px; height: 40px; border: 0 none; overflow: hidden; background:#fff; } .common-category .button-close i { font-size:30px; color:#666; font-weight:300 } /*최상단 메뉴바*/ .top_layout{height:33px; line-height:33px;width:100%;padding:0px 0; border-bottom:1px #eee solid;} .left_menu_v{position:absolute;top:0px;z-index:1; right:50%; width:600px;} .left_menu_v ul:after{content:'';display:block; clear:both} .left_menu_v li{float:left; margin-right:20px} .left_menu_v li a{padding-left:18px; position:relative;} .left_menu_v li:last-child a{padding-left:21px;} .left_menu_v li a:after{content:'';display:block; width:12px; height:13px; background:url(/webftp/top_ico01.png) no-repeat; position:absolute; top:4px; left:0} .left_menu_v li:last-child a:after{ background:url(/webftp/top_ico02.png) no-repeat; top:2px; width:16px} .right_menu_v{position:absolute;top:0px;z-index:1; right:0; text-align:right;} .right_menu_v span{cursor:pointer;} .right_menu_v {display: block; } .right_menu_v ul:after{content:'';display:block; clear:both} .right_menu_v ul{float:right;} .right_menu_v li{float:left;margin-right:18px; line-height:33px; } .right_menu_v li:last-child{margin-right:0} .right_menu_v li a{color:#888; font-size:13px} /*로고*/ .logo_box{ padding:0px 0px 0px 0px ;position:relative; height:122px;} .logo_box .logo_v{padding-top:39px} /*검색창*/ div.top_searchbox{ top:33px; height:56px} div.top_searchbox div.search_tx{padding:0 14px ;} div.top_searchbox div.search_tx input{border:none; height:50px; line-height:50px; font-size: 13px!important; font-weight: 500; color:#666; font-family: 'Pretendard';} div.top_searchbox div.search_btn{position:absolute;right:12px;top:12px; cursor:pointer;} .search_tx input::-webkit-input-placeholder { font-size: 13px!important; font-weight: 500; color:#666; font-family: 'Pretendard';} .search_tx input:-ms-input-placeholder {font-size: 13px!important; font-weight: 500; color:#666; font-family: 'Pretendard'; } .search_tx input::placeholder { font-size: 13px!important; font-weight: 500; color:#666; font-family: 'Pretendard';} .header_area .main_menu { position:relative; } .body-scroll-none{ overflow: hidden!important } .offcanvas-menu .site-wrap { position:absolute; height:100%; width:100%; z-index:2; overflow:hidden; } .offcanvas-menu .site-wrap:before { opacity:1; visibility:visible; } /* Navbar */ .allcategory_menu{ padding-left:25px!important; position:relative!important; text-align:left!important; } .allcategory_menu:before{ content: "\e68e"; display:block; position:absolute; top: 0px; left:0; font-size:20px; font-family: 'themify'; } .flag_kor, .flag_eng{ position:relative; padding-left:40px; font-size:13px; } .flag_kor:before{ content:''; display:block; width:25px; height:16px; background:url(/webftp/main_top_kor.png) no-repeat; position:absolute; top:7px; left:13px; } .flag_eng:before{ content:''; display:block; width:25px; height:16px; background:url(/webftp/main_top_eng.png) no-repeat; position:absolute; top:7px; left:13px; } .language_selection .flag:before{ top:2px!important; left:10px!important; } .language_selection .dropdown-menu{ min-width: 100px } .dis-none{display:none!important;} .top-close-icon .dis-none{display:block!important;} .top-close-icon .search{display:none!important;} .best_search{display:none; margin-top:20px} .mo_menu{display:none!important;} @media (max-width: 1200px) { .topMain .logoArea {width:280px} .topMain .btnArea { width: calc(100% - 280px - 440px); } } @media (max-width: 1024) { .topMain .searchArea { width: 340px;} .topMain .btnArea { width: calc(100% - 280px - 340px); } } @media (max-width: 992px) { .topMain{padding:20px 0 15px; justify-content: space-between;} .header_area .main_menu{display:none} .topMain .searchArea, .topMain .btnArea{display:none;} .moUtil{ justify-content: flex-start; align-items: center; } .moUtil a{margin-left:10px; display: flex; align-items: center; position:relative;} .moUtil a i{font-size:24px; line-height:1} .moUtil a.icons i:before{ } .moUtil .icons .cart_count{position:absolute; top:0px; right:-10px; font-size:11px; width:15px; height:15px;display:block; text-align:center; background:#FF5151; border-radius:50%; color:#fff; } .header_area.navbar_fixed{ position:fixed; top:-60px; width:100% } .topMain .logoArea img{height:25px} } /********************************* 하단 *********************************/ footer{background:#fff; color:#707070; position:relative; padding:30px 0 50px 0; border-top:1px #ddd solid; } footer .footer-area{ } footer .footer-tittle h4{ margin-bottom:15px;font-size: 16px; font-family:"Montserrat",'Pretendard',sans-serif; } footer .footer-tittle li a{color:#888; font-size:14px; display:block; padding:0px 0;text-transform: uppercase;} footer .footer-tittle li a:hover{color:#888} footer .footer-tittle li {color:#888; padding:3px 0} footer .footer-area .footer-top{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; } footer .footer-logo{ margin-right:30px } footer .footer-logo a{ font-family: 'Abril Fatface', cursive; font-size:22px} footer .footer-logo a:hover{color:#333} footer .footer-logo img{height:20px; filter: grayscale(100%);} footer .cs-info{color:#888; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -ms-align-items: center; align-items: center; } footer .cs-info span, footer .cs-info strong{margin-right:10px} footer .cs-info strong{font-size:18px; font-family:"Montserrat",'Pretendard',sans-serif; color:#000} footer .bank_info .bank_info_num{font-size:18px; font-family:"Montserrat",'Pretendard',sans-serif;} span.f_bold{font-weight:600;} span.color_r{color:#C5363C;} span.or_cancel{background:#fff;border:1px solid red;color:red;padding:2px 10px;} span.rb_w{font-weight:600;padding:4px 5px;background:red;color:#fff;margin-left:5px;} span.qty_btn{cursor:pointer;padding:7px 6px;border:1px solid #e1e1e1;margin-left:10px;} span.qty_btn2{cursor:pointer;padding:7px 6px ;border:1px solid #e1e1e1;margin-left:2px;} footer .footer-company-info{ margin-top:15px } footer .footer-company-info p{ line-height:160%; } footer .footer-company-info p span{ display:inline-block; margin-right:30px } footer .footer-copy-right { padding-top: 15px; padding-bottom:30px} footer .footer-copy-right .copy_info{margin-bottom:10px} footer .footer-copy-right p{ } footer .footer-copy-right p span{display:inline-block; margin-right:30px } footer .footer-menu{ border-top:1px #ddd solid; border-bottom:1px #ddd solid; padding:10px 0 } footer .footer-menu .footerMenu{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; } footer .footer-menu .footerMenu li{ padding-right:30px; position:relative; } footer .footer-menu .footerMenu li:after{ content:''; display:block; position:absolute; top:5px; right:15px; width:1px; height:10px; background:#dfdfdf; } footer .footer-menu .footerMenu li:last-child:after{ display:none; } footer .footer-menu .footerSns{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-end; -ms-align-items: center; align-items: center; } footer .footer-menu .footerSns li{ margin-left:15px } footer .footer-menu .footerSns li i{ font-size:16px } .mobile_footer{background:#fff; border-top:1px #ddd solid; position:fixed; left:0; bottom:0; width:100%; z-index:10} .mobile_footer ul{ display: -webkit-flex; display: flex; } .mobile_footer li{ text-align: center; -webkit-flex: 1; flex: 1; display: inline; padding:10px 0; margin: 0; text-align: center; position: relative; color:#999; } .mobile_footer li i{ display:block; margin-bottom:5px; font-size:18px; } .mobile_footer li p{ font-size:11px } .mobile_footer .mo_footer_btn_box{ position: relative;z-index:95 } .mobile_footer .mo_footer_btn_box a{ width:35px; height:35px; background:#fff; box-shadow: 0.2rem 0.2rem 0.5rem 0 rgba(0, 0, 0, 0.05); border-radius:5px; display: flex; justify-content: center; align-items: center; } .mobile_footer .mo_footer_btn_box a i{ font-size:18px; } .mobile_footer .mo_footer_btn_box .page_back{ position: absolute; left:15px; bottom:15px; z-index:95 } .mobile_footer .mo_footer_btn_box .page_up{ position: absolute; right:15px; bottom:15px; transition: all .2s linear; transform: translateX(6.1rem); z-index:95 } .mobile_footer .mo_footer_btn_box .page_up.hidBtn{ transform: translateX(0); } @media (max-width: 992px) { footer{ padding:30px 0 110px 0; } footer .footer-menu{border-bottom:none;} footer .footer-menu .footerSns{justify-content: flex-start; margin-top:10px} footer .footer-menu .footerMenu li{padding-right:20px;} footer .footer-menu .footerMenu li a{font-size:12px;} footer .footer-menu .footerMenu li:after{ right:10px; } footer .footer-menu .footerSns li:first-child{margin-left:0} } /********************************* 오른쪽퀵배너 *********************************/ .quick_menu{ } .quick_menu li{border:1px #ddd solid; border-right:none; border-bottom:none;cursor:pointer;} .quick_menu li:last-child{border-bottom:1px #ddd solid;} .divMenubox{border:1px #ddd solid; width:90px; padding:0 5px} .divMenubox .quick_contents{text-align:center; padding-top:0px } .divMenubox .quick_contents dl{margin-top: 15px;position:relative;} .divMenubox .quick_contents dt, .divMenubox .quick_contents dd{padding:3px 0} .divMenubox .quick_contents dd a{color:#aaa; font-size:14px} .divMenubox .quick_contents dt{font-size:14px; } .divMenubox .quick_contents dl:after{content:''; display:block; width:15px; height:3px; background:#ddd; position:absolute; top:-10px; left:50%; margin-left:-7px} .divMenubox .quick_contents dl:first-child:after{display:none;} .quick_contents_login{padding:10px 0 ; text-align:center; border-bottom:1px dashed #ddd; font-size:12px; line-height:1.15;} .quick_contents_login div{font-size:12px;} .quick_contents_login a{ margin-top:5px; display: inline-block; min-width: 58px; height: 22px; line-height:20px; font-size: 12px; color: #fff; background-color: #999; } .quick_today_tit{padding-top:10px; text-align:center; font-size:14px} .quick_top_btn{background:#000;color:#fff; padding:5px 0; text-align:center; font-size:11px} .quick_top_btn a{color:#fff; font-size:11px} /*********** 카테고리 아이콘 ***********/ .bc_link:after{ content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; border:1px transparent solid; } .bc_link3 .best_category_icon{ background-image: url(/webftp/best_cate_icon01.png); } .bc_link4 .best_category_icon{ background-image: url(/webftp/best_cate_icon02.png); } .bc_link5 .best_category_icon{ background-image: url(/webftp/best_cate_icon03.png); } .bc_link6 .best_category_icon{ background-image: url(/webftp/best_cate_icon04.png); } .bc_link7 .best_category_icon{ background-image: url(/webftp/best_cate_icon05.png); } .bc_link8 .best_category_icon{ background-image: url(/webftp/best_cate_icon06.png); } .bc_link9 .best_category_icon{ background-image: url(/webftp/best_cate_icon07.png); } .bc_link10 .best_category_icon{ background-image: url(/webftp/best_cate_icon08.png); } .bc_link11 .best_category_icon{ background-image: url(/webftp/best_cate_icon09.png); } .bc_link12 .best_category_icon{ background-image: url(/webftp/best_cate_icon10.png); } .bc_link13 .best_category_icon{ background-image: url(/webftp/best_cate_icon11.png); } .bc_link14 .best_category_icon{ background-image: url(/webftp/best_cate_icon12.png); } .bc_link15 .best_category_icon{ background-image: url(/webftp/best_cate_icon13.png); } .bc_link16 .best_category_icon{ background-image: url(/webftp/best_cate_icon14.png); } .bc_link17 .best_category_icon{ background-image: url(/webftp/best_cate_icon15.png); } .bc_link18 .best_category_icon{ background-image: url(/webftp/best_cate_icon16.png); } .bc_link19 .best_category_icon{ background-image: url(/webftp/best_cate_icon17.png); } .bc_link20 .best_category_icon{ background-image: url(/webftp/best_cate_icon18.png); } .bc_link21 .best_category_icon{ background-image: url(/webftp/best_cate_icon19.png); } .bc_link22 .best_category_icon{ background-image: url(/webftp/best_cate_icon20.png); } /*********** 서브공통 ***********/ .dream_wrap{ padding:30px 0 150px 0} .dream_wrap .dream_container{} .dream_wrap .dream_container:after{content:'';display:block; clear:both;} .dream_wrap .dream_container .dream_contents{padding-top: 0px } .dream_wrap .dream_container .dream_contents_sub:before{ } .dream_wrap .dream_container .dream_contents_full{padding-top: 0px } .dream_contents_sub .sub_tit_box h5{font-size:16px; margin-bottom:15px} .no_data_box{ background-color: #f7f7f7; text-align:center; font-size:16px; padding:60px 30px } /*상단타이틀*/ .sub_header .breadcrumb{ background:transparent; border-radius:0; padding:0; margin:0 0 30px 0; text-align:center; } .dream_contents_sub .sub_header .breadcrumb{ text-align:left; } .sub_header .breadcrumb h3{ font-size:30px; margin-bottom:0; font-weight:700 } .dream_contents_sub .sub_header .breadcrumb h3{ font-size:20px; line-height:20px; margin:5px 0 15px } .sub_header .header_desc{ font-size: 18px; line-height: 32px; text-align: center; color: #666; margin-bottom:0 } @media (min-width: 992px) { .dream_wrap .dream_container .dream_contents_sub h3{font-size:24px; margin-bottom:25px} .dream_wrap .dream_container.lnbStyle{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: flex-start; align-items: flex-start; } .dream_wrap .dream_container .dream_lnb{ position: sticky; top: 55px; width: 180px; margin: 0px 60px 0 0; } .dream_wrap .dream_container .dream_lnb .cs_menu_wrap h3{font-size:36px; margin-bottom:30px} .dream_wrap .dream_container .dream_lnb .cs_menu_wrap li{ font-size:16px; border-bottom:1px #eee solid; padding:15px 0 } .dream_wrap .dream_container .dream_lnb .cs_menu_wrap li:last-child{ } .dream_wrap .dream_container .dream_lnb .cs_menu_wrap li a{color:#767676} .dream_wrap .dream_container .dream_lnb .cs_menu_wrap li.active a{color:#4FB748} .dream_wrap .dream_container .dream_contents_sub{ width:calc(100% - 240px); position:relative; padding-top:0 } } @media (max-width: 1300px) { .dream_wrap .dream_container .dream_lnb{ width: 180px; margin: 0px 20px 0 0; } .dream_wrap .dream_container .dream_contents_sub{ width:calc(100% - 200px); } } @media (max-width: 992px) { .dream_wrap{ padding: 0px 0 80px 0} .dream_wrap .container{padding-left:0; padding-right:0} .dream_wrap .dream_container .dream_lnb{display:none!important } .dream_wrap .dream_container .dream_contents{padding-top: 0px } .dream_wrap .dream_container .dream_contents_sub { float: none; width: calc(100% - 0px); } .dream_wrap .dream_inner{padding:0 15px} .sub_header { display:block; border-bottom: 1px #eee solid; margin-bottom: 0px; } .sub_header .breadcrumb { margin-bottom: 0; background: #fff; padding: 15px 35px 15px 35px; box-sizing: border-box; font-weight: normal; text-align: center; } .sub_header .breadcrumb h3 { font-size: 16px; margin-bottom: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight:500; margin:0; text-align:center; } .dream_contents_sub .sub_header .breadcrumb h3{margin:0;text-align:center;} .sub_header a.btn_prev { display: block; position: absolute; left: 15px; top: 10px; margin-top: 0px; width: 29px; height: 47px; } .sub_header a.btn_prev:before{ content: "\6c"; font-family: "dripicons-v2" !important; font-size:18px} } /*네비게이션*/ .page-title-box{ min-height:50px; margin-top: 0px } .page-title-box:after .breadcrumb:after{content:''; display:block; clear:both;} .page-title-box .breadcrumb{background:#fff; margin-bottom:0; padding-right:0; padding-left:0; display: flex; } .breadcrumb .breadcrumb-item:first-child{ text-transform: uppercase !important;} .page-title-box .breadcrumb .breadcrumb-item{color: #999; font-size:13px; display: flex; align-items: center; position: relative; } .page-title-box .breadcrumb .breadcrumb-item a{color: #999; font-size:13px} .page-title-box .breadcrumb .breadcrumb-item.active { color: #000;} .page-title-box .breadcrumb .breadcrumb-item .icon_home{position:relative; width:16px; height:16px; display:block; } .page-title-box .breadcrumb .breadcrumb-item .icon_home:after{ content: "\F06A1"; font: normal normal normal 18px/1 "Material Design Icons"; display:block; position:absolute; top:-1px; left:0} .dream_contents h3{text-align:center; margin-bottom:50px} .dream_contents h4{text-align:center; margin-bottom:50px; font-size:20px} .dream_contents h5.subTit{ font-size:18px; margin-bottom:0} .sub_tit_line{border-bottom: 1px solid #eee; padding-bottom:10px; margin-bottom:30px} .dream_contents .sub_tit_box{padding:30px 0 15px 0} .sub_tit_box h5.subTit{font-size:16px} .sub_tit_box > div{font-size:14px} .page_btn{text-align:center; margin-top:50px; display: flex; gap: 0 10px; text-align: center; justify-content: center;} .page_btn .btn{margin: 0px 3px; width:150px} /*박스*/ .dream_info_box{background-color: #fafafa; border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding:20px; line-height:180%; font-size:14px } .dream_info_box li{position:relative; padding:0 0 0 15px} .dream_info_box li:after{content:'-'; display:block; position:absolute; top:0px; left: 0px} .telBox > div{width:100px; margin-right:15px; position:relative;} .telBox > div:after{content:'-'; position:absolute; top:50%; right:-10px;transform: translateY(-50%);} .telBox > div:last-child{margin-right:0} .telBox > div:last-child:after{display:none;} .telBox.telBoxLine{position:relative;} .telBox.telBoxLine:after{content:'';display:none; position:absolute; bottom:0px; left:0; width:100%; height:1px; border-bottom:1px #333 solid;} .telBox.telBoxLine .form-control{border-bottom:none} .emailBox .emailForm{ } .emailBox .emailForm > div{ position:relative;} .emailBox .emailForm .email_at{position:relative; margin-right:30px; } .emailBox .emailForm .email_at:after{content:'@'; position:absolute; top:5px; right:-25px} .emailBox .emailForm > div:last-child{ margin-right:15px } .emailBox .emailForm > div:last-child:after{display:none;} .emailBox .emailForm .email_list_box{margin-left:10px} .emailBox .emailForm > div .form-control{ } .emailBox .checkingEmailBox .btn{margin-right:10px} .zipcodeBox{} .zipcodeBox .btn{margin-left:10px} #Countryon ul , #cha_zip ul , #Countryon_2 ul { display: flex; } #Countryon ul li, #cha_zip ul li, #Countryon_2 ul li { -webkit-flex: 1; flex: 1;} #Countryon ul:after ,#cha_zip ul:after ,#Countryon_2 ul:after{content:'';display:block; clear:both; } .select_national_btn{margin-left:10px} .c_address_box{margin-top:10px} .c_address_box li{ padding-left:10px } .c_address_box li:first-child{ padding-left: 0px } .country_telBox .telBox_noti{margin-left:10px} @media (min-width: 992px) { .sub_menu_wrap{ padding-bottom:50px; text-align:center;} .sub_menu_wrap ul{display:inline-block;} .sub_menu_wrap ul:after{content:''; display:block; clear:both;} .sub_menu_wrap li{float:left; padding: 0 30px; position: relative; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -ms-align-items: center; align-items: center; } .sub_menu_wrap li a{ font-size: 18px; opacity: 0.4; } .sub_menu_wrap li.active a{ opacity: 1; position:relative; } .sub_menu_wrap li.active a:after{content:'';display:block; width:100%; height:2px; background:#000; position:absolute; bottom:-10px; left:0} .sub_menu_wrap li:after{content:'';display:none; clear:both; width:1px; height:12px; background:#ddd; opacity: 1; position:absolute; top:50%; margin-top:-6px; left:0px} .sub_menu_wrap li:first-child:after{display:none;} } @media (max-width: 992px) { .page-title-box{display:none;} .sub_menu_wrap .navSlide{ margin:0 0px 0px 0px;} .sub_menu_wrap .navSlide{overflow-x: auto;height: 3.5rem;position:relative;font-size: 0px;} .sub_menu_wrap .navSlide>.list{display: inline-block; border: #dcdcdc solid; border-width:0 0 0.1rem 0px; white-space:nowrap; min-width:100%; list-style: none; padding: 0; margin: 0;position:relative; vertical-align: middle;} .sub_menu_wrap .navSlide>.list>li{ list-style: none; padding: 0; margin: 0; display:inline-block; position:relative; vertical-align: middle; font-size: 12px;} .sub_menu_wrap .navSlide>.list>li>a{display:block;padding: 0.9rem 1.5rem;vertical-align: middle;border-bottom: 0.3rem solid transparent;height:3.3rem; box-sizing: border-box;font-size: 1rem;} .sub_menu_wrap .navSlide>.list>li.active>a{color: #4FB748; font-weight: bold;} .sub_menu_wrap .navSlide>.list>li.active>a::before{width: 100%; position:absolute; left:0px; bottom: -1px; content:""; background: #4FB748; height:2px;} .sub_menu_wrap .navSlide::-webkit-scrollbar {display:none} .sub_menu_wrap .navSlide::-webkit-scrollbar-thunmb {display:none} .sub_menu_wrap .navSlide::-webkit-scrollbar {display:none} .sub_menu_wrap .navSlide::-webkit-scrollbar-thunmb { display:none} .top_cate_wrap .cateNavSlide{ margin:0 0px 0px 0px;} .top_cate_wrap .cateNavSlide{overflow-x: auto;height: 3.5rem;position:relative;font-size: 0px;} .top_cate_wrap .cateNavSlide>.list{display: inline-block; border: #dcdcdc solid; border-width:0 0 0.1rem 0px; white-space:nowrap; min-width:100%; list-style: none; padding: 0; margin: 0;position:relative; vertical-align: middle;} .top_cate_wrap .cateNavSlide>.list>li{ list-style: none; padding: 0; margin: 0; display:inline-block; position:relative; vertical-align: middle; font-size: 12px;} .top_cate_wrap .cateNavSlide>.list>li>a{display:block;padding: 0.9rem 1.5rem;vertical-align: middle;border-bottom: 0.3rem solid transparent;height:3.3rem; box-sizing: border-box;font-size: 1rem; font-weight:500; font-size:16px; color:#333} .top_cate_wrap .cateNavSlide>.list>li.active>a{color: #4FB748; font-weight: bold;} .top_cate_wrap .cateNavSlide>.list>li.active>a::before{width: 100%; position:absolute; left:0px; bottom: -1px; content:""; background: #4FB748; height:2px;} .top_cate_wrap .cateNavSlide::-webkit-scrollbar {display:none} .top_cate_wrap .cateNavSlide::-webkit-scrollbar-thunmb {display:none} .top_cate_wrap .cateNavSlide::-webkit-scrollbar {display:none} .top_cate_wrap .cateNavSlide::-webkit-scrollbar-thunmb { display:none} .telBox > div{width:calc((100% - 30px)/3)} .telBox > div input[type=text]{width:100%} .telBox > div:after{ right:-10px; } .country_telBox .telBox > div {width:calc((100% - 15px)/2)} .zipcodeBox{} .zipcodeBox .btn{width:90px; height:40px; display:flex; justify-content: center; align-items: center; } .zipcodeBox input{width:calc(100% - 100px)!important} .country_zipcode, .country_telBox{display:block;} .select_national_btn, .country_telBox .telBox_noti{margin-left: 0px; margin-top:10px} .emailBox, .emailBox.mo_emailBox, .emailBox.mo_emailBox2{ display:block; } .emailBox.mo_emailBox #mailno, .emailBox #mailno, .emailBox .btn, .emailBox.mo_emailBox .emailForm .btn{margin-top:10px} .checkingEmailBox{display:block;} .checkingEmailBox span{display:block; margin-top:10px} .emailBox .emailForm .email_list_box{margin-left: 0px} .emailBox.mo_emailBox .emailForm{display:block;} .emailBox.mo_emailBox .email_list_box{margin-top:10px; width:100% } .emailBox.mo_emailBox .email_list_box .form-control{ width:100% } } @media (max-width: 576px) { .page_btn {justify-content: space-between;} .page_btn .btn, .page_btn .btn-basic, .page_btn .btn-outline-basic{width:100%; padding:10px 0 ; margin:0} } /*********** 상품목록 ***********/ .dream_goods_wrap{} .dream_goods_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr)} .dream_contents_goodslist h3{margin-bottom:30px} .sub_category_wrap{ flex: 1; border: 1px solid #eee; width: 100%; margin-bottom:30px } .sub_category_wrap .category_path{ display: flex; display: -ms-flexbox; align-items: center; padding: 8px 0 8px 20px; font-size: 13px; font-weight: bold; line-height: 28px; letter-spacing: -0.025em; } .sub_category_wrap .category_path div{ position:relative; padding-right:30px } .sub_category_wrap .category_path div:after{ content:'>'; font-size:13px; font-family: dotum; position:absolute; top:1px; right:12px } .sub_category_wrap .category_path div:last-child:after{ display:none; } .sub_category_wrap .sub_category_list ul{ display: flex; display: -ms-flexbox; flex-wrap: wrap; padding: 8px 0; border-top: 1px solid #eee; background-color: #fafafa; list-style: none; } .sub_category_wrap .sub_category_list li { padding: 2px 0 2px 20px; width: 20%; height: 28px; box-sizing: border-box; } .sub_category_wrap .sub_category_list li a { display: inline-block; overflow: hidden; max-width: 100%; height: 24px; font-size: 13px; color: #424242; line-height: 22px; letter-spacing: -0.045em; white-space: nowrap; text-overflow: ellipsis; } .sub_category_wrap .sub_category_list li.active a{ color:#4FB748; font-weight:600 } .goodsList_item_sort{margin:20px 0 20px 0; border-bottom:1px #ddd solid; padding-bottom:20px;} .goodsList_item_sort .total_items{font-family:'Pretendard',sans-serif;} .goodsList_item_sort .goods_sort{padding-right:15px} .goodsList_item_sort .goods_sort a{ margin-left:30px; display:inline-block; position:relative;} .goodsList_item_sort .goods_sort a:after{content:''; display:block; width:1px; height:12px; background:#ddd; position:absolute; top:50%; margin-top:-5px; left:-18px;} .goodsList_item_sort .goods_sort a:first-child:after{display:none;} .item_tit{margin-top:25px; margin-bottom: 0px; } .item_tit p{padding-bottom:5px;} .item_tit .item_name{min-height:50px; padding-bottom:10px /*white-space: nowrap; overflow: hidden; text-overflow: ellipsis;*/} .item_tit a{min-height:40px; color:#000; font-size:16px; line-height:1.25 } .item_cost { position:relative; padding-top: 0px} .item_cost strong{font-size:22px; color:#000; font-weight:700; } .item_cost strong em{font-size:14px; font-weight:400;} .item_cost strike{display:inline-block; margin-left:10px; color:#999;font-size:14px; margin-bottom:3px } .item_cost .flag_icon{position:absolute; bottom:5px; right:0} .item_cost .weight { padding-left:20px; display:inline-block; position:relative} .item_cost .weight:before{content:'/'; position:absolute; top:0; left: 10px; font-size:12px;} .dream_goods_list{position:relative; overflow:hidden; margin-bottom:40px} .dream_goods_list .item_btn_box {position: absolute; top:30px ; right:-50px; width:30px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); transition: all 400ms ease;} .dream_goods_list:hover .item_btn_box{right:0px} .dream_goods_list .item_btn_box .goods_icon{height:100px;overflow:hidden;} .dream_goods_list .item_btn_box .goods_icon img { width: 30px;} .dream_goods_list .item_btn_box .goods_icon a{cursor:pointer; transition: all 400ms ease; display:inline-block; margin:0 0px; margin-bottom:3px; background:#fff; border:1px #ddd solid; border-radius:50%; width:30px; height:30px; line-height:30px; text-align:center;} .dream_goods_list .item_btn_box .goods_icon a:hover {background:#4FB748; color:#fff; border:1px #4FB748 solid;} .dream_goods_list .goods_img{position:relative; overflow:hidden} .dream_goods_list .goods_img a{display:block; } .dream_goods_list .goods_img img{max-width:100%} .dream_goods_list .goods_img .goods_result_dc{position:absolute; top:5px; left:5px; z-index:80} .goods_result_dc .icon_soldout, .goods_result_dc .item_discount_rate{display:block; color:#fff; width:50px; height:50px; line-height:50px; margin-right:5px; text-align:center; color:#fff; border-radius:50%; font-size:11px;} .goods_result_dc .item_discount_rate {font-family:'Pretendard',sans-serif; font-size:14px; font-weight:600} .goods_iconlist {padding-top:10px; } .goods_iconlist span{margin:0 3px 0 0; display:inline-block!important;} .no_product{text-align:center; padding:100px 0} /* list-sort-select */ .goods_sort select {color:#666;font-size:13px; background:#fff; vertical-align:middle; border:1px #fff solid; padding: 0 20px 0 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;} .goods_sort select::-ms-expand { display: none; } .goods_sort .select-style {position: relative; display: inline-block; } .goods_sort .select-style:after{font-family: xeicon!important; content: "\ea53"; display: block; position:absolute; transform: rotate(90deg); top:-2px;right:0px; font-size:1.1rem; } .dream_goods_list .item_cost { display: flex; justify-content: flex-start; align-items: flex-end;} .dream_goods_list .item_cost .item_discount_rate{font-size:22px; margin-right:10px; color:#4FB748; } /*화폐 위치 변경 .item_cost span{ position:relative; } .item_cost span strong{ padding-left:30px } .item_cost span em{ position:absolute; top:0; left:0 } .item_cost span + span em{ position:absolute; top:0; left:10px } .item_cost span strike{ padding-left:30px } */ /*상품리스트 아이콘 추가*/ dl.item_nicon{position:absolute;top:220px;width:180px;left:50%;margin-left:-80px;display:none;} dl.item_nicon dd{float:left;width:40px;margin-right:20px;} dl.item_nicon2{position:absolute;top:220px;width:180px;left:50%;margin-left:-80px;display:none;} dl.item_nicon2 dd{float:left;width:40px;margin-right:20px;} dl.item_nicon2 dd span{cursor:pointer;} /*상품리스트 아이콘 추가*/ #leftQuickMenu{display:none;} /*신규*/ .sub_header_goods{ padding-bottom:40px } @media (max-width: 992px) { .dream_goods_list{margin-bottom: 0px} .dream_goods_list .item_btn_box{display:none;} .goods_result_dc .icon_soldout, .goods_result_dc .item_discount_rate{ width:auto; height:auto; line-height:1; margin-right:5px; text-align:center; color:#fff; border-radius:0%; font-size:11px; padding:5px 7px} .sub_header_goods{ padding-bottom:0px } .sub_header_goods p.header_desc{ display:None; } .sub_category_wrap{border:none; border-bottom:1px #eee solid;} .sub_category_wrap .category_path{display:none;} .sub_category_wrap .sub_category_list li { width: calc(100% / 3);} } @media (max-width: 768px) { .dream_goods_list .item_tit .item_name {font-size:14px; } .dream_goods_list .item_cost { display: block} .dream_goods_list .item_cost .item_discount_rate, .dream_goods_list .item_cost strike{display:none; } .dream_goods_list .item_cost strong{font-size:16px; } .dream_goods_list .item_cost strong em{font-size:13px; } .dream_goods_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr)} } /*********** 상품상세설명 ***********/ div.detail_box{} div.detail_box span.item_code_tx{ color:#333333;font-size:14px;}/*상품코드*/ div.detail_box span.item_name_tx{color:#333333;font-size:14px;} div.detail_box span.item_sale_tx{color:#333333;font-size:14px;}/*판매가*/ div.detail_box span.item_real_tx{color:#333333;font-size:14px;}/*정상가*/ div.detail_box span.item_point_tx{color:#333333;font-size:14px;}/*적립금*/ div.detail_box span.item_goods_tx{color:#333333;font-size:14px;}/*재고수량*/ div.detail_box span.item_buyqty_tx{color:#333333;font-size:14px;}/*구매수량*/ div.detail_box span.item_dc_tx{color:#333333;font-size:14px;} div.detail_box span.item_option_tx{color:#333333;font-size:14px;} div.detail_box span.item_companyofgoods_tx{color:#333333;font-size:14px;}/*원산지*/ div.detail_box span.item_use_tx{color:#333333;font-size:14px;}/*사용자정의*/ div.detail_box span.item_par_tx{color:#333333;font-size:14px;}/*고객선호도*/ div.detail_box span.item_totelcost_tx{color:#fa5c7c;font-size:20px; font-weight:600; font-family:"Montserrat",'Pretendard',sans-serif;}/*총상품금액*/ div.detail_box span.item_totelcost{color:#333333;font-size:14px;} div.detail_box select.option{color:#333333;font-size:14px;} .dream_goods_detail_wrap{} .dream_goods_detail_img{width:50%} .dream_goods_detail_img .zoom-section:after{content:'';display:block; clear:both} .dream_goods_detail_info{width:50%} .goods_detail_icon{padding-bottom:7px} .goods_detail_icon img{margin-right:3px} .goods_detail_name{padding-bottom:15px; font-size:18px} .itd_option_line{border-bottom:1px #eee solid;} .itd_option{ padding:0 0px 10px 0} .item-buyqty-body{padding-top:10px; padding-bottom:10px} .goods_detail_btn_box{padding-top:30px; margin:0 -5px} .goods_detail_btn_box .btn{ padding-top:12px; padding-bottom:12px; padding-left:20px; padding-right:20px} .goods_detail_btn_box .row{margin-left:0px; margin-right:0px} .goods_detail_btn_box .row .col-4, .goods_detail_btn_box .row .col-3, .goods_detail_btn_box .row .col-6{padding-left:5px; padding-right:5px} .itd_56{border-bottom:1px solid #eee;} .add_img_box{ text-align:center;} .add_img_box:after{content:'';display:block; clear:both;} .add_img_box ul{display:inline-block} .add_img_box ul:after{content:'';display:block; clear:both;} .detail_coupon_box{margin-top:30px} .detail_coupon_box h5{font-size:16px} .detail_coupon_box .coupon_item_txt {width:100px; margin: 5px 0} .detail_coupon_box .coupon_item_txt h6{margin-bottom:0} .detail_coupon_box .coupon_item_txt h6 .badge{width:85px; text-align:center;} .reward_box{margin-top:15px; padding: 15px; background:#f6f6f6; font-size:14px; display:none} .sns_share{} .sns_share .sns_btn_list{text-align:center; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: center; -ms-align-items: center; align-items: center; text-align:center; } .sns_share .sns_btn_list a{ display:inline-block; width:45px; height:45px; line-height:45px; background:#000; color:#fff; border-radius:50%; margin:0 5px} .sns_share .sns_btn_list a i{font-size:25px; line-height:45px} .sns_share .url_box{margin-top:15px} .sns_share .sns_btn_list a.icon-kakaotalk{background:#f9e81e; color:#4a353b; } .sns_share .sns_btn_list a.icon-kakaotalk i{font-size:30px} .sns_share .sns_btn_list a.icon-facebook{background:#3c5a9a} .sns_share .sns_btn_list a.icon-twitter{background:#00abef} .sns_share .sns_btn_list a.icon-mail{background:#aaa} .sns_share .sns_btn_list a.icon-insta{background:#6b47bf} /*********** 장바구니 ***********/ .cart_blank_box i{font-size:4rem; color:#999} .order_contents_wrap{ display: flex; justify-content: space-between; align-items: flex-start; position: relative; } .order_contents_wrap .order_goods_box{ position: relative; width: 870px; } .order_contents_wrap .totalPayment_box { position: sticky; /* top: 100px;*/ top:30px; width: 320px; } .order_contents_wrap .totalPayment_box .totalPayment_inner { width: 320px; background: #fff; } .order_contents_wrap .totalPayment_box .cartTotalPayment_box{border:1px #eee solid; padding:30px 25px 30px} .order_contents_wrap .totalPayment_box .cartTotalPayment_box h4{margin-bottom:25px; text-align:left;} .order_contents_wrap .totalPayment_box .cart_page_btn{margin-top:15px; } .order_contents_wrap .totalPayment_box .cart_page_btn .btn{ padding:14px 0; font-size:1.125rem; } .order_contents_wrap .totalPayment_box .cartTotalPayment_box dl{ display: flex; justify-content: space-between; align-items: center; margin: 0 0 15px; text-align: right; } .order_contents_wrap .totalPayment_box .cartTotalPayment_box dl#viewcart_cost, .cartTotalPayment_box dl.totaldelev{ margin: 25px 0 0; padding: 20px 0 0; border-top: 1px solid #eee; } .order_contents_wrap .totalPayment_box .cartTotalPayment_box dl#viewcart_cost dd, .cartTotalPayment_box dl.totaldelev dd{ color: #4FB748; font-weight:600; font-size:24px } .order_contents_wrap .totalPayment_box .cartTotalPayment_box dl#viewcart_cost dd em, .cartTotalPayment_box dl.totaldelev dd em{ font-size:18px } .order_contents_wrap .order_goods_box .cart_listChk{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; margin-bottom:15px } .cart_listChk .cart_top_btn{ } .cart_listChk .cart_top_btn .btn + .btn{ margin-left:10px } .order_goods_box .cart_list_wrap{border-top:1px #eee solid; } .order_goods_box .cart_list_wrap .cart_list_body li{padding:40px 0; border-bottom:1px #eee solid;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box{display:flex; position:relative; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box > div { display: flex; flex-direction: column; justify-content: center;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .goods_list_checkbox{margin-right: 5px; justify-content: flex-start;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .goods_list_checkbox .custom-checkbox label span{font-size:0} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .goods_list_checkbox .custom-checkbox{margin-right:0} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_img{ position: relative; flex: none; width: 100px; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_img img{width:100%} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_info { flex: 1; justify-content: start; padding: 0 50px 0 20px;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_info .cart_good_name{font-size:14px} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_etc_info_box {width:225px; flex-direction: row; align-items: center; } .cart_good_info .buy_list_ect_info {color:#aaa; font-size:13px} .cart_good_info .cart_good_opt p{ margin-right:10px} .cart_good_info .cart_good_opt span{color:#aaa; font-size:13px; margin-right:25px; position:relative;} .cart_good_info .cart_good_opt span:after{content:'/'; position:absolute; top:-3px; right:-15px} .cart_good_info .cart_good_opt span:last-child{margin-right:0} .cart_good_info .cart_good_opt span:last-child:after{display:none;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_numbersof { justify-content: center; align-items: center; width: 115px;} .cart_list_numbersof .numbersofgoods_box {border:1px #eee solid; width:100px} .cart_list_numbersof .numbersofgoods_box .form-control{border:none; text-align:center; width:calc(100% - 58px)} .cart_list_numbersof .numbersofgoods_box .btn_num{width:29px; height:29px; cursor:pointer; position:relative; background:#fff} .cart_list_numbersof .numbersofgoods_box .btn_num:after{content:''; display:block; font: normal normal normal 18px/1 "Material Design Icons"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .cart_list_numbersof .numbersofgoods_box .btn-num-product-down:after{content: "\F0374";} .cart_list_numbersof .numbersofgoods_box .btn-num-product-up:after{ content: "\F0415";} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv { justify-content: center; margin-left: 14px; width: 110px; text-align: right;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_mileage{ display: block; margin-top: 5px; font-size: 13px; line-height: 1.23; color: #e61d37;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc{margin-top: 5px; margin-bottom:5px; font-size: 13px; line-height: 1.23; color:#4FB748; font-weight:600 } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc:after{content:'할인'} .order_goods_box.buy_info_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc{margin-top:0; margin-bottom:5px} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .totalv1{font-weight:600} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .totalv1 em{font-weight:400} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_del{ width: 34px; justify-content: start; text-align:right;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_del a i{color:#999} .order_goods_box .cart_list_wrap .cart_list_cost {display:none!important;} .order_goods_box .dream_info_box{border-top:none;} .total_price_box{padding:15px 15px; background:#f7f7f7} .total_price_box dl{ display: flex; justify-content: space-between; align-items: center; margin:2px 0 } .estimate_box{margin-top:30px; max-width:890px} .estimate_box .estimate_form .btn-sm{margin-left:10px} @media (max-width: 1440px) { .order_contents_wrap .order_goods_box{ width: 800px; } .order_contents_wrap .totalPayment_box, .order_contents_wrap .totalPayment_box .totalPayment_inner { width: 270px; } } @media (max-width: 1140px) { .order_contents_wrap .order_goods_box{ width: 750px; } } @media (max-width: 1024px) { .order_contents_wrap .order_goods_box{ width: 650px; } } @media (max-width: 992px) { .cartBody .dream_wrap .dream_container .dream_contents{padding-bottom:30px} .order_goods_box .dream_info_box{display:none;} .order_contents_wrap{display:block; margin:0 0px; overflow-x:hidden; z-index:9 ; padding-top:15px} .order_contents_wrap .order_goods_box .cart_listChk{padding:0 15px} .cart_listChk .cart_top_btn em{display:none;} .order_contents_wrap .order_goods_box, .order_contents_wrap .totalPayment_box, .order_contents_wrap .totalPayment_box .totalPayment_inner { width: 100%; } .cart_listChk .cart_top_btn{margin-top:0px} .order_goods_box .cart_list_wrap{border-top:1px #eee solid;} .order_goods_box .cart_list_wrap .cart_list_body li{padding:30px 15px; border-bottom:5px #f5f5f5 solid;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box{display:block; position:relative;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_img{width:70px; position:absolute; top:25px; left:0} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_good_info{ padding-left:85px; min-height:70px; padding-right:0} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .goods_list_checkbox{margin-bottom:5px} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_del{width:auto; position:absolute; top:0; right:0} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_etc_info_box {width:100%; background:#F7F9FA; padding:15px; margin-top:15px; justify-content: space-between;} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv { width:100%; display: flex; justify-content: flex-end; align-items: center; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv p{margin-left:10px; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_mileage{margin-top:0;padding-top:2px; text-align:left!important; width:auto!important; float:left; margin-right: 0px; position:relative; font-size:12px; } .cart_list_body .cart_list_mileage:before{ content:'/'; display:inline-block; position:absolute; top:2px; right:-10px } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc{position:relative; margin:0 15px} .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc:before{ content:'/'; display:inline-block; position:absolute; top:0px; right:-10px } .order_goods_box.buy_info_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_dc{ margin-top:5px } .order_goods_box.buy_info_box .cart_list_wrap .cart_list_body .goods_list_box .cart_list_totalv .cart_list_mileage { margin-top:-2px } .order_contents_wrap .totalPayment_box{border-top:2px #f5f5f5 solid; z-index:990} .order_contents_wrap .totalPayment_box{margin-top: 0px} .order_contents_wrap .totalPayment_box .cartTotalPayment_box{border:none; padding:30px 15px} .order_contents_wrap .totalPayment_box .cartTotalPayment_box h4{display:none;} .order_contents_wrap .totalPayment_box .cart_page_btn{position:fixed; bottom:0; left:0; width:100%; z-index: 990; } .order_contents_wrap .totalPayment_box .cart_page_btn .btn{height:70px; font-size:18px;font-weight:600; display: flex; justify-content: center; align-items: center; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box.goods_buy_list_box .cart_good_img { top: 0px; } .order_goods_box .cart_list_wrap .cart_list_body .goods_list_box.goods_buy_list_box .cart_list_totalv{ margin-left:0; flex-direction:row; } .cart_good_info .cart_good_opt p{ margin-right: 0px; display:block; max-width:60px; margin :5px 0} .estimate_box{margin-top:30px; max-width:auto} .estimate_box .estimate_form{padding-left:15px; padding-right:15px} } /*********** 주문서 ***********/ .buy_contents_box{ padding : 30px 0 0 0} .totaldelev{padding:10px 0 0 0; border-top:1px #eee solid; margin-top:10px } .totaldelev dt{} .totaldelev dd{ color: #4FB748; font-weight: 600; font-size: 22px; } .shopping_end_box .dream_info_box{padding:30px} @media (max-width: 992px) { .buy_contents_box{ padding :20px 15px; position:relative; } .buy_contents_box:after{content:'';display:block; height:5px; width:100%; background:#f5f5f5; position:absolute; left:0; bottom:-5px} .buy_contents_box dl.table-row:last-child dd{border-bottom:0;} #order_processing_button1{width:100%} .shopping_end_box .dream_info_box{padding:15px} .trans_area_box{padding-left:15px; padding-right:15px} .trans_area_box_Y{padding-top:15px; border-top:none;} .trans_area_box.borTnone{border-top:none} } @media (max-width: 768px) { .shopping_end_btn{ justify-content: center!important; } .btnset{width:100%} } /*********** 마이페이지 ***********/ .sub_mypage_menu_wrap{display:none} .mypage_top_box{ background:#f5f5f5; padding: 0px 30px; margin-bottom:50px } .mypage_top_box a , .mypage_top_box h3, .mypage_top_box p, .mypage_top_box span, .mypage_top_box em{ } .mypage_top_box .myt_tit h3 {font-size:1.5555rem; font-weight:400} .mypage_top_box .myt_tit p, .mypage_top_box .myt_tit p a{ font-size:14px; color:#666} .mypage_top_box .myt_tit p a span{color:#4FB748; text-decoration: underline; } .mypage_top_box .myt_tit p a:after{content: '\e82c'; font-size:20px; font-family: unicons; position:absolute; top:-7px; right:-5px} .mypage_top_box .myt_tit p a{padding-right:15px; position:relative; } .mypage_top_box .myt_info > div{padding: 0px 20px; border-left:1px solid #eee; min-width:200px; min-height:120px; display: flex; align-items: center; justify-content: center;} .mypage_top_box .myt_info > div p{ padding: 0px 0 1px 0; border-bottom:1px #000 solid; font-size:20px; } .mypage_top_box .myt_info > div:first-child{ } .mypage_top_box .myt_info > div a{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%;} .mypage_top_box .myt_info span{font-size:14px; position:relative; color:#666} .mypage_top_box .myt_info span:after{display:none; content: '\e82c'; font-family: unicons;} .my_noti_box{padding-top:15px} @media (max-width: 1200px) { .mypage_top_box{ padding: 20px 20px; } .mypage_top_box .myt_tit h3 {font-size:22px} .myt_tit p{font-size:16px} .mypage_top_box .myt_info > div{min-width:150px} } @media (max-width: 1140px) { } @media (max-width: 992px) { .sub_mypage_menu_wrap{display:block} .mypage_top_box{display:none;} .my_noti_box{background-color: #fafafa; padding:15px; border-bottom:1px #eee solid;} .myinfo_box{border-top:none!important;} } /*왼쪽메뉴*/ .lnb_my_menu_box{ padding:0px 0px; } .lnb_my_menu_box h3{ font-size: 36px; margin-bottom: 30px;} .lnb_my_menu_box dl{margin :0 0 15px 0; border-top:1px #e4e4e4 solid;} .lnb_my_menu_box dl:first-child{border-top:none; } .lnb_my_menu_box dt{padding:15px 0 5px; font-size:1rem; color:#000; font-weight:600} .lnb_my_menu_box dl:first-child dt{padding:0 0 5px 0} .lnb_my_menu_box dd{padding:2px 0;} .lnb_my_menu_box dd a{font-size:14px; color:#999} .lnb_my_menu_box dl.custom dd {padding-top:15px} .lnb_my_menu_box dl.custom dd a{font-size:14px; color:#000; position:relative; padding-left:30px} .lnb_my_menu_box dl.custom dd a:before{content: "\F12CA"; position:absolute; top:-5px; left:0; font: normal normal normal 24px/1 "Material Design Icons";} .lnb_my_menu_box dd.active a{color:#000; } /*테이블*/ .mypage_list_wrap{ } .mypage_list_wrap .mypage_list_header{ position: relative; display: flex; align-items: center; width:100%; border-bottom: 1px solid #eee; border-top: 1px solid #000; } .mypage_list_wrap .mypage_list_header > div{ padding: .75rem; text-align:center; font-size:14px; background:#f7f7f7; border-left:1px #eee solid; } .mypage_list_wrap .mypage_list_header > div:first-child{border-left:none;} .mypage_list_wrap .mypage_list_body > div{font-size:14px} .mypage_list_wrap .my_list_item{ width:calc(100% - 450px) } .mypage_list_wrap .my_list_date { width:200px; text-align:center; } .mypage_list_wrap .my_list_status{ width:150px; text-align:center; } @media (max-width: 992px) { .mypage_list_wrap .mypage_list_header{ display:none; } .mypage_list_wrap .mypage_list_body .my_list_box{ display: block; padding-bottom:10px } .mypage_list_wrap .mypage_list_body .my_list_box > div{ padding: 0 .75rem; } } /*마이메인 */ div.my_tit{border-left:3px solid #696969;font-size:18px;font-weight:600;padding-left:10px;margin-bottom:20px; } div.mymenu ul li{cursor:pointer;float:left;list-style:none;border:1px solid #696969;text-align:center;font-size:14px;font-weight:600;width:10%;padding:10px 4px; } div.mymenu ul li.my_atv{background:#696969;color:#fff;} .dreamweb_my_top .mypage_info ul { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; } .dreamweb_my_top .mypage_info li{ margin-left:30px; text-align:center; } .dreamweb_my_top{padding:0 15px} .dreamweb_my_top .mypage_tit p{font-size:16px} .dreamweb_my_top .mypage_info li i{display:block; color:#999; margin-bottom:5px; } .dreamweb_my_top .mypage_info li a {display:inline-block; position:relative;padding:0 10px } .dreamweb_my_top .mypage_info li a:after{content: "\e649"; font-family: 'themify';display:block; position:absolute; top:3px;right:-3px; font-size:9px } .dreamweb_my_top .mypage_info li span{ display:block; color:#fa5c7c; font-size:18px; font-family:"Roboto",'Noto Sans KR',sans-serif; } .mypage_menu_box{ display:none; margin-top:80px} .mypage_menu_box .card{min-height:130px; margin-bottom:15px} .mypage_menu_box .card h6{position:relative;} .mypage_menu_box .card h6:after{content: "\e649"; font-family: 'themify';display:block; position:absolute; top:0px;right:0px; font-size:12px} .mypage_menu_box .card p{color:#999} .invate_link, .invate_link a{color: #fa5c7c; font-size:14px; text-decoration:underline;} p.top_benner_close{z-index:1000;position:absolute;width:21px;height:21px;background:#fff;right:50px;top:20px;display:none; } .myorder_process_step{border:1px #000 solid; padding:15px 0; border-radius:8px; margin: 0px 0 50px 0} .myorder_process_step ul:after{content:''; display:block; clear:both} .myorder_process_step li{width:20%; float:left; border-right:1px #ddd solid; padding:0 15px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; } .myorder_process_step li:last-child{border-right:none;} .myorder_process_step li span{font-size:16px} .myorder_process_step li em{font-size:16px; color:#999; font-weight:600} .mypage_m_main_box{margin:0 0px; overflow-x:hidden;} .mypage_mo_menu_box{} .mypage_m_top_box{background:#f3f5f7; ; padding:15px; } .mypage_m_top_box .myt_tit h3 {font-size:1.5555rem; font-weight:400; } .mypage_m_top_box .myt_tit p, .mypage_m_top_box .myt_tit p a{ font-size:14px; } .mypage_m_top_box .myt_tit p a span{color:#4FB748; text-decoration: underline; } .mypage_m_top_box .myt_tit p a:after{display:none; content: '\e82c'; font-size:20px; font-family: unicons; position:absolute; top:-7px; right:-5px} .mypage_m_top_box .myt_tit p a{padding-right:15px; position:relative; } .mypage_m_top_box .myt_info{ position: relative; box-sizing: border-box; margin-top: 30px; margin-bottom: 30px; } .mypage_m_top_box .myt_info::before { display: block; content: ""; position: absolute; left: 0; right: 0px; top: 50%; height: 1px; background: #eee; } .mypage_m_top_box .myt_info ul { display: flex; flex-wrap: wrap; align-content: space-between; height: 110px; } .mypage_m_top_box .myt_info li { width: calc(50% - 1px); } .mypage_m_top_box .myt_info li:nth-child(even) { border-left: 1px solid #eee; } .mypage_m_top_box .myt_info li a { display: inline-flex; flex-direction: column; color: inherit; } .mypage_m_top_box .myt_info li a span{ color:#888 } .mypage_m_top_box .myt_info li a p{ color:#000 } .mypage_m_top_box .myt_info li:nth-child(even) a span, .mypage_m_top_box .myt_info li:nth-child(even) a p{ padding-left:15px; } .mypage_mo_menu_box ul{ border-top:5px #f5f5f5 solid; } .mypage_mo_menu_box li { font-weight: 600; font-size: 14px; line-height: 18px; border-bottom: 1px solid #F5F5F5; } .mypage_mo_menu_box li a { display: block; padding: 21px 26px; position:relative; } .mypage_mo_menu_box li a:after { display: block; content: "\F0142"; font: normal normal normal 20px/1 "Material Design Icons"; position:absolute; top:50%; right:26px; transform: translateY(-50%); } .mypage_mo_cs_box{} .mypage_mo_cs_box .cs_tit{ font-weight: 600; font-size: 14px; line-height: 18px; border-bottom: 1px solid #F5F5F5; padding: 21px 26px; color:#4FB748 } .mypage_mo_cs_box dl{ margin:21px 26px } .mypage_mo_cs_box dt a{ color:#4FB748; font-size:24px; font-weight:600; } .mypage_mo_cs_box dd{ color:#999; font-size:12px } .mypage_today{ padding: 40px 0px } .mypage_today .item_tit a{ font-size:17px } .mypage_today .item_cost strong{ font-size:18px } .mypage_today .item_cost strike{ font-size:15px } @media (max-width: 992px) { .myorder_process_step{border:none; border-bottom:5px #f5f5f5 solid; margin-bottom:0; border-radius:0} .myorder_process_step li{ display:block; text-align:center; padding:0; border-right:none;} .myorder_process_step li span, .myorder_process_step li em{display:block;} .myorder_process_step li span{font-size:12px; color:#999} .myorder_process_step li em{font-size:20px} .myorder_process_step li.point em{color:#000} .mypage_today{padding:30px 0 0px 15px} .mypage_today .sub_tit_box{margin-bottom:15px} .mypage_today .dream_goods_list{ width:150px } .mypage_today .item_tit a{ font-size:14px } .mypage_today .item_cost strong{ font-size:16px } .mypage_today .item_cost strike{ font-size:12px } } /*관심상품*/ .mypage_list_wrap .wish_list_box{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; width:100%; border-bottom: 1px solid #eee; } .mypage_list_wrap .wish_list_box > div{ padding:.75rem 0; min-height:75px; border-left:1px #eee solid; display: flex; align-items: center; justify-content: center; } .mypage_list_wrap .wish_list_box > div:first-child{ border-left:none; } .mypage_list_wrap .my_list_wishitem{width:calc(100% - 350px)} .mypage_list_wrap .my_list_image{width:80px; text-align:center;} .mypage_list_wrap .my_list_name{width:calc(100% - 430px)} .mypage_list_wrap .my_list_wishcost{width:150px;text-align:center;} .mypage_list_wrap .my_list_wishbtn{width:200px; text-align:center;} .mypage_list_wrap .my_list_wishbtn a{margin:0 2px} @media (max-width: 992px) { .wish_list_body{ } .mypage_list_wrap .wish_list_box{ display: block; padding-left:90px; padding-top:10px } .mypage_list_wrap .wish_list_box > div{ min-height:auto; border-left:none; display: block; padding:0 0 0 0 } .mypage_list_wrap .wish_list_box .my_list_name{ padding-top:1rem; } .mypage_list_wrap .wish_list_box .my_list_wishcost{ padding:0 0 0 0 } .mypage_list_wrap .wish_list_box .my_list_image{ position:absolute; top:25px; left:0 } .mypage_list_wrap .my_list_name, .mypage_list_wrap .my_list_wishcost, .mypage_list_wrap .my_list_wishbtn{width:auto; } .mypage_list_wrap .my_list_wishcost{ padding:5px 0; text-align:left; } .mypage_list_wrap .my_list_wishbtn{ text-align:right; padding-bottom:10px!important; padding-right:15px!important;} .my_list_wishbtn .btn_icon{ display:inline-block!important; } .my_list_wishbtn .btn_icon i{ font-size:1.5rem; margin-left:7px } } /*마일리지*/ .mileage_box{} .mileage_box .table-bordered { border-left:none; border-right:none} .mileage_box .table-bordered th{background:#fafafa;} .mileage_box .table-bordered th:first-child{border-left:none;} .mileage_box .table-bordered th:last-child{border-right:none;} .mileage_box .table-bordered td:first-child{border-left:none;} .mileage_box .table-bordered td:last-child{border-right:none;} .mileage_box .row .col-lg-4{ padding:0; text-align:center; } .mileage_box .row{ margin:0 } .mileage_box dt { border-bottom: 1px solid #eee; border-top: 1px solid #000; background: #fafafa; padding: .75rem; border-right:1px solid #eee; font-weight:400; } .mileage_box dd{ border-bottom: 1px solid #eee; padding:1rem .75rem; border-right:1px solid #eee; } .mileage_box .row .col-lg-4:last-child dl dd, .mileage_box .row .col-lg-4:last-child dl dt{ border-right:none; } .mypage_list_wrap .mypage_list_body .mileage_list_box{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; width:100%; border-bottom: 1px solid #eee; } .mypage_list_wrap .mypage_list_body .mileage_list_box > div{ } .mypage_list_wrap .mypage_list_body .mileage_info_box{ width:calc(100% - 200px ); display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; } .mypage_list_wrap .mypage_list_body .mileage_info_box > div{ border-left:1px #eee solid; padding:1rem 0; min-height:58px } .mypage_list_wrap .mypage_list_body .mileage_info_box:after{ content:''; display:block; clear:both; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_status{ text-align:center; width:150px } .mypage_list_wrap .my_list_mileage, .mypage_list_wrap .my_list_dc { width: 100px; text-align: center; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_mileage{ text-align:center; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item{ width:calc(100% - 250px) } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item{ padding-left:10px; display: flex; justify-content: flex-start; align-items: center; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item .mileage_ico{ display: inline-flex; align-items: center; height: 20px; padding: 0 8px; font-size: 12px; line-height: 1.2em; letter-spacing: -0.02em; color: #fff; border-radius: 0; background-color: #4FB748; margin-right:10px; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item .mileage_ico.mileage_use{ color: #999; background-color: #f5f5f5; } @media (max-width: 1200px) { .mileage_box dt{font-size:14px} .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item{display:block;} .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item .mileage_ico{ margin-bottom:5px} } @media (max-width: 992px) { .mypage_list_wrap .mypage_list_body .mileage_list_box{ display: block; } .mypage_list_wrap .mileage_list_body { border-top: 1px solid #eee; } .mypage_list_wrap .mypage_list_body .mileage_info_box{ display: block; padding-top:0!important } .mypage_list_wrap .mypage_list_body .mileage_info_box > div{ border-left:none; padding:0.5rem 0 } .mypage_list_wrap .mypage_list_body .mileage_info_box .mypage_list_status{ text-align:center; width:auto; } .mypage_list_wrap .mileage_list_box .my_list_date{padding-top:15px; width: 100%; padding-bottom: 0!important; text-align: left; color: #999; font-size: 11px; } .mypage_list_wrap .mypage_list_body .mileage_info_box, .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item{ width:100% } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item{padding-left:0; display:block;} .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item .mileage_item p{margin-top:5px} .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_item{padding-bottom:0} .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_mileage{ float:none; text-align:left; } .mypage_list_wrap .mypage_list_body .mileage_info_box .my_list_status{ position:absolute; bottom:2px; right:0; text-align:right; width:auto; } .mileage_box{ } .mileage_box .col-lg-4{display: table; width: 100%;} .mileage_box dl{ position: relative; display: table-row; width: 100%;} .mileage_box dt{width:65%; text-align:left; border-top:none;} .mileage_box dd{width:35%; text-align:right;} .mileage_box dt, .mileage_box dd{ border-right:none; display: table-cell;} } /*주문목록*/ .dreamweb_order_table .table .btn{min-width:75px; font-size:12px} .order_detail_top{ } .order_detail_top .flex-l-m div{margin-right:40px; position:relative;} .order_detail_top .flex-l-m div:after{content:''; display:block; width:1px; height:15px; background:#ddd; top:50%; right:-20px; position:absolute; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .order_detail_top .flex-l-m div:last-child:after{display:none;} .order_detail_payment_box{padding-top:10px ; padding-bottom:10px; border-bottom: 1px solid #eee; } .order_detail_payment dl{} .order_detail_payment dt{font-size:14px; padding:5px 10px} .order_detail_payment dd{ font-family:"Roboto",'Noto Sans KR',sans-serif; } .order_detail_payment dd strong.price_color {color:#fa5c7c; font-size:18px} .order_detail_payment dd.total_payment2{color:#fa5c7c;} .order_detail_payment_box .total_payment_line{margin:10px 0; border-bottom: 1px solid #eee; } @media (max-width: 992px) { .order_list_tit {padding-left:15px!important} } /*주문상세*/ .order_detail_top{ } .order_detail_top .flex-l-m div{margin-right:40px; position:relative;} .order_detail_top .flex-l-m div:after{content:''; display:block; width:1px; height:15px; background:#ddd; top:50%; right:-20px; position:absolute; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .order_detail_top .flex-l-m div:last-child:after{display:none;} .order_detail_payment_box{padding-top:10px ; padding-bottom:10px; border-bottom: 1px solid #eee; } .order_detail_payment dl{} .order_detail_payment dt{font-size:14px; padding:5px 10px} .order_detail_payment dd{ } .order_detail_payment dd strong.price_color {color:#fa5c7c; font-size:18px} .order_detail_payment dd.total_payment2{color:#fa5c7c;} .order_detail_payment_box .total_payment_line{margin:10px 0; border-bottom: 1px solid #eee; } @media (max-width: 992px) { .order_detail_top .flex-l-m{display:block} .order_detail_top .flex-l-m div:after {display:none} } /*리워드*/ .mypage_search_form_box {margin-bottom:50px} .mypage_search_form_box select{ height: calc(1.8125rem + 3px)!important; width:70px!important;} .search_input .form-group{margin-bottom:0} .mypage_search_form_box .btn-group .btn{font-size:12px; padding: 0.3rem 0.8rem;} .mypage_search_form_box .search_date_reward .form-control{ padding: .3rem .5rem;} .reward_list_body{padding-bottom:30px} /*회원정보수정*/ .edit_pw_info{padding:0.75rem 0; width:100%; display:flex;} @media (max-width: 991.98px) { .member_modify_wrap .dream_info_box{border-top:none; margin:0 -15px} } /*추천*/ .recom_info span{display:inline-block; margin-left:30px; position:relative; } .recom_info span:after{content:'';display:block; position:absolute; top:50%; left:-15px; width:1px; height:10px; margin-top:-5px; background:#aaa } .recom_info span:first-child:after{display:none} /*쿠폰*/ .mycoupon_wrap{padding:15px 0 0 0px} .mycoupon_list{ margin-bottom:40px } .mycoupon_wrap .mycoupon_list:last-child{ margin-bottom:0 } .mycoupon_list .mycoupon_box{ border:1px #a9a9a9 solid; border-radius:10px; min-height:150px; width:100%; position:relative; text-align:center; padding:15px 15px 0 15px; } .mycoupon_box:after{ content:''; display:block; width:23px; height:46px; background:url(/webftp/mycoupon_box_line_l.png) no-repeat; position:absolute; left:-1px; top:50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .mycoupon_box:before{ content:''; display:block; width:23px; height:46px; background:url(/webftp/mycoupon_box_line_r.png) no-repeat; position:absolute; right:-2px; top:50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .mycoupon_box .coupon_kind{ border:1px #4FB748 solid; border-radius:15px; padding:5px 15px; display:inline-block } .mycoupon_box .coupon_name{ font-weight:500; padding-top:10px } .mycoupon_box .coupon_discount{ font-size:30px; color:#4FB748; font-weight:700 } .mycoupon_box .coupon_usable{ border-top:1px #a9a9a9 solid; text-align:center; padding:10px;; width:calc(100% + 30px); margin-left:-15px; margin-top:15px; } .mycoupon_list .mycoupon_info{ color: #989898; font-size:12px; text-align:center; padding-top:10px } @media (max-width: 992px){ .mycoupon_wrap{padding-left:15px; padding-right:15px} } /*배송지*/ .goods_list_wrap .goods_list_checkbox{ /* width:100px; text-align:center;*/ } .goods_list_wrap .address_list_addr{ width:calc(100% - 550px); } .goods_list_wrap .address_list_name, .goods_list_wrap .address_list_zip, .goods_list_wrap .address_list_tel{ } .address_list_box{ } .myAddrTop { padding:30px 0 0px; margin-bottom:-10px} .address_list_box .address_list_tel{ width:auto; text-align:left; padding-left:20px; position:relative;} .address_list_box .address_list_tel:before{ content: "\F011D"; position:absolute; top:0;left:0; font: normal normal normal 16px/1 "Material Design Icons";} /*추천인*/ .recom_list_header > div{ width:25%; text-align:center; } .recom_list_body{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; width:100%; border-bottom: 1px solid #eee; } .recom_list_body > div{ width:25%; text-align:center; padding:0.75rem; border-right:1px solid #eee; } .recom_list_body > div:last-child{border-right:none;} @media (max-width: 992px) { .recom_list_body .my_list_no{ display:none; } .recom_list_body{ display:block; padding:10px 0 } .recom_list_body:first-child{ } .recom_list_body > div{ position:relative; width:50%; float:left; text-align:left; padding:0.25rem 0.75rem; border-right:none; } .recom_list_body:after{ content:''; display:block; clear:both; } } /*내 게시글*/ .my_boardlist_list .my_boardlist_box{ border-bottom:1px solid #eee; padding:15px 0 } .my_boardlist_list .my_boardlist_box .my_boardlist_date{ color:#999; padding-top:5px; font-size:11px } /* 마이페이지 리스트 스타일 ============================================================================================ */ .my_basic_box{ border-top:1px #e6e6e6 solid; } .my_basic_box .no_content{ text-align:center; padding:50px 15px } .my_basic_box .my_list_box{ border-bottom:1px #e6e6e6 solid; padding:15px } .my_basic_box .my_list_box .my_info_top{ color: #989898; margin-bottom:5px } .my_basic_box .my_list_box .my_info_body{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; } .my_basic_box .my_list_box .my_list_btn{ margin-top:15px } .my_basic_box .my_list_box .my_list_btn .btn{ width:100% } .my_basic_box .my_list_box .my_cost strong{ font-size:16px } .my_basic_box .my_list_box .my_more_btn{ padding-right:20px; position:relative; } .my_basic_box .my_list_box .my_more_btn:after{ content: "\e93f"; font-family: xeicon!important; position:absolute; top:0; right:0 } /*********** 게시판 ***********/ .dream_community_contents{} .dream_community_contents .breadcrumb h3{text-align:left;} @media (min-width: 992px){ .dream_community_contents .sub_menu_wrap{ } .dream_community_contents .sub_menu_wrap ul{display: flex; flex-direction:row; gap:0;} .dream_community_contents .sub_menu_wrap li{flex: 1; position: relative; font-size: 16px; line-height: 1.25; color: #666;} .dream_community_contents .sub_menu_wrap li a{display:block; height:62px; border-bottom:none; text-align:center; font-size: 16px; position:relative; display: flex; justify-content: center; align-items: center;} .dream_community_contents .sub_menu_wrap li a:after{content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: -1px; border: 1px solid #a7a7a7;} .dream_community_contents .sub_menu_wrap li:first-child:after{left:0} .dream_community_contents .sub_menu_wrap li.active a{border-bottom:none; background:#000; color:#fff;} } .dream_community_contents .board_list_title { text-align:left; font-size:1.5rem; margin-bottom:20px} .pop_btn_01{cursor:pointer;color:#fff;background:#45b7ab;padding:6px 25px;border: 0px solid #dddddd;margin-top:0px; vertical-align:middle;} .board_category_tab{margin-bottom:35px; text-align:center;} .board_category_tab ul{ display:inline-block} .board_category_tab ul:after{content:'';display:block; clear:both;} .board_category_tab li{float:left; margin-right:7px; margin-bottom:10px} .board_category_tab li a{ } .board_category_tab li.on a{ } .gallery_notice_list{border-top:1px #e5e5e5 solid; margin-bottom:30px} .gallery_notice_list li{padding:7px 0; border-bottom:1px #e5e5e5 solid;} .board_gallery_wrap .dream_galleryboard_list{margin-bottom:30px} .board_gallery_wrap .dream_galleryboard_list .gallery_board_tit { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 600;} .board_gallery_wrap .dream_galleryboard_list .gallery_board_tit br{display:none} .board_gallery_wrap .dream_galleryboard_list .gallery_board_info{position:relative; font-size:14px; color:#999; } .board_gallery_wrap .dream_galleryboard_list .gallery_board_info span{float:right; display:block;} .board_gallery_wrap .dream_galleryboard_list .gallery_borad_photo{background:#f8f8f8; border:1px #e5e5e5 solid; margin-bottom:15px} .board_gallery_wrap .dream_galleryboard_list .gallery_borad_photo a{display:block; height:250px;} .board_gallery_wrap .dream_galleryboard_list .gallery_borad_photo .gallery_borad_img{ background-position:center center; background-size:cover; background-repeat:no-repeat; width:100%; height:100%; } .passcodes_box { } .passcodes_box .passcodes_input{border:1px #ddd solid; height:45px; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem;} .passcodes_box .passcodes_input input{border:none; padding-left:10px; line-height:43px} .passcodes_box .passcodes_num{border:1px #ddd solid; border-left:none; padding-top:10px; height:45px; border-top-right-radius: .25rem; border-bottom-right-radius: .25rem;} .passcodes_box .passcodes_num img{width:80px} .board_top{padding-bottom: 0px} .board_top h3{ } .board_top p{display:none; color:#aaa; text-align:center;} .board_page{display:none; margin-bottom:15px; padding-top:15px; font-size:12px} .board_page .dream_box_L span{display:inline-block; margin-right:30px; position:relative; font-size:12px} .board_page .dream_box_L span:after{content:'';display:block; position:absolute; top:50%; right:-15px; width:1px; height:10px; margin-top:-5px; background:#aaa } .board_page .dream_box_L span:last-child:after{display:none} .board_page .dream_box_R {font-size:12px;} .board_search_form{padding-top:50px} .board_search_form .board_search_btn .btn{} .board_search_form .custom-control-label {font-size:0.875rem;} .board_search_form .board_search_input .btn{padding-left:10px; padding-right:10px} .board_search_form .board_search_input .form-control{padding-top:10px; padding-bottom:10px} .board_search_form .form-group{margin-bottom:0} .board_w15{width:15px} .board_search_input_notice{width:100%} .dreamweb_table_community .table thead th{text-align:center; background:#F5F5F5; font-size:14px; font-weight:500; border-top:1px #000 solid; border-left:1px #eee solid;} .dreamweb_table_community .table thead th:first-child{border-left:0} .dreamweb_table_community .table td{font-size:14px} .dreamweb_table_community .table td .btn-sm{font-size:12px} .dreamweb_table_community .table td{border-left:1px #eee solid;} .dreamweb_table_community .table td:first-child{border-left:0} /* FAQ */ .faq { border-bottom:1px solid #eee} .faq dt {border-top:1px solid #e5e5e5} .faq dt:first-child {border-top:none} .faq dt a {position:relative;display:block;padding:0px 50px 0px 60px; height:50px; line-height:50px} .faq dt a:hover { text-decoration:underline} .faq dt a:hover .number, .faq dt a:hover .type { } .faq dt a:hover .number2 { } .faq dt.active a { } .faq dt a .ico_com {position:absolute;top:0px;left:22px; font-weight:600; font-size:16px; font-family: 'Helvetica';} .faq dt a:after {position:absolute;top:35px;right:20px} .faq dt.active a:after {background-position:-170px 0} .faq dd {display:none;padding:25px 50px 25px 50px; background:#f3f3f3; border-top:1px #eee solid;} .faq dd .ico_comb {position:relative;padding-left:52px;line-height:23px} .faq dd .ico_comb:before {position:absolute;top:6px;left:0} .faq dd .ico_comb .ico_com {position:absolute;top:5px;left:27px} .faqList h5{font-size:16px} .active .ico_coma.open:after { background-position: -70px 0;} .ico_coma.open:after { width: 16px; height: 10px; background-position: -50px 0;} .faq dd div.icon_a{position:relative; padding-left:10px; line-height:160%} .faq dd div.icon_a:before{ content: 'A'; display: block; width: 16px; height: 14px; position:absolute;top:0px;left:-25px; font-weight:600; font-size:16px; color:#ee2d7a; font-family: 'Helvetica';}} .faq dd div.icon_a:after{ content: ''; display: block; background-image: url(/webftp/ico_board.png); background-repeat: no-repeat; width: 9px; height: 10px; background-position: -40px 0; position:absolute;top:5px;left:-35px} .faq_notice{ border-top:1px } .faq_notice span{display:inline-block; width:80px; text-align:center; line-height:80px} .faq_notice span img{vertical-align:middle;} .faq_notice a{ } .faq_Search{margin-top:50px} .faq_notice li, .gallery_notice{padding:10px 10px} .faq_notice li img, .gallery_notice li img{margin-right:7px;} .faq-question-q-box{ height: 30px; width: 30px; color: #fff; background-color: #4FB748; -webkit-box-shadow: 0 0 45px 0 rgb(0 0 0 / 12%); box-shadow: 0 0 45px 0 rgb(0 0 0 / 12%); text-align: center; border-radius: 50%; margin-right:15px; font-weight: 700; line-height: 30px; display:block; } .faq-subject{ width:calc(100% - 45px) } /* 댓글 */ .board_tail_word_box{border:1px #eee solid; background:#fafafa; padding:15px; margin-top:30px} .tail_word_textarea{width: calc(100% - 110px);} .tail_word_textarea textarea{ border:1px #eee solid; padding:10px;box-sizing: border-box; width:100%; height:80px} .tail_word_btn{width:90px} .tail_word_btn a{ height:100%; height:80px; text-align:center; padding:0 display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: center; -ms-align-items: center; align-items: center; } .board_tail_word_box .tail_word_box_member{margin-bottom:10px} .board_tail_word_box .tail_word_box_member input{background:#fff; padding-left:10px; border:1px #eee solid; height:45px; line-height:45px; margin-right:5px} .tail_word_list_box{border-top:1px #eee solid;} .tail_word_list_box li {padding:0px 0px; border-bottom:1px #eee solid; position:relative;} .tail_word_list_box li:after{content:'';display:block; clear:both} .tail_word_list_box li .delete_button{position:absolute; top:10px; right:20px} .tail_word_list_box li .tail_info{ color:#666; background:#fafafa; height:50px; line-height:50px; padding-left:20px; border-bottom:1px #eee dotted;} .tail_word_list_box li .tail_info span{display:inline-block; margin-right:30px; position:relative;} .tail_word_list_box li .tail_info span:after{content:'';display:block; position:absolute; top:15px; right:-15px; width:1px; height:20px; background:#eee} .tail_word_list_box li .tail_info span:last-child:after{display:none} .tail_word_list_box li .tal_contents{ padding:20px;} .tail_word_list_box li .delete_button a { border: 1px #ddd solid; display: inline-block; width: 25px; height: 25px; border-radius: 50%; line-height: 25px; margin: 0 0px; text-align:center; background:#fff;} .tail_word_list_box li .delete_button a i{line-height:25px; font-size:12px;} .memo_check_box .dream_button_box{margin:0} .memo_check_box .dream_box{margin:15px 0 0 0} .memo_check_box .dream_box .dream_button{margin-left:0} .memo_check_box .dream_box .dream_box_R{width:100px} .memo_check_box .dream_box .dream_box_L{width: calc(100% - 100px);} .memo_check_box .dream_box .dream_box_L input{width:100%; border:1px #ddd solid; height:36px; line-height:34px; padding-left:10px} .btn_del_tailword{position:relative; } .btn_del_tailword:after{content:'\ead2'; display:block; font-family: "unicons";} /*목록*/ .board_list{border-bottom:1px #ddd solid; height:40px; line-height:40px} .board_list_now{color:#333} .board_list_top{margin-bottom:10px; position:relative;} .board_list_top .board_list_inner{position:absolute; top:-45px;right:0; z-index:90; display: flex; justify-content: flex-end; align-items: center; } .board_list_top .bl_category{ margin-right:40px;position:relative;} .board_list_top .bl_category:after{content:'';display:block; width:1px; height:12px; background:#ddd; position:absolute; top:50%; margin-top:-6px; right:-20px} .board_list_top .bl_category .form-control{ border :none; min-width:100px } .board_list_top .bl_search_form{} .board_list_top .bl_search_form .bl_search_box .btn_basic_s{min-width:60px; height:32px; font-size:13px; margin-left:5px; line-height:30px} .board_list_top .bl_search_form .bl_search_box .form-control{width:230px; border:none;} .board_list_wrap{border-top:1px #000 solid;} .board_list_wrap > ul > li{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; border-bottom:1px #f1f1f1 solid; padding:15px 0} .board_list_wrap > ul > li.board_notice{background:#f7f7f7; padding-left:10px} .board_list_wrap > ul > li .bl_no{display:none;} .board_list_wrap > ul > li .bl_info{} .board_list_wrap > ul > li .bl_info span{font-size: 14px; display: inline-block; vertical-align: middle; position: relative; padding: 0 13px; color:#999} .board_list_wrap > ul > li .bl_info span:after{content:''; height: 8px; width: 1px; display: block; position: absolute; top: 50%; left: 0;background-color: #e4e6eb; margin-top: -4px;} .board_list_wrap > ul > li .bl_info span:first-child:after{display:none;} .board_list_wrap > ul > li .bl_info span:first-child{padding-left:0} .board_list_wrap > ul > li .bl_info span.bl_hit{ min-width:90px; padding-left: 32px; text-align: left; } .board_list_wrap > ul > li .bl_info span.bl_hit:before{content: "\F06D0"; position:absolute; top:2px;left:10px; font: normal normal normal 16px/1 "Material Design Icons";} .board_list_wrap > ul > li .bl_title{padding-left:10px} .board_list_wrap > ul > li .bl_title a{font-size:16px} .board_list_wrap > ul > li .bl_title img{margin-left:3px} .board_list_wrap > ul > li .bl_title .bl_reply{ font-size:12px; color:#aaa} .board_list_wrap > ul > li .bl_title .board_file_icon{margin-right:10px} .board_list_wrap > ul > li .bl_title .board_photo{margin-right:10px; position: relative; width:80px; height:80px} .board_list_wrap > ul > li .bl_title .board_photo .photo_img{width:100%; height:100%} .board_list_wrap > ul > li .bl_title .board_photo .photo_img img{ position: absolute; top: 0; left: 0; transform: translate(50, 50); width: 100%; height: 100%; object-fit: cover; margin: auto; } .board_list_btn{text-align:right;} .board_category{padding-bottom:15px} .board_list_box{margin-top:20px; border-top:1px #000 solid;} .board_list_box li{box-sizing: border-box; padding:15px 0px; border-bottom:1px #eee solid;} .board_list_box li a{display:block;} .board_list_box li a p{ font-size:16px; color:#000; padding-bottom:5px; line-height:140%} .board_list_box li a p i{margin-right:5px} .board_list_box li span{ color:#999!important; font-size:14px; margin-right: 30px; position: relative; } .board_list_box li span:after{content:'';display:block; position:absolute; top:50%; margin-top:-5px; right:-15px; width:1px; height:10px; background:#aaa } .board_list_box li span:last-child:after{display:none} .board_list_box li span:last-child{margin-right:0} .board_list_box li .shop_store_category{margin-bottom:7px; font-size:14px; color:#000} .board_list_box li .shop_store_category span{display:inline-block; background:#eb6100; padding:0 5px; border-radius:3px; color:#fff; margin-right:10px} .board_list_box li .answer, .answer{display:inline-block; background:#ff3b73; color:#fff; padding:0 7px; border-radius:3px; margin-bottom:5px} .board_list_box li .board_su{margin-bottom:7px} .board_list_box li .board_su a{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:100%} .mtom_list_box{border-top:1px #eee solid; margin-top:0} .board_input_btn_box{display: flex; justify-content: flex-end; margin-top:2.7777rem; } .board_input_btn_box .btn{min-width:150px} .board_notice_list , .gallery_notice_list{ } .board_notice_list li, .gallery_notice_list li{background:#f7f7f7; display: flex; justify-content: flex-start; align-items: center; border-top:1px #eee solid; padding:15px 0 } .board_notice_list li:first-child{border-top:1px #000 solid; } .board_notice_list li:last-child, .gallery_notice_list li:last-child{ border-bottom:1px #eee solid;} .board_notice_list li a, .gallery_notice_list li a{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /*보기 */ .board_view_top{margin-bottom:10px; font-size:14px; border-top:1px #000 solid; border-bottom:1px #f1f1f1 solid;} .board_view_top .bvt_info{padding-bottom:30px} .board_view_top .bvt_info span{display:inline-block; margin-right:30px; position:relative; color:#999} .board_view_top .bvt_info span:after{content:'';display:block; position:absolute; top:50%; margin-top:-5px; right:-15px; width:1px; height:10px; background:#aaa } .board_view_top .bvt_info span:last-child:after{display:none} .board_view_top .bvt_info span:last-child{margin-right:0} .board_view_top .ViewTitle { text-align:left; padding: 30px 0 15px; } .board_view_top .ViewTitle h3{ font-weight:normal; font-size:26px!important; margin-bottom: 0px!important; text-align:left;} .board_view_top .ViewTitle > span { display: inline-block; width: calc(50% - 3px); color: #666;} .board_view_top .ViewTitle > span.hits { text-align: right;} .board_view_top .ViewTitle .shop_store_category{margin-bottom:7px; font-size:14px; color:#000} .board_view_top .ViewTitle .shop_store_category span{display:inline-block; background:#eb6100; padding:0 5px; border-radius:3px; color:#fff; margin-right:10px} .board_view{margin:0 0px} .board_view .view_centents{min-height:180px; padding:30px 0;line-height:150%; border-bottom: 1px solid #f1f1f1; font-size:16px} .board_view .view_centents img{max-width:100%;} .board_view .view_centents span, .board_view .view_centents p{line-height:150% } .board_view .view_centents .view_fn{padding-bottom:10px} .board_view .view_centents .board_file{text-align:center;} .board_view .view_centents .board_file img{margin:0 auto; max-width:100%} .board_next_prev_box .board_next_prev_list{height:50px; line-height:50px; border-bottom:1px #eee solid; font-size:14px} .board_next_prev_box .board_next_prev_list:first-child{ } .board_next_prev_box .board_next_prev_list span{ display:inline-block; width:18%; background:#fff; text-align:left; padding-left:45px; height:48px; margin-right:0px; color:#666} .board_next_prev_box .board_next_prev_list a{ } .board_next_prev_box .board_next_prev_list br{display:none} .board_next_prev_box .board_file_list span{position:relative; padding-left:45px; display:inline-block} .board_next_prev_box .board_file_list span:after{content: "\F0966"; font: normal normal normal 18px/1 "Material Design Icons"; position: absolute; top: 50%; left: 15px; transform: translateY(-50%);} .board_next_prev_box .board_prev_list span, .board_next_prev_box .board_next_list span{position:relative;} .board_next_prev_box .board_prev_list span:after{ content: "\e945"; font-family: xeicon!important; position: absolute; top: 0px; left: 15px; } .board_next_prev_box .board_next_list span:after{ content: "\e942"; font-family: xeicon!important; position: absolute; top: 0px; left: 15px; } .board_pw_box{width:500px; margin:0 auto;} .board_pw_box .form-group{margin-bottom:0} .board_pw_box .form-group .form-control{border:none; background-color:transparent!important} /* 댓글 */ .board_tail_word_box{border:1px #eee solid; background:#f7f7f7; padding:15px; margin-top:30px} .tail_word_textarea{width: calc(100% - 110px);} .tail_word_textarea textarea{ border:1px #eee solid; padding:10px;box-sizing: border-box; width:100%; height:80px} .tail_word_btn{width:90px} .tail_word_btn a{ height:100%; height:80px; text-align:center; padding:0 display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: center; -ms-align-items: center; align-items: center; background:#fff; } .board_tail_word_box .tail_word_box_member{margin-bottom:10px} .board_tail_word_box .tail_word_box_member input{background:#fff; padding-left:10px; border:1px #eee solid; height:45px; line-height:45px; margin-right:5px} .tail_word_list_box{border-top:1px #eee solid;} .tail_word_list_box li {padding:0px 0px; border-bottom:1px #eee solid; position:relative;} .tail_word_list_box li:after{content:'';display:block; clear:both} .tail_word_list_box li .delete_button{position:absolute; top:10px; right:20px} .tail_word_list_box li .tail_info{ color:#666; background:#fafafa; height:50px; line-height:50px; padding-left:20px; border-bottom:1px #eee dotted;} .tail_word_list_box li .tail_info span{display:inline-block; margin-right:30px; position:relative;} .tail_word_list_box li .tail_info span:after{content:'';display:block; position:absolute; top:15px; right:-15px; width:1px; height:20px; background:#eee} .tail_word_list_box li .tail_info span:last-child:after{display:none} .tail_word_list_box li .tal_contents{ padding:20px;} .tail_word_list_box li .delete_button a { border: 1px #ddd solid; display: inline-block; width: 25px; height: 25px; border-radius: 50%; line-height: 25px; margin: 0 0px; text-align:center; background:#fff;} .tail_word_list_box li .delete_button a i{line-height:25px; font-size:12px;} .memo_check_box .dream_button_box{margin:0} .memo_check_box .dream_box{margin:15px 0 0 0} .memo_check_box .dream_box .dream_button{margin-left:0} .memo_check_box .dream_box .dream_box_R{width:100px} .memo_check_box .dream_box .dream_box_L{width: calc(100% - 100px);} .memo_check_box .dream_box .dream_box_L input{width:100%; border:1px #ddd solid; height:36px; line-height:34px; padding-left:10px} .btn_del_tailword{position:relative; } .btn_del_tailword:after{content:'\ead2'; display:block; font-family: "unicons";} /*글작성*/ .board_input_box{} .board_input_box dd .inputTypeText{width:100%} .passcodes_box { } .passcodes_box .passcodes_input{border:1px #eee solid; height:45px; } .passcodes_box .passcodes_input input{border:none; padding-left:10px; line-height:43px} .passcodes_box .passcodes_num{border:1px #eee solid; border-left:none; padding-top:10px; height:45px; } .passcodes_box .passcodes_num img{width:80px} /*비밀번호 입력*/ .board_pw_box{width:500px; margin:0 auto;} .board_pw_box .form-group{margin-bottom:0} .board_pw_box .form-group .inputTypeText{border:none; background-color:transparent!important; width:100%} /*수정 */ .bm_file{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center;} /*이용후기 문의*/ .goods_qna_review_box .goods_img{margin-right:20px} .goods_qna_review_box .goods_info{width:calc(100% - 120px)} .goods_qna_review_box .goods_qna_review{padding-bottom:15px; padding-top:15px; border-bottom:1px #eee solid;} .goods_qna_review_box .goods_qna_review .goods_name{font-size:12px; color:#999} .goods_qna_review_box .goods_qna_review .goods_su{font-size:16px; margin-top:5px} .goods_qna_review_box .goods_qna_review .goods_etc span{font-size:12px; color:#999; margin-left:30px; position:relative;} .goods_qna_review_box .goods_qna_review .goods_etc span:after{} .goods_qna_review_box .goods_qna_review .goods_etc span:after{content:'';display:block; position:absolute; top:2px; left:-15px; width:1px; height:14px; background:#eee} .goods_qna_review_box .goods_qna_review .goods_etc span:first-child:after{display:none} .goodsqna-modal-body{padding-bottom:30px} .goods_qna_review_box .goodsqna_tit {border-bottom:1px #eee solid; padding-bottom:15px; padding-top:15px} .goods_qna_review_box .goodsqna_content{padding-bottom:15px; padding-top:15px; border-bottom:1px #eee solid; background:#fafafa; padding-left:15px; padding-right:15px } .goods_qna_review_box .faq-question-q-box{ display:inline-block; height: 25px; width: 25px; margin-right:10px; line-height: 25px; } .goods_qna_review_box .faq-question-a-box{ display:inline-block; height: 25px; width: 25px; margin-right:10px; line-height: 25px; color: #fff; background-color: rgba(0,0,0,.5); -webkit-box-shadow: 0 0 45px 0 rgb(0 0 0 / 12%); box-shadow: 0 0 45px 0 rgb(0 0 0 / 12%); text-align: center; border-radius: 50%; font-weight: 700; } .goods_qna_review_search{ border-bottom:1px #000 solid; margin-top:-45px} .goods_qna_review_search .form-group{margin-bottom:10px} .goods_qna_review_search .form-control{ width: 230px; border: none;} .goods_qna_review_search > .flex-l-m{margin-bottom:10px} .esti_photo_box .esti_photo_file {margin: 0 15px} @media (max-width: 992px) { .dream_community_contents .breadcrumb h3{text-align:center;} .board_list_box{margin-top: 0px; border-top:none} .address_list_box{border-top:2px #333 solid;} .myAddrTop{margin-bottom:0; padding-bottom:10px} .address_list_box .address_list_tel{display:block;} .address_list_box .address_list_addr {margin-right:0;} .address_list_box .address_list_addr:after{display:none} .bm_file{ display: block; } .bm_file .flex-l-m{margin-top:10px} .dream_community_contents .board_list_title{display:none;} .board_list_top{ } .board_list_top .board_list_inner{position:relative; top:auto; right:auto; ;margin-top:15px} .board_input_btn_box .btn{width:100%} .goods_qna_review_search{ margin-top:15px} .goods_qna_review .goods_contents{display:block;} .goods_qna_review .goods_contents .goods_etc{margin-top:5px; } .goods_qna_review_box .goods_qna_review .goods_etc span:first-child{ margin-left: 0px; } /*후기*/ .esti_modify_wrap{margin-top:30px} .esti_photo_box{display:block;} .esti_photo_box .esti_photo_file {margin: 10px 0 0 0} } @media (max-width: 768px) { .board_list_wrap > ul > li{display:block;} .board_list_wrap > ul > li .bl_info{margin-top:5px; padding-left:10px} .board_list_wrap > ul > li .bl_info span{font-size: 12px; } .board_list_wrap > ul > li .bl_title {display:block; padding-left:10px} .board_list_wrap > ul > li .bl_title a{ } .board_list_top .bl_search_form .bl_search_box .form-control{width:155px} /*faq*/ .faqList h5{font-size:1rem} .faqList .card-header{padding-left:10px; padding-right:10px} .faqList .custom-accordion-title .flex-l-m > div:last-child {width:calc(100% - 40px);} .faq-question-q-box{margin-right:10px} .custom-accordion .accordion-arrow{top:50%; transform: translateY(-50%); font-size: 1rem;} /*갤러리*/ .board_gallery_wrap .dream_galleryboard_list .gallery_borad_photo .gallery_borad_img{height:250px} /*보기*/ .board_view_top{ border-top:none; font-size:12px} .board_next_prev_box .board_next_prev_list{ font-size:12px} .board_next_prev_box .board_next_prev_list a{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} /*댓글*/ .board_tail_word_box .tail_word_box_member input{ width:calc(50% - 5px) } .board_tail_word_box .tail_word_box_member input:last-child{ float:right; margin-right: 0px; } .tail_word_textarea, .tail_word_btn{ width: calc(100% - 0px); } .tail_word_box{display:block!important; } .tail_word_btn a { height: 40px; text-align: center; padding: 0 display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: center; -ms-align-items: center; align-items: center; width:100%; margin-top:10px } } @media (max-width: 630px) { .board_bottom_wrap{display:block;} .board_search_box{justify-content: space-between;} .board_search_box .board_search_chk{width:235px} .board_search_box .board_search_form {width:calc(100% - 235px); margin-left:0} .board_search_box .board_search_form .inputTypeText{width:calc(100% - 25px);} .board_bottom_wrap .board_btn_box{margin-top:30px} .board_bottom_wrap .board_btn_box .btn-basic{width:100%} /*갤러리*/ .board_gallery_wrap .dream_galleryboard_list .gallery_borad_photo .gallery_borad_img{height:200px} /*보기*/ .board_view_top .ViewTitle h3 { font-size: 18px!important; } .board_next_prev_box .board_next_prev_list { display: flex; align-items: center; justify-content: flex-start;} .board_next_prev_box .board_next_prev_list span {width:45px} .board_next_prev_box .board_next_prev_list span em{display:none;} .board_next_prev_box .board_next_prev_list a{width:calc(100% - 45px); display:block} .board_pw_box{width:100%; margin:0 auto; margin-top:30px} } /*********** 이용안내 ***********/ .guide_menu_box .card{margin-bottom:30px} .guide_menu_box .card-body {text-align:center} .guide_menu_box .card-body i{margin-bottom:10px; display:block;} .guide_menu_box .card-body h6{font-size:18px} .guide_menu_box .card-body p{font-size:14px; color:#999} .guide_wrap {margin-bottom:50px} .guide_wrap h4 {text-align:left; margin-bottom:15px } .guide_wrap .guide_box{border:1px #eee solid; padding:30px} /*********** 회원가입 ***********/ .join_provision_wrap{margin-bottom:50px} .join_provision_wrap .join_provision_box{ border:1px #ddd solid; padding:15px; overflow:auto; width:100%; line-height:1.6; margin-bottom:15px; height:150px; margin-top:30px} .joinbox .idbox{position: relative;} .joinbox .idbox p#idcheck{ } .joinbox .form-control-join{width:250px} .joinbox .form-control-phone{width:80px} .joinbox .form-control-join-auto{width:auto} .joinbox .emailBox{position: relative;} .joinbox .emailBox .emailin{width:98%;} .joinbox .emailBox .email2in{position: absolute;top:0px;right:0px;} .joinbox .emailBox #email2_v{display:none;width:150px;position: absolute;top:15px;right:-160px; border: 1px solid rgba(0,0,0,.15); background:#fff; z-index:10; padding:10px 0} .joinbox .emailBox #email2_v p{cursor: pointer;padding:4px 10px; color: #495057; font-size:14px;} .joinbox .emailBox .email2_btn {cursor: pointer;position: absolute;top: -19px; right:-160px; width:150px; z-index:10} .joinbox .emailBox .email2_btn:after{content: "\e64b"; font-family: 'themify'; position: absolute;right:13px; top:9px;} @media (max-width: 992px) { .joinbox .emailBox .email2_btn{ position:relative; top:0; right:auto; left:0; width:100% } .joinbox .emailBox #email2_v{display:none;width:100%;position: absolute;top:30px;right:auto; left:0 } .emailBox .emailForm .email_search{margin-right:0!important ;margin-top:10px} } .joinbox .form-row .form-group{margin-bottom:0; } .joinbox{margin:0 auto;width:100%;background:#fff;padding:0 0 0px 0} .joinbox .join_idcheck_box .form-control-join{margin-right:10px} .joinbox .join_idcheck_box .join_id_form .btn{margin-right: 10px} div.joinbox span.zip_btn{cursor:pointer;color:#fff;background:#45b7ab;padding:8px 12px;} div.joinbox span.add_chang_btn{cursor:pointer;color:#fff;background:#45b7ab;padding:8px 12px;} div.joinbox p.ft11{font-size:11px;} div.joinbox div.agreebox{position: relative;} div.joinbox div.agreebox div#agree_pop1{display:none;position: absolute;left:-350px;top:-300px;width:300px;border:1px solid #b7b7b7;height:400px;overflow-y:auto;padding:10px;background:#fff;} div.joinbox div.agreebox div#agree_pop2{display:none;position: absolute;left:-350px;top:-300px;width:300px;border:1px solid #b7b7b7;height:400px;overflow-y:auto;padding:10px;background:#fff;} div.joinbox div.agreebox p.agree_tx_btn{cursor: pointer;position: absolute;top: 0;right: 0px;color:#fff;background:#696969;padding:10px 12px;} div.joinbox span.autologin{cursor:pointer;} div.joinbox p.join_submitbtn{cursor:pointer;text-align:center;font-weight:400;font-size:14px;padding:10px 0;color:#fff;background:#3b3b3b;} div.joinbox p.join_submitbtn01{cursor:pointer;text-align:center;font-weight:400;font-size:14px;padding:10px 0;color:#fff; background:#45b7ab; width:98.5%;} div.joinbox p.bz_up_btn{width:140px;text-align:center;cursor:pointer;text-align:center;font-weight:400;font-size:14px;padding:10px 0;border-radius:4px;color:#333;background:#fff;border:1px solid #ddd} div.joinbox p.bz_up_btn:hover{color:#333;background:#45b7ab;} div.join_fl{text-align:center;} div.join_fl h3{font-size:24px;font-weight:100;} div.join_fl div.fl_box{border:5px solid #b7b7b7;width:80%;padding:20px 0;margin:50px auto;} div.join_fl div.fl_btn{margin:0 0 50px;} div.join_fl div.fl_btn span.login_btn{cursor:pointer;border:1px solid #696969;padding:10px;background:#696969;color:#fff;} div.join_fl div.fl_btn span.main_btn{cursor:pointer;border:1px solid #696969;margin-left:10px;padding:10px;} .joinbox .agree_content{padding:16px;width:100%; height:152px;overflow:auto;box-sizing: border-box; background-color: #fafafa; border: 1px solid #eee; margin-bottom:30px; margin-top:20px } .recomidCheck_txt{text-align:center; padding-bottom:30px} .sns_join_form_box p{text-align:center; font-size:16px; margin-bottom:30px} .sns_join_form_box li{width:100%; margin-bottom:15px; border:1px #ddd solid; border-radius:5px; height:80px} .sns_join_form_box li a{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: flex-start; -ms-align-items: center; align-items: center; height:80px; padding:0 25px; position:relative; } .sns_join_form_box li a div{font-size:16px} .sns_join_form_box li a div i{font-size:2rem; margin-right:1.5rem;} .sns_join_form_box li a div .xi-kakaotalk{color:#2d1616} .sns_join_form_box li a div .xi-naver{color:#03cf5d} .sns_join_form_box li a:after{content: "\e649"; font-family: 'themify'; position:absolute; top:50%; right:25px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 992px) { .joinbox{margin-top:30px} .joinbox .form-control-m-full{width:100%!important} .join_idcheck_box{display:block} .join_idcheck_box .join_id_txt{padding-top:10px} .join_tit_box {display:block!important;} .join_tit_box > div{margin-top:10px} } @media (max-width: 768px) { .join_idcheck_box .btn-sm{margin-top:10px; height:33px!important; font-size:12px!important} } /*********** 회원가입완료 ***********/ .member_introduce_box{text-align:center; padding:30px 0} .member_introduce_box i{display:block; margin:0 auto; margin-bottom:15px; font-size:50px} .member_introduce_wrap .page_btn .btn-basic{cursor: pointer;} /*********** 로그인 ***********/ .login_form_wrap{width:520px; margin:30px auto 0; } .login_form_wrap h3{text-align:center;} .login_form_box{ margin-top:30px } .login_form_box .form-control{padding-top:25px; padding-bottom:25px; padding-left:15px; background:#f5f5f5; border:none; font-size:16px;} .login_form_box .form-control:focus{background:#f5f5f5;} .login_form_box input::-webkit-input-placeholder { color:#aaa; } .login_form_box input:-ms-input-placeholder { color:#aaa; } .login_form_box input::placeholder { color:#aaa; } .login_form_box .form-group{margin-bottom:10px} .login-btn-group{text-align:center; margin-top:30px } .login-btn-group a{margin-left: 0px; font-size:14px;position:relative;} .login-btn-group a:last-child{ } .login-btn-group a:last-child:after{content:'';display:none; position:absolute; top:2px; left:-12px;width:1px; height:12px; background:#ddd;} .login-btn-group .btn_join:after{ content: "\F0142";display:block; position:absolute; top:1px;right:-20px; font: normal normal normal 20px/1 "Material Design Icons";} .login_form_wrap .nav{border-bottom:1px #eee solid!important;} .login_form_wrap .nav-tabs .nav-link.active, .login_form_wrap .nav-tabs .nav-item.show .nav-link{color:#000; } .login_form_wrap .nav-tabs .nav-link{font-size:1.14285rem} .login_form_wrap .login_form_box .btn-basic{ font-size:17px; padding:14px 0; width:100% } .login_form_box .form-group .input-group-append{position:absolute; top:50%; transform: translateY(-50%); right:15px; z-index:30} .login_form_box .password-eye:before { font-family:"Material Design Icons"; content:"\F06D0"; font-style:normal; font-weight:400; font-variant:normal; vertical-align:middle; line-height:1.2; font-size:16px; } .login_form_box .show-password .password-eye:before { content:"\F06D1"; } .sns_login_box{text-align:center; padding:30px 0 0 0; border-top:1px #eee solid; margin-top:30px} .sns_login_box .flex-c-m div{margin:0 15px; text-align:center;} .sns_login_box a{ } .sns_login_box .icon_sns {background-size:170px 52px; width:52px; height:52px; display:block; margin:0 auto; margin-bottom: 0px; position:relative; border-radius:50%} .sns_login_box .icon_sns:after{content:'';display:block; font-family: xeicon!important; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); color:#fff; font-size:18px} .sns_login_box .sns_naver{background:#03cf5d;} .sns_login_box .sns_naver:after{ content: "\ebf9";} .sns_login_box .sns_facebook{background:#405a94;} .sns_login_box .sns_facebook:after{ content: "\ebd3"} .sns_login_box .sns_twitter{background:#000;} .sns_login_box .sns_twitter:after{content: "\ec1f";} .sns_login_box .sns_kakao{background:#ffe102 } .sns_login_box .sns_kakao:after{content: "\ebee"} .sns_login_box .sns_login_btn a{margin-left:15px; } .sns_login_box .sns_login_btn a:last-child{margin-left:0} .pwfind_send_mail{padding:15px 0 30px 0} .pwfind_send_mail li{padding:3px 0;text-align:center;} .idpwfind_agree_wrap{margin-bottom:30px} .idpwfind_agree_box{background:#ffffff;width:100%;margin:0 auto;height:200px;overflow:auto;text-align:left;padding:15px;border:1px solid #eee;} #forgotPwmodal .modal-footer .btn{ } #forgotPwmodal .pwcheck_ok_n{font-size:16px; font-weight:700; padding:15px 5px} .autologin_box{} .autologin_box span img{width:18px} span#autologin{display:none;} span#autologin_on{} @media (max-width: 992px) { .login_form_wrap h3{display:none;} } @media (max-width:630px) { .login_form_wrap{width:100%; padding:0 15px } .sns_login_box .sns_login_tit{ font-size:14px; margin-bottom:15px} .sns_login_box div { margin: 0 0px; } } .modal-backdrop-login { position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #474d56; -webkit-transition: opacity .15s linear; transition: opacity .15s linear; opacity: .7; } .pwfind_send_mail{padding:15px 0 30px 0} .pwfind_send_mail li{padding:3px 0;text-align:center;} div#full_back{display:none;width:100%;height:100%;position: fixed;top:0;left:0;z-index:1000;} div#full_back div.full_backbg{width:100%;height:100%;background:#000;filter:alpha(opacity=75);opacity: 0.75;} div#full_back div.loginbox{position: absolute;top:150px;left:50%;margin-left:-150px;width:300px;height:340px;background:#fff;} div#full_back div.loginbox p.loginclose{cursor:pointer;width:25px;position:absolute;top:10px;right:10px;} div#full_back div.loginbox h3 {text-align:center;font-weight:600;font-size:24px;padding:30px 0;} div#full_back div.loginbox div.logins{padding:0 20px;} div#full_back div.loginbox div.logins p input{width:100%;padding:10px;font-size:14px;font-weight:600;border:1px solid #b7b7b7;margin-bottom:10px;} div#full_back div.loginbox div.logins p.login_submitbtn{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#00D255;border:1px solid #00D255} div#full_back div.loginbox div.logins p.login_submitbtn:hover{color:#00D255;background:#fff;} div#full_back div.loginbox div.logins div.login_btns{position: relative;font-size:12px;margin-top:10px;} div#full_back div.loginbox div.logins div.login_btns p.login_btns1{cursor:pointer;width:100px} div#full_back div.loginbox div.logins div.login_btns p.login_btns2{cursor:pointer;width:120px;text-align:right;position: absolute;top:0px;right:0;} div#full_back div.loginbox div.logins span.autologin{cursor:pointer;} div#full_back div.loginbox div.logins p.ft12{font-size:12px;} span#autologin{display:none;} span#autologin_on{} div.loginbox2{;margin:50px auto;padding:20px;width:400px;background:#fff;border-radius:20px;} div.loginbox2 h3 {text-align:center;font-weight:600;font-size:24;padding:30px 0;} div.loginbox2 div.logins{padding:0 20px;} div.loginbox2 div.logins p input{width:100%;padding:10px;font-size:14px;font-weight:600;border:1px solid #b7b7b7;margin-bottom:10px;} div.loginbox2 div.logins p.login_submitbtn{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#F06310;border:1px solid #F06310} div.loginbox2 div.logins p.login_submitbtn:hover{color:#F06310;background:#fff;} div.loginbox2 div.logins p.login_submitbtn2{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#ff1123;border:1px solid #ff1123} div.loginbox2 div.logins p.login_submitbtn2:hover{color:#ff1123;background:#fff;} div.loginbox2 div.logins p.login_submitbtn3{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#0f36fe;border:1px solid #0f36fe} div.loginbox2 div.logins p.login_submitbtn3:hover{color:#0f36fe;background:#fff;} div.loginbox2 div.logins p.nv_login_btn{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#00D255;border:1px solid #00D255} div.loginbox2 div.logins p.nv_login_btn:hover{color:#00D255;background:#fff;} div.loginbox2 div.logins p.fb_login_btn{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#3C5898;border:1px solid #3C5898} div.loginbox2 div.logins p.fb_login_btn:hover{color:#3C5898;background:#fff;} div.loginbox2 div.logins p.tw_login_btn{cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#2EC6F5;border:1px solid #2EC6F5} div.loginbox2 div.logins p.tw_login_btn:hover{color:#2EC6F5;background:#fff;} p.nv_login_btn{width:400px;margin:0 auto;cursor:pointer;text-align:center;font-weight:600;font-size:14px;padding:10px 0;border-radius:4px;color:#fff;background:#00D255;border:1px solid #00D255} p.nv_login_btn:hover{color:#00D255;background:#fff;} div.loginbox2 div.logins div.login_btns{position: relative;font-size:12px;margin-top:10px;} div.loginbox2 div.logins div.login_btns p.login_btns1{cursor:pointer;width:100px} div.loginbox2 div.logins div.login_btns p.login_btns2{cursor:pointer;width:120px;text-align:right;position: absolute;top:0px;right:0;} div.loginbox2 div.logins span.autologin{cursor:pointer;} div.loginbox2 div.logins p.ft12{font-size:12px;} div#pass_box{display:none;width:100%;height:100%;position: fixed;top:0;left:0;z-index:100;} div#pass_box div.pass_box_bg{width:100%;height:100%;background:#000;filter:alpha(opacity=75);opacity: 0.75;} div#pass_box div#pwdcheck_view{width:600px;background:#fff;padding:10px;position:absolute;top:100px;left:45%;margin-left:-222px;text-align:center;} div#pass_box div#pwdcheck_view p.pwdcheck_close{width:51px;position:absolute;top:-51px;right:200px;} /*********** 팝업레이어 ***********/ .popup_layer_wrap{ position: fixed; z-index: 10003; right: 36px; left: auto !important; top: auto !important; bottom: 36px; border-radius:20px; border-radius: 20px; overflow: hidden; box-shadow: 0 4px 9px rgb(0 0 0 / 30%); background-color: #fff; } .popup_layer_bg{position:relative; } .popup_layer_close{position:absolute; bottom: 0px; right:0px; padding:8px 20px; background:#000; color:#000; width:100%; text-align:right;} .popup_layer_close i{color:#fff;} .popup_layer_wrap .custom-control-label{color:#fff;} .sub_field_box > div{ margin-right:10px; } .sub_field_box > div:last-child{ margin-right:0 } /*////////////////////////////////////////////////////////////////// [ BUTTON BACK TO TOP ]*/ .btn-back-to-top { display: none; position: fixed; width: 40px; height: 38px; bottom: 0px; right: 40px; background-color: #342016; opacity: 1; justify-content: center; align-items: center; z-index: 1000; cursor: pointer; transition: all 0.4s; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; } .symbol-btn-back-to-top { font-size: 25px; color: white; line-height: 1em; } .btn-back-to-top:hover { opacity: 1; background-color: #342016; } /*////////////////////////////////////////////////////////////////// [ 모바일 사이드 메뉴]*/ #side_menu { position: fixed; top: 0; left: -100%; z-index: 1001; width: 100%; height: 100vh; background-color: #fff; -webkit-transition: all .4s ease; transition: all .4s ease; overflow:auto; } #side_menu.full { width: 100%; background-color: #fff; } #side_menu.type2 { width: 84%; } body.sidemenu_open{ overflow:hidden; } body.sidemenu_open #side_menu { left: 0; } #side_menu .top_wrap { position: relative; height: 85px; padding: 15px 12px 0 16px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #4FB748; } #side_menu .top_wrap * { display: inline-block; vertical-align: middle; } #side_menu .top_wrap a { color: #fff; } #side_menu .top_wrap .login_area { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; height: 30px; line-height: 28px; font-size: 20px; color: #fff; letter-spacing: -0.3px; } #side_menu .top_wrap .login_area.not_login a { display: -webkit-box; display: -ms-flexbox; display: flex; } #side_menu .top_wrap .login_area.not_login a:after { content: "\56"; position: absolute; right: -40px; width: 30px; height: 30px; line-height: 28px; font-family: dripicons-v2!important; } #side_menu .top_wrap .login_area.login a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 30px; line-height: 28px; font-weight: 400; } #side_menu .top_wrap .login_area.login a strong { overflow: hidden; position: relative; max-width: 93px; padding-left: 38px; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; } #side_menu .top_wrap .login_area.login a strong.lv2:after { background-position-x: -30px; } #side_menu .top_wrap .login_area.login a strong.lv3:after { background-position-x: -60px; } #side_menu .top_wrap .login_area.login a strong.lv4:after { background-position-x: -90px; } #side_menu .top_wrap .sidemenu_top_btn { position: absolute; right: 12px; top:10px } #side_menu .top_wrap .sidemenu_top_btn a { width: 30px; height: 30px; position:relative; } #side_menu .top_wrap .sidemenu_top_btn a + a { margin-left: 10px; } #side_menu .top_wrap .sidemenu_top_btn a.set { background-position-x: -65px; } #side_menu .top_wrap .sidemenu_top_btn a.closeBtn:after { content: '\ead2'; font-family: "unicons"; font-size:24px } #side_menu .top_wrap .mem_class { position: relative; height: 20px; line-height: 18px; margin-left: 8px; padding: 0 6px; border: 1px solid #fff; border-radius: 4px; -webkit-box-sizing: border-box; box-sizing: border-box; font-weight: 700; font-size: 10px; color: #fff; letter-spacing: -0.25px; vertical-align: middle; } #side_menu .top_wrap .logout_bt { height: 17px; line-height: 17px; margin-left: 10px; padding: 3px 8px; border: 1px solid #fff; font-size: 12px; color: #fff; letter-spacing: -.015em; } #side_menu .mymenu_box{ position:absolute; top:60px; left:10px; width:calc(100% - 20px); z-index:10; display:block; margin-top: 0px } #side_menu .mymenu_box ul{ display: -webkit-flex; display: flex; margin:0 0px } #side_menu .mymenu_box li{ text-align: center; -webkit-flex: 1; flex: 1; display: inline; margin: 0 5px; position: relative; } #side_menu .mymenu_box li a{ display:block; z-index: 10; padding: 5px 0px; border-radius: 10px; background-color: #fff; font-weight: 700; font-size: 15px; color: #424242 !important; letter-spacing: -0.23px; -webkit-box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.08); } #side_menu .mymenu_box li i, #side_menu .mymenu_box li p{ display:block; } #side_menu .mymenu_box li i{font-size:20px} #side_menu .mymenu_box li p{font-size:12px} #side_menu .sidemenu_iscroll { position: relative; height: calc(100% - 50px); } #side_menu .sidemenu_iscroll > div .cont_box:nth-of-type(1) { margin-top: 65px; } #side_menu .sidemenu_iscroll > div { position: relative; padding-bottom: 0 !important; overflow:scroll } #side_menu .sidemenu_info_box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position: absolute; top: 60px; left: 16px; z-index: 10; width: calc(100% - 32px); height: 50px; line-height: 50px; padding: 0 16px; border-radius: 10px; background-color: #fff; font-weight: 700; font-size: 15px; color: #424242 !important; letter-spacing: -0.23px; -webkit-box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.08); } #side_menu .sidemenu_info_box.mem { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow: hidden; width: calc(100% - 32px); height: 80px; padding: 15px 16px; -webkit-box-sizing: border-box; box-sizing: border-box; } #side_menu .sidemenu_info_box.mem dl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } #side_menu .sidemenu_info_box.mem dl dt, #side_menu .sidemenu_info_box.mem dl dd { text-align: center; } #side_menu .sidemenu_info_box.mem dl dt { height: 20px; line-height: 20px; font-weight: 400; font-size: 14px; color: #777; letter-spacing: -0.35px; } #side_menu .sidemenu_info_box.mem dl dd { width: 100%; height: 30px; line-height: 30px; max-width: 107px; font-size: 22px; color: #222; letter-spacing: -0.55px; } #side_menu .sidemenu_info_box.mem dl + dl { border-left: 1px solid #f0f0f0; } #side_menu .guest_have_wrap .cont { color: #333; } #side_menu .guest_have_wrap .cont b { font-weight: 700; font-size: 17px; } #side_menu .guest_have_wrap + .menu_link.even { margin-bottom: 8px; } #side_menu .cont_box { margin-bottom: 40px; background-color: #fff; } #side_menu .title_wrap { display: inline-block; width: 100%; line-height: 28px; padding: 1px 16px; } #side_menu .title_wrap > strong { display: inline-block; line-height: 28px; font-size: 17px; color: #222; letter-spacing: -0.26px; } #side_menu .title_wrap > a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; float: right; color: #999; } #side_menu .history_view_wrap .title_wrap { margin-bottom: 15px; } #side_menu .history_view_list { overflow: hidden; position: relative; width: 100%; padding-bottom: 15px; } #side_menu .history_view_list ul { display: -webkit-box; display: -ms-flexbox; display: flex; } #side_menu .history_view_list ul li { width: 70px; min-width: 70px; margin-left: 10px; font-size: 13px; text-align: center; } #side_menu .history_view_list ul li a { display: block; overflow: hidden; line-height: 1.4; max-height: 110px; } #side_menu .history_view_list ul li:last-child { margin-right: 10px; } #side_menu .history_view_list ul li .thumb { position: relative; margin-bottom: 10px; } #side_menu .history_view_list ul li .thumb img { margin-bottom: 0; } #side_menu .history_view_list ul li img { width: 100%; margin-bottom: 5px; } #side_menu .title_more { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 16px; } #side_menu .title_more h2 { padding-bottom: 0; } #side_menu .title_more .more { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; height: 28px; line-height: 28px; padding: 0 16px 0 10px; font-weight: 400; font-size: 12px; color: #555; letter-spacing: -0.3px; white-space: nowrap; } #side_menu .title_more.end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } #side_menu .sidemenu_quick { width: 100%; } #side_menu .sidemenu_quick .title_wrap strong { position: relative; } #side_menu .sidemenu_quick ul { float: left; width: 100%; padding: 0 16px; -webkit-box-sizing: border-box; box-sizing: border-box; } #side_menu .sidemenu_quick ul li { float: left; width: 50%; height: 30px; line-height: 30px; margin-top: 10px; } #side_menu .sidemenu_quick ul li a { font-size: 16px; color: #424242; letter-spacing: -0.24px; } #side_menu .sidemenu_quick ul li a .desc { font-size: 12px; color: #424242; letter-spacing: -0.18px; vertical-align: baseline; } #side_menu .list_re-brand { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 10px; overflow: hidden; padding: 10px 16px; } #side_menu .list_re-brand li { display: -webkit-box; display: -ms-flexbox; display: flex; text-align: center; width: calc(33.3333% - 7.5px); } #side_menu .list_re-brand li .goods_wrap { position: relative; width: 100%; } #side_menu .list_re-brand li .goods_img { position: relative; border-radius: 10px; } #side_menu .list_re-brand li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; position:relative; } #side_menu .list_re-brand li a .brand_img img { width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 10px; } #side_menu .list_re-brand li a .brand_bg{ position:absolute; top:0; left:50; z-index:5; width:100%; height:100%; background:rgba(0,0,0,0.5); border-radius: 10px; } #side_menu .list_re-brand li a .brand_logo{ position:absolute; top:50%; left:50%; z-index:10; transform: translate(-50%, -50%); } #side_menu .list_re-brand li a .brand_logo img{ height:20px; } #side_menu .list_re-brand li a span { overflow: hidden; position: absolute; top: 0; left: 0; width: 1px; height: 1px; line-height: 0; margin: -1px; padding: 0; font-size: 1px; clip: rect(0, 0, 0, 0); } .list_cate_box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow: hidden; margin-bottom: 40px; padding: 0 8px; } .list_cate_box li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 10px 7px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; -ms-flex-preferred-size: 25%; flex-basis: 25%; } .list_cate_box li a { display:block; width:100%; height:100%; position:relative; } .list_cate_box li a img { overflow: hidden; } .list_cate_box li .best_category_txt{ font-size: 12px; text-align: center; padding-top:70px; display:block; } .list_cate_box .best_category_icon { position:absolute; top:15px; left:0; width: 100%; height: 50px; display:block; margin-top:0px; background-repeat: no-repeat; background-position: center center; } #side_menu .customer_wrap{padding-bottom:30px} #side_menu .customer_wrap ul { padding: 0 16px; } #side_menu .customer_wrap ul li:nth-child(2) a .customer_center:after { background-position-x: -30px; } #side_menu .customer_wrap ul .customer_center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; min-height: 60px; margin-top: 10px; padding-left: 60px; border: 1px solid #d4d4d4; border-radius: 10px; background-color: #fff; } #side_menu .customer_wrap ul .customer_center:after { content: "\F02CB"; position: absolute; top: 50%; left: 20px; width: 30px; font-size:25px; font: normal normal normal 24px/1 "Material Design Icons"; -webkit-transform: translateY(-50%); transform: translateY(-50%); } #side_menu .customer_wrap ul .customer_center.call_center:after { content: "\F1196"; } #side_menu .customer_wrap ul .customer_center.commu_center:after { content: "\F0181" } #side_menu .customer_wrap ul .customer_center dt { line-height: 1; font-weight: 700; font-size: 16px; color: #424242; letter-spacing: -0.24px; } #side_menu .customer_wrap ul .customer_center dd { line-height: 1; margin-top: 7px; font-size: 12px; color: #777; letter-spacing: -0.18px; } @media (max-width: 1400px) { #divMenu, #divMenuSub{display:none;} } /*********** 고객센터 ***********/ .customerInfo{ padding:30px 0; } .customerInfo .title{ font-size: 13px; line-height: 19px; letter-spacing: -.024em; color: #333; } .customerInfo .tel{ font-size: 24px; font-weight: 700; color: #333; margin-top: 3px; } .customerInfo .workingTime{ font-size: 13px; line-height: 19px; letter-spacing: -.02em; color: #757575; margin-top: 7px; } .cs_center_box { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: center; align-items: center; text-align:left; } .cs_center_box .cs_center_tit{ width:calc(100% - 60px) } .cs_center_box .cs_center_icon{ width:60px; text-align:center; } .cs_center_top { padding:0 30px } .cs_center_top .cs_center_info{ position:relative; } .cs_center_top .cs_center_info:after{ content:''; display:block; width:1px; height:100%; background:#ddd; position:absolute; top:0; right:60px } .cs_center_top .cs_center_txt{ padding-top:15px } .cs_center_top .cs_center_info dl, .cs_center_top .cs_center_info dd{ margin-bottom:0 } .cs_center_top .cs_center_info dt { color: #555; font-size: 16px; font-weight: 400; margin-bottom:7px; } .cs_center_top .cs_center_info dd strong{ font-size: 30px; color: #555; } .community_board_wrap{} .community_board_wrap dl{ margin-bottom:50px } .community_board_wrap dt{ padding-bottom:10px; border-bottom:1px #000 solid; } .community_board_wrap dt .com_board_tit .cbt_txt{ font-size:20px; } .community_board_wrap dt .com_board_tit{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: space-between; -ms-align-items: flex-end; align-items: flex-end; } .community_board_wrap dt .com_board_tit .cbt_more a{ color:#999; position:relative; padding-right:12px; display:inline-block; } .community_board_wrap dt .com_board_tit .cbt_more a:after{ content:'>'; font-family:'돋움'; font-size:11px; position:absolute; top:2px; right:0 } .community_board_wrap dd{ padding-top:0px; min-height:255px } .community_board_wrap dd li{ padding:15px 0; border-bottom:1px #e5e5e5 solid; } .community_board_wrap dd li .com_board_list_date{ color:#666; font-size:12px; } .com_cs_wrap{background:#f8f8f8; padding:30px; margin-bottom:80px} .com_cs_wrap .cs_txt_box p{ color:#999; margin-bottom:15px } .com_cs_wrap .cs_menu_box .cs_icon{ width:50px; height:50px; background:#fff; border-radius:50%; line-height:50px; text-align:center; margin-right:15px } .com_cs_wrap .cs_menu_box .cs_icon i{ font-size:26px; line-height:50px; } .com_cs_wrap .cs_menu_box .cs_txt{ width:calc(100% - 65px) } .com_cs_wrap .cs_menu_box .cs_txt { color:#999 } .cs_txt_box .call_center{ font-size:18px; font-weight:600; margin-bottom:0px; color:#000; } .com_cs_wrap .cs_menu_box .cs_txt h5 span{ position:relative; padding-right:20px; font-size:16px; color:#000 } .com_cs_wrap .cs_menu_box .cs_txt h5 span:after{ content: "\e93e"; display:block; position:absolute; top:3px; right:0; font-size:12px; font-family: xeicon!important; } /*********** 라이브쇼핑 ***********/ .liveshop_goods_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr)} .liveshop_goods {border:1px #eee solid; background:#fff; padding-bottom:25px; margin-bottom:20px} .liveshop_goods .item_tit{padding:0 15px} .liveshop_goods_vod{position:relative;} .live_vod_goods{background-repeat:no-repeat; height:230px; background-position:top center; background-size:cover} .live_vod_bg{ position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; height: 100%; background: rgba(0,0,0,0.2); z-index: 11; } .live_vod_bg .btn_vod{ margin-bottom: 5px; width: 54px; height: 54px; border-radius: 50%; background: rgba(0,0,0,0.5); position:relative; } .live_vod_bg .btn_vod:after{ content:'\eb00'; display:block; color:#fff; position:absolute; top:4px; left:13px; font-family: unicons; font-size:30px } @media (max-width: 992px) { .liveshop_goods_wrap{margin-top:30px} .liveshop_goods_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr)} } @media (max-width: 768px) { .liveshop_goods_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(1, 1fr)} } /*********** 이벤트 ***********/ .event_wrap{} .event_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr)} .event_list{ } .event_day{ color:#aaa} .event_day i{margin-right:5px} .event_list .badge{padding:5px 10px; font-size:100%} .event_view{border-top: 1px solid #eee; padding-top:50px; padding-bottom:50px} .event_view .event_img{text-align:center;} .event_view .event_img img{width:100%} .event_view .event_content{} .event_view_day{margin-bottom:15px; } .event_view_day .badge{padding:5px 10px; font-size:90%; margin-right:10px} @media (max-width: 992px) { .event_wrap{margin-top:30px} .event_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr)} .event_view_day{margin-top:15px; border-bottom: 1px solid #eee; padding-bottom:15px; padding-left:15px} .event_view{border-top:none; padding-top:15px; padding-bottom:25px} } @media (max-width: 768px) { .event_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(1, 1fr)} } /*********** 브랜드 ***********/ .brandshop_wrap{padding-top: 0px} .brandshop_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr)} .brandshop_box{ border:1px #eee solid; margin-bottom:20px} .brandshop_box .brandshop_tit{ font-size:18px; padding:15px; } .brandshop_box .brandshop_banner{ position:relative; } .brandshop_box .brandshop_banner .brand_logo{ position:absolute; top:15px; left:15px } .brandshop_box .brandshop_banner .brand_logo img{ max-width:100px } @media (max-width: 992px) { .brandshop_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr)} .brandshop_box .brandshop_tit{ font-size:16px} } @media (max-width: 768px) { .brandshop_wrap ul{ display: grid; gap: 20px; grid-template-columns: repeat(1, 1fr)} } /*********** 베스트 ***********/ .dream_bestgoods_contents .best_category_goods{ padding:0 15px } .dream_bestgoods_contents .best_category_tab{margin-top:25px} .dream_bestgoods_contents .best_category_tab:before{height:1px} .best_sch_tep{width:100%; margin-bottom:0px} .best_sch_tep ul li{width:50%;float:left;list-style:none;text-align:center;padding:0px 0; line-height:58px; height:60px; cursor: pointer;font-weight:600;font-size:16px; background:#f8f8f8; color:#999; border-bottom:1px #eee solid; box-sizing: border-box; } .best_sch_tep ul:after{content:''; display:block; clear:both;} .best_sch_tep ul li.best_tep1{ } .best_sch_tep ul li.best_tep2{ } .best_sch_tep ul li.on{border:1px #505050 solid; border-bottom:none;background:#fff; color:#000; line-height:58px} .best_tep_v{border:1px #d8d8d8 solid; padding:20px 10px 10px 10px} .best_tep_v dl:after, .best_tep_v2 dl:after{content:''; display:block; clear:both;} .best_tep_v dl dd{width:16.6%;float:left; padding:5px 10px; box-sizing: border-box; min-height:40px} .best_tep_v dl dd span{display:block; width:18px; height:18px; background:#f8f8f8 url(/webftp/icon_check.png) no-repeat 50% 50%; border-radius:50%; position:absolute; top:-2px; left:0; } .best_tep_v dl dd a{display:block; position:relative; padding-left:24px; font-size:12px;} .best_tep_v dl dd.on span{ background:#ee373b url(/webftp/icon_check_on.png) no-repeat 50% 50%;} .best_tep_v dl dd.on a{color:#ee373b;} .best_tep_v2{border-bottom:1px #ddd solid; border-top:none; padding:20px 20px; } div.best_tep_v2 dl dd{width:20%;float:left;padding:5px 0;height:30px;} div.best_tep_v2 dl dd a{ } .best_box_namo01 { font-size:12px;color:#fff;display: inline-block;text-align: center;border-radius: 100%;width: 18px;height: 18px; line-height:20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box; background: #4FB748; margin-right:6px} @media (max-width: 992px) { .dream_bestgoods_contents .best_category_tab {padding-left:15px} .dream_bestgoods_contents .best_category_tab:before{display:none;} } /*********** 검색메인 ***********/ .search_main_wrap{padding:0 15px} .search_main_wrap h4{font-size:1.2222rem; margin-bottom:1.1111rem; color:#000} .search_main_form{ margin-bottom:3.3333rem; margin-top:15px} .search_main_form .smf_inner{padding:10px 0; border-bottom:1px #000 solid; } .search_main_form input{border:none; width:calc(100% - 100px); font-size:1.8888rem} .search_main_form a i{font-size:2rem;} .search_main_form input::-webkit-input-placeholder { font-size:1.8888rem; color:#aaa; } .search_main_form input:-ms-input-placeholder {font-size:1.8888rem; color:#aaa; } .search_main_form input::placeholder { font-size:1.8888rem; color:#aaa; } .search_main_form .recommend_search_box{margin-top:15px} .search_main_form .recommend_search_box p{color:#aaa; margin-right:10px} .search_main_form .recommend_search_box div span{display:inline-block; margin-right:10px} .search_best_box ul{margin-left:33px} .search_best_box li{ list-style: decimal-leading-zero!important; position:relative; padding-left:10px; list-style-position: inside; margin-bottom:10px } .search_best_box li::marker {text-align:left!important; color:#000; font-weight:700} .search_event_box .search_event_img { position: relative; width: 100%; height: 200px; } .search_event_box .search_event_img img{ position: absolute; top: 0; left: 0; transform: translate(50, 50); width: 100%; height: 100%; object-fit: cover; margin: auto; } .search_event_box .search_event_list{ margin-bottom:2.2222rem; } .search_event_box .search_event_list .search_event_banner_box{ margin-top:15px } .search_event_box .search_event_list .search_event_banner_box p { font-size:1.11111rem } .search_event_box .search_event_list .search_event_banner_box span{ display:none } .search_event_box .end_day_style .search_event_img{ } .search_event_box .end_day_style .search_event_img:before{content:'종료된 이벤트'; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); z-index:15; color:#fff;} .search_event_box .end_day_style .search_event_img:after{content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.85); z-index:10; position:absolute; top:0; left:0} @media (max-width:991.98px) { .search_main_wrap {margin-top:15px!important} } @media (max-width: 768.98px) { .search_main_content{background:#f5f5f5; padding:20px 15px} .search_main_form{ margin-bottom:15px} .smc_best, .smc_event {border:1px #ddd solid; background:#fff; padding:20px; border-radius:10px;box-shadow: 0.3rem 0.3rem 0.8rem rgba(193,193,193,0.6);} .smc_best h4, .smc_event h4{border-bottom:1px #333 solid; padding-bottom:10px} .smc_event{margin-top:30px} .search_event_box .search_event_list:last-child{ margin-bottom: 0px; } .search_main_form input::-webkit-input-placeholder { font-size:18px; } .search_main_form input:-ms-input-placeholder {font-size:18px; } .search_main_form input::placeholder { font-size:18px; } }