@charset "utf-8";

#main { margin-top: 123px; }

 h2 { margin-top: 10px; font-size: 42px; font-weight: 600; color: #385f99; text-align: center; }
 h2.mgtop { margin-top: 140px; }
 h2 span { color: #000; }

.des_tit { margin-top: 145px; font-size: 28px; font-weight: 400; color: #000; text-align: center; }

.visual { position: relative; width: 100%; } 
.visual .slide1 { width: 100%; height: 847px; background: url("../images/main/visual1.jpg") no-repeat center center #161719; }
.visual .slide1 .mobile { display: none; }
.visual .slide1 .text { color: #fff; }
.visual .slide1 .text span { color: #b19462; }
.visual .slide2 { width: 100%; height: 847px; background: url("../images/main/visual2.jpg") no-repeat center center #efefef; }
.visual .slide2 .mobile { display: none; }
.visual .text { position: absolute; top: 50%; left: 55%; font-size: 32px; font-weight: 500; color: #000; transform: translatey(-50%); }
.visual .text strong { font-weight: 700; }
.visual .text span { color: #5da9f7; }
.visual .text em { display: block; margin: 10px 0; font-size: 75px; font-weight: 800; line-height: 1.2; }

.visual .swiper-slide > div { transform-origin: center; } 
.visual .swiper-slide-active > div { animation: imgScale 2.5s forwards; } 
.visual .slide_bar { display: flex; align-items: center; gap: 20px; z-index: 2; font-size: 18px; font-weight: 500; color: #fff; line-height: 24px; }
.visual .slide_bar .time { position: relative; overflow: hidden; width: 140px; height: 4px; background: rgba(255, 255, 255, 0.5); border-radius: 10px; }
.visual .slide_bar .time span { position: absolute; top: 0; left: 0; width: 0; height: 4px; background: #0659ca; }
.visual.change .slide_bar .time span { transition: 4s linear; width: 100%; }
.visual .page_btn { position: absolute; bottom: 190px; left: 8%; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; z-index: 222; }
.visual .page_btn .btn { font-size: 0; line-height: 0; } 
.visual .page_btn .prev a { display: block; font-size: 20px; color: #fff; }
.visual .page_btn .next a { display: block; font-size: 20px; color: #fff; }

.main_real { background: #1a5999; width: 100%; overflow: hidden; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; padding:30px 0; }
.main_real .inner { max-width:96%; }
.main_real .realsl_warp {display: flex; align-items: center; justify-content: space-between;}
.main_real .real_tit {width: 180px; color: #ffea00; font-weight: 800; font-size: 20px;}
.main_real .real_cont {width: 88%; overflow: hidden;}
.main_real .containner_roll {display: flex; align-items: center;}
.main_real .main_real_li {margin-right: 40px;}
.main_real .main_real_li span { color: #fff; font-size: 18px; display: inline-block; font-weight: 600;}
.main_real .main_real_li span:nth-child(2) {margin: 0 7px; position: relative;}

.kcpba { background-color: #142a4a; }
.kcpba .wrap { display: flex; flex-wrap: wrap; align-items: center; }
.kcpba .award { width: 280px; text-align: center; }
.kcpba .award .txt { margin-top: 35px; font-family: "gyeonggibatang"; font-size: 20px; color: #fff; }
.kcpba .award .tit { margin-top: 25px; font-size: 35px; font-weight: 600; color: #fff; }
.kcpba .gif { width: calc(100% - 340px); margin-left: 60px; }
.kcpba .gif img { width: 100%; }
.kcpba .check_txt { padding: 12px 0; font-size: 32px; font-weight: 600; color: #000; line-height: 44px; text-align: center; background-color: #f4e320; }
.kcpba .check_txt img { margin-right: 20px; }

.pro_system { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 70px; }
.pro_system li { width: calc((100% - 48px) / 4); text-align: center; transition: all 0.3s; }
.pro_system li:hover { box-shadow: 5px 5px 10px rgba(0,0,0,0.1); }
.pro_system li:hover .img img { transform: scale(1.04); }
.pro_system li .img { position: relative; overflow: hidden; }
.pro_system li .img img { width: 100%; object-fit: cover; transition: transform .5s; }
.pro_system li .img .tit { position: absolute; bottom: 15px; left: 15px; right: 15px; padding: 4px; font-size: 24px; font-weight: 700; color: #fff; line-height: 1.3; border-radius: 5px; background: rgba(41,113,185,0.75); z-index: 1; }
.pro_system li .txt { padding: 15px; font-size: 18px; font-weight: 500; color: #555; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }

.gray_bg { overflow: hidden; width: 100%; margin-top: 150px; padding-bottom: 80px; background-color: #f3f3f3; }

.review_list { display: flex; flex-wrap: wrap; gap: 40px 10px; margin-top: 70px; }
.review_list li { width: calc((100% - 40px) / 5); }
.review_list li a { display: block; }
.review_list li a .img { overflow: hidden; }
.review_list li a .img img { width: 100%; aspect-ratio: 10/7; object-fit: cover; transition: transform .5s; }
.review_list li a .txt { overflow: hidden; display: block; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; font-size: 16px; font-weight: 500; color: #1f1f1f; }
.review_list li a .txt span { display: inline-block; margin-right: 8px; padding: 0 8px; font-size: 14px; color: #fff; line-height: 23px; background-color: #2647a7; vertical-align: top; }
.review_list li a:hover .img img { transform: scale(1.05); }

.view_more a { display: block; width: 160px; margin: 80px auto 0 auto; padding: 6px; font-size: 15px; font-weight: 300; color: #fff; text-align: center; border-radius: 5px; background-color: #3e3e3e; }
.view_more a:hover { width: 200px; background-color: #2647a7; }

.service_sel { display: flex; flex-wrap:wrap; margin-top: 70px; border: 1px solid #9c9c9c; border-bottom:0; }
.service_sel li { width: 50%; transition: all 0.2s; border-bottom: 1px solid #9c9c9c; display:flex; align-items: center; }
.service_sel li:nth-child(1), .service_sel li:nth-child(3), .service_sel li:nth-child(5) { border-right:1px solid #9c9c9c; }
.service_sel li a { width: 100%; display: flex; align-items: center; justify-content: center; padding: 45px 10px; font-size: 28px; color:#111; }
.service_sel li a img { margin-right:10px; max-width:70px; }
.service_sel li a img.off { display:block; }
.service_sel li a img.on { display:none; }
.service_sel li:hover { background: #0d3d69; box-shadow:3px 3px 6px rgba(0,0,0,0.5); }
.service_sel li:hover a { color:#fff; }
.service_sel li:hover a img.off { display:none; }
.service_sel li:hover a img.on { display:block; }

.knowhow_bg { overflow: hidden; width: 100%; margin-top: 150px; padding-bottom: 145px; background: url('../images/main/knowhow_bg.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.knowhow_bg h2 { color: #fff; }
.knowhow_bg .des_tit { color: #fff; }
.knowhow_bg .quote { margin-top: 20px; text-align: center; }
.knowhow_bg .quote a { display: inline-block; padding: 5px 20px; font-size: 20px; font-weight: 300; color: #fff; border-radius: 5px; border: 1px solid #fff; }
.knowhow_bg .quote a:hover { padding: 5px 40px; font-weight: 500; color: #0d1323; border: 1px solid #79dee8; background-color: #79dee8; }
.knowhow { display: flex; flex-wrap: wrap; gap: 80px 0; margin-top: 80px; }
.knowhow li { width: 25%; text-align: center; }
.knowhow li .txt { margin-top: 25px; font-size: 25px; font-weight: 600; color: #fff; }

.client_list { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 70px; }
.client_list li { position: relative; width: calc((100% - 90px) / 7); }
.client_list li:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; border: 1px solid #ddd; transition: all 0.3s; }
.client_list li:hover:before { border: 1px solid #999; }
.client_list li img { max-width: 100%; }

.event_list { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 70px; }
.event_list li { width: calc((100% - 48px) / 4); text-align: center; }
.event_list li a { display: block; }
.event_list li a .img { overflow: hidden; }
.event_list li a .img img { width: 100%; aspect-ratio: 1/1; object-fit: cover; transition: transform .5s; }
.event_list li a .tit { overflow: hidden; display: block; white-space: nowrap; text-overflow: ellipsis; margin-top: 20px; font-size: 20px; font-weight: 600; color: #1f1f1f; }
.event_list li a .txt { overflow: hidden; display: block; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; font-size: 15px; color: #666; }
.event_list li a:hover .img img { transform: scale(1.05); }

.satisfaction_list { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 70px; }
.satisfaction_list li { width: calc((100% - 80px) / 6); transition: all 0.3s; }
.satisfaction_list li:hover { box-shadow: 5px 5px 10px rgba(0,0,0,0.1); }
.satisfaction_list li .img { position: relative; }
.satisfaction_list li .img img { width: 100%; }
.satisfaction_list li .img span { position: absolute; top: 8px; left: 8px; padding: 0 8px; font-size: 13px; font-weight: 600; color: #000; line-height: 19px; border-radius: 10px; background-color: #ffea04; }
.satisfaction_list li .cont { text-align: center; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.satisfaction_list li .name { padding-top: 10px; font-size: 15px; font-weight: 500; color: #111; }
.satisfaction_list li .rating { font-size: 17px; font-weight: 600; color: #111; }
.satisfaction_list li .rating span { display: inline-block; margin-left: 8px; font-size: 15px; color: #ddca00; vertical-align: 1px; }
.satisfaction_list li .txt { overflow: hidden; display: block; white-space: nowrap; text-overflow: ellipsis; margin-top: 10px; padding: 6px; font-size: 16px; font-weight: 500; color: #111; background-color: #ffea04; }

@media screen and (max-width: 1280px) {
	.wrap { width: 980px; margin: 0 auto; }

	.kcpba .award { width: 100%; padding: 50px 0; }
	.kcpba .award .tit br { display: none; }
	.kcpba .gif { width: 100%; margin: 0; }

	.pro_system li .img .tit { font-size: 19px; }

}

@media screen and (max-width:980px) {
	.wrap { width: 750px; margin: 0 auto; }

	#main { margin-top: 94px; }

	.visual .slide1 { height: auto; background: none; }
	.visual .slide1 .mobile { display: block; width: 100%; }
	.visual .slide2 { height: auto; background: none; }
	.visual .slide2 .mobile { display: block; width: 100%; }
	.visual .text { display: none; }

	.pro_system li { width: calc((100% - 16px) / 2); }

	.satisfaction_list li { width: calc((100% - 32px) / 3); }

}

@media screen and (max-width:768px) {
	.wrap { width: auto; margin: 0 20px; }

	#main { margin-top: 67px; }

	 h2 { margin-top: 5px; font-size: 28px; }
	 h2.mgtop { margin-top: 70px; }

	.des_tit { margin-top: 75px; font-size: 18px; }

	.main_real { padding: 20px; }
	.main_real .inner { max-width: 100%; }
	.main_real .real_tit {width: 150px; font-size: 15px; line-height: 20px; }
	.main_real .main_real_li {margin-right: 20px;}
	.main_real .main_real_li span { font-size: 15px; line-height: 20px; }
	.main_real .main_real_li span:nth-child(2) {margin: 0 5px; }

	.kcpba .award { padding: 30px 0 25px 0; }
	.kcpba .award .mark img { height: 150px; }
	.kcpba .award .txt { margin-top: 15px; font-size: 15px; }
	.kcpba .award .tit { margin-top: 10px; font-size: 20px; }
	.kcpba .gif { width: calc(100% + 40px); margin: 0 -20px; }
	.kcpba .check_txt { padding: 10px 0; font-size: 18px; line-height: 25px; }
	.kcpba .check_txt img { height: 25px; margin-right: 10px; }

	.pro_system { gap: 10px; margin-top: 45px; }
	.pro_system li { width: calc((100% - 10px) / 2); }
	.pro_system li .img .tit { position: static; padding: 10px 0; font-size: 15px; border-radius: 0; background: rgba(41,113,185,1); }
	.pro_system li .txt { padding: 10px 5px; font-size: 14px; }
	.pro_system li .txt br { display: none; }

	.gray_bg { margin-top: 80px; padding-bottom: 40px; }

	.review_list { gap: 30px 10px; margin-top: 45px; }
	.review_list li { width: calc((100% - 10px) / 2); }
	.review_list li a .txt { margin-top: 10px; font-size: 13px; line-height: 20px; }
	.review_list li a .txt span { font-size: 11px; line-height: 20px; }

	.view_more a { width: 120px; margin: 40px auto 0 auto; padding: 6px; font-size: 13px; }
	.view_more a:hover { width: 160px; }

	.service_sel { margin-top: 35px; }
	.service_sel li a { padding: 25px 10px; font-size: 18px; }
	.service_sel li a img { max-width:40px; }

	.knowhow_bg { margin-top: 80px; padding-bottom: 75px; }
	.knowhow_bg .quote { margin-top: 10px; }
	.knowhow_bg .quote a { font-size: 15px; }
	.knowhow { gap: 35px 0; margin-top: 50px; }
	.knowhow li { width: 50%; }
	.knowhow li figure img { height: 75px; }
	.knowhow li .txt { margin-top: 15px; font-size: 16px; }

	.client_list { gap: 10px; margin-top: 45px; }
	.client_list li { width: calc((100% - 20px) / 3); }

	.event_list { gap: 35px 10px; margin-top: 45px; }
	.event_list li { width: calc((100% - 10px) / 2); }
	.event_list li a .tit { margin-top: 15px; font-size: 15px; }
	.event_list li a .txt { margin-top: 8px; font-size: 13px; }

	.satisfaction_list { gap: 10px; margin-top: 45px; }
	.satisfaction_list li { width: calc((100% - 10px) / 2); }
	.satisfaction_list li .name { font-size: 14px; }
	.satisfaction_list li .rating { margin-top: 3px; font-size: 16px; }
	.satisfaction_list li .rating span { font-size: 14px; }
	.satisfaction_list li .txt { font-size: 14px; }
}

@media screen and (max-width:480px) {
	.wrap { width: auto; margin: 0 20px; }

}