@charset "utf-8";

.skip_snb_menu {display:none;}

#fs_container_wrap {}

/* 비주얼 */
.fs_main_visual {position:relative;}
.fs_main_visual .slides01 li {height:100vh;position:relative;}
.fs_main_visual .slides01 li img {max-width:none;}
.fs_main_visual .main_visual_text {position:absolute;top:50%;left:0;right:0;margin:auto;transform:translateY(-50%);min-width:1400px;text-align:center;}
.fs_main_visual .main_visual_text .bullet {position:relative;display:inline-block;padding:88px 0 30px;margin-bottom:30px;font-size:24px;color:#fff;}
.fs_main_visual .main_visual_text .bullet:before {content:'';position:absolute;left:0;right:0;top:0;margin:auto;width:100%;height:100%;background:url("./../images/main/sta_bullet.png") no-repeat center top;}
.fs_main_visual .main_visual_text .bullet:after {content:'';position:absolute;left:0;right:0;bottom:0;margin:auto;width:40px;height:1px;background:#fff;opacity:.5;}
.fs_main_visual .main_visual_text .sta {font-size:60px;font-weight:200;color:#fff;font-family: 'Thejamsil';line-height: 1.3em;}
.fs_main_visual .main_visual_text .sta strong {font-family: inherit;}
.fs_main_visual .main_visual_text .sta strong:first-child {color:#aeddff;}
.fs_main_visual .main_visual_text .sta strong:last-child {color:#6effb1;}

/* 컨트롤 */
.fs_main_visual .slick-dots {position:absolute;width:100%;left:0;right:0;bottom:6%;z-index:60;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;}
.fs_main_visual .slick-dots li{display:inline-block;vertical-align:middle;margin-right:2px;width:10px;height:10px;background:rgba(255,255,255,0.5);font-size:0;border-radius:20px;margin:0 5px;}
.fs_main_visual .slick-dots li.slick-active {background:#fff;width:40px;}
.fs_main_visual .slick-dots li button {display:contents;}
.fs_main_visual .mvis_controll_box {display:none;}
	@media only screen and (max-width:1399px){
        .fs_main_visual .main_visual_text {min-width:unset;padding:0 30px;}
    }
	@media only screen and (max-width:1023px){
        /* 비주얼 */
        .fs_main_visual .main_visual_text .bullet {padding-bottom:15px;margin-bottom:15px;}
        .fs_main_visual .main_visual_text .sta {font-size:44px;}
        .fs_main_visual .main_visual_text .sta em {font-size:60px;}
        
	}
	@media only screen and (max-width:767px){
        /* 비주얼 */
        .fs_main_visual .main_visual_text {padding:0 15px;}
        .fs_main_visual .main_visual_text .bullet {font-size:20px;padding:68px 0 15px;}
        .fs_main_visual .main_visual_text .bullet:before {width:60px;background-size:contain;}
        .fs_main_visual .main_visual_text .sta {font-size:36px;}
        .fs_main_visual .main_visual_text .sta em {}
    }
	@media only screen and (max-width:560px){
        .fs_main_visual .main_visual_text .sta {font-size:28px;}
	}

/* 컨텐츠 시작 */
.fs_main_contents {}
/* 타이틀 */
.title {font-size:44px;color:#000;font-weight:700;}
.ti_txt {font-size:22px;color:#222;font-weight:300;margin-top:20px;}
.arrow_more {margin-top:30px;display:block;}

/* 공통 */
.mbox {padding:150px 0;}
.titbox {text-align: center;}
.mtit span {display:inline-block;position:relative;font-size:70px;color:#000;font-weight:600;}
.mtit span:after {content:'';position:absolute;left:calc(100% - 5px);top:-22px;background:url("./../images/main/mtit_ico.png") no-repeat center;width:45px;height:45px;}
.mstit {padding-top:30px;font-size:16px;color:#999;font-weight:400;}
    @media only screen and (max-width:1023px){
        .mtit span {font-size:56px;}
        .mstit {padding-top:20px;}
        .mtit span:after {background-size: contain;width:35px;height:auto;aspect-ratio: 1/1;}
    }
    @media only screen and (max-width:767px){
        .mbox {padding:80px 0;}
        .title {font-size:30px;}
        .ti_txt {font-size:16px;}

        .mtit span {font-size:40px;}
    }
    @media only screen and (max-width:560px){
        .mtit span {font-size:36px;}
        .mtit span:after {width:27px;}
    }


/* ==================  BUSINESS ==================  */
.mbox1 {}
.mbox1 .b_slide_wrp {position:relative;}
.mbox1 .b_slide_wrp:before {content:'';position:absolute;top:0;bottom:0;left:0;right:0;height:1px;margin:auto;background:#ddd;}
.mbox1 .b_slide {position:relative;margin:60px auto 0;}
.mbox1 .b_slide .swiper-wrapper {transition-timing-function:linear;transition:all .4s;}
.mbox1 .b_slide .swiper-slide {height:440px;max-width:800px;overflow:hidden;transform:scale(.7);border-radius:25px;z-index: 9;transition-timing-function: ease-in-out;}
.mbox1 .b_slide .swiper-slide.swiper-slide-active {transform:scale(1);z-index: 10;transition:all .2s;}
.mbox1 .b_slide .swiper-slide.swiper-slide-prev {transform:translateX(55%) scale(.7);transition:all .2s;}
.mbox1 .b_slide .swiper-slide.swiper-slide-next {transform:translateX(-55%) scale(.7);transition:all .2s;}
.mbox1 .b_slide .swiper-slide a {position:relative;display:block;width:100%;height:100%;}
.mbox1 .b_slide .swiper-slide a:after {content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index: 1;}
.mbox1 .b_slide .swiper-slide a .imgbox {position:absolute;left:0;top:0;width:100%;height:auto;}
.mbox1 .b_slide .swiper-slide a .txtbox {position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align: center;z-index: 2;opacity:0;}
.mbox1 .b_slide .swiper-slide.swiper-slide-active a .txtbox {opacity:1;}
.mbox1 .b_slide .swiper-slide a .txtbox .contit {font-size:40px;font-weight:bold;color:#fff;}
.mbox1 .b_slide .swiper-slide a .txtbox ul {display:flex;justify-content: center;margin-top:40px;}
.mbox1 .b_slide .swiper-slide a .txtbox ul li {margin:0 5px;}
.mbox1 .b_slide .swiper-slide a .txtbox ul li span {display:block;line-height:30px;padding:0 25px;color:#003a63;background:#fff;border:1px solid #003a63;border-radius:50px;}
.mbox1 .swiper-container {position:relative;}
.mbox1 .swiper-container:before {content:'';position:absolute;right:0;top:0;bottom:0;margin:auto;width:6px;height:6px;background:#ddd;border-radius: 50px;}
.mbox1 .swiper-container:after {content:'';position:absolute;left:0;top:0;bottom:0;margin:auto;width:6px;height:6px;background:#ddd;border-radius: 50px;}
.mbox1 .swiper-container .swiper-btn {position:absolute;top:0;bottom:0;margin:auto;width:31px;height:50px;z-index:10;}
.mbox1 .swiper-container .swiper-btn.swiper-button-prev {background:url("./../images/main/arrow_prev.png")no-repeat center;left:75px;}
.mbox1 .swiper-container .swiper-btn.swiper-button-next {background:url("./../images/main/arrow_next.png")no-repeat center;right:75px;}
.mbox1 .swiper-container .swiper-btn.swiper-button-prev:after,
.mbox1 .swiper-container .swiper-btn.swiper-button-next:after {display:none;}
    @media only screen and (max-width:1719px){
        .mbox1 .b_slide .swiper-slide {max-width:53%;aspect-ratio: 20/13;}
        .mbox1 .swiper-container .swiper-btn.swiper-button-prev {left:10px;}
        .mbox1 .swiper-container .swiper-btn.swiper-button-next {right:10px;}
    }
    @media only screen and (max-width:1023px){
        .mbox1 .b_slide .swiper-slide {height:auto;}
    }
    @media only screen and (max-width:767px){
        .mbox1 .b_slide {margin:40px auto 0;}
        .mbox1 .b_slide .swiper-slide {max-width:80%;margin:0 10%;}
        .mbox1 .b_slide .swiper-slide.swiper-slide-active {transform:scale(1);z-index: 10;}
        .mbox1 .b_slide .swiper-slide.swiper-slide-prev {transform:translateX(0) scale(1);}
        .mbox1 .b_slide .swiper-slide.swiper-slide-next {transform:translateX(0) scale(1);}
        .mbox1 .swiper-container .swiper-btn.swiper-button-prev {height:40px;background-size: contain;left:5px;}
        .mbox1 .swiper-container .swiper-btn.swiper-button-next {height:40px;background-size: contain;right:5px;}
        .mbox1 .b_slide .swiper-slide a .txtbox .contit {font-size:32px;}
        .mbox1 .b_slide .swiper-slide a .txtbox ul {flex-direction: column;}
        .mbox1 .b_slide .swiper-slide a .txtbox ul li + li {padding-top:5px;}
        .mbox1 .b_slide .swiper-slide a .txtbox ul li span {display:inline-block;}
    }
    @media only screen and (max-width:560px){
        .mbox1 .b_slide_wrp:before {top:-30px;}
        .mbox1 .b_slide .swiper-slide {max-width:100%;}
        .mbox1 .swiper-container {padding-bottom:60px;}
        .mbox1 .swiper-container .swiper-btn.swiper-button-prev {top:unset;left:0;right:75px;}
        .mbox1 .swiper-container .swiper-btn.swiper-button-next {top:unset;left:75px;right:0;}
    }


/* ================== Project ================== */
.mbox2 {background:url("./../images/main/mcon02_bg.jpg") no-repeat center;}
.mbox2 .titbox .mtit span {color:#fff;}
.mbox2 .titbox .mtit span:after {left:unset;right:calc(100% - 5px);top:-35px;transform:rotate(90deg);filter:brightness(0) saturate(100%) invert(100%) sepia(75%) saturate(1686%) hue-rotate(182deg) brightness(117%) contrast(87%);}
.mbox2 .titbox .mstit {color:#bbb;}
.mbox2 .iconbox {margin-top:100px;text-align: center;}
.mbox2 .iconbox ul {display:flex;justify-content: center;}
.mbox2 .iconbox ul li {padding:0 30px;}
.mbox2 .iconbox ul li a {position:relative;display:flex;align-items:center;justify-content:center;width:200px;height:auto;aspect-ratio:1/1;}
.mbox2 .iconbox ul li a:before {content:'';position:absolute;left:0;top:0;width:100%;height:100%;border:5px solid #0095ff;border-radius:80px;background:#fff;z-index: 4;transform:rotate(45deg);transition:all .4s;-webkit-transition:all .4s;}
.mbox2 .iconbox ul li:nth-child(2n) a:before {border:5px solid #003a63;}
.mbox2 .iconbox ul li a .txt {z-index: 5;}
.mbox2 .iconbox ul li a .txt .tit {text-align: center;font-weight:500;margin-top:20px;line-height:normal;color:#0095ff;}
.mbox2 .iconbox ul li:nth-child(2n) a .txt .tit {color:#003a63;}
.mbox2 .iconbox ul li a:hover .txt .tit {color:#fff;transition:all .4s;-webkit-transition:all .4s;}
.mbox2 .iconbox ul li a:hover:before {background: rgba(0, 149, 255, 0.8);}
.mbox2 .iconbox ul li a:hover .txt .imgbox img {filter:brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(242deg) brightness(104%) contrast(103%);}
.mbox2 .iconbox ul li:nth-child(2n) a:hover:before {background: rgba(0, 58, 99, 0.8);}
    @media only screen and (max-width:1299px){
        .mbox2 .iconbox ul li {padding:0 15px;}
        .mbox2 .iconbox ul li a {width:170px;}
		.mbox2 .iconbox ul li a:before {border-radius:60px;}
    }
    @media only screen and (max-width:1023px){
        .mbox2 .iconbox {margin-top:60px;}
        .mbox2 .iconbox ul {flex-wrap:wrap;text-align: center;}
        .mbox2 .iconbox ul li {width:20%;padding:0;}
        .mbox2 .iconbox ul li a {width:100%;height:160px;aspect-ratio:unset;}
        .mbox2 .iconbox ul li a:before {transform:inherit;border-radius:0;border:none !important;background: rgba(0, 149, 255, 0.8);}
        .mbox2 .iconbox ul li:nth-child(odd) a:before {background: rgba(0, 58, 99, 0.8);}
        .mbox2 .iconbox ul li a .txt {display:flex;flex-wrap:wrap;width:100%;justify-content:center;}
        .mbox2 .iconbox ul li a .txt .tit {text-align:center;margin-left:0;color:#fff !important;display:block;width:100%;}
        .mbox2 .iconbox ul li a .txt .imgbox img {filter:brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(242deg) brightness(104%) contrast(103%);}
        .mbox2 .iconbox ul li a:hover:before {background:rgba(0,0,0,.8) !important;}
    }
    @media only screen and (max-width:767px){
        .mbox2 .iconbox {margin-top:40px;}
        .mbox2 .titbox .mtit span:after {top:-25px;}
    }
    @media only screen and (max-width:560px){
        .mbox2 .iconbox ul li {width:100%;}
        .mbox2 .iconbox ul li a {height:120px;}
		.mbox2 .iconbox ul li a .txt {align-items:center;}
		.mbox2 .iconbox ul li a .txt .tit {text-align:left;margin-left:10%;display:inline-block;width:auto;margin-top:0;}
    }

/* ================== Recruitment ================== */
.mbox3 .border_box {position:relative;border:10px solid #003a63;border-radius:20px;padding:100px;}
.mbox3 .border_box:after {content:'';position:absolute;right:-10px;bottom:-10px;background:url("./../images/main/mcon03_bg.png") no-repeat bottom right;width:55%;height:100%;z-index:inherit;background-size:contain;}
.mbox3 .border_box .titbox {text-align: left;}
.mbox3 .border_box .mtit span {color:#003a63;}
.mbox3 .border_box .mtit span:after {left:100%;top:-37px;filter:brightness(0) saturate(100%) invert(13%) sepia(29%) saturate(6838%) hue-rotate(188deg) brightness(94%) contrast(101%);}
.mbox3 .border_box .re_list {margin-top:60px;}
.mbox3 .border_box .re_list li {display:block;}
.mbox3 .border_box .re_list li a {position:relative;display:block;max-width:400px;padding:22px 15px;border-bottom:1px solid #ddd;color:#000;}
.mbox3 .border_box .re_list li a:after {content:'';position:absolute;right:25px;top:0;bottom:0;margin:auto;background:url("./../images/main/mcon03_ico.png") no-repeat center right;width:13px;height:22px;opacity:.6;transition:all .3s;-webkit-transition:all .3s;}
.mbox3 .border_box .re_list li a:hover {border-bottom:1px solid #222;}
.mbox3 .border_box .re_list li a:hover:after {animation:zigzag 1s ease;animation-iteration-count:2;opacity:1;}
@keyframes zigzag {
    0% {transform: translateX(0);}
    50% {transform: translateX(5px);}
}
    @media only screen and (max-width:1299px){
        .mbox3 .border_box {padding:100px 60px 100px;}
    }
    @media only screen and (max-width:1023px){
        .mbox3 .border_box {padding:80px 40px;}
        .mbox3 .border_box .re_list li a {max-width:45%;}
        .mbox3 .border_box .mtit span:after {top:-27px;}
    }
    @media only screen and (max-width:767px){
        .mbox3 .border_box {}
        .mbox3 .border_box:after {display:none;}
        .mbox3 .border_box .re_list {margin-top:40px;}
        .mbox3 .border_box .re_list li a {max-width:100%;}
    }
    @media only screen and (max-width:560px){
        .mbox3 .border_box {padding:60px 30px;}
        .mbox3 .border_box .mtit span:after {top:-22px;}
    }