@charset "utf-8";

/* 
 * main CSS Document
 * Author - hyunho
 * Use only for main
 *
 */
 
#container{position:relative;}
#content{min-height:600px;}

/* footer-main only  */
#footer{position:relative;}
a.btn_top{position:absolute;}

*[class*="swiper_bottom"]{position:absolute; right:0px; bottom:0px; z-index:50; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; min-width:145px; box-sizing:border-box; padding:13px 18px; background:rgba(0,0,0,0.3);}
.swiper_prev,
.swiper_next{display:inline-block; position:relative; width:24px; height:24px; background:transparent; border:1px solid #fff; border-radius:100%; text-indent:100%; overflow:hidden; white-space:nowrap;}
.swiper_prev:before,
.swiper_next:before{content:''; display:block; position:absolute; top:50%; left:50%; width:6px; height:12px; margin:-5px 0 0 -3px; background:url(../images/main/img_slide_arrow.svg) no-repeat 50% 0; background-size:100% auto;}
.swiper_next:before{margin-top:-7px; transform:rotate(180deg);}
.swiper_auto{width:50px; background:transparent; border:0px;}
.swiper_auto span{display:block; position:relative; width:11px; height:14px; margin:0 auto; text-indent:100%; overflow:hidden; white-space:nowrap;}
.swiper_auto:not(.paused) span:before,
.swiper_auto:not(.paused) span:after{content:''; display:block; position:absolute; top:0px; width:2px; height:14px; background:#fff;}
.swiper_auto:not(.paused) span:before{left:2px;}
.swiper_auto:not(.paused) span:after{right:2px;}
.swiper_auto.paused span:before{content:''; display:block; position:absolute; top:0px; left:0px; border-left:11px solid #fff; border-top:7px solid transparent; border-bottom:7px solid transparent;}
.swiper_page{width:auto; padding:0 10px; /* font-family:'Spoqa Han Sans Neo', Sans-serif; */ font-size:15px; font-weight:300; color:#fff; letter-spacing:-0.5px;}
.swiper_page i,
.swiper_page em{color:#c7c7c7;}

/* visual */
[data-main="visual"]{padding:0 80px;}
[data-main="visual"] .img{overflow:hidden; display:block; position:relative; height:680px; background-color:#f5f5f5;}
[data-main="visual"] .img img{position:absolute; top:0px; left:50%; height:100%; transform:translateX(-50%);}
[data-main="visual"] .img.web{display:block;}
[data-main="visual"] .img.mob{display:none;}
[data-main="visual"] .img i{display:none; position:absolute; top:0px; left:0; z-index:10; width:100%; background-repeat:no-repeat; background-position:50% 0; background-size:auto 100%;}
[data-main="visual"] .swiper_prev,
[data-main="visual"] .swiper_next{position:absolute; top:50%; width:56px; height:56px; z-index:40; margin-top:-28px; border-width:0px; background:rgba(0,0,0,0.3);}
[data-main="visual"] .swiper_prev{left:30px;}
[data-main="visual"] .swiper_next{right:30px;}
[data-main="visual"] .swiper_prev:before,
[data-main="visual"] .swiper_next:before{width:11px; height:20px; margin:-10px 0 0 -5.5px;}
.visual_swiper_bottom{bottom:10%; justify-content:center; width:100%; min-width:inherit; padding:0px; background:transparent; text-align:center;}
.visual_swiper_bottom .swiper-pagination{position:static;}
.visual_swiper_bottom .swiper-pagination-bullet{opacity:1; width:11px; height:11px; margin:0 6px; background:#fff; box-shadow:0 0px 5px rgba(0,0,0,0.20);}
.visual_swiper_bottom .swiper-pagination-bullet-active{background:#ff7200;}
.visual_swiper_bottom .swiper_auto{width:30px;}
.visual_swiper_bottom .swiper_auto:not(.paused) span:before,
.visual_swiper_bottom .swiper_auto:not(.paused) span:after{width:3px; box-shadow:0 0px 5px rgba(0,0,0,0.20);}
.visual_swiper_bottom .swiper_auto span{width:13px;}

/* title */
[data-main="inform"] h3,
[data-main="service"] h3{font-size:38px; color:#222; letter-spacing:-1.5px; /* font-family:'Spoqa Han Sans Neo', Sans-serif; */ font-weight:500;}

/* TS소식, 공지배너 */
[data-main="inform"] .inr{display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; max-width:1400px; height:290px; padding:0 20px; margin:0 auto;}
[data-main="inform"] .inform_notice{flex:auto; position:relative; width:calc(100% - 350px); height:100%; box-sizing:border-box; padding:45px 5px 40px 0;}
[data-main="inform"] .inform_notice .tab_control{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; margin-top:0; padding-left:0;}
[data-main="inform"] .inform_notice .tab_control h4{visibility:hidden; position:absolute; padding-right:0; font-size:0; font-weight:500; color:#666; letter-spacing:-1px;}
[data-main="inform"] .inform_notice .tab_control h4 > a{display:inline-block; color:#666; transition:0.3s ease;}
[data-main="inform"] .inform_notice .tab_control h4.active > a{color:#007aad;}
[data-main="inform"] .inform_notice .list{display:none; width:100%; height:138px; margin-top:10px;}
[data-main="inform"] .inform_notice .list ul{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; height:100%; margin-left:-30px;}
[data-main="inform"] .inform_notice .list ul > li{flex:none; width:25%; height:100%; box-sizing:border-box; padding:0 30px; border-left:1px solid #e5e5e5;}
[data-main="inform"] .inform_notice .list ul > li:first-child{border-left-width:0px;}
[data-main="inform"] .inform_notice .list .new{display:inline-block; width:16px; height:16px; margin:-5px 5px 0 0; background:#ff7200; border-radius:100%; vertical-align:middle; text-indent:100%; overflow:hidden; white-space:nowrap;}
[data-main="inform"] .inform_notice .list .new:before{content:'N'; display:block; line-height:16px; font-family:'Segoe UI', Sans-serif; color:#fff; font-size:8px; font-weight:600; text-align:center; text-indent:0;}
[data-main="inform"] .inform_notice .list a{display:block; position:relative; height:100%;}
[data-main="inform"] .inform_notice .list em{display:block; padding-top:15px; font-size:19px; color:#000; letter-spacing:-1px; font-weight:500; line-height:1.5em; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis;}
[data-main="inform"] .inform_notice .list em i{box-shadow:none; transition:0.2s ease;}
[data-main="inform"] .inform_notice .list .sub{display:block; margin-top:5px; font-size:16px; color:#666; letter-spacing:-1px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
[data-main="inform"] .inform_notice .list .date{display:block; position:absolute; bottom:15px; font-size:16px; color:#999; font-weight:300; letter-spacing:-1px;}
[data-main="inform"] .inform_notice .list .no_data{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; width:100%; padding:0px !important; color:#adadad;}
[data-main="inform"] .inform_notice .list a:hover em i{box-shadow:0 -1px 0 rgba(0,0,0,0.4) inset;}
[data-main="inform"] .inform_notice a.btn_more{display:flex; flex-flow:column; justify-content:center; position:absolute; right:35px; top:50px; width:46px; height:46px; background:#fff; border:1px solid #cdcdcd; border-radius:100%; text-indent:100%; overflow:hidden; white-space:nowrap;}
[data-main="inform"] .inform_notice a.btn_more:before,
[data-main="inform"] .inform_notice a.btn_more:after,
[data-main="inform"] .inform_notice a.btn_more span{display:block; width:19px; height:2px; margin:0 auto; background:#999;}
[data-main="inform"] .inform_notice a.btn_more:before,
[data-main="inform"] .inform_notice a.btn_more:after{content:'';}
[data-main="inform"] .inform_notice a.btn_more span{margin-top:5px; margin-bottom:5px; text-indent:100%; overflow:hidden; white-space:nowrap;}
[data-main="inform"] .inform_banner{flex:none; position:relative; width:350px;}
[data-main="inform"] .inform_banner .list a{display:block;}
[data-main="inform"] .inform_banner .img{overflow:hidden; display:block; position:relative; padding-top:290px;}
[data-main="inform"] .inform_banner .img img{position:absolute; top:0px; left:50%; height:100%; transform:translateX(-50%);}
.info_swiper_bottom{justify-content:center; width:100%; background:rgba(0,0,0,0.5);}
.info_swiper_bottom .swiper_page{width:13%; text-align:center;}
.info_swiper_bottom .swiper_auto{width:24px; height:24px; margin-left:6px;}
.ie [data-main="inform"] .inform_notice .list em{height:3em;}

/* Quick Service */
[data-main="service"]{max-width:1400px; padding:0 20px; margin:10px auto 0px;}
[data-main="service"] .list:after{content:''; display:block; clear:both;}
[data-main="service"] .list{margin-left:-40px; margin-top:25px;}
[data-main="service"] .list > li{float:left; width:calc(100% / 5 - 40px); margin-left:40px;}
[data-main="service"] .list > li > a{overflow:hidden; display:flex; flex-flow:column wrap; justify-content:flex-end; align-items:center; position:relative; height:190px; background-color:#fff; border-radius:15px; box-shadow:5px 5px 16px rgba(0,0,0,0.2); /* font-family:'Spoqa Han Sans Neo', Sans-serif; */ font-size:22px; color:#222; letter-spacing:-0.5px; text-align:center; transform:translateY(0); transition:background 0.3s ease, color 0.3s ease, transform 0.5s ease;}
[data-main="service"] .list > li > a em{display:block; padding-bottom:15px;}
[data-main="service"] .list > li > a i{display:block; position:absolute; top:0px; left:50%; width:110%; height:70%; background-repeat:no-repeat; background-position:50% 0; border-radius:0 0 50% 50% / 45%; transform:translateX(-50%);}
[data-main="service"] .list [class*="link"]:before{content:''; display:block; position:absolute; top:35px; left:50%; z-index:3; width:56px; height:64px; background-repeat:no-repeat; background-position:50% 0; background-size:auto 100%; transform:translateX(-50%);}
[data-main="service"] .list .link01:before{background-image:url(../images/main/img_service_ico01.png);}
[data-main="service"] .list .link02:before{background-image:url(../images/main/img_service_ico02.png);}
[data-main="service"] .list .link03:before{background-image:url(../images/main/img_service_ico03.png);}
[data-main="service"] .list .link04:before{background-image:url(../images/main/img_service_ico04.png);}
[data-main="service"] .list .link05:before{background-image:url(../images/main/img_service_ico05.png);}
[data-main="service"] .list > li > a:hover,
[data-main="service"] .list > li > a:focus{background-color:#0079ce; color:#fff; transform:translateY(-20px);}


@media screen and (max-width:1850px){
	[data-main="visual"]{padding:0 3.2432432432432434vw;} /* 60px */
	[data-main="visual"] .img{height:36.75675675675676vw;} /* 680px */
}

@media screen and (max-width:1600px){
	[data-main="visual"]{padding:0 20px}
	[data-main="visual"] .img{height:40vw;} /* 640px */
}

@media screen and (max-width:1400px){
	[data-main="inform"] h3,
	[data-main="service"] h3{font-size:33px;}

	[data-main="inform"] .inform_notice .list em{font-size:17px;}
	[data-main="inform"] .inform_notice a.btn_more{width:40px; height:40px;}
}

@media screen and (max-width:1300px){
	[data-main="service"] .list{margin-left:-30px;}
	[data-main="service"] .list > li{width:calc(100% / 5 - 30px); margin-left:30px;}	
}

@media screen and (max-width:1220px){
	[data-main="inform"] .inform_notice .list ul{margin-left:-20px;}
	[data-main="inform"] .inform_notice .list ul > li{width:calc(100% / 3); padding:0 20px;}
	[data-main="inform"] .inform_notice .list ul > li:nth-of-type(4){display:none;}
	.ie [data-main="inform"] .inform_notice .list ul > li{width:calc(100% / 3 - 0.1px);}
	
	[data-main="service"] .list > li > a{font-size:20px;}
}

@media screen and (max-width:1100px){
	[data-main="visual"] .img{height:40vw;} /* 440px */
	
	[data-main="service"] .list{margin-left:-20px;}
	[data-main="service"] .list > li{width:calc(100% / 5 - 20px); margin-left:20px;}
	[data-main="service"] .list [class*="link"]:before{top:40px; width:45px; height:51px;}
}

@media screen and (max-width:1024px){
	[data-main="visual"] .swiper_prev,
	[data-main="visual"] .swiper_next{width:44px; height:44px; margin-top:-22px;}
	[data-main="visual"] .swiper_prev{left:15px;}
	[data-main="visual"] .swiper_next{right:15px;}
	
	[data-main="inform"] h3,
	[data-main="service"] h3{font-size:30px;}
	
	[data-main="inform"] .inform_notice{padding:20px 20px 20px 0;}
	[data-main="inform"] .inform_notice .list{height:auto; margin-top:0px;}
	[data-main="inform"] .inform_notice .list em{padding-top:0px; -webkit-line-clamp:1; font-size:16px; letter-spacing:-0.5px;}
	[data-main="inform"] .inform_notice .list .sub{font-size:15px;}
	[data-main="inform"] .inform_notice .list .date{position:static; margin-top:5px; font-size:15px; letter-spacing:-0.5px;}
	[data-main="inform"] .inform_notice .list ul{margin-left:0px;}
	[data-main="inform"] .inform_notice .list ul > li{width:100%; padding:10px 0; border-left-width:0px; border-bottom:1px solid #e5e5e5;}
	[data-main="inform"] .inform_notice .list ul > li:nth-of-type(3){border-bottom-width:0px;}
	[data-main="inform"] .inform_notice .list ul > li:nth-of-type(4){display:none;}
	[data-main="inform"] .inform_notice a.btn_more{top:23px; right:20px;}
	[data-main="inform"] .inform_notice .list .no_data{padding:7.8125vw 0px !important; /* 80px */ border-bottom-width:0px;}
	.ie [data-main="inform"] .inform_notice .list em{height:1.5em;}
	.ie [data-main="inform"] .inform_notice .list ul > li{width:100%;}
	
	[data-main="service"] .list > li > a{height:170px;}
	[data-main="service"] .list > li > a i{border-radius:0 0 60% 60% / 35%;}
	[data-main="service"] .list .link01:before{background-image:url(../images/main/img_service_ico01@x2.png);}
	[data-main="service"] .list .link02:before{background-image:url(../images/main/img_service_ico02@x2.png);}
	[data-main="service"] .list .link03:before{background-image:url(../images/main/img_service_ico03@x2.png);}
	[data-main="service"] .list .link04:before{background-image:url(../images/main/img_service_ico04@x2.png);}
	[data-main="service"] .list .link05:before{background-image:url(../images/main/img_service_ico05@x2.png);}
}

@media screen and (max-width:900px){
	[data-main="inform"] h3,
	[data-main="service"] h3{font-size:26px;}
	
	[data-main="inform"] .inr{height:283px;}
	[data-main="inform"] .inform_notice{width:calc(100% - 300px);}
	[data-main="inform"] .inform_banner{width:300px;}
	[data-main="inform"] .inform_banner .img{padding-top:249px;}
	[data-main="inform"] .inform_notice .list ul > li{padding:10px 0px;}
	[data-main="inform"] .inform_notice a.btn_more{width:35px; height:35px;}
	[data-main="inform"] .inform_notice a.btn_more:before,
	[data-main="inform"] .inform_notice a.btn_more:after,
	[data-main="inform"] .inform_notice a.btn_more span{width:15px;}
	[data-main="inform"] .inform_notice a.btn_more span{margin-top:3px; margin-bottom:3px;}
	
	[data-main="service"] .list > li > a{height:150px; font-size:17px;}
	[data-main="service"] .list > li > a i{height:63%;}
	[data-main="service"] .list [class*="link"]:before{top:25px; width:39px; height:45px;}
}

@media screen and (max-width:768px){
	[data-main="visual"],
	[data-main="inform"] .inr{padding:0 15px;}
	
	[data-main="service"] .list{margin-left:-15px;}
	[data-main="service"] .list > li{width:calc(100% / 5 - 15px); margin-left:15px;}
}

@media screen and (max-width:680px){
	[data-main="inform"] .inr{height:auto;}
	[data-main="inform"] .inform_banner{width:100%;}
	[data-main="inform"] .inform_banner .img{padding-top:calc(90% - 15px);}
	[data-main="inform"] .inform_notice{width:100%; height:auto; box-sizing:content-box; padding:30px 0 20px;}
	[data-main="inform"] .inform_notice a.btn_more{top:31px; right:5px;}
	[data-main="inform"] .inform_notice .list{margin-top:5px;}
	[data-main="inform"] .inform_notice .list .no_data{padding:11.76470588235294vw 0px !important; /* 80px */}
	
	[data-main="service"]{margin-top:30px;}
	[data-main="service"] .list{margin-top:0px;}
	[data-main="service"] .list > li{width:calc(100% / 3 - 15px); margin-top:15px;}
}

@media screen and (max-width:610px){
	[data-main="visual"] .img{height:auto; padding-top:125%;}
	[data-main="visual"] .img img{z-index:1; width:auto; height:100;}
	[data-main="visual"] .img i{display:block; height:100%;}	
}

@media screen and (max-width:420px){
	*[class*="swiper_bottom"]{padding:8px 10px;}
	
	[data-main="visual"] .swiper_prev{left:10px;}
	[data-main="visual"] .swiper_next{right:10px;}
	[data-main="visual"] .swiper_prev:before,
	[data-main="visual"] .swiper_next:before{width:9px; height:16px; margin:-8px 0 0 -5px;}
	.visual_swiper_bottom{bottom:8%;}
	
	[data-main="inform"] h3,
	[data-main="service"] h3{font-size:23px;}
	
	[data-main="inform"] .inform_notice .list em i{font-size:15px;}
	[data-main="inform"] .inform_notice .list .sub{font-size:14px;}
	[data-main="inform"] .inform_notice .list .date{font-size:13px;}
	[data-main="inform"] .inform_notice .list .no_data{padding:19.047619047619047vw 0px !important; /* 80px */}
	
	[data-main="service"] .list > li > a{height:120px;}
	[data-main="service"] .list > li > a em{padding-bottom:13px; font-size:15px;}
	[data-main="service"] .list [class*="link"]:before{top:20px; width:34px; height:38px;}
}

@media screen and (max-width:350px){
	.info_swiper_bottom .swiper_page{width:18%;}
	[data-main="service"] .list > li{width:calc(100% / 2 - 15px);}
}

@media screen and (max-width:320px){
	[data-main="visual"] .swiper_prev,
	[data-main="visual"] .swiper_next{width:35px; height:35px; margin-top:-17.5px;}
}

/* 레이어 팝업 공지 - 별도추가 */
.noticePop {
   z-index:99999; 
   position:absolute;
   background-color:#fff;
   display:none;
   width:auto;
   height:auto;
   box-sizing:border-box;
   padding:15px 15px 0;
   border:#000 solid 2px;
}
/* .noticePop > *:first-child{
   padding:15px
} */
.noticePop .bottom {
   line-height:30px;
   margin:15px -15px 0px;
   background:#000;
   text-align:right;
}
.noticePop .bottom *{
   color:#fff;
   padding-right:10px;
   vertical-align:middle;
}
@media screen and (max-width:1100px){
	.noticePop{top:70px !important; left:5% !important; width:90% !important; box-sizing:border-box;}
	.noticePop img{max-width:100% !important; width:auto !important;}
}