@charset "utf-8";

/* header */
#header { z-index:100; width:100%; height:90px; float:left; background:#1b1c1e; }
#header h1 { padding:30px 0 0 50px;}

/* gnb */
#gnb .btn_language { position:absolute; top:24px; right:190px; z-index:50; width:150px; height:40px; line-height:40px; padding-left:20px; border:solid 1px #aab0b7; font-size:14px;  color:#fff; text-transform:uppercase;}
#gnb .language_box { z-index:10; display:none; position:absolute; top:65px; right:190px; padding:10px 0; border:solid 1px #aab0b7; background:#1b1c1e; overflow:hidden;}
#gnb .language_box li a { display:block; width:150px; line-height:30px; padding-left:20px; font-size:14px; color:#fff; text-transform:uppercase;}
#gnb .language_box li a:hover { background:#fff; color:#222;}

/* lnb */
#lnb .btn_menu { position:absolute; top:32px; right:50px;}
#lnb .btn_close { position:absolute; top:32px; right:50px;}
#lnb .btn_menu_m { display:none;}
#lnb .lnb_box { z-index:999999; position:fixed; top:0; right:-100%; width:100%; height:100%; padding-top:90px; background:#1b1c1e; letter-spacing:-0.05em;}
#lnb .lnb_nav_dep1 > a { display:block; width:40%; line-height:65px; background:#1b1c1e; font-size:20px; color:#fff; text-align:center;}
#lnb li.on > a { background:#303336; color:#fff;}
#lnb li.on .lnb_dep2 { display:block;}
#lnb .lnb_box .logo { position:absolute; top:30px; left:50px;}
#lnb .lnb_box .lnb_dep2 { z-index:999999; display:none; position:absolute; top:90px; left:40%; width:50%; height:100%; padding:0 5%; background:#303336;}
#lnb .lnb_box .lnb_dep2 h2 { text-align:center; margin-top:30px; padding:30px 0; font-size:30px; border-top:solid 2px #e60013; border-bottom:solid 2px #014099; color:#fff; text-transform:uppercase; font-family: 'Titillium Web', sans-serif; letter-spacing:0.05em;}
#lnb .lnb_box .lnb_dep2 > ul { overflow-y:scroll !important; height:500px; padding-bottom:50px; scrollbar-3dLight-Color: #303336; scrollbar-arrow-color: #45484b; scrollbar-base-color: #303336; scrollbar-Face-Color: #45484b; scrollbar-Track-Color: #303336; scrollbar-DarkShadow-Color: #303336; scrollbar-Highlight-Color: #303336; scrollbar-Shadow-Color: #303336}
#lnb .lnb_box .lnb_dep2 > ul::-webkit-scrollbar-thumb:vertical { background-color:#45484b;}
#lnb .lnb_box .lnb_dep2 > ul::-webkit-scrollbar { width:10px; height:0; background:#303336;}
#lnb .lnb_box .lnb_dep2 a { display:block; padding:17px 0 17px 20px; border-bottom:solid 1px #595c5e; font-size:17px; color:#fff;}
#lnb .lnb_box .lnb_dep3 { background:#282b2e; padding:15px;}
#lnb .lnb_box .lnb_dep3 li { float:left; width:50%;}
#lnb .lnb_box .lnb_dep3 a { display:block; padding:6px 0 6px 25px; border:none; font-size:15px; color:#ababac; background:url('image/bg_lnb_3deps.png') no-repeat 10px center;}
#lnb .lnb_box .lnb_dep3 a:hover {text-decoration:underline;}




/* ////////////////////////////////////////////////// tablet */
@media all and (min-width:641px) and (max-width:999px) {
/* header */
#header h1 { padding:30px 0 0 20px;}

/* gnb */
#gnb .btn_language { right:140px;}
#gnb .language_box { right:140px;}

/* lnb */
#lnb .btn_menu { right:20px;}
#lnb .btn_close { right:20px;}
#lnb .lnb_box .logo { top:30px; left:20px;}
#lnb .lnb_box .lnb_dep3 li { float:none; width:100%;}


}





/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
/* header */
#header { height:60px;}
#header h1 { padding:23px 0 0 15px;}
#header h1 img { width:150px;}

/* gnb */
#gnb .btn_language { top:15px; right:50px; width:85px; height:28px; line-height:28px; padding-left:13px; background-size:9px 5px; border:solid 1px #aab0b7; font-size:13px; background:none;}
#gnb .language_box { top:44px; right:50px; padding:6px 0;}
#gnb .language_box li a { width:85px; line-height:20px; padding-left:13px; font-size:13px;}

/* lnb */
#lnb .btn_menu { position:absolute; top:21px; right:15px;}
#lnb .btn_close { position:absolute; top:21px; right:15px;}
#lnb .btn_menu_pc { display:none;}
#lnb .btn_menu_m { display:block;}
#lnb .btn_menu img { width:20px;}
#lnb .btn_close img { width:20px;}
#lnb .lnb_box { padding-top:60px;}
#lnb .lnb_nav_dep1 > a { line-height:50px; font-size:15px;}
#lnb .lnb_box .logo { top:23px; left:15px;}
#lnb .lnb_box .logo img { width:150px;}
#lnb .lnb_box .lnb_dep2 { top:60px;}
#lnb .lnb_box .lnb_dep2 h2 { margin-top:20px; padding:10px 0; font-size:18px;}
#lnb .lnb_box .lnb_dep2 a { padding:10px 0 10px 13px; font-size:14px;}
#lnb .lnb_box .lnb_dep3 { padding:7px;}
#lnb .lnb_box .lnb_dep3 li { float:none; width:100%;}
#lnb .lnb_box .lnb_dep3 a { padding:3px 0 3px 20px; font-size:13px; background:url('image/bg_lnb_3deps.png') no-repeat 10px 7px;}


}
