
#head { position:fixed; top:0; left:0; width:100%; box-sizing:border-box; z-index:999; box-shadow:0 0 8px rgba(0, 0, 0, 0.5); }
#head .gnb { background-color:#2e3092; }
#head .gnb .wrap { overflow:hidden; }
#head .gnb .wrap ul { overflow:hidden; float:right; }
#head .gnb .wrap ul li { float:left; }
#head .gnb .wrap ul li a { display:block; line-height:42px; color:#ffffff; font-size:15px; margin:0 15px; }
#head .gnb .wrap ul li:last-child a { margin-right:0; }

#head .menu { background-color:#ffffff; position:relative;}
#head .menu .wrap { display:flex; flex-wrap:wrap; align-items:center;}
#head .menu .wrap h1 { padding:0; }
#head .menu .wrap h1 img { height:38px; }
#head .menu .wrap > ul {flex:1; min-width:0; margin-left:100px;}
#head .menu .wrap > ul > li { float:left; }
#head .menu .wrap > ul > li > a {position:relative; display:block; font-size:19px; font-weight:700; color:#333333; padding:31px 45px; }
#head .menu .wrap > ul > li > a:hover {color:#2e3092;}
#head .menu .wrap > ul > li > a:hover:after {position:absolute; left:50%; top:60px; width:80px; height:3px; transform:translateX(-50%); content:""; background:#2e3092;}

#head #mobile { position:absolute; top:50%; transform:translate(0, -50%); display:none; z-index:1001; }
#head #mobile:before,
#head #mobile:after,
#head #mobile span { position:absolute; display:block; right:0; top:50%; transform:translate(0, -50%); height:2px; background-color:#000000; transition-duration:100ms; }
#head #mobile:before ,
#head #mobile:after { content:''; width:100%; }
#head.mobile #mobile span { opacity:0; }
#head.mobile #mobile:before ,
#head.mobile #mobile:after { margin-top:0; transform:translate(-50%, 0); }
#head.mobile #mobile:before { transform:rotate(45deg); }
#head.mobile #mobile:after { transform:rotate(-45deg); }

#body { padding:calc(90px + 42px) 0 0; min-height:calc(100vh - 264px); box-sizing:border-box; }

@media screen and (max-width:1280px) {
    #head .gnb .wrap ul li a { line-height:38.5px; font-size:14.5px; margin:0 14px; }
    
    #head .menu .wrap h1 { padding:0; }
    #head .menu .wrap h1 img { height:35px; }
	#head .menu .wrap > ul {margin-left:120px;}
    #head .menu .wrap > ul > li > a { font-size:18px; padding:31px 22.5px; }

    #body { padding:calc(81px + 38px) 0 0; min-height:calc(100vh - 268px); }
}
@media screen and (max-width:1024px) {
    #head .gnb .wrap ul li a { line-height:35px; font-size:13.5px; margin:0 13px; }
    
    #head .menu .wrap h1 { padding:0; }
    #head .menu .wrap h1 img { height:32px; }
    #head .menu .wrap > ul {margin-left:40px;}
	#head .menu .wrap > ul > li > a { font-size:17px; padding:13px 15px; }

    #body { padding:calc(72px + 34px) 0 0; min-height:calc(100vh - 244px); }
}
@media screen and (max-width:768px) {
    #head .gnb .wrap ul li a { line-height:31.5px; font-size:13px; margin:0 12px; }

    #head .menu .wrap h1 { padding:17px 0; }
    #head .menu .wrap ul { top:100%; background-color:#ffffff; left:0; right:0; width:100%; transform:translate(0, 0); box-sizing:border-box; border-bottom:2px solid #2e3092; display:none; }
    #head .menu .wrap > ul > li { float:none; }
    #head .menu .wrap > ul > li > a { border-top:1px solid #dddddd; font-size:16px; padding:12px 15px; }

    #head #mobile { right:15px; width:30px; height:30px; display:block; }
    #head #mobile:before,
    #head #mobile:after,
    #head #mobile span { width:30px; }
    #head #mobile:before { margin-top:-10px; }
    #head #mobile:after { margin-top:10px; }

    #body { padding:calc(66px + 30px) 0 0; min-height:calc(100vh - 273px); }
}
@media screen and (max-width:640px) {
    #head .gnb .wrap ul li a { line-height:28px; font-size:12px; margin:0 11px; }

    #head .menu .wrap h1 { padding:14px 0; }
    #head .menu .wrap > ul > li > a { font-size:15px; padding:11px 10px; }

    #head #mobile { right:10px; width:27px; height:27px; }
    #head #mobile:before,
    #head #mobile:after,
    #head #mobile span { width:27px; }
    #head #mobile:before { margin-top:-9px; }
    #head #mobile:after { margin-top:9px; }

    #body { padding:calc(60px + 26px) 0 0; min-height:calc(100vh - 300px); }
}