@charset "utf-8";

/* =========================
   메인 비주얼
========================= */
#mainVisual {overflow:hidden;position:relative;width:100%;background:var(--black);}

/* 컨트롤 */
#mainVisual .controls {position:absolute;right:9rem;bottom:6.5rem;z-index:90;}
#mainVisual .controls span {opacity:.5;cursor:pointer;font-size:5.5rem;color:#fff;line-height:1;transition:all .2s;}
#mainVisual .controls span:hover {opacity:1}

/* 텍스트 */
#mainVisual .main_txt {opacity:0;display:flex;flex-flow:column;position:absolute;left:10rem;top:40%;z-index:90;color:#fff;height:60%;padding-bottom:6rem;}
#mainVisual .main_txt .sta {font-weight:800;font-size:8.8rem;line-height:1;}
#mainVisual .main_txt .stb {font-weight:700;font-size:2.6rem;color:var(--primary);margin-top:2rem;line-height:1.25;}
#mainVisual .main_txt .stb span {display:inline-block;background:linear-gradient(var(--primary) 0 0) 0 100%/100% 1px no-repeat,linear-gradient(var(--primary) 0 0) 0 calc(100% - 4px)/100% 1px no-repeat;}
#mainVisual .main_txt .stc {font-weight:300;font-size:1.7rem;line-height:1.4;opacity:.5;margin-top:auto;}

/* 배경이미지 */
#mainVisual ul:after {display:block;content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.35)}
#mainVisual ul li {height:100vh;overflow:hidden;}
#mainVisual ul li .bg {opacity:0;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:120%;height:120%;background:no-repeat center/cover;transition:all 1.2s cubic-bezier(0.165, 0.840, 0.440, 1);}
#mainVisual ul li.on .bg {width:101%;height:101%;opacity:1;}
	@media (max-width:1320px) {
		/* 컨트롤 */
		#mainVisual .controls {right:8rem;}
		/* 텍스트 */
		#mainVisual .main_txt {left:5rem;}
	}
	@media (max-width:1023px) {
		/* 컨트롤 */
		#mainVisual .controls {right:4rem;bottom:5rem;}
		/* 텍스트 */
		#mainVisual .main_txt {padding:0 5rem 6rem;left:0;}
	}
	@media (max-width:767px) {
		/* 컨트롤 */
		#mainVisual .controls {right:1.5rem;bottom:1.5rem;}
		#mainVisual .controls span {font-size:4.5rem;}
		/* 텍스트 */
		#mainVisual .main_txt {padding:0 2rem 2rem;height:auto;}
		#mainVisual .main_txt .sta {font-size:7rem;}
		#mainVisual .main_txt .stc {margin-top:4rem;text-wrap:balance;opacity:.8;}
		#mainVisual .main_txt .stc br {display:none;}
	}
	@media (max-width:475px) {
		/* 텍스트 */
		#mainVisual .main_txt .sta {font-size:5rem;}
		#mainVisual .main_txt .stb {font-size:2.2rem;}
		#mainVisual .main_txt .stc {font-size:1.6rem;}
	}
	@media (max-height:475px) {
		/* 텍스트 */
		#mainVisual .main_txt {transform:translateY(-20%);}
		/* 배경이미지 */
		#mainVisual ul li {min-height:100%;}
	}


/* =========================
   메인 공통
========================= */
.con_box {padding:12rem 0;overflow:hidden;}
.con_box .tit_wrap .sub_tit {font-weight:600;letter-spacing:-0.02em;color:var(--primary);}
.con_box .tit_wrap .sec_tit {font-weight:800;font-size:4.5rem;line-height:1.1;color:var(--black);}
	@media only screen and (max-width:1023px) {
		.con_box {padding:8rem 0;}
	}


