.mo_open{display: none}
.mo_nav_are{display: none}

.pclist{}
.molist{display: none}

@media (max-width: 1640px) {

  .logo_top{left: 20px}
  .sns_top{right: 20px}
  
  .main_about_long p, .main_title p{font-size: 18px; line-height: 34px; word-break: keep-all}
  
  .common_btn{height: 70px; line-height: 70px; font-size: 18px; width: 240px}
  
  .main_visual_txt h2{font-size: 80px;}
  
  

.sub_bg{height: 400px}
.sub_bg img {
    display: block;
    max-width: 100%;
    width: 100%;
    scale: 1.1;
    transition-duration: 5s;
    object-fit: cover;
    height: 100%;
}  
  

}






@media (max-width: 1580px) {

  .main_about_img{width: 50%}


}


@media (max-width: 1360px) {

 
  .video_are {

    padding-bottom: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
} 
   
   
.main_slide iframe   {
	position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 120%;
    transform: translate(-50%, -50%);
    object-fit: cover; /* Ensures video covers the entire screen */
    border: none;
    pointer-events: none; /* Prevent interaction with the video */
}



.ceo_flex {
    display: flex;
    gap: 50px;
    justify-content: flex-start;
    align-items: flex-start;
}

.ceo_txt p br{display: none}

.ceo_flex .thum{width: 30%}
.ceo_txt{flex:1}

.sub_nav{gap:30px}
.sub_nav a{font-size: 18px}


.history_flex{gap:50px}
.history_txt .box{gap:30px}

.sub_subject h2{font-size: 30px; line-height: 40px}

.history_txt .box h3{font-size: 24px; width: 70px}

.history_txt .box ul{padding: 0}
.history_txt .box ul li{font-size: 16px; line-height: 22px}
.history_txt .box ul li + li{margin-top: 10px}

.sub_subject{margin-bottom: 30px}

.awards, .product_list{gap:70px 20px}
.awards .box, .product_list a{
    width: calc(25% - 15px);
}

.partner_flex_sub{gap:70px 20px}
.partner_flex_sub .box {
    width: calc(25% - 15px);
}

.partner_flex_sub .box .thum{height: 200px; padding: 25px 55px}
    .partner_flex_sub .box .thum img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }



.gall_list_style{gap:70px 20px}
.gall_list_style li {
    width: calc(33.33% - 13.33px);
}

.top_product_flex{gap:50px}

.down_cate a, .send_iq button{width: auto; padding: 0 25px; font-size: 16px}

.prodcut_info_are .box li{font-size: 16px; word-break: keep-all; line-height: 22px}

.prodcut_info_are h2{font-size: 30px}

.inquiry_flex{gap:50px}


.notice_custom li{padding: 30px}

.top_nav{gap:30px}
.top_nav li .deps1{font-size: 16px}

}


@media (max-width: 1280px) {

 
 .foot_top .inner a{font-size: 16px}
.foot_info_list li{font-size: 16px; line-height: 25px}
.foot_info_list li b{height: 30px; font-size: 16px; line-height: 30px; width: 80px}

.foot_copy p{font-size: 16px}

.top_btn{width: 70px; height: 70px; right: 40px; bottom: 40px}


.main_visual_txt h2{font-size: 60px;}
.main_visual_txt p{font-size: 18px; word-break: keep-all}
 
.main_installation_slide{margin: 0 -10px}	
.main_installation_slide .slick-slide{padding: 30px 10px}	

.main_partner_flex .box p{font-size: 18px}



.sub_top .sub_title p{font-size: 18px}
.sub_top .sub_title h2{font-size: 40px}

.sub_nav{gap:30px; }
.sub_nav a{font-size: 18px}

.sub_bg{height: 300px}

.gall_list_style{gap:20px}

.gall_list_style li {
    width: calc(33.33% - 13.33px);
}


.board_list_txt {
    margin-top: 20px;
}

.board_list_txt h3{font-size: 18px}
.board_list_txt p{font-size: 16px}

.board_detail_title h2{font-size: 30px}
.board_detail_title p{font-size: 16px}



.total_top p{font-size: 16px}



	
}




