main{}
/* ============================= 메인화면 첫 화면 부분(1행) 시작 */
#elim_main_top{
    width: 100%; height: calc(100vh - 100px); 
    display: flex; flex-flow: column;
    justify-content: center;
    position: relative;
}

#elim_main_top * {font-weight: 800; color: #fff;}
#elim_main_top .textbox02{
    z-index: 10; 
    transform: translateY(-50%);
    position: absolute; top: 60%; left: 10%;
    animation: elim_text01 0.5s linear 0s alternate forwards;
}
#elim_main_top p:nth-child(1){
    color: #fff; margin-bottom: 30px;
    font-size: 2rem; font-weight: 200; 
}
#elim_main_top p:nth-child(2){
    color: #fff;
    font-size: 1.5rem; font-weight: 200; text-align: left;
    line-height: 1.5;
}
#elim_main_top .textbox {
    position: absolute; left: 10%; top: 50%;
    transform: translateY(-50%); z-index: 10;
}
#elim_main_top .textbox p{
    font-size: 0.625rem; letter-spacing:2.02em;
    position: relative; top: 0; left: 5px;
}
#elim_main_top .textbox h1{
    font-size: 3.75rem;
}
#elim_main_top .bg{
    width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6);
    position: absolute; top: 0; left: 0; z-index: 8;
}
#elim_main_top .video{
    width: 100%; height: calc(100vh - 100px); 
    position: absolute; top: 0; left: 0; z-index: 5;
}
#elim_main_top .video video{ 
    width: 100%;height: 100%;
    object-fit: cover;
}

@keyframes elim_text01 {
    0% {transform: translateX(-10%); opacity: 0;}
    100% {transform: translateX(0%); opacity: 1;}
}
/* ============================= 메인화면 첫 화면 부분(1행) 끝 */




/* ============================= 회사소개 (2행) 시작 */
#elim_company{
    width: 100%; height: 100vh;
    display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;
}
#elim_company .elim_company_top{
    /* max-width: 1400px; min-width: 320px; */ margin: 0 auto;
}/* 2행 위 묶음 */
#elim_company .elim_company_top .elim_company_text{
    /* display: flex; justify-content: center; align-items: start; */
    text-align: center;
}
#elim_company .elim_company_top .elim_company_text .elim_company_img1{width: 80px; height: 80px;} /* " (왼쪽) */
#elim_company .elim_company_top .elim_company_text .elim_company_img1>img{width: 100%;}
#elim_company .elim_company_top .elim_company_text .emphasis{
    font-size: 1.5rem; font-weight: 200; color: #333; margin-bottom: 20px; 
    /*  padding: 50px 100px; */
    /* border-radius: 100px; border: 5px solid #d9edff; */
}
#elim_company .elim_company_top .elim_company_text h2{
    font-size: 3rem; /* font-weight: 200; */
    font-family: "Audiowide", sans-serif; color: #123451;
}
#elim_company .elim_company_top .elim_company_text .elim_company_img2{width: 80px; height: 80px;} /* " (오른쪽) */
#elim_company .elim_company_top .elim_company_text .elim_company_img2>img{width: 100%;}
#elim_company .elim_company_top .company_introduction_go{
    display: flex; justify-content: center; align-items: center;
    padding: 10px 15px; border: 1px solid #a7a7a7; transition: all 0.3s;
    width: max-content; margin: 30px auto 0; white-space: nowrap;
}
#elim_company .elim_company_top .company_introduction_go>p{
    transition: all 0.3s;
    font-size: 0.825rem; margin-right: 10px; color: #a7a7a7;}
#elim_company .elim_company_top .company_introduction_go:hover{border: 1px solid #2e5f87; }
#elim_company .elim_company_top .company_introduction_go:hover>p{color: #2e5f87;}
#elim_company .elim_company_top .company_introduction_go:hover>p:nth-child(2){
    background: url(../../img/icon/arrow_outward02.png) center/cover;
}
#elim_company .elim_company_top .company_introduction_go>p:nth-child(2){
    width: 15px; height: 15px;
    background: url(../../img/icon/arrow_outward.png) center/cover;
}
#elim_company .elim_company_top .company_introduction_go>p>img{width: 100%;}


