@charset "utf-8";
.fix-layout{width:100%; max-width:1486px; margin:0 auto; position:relative; padding:0 12px;}
.clearfix:after{content:""; display:block; clear:both;}

html, body {width:100%;overflow-x:hidden;}
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  box-sizing: border-box; letter-spacing:-0.75;}
body { position: relative; color: #797979; font-size: 15px; font-family: AppleSD; font-weight: 400; line-height: 1; letter-spacing: -1px; }
input, textarea, select, option, button { font-family: Noto Sans KR, sans-serif; }
section { position: static; margin-top: 0; }
a:hover,a:active,a:focus { color: #0162a9; text-decoration: none; }

.backdrop{
	background-color: rgba(0, 0, 0, 0.42);
    width: 100%;
    height: 100%;
    position: fixed;
    cursor: pointer;
    z-index: 2;
    top: 0;
    left: 0;
}
/*header*/
#header{position:absolute; top:20px; width:100%;}
#header .fix-layout{max-width:1695px;}
#header .left{float:left;}
#header .logo{display:inline-block; position:unset;}
#header .logo > a{display:block; width:100%; height:100%;}
#header .gnb-wrap{display:inline-block;}
#header .right{float:right;padding-top:0px; /*position: relative;padding-top:60px; text-align: right;*/ /* 우측 정렬 */}
#header .right .home-icon{margin-left:30px;}
#header .gnb-wrap{display:inline-block; margin-left:50px; vertical-align:middle; width:800px;}
#header .login{font-size:14px; color:#fff; font-family: 'AppleSD'; margin-right:10px; display:inline-block; line-height:22px;}
#header .login:hover{text-decoration:underline;}
#header .login i{display:inline-block; width:20px; height:20px; background:url(/resources/images/finance/common/ico_login.png) no-repeat center / 20px; vertical-align:middle; margin-right:3px}
#header .login.out i{background:url(/resources/images/finance/common/ico_logout.png) no-repeat center / 20px;}
#header .right .mark-wrap{
  display:flex; justify-content:flex-end; align-items:center;
  margin-bottom:5px; /* 아래 로그인/사이트맵/홈과 간격 */
}
#header .right .youtube-icon{display:inline-block; margin-right:6px;}
#header .right .youtube-icon img{width:32px; height:32px;}
#header .right .school-mark {
  display: block;
  text-align: right;
  margin-bottom: 5px;
  margin-right: 0px;
}

#header .right .school-mark .inner {
  display: inline-block; width: 120px;/*height: 60px;line-height: 60px;*/ padding: 10px 20px;background: #c80000;color: #fff; font-size: 16px;font-weight: 500; text-align: center;white-space: nowrap; clip-path: polygon(12% 0%, 88% 0%, 100% 50%, 88% 100%, 12% 100%, 0% 50%);}
/*tnb*/
.tnb{display:none;}
@media all and (max-width:1200px){
	#header .right .login{display:none;}
	#header .tnb{display:block;}
	#header .tnb a{padding:18px 10px; font-size:18px; background:#222; width:100%; border-bottom:1px solid rgba(255,255,255.1);}
}
/*gnb*/
#gnb > ul > li{float:left; width:20%; text-align:center; position:relative;}
#gnb > ul > li > a{font-family:'AppleSD'; font-size:25px; color:#fff; font-weight:600; padding-bottom:50px;}
#gnb > ul > li > ul{width:100%; background-color:#000; position:absolute; left:0; top:50px; display:none;}
#gnb > ul > li:hover > ul{display:block;}
#gnb > ul > li > ul > li a{font-family:'AppleSD'; font-size:18px; color:#fff; font-weight:600; display:block; padding:12px 0;}

