@charset "utf-8";

.quickmenu{top:320px;}

.innerWrap {position:relative;max-width: 1440px;margin:0 auto;} 
@media only screen and (max-width: 1490px){ 
	.innerWrap  {width: 100% !important;padding-left: 100px !important;padding-right: 100px !important;max-width: inherit;}
}
@media only screen and (max-width: 1080px){ 
	.innerWrap  {width: 100% !important;padding-left: 25px !important;padding-right: 25px !important;max-width: inherit;}
}
@media only screen and (max-width: 768px){ 
	.innerWrap {padding-left: 20px !important;padding-right: 20px !important;}
}
@media only screen and (max-width: 480px){ 
	.innerWrap {padding-left: 15px !important;padding-right: 15px !important;}
}


/* 비주얼 */
#mainVisual{position: relative;width: 100%;height: 67vh;}	
.vis_con {overflow: hidden;position: absolute;top: 0;left: 50%;width: 100%;height: 100%;transform: translateX(-50%);z-index:1;}
#mainVisual.on .vis_con {border-radius: 16px;height: 67vh;width: calc(100% - 200px); transition: all 1.3s ease;}
.vis_con .visual_div {overflow: hidden;position: absolute;top: 0px;left: 50%;width: 100%;height: 100%;transform: translateX(-50%);}
.vis_con .visual_div .swiper-wrapper {height: 100%;}
.vis_con .swiper-slide {overflow: hidden;position: relative;}
.vis_con .swiper-slide .visImg{position: absolute;top: 0;left: 0;width:100%;height:100%;}
.vis_con .swiper-slide .img_pc,
.vis_con .swiper-slide .img_m{width:100%;height:100%;background-color: #000; transition:transform 5000ms ease-in-out;}
.vis_con .swiper-slide .img_m{display:none;}
.vis_con .swiper-slide .visImg > div video,
.vis_con .swiper-slide .visImg > div img{width: 100%; height: 100%; object-fit: cover;}

.vis_con .txt_area {position: absolute;top: 50%;left: calc((100% - 1440px) / 2);width: 820px;opacity: 0;  transition: all 1.25s 0.8s ease;z-index: 2; }
.vis_con .txt_area .title {color: #fff;font-size: 6rem;font-weight: 700;line-height: 7rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.vis_con .txt_area .txt_wrap {margin-top: 40px;}
.vis_con .txt_area .txt_wrap .txt_div {display: flex;flex-direction: column;align-items: flex-start;margin-top: 12px;}
.vis_con .txt_area .txt_wrap .txt_div:first-child {margin-top: 0;}
.vis_con .txt_area .txt_wrap .txt_div .txt {color: #fff;word-break: break-all;font-size: 2rem;opacity: .8;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.vis_con .txt_area .txt_wrap .txt_div .btn {position: relative; overflow: hidden; color: #fff;font-size: 1.8rem;border-radius: 5rem;line-height: 3.4rem;text-align: center;padding: 0 4rem;border:1px solid #fff;margin-top:4rem;}
.vis_con .txt_area .txt_wrap .txt_div .btn span{z-index: 1; position: relative;}
.vis_con .txt_area .txt_wrap .txt_div .btn:after {content:'';display:block;position:absolute;left:0;bottom:0;width:0;height:100%;background:#fff;margin: 0;opacity:0.15; z-index:0;transition: all .3s ease-in-out;}
.vis_con .txt_area .txt_wrap .txt_div .btn:hover:after,
.vis_con .txt_area .txt_wrap .txt_div .btn:focus:after{width:100%;}

#mainVisual.on .vis_con .swiper-slide.swiper-slide-active .txt_area{top: 30%;opacity: 1;} 

/* controls */
.vis_con .swiper-button-next:after, .vis_con .swiper-button-prev:after{ display: none;}
.vis_con .swiper-button-next {right: 40px; top: auto; margin-top: 0; bottom: -40px; width: 32px; height: 32px; background: url("../images/main/btn-main-visual-next.svg") no-repeat center center; opacity: 0; transition: bottom .5s ease, opacity .5s ease; transition-delay: 1.5s;}
.vis_con .swiper-button-prev {left: auto; right: 88px; top: auto; margin-top: 0; bottom: -40px; width: 32px; height: 32px; background: url("../images/main/btn-main-visual-prev.svg") no-repeat center center; opacity: 0; transition: bottom .5s ease, opacity .5s ease; transition-delay: 1.5s;}
.vis_con .swiper-pagination {left: 50%; transform: translateX(-50%); bottom: -30px; font-size: 0; opacity: 0; transition: bottom .6s ease, opacity .6s ease; transition-delay: 1.5s;}
.vis_con .swiper-pagination-current {position: relative; left: -173px; font-size: 16px; color: #fff;}
.vis_con .swiper-pagination-total {position: relative; left: 145px; font-size: 16px; color: rgba(255, 255, 255, .2); font-family: "GeneralSans_SemiBold", sans-serif;}
.vis_con .control_area {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); padding-right: 30px; width: auto; opacity: 0; transition: bottom .7s ease, opacity .7s ease; transition-delay: 1.5s;}
.vis_con .control_area .num_div {display: flex;align-items: center;}
.vis_con .control_area .current_num {font-size: 16px; color: #fff; font-family: "NotoSans_Bold", sans-serif;}
.vis_con .control_area .total_num {font-size: 16px; color: rgba(255, 255, 255, .2); font-family: "NotoSans_Bold", sans-serif;}

.vis_con .control_area .swiper-progress-bar {position: relative; margin: 0 10px; width: 300px; height: 1px; background: rgba(255, 255, 255, .3);}
.vis_con .control_area .swiper-progress-bar .slide_progress-bar {position: absolute;top: 0;left: 0;width: 0;height: 100%;background: #fff; transition: 0.1s width linear;}
.vis_con .control_area .swiper-progress-bar.active .slide_progress-bar{transition: width linear; transition-delay: unset; width: 100%; transition-duration: 4s;}

/* 슬라이드 프로그레스 바 
.vis_con .control_area .swiper-progress-bar {position: relative; margin: 0 10px; width: 300px; height: 1px; background: rgba(255, 255, 255, .3);}
.vis_con .control_area .swiper-progress-bar .slide_progress-bar {position: absolute;width: 100%;height: 2px;background: rgb(0 0 0 / 20%);clear: both;opacity: 0;
bottom: 0;left: 0;right: 0;top: 50%;transform: translate(0px, -50%);}
.vis_con .control_area .swiper-progress-bar .slide_progress-bar:after {position: absolute;top: 0;left: 0;background: #fff;height: 100%;width: 0;content: "";transition: 0.01s height linear;}

 슬라이드 프로그레스 바 에니메이션 
.vis_con .control_area .swiper-progress-bar.active .slide_progress-bar {opacity: 1;}
.vis_con .control_area .swiper-progress-bar.animate .slide_progress-bar:after {transition: width linear;transition-delay: unset;width: 100%;transition-duration: 4s;}*/


.vis_con .control_area .visual_btn {position: absolute;top: -10px;right: -10px;width: 20px;height: 20px;font-size: 1px;z-index: 1;}
.vis_con .control_area .visual_btn {background: url("../images/main/btn-main-visual-pause.svg") no-repeat center center;}
.vis_con .control_area .visual_btn.on  {background: url("../images/main/btn-main-visual-play.svg") no-repeat center center;}
#mainVisual.on .vis_con .swiper-button-next,
#mainVisual.on .vis_con .swiper-button-prev {bottom: 40px; opacity: 1;}
#mainVisual.on .vis_con .swiper-pagination {bottom: 44px; opacity: 1;}
#mainVisual.on .vis_con .control_area {bottom: 55px;opacity: 1;z-index:10;}

@media screen and (max-width: 1680px) {
	.vis_con .txt_area {width: 70%;left: 100px;}
}
@media only screen and ( max-width: 1350px ){	
	#mainVisual.on .vis_con {width: calc(100% - 100px);}
}
@media only screen and ( max-width: 1080px ){	
	#mainVisual{margin-bottom: 0;height: 80vh;}
	.vis_con{top:0px;}
	#mainVisual.on .vis_con {top: 0;height: 100%;width: calc(100% - 50px);}
	.vis_con{height: calc(100vh - 100px);}
	
	.vis_con .txt_area {width: 100%;left: 50px;}
	.vis_con .txt_area .title{font-size: 4rem;line-height: 5rem;}
	.vis_con .txt_area .txt_wrap{margin-top: 2.0rem}
	.vis_con .txt_area .txt_wrap .txt_div .txt{font-size: 1.85rem;}
	.vis_con .txt_area .txt_wrap .txt_div .btn{font-size: 1.6rem;margin-top: 3rem;line-height: 3rem;padding: 0 4rem;}
	#mainVisual.on .vis_con .swiper-button-next, #mainVisual.on .vis_con .swiper-button-prev { display:none;}
	#mainVisual.on .vis_con .swiper-pagination {bottom: 2.5rem;opacity: 1;}
	#mainVisual.on .vis_con .control_area {bottom: 3.6rem; opacity: 1;}
	.vis_con .swiper-pagination-current {left: -99px; font-size: 1.4rem;}
	.vis_con .swiper-pagination-total {left: 70px; font-size: 1.4rem;}
	.vis_con .control_area .swiper-progress-bar{ width:150px;}
}
@media only screen and ( max-width: 768px ){		
	#mainVisual.on .vis_con {border-radius: 12px; width:calc(100% - 4rem);}
	.vis_con .swiper-slide .img_pc{display:none !important;}
	.vis_con .swiper-slide .img_m{display:block !important;}	
	.vis_con .txt_area {top: auto;bottom: 0;left: 30px;width: calc(100% - 60px);/* transition: bottom .5s ease, opacity .5s ease; */}
	.vis_con .swiper-slide.swiper-slide-active .txt_area{top: auto;bottom: 15%;}
	.vis_con .txt_area .title{font-size: 2.8rem;line-height: 3.8rem;}
	.vis_con .txt_area .txt_wrap{margin-top: 1.5rem}
	.vis_con .txt_area .txt_wrap .txt_div .txt{font-size: 1.6rem;}
	.vis_con .txt_area .txt_wrap .txt_div .btn{font-size: 1.4rem;margin-top: 2.5rem;line-height: 2.5rem;padding: 0 3rem;}
}


@media only screen and ( max-width: 480px ){ 
	.vis_con .txt_area .title{font-size: 2.25rem;line-height: 3.25rem;}
	.vis_con .txt_area .txt_wrap{margin-top: 1.25rem}
	.vis_con .txt_area .txt_wrap .txt_div .txt{font-size: 1.3rem;}
	.vis_con .txt_area .txt_wrap .txt_div .btn{font-size: 1.3rem;margin-top: 2rem;line-height: 2.5rem;padding: 0 2.5rem;}
}




/* sec */
.sec{overflow:hidden;position: relative;padding:13rem 0;word-break: keep-all;}
.sec .tit_wrap{/* text-align:center; */margin-bottom: 4rem;overflow: hidden;position: relative;display: flex;z-index: 1;}
.sec .tit_wrap .main_tit{color: #222;font-size: 4.5rem;font-weight: 300;  display: block;}
.sec .tit_wrap .main_tit b{font-weight: 700;}
.sec .tit_wrap .desc{color: #222;font-size:2.2rem;margin-left: auto;display: flex;gap: 1rem;align-items: center;}
.sec .tit_wrap .desc .btn_more{position: relative; overflow: hidden; font-size:1.5rem;font-weight: 600;color: #111;line-height:3.2rem;border:2px solid #000;border-radius:36rem;padding:0 2rem}
.sec .tit_wrap .desc .btn_more span{z-index: 1; position: relative;}
.sec .tit_wrap .desc .btn_more:after {content:'';display:block;position:absolute;left:0;bottom:0;width:0;height:100%;background:#222;margin: 0;opacity:0.1; z-index:0;transition: all .3s ease-in-out;}
.sec .tit_wrap .desc .btn_more:hover:after,
.sec .tit_wrap .desc .btn_more:focus:after{width:100%;}


.sec .ttl_area{ display:flex;}
.sec .controls {margin-left:auto;display: flex;align-items: center;gap: 1rem;}
.sec .controls button {width: 34px;height: 34px;border:2px solid #000;border-radius:36rem;display: flex;align-items: center;justify-content: center;background-repeat:no-repeat;background-position:50% 50%;background-size: 15px;font-size:0;}
.sec .controls .btn_prev{background-image:url('../images/main/btn_prev.svg');}
.sec .controls .btn_next { background-image:url('../images/main/btn_next.svg');}
.sec .controls .btn_play{background-image: url('../images/common/ico_stop_w.svg');}
.sec .controls .btn_play.on{ background-image: url('../images/common/ico_play_w.svg');}


/* pic_slider */
.pic_zone{overflow:hidden; }
.picZoneSwiper .swiper-slide .img_wrap { margin-bottom: 30px; }
.picZoneSwiper .swiper-slide .txt_wrap .tit {padding-bottom: 10px;margin-bottom: 10px;border-bottom: 1px solid #ddd;font-size: 2.4rem;color: #222;font-weight: 600;}
.picZoneSwiper .swiper-slide .txt_wrap .desc { font-size: 1em; line-height: 1.75em; }
.picZoneSwiper .swiper-slide{ transition: all 0.3s; border-radius: 13px;overflow: hidden;}
.picZoneSwiper .swiper-slide a {padding:65% 0; display:block;}
.picZoneSwiper .swiper-slide img{  position: absolute; transition: transform .4s ease; height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: auto; min-height: 100%;}
.picZoneSwiper .swiper-slide:hover img, .picZoneSwiper .swiper-slide:focus img{  transform: translate(-50%, -50%) scale(1.1);}


@media only screen and (max-width:768px) {	
}


/* pro_zone */
.pro_zone{ background:url('../images/main/profile_bg.jpg') no-repeat 50% 50% / cover;}
.pro_zone .tit_wrap .main_tit{ color:#fff;}
.pro_zone .tit_wrap .desc .btn_more{ color:#fff; border-color:#fff;}
.pro_zone .tit_wrap .desc .btn_more:after { background:#fff;}
.pro_zone .controls button{border-color:#fff;}
.pro_zone .txt_large{  color:#fff; font-size:4.5rem; line-height:5.5rem; font-weight:100;}
.pro_zone .controls .btn_prev{background-image:url('../images/main/btn_prev_w.svg');}
.pro_zone .controls .btn_next { background-image:url('../images/main/btn_next_w.svg');}
.proZoneSwiper{ margin-top:90px;}
.proZoneSwiper .swiper-wrapper { transition-timing-function: linear;}
.proZoneSwiper .swiper-slide{ border-radius: 100%; overflow: hidden;}
.proZoneSwiper .swiper-slide img{width:100%;}


.sec03 .innerWrap { display:flex; gap:3rem;}
.sec03 .innerWrap .con{width: 50%;}
.sec03 .tit_wrap .main_tit{ font-size:2.5rem; font-weight:700; }
.sec03 .tit_wrap .main_tit .btn_more{display: flex;height: 100%;gap: 1rem;}
.sec03 .tit_wrap .main_tit .btn_more:after{content:"";width: 25px;height: 100%;display:inline-block;background: url('../images/main/icon-main-more.png') no-repeat 50% 50% / 25px;}

.news_list{}
.news_list ul{ display:flex; gap:3rem;}
.news_list ul li{width:100%;border:1px solid #d8c9c9;border-radius:8px;min-height:270px;transition: all .3s ease-in-out;}
.news_list ul li a{display:flex;flex-direction:column;height: 100%; padding:4rem;}
.news_list ul li .tit{color:#363434;font-weight:700;font-size:2rem;line-height:3rem;margin-bottom:2.5rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news_list ul li .desc{color:#646261;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news_list ul li .date{ margin-top:auto; font-size:1.4rem}
.news_list ul li:hover{ border-color:#111;}

.gallery_list{}
.gallery_list ul{display:flex; gap:3rem;}
.gallery_list ul li{overflow:hidden;border-radius:8px;border:1px solid #d8c9c9;width: 100%;}
.gallery_list ul li a{position:relative;width: 100%;display: block;}
.gallery_list ul li .pic{width:100%;min-height: 270px;position: relative;/* padding-top: 100%; */overflow: hidden;background:#f7f2ef url(../images/board/noImg_logo.svg) no-repeat center center;background-size: 230px;}
.gallery_list ul li .pic img{position: absolute;transition: transform .4s ease; height: 100%;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 100%;height: auto;/*  */min-height: 100%;}
.gallery_list ul li .txt{position:absolute;left:0;bottom:0;padding:4rem;background:rgba(0,0,0,0.4);opacity:0;width: 100%;height: 0;display: flex;flex-direction: column;color: #fff;transition: all .3s ease-in-out;}
.gallery_list ul li a:hover .pic img{transform: translate(-50%, -50%) scale(1.1);}
.gallery_list ul li a:hover .txt{ opacity:1; height:100%;}
.gallery_list ul li a .tit{font-weight:700;font-size:2rem; margin-bottom:2rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.gallery_list ul li a .date{ font-size:1.4rem}



@media only screen and (max-width: 1080px) {	  
	/* vis_zone */
	.vis_zone, .vis_zone .item{height: 600px;background-size: cover;}
	.vis_zone.owl-theme .ctrl-nav {display:none;} 
	.vis_zone .dataCtrl{width:100%;left:0%;bottom: 150px;margin-left: 25px;text-align: center;}
	.vis_zone .txt_wrap{font-size: 0.8em; }
	.vis_zone .txt_wrap .stit{margin-bottom:25px;}
	.vis_zone .txt_wrap .tit{font-size: 6em;}
	.vis_zone .txt_wrap .txt{margin-top:18px;}
	
	/* sec */	
	.sec{padding:4em 0;}
	.sec .tit_wrap{margin-bottom: 3.2rem;}
	.sec .tit_wrap .main_tit{font-size: 1.8rem;}
	.sec .tit_wrap .desc{font-size: 2rem;}	
	.sec .tit_wrap .desc .btn_more{border-width:1px;font-size: 1.4rem;line-height: 2.6rem;padding: 0 1.5rem;font-weight: 500;}
	.sec .controls { display:none;}	
	
	.picZoneSwiper{  margin-top:3rem;}
	
	.sec03 .tit_wrap .main_tit .btn_more:after{background-size:20px; width:20px;}

	.pro_zone .txt_large{font-size: 2.5rem;line-height: 3.5rem;}
	.pro_zone .txt_large br{display:none;}
	.proZoneSwiper{margin-top:55px;}

	.news_list ul li{min-height: 220px;}
	.news_list ul li a{ padding: 3rem}
	.news_list ul li .tit{font-size:1.5rem;line-height:1.6;margin-bottom: 1.6rem;}
	.news_list ul li .desc{ font-size:1.4rem }
	.news_list ul li .date{}

	.gallery_list ul li .txt{ padding:3rem}
	.gallery_list ul li a .tit{font-size:1.5rem}
	.gallery_list ul li .pic{min-height:220px;background-size: 190px;}
}

@media only screen and (max-width: 768px) {
	/* sec */
	.sec{padding:3.5em 0;}
	.sec .tit_wrap{margin-bottom: 1.8rem;}
	.sec .tit_wrap .desc .btn_more{ font-size: 1.3rem;line-height: 2.4rem;  }
	
	.picZoneSwiper .swiper-slide img{ width:100%;}	
	
	.pro_zone .txt_large{font-size: 2rem;line-height: 3rem;}
	.proZoneSwiper{margin-top:30px;}

	.sec03 .tit_wrap .main_tit { width:100%}
	.sec03 .tit_wrap .main_tit .btn_more:after{margin-left:auto;}
	.sec03 .innerWrap{flex-direction:column;gap: 2rem;}
	.sec03 .innerWrap .con{width:100%;background: #fff;border-radius: 8px;padding: 4rem 2.5rem;}
	.news_list ul {flex-direction:column;gap: 0;}
	.news_list ul li{border-width:0 0 1px 0;border-color: rgba(0,0,0,0.1);border-radius:0;min-height: 0;}
	.news_list ul li:first-child a{ padding-top:0}
	.news_list ul li a{padding: 1rem 0;}
	.news_list ul li .tit{font-weight:500;margin-bottom: 5px;}
	.news_list ul li .desc{display:none;}

	.gallery_list ul{gap:2rem}
	.gallery_list ul li .pic{min-height: 150px;background-size: 175px;}
}

@media only screen and (max-width: 480px) {	  	
	/* sec */	
	.sec{ padding: 3em 0; }	
	.sec .tit_wrap .desc{font-size: 1.6rem;}	

	.pro_zone .txt_large{font-size: 1.8rem;line-height: 2.8rem;}

	.gallery_list ul{flex-direction:column; gap:1.5rem}	
}
