@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2020-11-25
******************************************************** */

/* ******************  메인 레이아웃(Fullpage) ********************** */
#fullpage #mainVisual{height:100vh}
@media all and ( min-width: 1025px ) and (max-height: 750px) {
	#fullpage .section:not(#mainFooter){min-height:750px;}
	#fullpage .section .fp-tableCell{height:100% !important;}
}

/* ******************  메인 비주얼 ********************** */


/* ******************  메인 컨텐츠 :: Business ********************** */
#mainBusinessCon {position:relative; padding:0;}
#mainBusinessCon .main-tit-box {display:flex; align-items: center;}
#mainBusinessCon .main-tit-box .main-sub-tit {margin-left: 60px; }
.main-business-con {margin-top:27px;}
/* 아코디언 */
.accordion-list-box{margin:0 auto;  }
.accordion-list .accordion-item {position:relative; overflow:hidden; }
.accordion-list .accordion-item:not(.active) {cursor:pointer;}
.accordion-list .accordion-item .accordion-inner {display:block; position:relative; height:100%; margin:0; background-size:cover !important; transition: all 0.4s;}
.accordion-list .accordion-item .accordion-inner:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.3); opacity:1; transition: opacity 0.3s;}
.accordion-list .accordion-item.active .accordion-inner:before {opacity:0;}

