@charset "UTF-8";
@import url(../font/tw_air/tw_air.css); 


/************************************
	Section 01
************************************/

#section1 {padding-left:1em; padding-right:1em;}
#section1 .left {display:block; position:relative; margin-right:25.7em;}
#section1 .right {display:block; position:absolute; top:0; right:0; width:29.2em;}

@media all and (max-width:1024px) {
	#section1 .left {margin-right:0;}
	#section1 .right {position:relative; width:auto;}
}


.mainSection1 {display:block; position:relative; /*height:610px;*/}
.mainSection1:before {content:''; display:block; position:absolute; top:0; left:0; width:100%; height:520px; background:#dae0ff url(../img/main/main_background.jpg) no-repeat;}
.mainSection1:after {content:''; display:block; position:absolute;  top:-150px; right:0; width:514px; height:546px; background: url(../img/main/img_deco01.png) no-repeat; transform:rotate(45deg);}

@media all and (max-width:1024px) {
	.mainSection1:before {height:830px; background-size:auto;}
	.mainSection1:after {display:none;}
}

@media all and (max-width:640px) {
	.mainSection1:before {height:750px;}
}
@media all and (max-width:480px) {
	.mainSection1:before {height:680px;}
}
@media all and (max-width:360px) {
	.mainSection1:before {height:636px;}
}

/* Main Visual */
.mainVisual {display:block; position:relative; min-height:30.5em; z-index:0;}
.mainVisual:before {content:""; display:block; position:absolute; top:3.5em; bottom:0px; right:0; left:-5000px; border-radius:0 1.2em 1.2em 0; background:#fff url(../img/main/img_mainVisual01.jpg) no-repeat 100% 100%; background-size:contain;}
.mainVisual:after {content:""; display:block; position:absolute; bottom:0; right:0; width:518px; height:528px; background: url(../img/main/img_mainVisual02.png) no-repeat;}

.mainVisual .title {position:absolute; top:6.5em; bottom:0; left:0; width:100%; padding-right:5em; padding-bottom:5em; z-index:10;}
.mainVisual .title p {display:block; position:absolute; left:0; right:1em; top:6em; color:#333;}
.mainVisual .title span {display:block; position:relative; font-size:1.2em; font-weight:400; line-height:1.6em;}
.mainVisual .title span em {display:block;}
.mainVisual .title span.stle {display:block; position:relative; margin-top:.2em; font-family:'tw_a'; font-size:3.3em; line-height:1.5em; color:#3235A8;}


@media all and (max-width:1024px) {
	.mainVisual {min-height:20em;}
	.mainVisual:before {border-radius:0; right:-100px; left:-100px; top:0; background-size:cover;}
	.mainVisual:after {width:400px; height:350px; background-size:100%; right:-30px;}
	.mainVisual .title {left:0; right:0; width:auto; top:3.5em;}
	.mainVisual .title p {top:2em;}
	.mainVisual .title span {font-size:1.0em;}
	.mainVisual .title span.stle em {display:inline-block;}
}

@media all and (max-width:800px) {
	.mainVisual .title p {position: static;}
	.mainVisual .title span.stle {font-size:2.3em;}
	.mainVisual .title span.stle em {font-size:1.0em;}
	.mainVisual:after {right:-30px; width:350px; height:300px; background-size:100%;}
}

@media all and (max-width:640px) {
	.mainVisual {min-height:18em;}	
	.mainVisual .title {top:1.5em; padding-right:7em;}
	.mainVisual .title span {font-size:.9em;}
	.mainVisual .title span.stle {margin-top:.4em; font-size:1.8em; line-height:1.2em;}
	.mainVisual .title span em {display:inline;}
}

@media all and (max-width:480px) {
	.mainVisual {min-height:16em;}
	.mainVisual .title {top:1.1em; padding-right:3em;}
	.mainVisual:after {right:-40px; width:250px; height:200px;}
}


/* 메인 팝업 */
.mainPopup {position:relative; width:23.1em; border-radius:1em; border:1px solid #E6E6E6; background-color:#fff; z-index:30;}
.mainPopup .slider {display:block; position:relative; border-radius:1em 1em 0 0; overflow:hidden; min-height:15em; margin-bottom:4.1em;}
.mainPopup .swiper-slide > a {display:block; position:relative; overflow:hidden; background:#f6f6f8;}
.mainPopup .swiper-slide > a:after {content:""; display:block; position:relative; padding-top:65.5%;}
.mainPopup .swiper-slide > a img {display:block; position:absolute; top:0; left:0; width:100%; height:100%; margin-right:10px;}
.mainPopup .control {display:block; position:absolute; bottom:1em; right:.75em;}
.mainPopup .control > * {display:block; float:left; width:auto;}
.mainPopup .control button + button {margin-left:.3em;}
.mainPopup .control button {width:1.5em; height:1.5em; overflow:hidden; text-indent:-999px; background:url(../img/main/spr_slider.svg) no-repeat 0 0; background-size:auto 1.5em;}
.mainPopup .control button.prev {background-position:-.7em 50%;}
.mainPopup .control button.next {background-position:-6.7em 50%;}
.mainPopup .control button.stop {background-position:-2.7em 50%;}
.mainPopup .control button.play {display:none; background-position:-4.7em 50%;}
.mainPopup .control .pager {text-indent:-999px; overflow:hidden; margin-right:.7em;}
.mainPopup .control .pager > * {display:block; position:relative; text-indent:0; float:left; font-size:.8em; opacity:.8; font-weight:400; line-height:1.875em;}
.mainPopup .control .pager .swiper-pagination-current {opacity:1;}
.mainPopup .control .pager .swiper-pagination-total {padding-left:1.1875em;}
.mainPopup .control .pager .swiper-pagination-total:before {content:""; display:block; position:absolute; top:0; bottom:0; left:.5em; width:.25em; background:url(../img/main/spr_slider.svg) no-repeat 0 50%; background-size:auto 1.5em; }

@media all and (min-width:1025px) {
	.mainPopup {position:absolute; top:3.5em; right:0;}
}

@media all and (max-width:1024px) {
	.mainPopup {margin:2em auto;}
	.mainPopup .slider {min-height:0; border-radius:1em 1em 0 0;}
	.mainPopup .swiper-slide {width:23.1em; max-width:100%;}
}


@media all and (max-width:480px) {
	.mainPopup {width:auto;}
}


/************************************
	Section02
************************************/

#section2 {padding:80px 2em 0;}
#section2 .inner > .left {position:relative;}
#section2 .inner > .right {position:absolute; top:80px; right:0; width:23em;}
#section2 .inner > .inner:before {content:""; display:block; position:absolute; top:-11.7em; left:50%; bottom:0; min-width:1400px; width:100vw; background:linear-gradient(97deg, #FFE9E2 0%, #FFF7DB 54.07%, #DBF5E5 100%); z-index:-1; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
#section2 .inner > .inner + .inner {margin-top:1.2em;}
#section2 .inner > .inner + .inner:before {display:none;}
#section2 .inner > .inner + .inner > .right {position:relative; left:47em;}

@media all and (max-width:1024px) {
	#section2 {padding:80px 1em 0;}
	#section2 .inner > .right {position:relative; width:auto; top:30px;}
}
@media all and (max-width:1024px) {
}
@media all and (max-width:640px) {
}


.mainSection2 {display:block; position:relative;}

/* Main Board */
.mainBoard {position:relative;}
.mainBoard .tab-group {position:relative;}
.mainBoard .tabs {overflow:hidden; margin-bottom:1.5em;}
.mainBoard .tabs span {display:block; height:1.5em; font-family: 'tw_a'; font-size:1.4em; color:#2a3c87;}

.mainBoard .list {display:block; position:relative; margin:-.5em;}
.mainBoard .list:after {content:""; display:block; clear:both;}
.mainBoard .list li {width:33.3333%; padding:1em; float:left;}
.mainBoard .list .item {display:block; position:relative; height:14.5em; z-index:0; padding:2em;}
.mainBoard .list .item > a {display:block; position:absolute !important; top:0; left:0; right:0; bottom:0; z-index:1; border-radius:1em 1em 1em 1em; border:1px solid #ccc; text-indent:-999px; overflow:hidden;}
.mainBoard .list .item > a:hover,
.mainBoard .list .item > a:focus {border:1px solid #3135a8;}
.mainBoard .list .item .subj,
.mainBoard .list .item .txt {display:block; position:relative; line-height:1.4em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;}
.mainBoard .list .item .division {position:relative; padding:0 0 5px;}
.mainBoard .list .item .division span {position:relative; font-size:1.0em; letter-spacing:-1px; line-height:1.2em; font-weight:600; color:#2a3c87; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainBoard .list .item .division span:after {content:""; display:block; position:absolute; top:1.3em; left:0; width:100%; height:1px; background-color:#2a3c87;}
.mainBoard .list .item .subj {display:block; margin-top:.7em; font-size:1.3em; font-weight:600; letter-spacing:-1px; line-height:1.2em; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainBoard .list .item .txt {margin-top:1.3em; height:4.3em; font-size:.9em; font-weight:400; color:#333;}
.mainBoard .list .item .date {text-align:right; padding-top:1.06em;}
.mainBoard .list .item .date span {position:relative; display:inline-block; padding-left:25px; font-size:.9em; color:#777; font-weight:400;}
.mainBoard .list .item .date span:before {content:''; display:block; position:absolute; top:2px; left:0; width:18px; height:19px; background:url(../img/main/icondate.svg) no-repeat; background-size:1em auto;}
.mainBoard .more {display:block; position:absolute; top:-10px; right:0; width:3em; height:3em; background:url(../img/main/btn_more.svg) no-repeat 50% 50% #fff; /*background-size:0.8em auto;*/ border:1px solid #ccc; border-radius:100%; text-indent:-999px; overflow:hidden;}

@media all and (max-width:1024px) {
	.mainBoard {margin-right:0;}
}
@media all and (max-width:768px) {
	.mainBoard .list li {width:100%;}
}


/************************************
	Section03
************************************/
#section3 {padding:80px 2em 0;}
.mainSection3 {display:block;}
.mainPhoto {position:relative; }
.mainPhoto .tab-group {position:relative;}
.mainPhoto .tabs {overflow:hidden; margin-bottom:1.5em;}
.mainPhoto .tabs span {display:block; height:1.5em; font-family: 'tw_a'; font-size:1.4em; color:#2a3c87;}

.mainPhoto .list {display:block; position:relative; margin:-.5em;}
.mainPhoto .list:after {content:""; display:block; clear:both;}
.mainPhoto .list li {width:33.3333%; padding:1em; float:left;}
.mainPhoto .list .item {display:block; position:relative; z-index:0;}
.mainPhoto .list .item > a {overflow:hidden; display:block; position:absolute !important; top:0; left:0; right:0; bottom:0; z-index:1; border-radius:1em 1em 1em 1em; text-indent:-9999px;}
/*.mainPhoto .list .item > a:hover,
.mainPhoto .list .item > a:focus {border:1px solid #3135a8;}*/
.mainPhoto .list .item .subj,
.mainPhoto .list .item .txt {display:block; position:relative; line-height:1.4em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;}
/*
.mainPhoto .list .item .division {position:relative; padding:0 0 5px;}
.mainPhoto .list .item .division span {position:relative; font-size:1.0em; letter-spacing:-1px; line-height:1.2em; font-weight:600; color:#3135a8; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainPhoto .list .item .division span:after {content:""; display:block; position:absolute; top:1.3em; left:0; width:100%; height:1px; background-color:#3135a8;}
*/
.mainPhoto .list .item .img {overflow:hidden; height:14.5em; border:1px solid #ccc; border-radius:20px;}
.mainPhoto .list .item .img span {display:block;}
.mainPhoto .list .item .img span img {width:100%; height:14.5em;}

.mainPhoto .list .item .subj {display:block; margin-top:.7em; font-size:1.3em; font-weight:600; letter-spacing:-1px; line-height:1.2em; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mainPhoto .list .item .date {text-align:left; padding-top:0.8em;}
.mainPhoto .list .item .date span {position:relative; display:inline-block; padding-left:25px; font-size:.9em; color:#777; font-weight:400;}
.mainPhoto .list .item .date span:before {content:''; display:block; position:absolute; top:2px; left:0; width:17px; height:18px; background:url(../img/main/icondate.svg) no-repeat; background-size:1em auto;}
.mainPhoto .more {display:block; position:absolute; top:-10px; right:0; width:3em; height:3em; background:url(../img/main/btn_more.svg) no-repeat 50% 50% #fff; /*background-size:0.8em auto;*/ border:1px solid #ccc; border-radius:100%; text-indent:-999px; overflow:hidden;}

@media all and (max-width:1024px) {
	#section3 {padding:50px 1em 0;}
	.mainPhoto {margin-right:0;}
	.mainPhoto .list .item .img {height:11.5em;}
	.mainPhoto .list .item .img span img {height:11.5em;}
}
@media all and (max-width:768px) {
	#section3 {padding:50px 2em 0;}
	.mainPhoto .list li {width:100%; padding:0 0 1em;}
	.mainPhoto .list .item .img {height:20.5em;}
	.mainPhoto .list .item .img span img {height:20.5em;}
}
@media all and (max-width:480px) {
	.mainPhoto .list .item .img {height:16.5em;}
	.mainPhoto .list .item .img span img {height:16.5em;}
}
@media all and (max-width:380px) {
	.mainPhoto .list .item .img {height:14.5em;}
	.mainPhoto .list .item .img span img {height:14.5em;}
}





/************************************
	Section04
************************************/

#section4 {position:relative; padding-left:2em; padding-right:2em;}
.mainSection4 {display:block; padding:80px 0;}
.main_icon .list {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch;}
.main_icon li {padding:0 1em; width:16.6666%; text-align:center;}
.main_icon li a {display:block;}

.main_icon li a i {position:relative; display:block; margin:0 auto 20px; width:140px; height:140px; background-color:#f5f5f5; border-radius:50px; transition:.3s all; -webkit-transition:.3s all;}
.main_icon li a i:before {content:''; position:absolute; left:0; top:0; width:140px; height:140px; background-position:center center; background-repeat:no-repeat; background-size:auto;}
.main_icon li a i.icon01:before {background-image:url(../img/main/quick_con01.png);}
.main_icon li a i.icon02:before {background-image:url(../img/main/quick_con02.png);}
.main_icon li a i.icon03:before {background-image:url(../img/main/quick_con03.png);}
.main_icon li a i.icon04:before {background-image:url(../img/main/quick_con04.png);}
.main_icon li a i.icon05:before {background-image:url(../img/main/quick_con05.png);}
.main_icon li a i.icon06:before {background-image:url(../img/main/quick_con06.png);}

.main_icon li a:focus i,
.main_icon li a:hover i,
.main_icon li a:active i {background-color:#D7D9F2; transform: translateY(-10%); -webkit-transform: translateY(-10%);}

.main_icon li a span {font-size:1.1em; font-weight:500;}


/* media query */
@media screen and (max-width:1024px){
	.mainSection4 {padding:0px 0 30px;}
	.main_icon {margin-top:30px;}
	.main_icon li {padding:1em; width:33.3333%;}
}

@media screen and (max-width:768px){
	.main_icon li a span {font-size:1em;}
}

@media screen and (max-width:640px){
	.main_icon li {width:50%;}
	
	.main_icon li a i {width:100px; height:100px; border-radius:30px;}
	.main_icon li a i:before {width:80px; height:80px; background-size:100%; top:50%; margin-top:-40px; left:50%; margin-left:-40px;}
}

@media screen and (max-width:480px){
	.main_icon {margin:1em -.5em -.5em;}
	.main_icon li {padding:.5em; word-break:keep-all;}
}