/* =========================
   sec01_산업 애플리케이션
========================= */
#sec01 {position:relative;}
#sec01::before {width:100%;height:33.5rem;content:"";position:absolute;bottom:0;background:linear-gradient(0deg,rgba(239,240,242,1) 48%, rgba(255,255,255,1) 100%);}
#sec01 .tit_wrap {padding:4rem 0;}
#sec01 .tit_wrap .desc_tit {font-weight:500;letter-spacing:-0.02em;color:var(--black);margin-top:5rem;}
#sec01 .tit_wrap .app_ctrl {display:inline-flex;align-items:center;justify-content:center;gap:3rem;height:5.5rem;margin-top:5.5rem;padding:0 3rem;border-radius:3rem;background:#fff;}
#sec01 .tit_wrap .app_ctrl button {font-size:2.6rem;}
#sec01 .tit_wrap .app_ctrl span {font-weight:700;color:#a7a7a7;}
#sec01 .tit_wrap .app_ctrl .cur {font-weight:700;color:var(--black);margin-right:.5rem;}
#sec01 .tit_wrap .app_ctrl .total {margin-left:.5rem;}
#sec01 .app_slide_wrap {position:absolute;right:0;top:50%;transform:translateY(-50%);width:68vw;}
#sec01 .app_slide_wrap .app_slide {padding:5rem 0;}
#sec01 .app_slide_wrap .app_slide li {transition:all .3s cubic-bezier(0.165, 0.840, 0.440, 1);}
#sec01 .app_slide_wrap .app_slide li:hover {margin-top:-5rem;}
#sec01 .app_slide_wrap .img_box {aspect-ratio:1/1;overflow:hidden;}
#sec01 .app_slide_wrap .img_box img {width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;}
#sec01 .app_slide_wrap .txt_box {display:flex;justify-content:center;align-items:center;height:7rem;font-weight:600;font-size:2rem;letter-spacing:-0.02em;color:#fff;background:var(--primary);}
	@media only screen and (max-width:1540px) {
		#sec01 .app_slide_wrap {width:75vw;}
	}
	@media only screen and (max-width:1199px) {
		#sec01 .tit_wrap {padding:0;}
		#sec01 .app_slide_wrap {width:70vw;}
	}
	@media only screen and (max-width:1023px) {
		#sec01 .tit_wrap {text-align:center;}
		#sec01 .tit_wrap br {display:none;}
		#sec01 .tit_wrap .desc_tit {margin-top:2.5rem;}
		#sec01 .tit_wrap .app_ctrl {border:1px solid #ddd;}
		#sec01 .app_slide_wrap {position:static;width:100%;transform:translateY(0);margin-top:4rem;}
		#sec01 .app_slide_wrap .app_slide {padding:0;}
		#sec01 .app_slide_wrap .app_slide li:hover {margin-top:0;}
	}
	@media only screen and (max-width:767px) {

	}


/* =========================
   sec02_검사항목
========================= */
#sec02 .tit_wrap .desc_tit {font-weight:600;font-size:1.8rem;line-height:1.4;color:var(--black);}
#sec02 .con_wrap {position:relative;padding:0 5.5rem;}
#sec02 .test_list ul li {display:flex;flex-direction:column;gap:2rem;padding:4rem 2rem;border-right:1px solid #c6c6c6;text-align:center;}
#sec02 .test_list ul li.no_border {border-right:none;}
#sec02 .test_list .item_box {color:var(--black);line-height:1.2;}
#sec02 .test_list .item_box .cate {display:block;font-size:1.8rem;}
#sec02 .test_list .item_box .name {display:block;font-weight:700;font-size:2.3rem;}
#sec02 .test_ctrl {display:flex;justify-content:space-between;width:100%;}
#sec02 .test_ctrl button {display:flex;justify-items:center;align-items:center;width:5.5rem;height:5.5rem;background:var(--primary);position:absolute;top:50%;z-index:1;transform:translateY(-50%);}
#sec02 .test_ctrl button.prev {left:0;}
#sec02 .test_ctrl button.next {right:0;}
#sec02 .test_ctrl button i {width:100%;font-size:2rem;color:#fff;}


/* =========================
   sec03_소개
========================= */
#sec03 {background:url('../../images/fs/main/sec03_bg.png') no-repeat center/cover;}
#sec03 .wrap {display:flex;justify-content:space-between;align-items:center;}
#sec03 .tit_wrap .sec_tit {color:#fff;}
#sec03 .r_cont {display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;position:relative;}
#sec03 .sec03_btn {display:flex;flex-wrap:wrap;width:43rem;background:rgba(39,161,209,.3);padding:5rem 7rem;color:#fff;transition:all .3s;}
#sec03 .sec03_btn .btn_wrap {width:100%;}
#sec03 .sec03_btn .btn_wrap .stit {display:block;font-weight:600;font-size:2rem;margin-bottom:2rem;}
#sec03 .sec03_btn .btn_wrap p {font-weight:600;font-size:1.5rem;padding-right:3rem;}
#sec03 .sec03_btn .btn_wrap a {background:rgba(36,44,61,.3);width:8rem;height:100%;position:absolute;top:0;right:0;font-size:3rem;display:flex;justify-content:center;align-items:center;opacity:0;}
#sec03 .sec03_btn:is(:hover,:active,:focus) {background:rgba(39,161,209,.9);width:52rem;}
#sec03 .sec03_btn:is(:hover,:active,:focus) a {opacity:1;}
	@media only screen and (max-width:1199px){
		#sec03 .sec03_btn {width:40rem;padding:4rem 6rem;}
		#sec03 .sec03_btn:is(:hover,:active,:focus) {width:45rem;}
	}
	@media only screen and (max-width:1023px){
		#sec03 .wrap {flex-direction:column;}
		#sec03 .tit_wrap {width:100%;text-align:center;}
		#sec03 .r_cont {flex-direction:row;width:100%;margin-top:4rem;}
		#sec03 .sec03_btn {width:100%;flex:1 1 0;}
	}
	@media only screen and (max-width:767px){
		#sec03 .tit_wrap .stit {font-size:3rem;}
		#sec03 .r_cont {flex-direction:column;}
		#sec03 .sec03_btn {padding:4rem;}
	}


