@charset 'utf-8';

/********************************************
프로젝트명 : Sales 강화 및 온라인 채널 개선
타이틀 : 미디어쿼리 분기(768px)
작성자 : 천명기, 박준민
최초작성일 : 2016-07-11
********************************************/

/* ------------------------------
    layout
    - header
    - gnb
    - contents
	- footer
   ------------------------------ */

/* header */
#salesHeader {min-width:100%;border-bottom:none;}
.priority_service #salesHeader {border-bottom:0;}
#salesHeader .header_inner {width:100%;height:50px;border-bottom:1px solid #d7dbe3;}
#salesHeader h1.logo {width:90px; /* width: 120px; */ height:26px;margin-top:13px;margin-right:0;margin-bottom:0;margin-left:13px;float:left;}
#salesHeader h1.logo > a > img.ci_pc {display:none;}
#salesHeader h1.logo > a > img.ci_mb {display:block; width:22px;margin-top:-5px;}
#salesHeader .h_right {margin:0;float:right;font-size:0;}
#salesHeader .global {margin:0;}
#salesHeader .global li {display: none;}
#salesHeader .global li:last-child {display: inline-block; width: 50px; height: 50px; line-height: 50px; border-left: 1px solid #d7dbe3; background: none; padding: 0;}
#salesHeader .global li:last-child a {display: block; width: 100%; height: 100%; padding-left: 10px; padding-right: 10px; text-align: center; font-size: 16px; color: #0085d4; text-transform: uppercase;}
#salesHeader .global li:last-child a span {display: none;}
#salesHeader .login_list_area, #salesHeader .gnb_open  {width:50px;height:50px;display:inline-block;border-left:1px solid #d7dbe3;vertical-align:middle;}
#salesHeader .login_list_area {margin:0;}
#salesHeader .login_list_area > button {width:50px;height:50px;}
#salesHeader .login_list_area > button span {overflow:hidden;position:absolute;left:-9999px !important;top:0;width:1px;height:1px;text-indent:-9999px;}
#salesHeader .login_list_area button.login {background:url(../images/kr/base/m_btn_lock.png) no-repeat 50% 50%; background-size:22px auto;}
#salesHeader .login_list_area button.logout {background:url(../images/kr/base/m_btn_lock_open.png) no-repeat 50% 50%; background-size:17px auto;}
#salesHeader .gnb_open {background:#18abeb url(../images/kr/base/m_btn_gnb.png) no-repeat 50% 50%; background-size:22px auto; position:relative;}	
#salesHeader .search_area {height:50px;}
#salesHeader .search_area.active {width:100%;height:50px;margin:0;position:absolute;top:0;left:0;z-index:2;}
#salesHeader .search_area button.btn_search_open {width:50px;height:50px;background:url(../images/kr/base/m_btn_search.png) no-repeat 50% 50%; background-size:22px auto;border-left:1px solid #d7dbe3;}
#salesHeader .search_area .search_input_area {width:100%;height:50px;padding-top:5px;padding-right:0;padding-bottom:5px;padding-left:13px;border:none;border-radius:0;background:#18abeb;box-sizing:border-box;}
#salesHeader .search_area .search_input_area fieldset {position:relative;padding-left:0;padding-right:100px;}
#salesHeader .search_area .search_input_area input, #salesHeader .search_area .search_input_area label {width:100%;height:40px;padding-right:12px;padding-left:12px;position:relative;top:0;left:0;line-height:40px;background:#fff;font-size:14px;color:#18abeb;}
#salesHeader .search_area .search_input_area label {width:auto;position:absolute;top:0;left:0;z-index:2;border-radius:3px;}
#salesHeader .search_area .btn_area button {position:absolute;top:-5px;}
#salesHeader .search_area .btn_area button.btn_search {width:50px;height:50px;right:50px;background:#18abeb url(../images/kr/base/m_btn_search_open.png) no-repeat 50% 50%;background-size:22px auto;}
#salesHeader .search_area .btn_area button.btn_search:after {display:none;}
#salesHeader .search_area .btn_area button.btn_close {width:50px;height:50px;right:0;background:#1d83b0 url(../images/kr/base/m_btn_gnb_close.png) no-repeat 50% 50%; background-size:22px auto;}