/* 아코디언  :: 타이틀 및 내용 */
.accordion-item .accordion-inner .accordion-tit{
	position:absolute; top:50%; 
	color:#fff; font-size:31px; line-height:1.35; font-weight:600; 
	width:100%; 
	text-align:center; 
	z-index:1;
	opacity:1.0;filter:Alpha(opacity=100);
	transition:all 0.3s;
	transform: translateY(-50%);
}
.accordion-item .accordion-info-box{position:absolute; left:0; bottom:0px;  pointer-events: none;width: 80%;} 
.accordion-item.active .accordion-info-box {pointer-events:auto;}
.accordion-item .accordion-info-box:before{
	position:absolute; 
	bottom:-2px; left:0px; 
	width:0; height:183px; 
	background:url(../images/fwbg.png) 0 0 no-repeat; background-size:100% 100%;border-radius:0 0.2rem 0 0;
	content:""; 
	-webkit-transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
	-ms-transition:all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out; 
	z-index:1;
}
.accordion-item .accordion-info-box dl{
	position:relative; z-index:1; 
	padding:0 40px 6px; 
	opacity:0;filter:Alpha(opacity=0); 
	color:#fff; 
	-webkit-transition-delay:0s; 
	-moz-transition-delay:0s; 
	-o-transition-delay:0s; 
	-ms-transition-delay:0s; 
	transition-delay:0s; 
	z-index:1;
}
.accordion-item .accordion-info-box .inner-box {position:relative; display:table; width:100%; height:183px;}
.accordion-item .accordion-info-box dl {display:table-cell; vertical-align:middle;}
.accordion-item .accordion-info-box dl dt{font-size:.2rem; line-height:1.3; font-weight:500; letter-spacing:-0.25px; margin-bottom:0.1rem;white-space:normal;}
.accordion-item .accordion-info-box .btn-box { min-width:190px;}
.accordion-item .accordion-info-box .btn-box span {position:relative; min-width:190px; font-size:0.11rem; color: #fff;margin-right: 8px; font-weight:500; transition: color 0.3s; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; line-height:1.5}

.accordion-item .accordion-inner .more-btn{
	
}

/* 아코디언 :: 타이틀 및 내용 Active */
.accordion-item.active .accordion-inner:after{opacity:0;filter:Alpha(opacity=0); }
.accordion-item.active .accordion-inner .accordion-tit{
	opacity:0;filter:Alpha(opacity=0);
	transition:all 0s;
}
.accordion-item.active .accordion-info-box:before{width:100%; opacity:1.0;filter:Alpha(opacity=100);}
.accordion-item.active .accordion-inner dl{ 
	opacity:1.0;filter:Alpha(opacity=100);  
	-webkit-transition:all 0.3s 0.2s; 
	-moz-transition:all 0.3s 0.2s; 
	-o-transition:all 0.3s 0.2s; 
	-ms-transition:all 0.3s 0.2s; 
	transition:all 0.3s 0.2s; 
}
.accordion-item.active .accordion-inner .more-btn{ display:block; width:1rem; height:0.24rem; border:1px solid #fff; color:#fff; line-height:0.24rem;border-radius: 0.12rem; text-align:center; margin-top:0.1rem;transition:all 0.3s;
}
.accordion-item.active .accordion-inner .more-btn:hover{ background:#fff; color:#ea002c}
	
/* ******************  메인 컨텐츠 :: History ********************** */
#mainHistoryCon {padding:146px 0 90px; background:url("/images/main/main_history_bg.jpg") center no-repeat; background-size:cover;}
#mainHistoryCon .main-tit-box .main-tit {color: #fff;}
#mainHistoryCon .main-history-slide-box {overflow:visible; height:470px; padding-bottom:90px; margin-top:27px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
/* 슬라이드 */
.main-history-slide {margin:0 -15px;}
.main-history-slide li {width:440px; height:auto; margin:0 15px; transition: all 0.4s;}
.main-history-slide li.swiper-slide-prev ,
.main-history-slide li.swiper-slide-next ,
.main-history-slide li.swiper-slide-next + li + li {margin-top:50px;}
.main-history-slide li a {display:block; height:330px; padding:50px 40px 55px; border:2px solid rgba(255,255,255,0.7); color: #fff; transition: all 0.4s, color 0.1s; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box;}
.main-history-slide li a .year-box {border-bottom:2px solid #999da1; padding-bottom:20px; transition: all 0.4s; }
.main-history-slide li a .year-box .year {font-size:42px; letter-spacing: -0.0238em;}
.main-history-slide li a .txt {position:relative; padding-left:10px; color: rgba(255,255,255,0.7); font-size:19px; line-height:1.47; margin-top:15px; transition: all 0.4s; } 
.main-history-slide li a .txt:first-child {margin-top:18px;}
.main-history-slide li a .txt:before {content:""; display:block; position:absolute; left:0; top:0.65789em; width:3px; height:3px; background:rgba(255,255,255,0.5); transition: all 0.4s; }
/* 화살표 */
.main-history-controls {display:flex; align-items:center; position:absolute; bottom: 25px; font-size:20px; color: rgba(255,255,255,0.6);}
.main-history-controls .swiper-button-play {font-size:20px; color: rgba(255,255,255,0.6); margin:0 15px;}
.main-history-controls .swiper-button-play.pause i:before {content:"\ea3e";}
.main-history-controls > * {cursor:pointer;}
/* 스크롤바 */
.main-history-slide-box.swiper-container-horizontal > .swiper-scrollbar {width:100%; height:5px; bottom:5px; left:50%; transform:translateX(-50%); background-color: #1b2634;  border-radius:0;  }
.main-history-slide-box.swiper-container-horizontal .swiper-scrollbar-drag { background-color: #bbbec2; height:5px; top:0; border-radius:0; cursor:pointer;}

@media all and (min-width:801px){
	.main-history-slide li a:hover {background:#fff; color: #111;}
	.main-history-slide li a:hover .year-box {border-bottom-color:#333;}
	.main-history-slide li a:hover .txt {color: #000;}
	.main-history-slide li a:hover .txt:before {background-color:rgba(22,22,22,0.5);}
}


/* ******************  메인 컨텐츠 :: About ********************** */
#mainAboutCon {padding:115px 0 70px;}
.main-about-con .main-tit-box {float:left; width:42.31%; margin-top:162px; padding-right: 15px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
.main-about-con .main-tit-box .main-sub-tit {margin-top:40px;}
.main-about-con .con-box {float:left; width:57.69%;}
.main-about-con .con-box .main-about-item { float:left; position:relative; width:47.66%;}
.main-about-con .main-about-item .bg {display:block; position:relative; padding-top:116.55%; background-size:cover;}
.main-about-con .main-about-item.item01 {margin-top:98px;}
.main-about-con .main-about-item.item01 .bg {background-image:url("/images/main/main_about_img_01.jpg");}
.main-about-con .main-about-item.item02 {margin-left: 4.66%;}
.main-about-con .main-about-item.item02 .bg {background-image:url("/images/main/main_about_img_02.jpg");}
.main-about-con .main-about-item .txt-box {position:absolute; top:60px; left:45px; right:45px; bottom:60px; color: #fff;}
.main-about-con .main-about-item .txt-box .tit {font-size:32px; line-height:1.3;}
.main-about-con .main-about-item .txt-box .arrow {display:block; width:54px; height:54px; border:2px solid rgba(255,255,255,0.7); text-align:center; margin-top:30px; color: rgba(255,255,255,0.7); transition: all 0.4s;}
.main-about-con .main-about-item .txt-box .arrow i {font-size:20px; line-height:54px; }


/* ******************  메인 컨텐츠 :: News ********************** */
#mainNewsCon {position:relative; padding:152px 0 103px;}
#mainNewsCon .main-deco-box { top:0; bottom:auto; text-align:left;}
.main-news-slide-box.swiper-container-horizontal {margin-top:66px; padding-bottom: 65px;}
.main-news-con .main-tit-box .main-tit {display:block; text-align:center;}
.main-news-con .main-news-item .txt-box .new {display:block; width:48px; height:21px; text-align:center; font-size:12px; line-height:21px; color: #e41f44; border:1px solid #e41f44; transition: all 0.4s;}
.main-news-con .main-news-item .txt-box .tit {display:block; font-size:25px; color: #333; line-height:1.28; margin-top:13px; transition: color 0.4s;}
.main-news-con .main-news-item .txt-box .date {display:block; font-size:16px; color: rgba(51,51,51,0.5); margin-top:13px;}
.main-news-con .main-news-item .img-box {display:block; position:relative; padding-top:57.37%; margin-top:30px;}
/* 스크롤바 */
.main-news-slide-box.swiper-container-horizontal > .swiper-scrollbar { width:100%; height:5px; bottom:5px; left:50%;  border-radius:0;  transform:translateX(-50%); background-color: #ebebeb;  }
.main-news-slide-box.swiper-container-horizontal .swiper-scrollbar-drag { background-color: #e41f44; height:5px; top:0; border-radius:0; cursor:pointer;}


/* ******************  메인 컨텐츠 :: Banner ********************** */
#mainBannerCon {position:relative; padding-bottom:106px;}
#mainBannerCon .main-deco-box {margin-bottom:-176px;}
.main-banner-slide {margin:0 -20px;}
.main-banner-slide li {margin:0 20px;}
.main-banner-slide li .img-wrap {position:relative; padding-top:50.65%; display:block; }
.main-banner-slide .slick-arrow {position:absolute; top:50%; transform:translateY(-50%); width:74px; height:73px; background-color:#fff; font-size:20px; color: rgba(143,153,169,0.7); border-radius:20px; z-index:99; box-shadow:5px 0px 30px rgba(33, 37, 44, 0.2);}
.main-banner-slide .slick-arrow.slick-prev {left:20px; margin-left:-126px; }
.main-banner-slide .slick-arrow.slick-next {right:20px; margin-right:-126px;}


@media all and (max-width:1917px) and (min-width:1025px){
/* 	.main-banner-slide .slick-arrow.slick-prev { margin-left: -5.2083vw;}
	.main-banner-slide .slick-arrow.slick-next { margin-right: -5.2083vw;} */
	.main-banner-slide { padding:0 6.4684vw; margin:0 -1.0433vw;}
	.main-banner-slide li {margin:0 1.0433vw;}
	.main-banner-slide .slick-arrow  {width:3.8602vw; height:3.8080vw; font-size:1.0433vw; border-radius:1.0433vw}
	.main-banner-slide .slick-arrow.slick-prev {; margin-left:0; }
	.main-banner-slide .slick-arrow.slick-next { margin-right:0;}
}
@media all and (max-width:1024px){
	.main-banner-slide {margin:0 -10px;}
	.main-banner-slide li {margin:0 10px;}
	.main-banner-slide .slick-dots {text-align:center; margin-top:35px;}
	.main-banner-slide .slick-dots li {display:inline-block; margin:0 7px;}
	.main-banner-slide .slick-dots button {width:17px; height:17px; background-color: #d9d9d9; border-radius:6px; font-size:0;}
	.main-banner-slide .slick-dots li.slick-active button {background-color: #e41f44;}
	#mainBannerCon .main-deco-box  {bottom:0; margin-bottom:0;}
	#mainBannerCon .main-deco-box img {width:100px;}
}
@media all and (max-width:800px){
	#mainBannerCon {padding-bottom:72.5px;}
	.main-banner-slide {margin:0;}
	.main-banner-slide li {margin:0;}
	.main-banner-slide .slick-dots {margin-top:17.5px;}
	.main-banner-slide .slick-dots li {margin:0 5px;}
	.main-banner-slide .slick-dots button {width:8px; height:8px; border-radius:3px;}
}