@keyframes mouse {0% {transform:translate(-50%, 0); }50% {transform:translate(-50%, 8px); }100% {transform:translate(-50%, 0); }}
@keyframes countingBar {0% {width: 0;}100% {width:100%;}}
/*20250620 수정*/
#header{height: 100px;}
.gnb_area{display: flex;align-items: center;justify-content: space-between;width: 100%;}
.gnb_area .logo_wrap{float:none}
.gnb_area .logo_wrap .logo a{display: block;width: 280px;height: 50px;background: url(../../images/khmi/eng/logo.png) no-repeat center;background-size: contain;}
.service_area{width: auto;margin: 0;float: none; margin:10px 0 0;}
/*//20250620 수정*/
.service_area ul li{display: block;}
#section01{padding: 100px 0 0;}
.footer_con .footer_c address{margin: 0;}
.footer_con .footer_l{display: flex;gap: 80px;}
.footer_con .footer_l .logo{min-width: 245px; width: 245px;height: 40px;}
@media screen and (max-width:768px){
    .gnb_area .logo_wrap{height: 70px;}
    .gnb_area .logo_wrap .logo a{width: 160px; height: 31px;}
    .gnb_area{padding: 0;}
    .service_area{display: block;}
}

.gnb_area .gnb_wrap{margin: 0;}
.section {overflow: hidden;background-repeat: no-repeat;background-size: cover;}
header .inner,
.section .inner{clear: both;width: 1300px; max-width: 1300px;}
.section .full_content{position: relative;margin: 0 auto;}

.main_txt{color: var(--main-txt) !important;}
.main_bg{color: var(--main-bg) !important;}

#fullpage{transition: all 1s;}
#slider_box{position: relative;}
#mainSlider{overflow: hidden;}
#mainSlider .video_bx{width: 100%; height: 100%; overflow: hidden;}
#mainSlider video,
#mainSlider .swiper-slide img{height: calc(100vh - 100px);width: 100%;object-fit: cover;}
#mainSlider .slider_txt{position: absolute;top: 45%;left: 13%;width: 520px;color: #fff}
#mainSlider .slider_txt b{display: block;font-size: 7rem;color: #fff;font-weight: 700;line-height: 1;}
#mainSlider .slider_txt span{display: inline-block;margin-top: 30px;color: #fff;font-size: 1.5rem;line-height: 1.5;letter-spacing: 0.05px;}
#mainSlider .mainSlider_btn {position: absolute;bottom: 15%;left: 13%;z-index: 1;display: flex;align-items: center;}
#mainSlider .mainSlider_btn .mainpage{display: flex;}
#mainSlider .mainSlider_btn .mainpage > li {position: relative;display: flex;flex:1 1 0;justify-content: center;align-items: center;position: relative;width: auto;height: 40px;border-radius:0;font-size: 1.6rem;color: rgb(255, 255, 255);opacity: 1;padding: 0 10px;}
#mainSlider .mainSlider_btn .mainpage > li.swiper-pagination-bullet{background: 0;}
#mainSlider .mainSlider_btn .mainpage > li.swiper-pagination-bullet .txt{font-weight: 600;}
#mainSlider .mainSlider_btn .mainpage > li.swiper-pagination-bullet-active {color: #fff;}
#mainSlider .mainSlider_btn .mainpage > li .bar {width:0;height: 2px;background: #000000;}
#mainSlider .mainSlider_btn .mainpage > li.swiper-pagination-bullet-active .bar{margin-left: 10px;width: 80px;background-color: #ffffff88;}
#mainSlider .mainSlider_btn .mainpage > li.swiper-pagination-bullet-active .bar::after {content: "";width: 0; height: 2px; background: #fff;display: block;animation-name: countingBar;animation-duration: 5s;animation-timing-function: linear;animation-fill-mode:forwards;z-index: 1;}
#mainSlider .mainSlider_btn .mainBtn a{display: inline-block;width: 20px;height: 20px;font-size: 2rem; color:#fff ;opacity: 0.3;}
#mainSlider .mainSlider_btn .mainBtn a.on{opacity: 1;}
#slider_box .scroll{margin:4px auto;font-size:1.3rem;font-weight:500;line-height:1;position: absolute;bottom: 31px;left: calc(50% - 50px);z-index: 1;color: #fff;text-align: center;}
#slider_box .scroll p {position:relative;width:20px;height:35px;margin:0 auto 15px;border-radius: 20px;border: 3px solid #fff;}
#slider_box .scroll span {position:absolute;top: 16%;left: 50%;display:inline-block;width: 7px;height: 7px;background: #fff;animation:mouse 1.2s alternate infinite;border-radius: 95px;}


.dot_list > li{position: relative;font-size: 1.7rem;line-height: 1.4;}
.dot_list > li::before{position: absolute;content: "";display: inline-block;}
.dot_list > li{padding-left: 10px;color: #444;}
.dot_list > li ~ li{margin-top: 10px;}
.dot_list > li::before{top: 10px;left:0;width: 3px;height: 3px;background-color: #555;border-radius: 10px;}
.dot_list li > ul{margin-top: 10px;} 


@media screen and (max-width:1201px){
    .section .full_content{margin-top: 100px;}
    #mainSlider .swiper-slide img{height: auto;}
}


@media screen and (max-width:1024px){

    #mainSlider .mainSlider_btn,
    #mainSlider .slider_txt{left: 5%;}
    #mainSlider .slider_txt{width: 80%;}
    #mainSlider .slider_txt b{font-size: 5rem;}
    #mainSlider .slider_txt span{font-size: 1.5rem}
    .section{padding: 50px 0;}
    .section h2{margin-bottom: 30px;font-size: 3rem;}

}
@media screen and (max-width:768px){
    #mainSlider .mainSlider_btn{bottom: 0;}
    #mainSlider .slider_txt{top: auto; bottom: 10%;}
    #mainSlider video,
    #mainSlider .swiper-slide img{width: 100%;object-fit: cover;}
    #mainSlider .mainSlider_btn,
    #mainSlider .slider_txt{left: 5%;}
    #slider_box .scroll{display: none;}

}
@media screen and (max-width:425px){  
    .section{padding: 20px 0;}

}

@media screen and (max-width : 1300px){
  .main_footer_banner_box{padding: 10px 0 10px 80px;}
    header .inner,
    .section .inner{clear: both;width: 100%; max-width: 100%;}
}