/*header*/
header .wrap{width: 100%; padding-top:0;}
header .wrap .tnb {padding: 0 70px; border-bottom: 3px solid #111;}
header .wrap .tnb .link a {display: inline-block;position: relative;font-size: 12px;padding: 7px 20px;margin:5% 0;opacity: .7;background-color:#252525;border-radius:20px; color:#fff}
header .wrap .tnb .link a:hover {opacity: 1;}
header .wrap .tnb .link span {opacity: .8;}
header .wrap .tnb .sns a {display:inline-block;font-size: 0;text-indent: -9999px;overflow: hidden;width:40px;height: 40px;margin-top: 3px;opacity: .85;}
header .wrap .tnb .sns a:hover {opacity: 1;}
header .wrap .tnb .sns a.KTL {background: url(../img/common/ktl.png) no-repeat 50%;}
header .wrap .tnb .sns a.youtube {background: url(../img/common/youtube.png) no-repeat 50%;}
header .wrap .tnb .sns a.facebook {background: url(../img/common/facebook.png) no-repeat 50%;}
header .wrap .tnb .sns a.blog {background: url(../img/common/blog.png) no-repeat 50%;}
header .wrap .tnb .sns a.kakao {background: url(../img/common/kakao.png) no-repeat 50%;}
header h2{width:100%;background:#14354a;color: #fff;font-size: 30px;padding:15px;text-align: center;font-family: Noto Serif KR;font-weight: 300;letter-spacing: 0em;}

.logo a{font-size: 0;line-height: 0;width: 100%;height: 100%;background:url(../img/common/logo.png)center no-repeat;display: block;}

/*기존 디자인 -로구 위,아래 문구있는거
.gnb {position: relative;}
.gnb .vol p span,.gnb .logo h1 {font-family: 'Noto Serif KR', serif;}

.gnb li {min-height: 170px;padding: 30px 110px;margin: 30px 0 30px 0;text-align:center;}
.gnb .vol {border-right: 1px solid #aaa;}
.gnb .menu {border-left: 1px solid #aaa;float: right;}
.gnb .vol p {text-align:center;margin-top: 0;}
.gnb .vol p span {display: block;padding:2px;color: #000;font-weight: 300;}
.gnb .logo {position: absolute;width:558px;top: 0;left:50%;margin:0;margin-left: -279px;padding:10px 0 50px 0;}
.gnb .logo h1 {background:url(../img/common/ktl_trust.png) no-repeat 50%; width:503px; height: 63px; background-size: 100%;}
.gnb .logo p {font-size: 24px;display: block;padding-bottom: 15px;color: #000;}
.gnb .logo .slogun{font-size: 16px;color:#656565;}
.gnb .menu a{display: block;background:url(../img/common/menu.png) no-repeat 50%;width:69px;height: 62px;margin-top: 10px;background-size: 100%;}
*/
.gnb {position: relative;z-index:9999}
.gnb .vol p span,.gnb .logo h1 {font-family: 'Noto Serif KR', serif;}
.gnb li {min-height: 130px;padding: 10px 110px;margin: 40px 0 40px 0;text-align:center;}
.gnb .vol {border-right: 1px solid #aaa;}
.gnb .menu {border-left: 1px solid #aaa;float: right;}
.gnb .vol p {text-align:center;margin-top: 0;}
.gnb .vol p span {display: block;/*padding:2px 0;*/color: #000;font-weight: 400;text-align:left;font-family: 'Noto Serif KR', serif;font-size:14px;}
.gnb .vol p .vol_num {display: block;padding:5% 0 0 0;/*padding:2px 0;*/color: #000;font-weight: 300;font-size:22px;font-family: 'Times New Roman', serif;}
.gnb .logo {position: absolute;width:558px;top: 0;left:50%;margin:0;margin-left: -279px;padding:50px 0 50px 0;}
.gnb .logo h1 {background:url(../img/common/ktl_trust.png) no-repeat 50%; width:503px; height: 63px; background-size: 100%;}
.gnb .logo p {font-size: 24px;display: block;color: #000;}
.gnb .logo .slogun{font-size: 18px;color:#656565;font-family: 'Noto Serif KR', serif;}
.gnb .menu a{display: block;background:url(../img/common/menu.png) no-repeat 50%;width:69px;height: 62px;margin-top: 10px;background-size: 100%;}


@keyframes i_on { 0%   {margin-left: 0;}  100% {margin-left: 20px;}}

.Other {clear:both;background: #e7f2fa;padding: 100px 0;margin-top: 150px;}
.Other .wrap h3 {font-size: 28px; font-weight: 600; text-align:center;}
.Other .wrap ul {margin-top: 30px;}
.Other picture {display: block;position: relative;width:240px;height: 192px;transition: .5s;margin: 5px auto;}
.Other a:hover picture:after {position: absolute; content: ""; display: block; width:100%; height: 100%; background:#00000066; top: 0; left:0; transition: .5s}

.Other h4 {font-size: 15px;color: #000;padding:10px 0 0;letter-spacing: -0.05em;}
.Other p {font-size: 14px;min-height: 100px;letter-spacing: -0.05em;margin-top: 10px;}
.Other a {/* padding: 10px; */text-align: center;}

#menu_open {position: fixed;top: 0;margin: 0;/* padding: 0; */width: 100%;opacity: 0;right:-50%;z-index:-1;transition: .3s; box-shadow: 0 0 200px #000000aa;}
#menu_open .wrap { padding-top:0;}
#menu_open.menu_open {opacity:1;right:0;z-index:9999; transition: .5s}
#menu_open .close_bt {position: absolute;top: 70px;right: 80px;z-index: 99999;}
#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);}

/*footer*/
/*footer{position: relative; background-color: #ffffff;padding: 30px 70px 50px;}
footer p {line-height: 1}
footer .logo_f{display: block; max-width:132px}
footer .copyright .copyright_p{font-size: 13px;color: #7c7c7c;}
footer .award { position: absolute; top: 70px; right: 90px; }*/
footer {width:95%;margin:2% auto}
footer div {display:flex}
.logobox { }
.logobox a{display:block;}
.logobox a.edit_copy {font-size:1em;line-height:3.5;font-weight:bold;color:#4b4b4b}
.copyright p {display:block;font-size:14px;color:#777;line-height:2}
.copyright p span {margin-right:3%}
.copyright p span a {display:inline}
.award {margin:1% 0 0 0;display:flex}


/*주석*/
.footnote{font-size:14px;}

/*카드뉴스*/
.cardnews{list-style:none; width:65%;margin:5% auto; max-width:1024px;}
.cardnews li{display:block;margin-bottom:20px;}


/*퇴직자 리스트*/
.people_list{position: relative;overflow:hidden;/*background-color: #fff4fc;*/padding: 3% 10% 7% 10%; width:100%;margin:1% 0 5% 0; border:5px solid #e0b3c4}
.people_list ul{list-style:none;border-top:2px solid #cccccc;padding-top:3%}
.people_list li{display:block; float:left;margin: 3% 4%; font-size: 18px;line-height:180%;color:#898989;}
.people_list li span{font-size: 20px; font-weight:500;line-height:250%; color:#252525;}
.people_list .titleMs{margin-bottom:0px;font-size: 30px;}

.m800 {display: none;}
.pc02 {display:block}

@media screen and (max-width: 1400px) {
    header .wrap .tnb {padding: 0 20px;}
    .gnb li {padding: 10px 30px 20px 30px;margin: 35px 0;min-height:45px;}
    .gnb .vol p span {padding:0;font-size:12px}
	.gnb .vol p .vol_num{font-size:18px}
    .gnb .logo {padding: 30px 0;}
    .gnb .logo h1 {width: 350px;height:50px;margin-top:20px;}
    .gnb .logo p {margin:0; padding:0;font-size: 16px;}
    .gnb .menu a {width: 50px;margin-top: 5px;margin-bottom: 10px;}
	.gnb .logo .slogun{font-size: 14px;margin-top:10px}
	.people_list{padding: 3% 8% 7% 8%;}
	.people_list li{margin: 3% 3%;}

}
@media screen and (max-width: 1280px) {
	.people_list{padding: 3% 8% 7% 8%;}
	.people_list li{margin: 3% 3%;font-size: 16px;}
	.people_list li span{font-size: 18px;}
	.people_list .titleMs{font-size: 24px;}
}
@media screen and (max-width: 1120px) {
	.people_list li{margin: 3% 2%;}
}
@media screen and (max-width: 1024px) {
    .sns  {display: none;}
    header h2 {font-size: 18px}
	.people_list li{margin: 3% 2%;font-size: 14px;}
	.people_list li span{font-size: 16px;}
}
@media screen and (max-width: 768px) {
    header .wrap .tnb {padding: 0 15px;}
    .gnb li {transform: scale(0.8);padding: 10px 20px 20px 20px;}
    .gnb .vol {margin-top:5%;padding:4% 15px 4% 15px;}
	.gnb .vol p span{display:none; }
    .gnb .menu {padding-right: 10px}
	.people_list li{margin: 3% 4%;}
	.gnb .vol p .vol_num{line-height:130%}
	footer {margin:3% auto 2% auto}
	.logobox a.edit_copy {font-size:1.1em;line-height:3}
	.copyright p {font-size:14px}
}
@media screen and (max-width: 600px) {
	
    header .wrap .tnb {padding: 0;}
    .Other picture {width: 45vw;height: 30vw;overflow: hidden;}
    .Other {padding: 50px 0;}
    .Other p {min-height: 70px;}
	.gnb li{margin:20px 20px;}
	.gnb .logo h1 {width: 300px;height:40px;}
	.gnb .logo{padding:20px 0}
}
@media screen and (max-width: 500px) {
    .gnb .logo {transform: scale(0.6);}
    .gnb .vol {margin-top:3%;padding:5% 15px 5% 15px;}
    .gnb .vol span{font-size: 14px;}
	.people_list li{float:none; margin: 3% 8%;}
	.Other h4{font-size: 13px;}
	 .Other p {font-size: 12px;}
}

@media screen and (max-width:414px) {
    .gnb li {transform: scale(0.6);margin:10px 10px;}
    .gnb .vol {padding:8% 15px 8% 0px;}
    .gnb .menu {padding-right: 0px}
    .gnb .logo {transform: scale(0.6);padding:10px 0}
	footer {width:98%}
	.logobox a.edit_copy {font-size:1em;line-height:3}
}


@media screen and (max-width: 800px) {
    footer {padding: 0 25px 30px;}
    footer .copyright .copyright_p {font-size: 11px}
    footer .award {top:8px;right: 25px;}
}
@media screen and (max-width: 600px) {
}
@media screen and (max-width: 500px) {
}
@media screen and (max-width: 400px) {
}


/*main-sub content*/
.m {display: none}
.m02{display: none}
@media screen and (max-width: 1024px) {
    .pc {display: none}
    .m {display: block;}
    .m img {max-width: 100%;}
}
.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: #ff5886;}
.top:before {position: absolute; display: inline-block; top: 5px; content: ""; width:33px; height: 18px; border-radius: 20px; border: 2px solid #ff5886;}
.top i {position: absolute; direction: inline-block; top: 10px; width:12px; height: 12px; border-radius: 20px; background: #ff5886; animation:i_on 0.5s 1 forwards;}

@media screen and (max-width: 1400px) {
    #menu_open {overflow-y:auto;height: 100vh;}
    .Other .wrap h3 {font-size: 20px}
}
@media screen and (max-width: 1300px) {
    .titleM{font-size: 3vw;}
    .titleMs {font-size: 1.2vw;}
}
@media screen and (max-width: 1024px) {
    .line { height: 70px;}
    .titleM { font-size: 4vw;}
    .titleMs {font-size: 1.7vw;}
    .titleB {font-size: 3.8vw;}
    .titleB .gold{font-size: 16px;}
    #menu_open .close_bt { top: 10px; right: 10px; }
}
@media screen and (max-width: 800px) {
    .titleM {font-size: 25px;}
    .titleMs {font-size: 14px;}
    .titleB {font-size: 23px;}
    #menu_open.Other picture {height: 20vw;display: none;}
	.m800 {display: block;}
	.pc02 {display:none}
	.m02{display: block}
}

@media screen and (max-width: 600px) {
}

@media screen and (max-width: 500px) {
    #Other.Other p {min-height: 50px;margin-top: 5px;line-height: 1.4;}
}

@media screen and (max-width: 414px) {
}