/*footer*/
footer h3{background:none;padding-top:0;margin: 0;}
footer{background-color:#2d2d2d; padding:0; position:fixed; bottom:0; width:100%; z-index:10;}
footer .left{float:left;}
footer .left h3, footer .left p{display:inline-block; vertical-align:middle;}
footer .left .logo02{margin-left:22px; margin-right:44px;}
footer .left p{color:#969696; font-size:14px; font-family:'GmarketSans'; font-weight:500;}
footer .left p span{color:#fff; margin-right:10px}
footer .right{float:right; padding-top:10px;} 
footer .right a{display:inline-block; vertical-align:middle;}
footer .right .lint-btn{font-family:'GmarketSans'; padding-right:26px; background:url(/resources/images/safety/common/ft_ico01.png) no-repeat right center; color:#fff; font-size:15px; font-weight:500; margin-right:20px;}
footer .right .top{border:1px solid #c80000; border-radius:14px; width:60px; height:60px; background:url(/resources/images/safety/common/ft_ico02.png) no-repeat center 14px; padding-top:34px; font-family:'GmarketSans'; color:#c80000; font-size:12px; font-weight:500;}


@media all and (max-width:1486px){
	.fix-layout{padding:0 12px;}
	
	#header .fix-layout{max-width:unset; width:100%;}
	#header .logo{width:100px; height:100px;}
	#header .gnb-wrap{margin-left:0; margin-left:30px; width:600px;}
	#header .right{padding-top:0px;}
}


@media all and (max-width:1200px){
	header{position:unset; z-index:1; background-color: #231f20;}
	#header{top:0; position:unset;     background-color: #231f20; z-index:1;}
	#gnb{position:absolute; top:0; right:0; width:255px; display:none; z-index:3;}
	#gnb > ul > li{width:100%; float:none;}
	#gnb > ul > li > a{padding:18px 10px 18px 10px; display:block; background-color:#222; color:fff; font-size:18px; border-bottom:1px solid rgba(255,255,255.1); text-align:left;}
	#gnb > ul > li.open > a{background-color:#c80000}
	#gnb > ul > li > ul{position:unset; display:none;}
	#gnb > ul > li:hover > ul{display:none;}
	#gnb > ul > li.on > ul{display:block;}
	#gnb > ul > li > ul > li a{background-color:#fff; color:#121212; text-align:left; padding:18px 10px 18px 10px;}
	#header .left{width:110px;}
	#header .right .home-icon{position:absolute; left:110px; margin-top:40px;}
	 #header .right .mark-wrap{
    position:absolute; left:130px; margin-top:5px; /* 필요 시 top으로 바꿔도 됩니다 */
    display:flex; align-items:center; justify-content:flex-start;
  }
	#header .right .school-mark {position:absolute; left:30px;  margin-top:5px;}
	#header .right .school-mark .inner {width:110px; padding:7px 10px; font-size:14px;
  /*display: inline-block; width: 110px; padding: 7px 10px;background: #c80000;color: #fff; font-size: 14px;font-weight: 500;*/}
	footer{position:unset;}
}
@media all and (max-width:1000px){
	footer{padding:24px 0;}
	footer .left{float:none; width:100%; text-align:center; margin-bottom:12px;}
	footer .right{float:none; width:100%; text-align:center;}
	footer .left p{display:block; width:100%; margin-top:12px;}
	footer .left p span{display:block; margin-right:0; margin-bottom:5px}
	footer .right .lint-btn{display:block; width:fit-content;  margin:0 auto 12px auto;}
}
@media all and (max-width:500px){
	#header .logo{width:80px; height:80px;}
	#header .left{width:80px;}
	#header .right{width:40px; height:auto;/*padding-top:20px;*/}
	#header .right .home-icon{width:150px; left:100px; margin-left:0; margin-top:40px;}
	#header .right .mark-wrap{left:100px; margin-top:5px;}
	#header .right .youtube-icon img{width:18px; height:18px;}
	#header .right .school-mark .inner{width:100px; padding:6px 8px; font-size:13px;}
	/*#header .right .school-mark {left:100px;  margin-top:5px;}*/
	#header .right .sitemap-icon{display: inline-block; margin-top:20px;}
}