/* gnb */
.gnb_menu {display:none;}
#gnb {display:none;}
#gnb_m {width:100%;height:100%;position:fixed;top:0;right:-100%;line-height:50px;display:block;background:#fff;z-index:9999; overflow-y:auto; transition: right ease-in-out 500ms;}
#gnb_m.active {transition: right ease-in-out 500ms; right:0;}
#gnb_m ul {margin:0;}
#gnb_m strong.tit {height:50px;margin-bottom:0;padding-right:14px;padding-left:14px;display:block;font-size:24px;line-height:50px;color:#fff;background-color:#18abeb;text-align:left;}
#gnb_m .inner {padding-right:14px;padding-bottom:14px;padding-left:14px;}
#gnb_m .gnb_list .menu_bar {padding-right:36px;position:relative;}
#gnb_m .gnb_list .menu_bar:after {content:""; display:block; clear:both;}
#gnb_m .gnb_list .menu_bar a {float:left;}
#gnb_m .gnb_list .menu_bar button {float:right;text-indent:-9999px;border:none;position:absolute;top:0;right:0;}
#gnb_m .gnb_list {height:auto;}
#gnb_m .gnb_list > li {border-bottom:1px solid #c1c1c1;}
#gnb_m .gnb_list > li > .menu_bar {background-image:url(../images/kr/base/m_ico_round_right.png);background-repeat:no-repeat;background-position:100% 50%; background-size:22px auto;background-color:transparent;}
#gnb_m .gnb_list > li._dep > .menu_bar {background-image:none;}
#gnb_m .gnb_list > li > .menu_bar a {height:55px;line-height:65px;font-size:18px;display:inline-block;color:#333;}
#gnb_m .gnb_list > li._dep.active > .menu_bar a {color:#18abeb;}
#gnb_m .gnb_list > li > .menu_bar button {/*width:36px;*/width:100%;height:55px;background-repeat:no-repeat;background-position:100% 50%; background-size:22px auto;background-color:transparent;}
#gnb_m .gnb_list > li._dep > .menu_bar button {background-image:url(../images/kr/base/m_ico_round_down.png);}
#gnb_m .gnb_list > li._dep.active > .menu_bar button {background-image:url(../images/kr/base/m_ico_round_up.png);}
#gnb_m .two_depth {padding-left:14px;display:none;border-top:1px solid #18abeb;}
#gnb_m .gnb_list > li.active .two_depth {display:block;}
#gnb_m .two_depth > li {border-bottom:1px solid #d8d8d8;}
#gnb_m .two_depth > li:last-child {border-bottom:none;}
#gnb_m .two_depth > li._dep.active {border-bottom:none;}
#gnb_m .two_depth > li > .menu_bar {background-size:15px auto;background-image:url(../images/kr/base/m_ico_arrow_right.png);background-repeat:no-repeat;background-position:100% 50%;background-color:transparent;}
#gnb_m .two_depth > li._dep > .menu_bar {background-image:none;}
#gnb_m .two_depth > li > .menu_bar a {padding-left:12px;margin-left:-12px;line-height:37px;font-size:15px;color:#333;text-align:left;display:inline-block;background-image:url(../images/kr/base/m_bul_dash1.png);background-repeat:no-repeat;background-position:0 50%; background-size:6px auto;background-color:transparent;}
#gnb_m .two_depth > li._dep.active > .menu_bar a {color:#18abeb;background-image:url(../images/kr/base/m_bul_dash2.png);}
#gnb_m .two_depth > li > .menu_bar button {/*width:36px;*/width:100%;height:37px;background-size:15px auto;background-repeat:no-repeat;background-position:100% 50%;background-color:transparent;}
#gnb_m .two_depth > li._dep > .menu_bar button {background-image:url(../images/kr/base/m_ico_arrow_down.png);}
#gnb_m .two_depth > li._dep.active > .menu_bar button {background-image:url(../images/kr/base/m_ico_arrow_up.png);}
#gnb_m .three_depth {margin-bottom:10px;background:#e7f6fd;display:none;border:1px solid #dae4e7;}
#gnb_m .two_depth > li.active .three_depth {display:block;}
#gnb_m .three_depth > li .menu_bar {background-size:15px auto;background-image:url(../images/kr/base/m_ico_arrow_right.png);background-repeat:no-repeat;background-position:100.5% 50%;background-color:transparent;}
#gnb_m .three_depth > li._dep > .menu_bar {background-image:none;}
#gnb_m .three_depth > li .menu_bar > a {padding-left:12px;display:block;line-height:30px;font-size:12px;color:#666;}
#gnb_m .three_depth > li .menu_bar > button {width:36px;height:30px;background-image:url(../images/kr/base/m_ico_arrow_down.png);background-size:15px auto;background-repeat:no-repeat;background-position:100% 50%;background-color:transparent;}
#gnb_m .three_depth > li._dep.active .menu_bar {background:#18abeb;}
#gnb_m .three_depth > li._dep.active .menu_bar > button {background-image:url(../images/kr/base/m_ico_arrow_down_h_2.png);}
#gnb_m .three_depth > li._dep.active .menu_bar > a {color:#fff;}
#gnb_m .three_depth > li._dep.active .four_depth {display:block;}
#gnb_m .four_depth {padding-right:12px;padding-left:12px;background-color:#5dc4f1;display:none;}
#gnb_m .four_depth > li > a {padding-left:8px;display:inline-block;font-size:10px;color:#fff;line-height:30px;background:url(../images/kr/base/m_bul_dotted_h.gif) no-repeat 0 14px; background-size:2px auto;}
#gnb_m .btn_close {width:50px;height:50px;position:absolute;top:0;right:0;;display:block;background:#1d83b0 url(../images/kr/base/m_btn_gnb_close.png) no-repeat 50% 50%; background-size:22px auto;border:none;text-indent:-9999px;}
#gnb_m .gnb_btn_list {margin-top:16px;}
#gnb_m .gnb_btn_list li {margin-top:13px;border-style:solid;border-width:1px;border-radius:5px;background-size:30px auto;background-repeat:no-repeat;background-position:100% 50%;background-color:transparent;}
#gnb_m .gnb_btn_list li:first-child {margin-top:0;}
#gnb_m .gnb_btn_list li.list1 {border-color:#18abeb;background-image:url(../images/kr/base/m_ico_gnb_btn1.png);}
#gnb_m .gnb_btn_list li.list2 {border-color:#1cb47d;background-image:url(../images/kr/base/m_ico_gnb_btn2.png);}
#gnb_m .gnb_btn_list li.list3 {border-color:#1cb47d;background-image:url(../images/kr/base/m_ico_gnb_btn3.png);}
#gnb_m .gnb_btn_list li.list1 a {color:#18abeb;}
#gnb_m .gnb_btn_list li.list2 a {color:#1cb47d;}
#gnb_m .gnb_btn_list li.list3 a {color:#1cb47d;}
#gnb_m .gnb_btn_list li a {height:38px;padding-left:10px;line-height:38px;font-size:15px;display:block;}

