@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2018-03-27
******************************************************** */

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:800px; position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#mainVisual.full-height,
#fullpage #mainVisual{height:1000px;}

.main-slider-wrapper {
	position: relative;
	width: 100%;
	height: 100vh;
}
.main-slider-item {
	overflow: hidden;
	position: relative;
	height:100% !important;
}
.main-slider-item .slide-inner {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

/* 메인 비주얼 :: 이미지 */
.main-visual-img-con{position:relative; height:100%; width:100%; background-size:cover !important;}
.main-visual-prd-item{position:absolute; bottom:0px; left:0px; width:21.56%}
.main-visual-prd-item.right{left:auto; right:0; text-align:right;}
.main-visual-prd-item img{max-width:100%;}
.main-visual-img-con-m{display:none;}

/* 메인 비주얼 :: 텍스트 */
.main-visual-txt-con{position:absolute; top:50%; left:50%;  transform:translate(-50%,-50%); right:0; font-size:16px; color:#fff; /* color:rgba(255,255,255,0.8); */  color:rgba(255,255,255,0.9); letter-spacing:-0.3px; z-index:9; text-align:center; width:100%; word-break:keep-all}
.main-visual-txt-con .main-visual-txt1{font-weight:700; font-size:70px; letter-spacing:-0.25px; color:#fff; line-height:1.06; display:block;text-shadow: 2px 2px 0 black;}
.main-visual-txt-con .main-visual-txt2{font-weight:400; font-size:19px; letter-spacing:-0.65px; color:#fff; line-height:1.4; margin-top:20px; display:inline-block}
.main-visual-txt-con .main-visual-txt2 br{display:none}

/* 메인 비주얼 :: 텍스트 효과 */
.main-visual-txt-con .main-visual-txt1{opacity:0; transform:rotate(0deg) scale(0.066967) perspective(2000px); clip:rect(0px, 600px, 100px, 600px); transition:transform 0.8s, clip 0.8s, opacity 1.6s; transition-timing-function: ease-in-out; }
.main-visual-txt-con .main-visual-txt2{position: relative; height: 0; padding-top: 3%; width: 100%}
.main-visual-txt-con .main-visual-txt2 span{display: inline-block; transform: translateX(-50%) perspective(2000px); transition: opacity 1.8s, clip 1.5s ease-out;  clip:rect(0px, 300px, 100px, 300px); opacity: 0; position: absolute; top: 0; left: 50%; width: 100%; text-align: center; width:600px}

#mainVisual.on .main-visual-txt-con .main-visual-txt1{opacity:1; transform:rotate(0deg) scale(1) perspective(0); clip:rect(0px, 0, 0, 0)}
#mainVisual.on .main-visual-txt-con .main-visual-txt2 span{clip:rect(0px, 600px, 100px, 0px); opacity: 1}



/* 메인 비주얼 :: 컨트롤 */
.main-visual-control-box{position:absolute; bottom:0; left:0; right:0; z-index:11; margin-bottom:4.5%}

/* Arrow */
.main-visual-arrow{display:inline-block}
.main-visual-arrow > div{position:relative; right:0; left:0; display:inline-block; height:10px; margin:0; border:0; outline:0}
.main-visual-arrow .swiper-button-prev{margin-left:40px}
.main-visual-arrow .swiper-button-prev:after, .main-visual-arrow .swiper-button-next:after{content:""; width:21px; height:10px; background:url("../images/icon/main_arrow_icon.png"); display:inline-block; background-size:cover !important}
.main-visual-arrow .swiper-button-prev:after{transform:rotate(180deg)}
.main-visual-arrow .swiper-button-prev:before{position:absolute; display:inline-block; content:""; width:1px; height:11px; background:rgba(255,255,255,0.5); left:-23px; top:0}

/* bar */
.main-visual-num{position:relative; font-size:0; display:inline-block; width:245px; margin-left:30px; bottom:4px}
.main-visual-num .main-visual-conuter span{position:absolute; display:inline-block; font-size:14px; font-weight:400; color:#fff; padding-left:8px; top:0}
.main-visual-num .main-visual-conuter span.cur-num{left:0}
.main-visual-num .main-visual-conuter span.total-num{right:0}
.main-visual-loading-bar{width:186px; height:3px; display:inline-block; background:rgba(255,255,255,0.3); margin:6px 0 0 33px}
.main-visual-loading-bar span{display:block; width:0; height:3px; background-color: #fff}

/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:fixed; /*bottom:10%;*/bottom:100px; /*right:0; left:0;*/ text-align:center; z-index:9; left:50%; transform:translateX(-50%); margin-left:796px; width:165px; transition:bottom 0.3s}
.main-scroll-icon span{display:inline-block; color:#fff; font-weight:400; font-size:12px; letter-spacing:1px; position:relative; transform:rotate(90deg); right:-60px; bottom:60px}
.main-scroll-icon span em{display:inline-block; margin-right:45px }
.main-scroll-icon span img{display:inline-block; transform:rotate(-90deg)}

.fp-viewing-0 .main-scroll-icon{/*bottom:6%*/bottom:70px}

.fp-viewing-2 .main-scroll-icon,
.fp-viewing-4 .main-scroll-icon,
.fp-viewing-5 .main-scroll-icon{display:none}


/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-tit-box{word-break:keep-all}
.main-tit-box .main-tit{color:#040404; font-size:80px; font-weight:700; letter-spacing:0}
.main-tit-box .main-sub-tit{color:#666; font-size:19px; letter-spacing:-0.65px; font-weight:400; line-height:1.52; }

/* -------- 메인 컨텐츠 :: 컨텐츠1(PRODUCT) -------- */
#mainContent1{height:897px}
#mainContent1 .main-tit-box .main-tit{color:#000}
#mainContent1 .main-tit-box .main-sub-tit{margin-top:20px;}
.half-con{height:100%; position:relative}
.half-con > .main-con-sec{float:left; width:50%; height:100%;}


/* 왼쪽 */
.main-con1 > .main-con-sec.main-prd-lf{position:relative; z-index:2;}
.main-prd-lf .con-inner{padding:0 20px 0 195px; position:absolute; top:50%; transform:translateY(-50%); left:0; width:calc(100% - 215px)}
.main-prd-lf .con-inner .slider-prd-txt{margin-top:85px}
.main-prd-lf .con-inner .slider-prd-txt li{margin-bottom:15px}
.main-prd-lf .con-inner .slider-prd-txt li .inner{display:block; width:550px; position:relative; cursor:pointer}
.main-prd-lf .con-inner .slider-prd-txt li .inner:before,
.main-prd-lf .con-inner .slider-prd-txt li .inner:after{position:absolute; display:inline-block; content:""; opacity:0; transition:all 0.4s}
.main-prd-lf .con-inner .slider-prd-txt li .inner:before{/*width:calc(100% - 100px); height:1px; background-color:#0082cb; bottom:-2px; right:0;*/}
.main-prd-lf .con-inner .slider-prd-txt li .inner:after{/*width:24px; height:15px; background:url("../images/icon/blue_arrow.png"); background-size:cover !important; right:0; top:50%; transform:translateY(-50%);*/}
.main-prd-lf .con-inner .slider-prd-txt li .num,
.main-prd-lf .con-inner .slider-prd-txt li .name{display:inline-block; margin:0 -1px; vertical-align:middle; transition:all 0.3s}
.main-prd-lf .con-inner .slider-prd-txt li .num{width:87px; height:47px; border:1px solid #dcdcdc; box-sizing:border-box; text-align:center; line-height:47px; font-weight:400; font-size:14px; letter-spacing:0; color:#000}
.main-prd-lf .con-inner .slider-prd-txt li .name{width:calc(100% - 104px); padding-left:20px; font-weight:400; font-size:22px; letter-spacing:0; color:#000}


.main-prd-lf .con-inner .slider-prd-txt li.slick-current .inner .num{background-color:#0082cb; color:#fff}
.main-prd-lf .con-inner .slider-prd-txt li.slick-current .inner .name{color:#0082cb; font-weight:600}
.main-prd-lf .con-inner .slider-prd-txt li.slick-current .inner:before,
.main-prd-lf .con-inner .slider-prd-txt li.slick-current .inner:after{opacity:1}

/*
.main-prd-lf .con-inner .slider-prd-txt li a:hover .num{background-color:#0082cb; color:#fff}
.main-prd-lf .con-inner .slider-prd-txt li a:hover .name{color:#0082cb; font-weight:600}
.main-prd-lf .con-inner .slider-prd-txt li a:hover:before,
.main-prd-lf .con-inner .slider-prd-txt li a:hover:after{opacity:1}
*/


/* 오른쪽 */
.half-con > .main-con-sec.main-prd-rt{position:relative; transition-timing-function:cubic-bezier(.64,.045,.35,1); transition-duration:.55s; transform:scaleX(0); float:right; z-index:3; }
.main-prd-rt:after{position:absolute; content:""; width:100%; height:100%; right:0; top:0; background-color:#fff; transition-property:width; transition-delay:.4s; transition-timing-function:cubic-bezier(.64,.045,.35,1); transition-duration:.55s; z-index:9; opacity:1}
.main-prd-rt .prd-rt-wrap{position:absolute; top:0; left:0; width:100%; height:100%; }
.main-prd-rt .slider-prd-img{position:static}
.main-prd-rt .slider-prd-img,
.main-prd-rt .slider-prd-img .slick-list,
.main-prd-rt .slider-prd-img .slick-track{height:100%}
.main-prd-rt .slider-prd-img .prd-big-img{background-size:cover !important; display:block; width:100%; height:100%}
.main-prd-rt .slider-prd-img .slick-list{z-index:9}

.main-prd-rt .slider-prd-img .slick-dots{position:absolute; bottom:0; left:50%; transform:translate(-50%); z-index:999; width:595px; margin-bottom:3.7%; cursor:pointer; margin-left:-50%; opacity:0; transition:opacity 0.7s; transition-delay:1s;}
.main-prd-rt .slider-prd-img .slick-dots li{position:relative; float:left; margin:0 3px; border:1px solid rgba(255,255,255,0.3); width:110px}
.main-prd-rt .slider-prd-img .slick-dots li.slick-active:after,
.main-prd-rt .slider-prd-img .slick-dots li.slick-active:before{position:absolute; display:none; }
.main-prd-rt .slider-prd-img .slick-dots li.slick-active:after{content:""; width:100%; height:100%; background-color:#0082cb; top:0; left:0; opacity:0.8}
.main-prd-rt .slider-prd-img .slick-dots li.slick-active:before{content: "\e913"; font-family: xeicon; top:50%; left:50%; transform:translate(-50%,-50%); color:#fff; z-index:9; font-size:28px}
.main-prd-rt .slider-prd-img .slick-dots li img{max-width:100%}

#mainContent1.aos-animate .main-prd-rt{transform:scaleX(1); transform-origin:left top; transition-property:transform}
#mainContent1.aos-animate .main-prd-rt:after{width:0; opacity:1}
#mainContent1.aos-animate .main-prd-rt .slider-prd-img .slick-dots{opacity:1}


/* -------- 메인 컨텐츠 :: 컨텐츠2(APPLICATION) -------- */
.main-con2{position:relative}
/* 왼쪽 */
.main-app-lf{position:absolute; top:0; left:0; width:50%; height:100%}
.main-app-lf:after{position:absolute; display:inline-block; content:""; width:100%; height:100%; background:url("../images/main/main_app_bg2.jpg") no-repeat 50% 0; background-size:cover; top:0; left:0}
.main-app-lf .app-lf-inner{position:absolute; top:20%; left:0; transform:translateY(-50%); padding:0 0 0 175px; z-index:9}
.main-app-lf .app-lf-inner .main-tit-box .main-tit{color:#fff}
.main-app-lf .app-lf-inner .main-tit-box .main-sub-tit{color:#fff; margin-top:50px}
.main-app-lf{transition-timing-function:cubic-bezier(.64,.045,.35,1); transition-duration:.5s; transform:scaleX(0);}
.main-app-lf:before{position:absolute; content:""; width:100%; height:100%; right:0; top:0; background-color:#fff; transition-property:width; transition-delay:.4s; transition-timing-function:cubic-bezier(.64,.045,.35,1); transition-duration:.5s; z-index:9; opacity:1}

#mainContent2.aos-animate .main-app-lf{transform:scaleX(1); transform-origin:left top; transition-property:transform}
#mainContent2.aos-animate .main-app-lf:before{width:0; opacity:1}

/* 오른쪽 */
.main-app-rt{float:right; width:50%}
.app-menu-list{height:100%}
.app-menu-list li{float:left; width:50%; /*height:450px;*/ transition:background-color 0.4s; background-color:#fff}
.app-menu-list li:first-child,
.app-menu-list li:nth-child(4){background-color:#f0f0f0}
.app-menu-list li .inner{position:relative; display:block;}
.app-menu-list li .inner .app-menu-txt{padding:18.5% 15% 13%;  word-break:keep-all}
.app-menu-list li:first-child .inner-box{background:url("../images/main/main_app_icon_01.png") no-repeat}
.app-menu-list li:nth-child(2) .inner-box{background:url("../images/main/main_app_icon_02.png") no-repeat}
.app-menu-list li:nth-child(3) .inner-box{background:url("../images/main/main_app_icon_03.png") no-repeat}
.app-menu-list li:last-child .inner-box{background:url("../images/main/main_app_icon_04.png") no-repeat}
.app-menu-list li .inner-box{transition:all 0.4s; padding-bottom:30%; background-position:86% 80% !important; display:block}
.app-menu-list li .inner .app-menu-txt .tit{font-weight:500; font-size:32px; letter-spacing:-0.25px; color:#000; line-height:1.3; transition:all 0.4s}
.app-menu-list li .inner .app-menu-txt .explain{font-weight:400; font-size:19px; letter-spacing:-0.65px; color:#666; line-height:1.52; margin-top:30px; transition:all 0.4s}

@media all and (min-width:801px){	
	.app-menu-list li:hover{background-color:#0082cb}
	.app-menu-list li:hover .app-menu-txt .tit,
	.app-menu-list li:hover .app-menu-txt .explain{color:#fff}
	.app-menu-list li:hover:first-child .inner-box{background:url("../images/main/main_app_icon_01_on.png") no-repeat}
	.app-menu-list li:hover:nth-child(2) .inner-box{background:url("../images/main/main_app_icon_02_on.png") no-repeat}
	.app-menu-list li:hover:nth-child(3) .inner-box{background:url("../images/main/main_app_icon_03_on.png") no-repeat}
	.app-menu-list li:hover:last-child .inner-box{background:url("../images/main/main_app_icon_04_on.png") no-repeat}
}

.mc_tit  { text-align:center; text-transform:uppercase;}
.mc_etit { text-align:center; text-transform:uppercase;}
.mc_stit {text-align:center; text-transform:uppercase;}

/* 홍보영상 */
#video01Wrap .video01 {margin:40px 25px 0; }
#video01Wrap .video01 iframe {width:100%;height:48.6vw;}
@media all and (min-width:768px) {
	#video01Wrap .video01 {margin:85px 55px 0; }
    #video01Wrap .video01 iframe {height:48vw;}
}
@media all and (min-width:1200px) {
	#video01Wrap .video01 {width:700px;margin:60px auto 0; }
    #video01Wrap .video01 iframe {height:394px;}
}

#video02Wrap .video02 {margin:40px 25px 0; }
#video02Wrap .video02 iframe {width:100%;height:48.6vw;}
@media all and (min-width:768px) {
	#video02Wrap .video02 {margin:85px 55px 0; }
    #video02Wrap .video02 iframe {height:48vw;}
}
@media all and (min-width:1200px) {
	#video02Wrap .video02 {width:1200pxx;margin:60px auto 0; }
    #video02Wrap .video02 iframe {height:675px;}
}

/* 참여방법 */
#m_contents_03_wrap {width:100%; overflow:hidden; padding:35px 0 85px 0; /*background:#f6f6f6;*/ position:relative;}
.mc_03_etit {color:#ed1b23; font-size:14px; font-weight:700; margin-bottom:5px;}
.mc_03_tit  { line-height:35px; margin-bottom:15px; font-family: 'Noto Sans KR'; color:#fff; font-weight:700; font-size:25px; word-break:keep-all; }
.mc_03_stit {font-weight:300; font-size:16px; }

.m_contents_03 {max-width:505px; width:85%; margin:0 auto; overflow:visible; }
.howto-container {width:505px;}
.howto-container .swiper-slide {}
.howto-container .swiper-slide .howto_num {height:40px; line-height:40px; width:40px; margin:0 auto; background:#eb0000; /*border-radius:50%;*/ font-family: 'Poppins', sans-serif; color:#fff; text-align:center; font-weight:700; font-size:19px; position:relative; z-index:3}
.howto-container .swiper-slide .howto_card {height:330px; box-sizing:border-box; border-top:3px solid #eb0000; background:#fff; text-align:center; margin-top:-20px; position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:center;}

.howto_icon {height:78px;}
.howto_icon img {height:100%;}
.howto_tit {font-family: 'Noto Sans KR'; font-weight:600; font-size:21px; margin:40px auto 25px auto;}
.howto_con {opacity:0.7; font-size:16px; line-height:20px;}

.howto-prev { display:none; background:url('../images/howto-prev.jpg') no-repeat center center; width:45px; height:45px; left:50%; top:auto; bottom:0; margin-top:0; margin-left:-45px;}
.howto-next { display:none; background:url('../images/howto-next.jpg') no-repeat center center; width:45px; height:45px; right:auto; left:50%; top:auto; bottom:0; margin-top:0}

/* 태블릿용 CSS */
@media all and (min-width:768px){

/* 참여방법 */
.m_contents_03 {max-width:770px;}
.howto-container {width:770px;}
}

/* 낮은해상도 PC용 CSS */
@media all and (min-width:1250px){
/* 참여방법 */
#m_contents_03_wrap {padding:80px 0 50px 0; }
.mc_03_etit {font-size:20px;  margin-bottom:20px;}
.mc_03_tit  { margin-bottom:25px; font-size:40px; }
.mc_03_stit {font-weight:300; font-size:16px; }

.m_contents_03 {max-width:1400px; width:96%; }
.howto-container {width:100%; margin-top:40px}

.howto_icon {height:78px;}
.howto_icon img {height:100%;}
.howto_tit {font-family: 'Noto Sans KR'; font-size:21px; margin:40px auto 25px auto;}
.howto_con {opacity:0.8; height:100px;}

.howto-prev { display:none}
.howto-next { display:none}
}
/* cs center */
#m_contents_06_wrap {}
.mc_06_in {width:100%; height:145px; background:#16193a; display:flex; flex-direction:row; justify-content:center; align-items:center;}
.mc_06_in:first-child {background:#3ca8b8;}

.cs_tit {width:20%; display:flex; justify-content:center; align-items:center;}
.cs_tit img {height:48px}

.cs_con {width:78%;color:#fff;}
.cs_con_tit {font-size:17px;  font-family: 'Noto Sans KR';}
.cs_con_tit span {font-size:14px; display:block; opacity:0.8; }
.cs_con_noti {font-size:12px; display:block; margin-top:10px;}
.cs_num {font-family: 'Noto Sans KR';  font-size:27px; margin:10px 0}
.cs_time {max-width:350px}
.cs_time li {width:100%;  display:flex; justify-content:flex-start; align-items:flex-start; font-size:14px;}
.cs_time li p { letter-spacing:-1px; flex-grow:0; line-height:20px;}
.cs_time li p:first-child {margin-right:5px; min-width:57px}
.timetable {max-width:350px}
.timetable li {line-height:24px;}
.timetable li span { font-weight:400;  font-size:14px; font-family: 'Noto Sans KR'; display:inline-block;}
.timetable li span:first-child {width:35%;	}

/* 태블릿용 CSS */
@media all and (min-width:768px){
/* cs center */
#m_contents_06_wrap { max-width:1400px; margin:0 auto; overflow:hidden; }
.mc_06_in {float:left; width:50%; height:220px;}

.cs_tit {width:26%; }
.cs_tit img {height:68px}
.cs_con {width:72%;color:#fff;}
}

/* 낮은해상도 PC용 CSS */
@media all and (min-width:1250px){
/* cs center */
#m_contents_06_wrap { margin:0 auto; margin-top:0px; max-width:1400px;  overflow:hidden; }
.mc_06_in {float:left; width:50%; height:220px;}
.cs_con {width:78%;color:#fff;}
.cs_con_tit {font-size:19px; }
.cs_con_tit span {font-size:14px; display:inline-block; margin-left:15px;}
.cs_num {font-family: 'GyeonggiTitleM';  font-size:27px; margin:15px 0}
.cs_time {max-width:350px}
.cs_time li {width:100%;  display:flex; justify-content:flex-start; align-items:flex-start; font-size:16px;}
.cs_time li p { letter-spacing:-1px; flex-grow:0;}
.cs_time li p:first-child {margin-right:5px; min-width:57px}
.timetable {margin-top:20px}
.timetable li {line-height:24px;}
.timetable li span { font-size:16px;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠3(TECHNOLOGY) -------- */
#mainContent3{background:url("../images/main/main_technology_bg.jpg") no-repeat 50% 0; background-size:cover; position:relative; height:896px}
.technology-inner{position:absolute; top:50%; left:0; transform:translateY(-50%) perspective(2000px); padding-left:200px; width:1300px}
.technology-inner .main-tit-box .sub-txt{display:block; font-weight:600; font-size:18px; letter-spacing:-0.25px; color:#fff; margin-bottom:15px}
.technology-inner .main-tit-box .main-tit{color:#fff}
.technology-inner .main-tit-box .main-sub-tit{color:#fff; margin-top:70px;}
.technology-inner .main-tit-box .more-view-btn{display:inline-block; width:235px; height:68px; line-height:68px; text-align:center; background-color:#fff; font-weight:600; font-size:15px; letter-spacing:0; color:#000; margin-top:40px}
.technology-inner .main-tit-box .more-view-btn em{display:inline-block; width:24px; height:15px; background:url("../images/icon/black_arrow.png") no-repeat; background-size:cover !important; margin-left:32px; vertical-align:middle; position:relative}

#mainContent3 .technology-inner{clip: rect(0px, 0, 500px, 0); opacity: 0; transition: all 2s}
#mainContent3.aos-animate .technology-inner{clip: rect(0px, 1300px, 500px, 0); opacity: 1}

@media all and (min-width:801px){	
	.technology-inner .main-tit-box .more-view-btn:hover em{animation: movearrow 0.9s ease-in-out; animation-iteration-count: infinite;}
}
@keyframes movearrow {
	  0% {
		left:0
	  }
	  50% {
		left:-4%
	  }
	  100% {
		left:0
	  }
	}


/* -------- 메인 컨텐츠 :: 컨텐츠4(NEWS) -------- */
.main-news-inner{max-width:1300px; margin:0 auto; position:relative; padding:130px 0 135px}
.main-news-con{position:relative; padding-top:165px}
.main-news-con .main-tit-box{text-align:center; margin-bottom:45px; position:absolute; width:400px; top:0; left:50%; text-align:center; clip:rect(0px, 200px, 180px, 200px); opacity: 0; transform:perspective(2000px) translateX(-50%); transition:all 0.8s}
.main-news-con .main-tit-box .main-tit{font-size:90px; margin-bottom:15px}

#mainContent4.aos-animate .main-tit-box{clip:rect(0px, 400px, 180px, 0px); opacity: 1}


.main-news-list .bbs-item > a{display:block; position:relative; padding:30px 70px 30px 30px; height:90px; border-bottom:1px solid #e3e3e3; background-color:#fff; transition:all 0.3s}
.main-news-list .bbs-item:first-child > a{border-top:1px solid #000}
.main-news-list .bbs-item .news-category{position:absolute; top:50%; transform:translateY(-50%); /*left:40px; width:85px; height:34px; line-height:34px;*/ text-align:center; border:1px solid #808080; box-sizing:border-box; font-weight:400; font-size:15px; letter-spacing:-0.65px; color:#000; transition:all 0.3s; padding:8px 0}
.main-news-list .bbs-item .bbs-list-info-con{margin:0 0 0 0;}
.main-news-list .bbs-item .bbs-subject-box{display:block; position:relative; padding:0 30px 0 0; margin-bottom:10px } 
.main-news-list .bbs-item .bbs-subject-txt-box{display:inline-block; position:relative; max-width:100%; }
.main-news-list .bbs-item .bbs-subject-txt{display: block; padding-right: 5px; width: 100%; font-size:22px; font-weight:500; line-height:1.1; vertical-align:middle; color:#000; letter-spacing:-0.25px; transition:all 0.3s}
.main-news-list .bbs-item .bbs-list-info-con .notice-tit{display:inline-block; vertical-align:middle; border:1px solid #34bdd7; height:25px; line-height:25px; border:1px solid #34bdd7; padding:0 15px; font-size:14px; letter-spacing:-0.5px; color:#34bdd7; margin-right:10px;}
.main-news-list .bbs-item .bbs-subject-txt .category{font-weight:500; color:#34bdd7; margin-right:5px; }
.main-news-list .bbs-item .bbs-list-info-con .bbs-list-sub-txt{font-weight:400; color:#666; font-size:16px; letter-spacing:-0.65px; line-height:1.5; margin-bottom:20px}
.main-news-list .bbs-item .bbs-list-info-con .main-news-date{font-weight:400; font-size:14px; letter-spacing:0; color:#666}
.main-news-list .bbs-item .bbs-list-info-con .main-news-date i{margin-right:5px; font-size:18px; color:#818181; vertical-align:middle; margin-top:-4px}
.main-news-list .bbs-item .main-news-thum{position:absolute; top:30px; right:70px; text-align:right; width:144px}
.main-news-list .bbs-item .main-news-thum span{position:relative; display:block; padding-top:61%}
.main-news-list .bbs-item .main-news-thum span img{position:absolute; top:0; left:0; width:100%; height:100%}

.main-news-con .more-view-btn{position:absolute; right:0; top:47px; font-weight:600; font-size:15px; letter-spacing:0; color:#0082cb}
.main-news-con .more-view-btn .arrow{display:inline-block; margin-left:11px; width:25px; height:14px; background:url("../images/icon/blue_arrow.png") no-repeat; background-size:cover !important; vertical-align:top}

@media all and (min-width:801px){
	.main-news-list .bbs-item a:hover{background-color:#f6f6f6}
	.main-news-list .bbs-item a:hover .news-category{border-color:#000; background-color:#000; color:#fff}
	.main-news-list .bbs-item a:hover .bbs-subject-txt{color:#0082cb}
	.main-news-con .more-view-btn:hover{animation: move 0.9s ease-in-out; animation-iteration-count: infinite;}
}
@keyframes move {
	  0% {
		margin-right:0;
	  }
	  50% {
		margin-right:1%;
	  }
	  100% {
		margin-right:0;
	  }
	}


/* ******************  메인 오른쪽 퀵메뉴 ********************** */
#rightBar{position:fixed;z-index:99; transition:all 0.5s cubic-bezier(0.47, 0, 0.745, 0.715); top: 50%; left:70px; transform:translateY(-50%); width:33px}
#rightBar > ul {}
#rightBar > ul > li{position:relative; margin:30px 0;}
#rightBar > ul > li > a{display:block; position:relative; box-sizing:border-box; padding:5px;}
#rightBar > ul > li > a span{position:relative; display:block; width:5px; height:5px; background-color:#fff; border-radius:50%; opacity:0.55;filter:Alpha(opacity=50);}
#rightBar > ul > li > a span:after{position:absolute; display:inline-block; content:""; width:33px; height:33px; border:1px solid #fff; border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); opacity:0; transition:all 0.2s}
#rightBar > ul > li.active a span{opacity:1.0;filter:Alpha(opacity=100);}
#rightBar > ul > li.active a span:after{opacity:1}
#rightBar > ul.bk-bar li a span{background-color:#343434}
#rightBar > ul.bk-bar li a span:after{border-color:rgba(52,52,52,0.3)}
/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
#fp-nav{
	position: fixed;
    z-index: 100;
    margin-top: -32px;
    top: 50%;
	left:80px;
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
}
#fp-nav ul li{position:relative; margin:30px 0;}
#fp-nav ul li:last-child{display:none} /* 마지막 섹션이 footer일경우 */
#fp-nav ul li a{display:block; position:relative; box-sizing:border-box; padding:5px; }
#fp-nav ul li a span{position:relative; display:block; width:5px; height:5px; background-color:#fff; border-radius:50%; opacity:0.55;filter:Alpha(opacity=50);}
#fp-nav ul li a span:after{position:absolute; display:inline-block; content:""; width:33px; height:33px; border:1px solid #fff; border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); opacity:0; transition:all 0.2s}
#fp-nav ul li .fp-tooltip{display:none}
#fp-nav ul li a.active span{opacity:1.0;filter:Alpha(opacity=100);}
#fp-nav ul li a.active span:after{opacity:1}


/* Black Style */
#fp-nav.black ul li a span{background-color:#343434}
#fp-nav.black ul li .fp-tooltip{color:#222;}
#fp-nav.black ul li a span:after{border-color:rgba(52,52,52,0.3)}