@charset 'utf-8';
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

/* base */
body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, select, table, td, textarea, th, ul { margin: 0; padding: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul, li { list-style: none; }
blockquote, q { quotes: none; }
table { border-collapse: collapse; border-spacing: 0; }
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="image"], input[type="tel"], textarea, button, select { -webkit-appearance:none; -webkit-border-radius:0; border-radius:0; background:none; }
input:focus, textarea:focus { outline-style:none; } 
input {  -webkit-appearance: none; -webkit-border-radius: 0; }
img { max-width:100%; height:auto; vertical-align:middle; border:0; }
a { text-decoration:none; }
body, button, h1, h2, h3, h4, h5, input, select, table, textarea { font-family: 'Noto Sans KR', AppleSDGothicNeo-Regular,'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif; color:#333; }

/* placeholder */
input::-webkit-input-placeholder { color:#0a2438; }
input::-moz-input-placeholder { color:#0a2438; }
input::-moz-placeholder { color:#0a2438; }
input::-ms-input-placeholder { color:#0a2438 } 
textarea::-webkit-input-placeholder { color:#0a2438; }
textarea::-moz-input-placeholder { color:#0a2438; }
textarea::-moz-placeholder { color:#0a2438; }
textarea::-ms-input-placeholder { color:#0a2438 }




.wrap { min-width:320px; overflow-x: hidden; background-color:#f1f6f8; }
.hidden { display:none; }

/* header
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#hd { position:relative; background-color:#fff; z-index:999; }
#hd #head { max-width:1280px; height:130px; margin:0 auto; }
#hd #head:after { display:block; width:100%; height:0; clear:both; content:""; } 
#hd #head h1 { float:left; padding-top:38px; }
/* nav */
#nav { float:right; padding-top:50px; }
#nav .menu { float:left; margin-bottom: 0; }
#nav .menu > li { float:left; font-size:22px; font-weight:700; margin-left:165px; line-height:1.35em; }
#nav .menu > li.m1 { margin-left:0; }
#nav .menu > li.m2 .submenu li:first-child { margin-left:160px; }
#nav .idx { display:block; color:#424242; }
#nav .submenu { position:absolute; left:0; top:130px; width:100%; background-color:#f2f2f2; z-index:9; max-height:0; transition: all 0.56s cubic-bezier(0.32, 0.08, 0.24, 1); overflow:hidden; }
#nav .submenu ul { max-width:1280px; margin:0 auto; }
#nav .submenu li { display:block; float:left; width:25%; vertical-align:middle; text-align:center; font-size:30px; font-weight:700; line-height:1.35em; }
#nav .submenu li a { display:block; height:320px; border-right:1px solid #d7d7d7; color:#535353; }
#nav .submenu li:first-child a { border-left:1px solid #d7d7d7; }
#nav .submenu li span { display:block; padding-top:200px; background-repeat:no-repeat; background-position:center 60px; }
#nav .submenu li a:hover { background-color:#d9e5ed; color:#235183; }

#nav li.m1 li.sm1 span { background-image:url('../img/common/gnb_menu_01_01_nor.png'); }
#nav li.m1 li.sm2 span { background-image:url('../img/common/gnb_menu_01_02_nor.png'); } 
#nav li.m1 li.sm3 span { background-image:url('../img/common/gnb_menu_01_03_nor.png'); } 
#nav li.m1 li.sm4 span { background-image:url('../img/common/gnb_menu_01_04_nor.png'); }
#nav li.m1 li.sm1 a:hover span { background-image:url('../img/common/gnb_menu_01_01_over.png'); }
#nav li.m1 li.sm2 a:hover span { background-image:url('../img/common/gnb_menu_01_02_over.png'); } 
#nav li.m1 li.sm3 a:hover span { background-image:url('../img/common/gnb_menu_01_03_over.png'); } 
#nav li.m1 li.sm4 a:hover span { background-image:url('../img/common/gnb_menu_01_04_over.png'); }

#nav li.m2 li.sm1 span { background-image:url('../img/common/gnb_menu_02_01_nor.png'); }
#nav li.m2 li.sm2 span { background-image:url('../img/common/gnb_menu_02_02_nor.png'); }
#nav li.m2 li.sm3 span { background-image:url('../img/common/gnb_menu_02_03_nor.png'); }
#nav li.m2 li.sm1 a:hover span { background-image:url('../img/common/gnb_menu_02_01_over.png'); }
#nav li.m2 li.sm2 a:hover span { background-image:url('../img/common/gnb_menu_02_02_over.png'); }
#nav li.m2 li.sm3 a:hover span { background-image:url('../img/common/gnb_menu_02_03_over.png'); }

#nav li.m3 li.sm1 span { background-image:url('../img/common/gnb_menu_03_01_nor.png'); }
#nav li.m3 li.sm2 span { background-image:url('../img/common/gnb_menu_03_02_nor.png'); }
#nav li.m3 li.sm3 span { background-image:url('../img/common/gnb_menu_03_03_nor.png'); }
#nav li.m3 li.sm4 span { background-image:url('../img/common/gnb_menu_03_04_nor.png'); }
#nav li.m3 li.sm1 a:hover span { background-image:url('../img/common/gnb_menu_03_01_over.png'); }
#nav li.m3 li.sm2 a:hover span { background-image:url('../img/common/gnb_menu_03_02_over.png'); }
#nav li.m3 li.sm3 a:hover span { background-image:url('../img/common/gnb_menu_03_03_over.png'); }
#nav li.m3 li.sm4 a:hover span { background-image:url('../img/common/gnb_menu_03_04_over.png'); }

#nav .menu > li:hover .idx,
#nav .menu > li.on .idx { color:#055aaf; height:80px; }
#nav .menu > li:hover .submenu,
#nav .menu > li.on > .idx + .submenu { display:block; max-height:320px; }

#hd #head .btn_menu { position:absolute; left:0; top:0; z-index:99; display:block; width:104px; height:100%; color:#111; font-size:40px; cursor:pointer; display:none; }
.btn_menu .nav-icon { margin:34px 0 0 26px; width: 36px; }
.btn_menu .nav-icon:after, 
.btn_menu .nav-icon:before, 
.btn_menu .nav-icon div { background-color: #333; content: ''; display: block; height: 5px; margin: 7px 0; transition: all .2s ease-in-out; }

#hd #head .btn_menu.open { }

/* head_mobile */
#head_mobile { position:fixed; left:0; top:0; right:0; display:block; width:100%; height:0%; background-color: #f0f0f0; transition: all 0.36s cubic-bezier(0.32, 0.08, 0.24, 1); overflow: hidden; z-index:99; } 
#head_mobile.open  { height: 100%; }
#head_mobile .top { position:relative; height:92px; background-color:#fff; z-index:1; }
#head_mobile .top h1 { display:block; text-align:center; width:250px; height:auto; margin:0 auto; padding-top:25px; }
#head_mobile .top .btn_menu { position:absolute; right:0; top:0; z-index:99; display:block; width:104px; height:100%; color:#111; font-size:40px; cursor:pointer; }

.btn_menu.close .nav-icon:before { transform: translateY(12px) rotate(135deg); }
.btn_menu.close .nav-icon:after { transform: translateY(-12px) rotate(-135deg); }
.btn_menu.close .nav-icon div { transform: scale(0); }

#nav_m .menu { }
#nav_m .menu > li { position:relative; font-size:17px; line-height:1.5em; }
#nav_m .menu li a { display:block; color:#4f4f4f; padding-left:45px; }
#nav_m .menu li a.idx { position:relative; height:120px; line-height:120px; font-size:40px; font-weight:500; }
#nav_m .menu li a.idx:after { position:absolute; right:0; top:0; display:block; width:120px; height:100%; background-repeat:no-repeat; background-position:center; background-image:url('../img/icon/ico_arrow_down.png'); content:""; }
#nav_m .menu li.on a.idx:after { background-image:url('../img/icon/ico_arrow_up.png'); }
#nav_m .menu li .submenu { display:none; background-color:#e6e6e6; padding:25px 0; }
#nav_m .menu li .submenu li { font-size:25px; line-height:80px; font-weight:500; }
#nav_m .menu li .submenu li br { display:none; }
#nav_m .menu li .submenu li a { color:#3a4146; }
#nav_m .menu li.on a.idx { ; }
#nav_m .menu li.on .submenu { display:block;  }


/* footer
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
#ft { background-color:#0c1e2b; padding:90px 0; }
#ft .inwrap { max-width:1280px; margin:0 auto; overflow:hidden; }
#ft .logo_white { float:left; }
#ft address { margin-left:195px; font-size:19px; line-height:1.35em; color:#ced2d5; font-style:normal; }
#ft address p { width:100%; overflow:hidden; margin-top:10px; }
#ft address span { display:block; float:left; margin:0 10px; vertical-align:middle; background-repeat:no-repeat; background-position:left 50%; background-image:url('../img/common/main_footer_bar.jpg'); }
#ft address span:first-child { margin-left:0; padding-left:0; background:none; }
#ft address .copyright { float:right; color:#fff; font-size:17px; margin-right:0; padding-right:0; background:none; opacity:0.5; font-weight:300; }


/* quick_menu */
.quick_menu { position:fixed; left:0; right:0; bottom:0; display:block; width:100%; overflow:hidden; background-color:#35373b; z-index:9999; display:none; }
.quick_menu li { float:left; width:20%; background-repeat:no-repeat; background-position:center; background-size:auto 100%; }
.quick_menu li .btn { display:block; cursor:pointer; height:80px; font-size:0; color:transparent; }
.quick_menu li.m1 { background-image:url('../img/common/quick_menu01.png'); }
.quick_menu li.m2 { background-image:url('../img/common/quick_menu02.png'); }
.quick_menu li.m3 { background-image:url('../img/common/quick_menu03.png'); }
.quick_menu li.m4 { background-image:url('../img/common/quick_menu04.png'); }
.quick_menu li.m5 { background-image:url('../img/common/quick_menu05.png'); }
