@charset "UTF-8";

.main{position: relative;}
.main video{width: 100%; display: block;}
.main .main_text{position: absolute; z-index: 5; height: 100%; left: 0; right: 0; margin: 0 auto; top: 0; display: flex; justify-content: center; flex-direction: column;}
.main .main_text h2{display: flex; color: #fff; font-size: 55px; font-weight: 300; margin-top: 12px;}
.main .main_text h3{font-size: 25px; color: #fff; font-weight: 600; margin-bottom: 30px;}
.main .scroll{position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 40px;}
.main .scroll .box{width: 70px; text-align: center;}
.main .scroll .circle{width: 100%; height: 70px; border-radius: 50%; background: #003265; }
.main .scroll span{ animation: 1.5s bounce2 linear infinite; position: absolute; bottom: 50px;}
@keyframes bounce2{
	0%,100% {transform:translateY(0);}
	50% {transform:translateY(15px);}
}

.main1{padding-top: 140px; position: relative;}
.main1 .width{position: relative;}
.main1 .img{display: flex; align-items: flex-end; justify-content: flex-end; max-width: 1400px; width: 100%; margin:  0 0 0 auto; height: 1100px;}
.main1 .img img{width: 100%}
.main1 .text{position: absolute; top: 0; left: 0; }
.main1 .text p{width: 46%;}
.main1 .text h3{font-size: 22px; font-weight: 700; text-transform: uppercase; color: rgba(0,50,101,0.5); margin-bottom: 25px;}
.main1 .text h2{margin-bottom: 50px}
.main1 .point{position: absolute; right: 5%; top: 100px;  animation: 2s bounce linear infinite;}
@keyframes bounce{
	0%,100% {transform:translateY(0);}
	50% {transform:translateY(20px);}
}

.title h2{font-size: 55px; color: #262626; font-weight: 400;}
.title p{font-size: 20px; color: #262626; line-height: 160%;}
.title h3{font-size: 22px; font-weight: 800; text-transform: uppercase; color: rgba(0,50,101,0.5); margin-bottom: 25px;}

.main2{background: url('../img/bg1.png') no-repeat; background-size: cover; background-position: center;}
.main2 .text h2{color: #fff; margin-bottom: 25px;}
.main2 .text p{color: #bed4e4; font-weight: 400;}
.main2 .img{margin-top: 50px; display: block;}
.main2 .img img{width: 100%;}

.main3{background: #f6f6f6;}
.main3 .width{position: relative;}
.main3 .text{position: relative;}
.main3 .text h3{ color: #003265; font-weight: 800; font-size: 30px; margin-bottom: 20px;}
.main3 .text h2{font-size: 42px; line-height: 135%;}
.main3 .text a{position: absolute; right: 0; bottom: 0; width: 150px; height: 50px; display: flex; align-items: center; justify-content: space-between; background: #003265; color: #fff; font-size: 16px; padding: 0px 20px; border-radius: 30px; font-weight: 700;}
.main3 .m1Swiper{margin-top: 120px;}
.main3 .swiper-wrapper{padding: 10px 0px;}
.main3 .swiper-slide{padding: 40px 15px 0px 15px; border-radius: 30px; background: #fff; text-align: center; box-shadow: 0px 0px 15px rgba(0,0,0,0.08); transition:transform 800ms ease 0s; cursor: pointer; overflow: hidden;}
.main3 .swiper-slide img{width: 100%; transition: 0.3s all;}
.main3 .swiper-slide h2{font-size: 18px; color: #aaa; font-weight: 800; margin-bottom: 4px;}
.main3 .swiper-slide h3{font-size: 28px; color: #262626; font-weight: 500; margin-bottom: 4px;}
.main3 .swiper-slide h4{font-size: 16px; color: #666; font-weight: 800; margin-bottom: 30px;}
.main3 .swiper-slide:hover{background: #003265;}
.main3 .swiper-slide:hover h2{color: #ddd;}
.main3 .swiper-slide:hover h3{color: #fff; font-weight: 900;}
.main3 .swiper-slide:hover h4{color: #6c94bd;}
.main3 .m_btn{position: absolute; top: 64%; z-index: 10; display: flex; justify-content: space-between; width: 100%;}
.main3 .m_btn .swiper-button-next1{right: -50px; position: absolute; font-family: 'SUIT-ExtraLight';color: #7b7b7b; font-size: 40px; cursor: pointer;}
.main3 .m_btn .swiper-button-prev1{left: -50px; position: absolute; font-family: 'SUIT-ExtraLight'; color: #7b7b7b; font-size: 40px; cursor: pointer;}
.main3 .swiper-slide-prev{transform: perspective(960px) rotateY(-90deg); }
.main3 .swiper-slide:hover img{transform: scale(1.05);}

.main4{background: url('../img/bg2.png') no-repeat; background-size: cover; background-position: center;  padding: 60px 0px; text-align: center; background-attachment: fixed;}
.main4 h2{font-size: 42px; color: #fff;}
.main4 p{font-size: 16px; color: rgba(255,255,255,0.2); font-weight: 800; text-transform: uppercase; letter-spacing: 0.4em; margin-top: 40px;}

.main41{background: url('../img/bg3.png') no-repeat; background-size: cover; background-position: center; }
.main41 .swiper-slide img{width: 85%; border: 2px solid #f4f4f4; transition: 0.3s all;}
.main41 .swiper-slide:hover img{border: 2px solid #73869d;}
.main41 .swiper-slide{text-align: center;}
.main41 .swiper-slide p{font-size: 18px; color: #666; margin-top: 20px; font-weight: 700;}
.main41 .width .more{ width: 150px; height: 50px; display: flex; align-items: center; justify-content: space-between; background: #003265; color: #fff; font-size: 16px; padding: 0px 20px; border-radius: 30px; font-weight: 700; margin: 80px auto 0px auto; position: relative;}
.main41 .m_btn{position: absolute; top: 40%; z-index: 10; display: flex; justify-content: space-between; width: 100%;}
.main41 .m_btn .swiper-button-next2{right: -50px; position: absolute; font-family: 'SUIT-ExtraLight';color: #7b7b7b; font-size: 40px; cursor: pointer;}
.main41 .m_btn .swiper-button-prev2{left: -50px; position: absolute; font-family: 'SUIT-ExtraLight'; color: #7b7b7b; font-size: 40px; cursor: pointer;}

.main5{display: flex;}
.main5 .img{width:42% ; height: 580px; overflow: hidden;}
.main5 .img img{width: 100%;  object-fit: cover; height: 100%;}
.main5 .box{width: 70%; background: #003265; padding: 0px 0px 0px 7%; display: flex; flex-direction: column; justify-content: center;}
.main5 .box h2{font-size: 30px; color: #fff; font-weight: 300;}
.main5 .box .m3Swiper{width: 95%; margin-left: initial; margin-top: 75px; display: flex; gap:30px 7%;}
.main5 .numbox h3{font-size: 50px; color: #73869d; transition: 0.2s all;}
.main5 .numbox p{font-size: 22px; color: #73869d; margin-top: 15px; transition: 0.2s all;}
.main5 .numbox{width: auto !important; text-align: center;}
.main5 .numbox.on h3{color: #fff;}
.main5 .numbox.on p{color: #fff;}
/* .main5 .swiper-wrapper{transform: initial !important;} */
.wrapper { margin-top: 40px;display: flex;	justify-content: flex-start;	width: 60%;	height: 4px; }
.background { 	animation: 9s linear infinite growdown; height: inherit;
background: #73869d;  opacity: 0.3; }
.bar {animation: 9s linear infinite growup;	height: inherit;background: #fff;	opacity: 1;}
@keyframes growup {
	from {
	width: 0%;
	}

	to {
	width: 100%;
	}
}

@keyframes growdown {
	from {
	width: 100%;
	}

	to {
	width: 0%;
	}
}

.main6{position: relative;}
.main6 .title{position: relative;}
.main6 .title h3{font-size: 22px; font-weight: 700; text-transform: uppercase; color: rgba(0,50,101,0.5); margin-bottom: 5px;}
.main6 .title h2 b{font-size: 45px; font-weight: 900;}
.main6 .title p{color: #666; margin-top: 10px;}
.main6 .text a{position: absolute; right: 0; bottom: 0; width: 150px; height: 50px; display: flex; align-items: center; justify-content: space-between; background: #003265; color: #fff; font-size: 16px; padding: 0px 20px; border-radius: 30px; font-weight: 700;}
.main6 .m4Swiper{margin-top: 60px; margin-bottom: 90px;}
.main6 .m4Swiper .swiper-slide{font-size: 19px; font-weight: 800; padding-bottom: 10px; border-bottom: 2px solid #ddd; color: #ddd; text-align: center; cursor: pointer;}
.main6 .m4Swiper .swiper-slide-thumb-active{color: #003265; border-bottom: 2px solid #003265;}
.main6 .m4Swiper2 .swiper-slide{display: flex; justify-content: space-between; gap: 30px 0px}
.main6 .m4Swiper2 .swiper-slide .text{width: 45%; padding: 20px 0px 0px 0px;}
.main6 .m4Swiper2 .swiper-slide .img{width: 55%;;}
.main6 .m4Swiper2 .swiper-slide .img img{width: 100%;}
.main6 .m4Swiper2 .swiper-slide h3{color: #262626; font-weight: 900; font-size: 45px; margin-bottom: 25px;}
.main6 .m4Swiper2 .swiper-slide p{color: #003265; font-size: 20px; font-weight: 600; line-height: 140%;}
.main6 .m6_btn{display: flex;  gap:0px 20px; align-items: center; position: absolute; bottom: 10px; z-index: 10;;}
.main6 .m6_btn .swiper-button-prev3{font-size: 20px; cursor: pointer;}
.main6 .m6_btn .swiper-button-next3{font-size: 20px; cursor: pointer;}
.main6 .m6_btn .swiper-pagination{position: initial; width:auto;}
.main6 .m6_btn .swiper-pagination span{font-family: 'SUIT-Bold';}
.main6 .m4Swiper .swiper-slide:hover{border-bottom: 2px solid #003265; color: #003265;}

.main7{background: #f6f6f6; position: relative;}
.main7 .root_daum_roughmap_landing{width: 57% !important; margin: 0 0 0 auto;}
.main7 .width{position: absolute; left: 0; right: 0; margin: 0 auto; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.main7 .width .tel{font-size: 32px; font-weight: 900; color: #003265; display: block; margin-top: 25px;}
.main7 .width > p{font-size: 18px; color: #003265; margin-top: 25px;}
.main7 .width .box_wrap{margin-top: 45px; display: flex; gap:0px 5%; width: 50%;}
.main7 .width .box h2{font-size: 18px; font-weight: 800; color: rgba(0,50,101,0.4); margin-bottom: 15px;}
.main7 .width .box h3{font-size: 16px; color: #666; font-weight: 800; margin-bottom: 15px;}
.main7 .width .box li{display: flex; margin-top: 12px; align-items: center;}
.main7 .width .box li span{font-size: 16px; color: #666; font-weight: 800; min-width: 90px; border-right: 1px solid #ddd; margin-right: 20px;}
.main7 .width .box li p{color: #999; font-size: 14px; font-weight: bold;}
.main7 .width .sns .sns_btn{display: flex; align-items: center; gap: 0px 15%;}

footer{background: #333; padding: 35px 0px;}
footer .width{display: flex; justify-content: space-between;}
footer .width .text a{font-size: 15px; color: #979797; font-weight: 900;}
footer .width .copy p{color: #999; font-size: 15px;}

.sub_visual .sub_top_text h3{font-size: 44px; font-weight: 900; margin-bottom: 30px;}
.sub_visual .stop_nav{display: flex; align-items: center; gap:0px 10px; background: rgba(0,0,0,0.5); border-radius: 30px; padding: 10px 20px; width: max-content; margin: 0 auto;}

.page1 .img{width: 100%; display: block; position: relative; padding-top: 60px; margin-bottom: 50px;}
.page1 .img img{width: 100%;}
.page1 .img .point{position: absolute; top: -50px; right: -100px; animation: rotate_image 20s linear infinite;transform-origin: 50% 50%;}
@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}
.page1 p{font-size: 18px; line-height: 170%; margin-bottom: 140px;}
.page1 .ci_wrap h4{font-size: 22px; font-weight: 900;  color: rgba(0,50,101,0.5); margin-bottom: 15px;}
.page1 .ci_wrap .bg{background: url('../img/bg4.png') no-repeat; background-size: cover; background-position: center; padding: 158px 0px;}
.page1 .ci_wrap .bg span{display: block; text-align: center;}

.page2{background: url('../img/bg5.png') no-repeat; background-size: cover; background-position: center;}
.page2 .sub_title{text-align: center;}
.page2 .sub_title p{font-size: 19px;color: #003265; line-height: 145%; font-weight: 600; margin-top: 30px;}
.page2 .sub_title .img_wrap{padding-top: 90px; position: relative;}
.page2 .sub_title .img_wrap .img img{width: 100%;}
.page2 .sub_title .img_wrap .point{position: absolute; top: -0px; right: -100px; animation: rotate_image 20s linear infinite;transform-origin: 50% 50%;}

.page21{padding-top: 0px;}
.page21 .box1 span{margin-left: -120px;}
.page21 .box2 span{margin-left: -30px;}
.page21 .box4 span{margin-right: -90px;}
.page21 .box .text{margin-left: 20px;}
.page21 .box{display: flex; align-items: flex-start; justify-content: space-between; margin-top: 100px;}
.page21 .box2{flex-direction: row-reverse;}
.page21 .box4{flex-direction: row-reverse;}
/* .page21 .box span{width: 50%;} */
.page21 .box span img{width: 100%;}
.page21 .box .text{width: 70%;}
.page21 .box .text h3{font-size: 28px; color: #003265; font-weight: bold; margin-bottom: 7px;}
.page21 .box .text h2{font-size: 45px; font-weight: 900; color: #262626;}
.page21 .box .text .tbox{display: flex; flex-wrap: wrap; gap: 40px 2%; margin-top: 40px; overflow-y: scroll; height: 500px;}
.page21 .box .text ul{width: 100%;}
.page21 .box .text ul h4{font-size: 19px; color: #262626; font-weight: bold; margin-bottom: 10px;}
.page21 .box .text ul li{font-size: 15px; color: #8a8a8a; line-height: 200%; font-weight: bold; letter-spacing: -0.05em}

.page3 .title{text-align: center; margin-bottom: 90px;}
.page3 .title h2{font-size: 45px; margin-bottom: 10px;}
.page3 .title p{color: #666;}
.page3 .tabnav{display: flex; margin-bottom: 70px;}
.page3 .tabnav li{width: 14.3%;}
.page3 .tabnav li a{text-align: center; display: block; color: #ddd; border-bottom: 2px solid #ddd; padding-bottom: 15px; font-size: 20px; font-weight: 800; cursor: pointer;}
.page3 .tabnav li a.active{color: #003265; border-bottom: 2px solid #003265;}
.page3 .tabox .top_wrap{display: flex; justify-content: space-between; margin-bottom: 90px;}
.page3 .tabox .top_wrap .top{width: 47%;}
.page3 .tabox .top_wrap .top h2{font-size: 55px; color: #262626; font-weight: 900; margin-bottom: 15px;}
.page3 .tabox .top_wrap .top h3{font-size: 24px; color: #003265;}
.page3 .tabox .top_wrap .text{width: 50%;}
.page3 .tabox .top_wrap .text p{font-size: 22px; color: #262626; line-height: 160%;}
.page3 .m5Swiper2{margin-bottom: 10px;}
.page3 .m6Swiper2{margin-bottom: 10px;}
.page3 .m7Swiper2{margin-bottom: 10px;}
.page3 .m8Swiper2{margin-bottom: 10px;}
.page3 .m9Swiper2{margin-bottom: 10px;}
.page3 .m10Swiper2{margin-bottom: 10px;}
.page3 .m11Swiper2{margin-bottom: 10px;}
.page3 .tabnav li a:hover{border-bottom: 2px solid #003265; color: #003265;}

.page4{background: url('../img/bg6.png') no-repeat; background-size: cover; background-position: center; padding: 170px 0px 90px 0px; position: relative;}
.page4 h2{font-size: 50px; color: #494949; font-weight: 300; line-height: 150%;}
.page4 h2 b{color: #003265; font-weight: 800;}
.page4 span{position: absolute; top: -30px; left: -100px;}

.page41{background: #f6f6f6; padding: 60px 0px 120px 0px;}
.page41 .box_wrap{display: flex; flex-wrap: wrap; gap: 80px 2%;}
.page41 .box{text-align: center; width: 32%;}
.page41 .box img{width: 100%;}
.page41 .box h3{font-size: 22px; font-weight: bold; color: #003265; margin-top: 20px; margin-bottom: 10px;}
.page41 .box h2{font-size: 26px; font-weight: 900; color: #494949; text-transform: uppercase;}

.page5 .title{margin-bottom: 100px;}
.page5 .title h2{font-size: 44px; font-weight: 800;}
.page5 .box_wrap{display: flex; justify-content: space-between; align-items: center; margin-bottom: 120px;}
.page5 .box_wrap h2{font-weight: bold; color: #262626; font-size: 28px; margin-bottom: 70px;}
.page5 .box_wrap .img{width: 50%;}
.page5 .box_wrap .img img{width: 100%;}
.page5 .box h3, .page5 .box_wrap2 h3{font-size: 22px; color: #003265; margin-bottom: 20px;}
.page5 .box li{display: flex; margin-top: 17px;}
.page5 .box li span{color: #262626; font-weight: 800; font-size: 18px; min-width: 120px;}
.page5 .box li p{color: #666; font-weight: 700; font-size: 18px;}
.page5 .box:nth-child(3){margin-top: 60px;}
.page5 .box h4{font-size: 26px; color: #262626; font-weight: 800;}
.page5 .p5_btn{margin-top: 45px; display: flex; gap:0px 1%;}
.page5 .p5_btn a{width: 200px; height: 48px; border-radius: 7px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800;}
.page5 .p5_btn a:nth-child(1){background: #31d81f;}
.page5 .p5_btn a:nth-child(2){background: #ffce24;}
.page5 .icon_wrap{display: flex;}
.page5 .icon_wrap .icon{width: 33.333%; position: relative; padding: 0px 3%; text-align: center;}
.page5 .icon_wrap .icon::after{content: ''; width: 1px ; height: 105px; background: #e2e2e2; position: absolute; right: 0; transform: translateY(15%); top: 0;}
.page5 .icon_wrap .icon:last-child::after{display: none;}
.page5 .icon_wrap .icon p{margin-top: 20px; font-size: 18px; color: #262626; line-height: 150%;}

/* .page6 .title{margin-bottom: 50px;} */
.page6 .title h2{font-size: 45px; line-height: 150%;}
.page6 .box_wrap2{margin-top: 140px;}
.page6 .box_wrap2 h3{margin-bottom: 8px;}
.page6 .box_wrap2 .box{display: flex; align-items: center; justify-content: space-between; margin-top: 50px;}
.page6 .box_wrap2 .text{width: 50%;}
.page6 .box_wrap2 .img2{width: 47%; margin-left: -60px;}
.page6 .box_wrap2 .img2 img{width: 100%;}
.page6 .box_wrap2 .text h2{font-size: 40px; color: #262626; font-weight: 400; line-height: 140%; margin-bottom: 70px;}
.page6 .box_wrap2 .text h2 strong{color: #003265; font-weight: 900;}
.page6 .box_wrap2 .text p{margin-bottom: 0px; color: #262626;}

.page7 .title{text-align: center; margin-bottom: 80px;}
.page7 .title h2{font-size: 44px; color: #262626; font-weight: 800; margin-bottom: 35px;}
.page7 .title p{color: #494949; word-break: keep-all;}
.page7 .img img{width: 100%;}
.page7 .img_wrap{margin-top: 140px; display: flex; align-items: center; justify-content: space-between;}
.page7 .img_wrap .text{width: 45%; text-align: left; margin-bottom: 0px;}
.page7 .img_wrap .img2{width: 52%; margin-right: -35px;}
.page7 .img_wrap .img2 img{width: 100%;}

.page8{background: url('../img/bg7.png') no-repeat; background-size: cover; background-position: center;}
.page8 .text{width: 54%; margin: 0 0 0 auto;}
.page8 .text h2{font-size: 38px; color: #fff; font-weight: 800; margin-bottom: 35px;}
.page8 .text h3{font-size: 24px; color: #fff; font-weight: 800; margin-bottom: 15px;}
.page8 .text p{font-size: 18px; color: #fff; line-height: 150%;}

.page9{position: relative; background: #f6f6f6; padding-top: 140px;}
.page9 .line{width: 1px; height: 140px; background: #003265; display: inline-block; position: absolute; top: -200px; left: 0; right: 0; margin: 0 auto;}
.page9 .line::after{content: ''; width: 15px; height: 15px; border-radius: 50%; left: -7px;  background: #003265; position: absolute; bottom: -5px;}
.page9 .title{text-align: center; margin-top: 60px;}
.page9 .title h3{font-size: 16px; color: #003265; letter-spacing: 0.3em !important;}
.page9 .title h2{color: #003265;}
.page9 .p1Swiper{margin-top: 110px;}
.page9 .p1Swiper .swiper-slide{display: flex;}
.page9 .p1Swiper .swiper-slide .img{width: 48%; }
.page9 .p1Swiper .swiper-slide .img img{object-fit: cover; height: 580px;}
.page9 .p1Swiper .swiper-slide .text{width: 52%; background: url('../img/bg8.png')no-repeat; background-position: center; background-size: cover; display: flex; flex-direction: column; justify-content: center; padding: 0px 50px;}
.page9 .p1Swiper .swiper-slide .text h5{font-size: 20px; color: #003265; font-weight: 900; margin-bottom: 20px;}
.page9 .p1Swiper .swiper-slide .text h2{font-size: 36px; color: #262626; font-weight: 800; margin-bottom:45px;}
.page9 .p1Swiper .swiper-slide .text p{font-size: 18px; color: #494949; word-break: keep-all; line-height: 160%;}
.page9 .p1Swiper .swiper-slide .text h6{color: #767676; font-size: 18px; font-weight: 800; margin-top: 50px;}
.page9 .p1Swiper .swiper-slide .text h6 b{color: #262626; font-size: 22px;}
.page9 .p9_btn{display: flex; width: 52%; margin: 0 0 0 auto; padding-left: 50px; position: absolute; z-index: 10; right: 0; bottom: 50px; gap:0px 24px}
.page9 .p9_btn .swiper-button-prev5{font-size: 22px; cursor: pointer;}
.page9 .p9_btn .swiper-button-next5{font-size: 22px; cursor: pointer;}

.page10{background: url('../img/bg9.png') no-repeat; background-size: cover; background-position: center;}
.page10 .stitle{text-align: center; margin-bottom: 100px;}
.page10 .stitle h2{font-size: 40px; color: #fff; font-weight: 800; margin-top: 20px; margin-bottom: 25px;}
.page10 .stitle p{font-size: 24px; color: #fff; font-weight: 300;}
.page10 .box{background: #fff; border-radius: 25px; overflow: hidden; margin-top: 30px; display: flex; align-items: center; justify-content: space-between;}
.page10 .box .img{width: 46%;}
.page10 .box .img img{width: 100%; height: 300px; object-fit: cover;}
.page10 .box .text{width: 50%; padding: 0px 35px 0px 0px;}
.page10 .box .text h6{display: inline-block; font-size: 32px; color: #003265; border-bottom: 1px solid #003265; font-weight: 800; margin-bottom: 20px;}
.page10 .box .text h2{font-size: 32px; font-weight: 800; color: #003265; margin-bottom: 22px;}
.page10 .box .text p{font-size: 18px; color: #262626; line-height: 145%; word-break: keep-all;}

.page11{background: url('../img/bg10.png') no-repeat; background-size: cover; background-position: center;}
.page11 .title{text-align: center; margin-bottom: 100px;}
.page11 .title h3{font-size: 16px; color: #003265; letter-spacing: 0.3em !important; margin-bottom: 40px;}
.page11 .title h2{color: #003265;}
.page11 .box_wrap{display: flex; gap: 0px 2%;}
.page11 .box{width: 32%; border-radius: 20px; overflow: hidden;}
.page11 .box h4{font-size: 20px; color: #fff; background: rgb(40,98,157);
background: linear-gradient(77deg, rgba(40,98,157,1) 0%, rgba(15,118,137,1) 100%); text-align: center; padding: 20px 0px;  letter-spacing: 0.2em !important; font-weight: 800;}
.page11 .box .text{background: #f5f5f5; padding: 40px 15px; text-align: center;}
.page11 .box .text h2{font-size: 28px; color: #262626; font-weight: 800; margin-bottom: 25px;}
.page11 .box .text p{font-size: 19px; color: #262626; line-height: 145%; word-break: keep-all;}

.page12 .title{margin-bottom: 110px;}
.page12 .box_wrap{display: flex; flex-wrap: wrap; gap: 60px 2%;}
.page12 .box{width: 49%; border: 1px solid #ccc; background: #fff; padding: 50px 40px; position: relative;}
.page12 .box h6{width: 50px; height: 50px; border-radius: 50%; background: #003265; text-align: center; font-size: 22px; line-height: 50px; color: #fff; font-weight: 900; position: absolute; top: -25px;}
.page12 .box h2{font-size: 30px; color: #262626; font-weight: 800; border-bottom: 14px solid #dbe1e7;  line-height: 35%; display: inline-block; padding-right: 15px;}
.page12 .box p{font-size:18px; color: #262626; padding-top: 20px; border-top: 1px solid #ccc; margin-top: 25px; line-height: 140%; word-break: keep-all;}

.page13{background: url('../img/bg11.png') no-repeat; background-size: cover; background-position: center;}
.page13 .stitle{text-align: center; margin-bottom: 100px;}
.page13 .stitle h6{font-size: 16px; color: #fff; letter-spacing: 0.3em !important; font-weight: 800; margin-bottom: 20px;}
.page13 .stitle h2{font-size: 40px; color: #fff; font-weight: 800; margin-bottom: 35px;}
.page13 .stitle h2 b{color: #79aff0;}
.page13 .stitle p{font-size: 20px; color: #fff; line-height: 145%;}
.page13 .box_wrap{display: flex;}
.page13 .box_wrap .box{width: 25%; border-left: 1px solid rgba(255,255,255,0.1); padding: 0px 30px; text-align: center;}
.page13 .box_wrap .box:last-child{border-right:1px solid rgba(255,255,255,0.1);}
.page13 .box_wrap .box h3{font-size: 28px; font-weight: 800; color: #fff; margin-top: 15px; margin-bottom: 20px;}
.page13 .box_wrap .box p{font-size: 15px; color: #fff; line-height: 155%;}

.page14 .stitle{text-align: center; margin-bottom: 110px;}
.page14 .stitle h6{font-size: 16px; color: #003265; letter-spacing: 0.3em !important; font-weight: 800; margin-bottom: 20px;}
.page14 .stitle h2{font-size: 55px; color: #003265;  font-weight: 300; margin-bottom: 10px;}
.page14 .stitle p{font-size: 20px; color: #003265; line-height: 145%;}
.page14 .box_wrap{display: flex; flex-wrap: wrap; gap: 50px 2%;}
.page14 .box{width: 32%; background: #fff; border-radius: 30px; box-shadow: 0px 0px 15px rgba(0,0,0,0.08); padding: 0px 30px 40px 30px;}
.page14 .box .num{width: 90px; height: 90px; margin-top: -10px; display: flex; align-items: center; justify-content: center; text-align: center; background: #0f3461;}
.page14 .box .num h6{font-size: 15px; color: #fff; text-transform: uppercase; line-height: 165%;}
.page14 .box .num h6 b{font-size: 25px; font-weight: 800;}
.page14 .box:nth-child(2) .num{background: #507bb0;}
.page14 .box:nth-child(3) .num{background: #2c5485;}
.page14 .box:nth-child(4) .num{background: #2c5485;}
.page14 .box:nth-child(5) .num{background: #0f3461;}
.page14 .box:nth-child(6) .num{background: #507bb0;}
.page14 .box .text h2{font-size: 32px; color: #003265; font-weight: 800; margin-top: 25px; margin-bottom: 15px;}
.page14 .box .text p{font-size: 16px; color: #262626; line-height: 155%;}
.page14 .box .text{background: url('../img/icon9.png') no-repeat; background-position: 100% 90%;}
.page14 .box:nth-child(2) .text{background: url('../img/icon10.png') no-repeat; background-position: 100% 90%; }
.page14 .box:nth-child(3) .text{background: url('../img/icon11.png') no-repeat; background-position: 100% 90%; }
.page14 .box:nth-child(4) .text{background: url('../img/icon12.png') no-repeat; background-position: 100% 90%; }
.page14 .box:nth-child(5) .text{background: url('../img/icon13.png') no-repeat; background-position: 100% 90%; }
.page14 .box:nth-child(6) .text{background: url('../img/icon14.png') no-repeat; background-position: 100% 90%; }

.page15{background: url('../img/bg12.png') no-repeat; background-size: cover; background-position: center;}
.page15 .width{display: flex; justify-content: space-between; gap:30px 0px; align-items: center;}
.page15 .width .stitle{width: 45%; margin-bottom: 100px;}
.page15 .width .stitle h6{font-size: 16px; color: #003265; letter-spacing: 0.3em !important; font-weight: 800; margin-bottom: 20px;}
.page15 .width .stitle h2{font-size: 48px; color: #262626; margin-bottom: 40px; font-weight: 800;}
.page15 .width .stitle p{font-size: 22px; line-height: 155%; color: #494949; word-break: keep-all;}
.page15 .width .img{width: 50%;}
.page15 .width .img img{width: 100%;}

.page16 .box:nth-child(1) .text{background: url('../img/icon15.png') no-repeat; background-position: 100% 90%; }
.page16 .box:nth-child(2) .text{background: url('../img/icon16.png') no-repeat; background-position: 100% 90%; }
.page16 .box:nth-child(3) .text{background: url('../img/icon17.png') no-repeat; background-position: 100% 90%; }

.btn-15 {
    background: #003265;
   color: #fff;
   z-index: 1;
   border: 2px solid #003265;
 }
 .btn-15:after {
   position: absolute;
   content: "";
   width: 0;
   height: 100%;
   top: 0;
   right: 0;
   z-index: -1;
    background: #fff;
   transition: all 0.3s ease;
   color: #003265;
   border-radius: 30px;
 }
 .btn-15:hover {
   color: #003265 !important;
 }
 .btn-15:hover:after {
   left: 0;
   width: 100%;
 }
 /* .btn-15:active {
   top: 2px;
 } */

.pop_wrap .pop-inner{padding: 0px;}
.pop_wrap .pop-inner h3{font-size: 20px; color: #fff; background: #003265; padding: 10px 0px; text-align: center;}
.pop_wrap .pop-text img{width: 100%;}
.pop_wrap .pop-text {text-align: center; padding-bottom: 30px;}
.pop_wrap .pop-text h4{font-size: 22px; color: #003265; font-weight: 800; margin-top: 20px;}
.pop_wrap .pop-text h5{font-size: 28px; color: #262626; text-transform: uppercase; font-weight: 900; margin: 10px 0px 20px 0px;}
.pop_wrap .pop-text p{font-size: 16px; color: #666; line-height: 150%; padding: 0px 20px;}

.quick_wrap{position: fixed; right: 15px; top: 30%;z-index: 25; text-align: center;}
.quick_wrap .quick{width: 70px; background: #fff; padding: 20px 0px; text-align: center; box-shadow: 0px 0px 5px rgba(0,0,0,0.12); border-radius: 33px; overflow: hidden;}
.quick_wrap .quick a{padding: 10px 0px; display: block;}
.quick_wrap .quick a p{color: #494949; margin-top: 8px; font-size: 11px}
.quick_wrap #top_btn2{margin-top: 10px; width: 55px; height: 55px; text-align: center; line-height: 55px; background:  #003265; border-radius: 50%; color: #fff; font-size: 11px}
.quick_wrap .quick a svg{width: 30px; height: 30px;}

.mquick_wrap{position: fixed; left: 0; bottom: 0; width: 100%;z-index:25;}
.mquick_wrap .mquick{display: flex;background: #fff; border-radius: 20px 20px 0px 0px; box-shadow: 0px -5px 10px rgba(0,0,0,0.2); padding: 12px 0px;}
.mquick_wrap .mquick a{width: 25%; border-right: 1px solid #eaeaea;text-align: center;}
.mquick_wrap .mquick a:last-child{border-right: 0px;}
.mquick_wrap .mquick a p{color: #494949; margin-top: 10px; font-size: 11px}

.page17 .width{display: flex; justify-content: space-between; gap:30px 0px; align-items:center;}
.page17 .img{width: 50%; text-align: center;}
.page17 .img img{width: 70%}
.page17 .text{width: 50%;}
.page17 .text h2{font-size: 38px; font-weight: 400; line-height: 135%; margin-bottom: 35px}
.page17 .text h2 b{color: #0f3461; font-weight: 900}
.page17 .text h2 span{font-weight: bold;}
.page17 .text li{margin-top: 20px}
.page17 .text li span{font-size: 17px; line-height: 135%;}
.page17 .text li .fir{color: #0f3461; font-weight: 800;}

.page18 h2{font-size: 42px; color: #0f3461; font-weight: 400; line-height: 140%; text-align: center; margin-bottom: 60px}
.page18 .box_wrap{display: flex; gap:45px 4%; justify-content: center;}
.page18 .box{width: 25%}
.page18 .box img{width: 100%}

.new_img{max-width: 709px; width: 100%; margin: 80px auto 0 auto;}
.new_img img{width: 100%;}


@media all and (max-width: 1400px){
    .main1 .text h3{font-size: 14px;}
    .title h2{font-size: 45px;}
    .title p{font-size: 16px; word-break: keep-all;}
    .main1 .point{top: initial; bottom: 57%;}
    .main1 .point img{width: 280px;}
    .main3 .text h3{font-size: 24px;}
    .main3 .text h2{font-size: 32px;}
    .main3 .swiper-slide h2{font-size: 16px;}
    .main3 .swiper-slide h3{font-size: 23px;}
    .main3 .swiper-slide h4{font-size: 14px; margin-bottom: 20px;}
    .main4 h2{font-size: 24px; word-break: keep-all;}
    .main6 .title h2 b{font-size: 35px;}
    .main6 .m4Swiper2 .swiper-slide h3{font-size: 35px;}
    .main6 .m4Swiper2 .swiper-slide p{font-size: 17px;}
    .title h3{font-size:16px; margin-bottom: 15px;}
    .page21 .box span{width: 60%;}
    .page21 .box span img{width: 100%;}
    .page21 .box .text h3{font-size: 22px;}
    .page21 .box .text h2{font-size: 30px;}
    .page21 .box .text ul h4{font-size: 20px;}
    .page21 .box .text ul li{font-size: 12px;}
    .page21 .box .text{padding-left: 3%;}
    .page21{padding-top: 0px;}
    .page3 .title h2{font-size: 32px;}
    .page4 h2{font-size: 40px;}
    .page4{padding: 90px 0px;background-position: 18%;}
    .page4 span{left: 0; top: -35px;}
    .page4 span img{width: 40px;}
    .page41 .box h3{font-size: 18px;}
    .page41 .box h2{font-size: 21px;}
    .page5 .title h2{font-size: 32px;}
    .page5 .title{margin-bottom: 50px;}
    .page5 .box_wrap h2{font-size: 23px; margin-bottom: 40px;}
    .page5 .box h3, .page5 .box_wrap2 h3{font-size: 20px;}
    .page5 .box li span, .page5 .box li p{font-size: 16px;}
    .page5 .box h4{font-size: 22px;}
    .page6 .title h2{font-size: 30px;}
    .page6 .box_wrap2 .img2{margin-left: 0px;}
    .page6 .box_wrap2 .text h2{font-size: 28px; margin-bottom: 40px;}
    .page1 p{font-size: 16px;}
    .page7 .title h2{font-size: 32px; margin-bottom: 15px;}
    .page7 .title{margin-bottom: 50px;}
    .page8 .text h2{font-size: 28px;}
    .page8 .text h3{font-size: 20px;}
    .page8 .text p{font-size: 16px;}
    .page8 .text p br{display: none;}
    .page8 .text{width: 65%;}
    .page9 .title h3{font-size: 14px;}
    .page10 .box .text h6{font-size: 25px;}
    .page10 .box .text h2{font-size: 25px;}
    .page10 .box .text p{font-size: 16px;}
    .page11 .title h3{margin-bottom: 25px;}
    .page11 .box h4{font-size: 18px;}
    .page11 .box .text h2{font-size: 23px;}
    .page11 .box .text p{font-size: 16px;}
    .page14 .box .num{width: 70px; height: 70px;}
    .page14 .box .num h6{font-size: 12px;}
    .page14 .box .num h6 b{font-size: 22px;}
    .page14 .box .text h2{font-size: 28px;}
    .page14 .box{width: 49%;}
    .page15 .width .stitle h6{font-size: 14px;}
    .page15 .width .stitle h2{font-size: 35px;}
    .page15 .width .stitle p{font-size: 19px;}
}
@media all and (max-width: 1200px){
    .main1 .img{height: 1000px;}
    .main1 .point{bottom: 48%;}
    .main{display: flex; justify-content: center;}
    .main video{height: 700px; width: auto;}
    .main5 .box h2{font-size: 24px;}
    .main5 .box .m3Swiper{margin-top: 55px;}
    .main5 .numbox h3{font-size: 34px;}
    .main5 .numbox p{font-size: 20px;}
    .main5 .box{width: 60%;}
    .main5 .img{width: 40%; height: 420px;}
    .main7 .root_daum_roughmap_landing{width: 50% !important;}
    .page9 .p1Swiper .swiper-slide .text h2{margin-bottom: 25px; font-size: 32px;}
    .page9 .p1Swiper .swiper-slide .text p{font-size: 16px;}
    .page11 .box_wrap{flex-wrap: wrap; gap: 30px 2%;}
    .page11 .box{width: 49%;}
    .page12 .box h2{font-size: 24px;}
    .page12 .box p{font-size: 17px;}
    .page13 .stitle h2{font-size: 30px;}
    .page13 .stitle h6{font-size: 14px;}
    .page13 .stitle p{font-size: 16px;}
    .page13 .box_wrap .box h3{font-size: 22px;}
    .page13 .box_wrap .box p{font-size: 14px;}
		.page17 .text h2{font-size: 26px}
		.page17 .text li span{font-size: 16px}
		.page18 h2{font-size: 32px}
}
@media all and (max-width: 1024px){
    .main1 .text p{width: 100%;}
    .main1 .point{bottom: 36%;}
    .main1 .point img{width: 200px;}
    .main1 .img{height: initial; padding-top: 600px;}
    .main3 .text a{position: initial; margin: 0 0 0 auto; margin-top: 20px;}
    .main7 .width .tel{font-size: 28px;}
    .main7 .width > p{font-size: 15px; margin-top: 20px;}
    .title h2{font-size: 36px; line-height: 150%; margin-bottom: 25px;}
    .main1 .text h2{margin-bottom: 35px;}
    .page1 .img .point img{width: 120px;}
    .page1 .img .point{top: -10px; right: -30px;}
    .page1 p{font-size: 17px;}
    .page2 .sub_title p{font-size: 15px;font-weight: 600;}
    .page2 .sub_title p br{display: none;}
    .page2 .sub_title .img_wrap .point{top: -10px; right: -30px;}
    .page2 .sub_title .img_wrap .point img{width: 120px;}
    .page2 .sub_title .img_wrap{padding-top: 50px;}
    .page21 .box{flex-direction: column; margin-top: 90px;}
		.page21 .box1{margin-top: 0px}
    .page21 .box span{margin-left: 0px; width: 80%;}
    .page21 .box .text{padding-left: 0px; width: 100%; margin-top: 30px;}
    .page21 .box:nth-child(2n){flex-direction: column;}
    .page21 .box span{margin-right: 0px;}
    .page3 .tabnav li a{font-size: 17px;}
    .page3 .tabox .top_wrap .top h2{font-size: 40px;}
    .page3 .tabox .top_wrap .top h3{font-size: 20px; line-height: 145%;}
    .page3 .tabox .top_wrap .text p{font-size: 17px;}
    .page3 .tabox .top_wrap .text p br{display: none;}
    .common{padding: 80px 0px;}
    .sub_visual .sub_top_text h3{font-size: 30px;}
    .page5 .icon_wrap .icon p{font-size: 16px;}
    .page5 .icon_wrap .icon p br{display: none;}
    .page9 .p1Swiper .swiper-slide .img img{height: 430px;}
    .page10 .stitle h2{font-size: 30px;}
    .page10 .stitle p{font-size: 18px;}
    .page14 .box{width: 100%;}
    .main1{padding-top: 90px;}
    .main .main_text h3{font-size: 20px;}
    .main .main_text h2{font-size: 35px;}
    .page13 .box_wrap .box{padding:20px}
    .page13 .box_wrap{flex-wrap: wrap; gap: 10px 2%;}
    .page13 .box_wrap .box{width: 49%; border: 1px solid rgba(255,255,255,0.1);}
}
@media all and (max-width: 900px){
    .page3 .tabox .top_wrap{flex-direction: column;}
    .page3 .tabox .top_wrap .top{width: 100%; margin-bottom: 30px;}
    .page3 .tabox .top_wrap .text{width: 100%;}
    .page41 .box{width: 49%;}
    .page41 .box h3{font-size: 14px;}
    .page41 .box h2{font-size: 17px;}
    .page5 .box_wrap{flex-direction: column-reverse;}
    .page5 .box_wrap .img{width: 100%; margin-bottom: 30px;}
    .page5 .box_wrap .text{width: 100%;}
    .page6 .box_wrap2 .box{flex-direction: column;}
    .page6 .box_wrap2 .img2{width: 100%; margin-bottom: 40px;}
    .page6 .box_wrap2 .text{width: 100%;}
		.page17 .width{flex-direction: column;}
		.page17 .text{width: 100%}
		.page17 .img{width: 100%}
}
@media all and (max-width: 850px){
    .main3 .m1Swiper{margin-top: 80px;}
    .main3 .text h2{word-break: keep-all !important;}
    .main3 .text h2 br{display: none;}
    .main5{flex-direction: column;}
    .main5 .img{width: 100%; height: 350px;}
    .main5 .box{width: 100%; padding: 60px 4%;}
    .wrapper{width: 100%;}
    .main6 .m4Swiper2 .swiper-slide{flex-direction: column-reverse;}
    .main6 .m4Swiper2 .swiper-slide .img{width: 100%;}
    .main6 .m4Swiper2 .swiper-slide .text{width: 100%;}
    .main6 .m6_btn{right: 0; bottom: 0px;}
    .main7 .width{position: initial; width: 100%; padding: 50px 0px;}
    .main7 .root_daum_roughmap_landing{width: 100% !important;}
    .main7{display: flex; flex-direction: column-reverse;}
    .main7 .width .box_wrap{width: 100%;}
    footer .width{flex-direction: column; gap: 15px 0px}
    .page4 h2{font-size: 28px;}
    .page9 .p1Swiper .swiper-slide{flex-direction: column;}
    .page9 .p1Swiper .swiper-slide .img{width: 100%;}
    .page9 .p1Swiper .swiper-slide .img img{height: initial;}
    .page9 .p1Swiper .swiper-slide .text{padding: 40px 30px; width: 100%; height: 450px;}
    .page9 .p9_btn{width: 100%; padding-right: 4%; justify-content: flex-end; bottom: 40px;}
    .page7 .title p br{display: none;}
    .page11 .box{width: 100%;}
    .page15 .width{flex-direction: column-reverse;}
    .page15 .width .img{width: 100%;}
    .page15 .width .stitle{width: 100%; margin-bottom: 0px;}
    .page7 .img_wrap{flex-direction: column;}
    .page7 .img_wrap .text{width: 100%; margin-bottom: 30px;}
    .page7 .img_wrap .img2{width: 100%; margin-right: 0px;}
    .page7 .title h2{font-size: 26px;}
    .page9 .p1Swiper .swiper-slide .text h2{font-size: 26px;}
}
@media all and (max-width: 768px){
    .main1 .point img{width: 130px;}
    .main1 .point{bottom: 23%;}
    .main3 .text h3{font-size: 21px;}
    .main3 .text h2{font-size: 26px;}
    .main3 .m1Swiper{margin-top: 80px;}
    .main4 p{font-size: 14px; letter-spacing: 0.2em;}
    .main video{height: 600px; width: auto;}
    .main41 .swiper-slide p{font-size: 16px;}
    .main5 .numbox h3{font-size: 28px;}
    .main5 .box .m3Swiper{justify-content: center;}
    .main6 .title h2 b{font-size: 30px;}
    .main6 .title h3{font-size: 20px;}
    .main6 .text a{position: initial; margin: 0 0 0 auto; margin-top: 20px;}
    .main6 .m4Swiper .swiper-wrapper{flex-wrap: wrap;}
    .main6 .m4Swiper .swiper-slide{width: 33.333% !important; margin-bottom: 10px;}
    .main6 .m4Swiper{margin-bottom: 45px; display: none;}
    .main6 .m4Swiper2 .swiper-slide{margin-top: 50px;}
    .page1 .ci_wrap .bg span{width: 80%; display: block; margin: 0 auto;}
    .page1 .ci_wrap .bg span img{width: 100%;}
    .page21 .box span{margin-left: 0px; width: 90%;}
    .page3 .tabnav{flex-wrap: wrap;}
    .page3 .tabnav li{width: 25%; margin-bottom: 12px;}
    .page3 .tabox .top_wrap .top h2{font-size: 32px;}
    .page5 .icon_wrap{flex-direction: column;}
    .page5 .icon_wrap .icon{width: 100%; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #e2e2e2;}
    .page5 .icon_wrap .icon::after{display: none;}
    .page5 .icon_wrap .icon:last-child{border-bottom: 0px;}
    .page6 .title h2{font-size: 24px;}
    .page6 .title h2 br{display: none;}
    .page6 .box_wrap2 .text h2{font-size: 26px;}
    .page9 .title h2{font-size: 26px;}
    .page8 .text{width: 100%; text-align: center;}
    .page10 .box{flex-direction: column;}
    .page10 .box .img{width: 100%;}
    .page10 .box .text{padding: 40px 30px; width: 100%;}
    .page10 .box .img img{height: 260px;}
    .page12 .box{width: 100%; padding: 40px 25px;}
    .page14 .box .text p{font-size: 14px;}
    .main .scroll .box{width: 50px;}
    .main .scroll .circle{height: 50px;}
    .main .scroll span img{width: 4.5px;}
    .main .scroll span{bottom: 40px;}
    footer .width .copy p{color: #999; font-size: 9px;}
		.page18 .box_wrap{flex-direction: column; align-items: center;}
		.page18 .box{width: 70%}
		.page17 .text h2{font-size: 22px}
		.page18 h2{font-size: 22px}
    .page21 .box .text .tbox{height: 300px;}
}
@media all and (max-width: 650px){
    .page2 .sub_title .logo{width: 70%;}
    .page5 .p5_btn a{width: 50%;}
    .main .main_text h3{font-size: 16px;}
    .main .main_text h2{font-size: 26px;}
    .main .main_text{padding-bottom: 100px;}
    .main3 .m1Swiper{margin-top: 80px;}
    footer .width .copy p{color: #999; font-size: 9px;}
    .page13 .box_wrap .box{width: 100%;}
}