/* 탑메뉴 박스 ==================================================================================== */ #top_menu_box {display:none; position:absolute; width:100%; top:55px; height:300px; overflow:hidden;border-top:1px solid #ddd; border-bottom:1px solid #ddd; background:#fff; z-index:20000; } #top_menu_box .bg {width:100%; background-color:#f7f7f7; } #top_menu_box img {padding:0 0 0 2px; vertical-align:middle; } #top_menu_box .wrap {} #top_menu_box ul {float:left; min-width:10%; position:absolute;} .top_menu_box_subs {padding:15px 0;} #top_menu_box ul li a {font-size:13px; color:#111; letter-spacing:-1.3px; text-decoration:none; line-height:200%; padding:4px 8px 4px 0; } #top_menu_box ul li a:hover {color:#981937; } #top_menu_box ul li a.current {color:#981937; } #top_menu_box ul li ul {width:100%; position:relative; } #top_menu_box ul li ul li a {padding-left:9px; color:#555; text-align:left; line-height:60%; font-size:12px; background:url('../image/common/top_subicon.gif') no-repeat 5px center ; } #top_menu_box ul ul ul li a {color:#981937; } #top_menu_box ul ul li a:hover {color:#981937; } /* header */ #header {position:absolute;top:0;left:0;width:100%;height:110px;background:#fff;box-shadow: 0 0 7px 0 rgba(0,0,0,0.2);z-index:9999000;} #header:after {content:''; display:block; clear:both;} #header .inner {position: relative; margin: 0 auto; max-width:1200px;width:100%; height: 100%; } #header .logo {float:left; width:30%; height:70px; line-height:65px;} #header .logo img {width:250px;} #header .btn_m_list {display:none; } #top_link {position:relative;z-index:109; height:40px;background:#f8f8f8;border-bottom:1px solid #eaeced;} #top_link ul {float:right;padding:0 0 0 0;} #top_link li {position:relative;display:inline-block; color:#999; line-height:40px;} #top_link li a { font-size:0.85em;color:#999; padding:0 8px; } #top_link li:first-child a {padding:0 0 0 0;} #top_link .line:after {content:''; position:absolute; top:0; left:1px; bottom:0; width:2px; height:2px; margin:auto; background:#d1d1d2;} #top_link .top_link_sns {display:none;float:right;padding:8px 0 0 0;} #top_link .top_link_icon01 {display:inline-block;background: url("../image/common/sns_icon01.png") no-repeat center 0; background-size:25px auto; height:25px;width:25px;margin:0 3px; } #top_link .top_link_icon03 {display:inline-block;background: url("../image/common/sns_icon03.png") no-repeat center 0; background-size:25px auto; height:25px;width:25px;margin:0 3px; } #top_link .top_link_icon04 {display:inline-block;background: url("../image/common/sns_icon04.png") no-repeat center 0; background-size:25px auto; height:25px;width:25px;margin:0 3px; } .search_wrap {} .search {float:right; width:190px;margin:6px 8px 0 8px; z-index:9999;background:#ececec;border:1px solid #ddd;padding:0;border-radius:20px;overflow:hidden;} .search_input {float:left; background:#ececec; border:none;height:23px;width:150px;margin:0 3px 0 3px;font-size:0.9em; color:#999999;padding:0 10px;} @media screen and (max-width:1300px) { #top_link .top_link_sns {display:block; } } .gnb {display:block; float:right;width:70%;z-index: 800;} .gnb:after {content:''; display:block; clear:both;} .gnb>ul {display:table; width:100%; text-align:center; } .gnb ul>li {position:relative; display:table-cell;} .gnb ul>li>a {display:block; font-size:1.15em; line-height:70px;letter-spacing:-1px; color:#222; font-weight:700;} .gnb ul>li>a:hover, .gnb ul>li>a.current, .gnb ul>li.on>a {color:#1476dd;} .gnb ul ul {position:absolute;display:none ;width:180px; background:#fff;box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);padding: 10px 0px 15px 0; } .gnb ul ul>li {float:none;display: block;margin:0px; } .gnb ul ul>li>a {display: block;width:100%; line-height:35px; font-weight:300; font-size:1em; color:#555; letter-spacing:-1px; text-align:center; transition:all 0.5s ease;} .gnb ul ul>li:last-child a {border:0;} .gnb ul ul>li>a:after {display:none;} .gnb ul ul>li>a:hover, .gnb ul ul>li>a.current, .gnb ul ul>li.on>a { color:#1476dd; font-weight:300;} /* screen 1200px */ @media screen and (max-width:1200px) { #header .logo {padding:0 0 0 10px; } .gnb ul>li>a {display:block; font-size:1.1em; letter-spacing:-1px; color:#333; font-weight:500;} } /* screen 1024 */ @media screen and (max-width:1024px) { #header_main {padding:70px 0 0 0; } #header .logo {width:80%; line-height:65px; height:70px; } #header .logo img {width:220px;} #header {top:0; left:0; width:100%; height:70px; transition: all 0.5s ease; } #header .btn_m_list {display:block; position:absolute; top:10px; right:8px; width:40px; height:40px; cursor:pointer; z-index:99999999} #header .btn_m_list span, #header .btn_m_list:before, #header .btn_m_list:after {position:absolute; left:8px; content:''; width:28px; height:4px; border-radius:4px; background:#222; } #header .btn_m_list:before {top:21px; } #header .btn_m_list span {top:12px; } #header .btn_m_list:after {top:30px; } #header .header_wrap .header_data {position:relative; top:auto; left:auto; width:100%; } #header .header_wrap {height:70px; background:#fff; } #header_sub {padding:70px 0 0 0; } #top_link, #top_link2 {display:none;} #top_date {display:none;} #header .btn_m_list {display:block; position:absolute; top:10px; right:8px; width:40px; height:40px; cursor:pointer; z-index:99999999} #header .btn_m_list span, #header .btn_m_list:before, #header .btn_m_list:after {position:absolute; left:8px; content:''; width:28px; height:4px; border-radius:4px; background:#222; } #header .btn_m_list:before {top:21px; } #header .btn_m_list span {top:12px; } #header .btn_m_list:after {top:30px; } #header .btn_m_close {display:block; width:25px; height:55px; margin:25px auto ; background:url('../image/common/top_btn_total.png') no-repeat 0 -100px; background-size:200px auto; cursor:pointer; } #header .gnb {display:none; background:#fff; height:auto; background:#none; top:0; float:none; width:100%; } #header .gnb ul {position:relative;padding:0; width:100%; } #header .gnb ul ul {visibility: visible; width:100%; background:#0f0f13; padding:0; border-left:0 solid #ddd; border-bottom:0 solid #999; border-top:0; border-right:0; } #header .gnb ul li:last-child ul {border-right:0 solid #ddd; } #header .gnb ul li {position:relative;display:table;float:none; width:100%; text-align:left; background:#fff; } #header .gnb ul li a {line-height:60px; height:60px; width:100%; text-indent:20px; color:#000; font-size:1.25em; border-left:none; border-right:none; border-top:1px solid #ddd;} .fullmenu_sns_box {position:relative; text-align:center; padding:30px 0 10px 0;border-top:1px solid #ddd;} .fullmenu_sns_box .top_link_icon01 {display:inline-block;background: url("../image/common/sns_icon01.png") no-repeat center 0; background-size:40px auto; height:40px;width:40px;margin:0 5px; } .fullmenu_sns_box .top_link_icon03 {display:inline-block;background: url("../image/common/sns_icon03.png") no-repeat center 0; background-size:40px auto; height:40px;width:40px;margin:0 5px; } .fullmenu_sns_box .top_link_icon04 {display:inline-block;background: url("../image/common/sns_icon04.png") no-repeat center 0; background-size:40px auto; height:40px;width:40px;margin:0 5px; } #header .gnb ul>li>a span {position:absolute; right:18px; top:18px; justify-content:center; width:29px; height:29px; } #header .gnb ul>li>a span:after {position:absolute; content:''; right:1px; top:50%; transform:translateY(-50%); width:18px; height:2px; background:#fc6562;} #header .gnb ul>li>a span:before {position:absolute; content:''; right:9px; top:50%; transform:translateY(-50%); width:2px; height:18px; background:#fc6562;} #header .gnb .current {color:#fff; background-color:#1476dd; color:#fff; border-color:#fff;} #header .gnb .current span:after {background:#fff;} #header .gnb .current span:before, #header .gnb ul>li.on>a span:before {display:none;} #header .gnb ul>li a {display:block; } #header .gnb ul>li a:hover {color:#1476dd; } #header .gnb ul>li a.current {color:#fff; background-color:#1476dd; border-color:#fff;} #header .gnb ul li li {background:#f5f5f5; position:relative;} #header .gnb ul li li.sub_sub_parent{background: #f5f5f5; } #header .gnb ul li li a:after {content:''; position:absolute; top:22px; right:25px; border:solid #888; border-width:2px 2px 0 0; padding:5px; transform: rotate(45deg); -webkit-transform: rotate(45deg);} #header .gnb ul li li a {padding:0; line-height:52px; height:52px; text-indent:30px; color:#555; font-weight:normal; text-align:left; font-size:1em; border-top:1px solid #fff; } #header .gnb ul ul li a:hover {color:#1476dd; background:none; } #header .gnb ul li:last-child a {border-right:none; } #header .gnb .sub_submenus {background:#fff; padding:10px 10px 10px 5px;} #header .gnb ul ul ul li {background:#fff; padding:0; margin:0; } #header .gnb ul ul ul li a {text-indent:20px; line-height:26px; height:26px; border:0; font-size:0.8em; } #header .menu {display:none; } #header .btm_menu {display:block; background:#fff; text-align:center; border-top:1px solid #ddd; } }