/* =========================
   sec04_공지사항
========================= */
#sec04 {position:relative;}
#sec04::before {content:'NOTICE';position:absolute;left:0;bottom:0;z-index:-1;color:#f7f7f7;font-size:28vw;font-weight:800;line-height:0.7;margin-left:-3.5rem;}
#sec04 .tit_wrap {width:calc(100% - 7rem);padding-bottom:11.5rem;}
#sec04 .noti_wrap {position:relative;}
#sec04 .noti_wrap .noti_slide li {min-width:50%;}
#sec04 .noti_wrap .noti_slide a {display:flex;align-items:center;width:100%;}
#sec04 .noti_wrap .noti_slide a .img_box {display:block;background:#fff;width:30.2rem;aspect-ratio:3/2;overflow:hidden;border:1px solid #e3e3e3;}
#sec04 .noti_wrap .noti_slide a .img_box img {width:100%;max-width:none;object-fit:cover;object-position:center;}
#sec04 .noti_wrap .noti_slide a .txt_box {width:calc(100% - 30.2rem);padding:0 4rem;}
#sec04 .noti_wrap .noti_slide a .txt_box span {font-weight:600;font-size:1.4rem;color:var(--primary);}
#sec04 .noti_wrap .noti_slide a .txt_box strong {font-weight:600;font-size:2rem;line-height:1.2;color:var(--black);text-wrap:balance;margin-top:1rem;}
#sec04 .noti_wrap .noti_slide a:is(:hover,:focus,:active) .txt_box strong {color:var(--primary2);text-decoration:underline;}
#sec04 .noti_wrap .noti_ctrl {position:absolute;right:0;top:-15rem;z-index:10;}
#sec04 .noti_wrap .noti_ctrl .swiper-arrow {display:flex;gap:0 2rem;}
#sec04 .noti_wrap .noti_ctrl .swiper-arrow a i {color:var(--primary);font-size:2.3rem;}
	@media only screen and (max-width:1299px){
		#sec04 .noti_wrap .noti_slide a .img_box {width:20.2rem;}
		#sec04 .noti_wrap .noti_slide a .txt_box {width:calc(100% - 20.2rem);}
	}
	@media only screen and (max-width:1023px){
		#sec04 .tit_wrap {padding-bottom:8rem;}
		#sec04 .noti_wrap .noti_slide li {min-width:100%;}
		#sec04 .noti_wrap .noti_slide a .img_box {width:30.2rem;}
		#sec04 .noti_wrap .noti_slide a .txt_box {width:calc(100% - 30.2rem);}
		#sec04 .noti_wrap .noti_ctrl {top:-10rem;}
	}
	@media only screen and (max-width:767px){
		#sec04 .noti_list {padding-top:6rem;}
		#sec04 .noti_wrap .noti_slide a {flex-wrap:wrap;}
		#sec04 .noti_wrap .noti_slide a .img_box {width:100%;}
		#sec04 .noti_wrap .noti_slide a .txt_box {width:100%;margin-top:2rem;padding:0;}
	}


/* =========================
   sec05_문의
========================= */
#sec05 {padding:6rem 0;background:var(--primary);}
#sec05 .wrap {justify-content:space-between;align-items:center;}
#sec05 .wrap > div {flex:1 1 50%;}
#sec05 .tit_wrap {color:#fff;}
#sec05 .tit_wrap .sub_tit, #sec05 .tit_wrap .sec_tit {color:#fff;}
#sec05 .tit_wrap .desc {font-weight:400;font-size:2.2rem;margin:3rem 0 4rem;opacity:.7;}
#sec05 .tit_wrap .desc .slash {display:inline-block;margin:0 2rem;}
#sec05 .tit_wrap .shortcut {display:inline-flex;align-items:center;gap:1.5rem;padding:0 3rem;height:5rem;border:1px solid #fff;position:relative;}
#sec05 .tit_wrap .shortcut:is(:hover,:focus,:active) {border-color:transparent;}
#sec05 .tit_wrap .shortcut::after{display:block;content:"";position:absolute;left:0;z-index:1;width:0;height:100%;background:#fff;transition:all .6s;}
#sec05 .tit_wrap .shortcut:is(:hover,:focus,:active)::after{width:100%;}
#sec05 .tit_wrap .shortcut * {position:relative;z-index:2;color:#fff;}
#sec05 .tit_wrap .shortcut:is(:hover,:focus,:active) * {color:var(--primary);}
#sec05 .tit_wrap .shortcut span {font-weight:600;}
	@media only screen and (max-width:767px) {
		#sec05 .wrap > div {flex:1 1 100%;}
		#sec05 .tit_wrap {text-align:center;}
		#sec05 .bg_wrap {display:none;}
	}