@charset "utf-8";

/*********************************************
	인사말
*********************************************/

.greetingWrap {display:flex; flex-direction:row-reverse;}
.greetingWrap .greetingPhoto {flex-grow:1; border-radius:1.5rem; background:url(../img/contents/01/img_0101.png) no-repeat 50% 0 / cover; margin-left:6.3rem;}
.greetingWrap .greetingText {display:block; flex-shrink:0; width:65rem;}

.greetingWrap .title {display:block; margin-bottom:4rem; line-height:1.4; font-size:4rem; font-weight:700; word-break:keep-all; letter-spacing:-5%;}
.greetingWrap .title strong {color:#FF4A57;}
.greetingWrap .sign {display:flex; margin-top:4.8rem; justify-content:end; align-items:end;}
.greetingWrap .sign strong {display:block; position:relative; width:14.5rem; height:3.9rem; text-indent:-999px; overflow:hidden; margin-left:2rem; background:url(../img/contents/01/img_0101_sign.png) no-repeat 50% 50% / contain;}
.greetingWrap .greetingCont p {word-break:keep-all;}
.greetingWrap .greetingCont p + p {margin-top:1.4em;}

@media all and (max-width:1024px) {
	.greetingWrap {display:block;}
	.greetingWrap .greetingPhoto {position:relative; z-index:0; margin-left:auto; width:70%; background-position-y:10%; border-radius:26rem 1.5rem 1.5rem 0;}
	.greetingWrap .greetingPhoto:before {content:""; display:block; position:relative; padding-top:56%;}
	.greetingWrap .greetingText {position:relative; width:auto; z-index:1;}
	.greetingWrap .greetingText .title {display:inline-block; padding:4rem 5rem 0 0; margin-top:-12rem; margin-right:4em; background:#fff; border-radius:0 11rem 0 0;}
}
@media all and (max-width:810px) {
	.greetingWrap .greetingText .title {font-size:3.5rem;}
	
}
@media all and (max-width:740px) {
	.greetingWrap .greetingPhoto {border-radius:1.5rem; width:100%;}
	.greetingWrap .greetingPhoto:before  {padding-top:60%;}
	.greetingWrap .greetingText .title {margin-top:0; background:transparent; margin-right:0; border-radius:0;}
}
@media all and (max-width:640px) {
	.greetingWrap .greetingText .title {font-size:3rem;}
}


/*********************************************
	취임사
*********************************************/

.inauguralWrap {display:block; position:relative; padding:13.7rem 0 0 18.6rem;}
.inauguralWrap .top {display:block; position:relative; padding:5rem 0 4.9rem 16.5rem; z-index:0;}
.inauguralWrap .top:before {content:""; display:block; position:absolute; left:-18.6rem; bottom:-20.6rem; width:26.1rem; height:54.8rem; background:url(../img/contents/01/img_0102.png) no-repeat 0 0 / 32rem auto;}
.inauguralWrap .top:after {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:-20.6rem; border-radius:3rem; box-shadow:0 1rem 3rem 0 rgba(67,93,197,.25); z-index:-2; background:url(../img/contents/01/img_0102_bak.png) no-repeat 50% 50% / 100% 100%;}
.inauguralWrap .top h4 {margin:0; padding:0; font-size:5rem; color:#fff; font-weight:400;}
.inauguralWrap .top h4:before {position:relative; margin-left:-1.5rem; margin-bottom:.5rem; top:0; margin-top:0; width:4.2rem; height:3rem; background:url(../img/contents/01/img_0102.png) no-repeat -26.8rem 0 / 32rem auto;}
.inauguralWrap .con {display:block; position:relative; border-radius:10rem 0 0 0; background:#fff; margin-left:8.8rem; padding:6.8rem 0 0 8.2rem; z-index:1;}
.inauguralWrap .con p + p {margin-top:1.4em;}
.inauguralWrap .con h5 {color:#2F353D; font-size:2.4rem; margin:3.6rem 0;}
.inauguralWrap .sign-area {display:flex; align-items:end; margin-top:3.6rem;}
.inauguralWrap .sign-area .txt {font-weight:700;}
.inauguralWrap .sign-area .sign {display:block; position:relative; width:14.5rem; height:3.9rem; text-indent:-999px; overflow:hidden; margin-left:1.5rem; background:url(../img/contents/01/img_0101_sign.png) no-repeat 50% 50% / contain;}


@media all and (max-width:1024px) {
	.inauguralWrap {padding:1.3rem 0 0;}
	.inauguralWrap .top {padding:5rem 4rem 3rem; text-align:center;}
	.inauguralWrap .top:before {left:0; transform:scale(.8); -webkit-transform:scale(.8); transform-origin:left bottom; -webkit-transform-origin:left bottom;}
	.inauguralWrap .top:after {border-radius:3rem 3rem 0 0;}
	.inauguralWrap .top h4 {font-size:4rem; text-shadow:0 0 3rem rgba(67,93,197,.25); word-break:keep-all;}
	.inauguralWrap .top h4:before {margin:0 auto .5rem;}
	.inauguralWrap .con {margin:0 2rem; border-radius:3rem; padding:4rem;}
}
@media all and (max-width:640px) {
	.inauguralWrap .top:before {display:none;}
	.inauguralWrap .top h4 {font-size:3.5rem;}
	.inauguralWrap .con {word-break:keep-all;}
	.inauguralWrap .con br {display:none;}
}
@media all and (max-width:460px) {
	.inauguralWrap .con {padding:4rem 3rem; margin:0;}
}
@media all and (max-width:380px) {
	.inauguralWrap .sign-area {flex-direction:column; align-items:end;}
	.inauguralWrap .sign-area .txt {margin-bottom:1.5rem; text-align:right;}
}




/*********************************************
	신년사
*********************************************/

.newYearWrap {display:block; position:relative; padding:12rem 2rem 14.5rem; z-index:0;}
.newYearWrap:after {content:""; display:block; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1;
	border:16rem solid transparent;
	-webkit-border-image:url(../img/contents/01/img_0103_frame.svg) 33.333% stretch;
	-o-border-image:url(../img/contents/01/img_0103_frame.svg) 33.333% stretch;
	border-image:url(../img/contents/01/img_0103_frame.svg) 33.333% stretch;
}
.newYearWrap .newYearHead {text-align:center;}
.newYearWrap .newYearHead .year {color:#FF4A57; font-weight:800; font-size:2rem;}
.newYearWrap .newYearHead h4 {font-size:5rem; color:#2F353D; line-height:1.4em; padding:0; margin:0 0 2.4rem;}
.newYearWrap .newYearHead h4:before {display:none;}
.newYearWrap .newYearHead .slogan {font-size:2rem; font-weight:500;}
.newYearWrap .newYearCont {display:block; max-width:1080px; margin:7rem auto;}
.newYearWrap .newYearCont p {word-break:keep-all;}
.newYearWrap .newYearCont p + p {margin-top:1.4em;}
.newYearWrap .newYearCont p.big {font-size:2.4rem; font-weight:800;}
.newYearWrap .newYearCont .tit-con {margin-top:5rem;}
.newYearWrap .newYearCont .tit-con h5 {font-size:2.4rem; color:#FF4A57;}
.newYearWrap .newYearCont .sign {display:flex; align-items:end; flex-wrap:wrap; justify-content:center; margin-top:9.4rem;}
.newYearWrap .newYearCont .sign span {display:block; color:#454545;}
.newYearWrap .newYearCont .sign .date {display:block; width:100%; font-size:2rem; font-weight:300; text-align:center; margin-bottom:1.8rem;}
.newYearWrap .newYearCont .sign strong {display:block; position:relative; width:14.5rem; height:3.9rem; text-indent:-999px; overflow:hidden; margin-left:2rem; background:url(../img/contents/01/img_0101_sign.png) no-repeat 50% 50% / contain;}

@media all and (max-width:640px) {
	.newYearWrap {padding:6rem 2rem 10rem;}
	.newYearWrap:before {border-width:10rem;}
	.newYearWrap .newYearHead h4 {font-size:4rem;}
	.newYearWrap .newYearHead .slogan {font-size:1.8rem;}
	.newYearWrap .newYearCont p {word-break:break-all;}
	.newYearWrap .newYearCont p.big {font-size:2rem;}
	.newYearWrap .newYearCont .tit-con h5 {font-size:2rem;}
}



/*********************************************
	걸어온길
*********************************************/

.historyWrap {position:relative;}
.historyWrap .visual {display:flex; flex-direction:column; justify-content:end; position:relative; height:52.6rem; margin-top:-6rem; z-index:0; overflow:hidden; border-radius:2rem; color:#fff; margin-bottom:7rem;}
.historyWrap .visual .vis {position:absolute; bottom:0; right:0; width:64rem; z-index:1; background:url(../img/contents/01/img_0104_vis.png) no-repeat 100% 100% / contain;}
.historyWrap .visual .vis:before {content:""; display:block; padding-top:calc(526 / 640 * 100%);}
.historyWrap .visual .sign {position:absolute; bottom:0; right:0; width:28.3rem; height:18.5rem; padding:6.8rem 0 0 9rem; overflow:hidden; z-index:2;}
.historyWrap .visual .sign:before {content:""; display:block; position:absolute; top:0; left:0; width:34.6rem; height:34.6rem; border-radius:100%; background:#FF4A57; z-index:-1;}
.historyWrap .visual .sign > * {display:block;}
.historyWrap .visual .sign strong {font-size:1rem; width:14.5em; height:3.9em; text-indent:-999px; margin-top:1.5em; overflow:hidden; background:url(../img/contents/01/img_0104_sign.png) no-repeat 0 50% / contain;}
.historyWrap .visual .profileArea {position:relative; border-radius:2rem; background:#121628; padding:7.5rem 60rem 6.4rem 10.8rem;}
.historyWrap .visual .text h4 {margin:0 0 4.5rem 0; padding:0; font-size:1rem;}
.historyWrap .visual .text h4:before {display:none;}
.historyWrap .visual .text h4 strong {display:block; width:27.5em; height:7.6em; text-indent:-999px; overflow:hidden; background:url(../img/contents/01/img_0104.svg) no-repeat 0 -13em / 38em auto;}
.historyWrap .visual .text h4 strong + strong {width:34em; height:6.6em; background-position-y:-5em; margin:1em 0 0 12em;}
.historyWrap .visual .text .profile {display:flex; flex-wrap:wrap; margin-top:-1rem;}
.historyWrap .visual .text .profile > li {display:flex; align-items:center; width:50%; margin-top:1rem;}
.historyWrap .visual .text .profile > li:before {content:""; display:block; width:2px; height:1.8rem; background:#fff; margin-right:1.4rem;}
.historyWrap .visual .text .profile > li strong {display:block; font-weight:700; width:4em; margin-right:2rem; flex-shrink:0;}
.historyWrap .visual .text .profile > li span {display:block; flex-grow:1; white-space:nowrap;}

@media all and (max-width:1024px) {
	.historyWrap .visual {height:auto; margin-top:0;}
	.historyWrap .visual .vis {width:40rem; right:-5rem;}
	.historyWrap .visual .sign {width:20rem; height:15rem; padding:5rem 0 0 6rem;}
	.historyWrap .visual .sign:before {width:25rem; height:25rem;}
	.historyWrap .visual .sign strong {font-size:.8rem;}
	
	.historyWrap .visual .profileArea {padding:5rem 5rem 4rem; padding-right:30rem;}
	.historyWrap .visual .text h4 {font-size:.8rem;}
	.historyWrap .visual .text .profile > li {width:55%;}
	.historyWrap .visual .text .profile > li:nth-child(2n) {width:45%;}
}
@media all and (max-width:820px) {
	.historyWrap .visual .text h4 {font-size:.7rem;}
	.historyWrap .visual .text h4 strong + strong {margin-left:10em;}
	.historyWrap .visual .text .profile {margin-top:0;}
	.historyWrap .visual .text .profile > li {width:100% !important; margin-top:0;}
	.historyWrap .visual .text .profile > li + li {margin-top:1rem;}	
}
@media all and (max-width:600px) {
	.historyWrap .visual .vis {width:40rem; right:-10rem;}
	.historyWrap .visual .sign {width:18rem; height:13rem; padding:4rem 0 0 4rem;}
	.historyWrap .visual .sign:before {width:20rem; height:20rem;}
	.historyWrap .visual .sign strong {font-size:.8rem;}
	.historyWrap .visual .text h4 strong + strong {margin-left:2em;}
	.historyWrap .visual .profileArea {padding-right:23rem;}
}
@media all and (max-width:530px) {
	.historyWrap .visual {margin-top:-6rem; padding-top:15rem;}
	.historyWrap .visual .vis,
	.historyWrap .visual .sign {bottom:calc(21rem + 1px);}
	
	.historyWrap .visual .profileArea {padding:0;}
	.historyWrap .visual .text h4 {padding:4rem 5rem; margin-bottom:0; font-size:.6rem;}
	.historyWrap .visual .text h4 strong + strong {margin-left:0;}
	.historyWrap .visual .text .profile {padding:4rem 5rem; border-top:1px solid rgba(255,255,255,.1);}
}
@media all and (max-width:500px) {
	.historyWrap .visual {display:flex; align-items:end; flex-direction:column; padding-top:0;}
	.historyWrap .visual .vis {position:relative; right:auto; bottom:auto; margin-right:-10rem; z-index:0;}
	.historyWrap .visual .sign {display:flex; flex-direction:column; justify-content:center; align-items:end; right:0; left:0rem; top:20rem; bottom:auto; padding:0 28rem 2rem 0; width:auto; height:15rem; z-index:-1; overflow:visible;}
	.historyWrap .visual .sign:before {width:30rem; height:30rem; top:-3rem; left:auto; right:16rem;}
	.historyWrap .visual .profileArea {z-index:1;}
	.historyWrap .visual .text h4  {display:flex; flex-direction:column; align-items:center;}
}
@media all and (max-width:450px) {
	.historyWrap .visual .vis {width:30rem; margin-right:-8rem;}
	.historyWrap .visual .sign {align-items:end; justify-content:center; width:20rem; left:auto; right:15rem; height:20rem; padding-right:5rem; padding-bottom:4rem; padding-left:0; top:10rem; border-radius:100%; background:#FF4A57;}
	.historyWrap .visual .sign:before {display:none;}
	.historyWrap .visual .text h4,
	.historyWrap .visual .text .profile {padding:3rem 4rem;}
	.historyWrap .visual .text h4 {font-size:.5rem;}
}
@media all and (max-width:390px) {
	.historyWrap .visual .sign {right:12rem; top:10rem; padding-right:8rem;}
	.historyWrap .visual .sign strong {font-size:.6rem;}
}

.historyWrap .info {display:flex; margin:-.6rem;}
.historyWrap .info .item {display:flex; flex-direction:column; padding:.6rem; width:calc(100% / 3);}
.historyWrap .info .item h5 {display:flex; align-items:center; font-size:3rem; color:#17212D; margin:0 0 2.2rem; flex-shrink:0;}
.historyWrap .info .item h5 .ico {display:block; position:relative; font-size:1rem; width:4em; height:4em; margin-right:1.5em; border-radius:.5rem; background:#003365 url(../img/contents/01/img_0104.svg) no-repeat 0 0 / 38em auto;}
.historyWrap .info .item h5 .ico.ty1 {background-position-x:0;}
.historyWrap .info .item h5 .ico.ty2 {background-position-x:-5em;}
.historyWrap .info .item h5 .ico.ty3 {background-position-x:-10em;;}
.historyWrap .info .item .list-ul {display:block; border:.3rem solid #E2E7EF; padding:4rem; flex-grow:1;}
.historyWrap .info .item .list-ul li {word-break:keep-all;}

@media all and (max-width:940px) {
	.historyWrap .info {flex-direction:column; margin:-2rem 0;}
	.historyWrap .info .item {padding:2rem 0; width:100%;}
}
@media all and (max-width:480px) {
	.historyWrap .info .item h5 {font-size:2.5rem;}
	.historyWrap .info .item h5 .ico {font-size:.8rem;}
}
@media all and (max-width:440px) {
	.historyWrap .info .item .list-ul {padding:2rem;}
}