@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Titillium+Web');
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap');

/* 노토산스 */
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 100; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); 
	} 
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 300; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
	}
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 400; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
	} 
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 500; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
	} 
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 700; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
	} 
@font-face { 
	font-family: 'Noto Sans KR'; 
	font-style: normal; 
	font-weight: 900; 
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), 
		url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');
	}

/*Titillium*/
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 300;
  src: local('Titillium Web Light'), local('TitilliumWeb-Light'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffGjEGIVzY4SY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 300;
  src: local('Titillium Web Light'), local('TitilliumWeb-Light'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffGjEGItzYw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  src: local('Titillium Web Regular'), local('TitilliumWeb-Regular'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPecZTIAOhVxoMyOr9n_E7fdM3mDbRS.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  src: local('Titillium Web Regular'), local('TitilliumWeb-Regular'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPecZTIAOhVxoMyOr9n_E7fdMPmDQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  src: local('Titillium Web SemiBold'), local('TitilliumWeb-SemiBold'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffBzCGIVzY4SY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 600;
  src: local('Titillium Web SemiBold'), local('TitilliumWeb-SemiBold'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffBzCGItzYw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  src: local('Titillium Web Bold'), local('TitilliumWeb-Bold'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffHjDGIVzY4SY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 700;
  src: local('Titillium Web Bold'), local('TitilliumWeb-Bold'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffHjDGItzYw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 900;
  src: local('Titillium Web Black'), local('TitilliumWeb-Black'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffEDBGIVzY4SY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 900;
  src: local('Titillium Web Black'), local('TitilliumWeb-Black'), url(https://fonts.gstatic.com/s/titilliumweb/v6/NaPDcZTIAOhVxoMyOr9n_E7ffEDBGItzYw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}




/* 폰트 */
.lato{font-family:'Lato', sans-serif;}
.dosis{font-family: 'Dosis', sans-serif;}
.titillium{font-family: 'Titillium Web', sans-serif;}
.noto{font-family: 'Noto Sans KR', sans-serif;}
.nanum{font-family: 'Nanum Gothic', sans-serif;}


/*테이블*/
.to_table{border-top:2px solid #353535; background:#ffffff; margin:10px 0 10px 0;}
.to_table caption{display:none;}
.to_table thead tr th{font-weight:bold; border:1px solid #e0e0e0; background:#ededed; text-align:center; padding:12px; font-size:15px;}
.to_table td{border:1px solid #e0e0e0; padding:12px; color:#666; text-align:center; border-collapse:collapse; font-size:14px;}
.to_table tr.color td{ background: #f5fafb;}
.to_table td.end{color:#3270bd;}
.to_table td.end2{color:#25a99e;}
@media (max-width: 991px) {
	.to_table thead tr th{padding:3px; font-size:12px;}
	.to_table td{padding:3px; font-size:11px;}
}
/*clearfix*/
.cf{}/* 여기서 cf는 float속성을 가진 태그의 부모태그라고 생각한다.*/
.cf:after{display:block; content:""; clear: both;}

.relav{position:relative !important}
/* 준비중페이지 */
#ready{text-align:center; background:url(../img/common/ready.png) no-repeat 50% 0; margin:80px 0;  
        padding-top:130px; font-size:1.5em; line-height:1.3em; color:#333;}
#ready strong{font-weight:600; color:#23B1BD;}
#ready p{font-size:0.8em; color:#666;}

/*가로스크롤*/
.row-horizon:before{content:"← 좌우스크롤로 확인해주세요 →"; display:block;  margin:5px 0 5px 5px; font-size:11px; color:#999;}
.row-horizon {
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  float: none;
  width: 100%;
}

.tbl table{ font-size:1em;  }

.blind{
	position: absolute;
	clip: rect(0 0 0 0);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
}
.tc {text-align:center !important}
.tl {text-align:left !important}
.tr {text-align:right !important}
.blue {color:#2e3180 !important}
.white {color:#FFF !important}
.org {color:#ed7723 !important}

.w1200 {width:1200px;margin-left:auto;margin-right:auto}
.w960 {width:960px;margin-left:auto;margin-right:auto}
.autoW {width:80vw;margin-left: auto;min-width:1200px;margin-right: auto;}

.tran04s,
.tran04s:hover{
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	-ms-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}
.tran03s,
.tran03s:hover{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}


.lin-b {
	display:block;
}


.topTitBox {
    padding: 60px 0;
    display: -webkit-box; display: -ms-flexbox; display: flex;
	-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
	-webkit-box-align: end; -ms-flex-align: end; align-items: flex-end;
}
.topTitBox h2{
    font-size: 45px;
    color: #222222;
    font-weight: 600;
    float: left;
	position:relative
}
.topTitBox ul{
}
.topTitBox li{
    float: left;

}
.topTitBox li a{
    display: inline-block;
    font-size: 24px;
	margin:0 4px;
	background-color:#5477d1;
    color: #fff;
    padding: 5px 18px;
}
.topTitBox li a.on, .topTitBox li a:hover{
    font-weight: 800;
	background-color:#1f3c88;
}
.animate__delay-_1s {-webkit-animation-delay: .1s;animation-delay: .1s;}
.animate__delay-_2s {-webkit-animation-delay: .2s;animation-delay: .2s;}
.animate__delay-_3s {-webkit-animation-delay: .3s;animation-delay: .3s;}
.animate__delay-_4s {-webkit-animation-delay: .4s;animation-delay: .4s;}
.animate__delay-_5s {-webkit-animation-delay: .5s;animation-delay: .5s;}
.animate__delay-_6s {-webkit-animation-delay: .6s;animation-delay: .6s;}
.animate__delay-_7s {-webkit-animation-delay: .7s;animation-delay: .7s;}
.animate__delay-_8s {-webkit-animation-delay: .8s;animation-delay: .8s;}
.animate__delay-_9s {-webkit-animation-delay: .9s;animation-delay: .9s;}
	.mbVer {display:none !important}



@media (max-width:1201px) {
	.w1200 {width:96%;}
	.autoW{
		min-width: 768px;
	}
	.topTitBox h2 {font-size:30px}
}
@media (max-width:769px) {
	.autoW,.w1200 {width: 92vw;min-width: 280px;}
	.pcVer {display:none !important}
	.mbVer {display:block !important}
	.lin-b {
		display: inline;
	}
	.topTitBox{flex-direction: column;padding: 30px 0;align-items: center;}
	.topTitBox h2{
		float: inherit;
		text-align: center;
		font-size: 2em;
		margin-bottom: 30px;
	}


}