@charset "utf-8";


/* popLayer */
#mask {position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1000;transition: all .2s;}
.popLayer {/*display:none;z-index:999;*/visibility:hidden;overflow:hidden;opacity:0;z-index:-1;position:fixed;top:0;left:0;width:100%;height:100%;max-width:none;-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0);display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-justify-content:center;align-items:center;background:rgba(0,0,0,0.5);z-index:1000;transition:all .2s;}
.popLayer.open {visibility:visible;overflow:visible;opacity:1;z-index:9999;}
.popLayer .popLayer_wrap {position:relative;max-width:450px;}
.popLayer .close {position:absolute;left:calc(100% - 40px);top:-50px;width:40px;height:40px;border-radius:50%;border:1px solid #fff;z-index:10;display:none;}
.popLayer .close em {display:block;font-size:0;line-height:0;position:absolute;left:50%;top:50%;width:21px;height:21px;margin:-10px 0 0 -10px;transform:rotate(45deg);}
.popLayer .close em:before, 
.popLayer .close em:after {content:'';position:absolute;background:#fff;}
.popLayer .close em:before {left:0;top:50%;width:21px;height:1px;margin-top:-1px;}
.popLayer .close em:after {left:50%;top:0;width:1px;height:21px;margin-left:-1px;}
.popLayer .close em:hover {transform:rotate(-180deg);}
.popLayer button.close2 {float:right;color:#fff;background:none;line-height:20px;padding:0 5px;}
.popLayer button.close2:before {content:'x';font-size:16px;line-height:20px;margin-right:5px;}
.popLayer .content {position:relative;min-height:0;image-rendering:-webkit-optimize-contrast;backface-visibility:hidden;/*overflow:hidden;*/background:#fff;}
.popLayer .content a {display:block;width:100%;height:100%;}
.popLayer .content img {width:100%;}
.popLayer .closeGrp {overflow:hidden;font-size:14px;color:#fff;width:100%;background:#000;margin-top:0;padding:10px 10px 10px 15px;}
.popLayer .closeGrp li:first-child {display:inline-block;}
.popLayer .closeGrp li:last-child {float:right;}
.popLayer .form_check {display:inline-block;position:relative;z-index:0;height:20px;}
.popLayer .form_check label {cursor:pointer;color:#fff;display:inline-block;padding:1px 0 0 28px;height:100%;}
.popLayer .form_check label::before {content:'';position:absolute;left:0;top:0;z-index:-2;width:20px;height:20px;border:1px solid #ccc;background-color:#fff;}
.popLayer .form_check label::after {content:'';position:absolute;top:auto;left:auto;right:auto;font-family:"xeicon";left:0;top:0;z-index:-1;width:20px;height:20px;line-height:20px;color:#555;text-align:center;opacity:0;-webkit-transition:all 0.2s;transition:all 0.2s;}
.popLayer .form_check input {position:absolute;left:0;top:0;opacity:0;padding:0;height:auto;}
.popLayer .form_check input:focus + label::before {outline:1px dotted #102f70;}
.popLayer .form_check input:checked + label::after {opacity:1;font-weight:600;color:#102f70;}
.popLayer .content a:focus-visible,
.popLayer .close:focus-visible,
.popLayer .close2:focus-visible,
.popLayer .form_check input:focus + label {outline:1px solid #116abc;box-shadow:0 0 4px 2px rgb(17 106 188 / 50%);}
.popLayer .content a:focus-visible img {border:1px solid #116abc;}
.popLayer .pagination {position:absolute; bottom:12px; left:50%; -webkit-transform:translateX(-50%); transform:translateX(-50%); z-index:1;}
.popLayer .pagination .swiper-pagination-bullet {width:12px; height:12px; margin-left:4px;background:rgba(0,0,0,.2); font-size:0; vertical-align:bottom; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%;border:1px solid rgba(0,0,0,.1);opacity:1;}
.popLayer .pagination .swiper-pagination-bullet:first-child{margin-left:0;}
.popLayer .pagination .swiper-pagination-bullet-active {background:#116abc;border:0 none;}
.popLayer .btn_next,
.popLayer .btn_prev {position:absolute;top:50%;width:50px;height:50px;z-index:999;margin-top:-25px;background-color:#fff;background-position:center;background-repeat:no-repeat;}
.popLayer .btn_next {right:-65px;background-image:url(../../../../img/btn_pop_next.png);}
.popLayer .btn_prev {left:-65px;background-image:url(../../../../img/btn_pop_prev.png);}


/* container */
#container {margin:92px 0 80px;}
#container::after {content:'';clear:both;display:block;}


/* main_visual */
.main_visual {position:relative;}
.main_visual .swiper-container{position:static;}
.main_visual ul li {text-align:center;}
.main_visual ul li a {position:relative;width:100%;display:block;height:500px;background-position:center top;background-repeat:no-repeat;background-size:auto 100%;}
.main_visual ul li a:focus-visible {outline:1px solid #000;width:calc(100% - 6px);box-shadow:0 0 4px 2px rgb(0 0 0 / 50%);margin:3px;}
.main_visual ul li a:focus-visible .visual_tit {bottom:65px;}
.main_visual ul li a img {display:none;}
.main_visual ul li a .visual_tit {position:absolute;left:50%;bottom:68px;display:inline-block;width:1200px;height:50px;padding:13px 0 0 30px;font-size:18px;color:#fff;font-weight:300;text-align:left;background:rgba(101,80,167,.8);background:linear-gradient(to right, rgba(101,80,167,.8) 0%, rgba(76,88,169,.8) 49%, rgba(45,120,161,.8) 100%);/*background-color:rgba(17, 30, 58, 0.8);*/margin-left:-600px;/*transform:translate(-50%,0) translate(-0.1px,-0.1px) translateZ(0);*/}
.main_visual .slide_btns {position:absolute;right:50%;bottom:0;margin-right:-600px;z-index:2;color:#fff;}
.main_visual .slide_btns button {position:absolute;bottom:78px;width:30px;height:30px;text-indent:-9999px;overflow:hidden;}
.main_visual .slide_btns button::before {content:'';position:absolute;left:0;top:0;width:100%;height:100%;border:2px solid rgba(255,255,255,.76);border-radius:50%;}
.main_visual .slide_btns button::after {content:'';position:absolute;left:12px;top:0;width:7px;height:100%;background-position:center;background-repeat:no-repeat;}
.main_visual .slide_btns button:focus-visible {outline-color:#116abc;box-shadow:0 0 4px 2px rgba(17 106 188 / 80%);}
.main_visual .slide_btns .control button {right:116px;}
.main_visual .slide_btns .btn_start {display:none;}
.main_visual .slide_btns .btn_start::after,
.main_visual .slide_btns .btn_stop.play::after {width:5px;background-image:url(../../../../img/btn_slide_start.png);}
.main_visual .slide_btns .btn_stop::after {width:6px;background-image:url(../../../../img/btn_slide_stop.png);}
.main_visual .slide_btns .btn_prev {right:150px;}
.main_visual .slide_btns .btn_prev::after {left:11px;background-image:url(../../../../img/btn_slide_prev.png);}
.main_visual .slide_btns .btn_next {right:82px;}
.main_visual .slide_btns .btn_next::after {background-image:url(../../../../img/btn_slide_next.png);}
.main_visual .slide_btns .swiper-pagination {position:absolute;left:auto;right:35px;bottom:68px;width:45px;text-align:right;font-size:16px;font-weight:500;line-height:50px;}
.main_visual .slide_btns .swiper-pagination .swiper-pagination-current {color:#34f4f4;font-weight:700;}


/* main_content */
.main_content {margin-top:-68px;}
.main_content .inner > div {box-shadow:5px 5px 10px rgba(204, 204, 204, 0.3);}
.main_content .inner > div::after {content:'';clear:both;display:block;}

/* icon_banner */
.icon_banner {position:relative;width:100%;z-index:1;}
.icon_banner::before {content:'';position:absolute;left:0;top:0;width:100%;height:100%;background-color:#009393;z-index:-1;}
.icon_banner > div {position:relative;float:left;width:33.33%;/*height:190px;*/height:200px;color:#fff;font-size:15px;z-index:1;}
.icon_banner > div:first-of-type {width:33.34%;}
.icon_banner > div::after {content:'';position:absolute;right:34px;top:28px;width:61px;height:55px;background-position:right top;background-repeat:no-repeat;background-size:100%;}
.icon_banner h2 {color:#fff;font-size:30px;letter-spacing:-2px;font-weight:400;padding-bottom:10px;}
.icon_banner span {display:inline-block;}
.icon_banner .txt {width:100%;min-height:54px;line-height:1.2;}
.icon_banner .statistice {color:#3a3a3a;/*padding:26px 30px 26px 30px;*/background-color:#fff;}
/*.icon_banner .statistice::after {background-image:url(../../../../img/index_bot_01.png);}*/
.icon_banner .statistice::after {top:32px;width:71px;height:77px;background-image:url(../../../../img/icon_statistice.png);}
.icon_banner .statistice h2 {color:#3a3a3a;}
.icon_banner .statistice a {padding:0;}
.icon_banner .statistice a:hover span {color:#3a3a3a;}
.icon_banner .statistice .link {position:absolute;left:30px;bottom:26px;width:172px;}
.icon_banner .statistice .link li {float:left;width:50%;height:30px;border:1px solid #ccc;}
.icon_banner .statistice .link li + li {border-left:0 none;}
.icon_banner .statistice .link li a {display:block;text-align:center;line-height:28px;}
.icon_banner .statistice .link li a span {padding-right:11px;background:url(../../../../img/click_03.png) right center no-repeat;}
.icon_banner .statistice .btn {background-image:url(../../../../img/click_04.png);}
.icon_banner .statistice a,
.icon_banner .guide a,
.icon_banner .training a {position:relative;display:block;width:100%;height:100%;padding:26px 30px 26px 30px;}
.icon_banner .guide a:hover,
.icon_banner .training a:hover {color:#fff;} 
.icon_banner .guide a:hover,
.icon_banner .training a:hover {z-index:2;} 
.icon_banner .btn {position:absolute;left:30px;bottom:26px;padding-right:30px;font-weight:500;line-height:30px;background-position:right center;background-repeat:no-repeat;}
.icon_banner .guide {background-color:#116abc;}
/*.icon_banner .guide::after {width:62px;height:60px;background-image:url(../../../../img/index_bot_02.png);}*/
.icon_banner .guide::after {width:70px;height:82px;background-image:url(../../../../img/icon_guide.png);}
.icon_banner .guide .btn {background-image:url(../../../../img/click_01.png);}
.icon_banner .training {background-color:#009393;}
/*.icon_banner .training::after {background-image:url(../../../../img/index_bot_03.png);}*/
.icon_banner .training::after {width:82px;height:81px;background-image:url(../../../../img/icon_qna.png);}
.icon_banner .training .btn {background-image:url(../../../../img/click_02.png);}

/* notice_group */
.notice_group {position:relative;width:100%;z-index:1;}
.notice_group::before {content:'';position:absolute;left:0;top:0;width:100%;height:100%;background-color:#eceff4;z-index:-1;}
.notice_group {margin-top:68px;box-shadow:5px 5px 10px rgba(204, 204, 204, 0.3);}
.notice_group > div {position:relative;float:left;width:33.33%;height:290px;padding:24px 30px;z-index:1;}
.notice_group > div:first-of-type {width:33.34%;}
.notice_group h2 {font-size:18px;color:#333;font-weight:500;padding-bottom:12px;}
.notice_group .more_btn {display:block;position:absolute;top:25px;right:22px;width:24px;height:24px;text-indent:-9999px;background:url(../../../../img/more.png) center center no-repeat;}
.notice_group .list li {position:relative;line-height:22px;margin:10px 0;padding-right:90px;}
.notice_group .list li::after {content:'';clear:both;display:block;}
.notice_group .list li a {float:left;display:block;width:100%;font-size:15px;color:#333;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.notice_group .list li .date {position:absolute;right:0;top:0;float:right;width:75px;font-size:14px;color:#555;white-space:nowrap;}
.notice_group .list li.first {border-bottom:1px dashed #aeaeae;padding:4px 0 18px 65px;margin-top:0;margin-bottom:10px;background: url(../../../../img/reference_img.png) left top no-repeat;background-size:auto 52px;}
.notice_group .list li.first a {float:left;display:block;width:100%;overflow:hidden;/*white-space:inherit;*/}
.notice_group .list li.first strong {float:none;font-weight:500;padding-top:6px;font-size:15px;padding-bottom:3px;width:auto;}
.notice_group .list li.first p {display:block;float:none;color:#757575;height:45px;font-size:14px;line-height:20px;}
.notice_group .list li.first .date {position:static;right:auto;top:auto;}
/*.notice_group .list li:nth-child(n+6){display:none;}*/
.notice_group .notice {background-color:#fff;}
.notice_group .notice h2 {padding-bottom:15px;}
.notice_group .data {background-color:#fff;border-left:1px solid #d8d8d8;}
.notice_group .data .list li:nth-child(n+6){display:none;}
.notice_group .movie {background-color:#eceff4;}
.movie_slide .swiper-container{position:static;}
.movie_slide ul li a {width:100%;display:block;}
.movie_slide ul li a:focus-visible .img {outline:1px solid #000;box-shadow:0 0 4px 2px rgb(0 0 0 / 50%);height:169px;width:calc(100% - 6px);margin:3px;}
.movie_slide ul li a:focus-visible .tit {text-decoration:underline;}
.movie_slide ul li a .img {position:relative;display:inline-block;width:100%;height:175px;/*padding-top:56.25%;padding-top:51.25%;*/}
.movie_slide ul li a .img::before {content:'';position:absolute;left:50%;top:50%;background:url(../../../../img/logo.png) center no-repeat;width:60%;height:35px;margin-top:-5px;transform:translate(-50%,-50%) translate(-0.1px,-0.1px) translateZ(0);background-size:100%;opacity:.4;filter:grayscale(100%);}
.movie_slide ul li a .img::after {content:'';position:absolute;left:0;right:0;top:0;bottom:0;}
.movie_slide ul li a .img img {max-height:100%;height:100%;max-width:none;width:100%;background:#f3f3f3;object-fit:cover;position:absolute;top:0;left:0;transform:translate(0, 0);}
.movie_slide ul li a .tit {display:inline-block;width:100%;font-size:15px;margin-top:10px;text-align:center;color:#333;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;letter-spacing:-1px;}
/* hidden .movie_slide ul li a .tit {display:none;position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0 none;overflow:hidden;clip:rect(0, 0, 0, 0);} */
.movie_slide .slide_btns .control {display:none;}
.movie_slide .slide_btns button {position:absolute;right:70px;top:20px;width:20px;height:30px;text-indent:-9999px;overflow:hidden;background-position:center center;background-repeat:no-repeat;}
.movie_slide .slide_btns .btn_start,
.movie_slide .slide_btns .btn_stop.play {display:none;background-image:url(../../../../img/icon_play.png);}
.movie_slide .slide_btns .btn_stop {background-image:url(../../../../img/icon_stop.png);}
.movie_slide .slide_btns .btn_prev {right:50px;background-image:url(../../../../img/icon_prev.png);}
.movie_slide .slide_btns .btn_next {right:30px;background-image:url(../../../../img/icon_next.png);}



/* 반응형 - media qurey 시작 */
/* 넓이가 1223px 이하일 때*/
@media all and (max-width:1223px){	

	/* container */
	#container {margin-bottom:60px;}

	.main_visual ul li a {height:400px;}
	.main_visual ul li a .visual_tit {width:calc(100% - 60px);left:30px;margin-left:0;font-size:16px;padding-top:16px;padding-left:20px;}
	.main_visual ul li a .visual_tit,
	.main_visual .slide_btns .swiper-pagination {bottom:50px;}
	.main_visual .slide_btns {right:20px;margin-right:0;}
	.main_visual .slide_btns button {bottom:60px;}

	.main_content {margin-top:-50px;}

	.icon_banner h2 {font-size:20px;font-weight:500;}
	.icon_banner .txt {word-break:keep-all;word-wrap:break-word;}
	.icon_banner .txt br {display:none;}
	.icon_banner > div::after {top:auto !important;bottom:22px;right:20px;background-position:right bottom;background-size:auto 80%;z-index:-1;}
	/* .icon_banner .statistice, */
	.icon_banner .statistice a,
	.icon_banner .guide a, 
	.icon_banner .training a {padding:20px 24px;}
	.icon_banner .statistice .link,
	.icon_banner .btn {left:24px;bottom:20px;}
	.icon_banner .statistice .link {width:158px;}
	.icon_banner .statistice .link li a {background-color:#fff;}

	.notice_group {margin-top:50px;}
	.notice_group > div {padding:20px 24px;height:280px;}
	.notice_group .more_btn {right:15px;top:19px;}
	.movie_slide .slide_btns button {top:16px;right:60px;}
	.movie_slide .slide_btns .btn_next {right:20px;}
	.movie_slide .slide_btns .btn_prev {right:40px;}

}

/* 넓이가 1024px 이하일 때*/
@media all and (max-width:1024px){	

	/* container */
	#container {margin:62px 0 40px;}

}

/* 넓이가 1023px 이하일 때*/
@media all and (max-width:1023px){	

	.icon_banner > div {float:none;height:170px;}
	.icon_banner > div,
	.icon_banner > div:first-of-type {width:100%;}
	/* .icon_banner > div::after,
	.icon_banner .guide::after {width:60px;height:100%;bottom:0;background-position:center center;background-size:75% auto;} */
	.icon_banner .btn em {display:none;}
	/* .icon_banner .statistice, */
	.icon_banner .statistice a, 
	.icon_banner .guide a, 
	.icon_banner .training a {padding-bottom:35px;}

	.notice_group > div {height:252px;}
	.notice_group .list li {margin:6px 0;padding-right:80px;}
	.notice_group .list li.first {padding:0 0 13px 58px;background-size:auto 46px;margin-bottom:9px;}
	.notice_group .list li a {font-size:14px;}
	.notice_group h2 {padding-bottom:10px;}
	.notice_group .list li .date {letter-spacing:-1px;text-align:right;}
	
	.movie_slide ul li a .img {height:145px;}

}

/* 넓이가 768px 이하일 때*/
@media all and (max-width:768px){	

	.main_visual ul li a {height:auto;padding-top:40%;background:none;}
	.main_visual ul li a img {display:inline-block;max-height:100%;height:100%;max-width:none;width:100%;object-fit:cover;position:absolute;top:0;left:0;transform:translate(0, 0);}

	.main_visual ul li a .visual_tit {display:none;}
	.main_visual .slide_btns .swiper-pagination {bottom:0;}
	.main_visual .slide_btns {right:auto;left:0;width:100%;height:50px;background:rgba(101,80,167,.8);background:linear-gradient(to right, rgba(101,80,167,.8) 0%, rgba(76,88,169,.8) 49%, rgba(45,120,161,.8) 100%);/*background-color:rgba(17, 30, 58, 0.8);*/}
	.main_visual .slide_btns button {bottom:10px;}
	.main_visual .slide_btns .swiper-pagination {right:20px;}
	.main_visual .slide_btns .btn_next {right:auto;left:88px;}
	.main_visual .slide_btns .btn_prev {right:auto;left:20px;}
	.main_visual .slide_btns .control button {right:auto;left:54px;}
	
	.main_content {margin-top:0;}
	.main_content .inner > div {box-shadow:inherit;}
	.main_content .inner > div::before {display:none;}

	.icon_banner > div,
	.notice_group > div {margin-top:20px;box-shadow:5px 5px 10px rgba(204, 204, 204, 0.3);}

	.icon_banner > div::after {background-size:auto 65%;}
	.icon_banner h2 {font-size:17px;letter-spacing:-0.5px;}
	.icon_banner .txt {font-size:14px;line-height:1.4;}
	.icon_banner .btn,
	.icon_banner .statistice .link li a span {font-size:14px;}

	.notice_group {margin-top:20px;}
	.notice_group > div {float:none;height:auto;}
	.notice_group > div,
	.notice_group > div:first-of-type {width:100%;}
	.notice_group h2 {font-size:17px;padding-bottom:12px;}
	.notice_group .more_btn {top:17px;}
	.notice_group .notice h2 {padding-bottom:5px;}
	.notice_group .data {border-left:0 none;/*border-top:1px solid #d8d8d8;*/}
	.notice_group .list li.first {margin-bottom:12px;padding-bottom:15px;}
	.movie_slide ul li a .img {height:auto;padding-top:56.25%;}
	.movie_slide ul li a .img img {object-fit:cover;}

}
	
/* 넓이가 640px 이하일 때*/
@media all and (max-width:640px){	

	.main_visual .slide_btns {position:relative;left:auto;bottom:auto;}
	.main_visual .slide_btns .swiper-pagination {font-size:15px;font-weight:400;}

	/* popLayer */
	.popLayer .btn_next {right:-25px;}
	.popLayer .btn_prev {left:-25px;}
	.popLayer .btn_next,
	.popLayer .btn_prev {background-color:rgba(255,255,255,.7);box-shadow:5px 5px 10px rgba(0, 0, 0, 0.1);}

}

/* 넓이가 500px 이하일 때*/
@media all and (max-width:500px){	

	/* popLayer */
	.popLayer {padding:30px;}
	.popLayer .popLayer_wrap {max-width:100%;}
	.popLayer .pagination {bottom:10px;}
	.popLayer .pagination .swiper-pagination-bullet {width:10px;height:10px;}
	/* .popLayer .popLayer_wrap {width:100%;max-height:100%;overflow-x:hidden;overflow-y:auto;} */
	.popLayer .btn_next {right:-22px;}
	.popLayer .btn_prev {left:-22px;}
	.popLayer .btn_next,
	.popLayer .btn_prev {width:44px;height:44px;margin-top:-22px;}

}