/* contents */
.hfix #main_container, .hfix #sub_container {padding-top:50px;}
.priority_service #sub_container, .priority_service.hfix #sub_container {padding-top:0;}
#main_container.sales_wrapper, #sub_container.sales_wrapper {width:100%;min-width:100%;overflow-x:auto;}

/* footer */
#salesFooter {min-width:100%;background:none;}
#salesFooter .inner {width:auto;}
#salesFooter .footer_inner {width:100%;padding-top:20px;padding-right:10px;padding-bottom:50px;padding-left:10px;background:#3c3c3c;}
#salesFooter .m_list_area {float:none;margin-bottom:20px;}
#salesFooter .m_list {float:none !important; width:100% !important; overflow:hidden;}
#salesFooter .m_list:first-child {margin:0;}
#salesFooter .m_list:last-child {margin:15px 0 0 0;}
#salesFooter .m_list li {padding-left:6px;}
#salesFooter .m_list li a {font-size:13px;line-height:24px;}
#salesFooter .ico_area {overflow:hidden;margin-bottom:20px;}
#salesFooter .ico_area .customer {position:relative;top:0;left:0;float:left;}
#salesFooter .ico_area .customer img {width:150px;height:auto;}
#salesFooter .ico_area .award {width:auto;margin-top:10px;position:relative;top:0;right:0;float:right;}
#salesFooter .footer_right {float:none;margin:0;}
#salesFooter .footer_inner .footer_right address {margin:0;}
#salesFooter address,#salesFooter p.copy {margin:0;font-size:13px;line-height:24px;text-align:center;}

/* 2021-02-03 rebranding */
#salesHeader h1.logo a {display:block; max-width:65px;}

/* 2022-11-15 방문판매직원조회 */
.dtd-sales-con {margin:25px 0;}
.dtd-sales-con .form_add input[type="text"].form-control {float:none; width:100%; margin:0 0 10px 0;}
.dtd-sales-con .form_add button {min-width:100%; margin-left:0;}