:root {
    --main-color: #ff6f61;
    --sub-color: #4a90e2;
    --text-color: #333;
    --max-width: 1440px;
    --site_width: 1400px;
    
}

/* 초기화 */
* {font-family: 'Noto Sans', sans-serif !important;}
html {overflow-y:scroll}
body {margin:0;padding:0;font-size:0.75em; font-family: 'Noto Sans', sans-serif; background:#fff; overflow-x: hidden;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
a { color: inherit; text-decoration: inherit; }
a:hover, a:focus, a:active { text-decoration: none; }
ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0; font-size:1em}
input[type="submit"] {cursor:pointer}
input::placeholder {font-size: 15px;color: #999;}
button {cursor:pointer}
table {border-collapse:collapse; border-spacing:0; width: 100%;}

.header_wrap {position: relative; width: 100%; margin: auto;}
#sham { display: none; cursor: pointer; }
.header_wrap video {
    height: calc(100vh - 0px);
    width: 100%;
    object-fit: cover;
    display: block;
}
.mobile_only { display: none; }
.nav {width: 100%;  margin: auto;  background: #000; }
.nav_wrap {max-width:var(--max-width); padding: 0px; border-bottom: 1px solid #c5c2c2; width: 100%; height:100px; position: absolute; top:0; left:50%; transform:translateX(-50%); }
.nav_wrap img {width: 100px; height: auto;}
.nav_wrap > ul {display: flex; justify-content: space-between; align-items: center; gap: 20px; list-style: none;}
.nav_wrap .main_menu h3 {font-size: 20px; color:#222222; font-weight:500; cursor: pointer; border: 0px solid #444444; padding:10px 20px;}
.nav_wrap .main_menu:hover h3 {color: #E89022;}
.nav_wrap .main_menu { position: relative; display: flex; align-items: center; }
.nav_wrap .main_menu .network_category {display: none;position: absolute;left: 0;top: 100%;background: #222;color: #fff;min-width: 160px;box-shadow: 0 2px 8px rgba(0,0,0,0.15);border-radius: 0 0 8px 8px;z-index: 200;padding: 20px 0;}
.nav_wrap .main_menu .network_category span {font-size: 16px;  font-weight: 400; }
.nav_wrap .main_menu:hover .network_category {display: block;}
.nav_wrap .main_menu .network_category li {padding: 14px 30px;width: 200px;cursor: pointer;}
.nav_wrap .main_menu .network_category li:hover {background: #444;}
.nav_wrap .menu {display: flex; gap: 20px; list-style: none;}


.header_wrap .txtbox {position: absolute; left: 50%; top:50%; transform: translate(-50%, -50%); }
.header_wrap .txtbox h3 {font-size: 50px; color: #fff; font-weight: 800; text-align: center; width: 100%; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); line-height: 1.5;}
.header_wrap .txtbox span {display: block; font-size: 23px; color: #fff; font-weight: 600; margin-top: 40px; text-align: center; width: 100%; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); line-height: 1.5;}
/* .sham {display: none;} */
.mouse-ani {position: absolute;left: 50%;bottom: 30px;transform: translateX(-50%);z-index: 10;}
.mouse-ani svg {display: block;}
.mouse-wheel {animation: wheelMove 1.2s infinite;}
.nav_wrap .mobile_only {display: none;}


/* 햄버거 메뉴 */
.hambuger_wrap {position: absolute; max-width: var(--site_width); top:0px; width: 60%; background: #FCB908; height: 100%; z-index: 999999991;}
.hambuger_wrap .inner {padding-left: 10px; padding-right: 10px;}
.hambuger_wrap .hambuger .top {margin-top: 30px; text-align: center;}
.hambuger_wrap .hambuger .top > ul {display: flex; justify-content: space-between; align-items: center;}
.hambuger_wrap .hambuger .top:after {content: ""; height: 1px; width: 100%; display: block; background: #e9dddd; margin-top: 10px;}
.hambuger_wrap .hambuger .top > ul  li:nth-of-type(1) {font-size: 20px; font-weight: 700; color:#fff;}
.hambuger_wrap .hambuger .top > ul  li:nth-of-type(2) {background-image: url("../images/hambuger_close.png"); width:40px; height: 40px; background-position: center; background-repeat: no-repeat; background-size: cover;}
.hambuger_wrap .hambuger .menu {margin-top: 30px;}
.hambuger_wrap .hambuger .menu > ul {display: flex; justify-content: start; align-items: left; gap: 0px; flex-direction: column; color:#fff; font-size: 18px; font-weight: 600;}
.hambuger_wrap .hambuger .menu > ul  li {height: 50px; align-items: center; padding-left: 6px;}
.hambuger_wrap .hambuger .menu > ul  li span {line-height: 50px; font-size:16px;}
.hambuger_wrap .hambuger .menu > ul  li:hover {background: #ffffff; color:#FCB908;}
#ham_close {background-image: url("/images/hambuger_close.png"); width:40px; height: 40px; background-position: center; background-repeat: no-repeat; background-size: cover;}



.nav2 {width: 100%;  margin: auto;  background: #ffffff; position: relative; }
.nav_wrap2 {max-width:var(--max-width); margin: auto; padding: 20px; border-bottom: 0px solid #ff0404; width: 100%; height:100px; }
.nav_wrap2 img {width: 100px; height: auto;}
.nav_wrap2 > ul {display: flex; justify-content: space-between; align-items: center; gap: 20px; list-style: none; padding-right: 20px;}
.nav_wrap2 .main_menu h3 {font-size: 20px; color:#1b1b1b; font-weight:500; cursor: pointer; border: 0px solid #444444; padding:10px 20px;}
.nav_wrap2 .main_menu:hover h3 {color: #E89022;}
.nav_wrap2 .main_menu { position: relative; display: flex; align-items: center; }
.nav_wrap2 .main_menu .network_category {display: none;position: absolute;left: 0;top: 100%;background: #222;color: #fff;min-width: 160px;box-shadow: 0 2px 8px rgba(0,0,0,0.15);border-radius: 0 0 8px 8px;z-index: 200;padding: 20px 0;}
.nav_wrap2 .main_menu .network_category span {font-size: 16px;  font-weight: 400; }
.nav_wrap2 .main_menu:hover .network_category {display: block;}
.nav_wrap2 .main_menu .network_category li {padding: 14px 30px;width: 200px;cursor: pointer;}
.nav_wrap2 .main_menu .network_category li:hover {background: #444;}
.nav_wrap2 .menu {display: flex; gap: 20px; list-style: none;}
/* .nav_wrap2 .mobile_only {display: none;} */




/* 회원가입 */
.member_join_wrap {max-width:700px;margin:auto;background:#fff; padding: 20px; border: 1px solid #eee; border-radius: 8px}
.member_join_wrap input{border: 1px solid #ddd; height: 40px; border-radius: 4px; padding: 2px; width: 100%; margin-bottom: 5px; font-size: 16px; color: #333;}



/* .member_join_wrap {display: flex; align-items: center; justify-content: center;} */
/* index 소개 */
.introduce {width: 100%; padding: 80px 0; background: #f9f9f9;}
.introduce .introduce_wrap {max-width: var(--max-width); margin: auto; padding: 0 20px;}
.introduce .introduce_wrap h3{font-size: 28px; font-weight: 800; margin-bottom: 50px;}
.introduce .introduce_wrap h4{font-size: 18px; font-weight: 400; line-height: 2;}
.introduce .introduce_wrap .introduct_txt > ul {display: flex; justify-content: flex-start; align-items: center; gap: 20px; list-style: none; margin-top: 50px;}
.introduce .introduce_wrap .introduct_txt > ul > li span{border: 1px solid #000;  border-radius: 8px; padding: 10px 20px; font-size: 16px; font-weight: 600; line-height: 1.5; color: #3a3a3a;}
.introduce .introduce_wrap .introduct_txt > ul > li span:hover {background: #222;color: #fff;border-color: #222;transition: background 0.2s, color 0.2s, border-color 0.2s;cursor: pointer;}
.introduce .introduce_wrap > ul {display: flex; justify-content: center; align-items: center; gap:40px;}
.introduce .introduce_wrap > ul > li:nth-child(1) {width: 40%;}
.introduce .introduce_wrap > ul > li:nth-child(2) {width: 60%;}
.introduce .introduce_wrap .intro_txt {display: flex; justify-content: center; align-items: center; gap: 10px; list-style: none;}
.introduce .introduce_wrap .intro_txt ul {border: 1px solid #eee; border-radius: 8px; }
.introduce .introduce_wrap .intro_txt .img_1 {background-image: url('/images/net_img1.png'); width: 100%; height: 570px; background-size: contain; background-repeat: no-repeat; background-position: center;}
.introduce .introduce_wrap .intro_txt .img_2 {background-image: url('/images/sol_img1.png'); width: 100%; height: 570px; background-size: contain; background-repeat: no-repeat; background-position: center;}
.introduce .introduce_wrap .intro_txt > ul > li:nth-of-type(1) {margin-bottom: 50px;}
.introduce .introduce_wrap .intro_txt > ul {display: flex; padding: 20px; justify-content: center; flex-direction: column; align-items: center; gap: 10px; list-style: none;}
.introduce .introduce_wrap .intro_txt > ul h3{font-size: 30px; font-weight: 900; margin-bottom: 70px; color: #eee;}
.introduce .introduce_wrap .intro_txt > ul h4{ font-size: 16px; font-weight: 400; line-height: 2; color: #ffffff;}
.introduce .introduce_wrap .intro_txt .img_1:hover {filter: brightness(1.3);transition: filter 0.3s, border-color 0.3s;cursor: pointer;}
.introduce .introduce_wrap .intro_txt .img_2:hover {filter: brightness(1.3);transition: filter 0.3s, border-color 0.3s;cursor: pointer;}

/* main contactus */
.product_contact { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}
.product_contact_wrap { max-width: var(--max-width); margin: auto; padding: 0 0px; text-align: center; font-size: 32px; font-weight: 700; padding-right: 20px; padding-left: 20px;}
.product_contact_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.product_contact_wrap span{font-size: 16px; font-weight: 500; color: #111; text-align: center;  }
/* .product_contact_wrap ul { display: flex; justify-content: space-between; align-items: center; gap: 20px;} */
/* .product_contact_table  tr  th {width:120px; text-align: right; padding-right: 20px; font-size: 16px; font-weight: 500; color: #111; border: 0;} 
.product_contact_table  tr  td {width:300px; text-align: right; padding-right: 20px; font-size: 16px; font-weight: 500; color: #111; } 
.product_contact_table  th,
.product_contact_table  td {border: none !important;}
.product_contact_table tr  td input {width: 300px; height: 40px; border-radius: 0px; border: 1px solid #f8f7f7; background: #d1cfcf;  padding-left: 10px; color:#2e2e2e;}
.product_contact_table tr  td textarea {width: 100%; height: 140px; border-radius: 0px; border-bottom: 20px solid #d3d2d2; background: #2e2e2e;  padding-left: 10px; padding-top: 10px; color:#ffffff;} */

.product_contact_table2 {width: 600px; margin: auto; background: #eeecec; border: 1px solid #eee; padding: 40px; margin-top: 20px;}
.product_contact_table2 h3 {font: optional; font-size: 26px; font-weight: 800; color: #111; margin-bottom: 10px;}
.product_contact_table2 h4 {font: optional; font-size: 16px; font-weight: 500; color: #111; margin-bottom: 10px;}


.sentmail_btn {text-align: right; padding-right: 20px;}
.sentmail_btn button {background: var(--main-color);  color: #fff; border: none; padding: 12px 30px; border-radius: 5px; font-size: 16px; font-weight: 500; cursor: pointer; transition: background-color 0.3s ease; margin-top: 20px;}
.sentmail_btn button:hover {background: #d19b33;}   

/* 메인 고객센터 */
.customer {width: 100%; padding-top: 0px; background: #f9f9f9;}
.customer .customer_wrap {max-width: var(--max-width); margin: auto; border: 1px solid #eee; padding: 20px; text-align: center;}
.customer .customer_wrap h3{font-size: 28px; font-weight: 800; margin-bottom: 0px;}
.customer .customer_wrap span{font-size: 18px; font-weight: 800; margin-bottom: 20px;}
.customer .customer_wrap ul {display: flex; justify-content:space-around; align-items: center; gap: 20px; list-style: none; margin-top: 0px;}
.customer .customer_wrap ul li span {font-size: 16px; font-weight:  400; color: #000;}     
.customer .customer_wrap ul li > ul {display: flex; gap: 5px; align-items: center;}

/* 메인 스위치 스위퍼 */
.main_product { width: 100%;  margin-top: 0px; padding-top: 80px; padding-bottom: 80px;  background: #eeeeee;}
.main_product_wrap { max-width: var(--max-width); margin: auto; padding: 20px; text-align: center; font-size: 32px; font-weight: 700;}    
.main_product_wrap h3{text-align: left; font-size: 27px; font-weight: 700; margin-bottom: 20px;}    

.main_product2 { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}
.main_product2_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}    
.main_product2_wrap h3{text-align: left; font-size: 27px; font-weight: 700; margin-bottom: 20px;}    

/* 통신솔루션  비지 */
.communication_bg_wrap {position: relative; background-image: url('/images/co_bg2.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.communication_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: right; color: #fff;}
.communication_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.communication_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}


/* 회원가입 */
.member_plan_bg_wrap {position: relative; background-image: url('/images/member_bg2.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.member_plan_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.member_plan_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.member_plan_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}


/* 도면 비지 */
.floor_plan_bg_wrap {position: relative; background-image: url('/images/floor_plan_bg.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.floor_plan_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.floor_plan_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.floor_plan_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}
.floor_plan { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}   
.floor_plan_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.floor_plan_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.floor_plan_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }
.floor_plan_list { width: 100%;  padding-top: 0px; padding-bottom: 80px;  background: #fff;}   
.floor_plan_list_wrap { max-width: var(--max-width); margin: auto; padding: 0 0px; text-align: center; }


/* 도면 비지 */
.certificate_bg_wrap {position: relative; background-image: url('/images/certificate_bg.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.certificate_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.certificate_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.certificate_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}


/* 도면 다운로드 게시판 */
.floor_plan_list_wrap > table{width: 100%; } 
.floor_plan_list_wrap .table-search-box {text-align: right; margin-bottom: 10px; padding-right: 20px;} 
.floor_plan_list_wrap .table-search-box img {width: 34px; height: auto; vertical-align: middle; margin-right: 10px; padding-bottom: 20px; cursor: pointer;}
.floor_plan_list_wrap .table-search-box input {width: 200px; height: 40px; border: 1px solid #d3d1d1; border-radius: 5px; padding-left: 10px; margin-bottom: 20px; } 
.floor_plan_list_wrap > table > tbody > tr > td{height: 60px; border-bottom: 1px solid #d3d1d1;} 
.floor_plan_list_wrap .floorplan-th{font-size: 18px; background: #000; color: #fff; height: 60px;} 
.floor_plan_list_wrap .floorplan-td{font-size: 16px;  height: 80px;} 
.dwg-download {font-size: 16px; color: #111; border: 1px solid #ddd; padding: 10px 20px;  border-radius: 4px; text-decoration: none; transition: color 0.3s;}
.dwg-download:hover {color: #fff;; background: var(--main-color);}

/* 카다로그 */
.catalog_bg_wrap {position: relative; background-image: url('/images/ca_bg.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.catalog_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.catalog_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.catalog_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}
.catalog { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}   
.catalog_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.catalog_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.catalog_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }
.catalog_list_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.catalog_list_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.catalog_list_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }
.catalog_list_wrap > ul { display: flex; justify-content: space-around; align-items: center; gap: 40px; flex-wrap: wrap; list-style: none; margin-top: 0px;}
.catalog-download {font-size: 16px; color: #111; border: 1px solid #ddd; padding: 10px 40px;  border-radius: 4px; text-decoration: none; transition: color 0.3s;}
.catalog-download:hover {color: #fff; background: var(--main-color);}

/* contact */
.contact_bg_wrap {position: relative; background-image: url('/images/contact_bg.png');  margin-bottom: 30px; width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.contact_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.contact_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.contact_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}

/* 회사소개 */
.company_bg_wrap {position: relative; background-image: url('/images/company_bg1.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.company_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.company_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.company_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}
.company_wrap { max-width: var(--max-width); padding-top: 80px; margin: auto; text-align: center; font-size: 32px; font-weight: 700;}
.company_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.company_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }

.company_intro_wrap {padding-left: 20px; max-width: var(--max-width); padding-bottom: 80px; padding-top: 80px; margin: auto; text-align: center; font-size: 32px; font-weight: 700;}
.company_intro_wrap h4{font-size: 16px; font-weight: 400; color:#575656; text-align: left;  }
.company_intro_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: left;  }
.company_intro_wrap .company-desc{font-size: 16px; font-weight: 400; color: #111111; text-align: left;  line-height: 2; margin-top: 40px; }
.company_intro_wrap > ul {width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 80px; list-style: none; margin-top: 50px;}


/* 회사연혁 */
.company_history { width: 100%;  padding-top: 0px; padding-bottom: 80px;  background: #555555;}
.company_history_wrap {padding-left: 20px; padding-right: 20px; max-width: var(--max-width); padding-top: 80px; margin: auto; text-align: left; }
.company_history {background-image: url('/images/history_bg.png'); width: 100%; height: auto; background-size: cover; background-position: center; background-repeat: no-repeat; }
.company_history_wrap h3{font-size: 32px; font-weight: 800; color: #eeeeee; text-align: left;  margin-bottom: 0px;}
.company_history_wrap span{font-size: 16px; font-weight: 400; color: #e6e2e2; text-align: center;  }
.company_history_wrap > ul { display: flex; justify-content: flex-start; align-items: center; gap: 100px; list-style: none;}
.company_history_wrap > ul > li:nth-of-type(1){width: 280px;  vertical-align: top;} 
.company_history_wrap > ul > li:nth-of-type(2){flex: 1 1 0;} 
.company_history_wrap > ul > li:nth-of-type(3){flex: 1 1 0;} 
.company_history_wrap .year_item {font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 20px; }
.company_history_wrap .year_item span {font-size: 16px; font-weight: 400; color: #fff; margin-left: 10px; }
.company_history_wrap .history_item {font-size: 16px; font-weight: 400; color: #ddd; margin-bottom: 10px; line-height: 1.5; }


/* 찾아오시는 길 */
.company_map { width: 100%;  padding-top: 0px; padding-bottom: 80px;  background: #ffffff;}
.company_map_wrap {padding-left: 20px; padding-right: 20px; max-width: var(--max-width); padding-top: 80px; margin: auto; text-align: center; }
.company_map_wrap h3{font-size: 32px; font-weight: 800; color: #000000; text-align: center;  margin-bottom: 20px;}
.company_map_wrap span{font-size: 16px; font-weight: 400; color: #000000; text-align: center;  }
#daumRoughmapContainer1759476589373 {width:100%; margin-top: 50px; text-align: left;}


/* 네트워크 스위치 */
.network_bg_wrap {position: relative; background-image: url('/images/network_bg.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.network_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: right; color: #fff;}
.network_bg_wrap .txt_box h3{font-size: 44px; font-weight: 800; margin-bottom: 10px;}
.network_bg_wrap .txt_box > span{font-size: 24px; font-weight: 400;}

.network_product { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}   
.network_product_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.network_product_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.network_product_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }

.network_product_list { padding-right: 20px;}
.network_product_list > ul { display: flex; justify-content: center; align-items: center; gap: 40px; flex-wrap: wrap; list-style: none; margin-top: 50px;}
.network_product_list .network_product_item {display: flex; width: 380px; flex-direction: column; justify-content: center; align-items: center; gap: 10px; }
.network_product_list .network_product_item {border: 1px solid #eee; border-radius: 5px; background: #fff; text-align: center; padding-right: 20px; padding-left: 20px; }
.network_product_list .network_product_item li {padding: 0 20px 20px 20px;}
.network_product_list .network_product_item > li > span{font-size: 18px;font-weight: 500;color: #333;width: 380px;text-align: center;word-break: break-word;white-space: normal;padding: 0px;}
.network_product_list .network_product_item:hover {border: 2px solid var(--main-color);border-radius: 5px;transition: border 0.2s;cursor: pointer;}
.network_product_list .network_product_item img {max-width: 200px; height: auto; }

/* 네트워크 상세정보 */
.network_product_info { width: 100%;  padding-top: 80px; padding-bottom: 50px;  background: #fff; padding-right: 0px; padding-left: 0px;}
.network_product_info_wrap { max-width: var(--max-width); margin: auto; padding: 0 0px; text-align: center; font-size: 32px; font-weight: 700; }
.network_product_info_wrap h4{font-size: 26px; font-weight: 500; color: #111111; text-align: center; ; padding-bottom: 10px; display: inline; border-bottom: 1px solid #575656;}
.network_product_info_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  margin-top: 50px;}
.network_product_info_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }

.network_product_info_list {max-width: var(--max-width); width: 80%; margin: auto; padding: 0 0px; text-align: center;}
.network_product_info_list  ul { display: flex; justify-content: space-around; align-items: center; gap: 40px; list-style: none; margin-top: 50px;}
.network_product_info_list > ul > li img{width: 300px; height: auto; }
.network_product_info_list > ul {border: 1px solid #eee; border-radius: 5px; background: #fff; text-align: center;}
.network_product_info_list .product_description {text-align: left; padding: 0px; font-size: 16px;}

/* 추가 정보 */

.network_product_info_addlist {max-width: var(--max-width); width: 80%; margin: auto; padding: 0 0px; text-align: center;}
.network_product_info_addlist_wrap > ul { display: flex; margin-bottom: 10px; justify-content: space-between; text-align: left; align-items: center; gap: 40px; list-style: none; margin-top: 0px; border: 1px solid #eee; border-radius: 5px; background: #fff;}
.network_product_info_addlist_wrap > ul > li {font-size: 16px; padding: 20px; color: #111111; text-align: left; border-bottom: 0px solid #eee;}
.network_product_info_addlist_wrap > ul > li:nth-of-type(1) {width: 250px; background: #dddddd; font-weight: 600; border-right: 0px solid #eee; }
.network_product_info_addlist_wrap > ul > li:nth-of-type(2) {width: 700px; text-align: left; line-height: 2;}
.network_product_info_addlist_wrap .info_text_left {text-align: left; border: 0;}

/*  자료 */
.network_data { width: 100%;  padding-top: 20px; padding-bottom: 50px;  background: #fff;}
.network_data_wrap { max-width: var(--max-width);  width: 80%; margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.network_data_wrap  > ul { display: flex; justify-content: flex-start; align-items: center; gap: 40px;  list-style: none; margin-top: 0px;}
.network_data_wrap > ul > li {font-size: 16px; padding: 20px; color: #111111; text-align: left; border-bottom: 0px solid #eee;}
.network_data_wrap > ul > li:nth-of-type(1) {width: 250px; color: #fff; background: #4b4b4b; font-weight: 600; border-right: 1px solid #eee; }
.network_data_wrap > ul > li:nth-of-type(2) {width: 700px; text-align: left; line-height: 2;}
.network_data_wrap > ul > li:nth-of-type(2) span{border: 1px solid #424242;  padding: 5px 10px; border-radius: 5px;}
.network_data_wrap .info_text_left {text-align: left; border: 0;}
/* .network_data_wrap > ul:nth-of-type(2)  {display: flex; justify-contentc: center;} */
/* 다운로드 */
.material-download {transition: color 0.2s, text-decoration 0.2s;}
.material-download:hover { color: var(--main-color);}

/* 문의 배너 */

.cu_bg {position: relative; width: 100%; padding-top: 50px; margin-top: 50px;;  background: #fff;}
.cu_bg_wrap {position: relative; max-width: var(--max-width);  width: 100%; margin: auto; padding-left: 20px; padding-right: 20px; text-align: center; }
.cu_bg {background-image: url('/images/cu_bg.png'); width: 100%; height: 200px; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; }
.cu_bg_wrap .cu_bg_txt {text-align: left; }
.cu_bg_wrap .cu_bg_txt h4 {font-size: 14px; font-weight: 400; color: var(--main-color); margin-bottom: 10px; }
.cu_bg_wrap .cu_bg_txt h3 {font-size: 20px; font-weight: 800; color: #fff; margin-bottom: 50px; }
.cu_bg_wrap .cu_bg_txt span {font-size: 20px; font-weight: 800; color: #fff; padding: 20px; margin-bottom: 10px; border: 1px solid #fff; transition: background 0.2s, color 0.2s, border-color 0.2s;}
.cu_bg_wrap .cu_bg_txt span:hover {cursor: pointer;color: #e53935;border-color: #e53935;}


/* footer */
.footer { width: 100%; background: #222; color: #fff; height:270px; }
.footer .footer_wrap { max-width: var(--max-width); margin: 0 auto; padding:30px 20px 0px 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.footer .footer_wrap h3 { font-size: 14px; margin-bottom: 10px; font-weight: 400; color:#9c9c9c; }
.footer .footer_wrap h4 { font-size: 14px; margin-top: 30px; font-weight: 400; color:#9c9c9c; }
.footer .footer_wrap ul { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.footer .footer_wrap ul .footer_logo { background-image: url('/images/logo_f.png'); width: 100px; height: 100px; background-size: contain; background-position: center; background-repeat: no-repeat; padding-right: 20px; }
.footer_top { margin-bottom: 40px; padding-top: 10px;}
.footer_top h3 { border-bottom: 1px solid #cccaca; color: #333; padding-bottom:4px; margin-bottom: 40px; width: 100%; }

#footer_type { display: flex;  gap: 15px; }
#footer_type > ul > li { font-size: 14px; color:#9c9c9c; cursor: pointer; transition: color 0.3s ease; }

/* 이메일 수집거부 */
.email-modal { display: none; background: #fff; width: 380px; z-index: 1000; border-radius: 15px; overflow: auto; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.email-top { display: flex; background: var(--main-color); padding: 20px; justify-content: space-between; border-top-left-radius: 15px; border-top-right-radius: 15px; }
.email-title { width: 100%; font-size: 18px; font-weight: 600; }
.email-content { padding: 20px 20px 50px 20px; font-size: 14px; line-height: 30px; height: 260px; overflow: auto; }
.email-close-btn { background-image: url("https://boyhomeclean.mycafe24.com/images/modal-close.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; height: 30px; width: 30px; cursor: pointer; }
.email-modal-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.6; z-index: 100; display: none; }

/* 개인정보처리방침 */
.condition-modal { display: none; background: #fff; width: 800px; z-index: 1000; border-radius: 15px; overflow: auto; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.condition-top { display: flex; background: var(--main-color); padding: 20px; justify-content: space-between; border-top-left-radius: 15px; border-top-right-radius: 15px; }
.condition-title { width: 100%; font-size: 18px; font-weight: 600; }
.condition-content { padding: 20px 20px 50px 20px; font-size: 14px; line-height: 30px; height: 260px; overflow: auto; }
.condition-close-btn { background-image: url("https://boyhomeclean.mycafe24.com/images/modal-close.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; height: 30px; width: 30px; cursor: pointer; }
.condition-modal-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.6; z-index: 100; display: none; }

/* 개인정보처리방침 */
.personal-modal { display: none; background: #fff; width: 800px; z-index: 1000; border-radius: 15px; overflow: auto; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.personal-top { display: flex; background: var(--main-color); padding: 20px; justify-content: space-between; border-top-left-radius: 15px; border-top-right-radius: 15px; }
.personal-title { width: 100%; font-size: 18px; font-weight: 600; }
.personal-content { padding: 20px 20px 50px 20px; font-size: 14px; line-height: 30px; height: 260px; overflow: auto; }
.personal-content h3 { font-size:20px; }
.condition-content h3 { font-size:20px; }
.personal-close-btn { background-image: url("https://boyhomeclean.mycafe24.com/images/modal-close.svg"); background-size: cover; background-repeat: no-repeat; background-position: center; height: 30px; width: 30px; cursor: pointer; }
.personal-modal-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.6; z-index: 100; display: none; }


@keyframes wheelMove {
    0% { cy: 25; opacity: 1; }
    50% { cy: 35; opacity: 0.5; }
    100% { cy: 25; opacity: 1; }
}

@media (max-width: 768px) {
.nav_wrap {max-width:var(--max-width); padding: 0px; border-bottom: 1px solid #c5c2c2; width: 100%; height:70px;}
.header_wrap .txtbox {top:30%;}
.header_wrap .txtbox h3 {font-size: 24px; color: #fff; font-weight: 700; text-align: center; width: 100vw; display: block; padding-right: 20px; padding-left: 20px;}
.header_wrap .txtbox span {display:inline-block; font-size: 16px; color: #fff; font-weight: 600; padding-top: 40px; text-align: center; width: 100%;}
.header_wrap .txtbox h4 {display:inline-block; font-size: 16px; color: #fff; font-weight: 600; padding-top: 40px; text-align: center; width: 100%;}
.mobile_only {display: block;}
.nav_wrap img {width: 70px; height: auto;}
.nav_wrap .mobile_only {display: block;}
.nav_wrap .pc_only {display: none;}
.personal-modal { width: 380px; }
.condition-modal {width: 380px;}
    .pc_only {
        display: none !important;
    }
#sham2 {cursor: pointer;}
.nav_wrap2 {padding: 10px; }
.nav_wrap2 img {width: 70px; height: auto;}
.nav_wrap2 {height:70px; }
.footer { width: 100%; background: #222; color: #fff; height:380px; }

.introduce {padding-right: 10px; padding-left: 0px;}
.introduce .introduce_wrap > ul {display: flex; flex-direction: column; justify-content: center; align-items: center; gap:40px;}
.introduce .introduce_wrap > ul > li:nth-child(1) {width: 100%;}
.introduce .introduce_wrap > ul > li:nth-child(2) {width: 100%;}
.introduce .introduce_wrap .intro_txt {flex-direction: column;}
.introduce .introduce_wrap .intro_txt .img_1 {background-image: url('/images/net_img1.png'); width: 340px; height: 570px; ;}
.introduce .introduce_wrap .intro_txt .img_2 {background-image: url('/images/sol_img1.png'); width: 340px; height: 570px; ;}
.introduce .introduce_wrap .introduct_txt > ul {display: flex; justify-content: center; align-items: center; gap: 20px; list-style: none; margin-top: 50px;}
.introduce .introduce_wrap .introduct_txt > ul > li span{border: 1px solid #000;  border-radius: 8px; padding: 10px 8px; font-size: 16px; font-weight: 600; line-height: 1.5; color: #3a3a3a;}
.introduce .introduce_wrap .introduct_txt > ul > li span:hover {background: #222;color: #fff;border-color: #222;transition: background 0.2s, color 0.2s, border-color 0.2s;cursor: pointer;}
.network_bg_wrap .txt_box {padding-right: 20px;}
.network_bg_wrap .txt_box h3 {font-size: 32px; margin-bottom: 10px; padding-right: 0px;}
.network_bg_wrap .txt_box span {font-size: 16px; margin-bottom: 10px; padding-right: 0px; line-height: 1.5;}



.network_product_info_addlist {max-width: var(--max-width); width: 380px; margin: auto;text-align: center; border: 0;}
.network_product_info_addlist_wrap > ul { display: flex; margin-bottom: 10px; flex-direction: column; justify-content: center; text-align: left; align-items: center; gap: 4px;}
.network_product_info_addlist_wrap > ul > li {font-size: 16px; padding: 20px; color: #111111; text-align: left; border: 0;}
.network_product_info_addlist_wrap > ul > li:nth-of-type(1) {width: 380px; background: #bdbdbd; font-weight: 600;  }
.network_product_info_addlist_wrap > ul > li:nth-of-type(2) {width: 100%; border:0; text-align: left; line-height: 2;}
.network_product_info_addlist_wrap .info_text_left {text-align: left;}
.network_product_info_addlist_wrap > ul { margin-bottom: 0px; border: 0; gap: 0px; list-style: none; }

.network_product_info_list {width: 100%; margin: auto;text-align: center; padding-left: 0px; padding-right: 20px;}
/* .network_product_info{padding-right: 20px; padding-left: 20px;} */
.network_product_info  h3{font-size: 28px;}
/* .network_product_info{padding: 20px;} */
.network_product_info_list  ul { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; list-style: none; margin-top: 50px;}
.network_product_info_list > ul > li img{width: 200px; height: auto; }
.network_product_info_list > ul {border: 1px solid #eee; border-radius: 5px; background: #fff; text-align: center;}
.network_product_info_list .product_description {text-align: left; padding: 20px; font-size: 16px;}


.network_data { width: 100%;  padding-top: 20px; padding-bottom: 50px;  background: #fff;}
.network_data_wrap { width: 100%; margin: auto; padding: 0 0px; text-align: center; font-size: 32px; font-weight: 700;}
.network_data_wrap  > ul {padding-left: 0px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 40px;  list-style: none; margin-top: 0px;}
.network_data_wrap > ul > li {font-size: 16px; padding: 20px; color: #111111; text-align: center; border-bottom: 0px solid #eee;}
.network_data_wrap > ul > li:nth-of-type(1) {width: 100%; color: #fff; background: #4b4b4b; font-weight: 600; border-right: 1px solid #eee; }
.network_data_wrap > ul > li:nth-of-type(2) {width: 100%; text-align: left; line-height: 2; padding-right: 4px;}
.network_data_wrap > ul > li:nth-of-type(2) span{display: inline-block; border: 1px solid #424242;  padding: 5px 5px; border-radius: 5px;}
.network_data_wrap > ul:nth-of-type(2)  {width: 100%; background: #000; display: flex; flex-direction: column; justify-content: center; align-items: center;}


.catalog_bg_wrap .txt_box{width: 97%; }
.catalog_bg_wrap .txt_box h3{font-size: 30px; font-weight: 800; margin-bottom: 10px;}
.catalog_bg_wrap .txt_box > span{font-size: 18px; font-weight: 400;}

.catalog { width: 100%;  padding-top: 80px; padding-bottom: 80px;  background: #fff;}   
.catalog_wrap { max-width: var(--max-width); margin: auto; padding: 0 20px; text-align: center; font-size: 32px; font-weight: 700;}
.catalog_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.catalog_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }

.catalog-download {padding: 10px 40px; margin-top: 0;}

/* 회사소개 */
.company_bg_wrap {position: relative; background-image: url('/images/company_bg1.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.company_bg_wrap .txt_box{max-width: var(--max-width); width: 98%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.company_bg_wrap .txt_box h3{font-size: 34px; font-weight: 800; margin-bottom: 10px;}
.company_bg_wrap .txt_box > span{font-size: 18px; font-weight: 400;}
.company_wrap { max-width: var(--max-width); padding-top: 80px; margin: auto; text-align: center; font-size: 32px; font-weight: 700;}
.company_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: center;  }
.company_wrap span{font-size: 16px; font-weight: 400; color: #111111; text-align: center;  }

.company_intro_wrap {padding-left: 20px; max-width: var(--max-width); padding-bottom: 80px; padding-top: 80px; margin: auto; text-align: center; font-size: 32px; font-weight: 700;}
.company_intro_wrap h4{font-size: 16px; font-weight: 400; color:#575656; text-align: left;  }
.company_intro_wrap h3{font-size: 32px; font-weight: 800; color: #111111; text-align: left;  }
.company_intro_wrap .company-desc{font-size: 16px; font-weight: 400; color: #111111; text-align: left;  line-height: 2; margin-top: 40px; }
.company_intro_wrap > ul {width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 80px; list-style: none; margin-top: 50px;}
.company_img {display: none;}


.company_history { width: 100%;  padding-top: 0px; padding-bottom: 80px;  background: #555555;}
.company_history_wrap {padding-left: 20px; padding-right: 20px; max-width: var(--max-width); padding-top: 80px; margin: auto; text-align: left; }
.company_history {background-image: url('/images/history_bg.png'); width: 100%; height: auto; background-size: cover; background-position: center; background-repeat: no-repeat; }
.company_history_wrap h3{font-size: 32px; font-weight: 800; color: #eeeeee; text-align: left;  margin-bottom: 0px;}
.company_history_wrap span{font-size: 16px; font-weight: 400; color: #e6e2e2; text-align: center;  }
.company_history_wrap > ul { display: flex; flex-direction: column;  justify-content: center; align-items: center; gap: 0px; list-style: none;}
.company_history_wrap > ul > li:nth-of-type(1){width: 100%;  margin-bottom: 50px;}
.company_history_wrap > ul > li:nth-of-type(2){width: 100%;} 
.company_history_wrap > ul > li:nth-of-type(3){width: 100%;} 
.company_history_wrap .year_item {font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 20px; }
.company_history_wrap .year_item span {font-size: 16px; font-weight: 400; color: #fff; margin-left: 10px; }
.company_history_wrap .history_item {font-size: 16px; font-weight: 400; color: #ddd; margin-bottom: 10px; line-height: 1.5; }
.year_item {display: flex; align-items: center;}


.contact_bg_wrap {position: relative; background-image: url('/images/contact_bg.png');  margin-bottom: 30px; width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.contact_bg_wrap .txt_box{max-width: var(--max-width); width: 100%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.contact_bg_wrap .txt_box h3{font-size: 34px; font-weight: 800; margin-bottom: 10px;}
.contact_bg_wrap .txt_box > span{font-size: 18px; font-weight: 400;}
.product_contact_wrap > ul { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; list-style: none; margin-top: 50px;}
.product_contact_table2 {width: 380px; margin: auto; background: #eeecec; border: 1px solid #eee; padding: 40px; margin-top: 20px;}

.product_contact_table  tr  th {width:100%; text-align: left; padding-right: 0px; font-size: 16px; font-weight: 500; color: #111; border: 0;} 
.product_contact_table  tr  td {width:100%; text-align: left; padding-right: 0px; font-size: 16px; font-weight: 500; color: #111; } 

.product_contact { width: 100%;  padding-top: 10px; padding-bottom: 80px;  background: #fff;}
.product_contact_table tr  td input {width: 370px; height: 50px; border-radius: 0px; border: 1px solid #f8f7f7; background: #d1cfcf;  padding-left: 10px; color:#2e2e2e;}

#mobile_logo {display: none;}

.member_plan_bg_wrap {position: relative; background-image: url('/images/member_bg2.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.member_plan_bg_wrap .txt_box{max-width: var(--max-width); width: 98%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.member_plan_bg_wrap .txt_box h3{font-size: 34px; font-weight: 800; margin-bottom: 10px;}
.member_plan_bg_wrap .txt_box > span{font-size: 18px; font-weight: 400;}

.floor_plan_bg_wrap {position: relative; background-image: url('/images/floor_plan_bg.png');  width: 100%; height: 400px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.floor_plan_bg_wrap .txt_box{max-width: var(--max-width); width: 98%;  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: left; color: #fff;}
.floor_plan_bg_wrap .txt_box h3{font-size: 34px; font-weight: 800; margin-bottom: 10px;}
.floor_plan_bg_wrap .txt_box > span{font-size: 18px; font-weight: 400;}
.floor_plan_list_wrap .table-search-box {text-align: center; margin-bottom: 10px; padding-right: 0px;} 

}
@media (max-width: 768px) {
    .pdf-preview-desktop { display: none !important; }
    .pdf-preview-mobile { display: inline !important; }
}
@media (min-width: 769px) {
    .pdf-preview-desktop { display: inline !important; }
    .pdf-preview-mobile { display: none !important; }
}
@media (max-width: 768px) {
    .product_contact_table,
    .product_contact_table tr,
    .product_contact_table th,
    .product_contact_table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .product_contact_table tr {
        margin-bottom: 16px;
    }
    .product_contact_table th {
        font-size: 1em;
        font-weight: 600;
        margin-bottom: 4px;
        background: none;
        border: none;
        text-align: left;
        padding: 0;
    }
    .product_contact_table td {
        margin-bottom: 8px;
        padding: 0;
        border: none;
    }
    .product_contact_table input,
    .product_contact_table textarea {
        width: 100%;
        font-size: 1em;
        padding: 8px;
        box-sizing: border-box;
    }
}
@media (max-width: 768px) {
    .floorplan-th:nth-child(1), /* 제목 */
    .floorplan-th:nth-child(3), /* 다운로드수 */
    .floorplan-th:nth-child(4)  /* 등록일 */ {
        display: none !important;
    }
}