@charset "utf-8";
@import url(font.css);
@import url(common.css);
@import url(layout.css);

.pc_only{}
.mb_only{display:none;}


/* main_common */
.main_wrap{}
.main_wrap section{min-height:840px; height:100vh; position: relative;}
.main_wrap section + section{padding-top:140px; margin:0 auto;}

.main_title{text-align:center;}
.main_title b{font-size:18px; color:var(--main_color); font-weight:600;}
.main_title h3{font-family:var(--tit_font); color:#222; font-size:40px; font-weight:600; line-height:125%; margin-top:20px;}
.main_title p{font-size:18px; color:#999; font-weight:400; line-height:125%; margin-top: 15px;}


/* main_visual */
.main_visual{position:relative; height:min(100vh, 840px); overflow:hidden; background:url('/images/page/main/main_img.jpg') no-repeat; background-size:cover; background-position:center;}
.main_visual .visual_img img{position:absolute; top:0; right:100px;}
.main_visual .visual_txt{position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; width:1440px; }
.main_visual .visual_txt img{position:absolute; top:0; bottom:0; margin:auto;}

/* mcon01 */
.mcon01{position:relative;}
.mcon01:before{content:''; display:block; background:url('/images/page/main/mcon01_bg.png') no-repeat; background-size:cover; background-position:top right; width:100%; height:150vh; position:absolute; top:0; left:0; right:0; margin:auto; z-index: -1;}

.svc_list{margin-top:60px;}
.svc_list ul{display:flex; justify-content: space-between;}
.svc_list ul li{width:162px; height:fit-content; overflow:hidden; position:relative; padding:0 10px 10px 0; transition:all 0.8s; cursor:pointer;}
.svc_list ul li .img_box{width:100%; height:440px; border-radius:15px; box-shadow:5px 5px 5px rgba(0,0,0,0.1); overflow:hidden; position:relative;}
.svc_list ul li .img_box:before{content:''; width:100%; height:100%; display:block; background:rgba(0,0,0,0.4); position:absolute; top:0; left:0; z-index: 3;}
.svc_list ul li .img_box img{position:absolute; top:0; right:0; width:100%; height:100%; object-fit: cover; filter:blur(6px);}
.svc_list ul li .svc_menu{width:100%; height:100%; position:absolute; top:0; left:0; z-index: 5;}
.svc_list ul li .svc_menu strong{color:#fff; font-size:22px; white-space: nowrap; font-weight:500; position:absolute; top:calc(40% + 40px); left:calc(-90% + 33px); text-align: right; transform:rotate(-90deg); width:380px;}
.svc_list ul li .svc_menu p{display:none; color:#fff; margin-left:50px;}
.svc_list ul li .svc_menu p a{display:flex; align-items: center; color:#fff;}
.svc_list ul li .svc_menu p a + a{margin-left:40px;}
.svc_list ul li .svc_menu p a span{display:inline-block; margin-right:5px; white-space: nowrap;}
.svc_list ul li .svc_menu p a i{font-size:22px;}

.svc_list ul li.on{width:calc(100% - 324px); cursor: auto; padding-bottom:80px;}
.svc_list ul li.on .img_box:before{display:none;}
.svc_list ul li.on .img_box img{filter:blur(0);}
.svc_list ul li.on .svc_menu{display:flex; justify-content:flex-start; align-items: center; width:fit-content; height:96px; background:var(--main_color); padding:30px 40px ; border-radius:15px;  margin-top:-40px; margin-left:40px; position:relative;}
.svc_list ul li.on .svc_menu strong{font-size:24px; font-weight:600; transform:rotate(0deg); position:static; width:fit-content;}
.svc_list ul li.on .svc_menu p{display:flex;}

.svc_list ul li.on .svc_menu p a:hover{font-weight:600;}

/* mcon02 */
.mcon02{position:relative;}

.biz_list{margin-top:80px; padding:140px 0;}
.biz_list:before{content:''; width:100%; height:60%; display:block; background:url('/images/page/main/biz_bg.jpg') no-repeat; background-size:cover; position:absolute; bottom:0; z-index: -1;}
.biz_list ul{display:flex; align-items: center; width:calc(100% + 20px); transform:translate(-10px, -10px);}
.biz_list ul li{width:calc(25% - 20px); margin:10px; position:relative;}
.biz_list ul li:before{content:''; display:block; width:calc(100% + 20px); height:1px; border-top:1px solid #fff; position:absolute; top:80px; left:30px;}
.biz_list ul li + li:before{right:0; left:unset;}
.biz_list ul li:after{content:''; width:7px; height:7px; border-radius:3.5px; background:#fff; position:absolute; top:76.5px; left:20px; border:1px solid rgba(255, 255, 255, 0.6);}
.biz_list ul li a{display:block; padding:100px 30px 80px; color:#fff; transition:all 0.4s;}
.biz_list .biz_state{display:block; width:80px; height:80px; line-height:80px; border:1px solid #fff; border-radius:50%; color:#fff; text-align:center; font-size:18px; font-weight:500; position:absolute; top:-40px; left:-10px; transition:all 0.4s;}
.biz_list .biz_tit{font-size:20px; font-weight:600; line-height:125%;}
.biz_list .biz_dtail{display:flex; justify-content: space-between; flex-wrap: wrap; margin-top:40px;}
.biz_list .biz_dtail dt{font-weight:500; width:80px;}
.biz_list .biz_dtail dd{width:calc(100% - 80px);}
.biz_list .biz_dtail dd + dt,
.biz_list .biz_dtail dd + dt + dd{margin-top:6px;}

.biz_list2{margin-top:80px; padding:140px 0;}
.biz_list2:before{content:''; width:100%; height:60%; display:block; background:url('/images/page/main/biz_bg.jpg') no-repeat; background-size:cover; position:absolute; bottom:0; z-index: -1;}
.biz_list2 {display: flex; flex-wrap: wrap; gap: 40px 20px;}
.biz_list2 .photoList {width: 100%;}
.biz_list2 li.none {display: block; width: 100%; text-align: center;}
.biz_list2 li.none strong {display: block; color: #fff; font-size: 60px; font-weight: 700; line-height: 90px; width: 100px; height: 100px; border: 5px solid #eee; border-radius: 50%; margin: 0 auto 20px;}
.biz_list2 li.none span {color: #fff; font-size: 20px; font-weight: 600;}

.biz_list ul li.on:after{background:var(--main_color);}
.biz_list ul li.on a{background:rgba(35, 44, 87, 0.4); border-radius:20px;}
.biz_list ul li.on a .biz_state{background:var(--main_color); border-color:var(--main_color);}

.more_btn_wrap{position:absolute; bottom:0; left:0; right:0; margin:auto; display:flex; justify-content: flex-end;}
.more_btn{display:block; padding: 0 45px 0 20px; width:250px; height:52px; line-height:52px; border-radius:10px 10px 0 0; background:var(--main_color);}
.more_btn:before{content:''; position:absolute; right:20px; top:0; bottom:0; margin:auto; width:24px; height:5px; display:block; background:url('/images/page/main/more_arrow.png') no-repeat; }
.more_btn{color:#fff; z-index: 1;}

/* mcon03 */

.mcon03{background: rgb(32,38,80); background: -moz-linear-gradient(to top left, rgba(32,38,80,1) 0%, rgba(12,14,28,1) 100%); background: -webkit-linear-gradient(to top left, rgba(32,38,80,1) 0%, rgba(12,14,28,1) 100%); background: linear-gradient(to top left, rgba(32,38,80,1) 0%, rgba(12,14,28,1) 100%);}
.mcon03 .main_title h3, .mcon03 .main_title p{color:#fff;}
.mcon03 .main_title p{opacity:0.6;}

.ai_rst_list{margin-top:30px; padding-bottom:120px; position:relative;}
.ai_rst_list ul{}
.ai_rst_list ul li{}
.ai_rst_list ul li a{display:block; width:100%;}
.ai_rst_list .img_box{border-radius:15px; overflow:hidden; font-size:0;}
.ai_rst_list .img_box img{width:100%; height:100%; object-fit: cover;}
.ai_rst_list .txt_box{text-align:center; margin-top:15px;}
.ai_rst_list .txt_box strong{color:#fff; font-size:22px; font-weight:600; line-height:125%; word-break: keep-all;}


/* 메인용 팝업 - 멀티_싱글 팝업 */
.main_popup{background:rgba(0,0,0,0.8); width:100%; height:100%; position:fixed; top:0; left:0; z-index: 100;}
.ms_popup_wrap{width:fit-content; max-width:calc(100% - 40px); min-width:340px; height:fit-content; max-height:90vh; position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; border-radius:15px; overflow:hidden;}
.ms_popup_con{background:#000; display: flex; flex-wrap: wrap; justify-content: space-between;}
.ms_slide img{max-width:100%; max-height:100%;}
.ms_slide{font-size:0;}
.ms_slide a{display:block; width:100%;}

.ms_tab{background:#000; width:calc(100% - 64px); margin:0 auto; order:3;}
.ms_tab ul{display:flex; min-width:100%; width:fit-content !important;}
.ms_tab ul li + li{border-left: 1px solid #333;}
.ms_tab ul li.swiper-slide:only-child{width:100% !important;}
.ms_tab ul li.swiper-slide{width:fit-content !important; min-width:calc(500px / 3); max-width:500px; text-align:center; padding:5px; font-size:0;}
.ms_tab ul li.swiper-slide span{display:inline-block; color:#fff; font-size:15px; opacity: 0.4; cursor: pointer; padding:0 10px;}
.ms_tab ul li.swiper-slide-thumb-active span{opacity:1;}

.ms_remote{display:block; width:32px; height:32px; text-align: center; line-height: 34px;}
.ms_remote.prev{order:2; border-right: 1px solid #333;}
.ms_remote.next{order:4; border-left:1px solid #333;}

.ms_popup_foot{background:#fff; padding:10px; font-size:14px; display:flex; justify-content: space-between; align-items: center;}
.ms_popup_foot .modal_close{border:1px solid #ddd; border-radius:4px; padding:5px 15px;}


@media (max-width: 1920px) {

}

@media (max-width: 1680px) {


}

@media (max-width: 1440px) {


	/* main_visual */
	.main_visual .visual_img img{width:660px; right:5%;}
	.main_visual .visual_txt{width:100%;}
	.main_visual .visual_txt img{width:45%; left:2%;}

	.main_title{width:90%; margin:0 auto;}
	.main_title b, .main_title p{font-size:18px; word-break: keep-all;}
	.main_title h3{font-size:38px; word-break:keep-all;}


}

@media (max-width: 1280px) {



	/* main_common */
	.main_wrap section{min-height:640px; height:auto;}
	.main_wrap section + section{padding-top:120px;}

	.main_title h3{font-size:32px;}

	/* mcon01 */
	.svc_list ul li{width:120px;}
	.svc_list ul li .svc_menu strong{font-size:20px; left:calc(-140% + 33px);}

	.svc_list ul li.on{width:calc(100% - 250px);}
	.svc_list ul li.on .svc_menu strong{font-size:22px;}

	/* mcon02 */
	.biz_list ul li{width:calc(33.3333% - 20px);}
	.biz_list ul li:nth-child(4){display:none;}

	/* mcon03 */
	.ai_rst_list .txt_box strong{font-size:20px; line-height:145%;}

}

@media (max-width: 1024px) {

	.main_title h3{font-size:30px;}
	.main_title b, .main_title p{font-size:16px;}

	/* main_visual */
	.main_wrap section{min-height:auto;}
	.main_visual .visual_img{text-align:center;}
	.main_visual .visual_img img{width:70%; position:static;}
	.main_visual .visual_txt{position:static;}
	.main_visual .visual_txt img{position:static; padding:0 50px 50px; width:60%; margin-top:-30px;}

	/* mcon01 */
	.svc_list ul{flex-wrap: wrap;}
	.svc_list ul li, .svc_list ul li.on{width:80%; padding-bottom:40px;}
	.svc_list ul li:nth-child(2){margin-left:20%;}

	.svc_list ul li .img_box, .svc_list ul li.on .img_box{width:100%; height:0; padding-top:30%;}
	.svc_list ul li .img_box:before{display:none;}
	.svc_list ul li .img_box img{filter:blur(0);}

	.svc_list ul li .svc_menu,
	.svc_list ul li.on .svc_menu{width:calc(100% - 40px); height:auto; background:var(--main_color); margin-top:-40px; padding:30px 40px; display:block; margin-left:20px; position:relative; border-radius: 15px;}

	.svc_list ul li .svc_menu strong{display: block; position:static; text-align: left; font-size:22px; font-weight:600; transform:rotate(0deg);}

	.svc_list ul li .svc_menu p{display:flex; margin-top:10px; margin-left:0;}

	/* mcon02 */
	.biz_list ul li{width:calc(50% - 20px);}
	.biz_list ul li:nth-child(n+3){display:none;}

	/* 메인용 팝업 - 멀티_싱글 팝업 */
	.ms_slide img{width:100% !important; height:auto; max-height:100%; object-fit: contain;}
}




@media (max-width: 768px) {

	.main_title p br{display:none;}

	.main_visual .visual_txt img{width:80%;}

	/* mcon02 */
	.biz_list{position:relative; padding:80px 0;}
	.biz_list:before{top:0; bottom:unset; height:100%;}
	.biz_list ul{flex-direction: column; width:100%; transform:translate(0, 0);}

	.biz_list ul li{width:calc(100% - 20px); display:block !important; margin:50px 10px;}
	.biz_list ul li:first-child{margin-top:0;}
	.biz_list ul li + li:before{left:30px;}
	.biz_list ul li:before{top:50px;}
	.biz_list ul li:after{top:45.5px; left:22px;}


	.biz_list .biz_state{width:70px; height:70px; line-height: 70px; font-size:15px;}
	.biz_list .biz_tit{font-size:18px;}


	.biz_list ul li a{background:rgba(35, 44, 87, 0.4); border-radius:20px; padding:80px 30px 60px;}
	.biz_list ul li a .biz_state{background:#fff; color:var(--main_color); border-color:var(--main_color);}
	.biz_list ul li.on a .biz_state{color:#fff;}
}


@media (max-width: 640px) {

	.main_wrap section + section{padding-top:80px;}

	.main_title h3{font-size:24px;}

	.main_visual .visual_img img{width:100%;}
	.main_visual .visual_txt img{width:100%; margin-top:0;}


	.svc_list ul li, .svc_list ul li.on{width:100%; border:1px solid #ddd; overflow:hidden; padding:0; border-radius:15px; box-shadow: 3px 3px 3px rgba(0,0,0,0.1)}
	.svc_list ul li:nth-child(2){margin-left:0;}
	.svc_list ul li + li{margin-top:50px;}

	.svc_list ul li .img_box, .svc_list ul li.on .img_box{border-radius:0; border:none; box-shadow: none;}
	.svc_list ul li .svc_menu, .svc_list ul li.on .svc_menu{width:100%; margin:0 auto; position:static; background:#fff; border-top:1px solid #ddd; border-radius:0;}
	.svc_list ul li.on .svc_menu strong, .svc_list ul li .svc_menu strong{font-size:20px; color:#222;}
	.svc_list ul li .svc_menu p{flex-wrap: wrap; width:calc(100% + 10px); transform:translate(-5px, -5px);}
	.svc_list ul li .svc_menu p a{color:#666; margin:5px !important;}






}

@media (max-width: 430px) {
	.biz_list2 li.none strong { font-size: 50px; font-weight: 700; line-height: 80px; width: 90px; height: 90px; }
	.biz_list2 li.none span { font-size: 17px;}
}

@media (max-width: 425px) {
	.main_title h3{font-size:22px;}

	.main_visual .visual_txt img{padding:0 20px 50px;}

	.svc_list ul li .img_box, .svc_list ul li.on .img_box{padding-top:50%;}
	.svc_list ul li .svc_menu, .svc_list ul li.on .svc_menu{padding:20px;}

	.more_btn{width:100%;}

}

@media (max-width: 350px) {
	.biz_list2 li.none span { font-size: 15px; }
}