@media (max-width: 1024px) {
	
.header_top{height: 100px}	
	
	
	img{max-width: 100%}
	
.main_slide iframe   {

    width: 240%;
    height: 240%;

}	
	
.main_about .inner {
    display: flex;
    gap: 50px;
    justify-content: space-between;
    align-items: center;
    flex-direction: column-reverse;
}	
	
	
.main_about .main_about_txt {
    flex: none;
    width: 100%;
}	

    .main_about_img {
        width: 100%;
        max-height: 40vh;
    }
	
	
.main_product_flex {
    margin-top: 60px;
    display: flex;
    gap: 50px 20px;
    flex-wrap: wrap;
}	
	
.main_product_flex a:nth-child(2) {
    margin-top: 0px;
}	


.main_product_flex a:nth-child(1) { order: 2; width: calc(50% - 10px)}
.main_product_flex a:nth-child(2) { order: 1; width: 100%}
.main_product_flex a:nth-child(3) { order: 3; width: calc(50% - 10px)}

.main_product_flex a:nth-child(1) .thum,
.main_product_flex a:nth-child(2) .thum,
.main_product_flex a:nth-child(3) .thum{border-radius: 10px}
	
.main_product_flex a .thum img {
        aspect-ratio: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
}	



.main_partner .inner {
    display: flex;
    gap: 60px;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.main_partner .inner .main_title.point_title {
    text-align: center;
    flex: none;
    position: relative;
    top: 0;
    left: 0; width: 100%
}


.main_partner_flex {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-end;
    gap: 20px;
    width: 100%;
}
.main_partner_flex .box {
    width: calc(50% - 10px);
}


.main_partner_flex .box:nth-child(2n) {
    margin-top: 0;
}



.main_partner .inner .main_title.point_title .common_btn {
    margin: 40px auto 0;
}


.foot_info .inner {
    display: flex;
    gap: 20px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}


/* 모바일 네비 시작 */

	.top_nav{display: none}
	.sns_top{right: 80px}

  
  	.mo_open{display: block;
    width: 25px;
    height: 19px;
    position: fixed;
    right: 20px;
    top: 40px;
    z-index: 9999}
    
    .top_header.drop .mo_open  span{background: #222}

    .mo_open  span {
    display: block;
    position: absolute;
    right: 0;
    width: 100%;
    height: 3px;
    border-radius: 15px;
    background: #fff;
    transition: all 0.3s ease-in-out;}

    .mo_open span:first-child {
    top: 0;}

    .mo_open span:nth-child(2) {
    top: 50%;
    width: 70%;
    transform: translateY(-50%);}

    .mo_open span:nth-child(3) {
    bottom: 0;}


    .open_nav .mo_open span{background: #fff}

    .open_nav .mo_open span:first-child {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);}


    .open_nav .mo_open span:nth-child(2) {
    opacity: 0;}

    .open_nav .mo_open span:nth-child(3) {
    bottom: 50%;
    transform: translateY(50%) rotate(-45deg);}
    
    .mo_nav_are{position: fixed; right: -100%; top: 0; background: #1D1D1B; 
    width: 100%;; height: 100%; z-index: 9998; transition-duration: 1s; opacity: 0; display: block}

  	.open_nav .mo_nav_are{right: 0; transition-duration: 1s; opacity: 1}
  	
  
  	
  	.nav_drop{margin-top: 130px}

    .collapsible {
            background-color: #1D1D1B;
            color: #fff;
            cursor: pointer;
            padding: 20px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 18px; font-weight: bold
        }
        .collapsible .active,
        .collapsible:hover {
            color: #551C87
        }
        .content {
            padding: 0 20px;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.2s ease-out;

        }

        .content a{font-size: 18px; padding: 8px 0; display: block; color: #fff}

        .collapsible:after {
            content: '\002B';
            color: #fff;
            font-weight: bold;
            float: right;
            margin-left: 5px;
        }
        .collapsible .active:after {
            content: "\2212";
        }



.open_nav_sns{position: absolute; left: 20px; top: 35px; display: flex; gap:10px}
.open_nav_sns .sns_icon, .open_nav_sns .lang_icon {background: rgba(255,255,255,.2); width: 40px; height: 40px; display: flex; border-radius: 50px;justify-content: center;
    align-items: center; transition-duration: .5s}
.open_nav_sns .sns_icon:hover{box-shadow: 4px 4px 25px 0px rgba(0, 0, 0, 0.20);}
.open_nav_sns .sns_icon:first-child:hover{background: #19166C}
.open_nav_sns .sns_icon:nth-child(2):hover{background: #E64473;}
.open_nav_sns .sns_icon:nth-child(3):hover{background: #FF0000}


/* 모바일 네비 끝 */

.install_slide_are{margin-top: 30px}

.pclist{display: none}
.molist{display: block}



.sub_section{padding: 100px 0}


.history_flex .thum{width: 30%}


.top_product_flex {
    display: flex;
    gap: 50px;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}

.product_slide_are {
    width: 100%;
}

.product_big img{width: 100%}

.prodcut_detail_img{margin-top: 100px}


    .inquiry_flex {
        gap: 50px;
        justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    }


.inquiry_flex .sub_subject {
    position: relative;
    top: 0;
    left: 0;
}


.sub_subject h2{word-break: keep-all}
.sub_subject h2 br{display: none}


}




@media (max-width: 860px) {

.section {
    padding: 100px 0;
}

.main_title h2{font-size: 40px; line-height: 50px; word-break: keep-all}
.main_title h2 br{display: none}

.main_product_flex a p, .main_installation_slide a p{font-size: 18px; margin-top: 25px}


.arrowSlider .prev{left: 20px}
.arrowSlider .next{right: 20px}



.sub_bg {height: 200px;}
.gall_list_style{gap:40px 20px}
    .gall_list_style li {
        width: calc(50% - 10px);
    }



.ceo_flex, .history_flex {
        display: flex;
        gap: 50px;
        justify-content: flex-start;
        align-items: flex-start;
        flex-direction: column;
    }

.ceo_flex .thum, .history_flex .thum {
        width: 100%;
        border-radius: 10px;
    }

.history_flex .thum{position: relative; top: 0;}
    .sub_nav {
        gap: 30px;
        flex-wrap: nowrap;
        overflow-x: auto;
    }


.sub_nav a {
        font-size: 18px;
        flex: 0 0 auto;
    }



    .awards .box, .product_list a, .partner_flex_sub .box {
        width: calc(50% - 10px);
    }


.notice_custom li{border-radius: 10px}

.notice_custom .notice_txt h3{font-size: 18px}
.notice_custom .notice_txt p{font-size: 14px}


.agree_pop_content{max-width: 90%}




}




@media (max-width: 600px) {

    .header_top {
        height: 80px;
    }
 
.sns_top{display: none}
.logo_top{top: 25px} 
.logo_top img{max-width: 100px} 
.mo_open{top: 25px} 
 
 

.main_visual_txt h2 {
        font-size: 40px;
    }


    .top_btn {
        width: 50px;
        height: 50px;
        right: 20px;
        bottom: 40px;
    }



    .main_title h2 {
        font-size: 24px;
        line-height: 34px;
        word-break: keep-all;
    }


.main_about_long p, .main_title p {
        font-size: 16px;
        line-height: 25px;
        word-break: keep-all;
    }

.main_about_long p br, .main_title p br{display: none}


    .common_btn {
        height: 50px;
        line-height: 50px;
        font-size: 16px;
        width: auto;
        display: inline-flex;
        gap: 30px;
        border-radius: 10px 2px 10px 2px;
    }


.common_btn span.plus img{max-width: 10px}

.main_about_img {
    border-radius: 30px 5px 30px 30px;}
    
    
.main_product_flex{margin-top: 40px}    
    
    
 .main_title.point_title h2 span:after {
    content: '';
    position: absolute;
    right: -18px;
    top: 0;
    width: 10px;
    height: 10px;
    background: url(../img/point_title.svg);
    background-position: center;
    background-repeat: no-repeat;
    transition-duration: .5s;
    background-size: 10px auto;
}   


.main_product_flex a p, .main_installation_slide a p {
        font-size: 16px;
        margin-top: 22px;
    }



    .install_slide_are {
        margin-top: 10px;
    }
    
.main_partner_flex .box .thum {
    height: 120px;
    display: flex;
    border: 1px solid #ddd;
    border-radius: 5px;
    align-items: center;
    justify-content: center;
    transition-duration: .5s;
    padding: 15px;
} 
 
    .main_partner_flex .box p {
        font-size: 14px;
        margin-top: 15px;
    } 
 
 
    .main_partner_flex .box .thum img {
        width: 100%;
        object-fit: contain;
        height: 100%;
    }
.foot_info_list li{line-height: 22px;
    gap: 15px;
    justify-content: flex-start;
    align-items: flex-start; font-size: 14px}
.foot_info_list li span{flex:1}    

.foot_info_list li b {
        height: 25px;
        font-size: 14px;
        line-height: 25px;
        width: 60px;
    }

.foot_copy{padding: 30px 20px}
.foot_copy p{font-size: 14px; word-break: keep-all}

    .section {
        padding: 50px 0;
    }

.arrowSlider{display: none}  


.sub_top {
    padding: 120px 0 0 0;
}
.sub_top .sub_title p{font-size: 12px}
.sub_top .sub_title h2{font-size: 24px}
.sub_top .sub_title{margin-bottom: 30px}
.sub_nav{display: none}

.sub_bg {height: 150px;}
.gall_list_style{gap:40px 10px}
    .gall_list_style li {
        width: calc(50% - 5px);
    }

    .sub_section {
        padding: 50px 0;
    }

.board_list_txt h3{font-size: 16px}
.board_list_txt p{font-size: 12px}

.board_detail_title h2{font-size: 18px}
.board_detail_title p{font-size: 12px}


.notice_custom .date{width: 80px}
.notice_custom .date h2{font-size: 16px;}
.notice_custom .date p{font-size: 12px}
.notice_custom li {
        padding: 25px 15px;
        gap:20px
    }
    
.notice_custom .notice_txt p{margin-top: 5px}    

.sub_subject h2{font-size: 24px; line-height: 32px}

.form_in ul li {
    width: 100%;
}

.form_in ul li .file_are input{flex:1}

.down_cate a, .send_iq button{border-radius: 10px; font-size: 14px}

.ck_agree p{flex:1; word-break: keep-all}



.product_list a p {
    margin-top: 15px;
    color: #fff;
    font-size: 16px;
    word-break: keep-all;
}



.prodcut_info_are .box h3 {
    color: #551C87;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 20px;
}

.down_cate {
    margin-top: 60px;
    display: flex;
    gap: 10px;
    flex-direction: column;
}

.sub_section.pdtop{padding-top: 120px}
.product_big .slick-arrow{display: none !important}



.ceo_txt h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 20px;
    word-break: keep-all;
}

.ceo_txt p{font-size: 16px; line-height: 22px}
.ceo_txt p + p{margin-top: 10px}

.awards .box p, .partner_flex_sub .box p{margin-top: 15px;
    color: #fff;
    font-size: 16px;}
    
.partner_sub .tab{gap:10px}    
    
.partner_sub .tab__item {
    height: 50px;
    border-radius: 10px;
    border: 2px solid rgba(255, 255, 255, .2);
    width: 100%;
    text-align: center;
    font-size: 14px;
    color: #fff;
    line-height: 46px;
    font-weight: 500;
    transition-duration: .5s;
    cursor: pointer;
}  


.partner_sub .tab__content-wrapper{margin-top: 30px}  

}



@media (max-width: 360px) {

 
}


