#elim_company .elim_company_bottom{
    width: 80%; margin-top: 50px;
}
/* ==========슬라이드 */
#company_container{
    width: 100%; height: 450px; 
    position: relative; border-radius: 20px;
}/* 보이는 영역 */
#company_container .swiper-wrapper{width: 1000px; height: 100%;}
#company_container .swiper-wrapper .swiper-slide{}/* 공통 */
#company_container .swiper-wrapper .swiper-slide .ecbt_img{
    width: 100%; height: 100%; border-radius: 20px; 
    position: absolute; top: 0; left: 0; z-index: 90;
}
#company_container .swiper-wrapper .ecbt1 .ecbt_img{background: url(../../img/index/elim_company01.jpg) center/cover;}
#company_container .swiper-wrapper .ecbt2 .ecbt_img{background: url(../../img/index/elim_company02.jpg) center/cover;}
#company_container .swiper-wrapper .ecbt3 .ecbt_img{background: url(../../img/index/elim_company03.jpg) center/cover;}
#company_container .swiper-wrapper .swiper-slide .bottom_text{
    width: 100%; height: 100%; border-radius: 20px; 
    display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;
    position: absolute; top: 0; left: 0; z-index: 100;
    /* background-color: rgba(0, 0, 0, 0.2); */
}
#company_container .swiper-wrapper .swiper-slide .bottom_text>*{
    text-align: center; line-height: 1.5;
    text-shadow: 1px 1px 3px #000;/* 글자 그림자 */
    /* text-shadow: 가로 세로 번짐 색상 */
}
#company_container .swiper-wrapper .swiper-slide .bottom_text h2{
    color: #fff;  font-size: 2rem; font-weight: 600; margin-bottom: 20px;
}/* 공통 */
#company_container .swiper-wrapper .swiper-slide .bottom_text p{width: 80%; color: #fff;}/* 공통 */
#company_container .swiper-wrapper .swiper-slide .bottom_text p:nth-child(2){margin: 15px 0;}
#company_container .swiper-wrapper .swiper-slide .bottom_text p>em{
    color: #fff; font-size: 1.25rem; font-weight: 500;
}/* 공통 */

#company_container .swiper-wrapper .ecbt2 .bottom_text h2{}
#company_container .swiper-wrapper .ecbt2 .bottom_text p>em{}

/* ============================= 회사소개 (2행) 끝 */





/* ============================= 플러스 */
/* 
#plus{width: 100%; height: 100vh; position: relative;}
#plus .bg{width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0;}
#plus .video{width: 100%; height: 100%;}
#plus .video video{width: 100%; height: 100%; object-fit: cover;}
*/
/* ============================= 사업분야 (3행) 시작 */

#elim_business{
    width: 100%; height: 100vh;
}
#elim_business .container{
    width: 100%; height: 100vh;
    display: grid; 
    grid-template-areas:
    'ebtb1 ebtb2'
    'ebtb3 ebtb4';
    grid-template-columns:1fr 1fr;
}
#elim_business .container .elim_business_textbox{
    width: 100%; height: 100%; 
    position: relative;

}/* 공동 */
#elim_business .container .elim_business_textbox .ebtb_text{
    width: 100%; height: 100%; position: absolute; top: 0; z-index: 100;
    display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;
}
#elim_business .container .elim_business_textbox .ebtb_text >*{color: #fff;}
#elim_business .container .elim_business_textbox .ebtb_text h2{font-size: 1.875rem; font-weight: 600;}
#elim_business .container .elim_business_textbox .ebtb_text p{font-size: 1.25rem; margin: 30px 0;}
#elim_business .container .elim_business_textbox .ebtb_text a{
    font-size: 1.25rem; font-weight: 500;
    padding: 20px 30px; border: 1px solid #fff; border-radius: 50px;
}
#elim_business .container .elim_business_textbox .ebtb_text a:hover{
    background-color: #fff; color: #000; border: 1px solid #fff; font-weight: 800;
}
#elim_business .container .elim_business_textbox .ebtb_img{
    width: 100%; height: 100%; position: absolute; top: 0;
    z-index: 90;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#elim_business .container .elim_business_textbox .ebtb_img .bg{
    width: 100%; height: 100%; position: absolute; top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    position: relative; overflow: hidden;
}

