@charset "utf-8";

/*********************************
	Common Style
*********************************/

.mainSection {position:relative; padding-left:1em; padding-right:1em;}

.more {display:block; position:absolute; right:0; top:0; width:1.75em; height:1.75em; background:url(../img/main/btn_more.svg) no-repeat 0 0; background-size:contain; text-indent:-999px; border-radius:.25em; border:1px solid #DDDDDD; box-shadow:.2em .2em .5em 0 rgba(0,0,0,.05); overflow:hidden;}

.control button {width:1em;height:1em;background:url(../img/main/spr_control_on.svg) no-repeat 0 0;/* background-size:auto 1em; */text-indent:-999px;overflow:hidden;}
.control .prev {background-position: 0 100%;}
.control .next {background-position: -1.75em 100%;}
.control .stop {background-position: -3.5em 0;}
.control .play {display:none;background-position: -5.25em 0;}
.control .more,
.control .total {background-position: -7em 0;}
.control .prev.swiper-button-disabled {background-image:url(../img/main/spr_control.svg); background-repeat:no-repeat; opacity:.3; background-position: 0 0;}
.control .next.swiper-button-disabled {background-image:url(../img/main/spr_control.svg); background-repeat:no-repeat; opacity:.3; background-position: -1.75em 0;}

.control .pager {display:inline-block; width:auto; bottom:auto; white-space:nowrap; margin-right:1.5em;}
.control .pager > * {display:inline-block; vertical-align:middle; font-size:.9em; font-weight:600; font-family:'Montserrat';}
.control .pager i {width:.75em; font-size:1em; height:1px; background:#000; margin:0 .5em;}
.control .pager .swiper-pagination-current {color:#2C2A8B;}
.control button + button {margin-left:.75em;}


/****************************************************************
	Slider Common Style
****************************************************************/

.slider .swiper-slide {width:100%;}
.slider .swiper-slide > a {display:block;}
.slider .swiper-slide img {display:block; max-width:100%;}
.slider .swiper-slide img[src*="noimage"] {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important;}

.fix-scroll .swiper-container {display:block; position:relative;}
.fix-scroll .swiper-wrapper {display:block !important; transform:none !important; -webkit-transform:none !important; height:100% !important; overflow:auto; white-space:nowrap;}
.fix-scroll .swiper-wrapper li {display:inline-block !important; vertical-align:top; transform:none !important; -webkit-transform:none !important; opacity:1 !important;}
.fix-scroll .swiper-wrapper li a {display:block; position:relative;}
.fix-scroll .swiper-wrapper li a:focus:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; border:5px solid rgba(0,0,0,.5); z-index:2;}

.goto-control {display:block; position:absolute; width:100%; height:0; overflow:hidden; bottom:0; left:0; right:0; z-index:-1000; background:#2292e9; text-align:center; color:#fff !important; opacity:0; box-sizing:border-box;}
.goto-control:focus {z-index:9999; opacity:1; height:auto; padding:10px;}

/** 슬라이드 전체보기 팝업 */
body.pop-all-open {overflow:hidden;}

.popup-slide-view {display:none; position:fixed; top:0; left:0; right:0; bottom:0; z-index:999999; background:rgba(0,0,0,.8);}
.popup-slide-view .popup {position:absolute; top:3em; bottom:3em; width:78em; left:50%; margin-left:-39em;}
.popup-slide-view .popup .pop-title {display:block; position:relative; height: 4em; margin-right:14em; padding-left:5em;}
.popup-slide-view .popup .pop-title:after {content:''; display:block; position:absolute; top:0; left:0; background-position:0 0; width:6em; height:7em; background:url(../img/main/spr_visual.png) no-repeat 0 0; background-size:auto 21em; z-index:2; transition:.3s all; -webkit-transition:.3s all;}
.popup-slide-view .popup .pop-title em {display:inline-block; line-height:1.1em; margin-right:.55em; vertical-align:middle; font-size:1.3em; color:#fff; font-weight:600; height:1.8667em; border-radius:9em; padding:.4em .83em 0em 1.8em; background:url(../img/main/ico_popup_all_title.svg) no-repeat top 50% left .6667em #317CD6; background-size:.8em auto;}
.popup-slide-view .popup .pop-title span {display:inline-block; vertical-align:middle; color:#fff; font-size:1.2em; line-height:1.6em;}

.popup-slide-view .popup .list {background:#fff; height:calc(100% - 4em); border-radius:1em 0 1em 1em; padding:1.2em;}
.popup-slide-view .popup .list ul {display:block; position:relative; height:100%; padding:.5em; overflow:auto;}
.popup-slide-view .popup .list ul:after {content:""; display:block; clear:both;}
.popup-slide-view .popup .list li {display:block; float:left; padding:1em; width:33.33%; float:left;}
.popup-slide-view .popup .list li a {display:block; position:relative; overflow:hidden; border-radius:.5em; z-index:0; border:1px solid #dadada;}
.popup-slide-view .popup .list li a:before {content:""; display:block; position:relative; padding-top:55.748373%;}
.popup-slide-view .popup .list li img {display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1;}
.popup-slide-view .visual-goto {display:block; position:absolute; top:0; right:0; width:14em; height:5.4em; background:url(../img/main/btn_all_popup_close.svg) no-repeat 100% 50%; background-size:contain; overflow:hidden; text-indent:-999px; font-size:0.8em;}

.mainBoardWrap .popup {top:2em; bottom:2em;}
.mainBoardWrap .popup .list li {padding:.5em;}

@media all and (max-width:1600px) {
	.popup-slide-view .popup {left:1em; right:1em; width:auto; margin-left:0;}
}
@media all and (max-width:1400px) {
	.popup-slide-view .popup .list {padding:.7em;}
	.popup-slide-view .popup .list li {padding:.5em;}
}
@media all and (max-width:1024px) {
	.popup-slide-view .popup {top:0; bottom:0; left:0; right:0; height:auto; width:auto; margin:0;}
	
	.popup-slide-view .popup .pop-title {height:3em; margin-right:3.4em; padding-left:0;}
	.popup-slide-view .popup .pop-title:after {display:none;}
	.popup-slide-view .popup .pop-title p {display:table; width:100%; height:3em; table-layout:fixed;}
	.popup-slide-view .popup .pop-title p > * {display:table-cell; vertical-align:middle; position:relative; padding:0;}
	.popup-slide-view .popup .pop-title p em {padding:0 1em; background:#317CD6; width:4.5em; text-align:center; font-size:1.3em; border-radius:0 9em 9em 0;}
	.popup-slide-view .popup .pop-title p span {padding-left:1em; font-size:1.1em;}
	.popup-slide-view .visual-goto {height:3em; width:3.4em; background-size:auto 100%;}
	.popup-slide-view .popup .list {position:absolute; top:3em; left:0; right:0; bottom:0; height:auto; border-radius:0; padding:0;}
	.popup-slide-view .popup .list li {width:50%;}
}
@media all and (max-width:590px) {
	.popup-slide-view .popup .list li {width:auto; float:none;}
	.popup-slide-view .popup .pop-title p > * {font-size:1em;}
}


/****************************************************************
	Tab Style
****************************************************************/

.tab-group .tabs li button .selected {display:none; position:absolute; top:0; left:0; z-index:-999; overflow:hidden; width:0; height:0; opacity:0;}
.tab-group .tabs li button.on .selected {display:block;}
.tab-group .tab-con {display:none;}
.tab-group .tab-con.on {display:block;}


/*********************************
	Visual Style
*********************************/

/* 영상 종횡비에 따른 COVER 효과 적용 */
.mainMovie .frame {position:absolute; left:0; right:0; top:50%; min-width:100%; min-height:100%; transform:translateY(-50%); -webkit-transform:translateY(-50%); overflow:hidden;}
.mainMovie video {display:block; position:relative; width:100%; max-width:100%; min-height:100%; height:auto; z-index:1;}
.collopase-intro .mainMovie .mainimgWrap{width:auto;height:100%;}
@media screen and (max-aspect-ratio:1280/676) {
	.mainMovie .frame {top:0; bottom:0; left:50%; right:auto; transform:translateX(-50%); -webkit-transform:translateX(-50%);}
	.mainMovie video {max-width:none; min-width:100%; width:auto; height:100%;}
}
@media all and (max-width:1024px) {
	body.full-intro-viewer .frame {background:rgba(0,0,0,.9);}
	body.full-intro-viewer .mainMovie .frame {top:0 !important; left:0 !important; right:0 !important; bottom:0 !important; transform:none !important; -webkit-transform:none !important;}
	body.full-intro-viewer .mainMovie video { width:100% !important; height:100% !important;}
}


/* 영상 레이아웃 설정 */
@media all and (min-width:1920px) {
	.mainMovie .mainimgWrap img {width:100%;}	
}
@media all and (min-width:1025px) {
	.mainMovie {position:absolute; right:0; bottom:0; top:0; left:50%; margin-left:-12.7em; overflow:hidden; z-index:1; transition:.3s all; -webkit-transition:.3s all; background:#fff url(/common/img/common/logo.svg) no-repeat 50% 50%;}
	#wrap:not(.collopase-intro) .mainMovie {position:fixed; top:6.25em; left:0; right:0; bottom:0; margin:0 !important; z-index:8;}
	.mainMovie .mo-movie-control {display:none;}
	.mainMovie .mainimgWrap {background-position:top; position:absolute; bottom:0; left:0;}	
}
@media all and (max-width:1600px) and (min-width:1025px) {
	.mainMovie {margin-left:-10.7em;}
	#wrap:not(.collopase-intro) .mainMovie {margin-left:0;}
}
@media all and (max-width:1024px) {
	#headerWrap {background:#fff;}
	.mainMovie {position:absolute; bottom:6em; right:0; width:20em; height:20em; border-radius:100%; overflow:hidden; transition:.3s all; -webkit-transition:.3s all;}
	.mainMovie .mo-movie-control {position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; border:none; text-indent:-999px; overflow:hidden; background:url(../img/main/btn_visual_play.svg) no-repeat 50% 50%; background-size:4em auto;}
	.mainMovie .mainimgWrap img {width:auto; height:380px;}
	.mainMovie .mainimgWrap .titWrap {display:none;}
	body.full-intro-viewer {overflow:hidden;}
	body.full-intro-viewer .mainMovie .mo-movie-control {background-image:url(../img/main/btn_visual_stop.svg);}
	body.full-intro-viewer .mainMovie {position:fixed; top:0; right:0; border-radius:0; width:100% !important; height:100% !important; max-width:100% !important; z-index:5;}
}
@media all and (max-width:800px) {
	.mainMovie {width:15em; height:15em;}
}

@media all and (max-width:640px) {
	/*
	.mainMovie {width:40%; max-width:10em; height:auto; right:-2em; bottom:-2.5em; z-index:1;}
	.mainMovie:before {content:""; display:block; position:relative; padding-top:100%; z-index:-999;} */
	.mainMovie{width:45%; max-width:9em; height:40%; right:1em; bottom:-1.5em; z-index:1;}
	.mainMovie .mainimgWrap img{width:auto;height:180px;}
}

/* 타이틀 */
.visualTitle {display:block; position:relative; width:27em; padding:7em 0 6em; background:#fff;}
.visualTitle h2 {display:block; position:relative; max-width:21em;  margin-bottom:2em; transition:.3s all; -webkit-transition:.3s all;}
/* .visualTitle h2:after {content:""; display:block; position:absolute; bottom:1.4em; right:0; width:5.9em; height:5.9em; border-radius:100%; background:url(../img/main/spr_visual.png) no-repeat -12em 0; background-size:auto 21em;} */
.visualTitle h2 > * {display:block; position:relative; font-size:2.6em; font-weight:800; line-height:1.34em; color: #005cb9; white-space:nowrap;}
.visualTitle h2 em {font-size:0.8em; font-weight:600;}
.visualTitle h2 strong {/* text-indent:-999px; */overflow:hidden;/* font-size:1em; *//* height:5em; *//* background:url(../img/main/tit_visual_pohang.svg) no-repeat 0 50%; *//* background-size:contain; */color: #005cb9;}
.visualTitle .txt {display:block; position:relative; max-width:24em; transition:.3s all; -webkit-transition:.3s all;}
.visualTitle .txt > * {display:inline-block; position:relative; font-size:1em; line-height:1.6em;}
.visualTitle .txt > * + * {border-bottom:1px solid #000;}

@media all and (min-width:1025px) {
	#wrap:not(.collopase-intro) .visualTitle h2 {opacity:0; transform:translateX(-3em); -webkit-transform:translateX(-3em);}  
	#wrap:not(.collopase-intro) .visualTitle .txt {opacity:0; transform:translateX(-3em); -webkit-transform:translateX(-3em);}	
}
@media all and (max-width:1024px) {
	.visualTitle {padding-top:7.15em; font-size:.9em;}
	.visualTitle h2:after {display:none;}
}
@media all and (max-width:640px) {
	.visualTitle {width:auto;font-size:.8em;padding-top:5em;padding-bottom:3em;}
	.visualTitle h2 {max-width:100%; width:auto;}
	.visualTitle h2 strong {margin:0 auto; background-position:50% 50%; /*height:3.5em;*/}
	.visualTitle .txt {text-align:left; max-width:100%;}
	.visualTitle .txt * {display:block; width:50%;}
}


/* 장식요소 */
.mainVisualWrap .acc .obj {display:block; position:absolute; width:6em; height:7em; background:url(../img/main/spr_visual.png) no-repeat 0 0; background-size:auto 21em; z-index:2; transition:.3s all; -webkit-transition:.3s all;}
.mainVisualWrap .acc .obj.ty1 {top:7.8em; left:-7.85em; background-position:0 0;}
.mainVisualWrap .acc .obj.ty2 {bottom:5.1em; left:21.9em; background-position:-6em 0;}

@media all and (min-width:1025px) {
	#wrap:not(.collopase-intro) .mainVisualWrap .acc .obj {opacity:0; visibility:hidden;}
	#wrap:not(.collopase-intro) .mainVisualWrap .acc .obj.ty1 {left:-10em;}
	#wrap:not(.collopase-intro) .mainVisualWrap .acc .obj.ty2 {left:28em;}	
}
@media all and (max-width:1024px) {
	.mainVisualWrap .acc .obj.ty1 {left:auto; right:13em; top:auto; bottom:21em;}
	.mainVisualWrap .acc .obj.ty2 {left:auto; right:0; bottom:5em;}
}
@media all and (max-width:800px) {
	.mainVisualWrap .acc .obj {font-size:.8em;}
	.mainVisualWrap .acc .obj.ty1 {bottom:20em;}
}
@media all and (max-width:640px) {
	.mainVisualWrap .acc {display:none;}
	
}

/* 스크롤 가이드 */
.mainVisualWrap .scroll-guide {position:absolute; bottom:3em; right:3em; width:6.2em; height:6.2em; line-height:3.6em; z-index:9; background-image:linear-gradient(135deg, #1047da 9%,#6810a7 100%); border-radius:50%; border:8px solid #1b53eb;}
.mainVisualWrap .scroll-guide:before {content:""; display:block; position:absolute; width:.8em; height:1.7em; bottom:1em; left:50%; margin-left:-.4em; background:url(../img/main/spr_visual.png) no-repeat 0 -7.8em;background-size:auto 21em; animation:blink-effect 1s step-end infinite;}
.mainVisualWrap .scroll-guide span {display:block; position:relative; text-align:center; font-size:.85em; color:#fff; animation:blink-effect 1s step-end infinite;}

@keyframes blink-effect {50% {opacity: .6;}}

@media all and (min-width:1025px) {
	#wrap:not(.collopase-intro) .mainVisualWrap .scroll-guide {position:fixed;}
}
@media all and (max-width:1024px) {
	.mainVisualWrap .scroll-guide {display:none;}
}


/* 신년인사말 이미지 */
.mainimgWrap {width:100%;}
.mainimgWrap .titWrap {position:absolute; top:50%; left:50%; margin-top:-120px; transform:translateX(-50%);}
.collopase-intro  .mainimgWrap .titWrap {margin-top:-180px; }
.mainimgWrap .titWrap a {display:block; max-width:10em; position:relative; padding:.8em 1.5em; margin:2em auto; border-radius:9em; background:#fff;}
.mainimgWrap .titWrap a span {display:block; text-align:center; color:#7a2901; font-weight:600;}
.mainimgWrap .titWrap a:hover {background:#7a2901;}
.mainimgWrap .titWrap a:hover span {color:#fff;} 

@media all and (max-width:1440px) {
	.mainimgWrap .titWrap {margin-top:-50px;}
	.mainimgWrap .titWrap img {width:100%;}
}

/*********************************
	Intro : Search etc..
*********************************/

.mainIntroWrap {padding-top:4.5em;}
.mainIntroWrap:before {content:""; display:block; position:absolute; left:0; right:0; top:0; bottom:9.3em; background:url(../img/main/bak_intro.jpg) no-repeat 50% 0 #F8FAFC; background-size:cover; z-index:-1;}
.mainIntroWrap .inner {padding-bottom:1em;}
@media all and (max-width:1024px) {
	.mainIntroWrap {background:#F8FAFC;}
	.mainIntroWrap:before {display:none;}
}

.mainSimpleNotice {display:block; position:relative; max-width:33em; margin:0 auto .75em; padding:0 5em 0 2.4em; background:url(../img/main/ico_notice.svg) no-repeat 0 50%; background-size:1.5em auto; z-index:2;}
.mainSimpleNotice .control {position:absolute; top:50%; right:0; margin-top:-.5em; z-index:3;}
.mainSimpleNotice .control:before {content:""; display:block; position:absolute; top:.2em; bottom:.2em; left:50%; width:1px; background:#E4E4E4;}
.mainSimpleNotice .control .pager {margin-right:0;}
.mainSimpleNotice .control .next {margin-left:1.85em;}
.mainSimpleNotice .slider {height:1.55em;}
.mainSimpleNotice .slider > * {height:100%;}
.mainSimpleNotice .slider a {display:block; position:relative; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:.85em; color:#33383D; font-weight:600; line-height:1.8235em;}
.mainSimpleNotice.fix-scroll .slider {height:auto;}

.mainSearch {display:block; position:relative; max-width:37.7em; margin:0 auto 4em; z-index:2;}
.mainSearch .in {display:block; position:relative; margin-right:1.15em; background:linear-gradient(105deg, #46C4E6 24.34%, #0076C6 65.76%, #0061C2 89.81%); border-radius:1em; padding:.15em;}
.mainSearch .in .input {display:block; position:relative; border:none; border-radius:.85em; background:#fff; overflow:hidden; z-index:0;}
.mainSearch .in input[type="text"],
.mainSearch .in input[type="search"] {display:block; position:relative; width:100%; font-size:1.1em; height:3.227em; border:none; padding:0 1.27em; font-weight:400; font-family:'TTWanjudaedunsancheB'; border-radius:.7727em;}
.mainSearch .in input[type="text"]::placeholder,
.mainSearch .in input[type="search"]::placeholder {color:#8E8E8E;}
.mainSearch .in .btn-search {position:absolute; width:3.25em; height:3.25em; border-radius:100%; top:50%; right:0; margin:-1.625em -1.625em 0 0; z-index:1; background:url(../img/main/btn_main_search.svg) no-repeat 50% 50%; background-size:cover; text-indent:-999px; overflow:hidden; border:none;}
.mainSearch .recommend {display:block; position:relative; white-space:nowrap; padding:.75em 0; overflow:hidden; text-overflow:ellipsis; text-align:center;}
.mainSearch .recommend li {display:inline-block; position:relative; padding:.25em .75em; color:#333; background:#fff; border-radius:9em; box-shadow:0 0 1em 0 rgba(0,0,0,.05);}
.mainSearch .recommend li + li {margin-left:.75em;}
.mainSearch .recommend li a {font-size:.75em; line-height:1.4em;}
.mainSearch .recommend li a:before {content:"#";}


@media all and (max-width:1024px) {
	.mainSearch {margin-bottom:2em;}
}
@media all and (max-width:640px) {
	.mainSearch {font-size:.8em; margin-bottom:2em;}
}

.mainSee {width:19em;}
.mainSee a{position:relative; display:block; width:100%;}
.mainSee a img{max-width:100%;}

.mainSpacewalk {position:absolute; top:0; right:0; width:16em; margin:1em 0;}
.mainSpacewalk a {position:relative; display:block;}
.mainSpacewalk .in {background:url(../img/main/ico_spacewalk.svg) no-repeat right;}
.mainSpacewalk .in p {font-family:'TTWanjudaedunsancheB'; font-size:1.3em; margin-top:.3em;}
.mainSpacewalk .in span {font-weight:600; font-size:.95em; padding:1em 0; display:block;}
.mainSpacewalk .in span em {display:inline-block; width:.8em; height:.8em; background:#ddd; border-radius:50%; margin-right:.3em;}
.mainSpacewalk .in span[data-state="정상운영"] {color:#00A54B;}
.mainSpacewalk .in span[data-state="정상운영"] em {background:#00A54B;}
.mainSpacewalk .in span[data-state="점검중"] {color:#ff5703;}
.mainSpacewalk .in span[data-state="점검중"] em {background:#ff5703; border-radius:0;}
.mainSpacewalk .in span[data-state="운영중단"] {color:#FF0000;}
.mainSpacewalk .in span[data-state="운영중단"] em {background:#FF0000; height: .2em; border-radius:0; margin-bottom: .2em;}
.mainSpacewalk .in i{color:#858585; font-size:.8em;}

@media all and (max-width:1580px) and (min-width:1025px) {.mainSee {width:15em;}}
@media all and (max-width:1580px) and (min-width:1025px) {.mainSpacewalk {width:13.5em;}}
@media all and (min-width:1025px) {.mainState{position:absolute; top:0; right:0; left:0; z-index:1;}}
@media all and (max-width:1024px) {
	.mainState {position:relative;margin:0 0 2em;}
	.mainSpacewalk {left:20em; width:auto;}
}

@media all and (max-width:640px) {
	.mainSee{margin:0 auto; width:auto; text-align:center; }
	.mainSpacewalk {position:relative; left:auto; max-width:18em; margin:1em auto; }
}

.mainNews {position:absolute; left:0; bottom:0; width:46em;}
.mainNews .slider {position:relative; z-index:0; border-radius:0 5em 1em 1em; box-shadow:0 0 2em 0 rgba(52,64,94,.1); overflow:hidden; background:#fff;}
.mainNews .slider:before {content:""; display:block; position:relative; padding-top:55.8695652173913%; z-index:-1;}
.mainNews .slider .swiper-container {position:absolute; top:0; left:0; right:0; bottom:0;}
.mainNews .slider .swiper-slide a {display:block; position:relative; height:100%;}
.mainNews .slider .swiper-slide img {width:100%;}

@media all and (min-width:641px) {
	.mainNews .control {display:block; position:absolute; top:0; left:0; width:3.5em; padding:1.25em 0; text-align:center; margin-left:-3.5em; background:#fff; border-radius:.5em 0 0 .5em; box-shadow:0 0 2em 0 rgba(52,64,94,.1); z-index:5;}
	.mainNews .control .pager {display:block; margin:0 0 2em;}
	.mainNews .control .pager > * {display:block;}
	.mainNews .control .pager i {display:block; position:relative; font-size:1em; height:.75em; width:1px; margin:.5em auto; background:rgba(0,0,0,.2);}
	.mainNews .control button {display:block; margin:0 auto;}
	.mainNews .control button + button {margin-top:.75em;}
	.mainNews .control button.play {display:none;}	
	
}
@media all and (max-width:1750px) and (min-width:1025px) {
	.mainNews .control {margin-left:0; border-radius:0 0 .5em 0;}	
}
@media all and (max-width:1024px) {
	.mainNews {position:relative; width:auto; margin-left:3.5em; margin-bottom:3em;}
}
@media all and (max-width:640px) {
	.mainNews {margin-left:0;}
	.mainNews .control {background:#fff; border-radius:9em; text-align:center; padding:.5em 1em; margin-top:1em;}
	
}



@media all and (min-width:1025px) {.mainMayor,.mainMinwonLinks {margin-left:50.5em;}}
@media all and (max-width:1580px) and (min-width:1025px) {.mainMayor, .mainMinwonLinks {margin-left:48em;}}

.mainMayor {display:block; position:relative; border-radius:1.2em; overflow:hidden; line-height: 1.4;}
.mainMayor > div {padding:1.6em;background:url(../img/main/mayor_bg.png) no-repeat top left;background-size: cover;}
.mainMayor .tit {display:block;position:relative;word-break:keep-all;color:#fff;font-weight:700;margin-bottom:.5em;font-size: 1.6em;}
.mainMayor .tit em {color:#99F5FF;}
.mainMayor .call {position:relative;padding-left:.75em;color: #fff;}
.mainMayor .call:before {content:""; position:absolute; left:0; top:.35em; width:1px; height:2.4em; background:rgba(255, 255, 255, .5);}
.mainMayor .call span {font-size:.8em;}
.mainMayor .call p {font-size:1.2em; font-weight:700;}
.mainMayor > a {position:relative; display:block; padding:1em 1.6em; background:#005cb9; background: linear-gradient(90deg, #005CB9 0%, #009689 100%); color:#fff;}
.mainMayor > a:focus,
.mainMayor > a:hover {text-decoration:underline;}
.mainMayor > a:after {content:""; position:absolute; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); right:1.6em; width:1.6em; height:1.6em; background:url(../img/main/mayor_btn.svg) no-repeat center center; background-size:contain;}

@media all and (max-width:1024px) {
	.mainMayor {max-width:26em; margin:0 auto;}
}

/* .mainMayor:before {content:""; display:block; position:absolute; bottom:0; right:-1.9em; width:15.6em; height:19.2em; background:url(../img/main/img_mayor.png) no-repeat 50% 50%; background-size:contain;}
.mainMayor .tit {display:block; position:relative; width:16em;}
.mainMayor .tit > * {display:block; position:relative; word-break:keep-all;}
.mainMayor .tit > span {height:2em; background:url(../img/main/txt_mayor_slogan.png) no-repeat 0 50%; background-size:contain; text-indent:-999px; overflow:hidden;}
.mainMayor .tit > strong {font-size:1.6em; line-height:1.6em; font-weight:800; letter-spacing:-.03em; color:rgba(51,51,51,.6);}
.mainMayor .tit > strong em {color:#333;}
.mainMayor ul {display:block; position:relative; padding:2.5em 0 2.2em; max-width:12em;}
.mainMayor ul:before {content:""; display:block; position:absolute; top:3em; left:0; bottom:2.5em; width:.75em; background:url(../img/main/img_mayor_line.svg) no-repeat 50% 50%; background-size:100% auto;}
.mainMayor ul > li {display:block; position:relative;}
.mainMayor ul > li + li {margin-top:1em;}
.mainMayor ul > li a {display:block; position:relative; padding-left:1.75em;}
.mainMayor ul > li a:before {content:""; display:block; position:absolute; top:50%; left:0; margin-top:-.375em; width:.75em; height:.75em; box-sizing:border-box; border-radius:100%; border:.2em solid rgba(0,0,0,.3); background:#fff;}
.mainMayor ul > li a span {font-size:.9em;font-weight:600;color:#33383D;}
.mainMayor ul > li a:hover:before,
.mainMayor ul > li a:focus:before {border-color:rgba(0,92,185,1);}
.mainMayor ul > li a:hover span,
.mainMayor ul > li a:focus span {font-weight:600;}

@media all and (max-width:1510px) {
	.mainMayor:before {right:-4em;}
}
@media all and (max-width:1460px) {
	.mainMayor:before {font-size:.8em;}
	.mainMayor .tit > strong {font-size:1.5em;}
}
@media all and (max-width:1024px) {
	.mainMayor {max-width:22em; margin:0 auto;}
}
@media all and (max-width:420px) {
	.mainMayor {padding-bottom:3em;}
	.mainMayor:before {font-size:.7em;}
} */


.mainMinwonLinks {padding-top:2.1em; height:9.3em;}
.mainMinwonLinks:after {content:""; display:block; clear:both;}
.mainMinwonLinks > ul {display:block; position:relative; margin:0 -1.25em;}
.mainMinwonLinks li {display:block; position:relative; width:25%; float:left; padding:0 1.25em;}
.mainMinwonLinks li a {display:block; position:relative; white-space:nowrap; text-align:center; height:7.35em;}
.mainMinwonLinks li a strong {display:inline-block; position:relative; text-align:center; font-size:.9em; color:#33383D; line-height:1.6em;}
.mainMinwonLinks li .icon {display:block; position:relative; max-width:5em; margin:0 auto 1em; border-radius:1.5em; background:#F3F8FB no-repeat 50% 50%; background-size:2.05em auto; transition:.3s all; -webkit-transition:.3s all;}
.mainMinwonLinks li .icon:before {content:""; display:block; position:relative; padding-top:100%;}
.mainMinwonLinks li .icon.ty1 {background-image:url(../img/main/ico_minwon_01.svg);}
.mainMinwonLinks li .icon.ty2 {background-image:url(../img/main/ico_minwon_02.svg);}
.mainMinwonLinks li .icon.ty3 {background-image:url(../img/main/ico_minwon_03.svg);}
.mainMinwonLinks li .icon.ty4 {background-image:url(../img/main/ico_minwon_04.svg);}
.mainMinwonLinks li a:hover .icon,
.mainMinwonLinks li a:focus .icon {border-radius:100%;}
.mainMinwonLinks li a:hover strong,
.mainMinwonLinks li a:focus strong {font-weight:600; border-bottom:1px solid #000;}

@media all and (max-width:1560px) {
	.mainMinwonLinks > ul {margin:0 -.5em;}
	.mainMinwonLinks li {padding:0 .5em;}
}
@media all and (max-width:1024px) {
	.mainMinwonLinks {background:#fff; margin:0 -1em; height:auto; padding:1.5em 1em 0;}
	.mainMinwonLinks ul:after {content:""; display:block; clear:both;}
	.mainMinwonLinks li {padding:0 .5em;}
}
@media all and (max-width:640px) {
	.mainMinwonLinks li .icon {background-size:1.5em auto;}
	.mainMinwonLinks li a strong {font-size:.9em;}
}


/*********************************
	Board
*********************************/

.mainBoardWrap {padding-top:5em; padding-bottom:7em;}
@media all and (min-width:1025px) {
	.mainBoardWrap .wrapLeft {position:absolute; top:0; bottom:0; left:0; width:28.75em;}
	.mainBoardWrap .wrapLeft:after {content:""; display:block; position:absolute; top:0; bottom:0; left:31.7em; width:1px; background:#E6E6E8;}
	.mainBoardWrap .wrapRight {margin-left:34.5em;}
}
@media all and (max-width:1024px) {
	.mainBoardWrap {padding-top:3em; padding-bottom:3em;}
	.mainBoardWrap .wrapLeft,
	.mainBoardWrap .wrapRight {position:relative;}
	.mainBoardWrap .wrapLeft {margin:2em 0 4em;}
}

.mainBoardWrap .tabs {display:block; position:relative; margin-bottom:1.4em; margin-right:2.2em;}
.mainBoardWrap .tabs:after {content:""; display:block; clear:both;}
.mainBoardWrap .tabs li {display:block; position:relative; float:left;}
.mainBoardWrap .tabs li button {display:block; position:relative; height:1.5em;}
.mainBoardWrap .tabs li button strong {color:#666666; font-weight:600; font-size:1em;}
.mainBoardWrap .tabs li + li {padding-left:1.75em;}
.mainBoardWrap .tabs li + li:before {content:""; display:block; position:absolute; width:.25em; height:.25em; border-radius:100%; background:#D9D9D9; left:.75em; top:50%; margin-top:-.125em;}
.mainBoardWrap .tabs li button.on {padding-left:1.85em;}
.mainBoardWrap .tabs li button.on strong {color:#005CB9; font-weight:600;}
.mainBoardWrap .tabs li button.on:before {content:""; display:block; position:absolute; left:0; top:50%; width:1.35em; height:1.35em; background:url(../img/main/spr_sns.png) no-repeat 0 50%; background-size:auto 1.35em; margin-top:-.675em;}
.mainBoardWrap .tabs li button[data-tab="페이스북"].on:before {background-position:-1.85em 50%;}
.mainBoardWrap .tabs li button[data-tab="페이스북"].on strong {color:#345FC7;}
.mainBoardWrap .tabs li button[data-tab="인스타그램"].on:before {background-position:-3.7em 50%;}
.mainBoardWrap .tabs li button[data-tab="인스타그램"].on strong {color:#DE0066;}
.mainBoardWrap .tabs li button[data-tab="블로그"].on:before {background-position:-7.4em 50%;}
.mainBoardWrap .tabs li button[data-tab="블로그"].on strong {color:#28a540;}
.mainBoardWrap .tabs li button[data-tab="트위터"].on:before {background-position:-5.55em 50%;}
.mainBoardWrap .tabs li button[data-tab="트위터"].on strong {color:#000;}
.mainBoardWrap .tabs li button[data-tab="트위터"].on:before {background-position:-5.55em 50%;}
.mainBoardWrap .tabs li button[data-tab="트위터"].on strong {color:#000;}
.mainBoardWrap .tabs li button[data-tab="유튜브"].on:before {background-position:-9.25em 50%;}
.mainBoardWrap .tabs li button[data-tab="유튜브"].on strong {color:#f00;}

@media all and (max-width:1460px) and (min-width:1025px) {
	.mainBoardWrap .tabs {font-size:.9em;}	
}
@media all and (max-width:760px) {
	.mainBoardWrap .tabs {margin-right:0;}
	.mainBoardWrap .tabs li {width:33.33%; padding:.2em !important;}
	.mainBoardWrap .tabs li + li {padding-left:0;}
	.mainBoardWrap .tabs li + li:before {display:none;}
	.mainBoardWrap .tabs li button {width:100%; text-align:center; padding-left:0 !important; border:1px solid #ddd; border-radius:1em; height:3em; font-size:.8em;}
	.mainBoardWrap .tabs li button.on:before {position:relative; display:inline-block; vertical-align:middle; top:auto; margin-top:0; margin-right:.3em;}
	
	.mainBoardWrap .more {position:relative; width:auto; background-size:auto 1.75em; background-position:50% 50%; margin-top:1.5em; height:2em;}
}

.mainPopup {position:relative; margin-bottom:2.2em;}
.mainPopup .tit {display:block; position:relative; margin-bottom:.8em;}
.mainPopup .tit strong {font-size:1.5em; line-height:1.2em; font-family:'TTWanjudaedunsancheB';}
.mainPopup .control {position:absolute; top:.15em; right:0;}
.mainPopup .slider {position:relative; min-height:14.5em; border-radius:1em; border:1px solid #EBEBEB; overflow:hidden; margin:-1px;}
.mainPopup .slider .swiper-slide > * {display:block; position:relative; overflow:hidden;}
.mainPopup .slider .swiper-slide > *:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:1;}
.mainPopup .slider .swiper-slide > *:after {content:""; display:block; position:relative; padding-top:50.4347826%; z-index:-1;}
.mainPopup .slider .swiper-slide > * img {display:block; position:absolute; top:0; height:100%; left:0; width:100%;}
.mainPopup .slider .swiper-slide > * img[src*="noimage"] {height:auto !important; width:auto !important; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}

@media all and (max-width:1024px) {
	.mainPopup {margin:0; width:30em;}
	.mainPopup .slider {min-height:15em;}
}
@media all and (max-width:880px) {
	.mainPopup {margin:0; width:24em;}
	.mainPopup .slider {min-height:12em;}
}
@media all and (max-width:740px) {
	.mainPopup {margin:0; width:auto;}
	.mainPopup .slider {min-height:0;}
}

.mainNewsLetter {position:relative; padding:1.5em 2em 2em; border-radius:1em; background:url(../img/main/bak_newsletter.jpg) no-repeat 100% 100% #F8FAFC; background-size:cover;}
.mainNewsLetter .thumb {display:block; position:absolute; width:10em; top:1.5em; right:2em; border-radius:.5em; border:.25em solid #fff; overflow:hidden; box-shadow:1em 1em 1.5em 0 rgba(69,70,131,.10);}
.mainNewsLetter .thumb img {width:100%;}
.mainNewsLetter .tit,
.mainNewsLetter .links {display:block; position:Relative; width:9em; text-align:center;}
.mainNewsLetter .tit {padding-top:.5em;}
.mainNewsLetter .tit span {display:block; position:relative; text-indent:-999px; margin-bottom:.6em; overflow:hidden; height:.8em; background:url(../img/main/tit_newsletter.svg) no-repeat 50% 50%; background-size:auto 100%;}
.mainNewsLetter .tit strong {display:block; position:relative; color:#222; font-size:1.5em; font-family:'TTWanjudaedunsancheB';}
.mainNewsLetter .links {display:block; position:relative; padding-top:.5em;}
/* .mainNewsLetter .links:before {content:""; display:block; position:absolute; top:.5em; width:1px; left:50%; height:.75em; background:#000; opacity:.2;} */
.mainNewsLetter .subj {display:block; position:relative; font-size:.9em; color:#666; line-height:1.556em;}
.mainNewsLetter .links ul {display:block; position:relative; padding-top:1em;}
.mainNewsLetter .links li + li {margin-top:.5em;}
.mainNewsLetter .links a {display:block; position:relative; padding:.55em 1.3em; border-radius:9em; background:no-repeat top 50% right 1.1em #005CB9; background-size:1em auto; transition:.3s background; -webkit-transition:.3s background;}
.mainNewsLetter .links a span {display:block; text-align:left; font-size:.9em; color:#fff;}
.mainNewsLetter .links a.down {background-image:url(../img/main/ico_link_down.svg);}
.mainNewsLetter .links a.app {background-image:url(../img/main/ico_link_app.svg);}
.mainNewsLetter .links a:hover,
.mainNewsLetter .links a:focus {background-color:#003a75;}

@media all and (max-width:1024px) and (min-width:741px) {
	.mainNewsLetter {position:absolute; top:0; right:0; left:32em; bottom:0;}
	.mainNewsLetter .thumb {display:none;}
	.mainNewsLetter .tit,
	.mainNewsLetter .links {width:auto;}
}
@media all and (max-width:880px) and (min-width:741px) {
	.mainNewsLetter {left:25em;}
	.mainNewsLetter .links ul {padding-top:.8em;}
}
@media all and (max-width:740px) {
	.mainNewsLetter {margin:2em -1em; border-radius:0; overflow:hidden;}
	.mainNewsLetter .thumb {right:1em;}
}
@media all and (max-width:460px) {
	.mainNewsLetter .thumb {width:8em;}
}
@media all and (max-width:390px) {
	.mainNewsLetter .thumb {display:none;}
	.mainNewsLetter .tit,
	.mainNewsLetter .links {width:auto;}
	.mainNewsLetter .links li {margin:0 !important; padding:.2em; width:50%; float:left;}
	.mainNewsLetter .links li a {padding:.55em 1em;}
	.mainNewsLetter .links a {background-position:top 50% right .7em;}
}


.mainBoard {display:block; position:relative; margin-bottom:2.5em;}
.mainBoard .list {display:block; position:relative; min-height:11.15em;}
.mainBoard .list li {display:block; position:relative;}
.mainBoard .list li + li {margin-top:.5em;}
.mainBoard .list li:nth-child(3) ~ li {display:none;}
.mainBoard .list li:not(.no-data) a {display:block; position:relative; padding-right:5.5em; padding-left:.85em;}
.mainBoard .list li:not(.no-data) a:before {content:""; display:block; position:absolute; top:50%; left:0; width:.3em; height:.3em; margin-top:-.15em; background:#d9d9d9; border-radius:100%;}
.mainBoard .list li:not(.no-data) .subj {display:block; position:relative; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:.9em; color:#33383D; line-height:1.55em; font-weight:600;}
.mainBoard .list li:not(.no-data) .subj .new {display:inline-block; position:relative; margin-right:.5em; width:2.6em; height:1.3em; vertical-align:sub; text-indent:-999px; overflow:hidden; background:url(../img/main/ico_new.svg) no-repeat 50% 50%; background-size:contain;}
.mainBoard .list li:not(.no-data) .desc {display:none;}
.mainBoard .list li:not(.no-data) .date {display:block; position:absolute; padding-left:1.25em; right:0; top:50%; background:url(../img/main/ico_date.svg) no-repeat top 50% left 0; background-size:.8em auto; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.mainBoard .list li:not(.no-data) .date > * {display:block; position:relative; font-size:.8em; color:#555; float:left; height:1.7em; line-height:1.7em; font-family:'Montserrat';}
.mainBoard .list li:not(.no-data) .date i {display:inline-block; position:relative; text-indent:-999px; overflow:hidden; width:.3em; line-height:1em;}
.mainBoard .list li:not(.no-data) .date i:before {content:"."; display:block; position:absolute; left:0; bottom:0; right:0; text-indent:0; text-align:center;}
.mainBoard .list li:not(.no-data) .date .d i {position:absolute; width:0; height:0;}
.mainBoard .list li:not(.no-data):first-child {margin-bottom:1.25em;}
.mainBoard .list li:not(.no-data):first-child a {padding:1.1em 2.4em 1.1em 7em; border-radius:1em; border:1px dashed #DFDFDF; min-height:6.6em;}
.mainBoard .list li:not(.no-data):first-child a:before {display:none;}
.mainBoard .list li:not(.no-data):first-child .date {padding:2.25em 0 0; right:auto; left:0; text-align:center; width:7em; background:none;}
.mainBoard .list li:not(.no-data):first-child .date > * {display:inline-block; vertical-align:middle; float:none; color:#8E8E8E;}
.mainBoard .list li:not(.no-data):first-child .date .d {display:block; position:absolute; top:0; left:0; right:0; font-size:2em; font-weight:800; line-height:1;}
.mainBoard .list li:not(.no-data):first-child .date .m i {position:absolute; width:0; height:0;}
.mainBoard .list li:not(.no-data):first-child .subj {font-size:1em; margin-bottom:.5em;}
.mainBoard .list li:not(.no-data):first-child .desc {display:block; font-size:.75em; color:#555; line-height:1.4em; height:2.8em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.mainBoard .list li.no-data {padding:3.1em; border-radius:1em; border:1px dashed #DFDFDF; min-height:11.15em; text-align:center; margin:0;}
.mainBoard .list li.no-data > * {display:block; position:absolute; top:50%; left:1em; right:1em; top:50%; color:#555; transform:translateY(-50%); -webkit-transform:trabslateY(-50%);}

@media all and (max-width:640px) {
	.mainBoard .list li:not(.no-data):first-child a {padding:1em 2em 1em 5em;}
	.mainBoard .list li:not(.no-data):first-child .date {width:5em;}
	
}
@media all and (max-width:420px) {
	.mainBoard .list li:not(.no-data) a {padding-right:0;}
	.mainBoard .list li:not(.no-data) .date {display:none;}
	
	.mainBoard .list li:not(.no-data):first-child a {padding-left:1.5em;}
}


.mainSNS {position:relative; z-index:0;}
.mainSNS .snsSliderArea {display:block; position:relative;}
.mainSNS .control button {display:block; position:absolute; top:50%; margin-top:-1.55em; width:3.1em; height:3.1em; background:#f5f5f5; border-radius:100%; z-index:2; text-indent:-999px; overflow:hidden; border-radius:100%; box-shadow:1em 1em 1.5em 0 rgba(0,0,0,.05);}
.mainSNS .control button:before {content:"";display:block;position:absolute;top:0;left:0;right:0;bottom:0;background:url(../img/main/spr_nav.svg) no-repeat 0 0;/* background-size: auto; */}
.mainSNS .control button.prev {left:-1.55em;}
.mainSNS .control button.prev:before {background-position: 0 100%;}
.mainSNS .control button.next {right:-1.55em;}
.mainSNS .control button.next:before {background-position: 100% 100%;}
.mainSNS .control button.swiper-button-disabled {background:rgba(255,255,255,0.95); opacity:1; box-shadow:none;}
.mainSNS .control button.prev.swiper-button-disabled:before {opacity:.3;background-position: 0 0;}
.mainSNS .control button.next.swiper-button-disabled:before {opacity:.3; background-position: 100% 0;}
.mainSNS .swiper-slide {width:21em; max-width:100%;}
.mainSNS .swiper-slide a {display:block; position:relative; overflow:hidden; border-radius:1em; z-index:0; background:#f3f8fb;}  

.mainSNS .swiper-slide a:after {content:""; display:block; position:relative; padding-top:75%; z-index:-1;}
.mainSNS .swiper-slide a > * {transition:.3s all; -webkit-transition:.3s all;}
.mainSNS .swiper-slide .thumb {display:block; position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden; z-index:-1;}
.mainSNS .swiper-slide .thumb img {display:block; position:absolute; top:0; max-width:500%; height:100%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); z-index:0;}
.mainSNS .swiper-slide .thumb img[src*="noimage"] {height:auto !important; width:auto !important; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); background:#f3f8fb;}
.mainSNS .swiper-slide .thumb:before {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:46%; background:linear-gradient(0deg, rgba(0, 0, 0, 0.70) 61.67%, rgba(0, 0, 0, 0.00) 87.88%); transition:.3s all; -webkittransition:.3s all; z-index:1;}
.mainSNS .swiper-slide .subj {display:block; position:absolute; font-size:.9em; color:#fff; font-weight:600; left:1.55em; right:1.55em; top:12.7em; line-height:1.55em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mainSNS .swiper-slide .date {display:block; position:absolute; padding-left:1.25em; left:1.75em; top:16.4375em; width:7.5em; line-height:1.75em; font-size:.8em; color:rgba(255,255,255,.8); background:url(../img/main/ico_date_w.svg) no-repeat 0 50%; background-size:auto 1em;}
.mainSNS .swiper-slide .guide {display:block; position:absolute; visibility:hidden; opacity:0; top:13.33em; left:1.4em; right:1.4em; text-align:center; text-align:center; font-size:.9em; color:#fff; line-height:1.55em;}
.mainSNS .swiper-slide .guide:before {content:""; display:block; position:absolute; width:1px; height:0; left:50%; bottom:3.125em; background:rgba(255,255,255,.5); transition:.1s all; -webkit-transition:.1s all;}
.mainSNS .no-data {display:table; width:100%; height:15.75em; text-align:center;}
.mainSNS .no-data > * {display:table-cell; padding:3.1em; border-radius:1em; border:1px dashed #DFDFDF; text-align:center; vertical-align:middle;}
.mainSNS .swiper-slide a:focus .thumb:before,
.mainSNS .swiper-slide a:hover .thumb:before {height:100%; background:linear-gradient(0deg, rgba(0,0,0,.7) 61.67%, rgba(0,0,0,.7) 87.88%);}
.mainSNS .swiper-slide a:focus .subj,
.mainSNS .swiper-slide a:hover .subj {top:2.85em; left:1.4em; right:1.4em; white-space:normal; text-align:center; line-height:1.4em; height:2.8em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.mainSNS .swiper-slide a:focus .date,
.mainSNS .swiper-slide a:hover .date {top:7.6875em; left:50%; margin-left:-3.75em;}
.mainSNS .swiper-slide a:focus .guide,
.mainSNS .swiper-slide a:hover .guide {visibility:visible; opacity:1; }
.mainSNS .swiper-slide a:focus .guide:before,
.mainSNS .swiper-slide a:hover .guide:before {height:2.61em;}

@media all and (max-width:460px) {
	.mainSNS .swiper-slide {font-size:.8em;}
}
@media all and (max-width:360px) {
	.mainSNS .swiper-slide a:after {padding-top:78%;}
}



/*********************************
	Quick
*********************************/

.mainQuickWrap {padding-bottom:4em;}
.mainQuickWrap:before {content:""; display:block; position:absolute; top:-2em; left:0; right:0; height:22.25em; background: linear-gradient(180deg, #49a9f0 0%, #0064b9 100%);}
.mainQuickWrap:after {content:""; display:block; position:absolute; top:-5em; width:100%; height:5em; left:0; background:url(../img/main/bg_wave.svg) repeat-x; animation:bgLoop 120s linear infinite; z-index:0; -webkit-animation:bgLoop 120s linear infinite; transform: rotate(-180deg);}
.mainQuickWrap .sec-tit {display:block; position:relative; text-align:center; padding:3.2em 0 2em;}
.mainQuickWrap .sec-tit strong {display:block; font-size:2.1em; line-height:1.2em; color:#fff; font-weight:400; font-family:'TTWanjudaedunsancheB'; word-break:keep-all;}
.mainQuickWrap .acc .obj {display:block; position:Absolute; background:url(../img/main/spr_sea.svg) no-repeat 0 0; background-size:23.5em auto;}
.mainQuickWrap .acc {position:Absolute; left:0; right:0; top:0;}
.mainQuickWrap .acc .obj.ty1 {top:-7.5em; left:-.3em; width:10.3em; height:11.15em; background-position:0 0; z-index:2;}
.mainQuickWrap .acc .obj.ty2 {top:-7.5em; right:-1.75em; width:12.4em; height:9.2em; background-position:-10.8em 0;  z-index:2; }
.mainQuickWrap .acc .obj.ty3 {top:2em; left:14.2em; width:7.5em; height:1.75em; background-position:-8em -12.4em; animation:acc-wave 5s linear 0s infinite normal both; -webkit-animation:acc-wave 5s linear 0s infinite normal both;}
.mainQuickWrap .acc .obj.ty4 {top:3.2em; right:9.8em; width:9.65em; height:2.25em; background-position:-8em -16.2em; animation:acc-wave 5s linear 0s infinite normal both; -webkit-animation:acc-wave 5s linear 0s infinite normal both;}


@media all and (max-width:1024px) {
	.mainQuickWrap .acc {font-size:.7em;}
	.mainQuickWrap .acc .obj.ty3,
	.mainQuickWrap .acc .obj.ty4 {display:none;}
}
@media all and (max-width:640px) {
	.mainQuickWrap .sec-tit strong {font-size:1.8em;}
}

@keyframes bgLoop {to{background-position: 0 0;} from{ background-position:1920px 0;}}
@-webkit-keyframes bgLoop {to{background-position: 0 0;} from{ background-position:1920px 0;}}

@keyframes acc-wave {16%{transform:translateX(-10%) translateY(10%);-webkit-transform:translateX(-10%) translateY(10%)}32%{transform:translateX(-20%) translateY(0);-webkit-transform:translateX(-20%) translateY(0%)}48%{transform:translateX(0) translateY(-20%);-webkit-transform:translateX(0%) translateY(-20%)}64%{transform:translateX(20%) translateY(0);-webkit-transform:translateX(20%) translateY(0%)}80%{transform:translateX(10%) translateY(10%);-webkit-transform:translateX(10%) translateY(10%)}100%{transform:translateX(0) translateY(0);-webkit-transform:translateX(0%) translateY(0%)}}
@-webkit-keyframes acc-wave {16%{transform:translateX(-10%) translateY(10%);-webkit-transform:translateX(-10%) translateY(10%)}32%{transform:translateX(-20%) translateY(0);-webkit-transform:translateX(-20%) translateY(0%)}48%{transform:translateX(0) translateY(-20%);-webkit-transform:translateX(0%) translateY(-20%)}64%{transform:translateX(20%) translateY(0);-webkit-transform:translateX(20%) translateY(0%)}80%{transform:translateX(10%) translateY(10%);-webkit-transform:translateX(10%) translateY(10%)}100%{transform:translateX(0) translateY(0);-webkit-transform:translateX(0%) translateY(0%)}}


.mainQuickWrap .sectionBox {display:block; position:relative; padding:3em; background:#fff; border-radius:1em 5em 1em 1em; box-shadow:0 0 2em 0 rgba(0,0,0,.05); z-index:1;}
.mainQuickWrap .sectionBox:before {content:""; display:block; position:absolute; left:1.1em; top:-1.5em; width:5.6em; height:1.5em; background:url(../img/main/spr_sea.svg) no-repeat 0 -12.7em; background-size:23.5em auto; z-index:-1;}
.mainQuickWrap .sectionBox:after {content:""; display:block; clear:both;}
@media all and (max-width:1450px) and (min-width:1025px) {
	.mainQuickWrap .sectionBox {padding:2.5em 2em;}
}
@media all and (max-width:1024px) {
	.mainQuickWrap .sectionBox {border-radius:1em; padding:2em 1.5em;}
}
@media all and (max-width:640px) {
	.mainQuickWrap .sectionBox {font-size:.9em;}
}
@media all and (max-width:420px) {
	.mainQuickWrap .sectionBox {margin:0 -1em; padding:2.5em 1em; border-radius:0; font-size:1em;}
}

.mainDepartQuick,
.mainOthers,
.mainFavoriteLinks {display:block; position:relative;}
@media all and (min-width:1025px) {
	.mainDepartQuick,
	.mainOthers {display:block; position:relative; width:35em;}
	.mainFavoriteLinks {position:absolute; top:3em; right:3em; left:37.55em; bottom:3em; margin-left:3em;}
}
@media all and (max-width:1600px) and (min-width:1025px) {
	.mainDepartQuick,
	.mainOthers {width:31em;}
	.mainFavoriteLinks {left:33em;}
}
@media all and (max-width:1450px) and (min-width:1025px) {
	.mainFavoriteLinks {margin-left:2em; bottom:2.5em; top:2.5em; right:2em;}
}
@media all and (max-width:1024px) {
	.mainFavoriteLinks {margin-top:2em;}	
}



.mainDepartQuick {padding-bottom:1.5em; border-bottom:1px dashed #E6E6E8;}
.mainDepartQuick:after {content:""; display:block; position:absolute; left:0; top:-.6em; width:1.7em; height:2.5em; background:url(../img/main/spr_visual.png) no-repeat 0 -10.5em; background-size:auto 21em;}
.mainDepartQuick .tit {display:block; margin-left:2em; margin-bottom:1.8em;}
.mainDepartQuick .tit strong {font-family:'TTWanjudaedunsancheB'; color:#33383D; font-size:1.7em;}
.mainDepartQuick ul {display:block; position:relative; overflow:hidden;}
.mainDepartQuick ul > li {display:block; position:relative; width:16.66%; float:left; text-align:center;}
.mainDepartQuick li a {display:block; position:relative;}
.mainDepartQuick li a strong {display:inline-block; position:relative; font-size:.9em; line-height:1.5em;}
.mainDepartQuick li a:focus strong,
.mainDepartQuick li a:hover strong {font-weight:600;}
.mainDepartQuick li a:focus strong:after,
.mainDepartQuick li a:hover strong:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:1px; background:#000;}
.mainDepartQuick li a .icon {display:block; position:relative; width:3.25em; height:3.25em; background:no-repeat 50% 50%; background-size:contain; margin:0 auto 1em;}
.mainDepartQuick li a .icon.ty1 {background-image:url(../img/main/ico_depart_01.svg);}
.mainDepartQuick li a .icon.ty2 {background-image:url(../img/main/ico_depart_02.svg);}
.mainDepartQuick li a .icon.ty3 {background-image:url(../img/main/ico_depart_03.svg);}
.mainDepartQuick li a .icon.ty4 {background-image:url(../img/main/ico_depart_04.svg);}
.mainDepartQuick li a .icon.ty5 {background-image:url(../img/main/ico_depart_05.svg);}
.mainDepartQuick li a .icon.ty6 {background-image:url(../img/main/ico_depart_06.svg);}

@media all and (max-width:1024px) {
	.mainDepartQuick .tit {margin-bottom:1.2em;}
	.mainDepartQuick ul {font-size:.9em;}
}
@media all and (max-width:600px) {
	.mainDepartQuick ul > li {width:33.33%; padding:.5em 0;}
}


.mainOthers {position:relative;}
.mainOthers::before {content:''; position:absolute; width:124px; height:251px; bottom:-80px; left:-94px; background:url('/portal/img/main/illu_left.png') no-repeat; z-index:11;}
.mainOthers::after {content:''; position:absolute; width:141px; height:242px; bottom:-80px; right:-80px; background:url('/portal/img/main/illu_right.png') no-repeat;  z-index:10;}
.mainOthers .acc-banner {position:relative; display:flex; margin-top:1.5em;}
.mainOthers .acc-banner a {position:absolute; display:block; padding:1.5em 1.75em;}
.mainOthers .acc-banner .obj {height:230px;}
.mainOthers .acc-banner .obj.ty1 {background:#3596e1 url('/portal/img/main/link_left.png') no-repeat; background-position:right -30px bottom -40px; border-radius:40px 20px 20px 20px; width:53%; margin-right:4%;}
.mainOthers .acc-banner .obj.ty2 {background:#F15F86 url('/portal/img/main/link_right.png') no-repeat; background-position:right 0px bottom 10px; border-radius:20px 20px 40px 20px; width:43%;}
.mainOthers .tit span {color:#fff;font-size:0.85em;margin-top:0.75em;display:block;line-height:1.4;font-weight:400;}
.mainOthers .btn {display:inline-block; position:relative; padding:0.7em 1.2em; border-radius:9em; margin-top:1.6em; background-color:#1477c4; font-size:.85em; color:#ffffff; font-weight:600;}
.mainOthers .obj.ty2 .btn {background-color:#e03463;}
.mainOthers .acc-banner .ty1:hover {font-weight:600; box-shadow:0.5em 0.5em 0.5em 0 rgb(104 185 248 / 30%); margin-top:-0.5em;}
.mainOthers .acc-banner .ty2:hover {font-weight:600; box-shadow:0.5em 0.5em 0.5em 0 rgb(255 103 144 / 30%); margin-top:-0.5em;}

@media all and (max-width:1024px) {
	.mainOthers::before {left:-80px;}
}

@media all and (max-width:640px) {
	.mainOthers .acc-banner {display:block;}
	.mainOthers .acc-banner .obj{width:100%!important; height:180px; margin-top:1em; margin:1em auto 0;}
	.mainOthers::before, 
	.mainOthers .acc-banner br {display:none;}
	.mainOthers .acc-banner .obj.ty1:hover,
	.mainOthers .acc-banner .obj.ty2:hover {margin-top:1em!important;}
}

.mainFavoriteLinks .tabs {display:block; position:relative; border:1px solid #DDDDDD; border-radius:1em 1em 0 0;}
.mainFavoriteLinks .tabs:after {content:""; display:block; clear:both;}
.mainFavoriteLinks .tabs li {display:block; position:relative; width:33.33%; float:left;}
.mainFavoriteLinks .tabs li + li {border-left:1px solid #ddd;}
.mainFavoriteLinks .tabs li button {display:block; position:relative; width:100%; height:3.2em; text-align:center;}
.mainFavoriteLinks .tabs li button:focus {outline: 2px solid #f15f86;}
.mainFavoriteLinks .tabs li button strong {display:block; position:relative; color:#33383D; font-weight:600;}
.mainFavoriteLinks .tabs li button strong:before {content:""; display:inline-block; vertical-align:middle; width:1.2em; height:1.2em; background:no-repeat 50% 50%; background-size:contain; margin-right:.7em;}
.mainFavoriteLinks .tabs li button[data-tab="탭1"] strong:before {background-image:url(../img/main/ico_tab01.svg);}
.mainFavoriteLinks .tabs li button[data-tab="탭2"] strong:before {background-image:url(../img/main/ico_tab02.svg);}
.mainFavoriteLinks .tabs li button[data-tab="탭3"] strong:before {background-image:url(../img/main/ico_tab03.svg);}
.mainFavoriteLinks .tabs li button.on {background:#2C2A8B; border-color:#2C2A8B; border-radius:1em 1em 0 0; box-shadow:0 0 1em 0 rgba(44,42,139,.2);}
.mainFavoriteLinks .tabs li button.on strong {font-weight:600; color:#FFFFFF;}
.mainFavoriteLinks .tabs li button[data-tab="탭1"].on strong:before {background-image:url(../img/main/ico_tab01_on.svg);}
.mainFavoriteLinks .tabs li button[data-tab="탭2"].on strong:before {background-image:url(../img/main/ico_tab02_on.svg);}
.mainFavoriteLinks .tabs li button[data-tab="탭3"].on strong:before {background-image:url(../img/main/ico_tab03_on.svg);}
.mainFavoriteLinks .tabs li.tab-active,
.mainFavoriteLinks .tabs li.tab-active + li {border-left-width:0;}
.mainFavoriteLinks .tab-content {display:block; position:relative; background:#F8FAFC; padding:1.3em; min-height:20.25em;}
.mainFavoriteLinks .tab-content ul {display:block; position:relative; margin:-.25em -.3em;}
.mainFavoriteLinks .tab-content ul:after {content:""; display:block; clear:both;}
.mainFavoriteLinks .tab-content li {display:block; position:relative; padding:.25em .3em; width:33.33%; float:left;}
.mainFavoriteLinks .tab-content li a {display:block; position:relative; text-align:center; font-size:.85em; color:#33383D; padding:.88em .5em; border:1px solid #ddd; border-radius:9em; background:#fff; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} 
.mainFavoriteLinks .tab-content li a:hover{ border:1px solid #2c2a8b; color:#2c2a8b; font-weight:600;}

@media all and (max-width:640px) {
	.mainFavoriteLinks .tabs li button {height:3em;}
	.mainFavoriteLinks .tabs li button strong {font-size:.9em;}
	.mainFavoriteLinks .tab-content {min-height:0;}
	.mainFavoriteLinks .tab-content li {width:50%;}	
}
@media all and (max-width:470px) {
	.mainFavoriteLinks .tabs li button {height:2.5em;}
	.mainFavoriteLinks .tabs li button strong:before {display:none !important;}
}
@media all and (max-width:440px) {
	.mainFavoriteLinks .tab-content li {float:none; width:auto;}
}






/*********************************
	layerPopup
*********************************/

.layerPopup {display:none; position:fixed; z-index:99; top:200px; left:50%; transform:translateX(-50%); background:#fff; border:1px solid #000; overflow:hidden; max-width:100%;}
.layerPopup .pop-con {position:relative;}
.layerPopup .pop-control {display:block; position:relative; background:#000; color:#fff; padding:10px 40px 10px 10px; font-size:11px; min-width:200px; height:40px; overflow:hidden;}
.layerPopup .pop-control .dayCloseCheck {display:block; position:absolute; top:0; left:0; opacity:0; z-index:-9999; height:0 !important; width:0 !important;}
.layerPopup .pop-control .dayCloseCheck + label {display:inline-block; position:relative; line-height:20px; padding:0; cursor:pointer;}
.layerPopup .pop-control .dayCloseCheck + label:before {content:""; display:inline-block; width:12px; height:12px; vertical-align:middle; background:#fff; border:3px solid #fff; border-radius:100%; margin-right:.5em; box-sizing:border-box;}
.layerPopup .pop-control .dayCloseCheck:focus + label {text-decoration:underline;}
.layerPopup .pop-control .dayCloseCheck:checked + label:before {background:#0089ff;}
.layerPopup .pop-control .pop-close {display:block; position:absolute; top:10px; right:10px; width:20px; height:20px; background:transparent; overflow:hidden; text-indent:-999px;}
.layerPopup .pop-control .pop-close:before {content:"⨯"; display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; line-height:20px; text-indent:0; color:#fff; font-size:2em;}

@media all and (max-width:520px) {
	.layerPopup,
	.layerPopup .pop-con img{width:100%;}
}