/*font*/

/*header*/
header .wrap{width: 100%; padding-top:1%;}
header h2{width:100%;color: #fff;font-size: 30px;padding:15px;text-align: center;font-family: Noto Serif KR;font-weight: 300;letter-spacing: 0em;}
a:hover {color: #000; text-decoration: none;}
a.bt:hover {text-decoration: none;}
a.bt.bt_w:hover {color: #2f60ff; border-color:#2f60ff; transition: .25s;}
.gnb {position: relative;padding: 20px 5%;}
.gnb .vol p span,.gnb .logo h1 {font-family: 'Noto Serif KR', serif;}
.logo a {position: absolute;font-size: 0;line-height: 0;width: 139px;height: 57px;background:url(../img/common/logo.png)center no-repeat;display: block;}
.gnb .menu {position: absolute;right: 10%;padding: 0 5% 0 0;}
.gnb .menu > span {position: absolute;width:200px;display: inline-block;right: 15%;font-size: 15px;letter-spacing: 0.02em;}
.gnb .menu a > span {position: relative;display: inline-block;padding: 0px 50px 0 0;right: 5%;font-size: 17px;font-weight: 600;line-height:25px;}
.gnb .vol p {text-align:center;margin-top: 0;}
.gnb .vol p span {display: block;padding:4px;color: #000;font-weight: 300;}
.gnb .logo {position: absolute;text-align: left;top: 0;left: 5%;padding: 20px 0;}
.gnb .menu .nav_bt{position: fixed;right:5%;}
.gnb .menu .nav_bt span{position: fixed;right:5.5%;}
.gnb .menu a{display: block;background: url('../img/common/menu.png') no-repeat 50% 50%;width: 43px;height: 32px;background-size: 100%;text-indent: 0;}
.highlight{background-color:#e6f9fe}
.capsule {display: inline-block; padding:5px 20px; border-radius: 50px; font-family:  font-size: 16px; color: #fff; background:#2f60ff; letter-spacing: 0;}

#menu_open {position: fixed;top: 0;width: 100%; opacity: 0;  margin: 0;padding: 1% 5vw; background: #fff; left:0%;z-index:-1;transition: .3s;}
#menu_open .wrap { padding-top:0;}
#menu_open.menu_open {opacity:1;right:0;z-index:9999; transition: .5s;}
#menu_open h3,#menu_open p {text-align:left;}
#menu_open h2 {padding: 2%; font-size: 48px; border-bottom: 1px solid #000;text-align:center;}
#menu_open ul {padding: 4% 4% 4% 9%;}
#menu_open ul li a {display: block; margin-bottom: 30px; text-align:left;}
#menu_open ul li a p {display: inline-block;color: #2f60ff;font-size: 14px;margin: 10px auto;font-weight:600}
#menu_open ul li h3 {font-family: 'Noto Serif KR', serif;font-size: 18px;font-weight:600; line-height:1.5}
#menu_open ul li h3 span {display: block;font-family: 'Noto Serif KR', serif; font-size: 14px; padding-top: 10px; color: #999;}

#menu_open ul li a:hover h3 {color: #2f60ff; /*text-decoration: underline;*/}
#menu_open ul li a:hober p { border: 1px solid #2f60ff; }

#menu_open .close_bt {position: absolute;top: 30px;right: 90px;z-index: 99999; cursor: pointer;}
#menu_open .close_bt span {position: relative;display: block;font-size: 0;width:60px;height: 60px;top: 0px;border-radius: 60px;background:#000000;}
#menu_open .close_bt span:before,
#menu_open .close_bt span:after {position: absolute;content: "";display: block;width:30px;height: 2px;top: 28px;left: 15px;background:#fff;}
#menu_open .close_bt span:before {transform: rotate(45deg);}
#menu_open .close_bt span:after {transform: rotate(-45deg);}


/*main-sub content*/
.m {display: none}

.titleM{font-size: 45px;font-weight: 400;letter-spacing: -0.05em;color: #212121;line-height: 1.4;}
.titleM b,.titleM.b {font-weight: 600}
.titleMs{font-size:22px;color: #212121;margin: 20px 0 30px;line-height: 1.4;font-weight: 600;}
.titleB{font-size: 44px;font-weight: 600;color: #212121;letter-spacing: -0.05em;}

.info {position: relative;}
.top{position: relative; overflow-y: hidden;}
.top p {display: inline-block;}
.top span{margin-left: 45px; font-size: 18px; font-weight: 500; color: #0084ff;}
.top:before {position: absolute; display: inline-block; top: 5px; content: ""; width:33px; height: 18px; border-radius: 20px; border: 2px solid #0084ff;}
.top i {position: absolute; direction: inline-block; top: 10px; width:12px; height: 12px; border-radius: 20px; background: #0084ff; animation:i_on 0.5s 1 forwards;}


/*footer*/
footer{position: relative; background-color: #111;padding: 4% 0; text-align: center; /*height:100%*/}
footer .ft_bt { margin:0 auto; }
footer .ft_bt a {display: inline-block;border-radius: 50px;width: 190px;border: 1px solid #ddd;padding: 10px 0 12px;margin:0 10px;color: #fff;font-size:17px;}
footer .sns {position: absolute; top: 40%; left: 5%;}
footer .sns a {display: inline-block; width: 34px; height: 34px; margin-left: 15px; opacity: 0.5;}
footer .sns a:hover {opacity: 1;}
footer .sns a.sns_f { background: url(../img/common/sns_f.png) no-repeat 50%;}
footer .sns a.sns_y { background: url(../img/common/sns_y.png) no-repeat 50%;}
footer .sns a.sns_b { background: url(../img/common/sns_b.png) no-repeat 50%;}
footer .sns a.link_h { background: url(../img/common/link_h.png) no-repeat 50%;}
footer .copy .right {position: absolute; top: 30%; right: 5%; text-align: right;}
footer .copy .copyright_p{position: absolute; top: 55%; right: 5%; text-align: right; font-size: 14px;color: #7c7c7c;}
.footer_m {display: none}


@media screen and (max-width: 1680px) {
   #menu_open {}
    #menu_open ul li { overflow-y: scroll;}
	.gnb .menu .nav_bt{position: fixed;right:3%;z-index:9999}
	.gnb .menu .nav_bt span{position: fixed;right:3.5%}
	/*.gnb .menu > span {padding: 4px 70px 0 0;}*/
}
@media screen and (max-width: 1600px) {
    footer section {display: relative; }
    footer .copy .right { top: 23%;right: 5%;}
    footer .copy .copyright_p { top: 50%;}
	footer .sns{top: 30%; }
}
@media screen and (max-width: 1440px) {
    #menu_open { padding: 30px 2vw;}
	#menu_open ul li h3{font-size:16px}
    /*#menu_open ul li {width: 48%;margin: 0 1%; overflow-y: scroll;}*/
    /*.gnb .menu a > span {display: none;}
    .gnb .menu > span {padding: 5px 30px 0 0;}*/
	#menu_open {overflow-y:auto;height: 100vh;box-shadow: 5px 5px 5px #00000024;}
    .Other .wrap h3 {font-size: 20px}
	footer .ft_bt a {border-radius: 40px;width: 150px;color: #fff;font-size:14px;}
	footer .copy .copyright_p{font-size: 12px;}

}
@media screen and (max-width: 1280px) {
	.gnb .menu > span{right:30%;}
	footer .ft_bt a {border-radius: 30px;width: 130px;margin:0 5px;color: #fff;font-size:14px;}
	#menu_open ul {padding: 4% 4% 4% 4%;}

}
/*�꾩씠�⑤뱶 �꾨줈 11�몄튂 媛�濡�*/
@media screen and (max-width: 1194px) {
	#menu_open ul li h3{font-size:14px}
	.gnb .menu > span{right:40%;}
	.footer_m {display: block;}
	footer .copy .right img{width:70%}
}
@media screen and (max-width: 1024px) {
	.pc {display: none}
    .m {display: block;}
    .m img {max-width: 100%;}
	.gnb .menu > span{right:60%;}
    #menu_open .close_bt { top: 10px; right: 10px; }
}
@media screen and (max-width: 960px) {
	.gnb .menu{width:10%}
	#menu_open ul li h3{font-size:12px}
}
@media screen and (max-width: 900px) {
	footer {height:100%; padding:7% 0}
	footer section{position:relative;margin:0; padding:0}
	footer .sns {position:relative;width:90%; padding:0;text-align:center;margin:3% 0;}
	footer .copy{width:90%;position:relative;text-align:center;margin-left:10%;}
	footer .copy .right{position:relative;text-align:center !important;}
	footer .copy .right img{width:10%;}
	footer .copy .copyright_p{position:relative;text-align:center;margin:0 auto; float:none;}
    /*footer .copy .copyright_p {width:100%;text-align:center;font-size: 13px;right: 0;top: 120px;}*/
	.gnb .menu > span{right:100%;}
	.gnb .menu{width:15%}
	.gnb .menu > span{right:40%;}
	.capsule {font-size: 14px;}
}
@media screen and (max-width: 768px) {
    header .logo a {width: 100px; height: 41px; background-size: 100%;}
	.gnb .menu{width:20%}
    #menu_open h2 {padding: 30px; font-size: 30px;}
    #menu_open ul {padding: 1% 5%;}
    #menu_open ul li a {}
    #menu_open ul li a p,#menu_open ul li h3 span {font-size: 12px;margin:0 0}
    #menu_open ul li h3 {font-size: 14px;}
}
@media screen and (max-width: 600px) {
  /*  footer {height:200px;}
    footer .ft_bt a {width: 140px;margin: 4% 0;font-size: 12px;opacity: 0.8;}
    footer .copy .right, footer .sns {top:50px;}
    footer .copy .copyright_p {top: 120px;}
    footer .sns a.sns_f,
    footer .sns a.sns_y,
    footer .sns a.sns_b,
    footer .sns a.link_h {background-size: 70%}
    footer .copy .right img {width: 70%}
    footer .sns a {margin-left: 8px}*/
	.gnb .menu{width:10%}
	.gnb .menu a > span{display:none;}
	.gnb .menu > span{font-size:13px;width:150px}
	footer .ft_bt a {width: 140px;margin: 4% 1%;font-size: 12px;opacity: 0.8;padding: 5px 0 7px;}
	
}
@media screen and (max-width: 520px) {
	.gnb .menu .nav_bt {right:5%;top:2.2%}
}
@media screen and (max-width: 428px) {
	header .wrap{width: 100%; padding-top:2%;}
	.gnb .menu .nav_bt {right:5%;top:3%}
	.gnb .menu .nav_bt {width:8%;}
	.news_tit {font-size:20px !important}
}

@media screen and (max-width: 414px) {
    .capsule {font-size: 12px; letter-spacing: 0;}
	.gnb .menu{width:15%}
	.gnb .menu > span{font-size:12px;width:130px}
}
@media screen and (max-width: 350px) {
.gnb .menu > span{font-size:11px;}
}