/* 창문 열리는 듯한 호버 변형 ▼ */
#elim_business .container .elim_business_textbox .ebtb_img .bg::after{
    content: ""; position: absolute; top: 0; left:0; height: 100%; width: 50%; 
    background-color:rgba(0, 0, 0, 0.7);
    transition: width 0.5s; z-index: 90;
}
#elim_business .container .elim_business_textbox .ebtb_img .bg::before{
    content: ""; position: absolute; top: 0; right:0; height: 100%; width: 50%; 
    background-color:rgba(0, 0, 0, 0.7);
    transition: width 0.5s; z-index: 90;
}
#elim_business .container .elim_business_textbox:has(a:hover) .ebtb_img .bg::after{width: 0%;}
#elim_business .container .elim_business_textbox:has(a:hover) .ebtb_img .bg::before{width: 0%;}

/* 타원형 호버 변형 ▼ */
/* #elim_business .elim_business_textbox .ebtb_img .bg::after{
    content: ""; position: absolute; top: 60%; left: 50%; transform: translate(-50%,-50%);
    height: 200%; width: 200%; border-radius: 1000px; 
    background-color:rgba(0, 0, 0, 0.7); 
    transition: all 0.5s; z-index: 90;
} */
/* #elim_business .elim_business_textbox:has(a:hover) .ebtb_img .bg::after{
    width: 0%; height: 0%;
} */

/* :has() : 특정 요소의 자식이나 자손으로 특정 요소를 포함하는 경우를 선택할 때 사용. (가상 클래스 선택자)  */
/* 그냥 일반적인 호버 ▼ */
/* #elim_business .elim_business_textbox:has(a:hover) .ebtb_img .bg{background-color:rgba(0, 0, 0, 0.4);}; */
/* #elim_business .elim_business_textbox:hover .ebtb_img .bg{background-color:rgba(0, 0, 0, 0.4);}; */
#elim_business .container .ebtb1{grid-area:ebtb1;}
#elim_business .container .ebtb2{grid-area:ebtb2;}
#elim_business .container .ebtb3{grid-area:ebtb3;}
#elim_business .container .ebtb4{grid-area:ebtb4;}
#elim_business .container .ebtb1 .ebtb_img{background-image: url(../../img/index/av.jpg);}/* 개별 : AV시스템 */
#elim_business .container .ebtb2 .ebtb_img{background-image: url(../../img/index/led.jpg);}/* 개별 : LED 디스플레이 */
#elim_business .container .ebtb3 .ebtb_img{background-image: url(../../img/index/cctv.jpg) ;}/* 개별 : CCTV */
#elim_business .container .ebtb4 .ebtb_img{background-image: url(../../img/index/control.jpg);}/* 개별 : 통합제어 */
/* ============================= 사업분야 (3행) 끝 */


/* 팝업 배경 (반투명 오버레이) */
.popup-overlay {
    position: fixed; inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex; align-items: center; justify-content: center;
    z-index: 9999;
}

/* 팝업 본체 */
.popup {
    background: white; width: 500px; height: 600px;
    padding: 30px 40px; position: relative;
    text-align: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    animation: fadeIn 0.3s ease;
    border-radius: 30px;
}
.popup h2{font-size: 2rem; font-weight: 600; margin-bottom: 20px;}
.popup p{
    margin-bottom: 30px; background-color: #ededed; 
    padding: 10px;  line-height: 1.5; width: 80%;
    overflow: auto;
    position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
    border-radius: 20px; 
}
.popup .img{width: 100%; border-radius: 20px; overflow: hidden; margin: 0 auto;  position: relative;} 
.popup img{ width: 100%; } 

@keyframes fadeIn { /* 팝업 애니메이션 */
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}

/* 버튼 영역 */
.popup button {
    width: 200px; padding: 20px 0; margin: 10px 5px;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    cursor: pointer;
}
.popup .btn {
    position: absolute; left: 50%; transform: translateX(-50%); bottom: 10px;
    display: flex; flex-flow: row nowrap;
}
.popup .btn-close {background: #999; color: #fff;}
.popup .btn-today {background: #0078ff; color: #fff;}