/* Product_page CSS */
.product_box {width: 100%; height: 100%; display: flex; padding-bottom: 6%;}
.menu_box {width: 20%; height: 100%; display: flex; flex-direction: column;}
.product_info {width: 80%; height: 100%;}
.menu_btn {width: 70%; margin: 0 auto; height: 3vw; text-align: center; border: 1px solid #6c9ae9; margin-top: 7%; background-color: white; border-radius: 10px; 
            color: #6c9ae9; font-size: 0.9vw;}
.on{border: 1px solid #013082; color: #013082; font-weight: bold;}
.product_content{display: none; width: 100%; height: 100%; padding-top: 3vw;}
.div_on {display: block;}

/* 특징 Part */
#feature {width: 100%; height: 100%; display: flex; padding: 0; margin: 0;}
#feature > li:first-child { width: 40%; height: 100%; text-align: center;}
#feature > li:first-child > img {width: 90%; height: 90%;}
#feature > li:nth-child(2) {width: 60%;}
#feature > li:nth-child(2) > p {margin-top: 2rem;}
#feature > li:nth-child(2) > p:first-child{margin: 0;}

/* 재질 Part */
#material > p:first-child {margin: 0;}
#material > table {width: 80%; text-align: center; border: 2px solid #013082; height: 50%; font-size: 1vw;}
#material > table tr {height: 3vw;}
#material > table th {border: 2px solid #013082; background-color: #6c9ae9; color: white; font-weight: bold; vertical-align: middle;}
#material > table td {border: 1px solid #333; vertical-align: middle;}

/* 용도 Part */
#purpose {width: 100%; height: 100%; display: flex; padding: 0; margin: 0;}
#purpose > li:nth-child(2) { width: 40%; height: 190%; text-align: center;}
#purpose > li:nth-child(2) > img {width: 90%; height: 90%;}
#purpose > li:nth-child(1) {width: 60%;}
#purpose > li:nth-child(1) > p {margin-top: 2rem;}
#purpose > li:nth-child(1) > p:first-child{margin: 0;}
#purpose > li:nth-child(1) > img {width: 40%; margin: 3%;}
#purpose > li:nth-child(2) > div {width: 55%; margin: 0 auto;}

/* 생산공정 Part */
#product_process {display: flex;}
#product_process > img:first-child {width: 25%;}
.process_txt {margin-left: 30px; display: block; line-height: 30px;}
.process_con {display: block; padding: 40px;}
/* 생산공정 Part */

/* 규격 및 칫수 Part */
.size_div > table {width: 70%; text-align: center;}
.size_div > table thead {background-color: #6c9ae9;}
.size_div > table tr {height: 2vw;}
.size_div > table th {border: 1px solid #fff; vertical-align: middle; color: white; font-size: 0.8vw;}
.size_div > table td {border: 1px solid #333; vertical-align: middle; font-size: 0.8vw;}
/* 규격 및 칫수 Part */

/* 설계 적용 기준 및 기타사항 Part */


.mt_p {margin-top: 1rem; margin-bottom: 0;}
/* 설계 적용 기준 및 기타사항 Part */

/* 시공사진 Part */
.const_pic {display: flex;}
.const_pic > div {margin-left: 20px;}
/* 시공사진 Part */

/* 기술지원 및 다운로드 Part */
.download_btn_div {display: flex; flex-direction: row; border-top: 1px solid #013082; border-bottom: 2px solid #013082; width: 70%; text-align: center; height: 3vw;}
.download_btn_div > button {margin: 0 auto; font-size: 0.9vw;}
.down_btn_on{ color: #6c9ae9; font-weight: bold;}
.ab_tb {position: absolute; width: 96%; left: 2%;}
/* 기술지원 및 다운로드 Part */

/* H-BEAM 소개 Part */
.h_beam_div_l, .h_beam_div_r {height: 30vw; display: flex; width: 90%;}
.h_beam_div_l > div:nth-child(1) { width: 65%; background-image: url("/asset/img/h_beam_main_1.jpg"); background-size: cover; margin: 20px;}
.h_beam_div_l > div:nth-child(2) { width: 35%; background-image: url("/asset/img/h_beam_main_3.jpg"); background-size: cover; margin: 20px;}
.h_beam_div_r > div:nth-child(1) { width: 35%; background-image: url("/asset/img/h_beam_main_4.jpg"); background-size: cover; margin: 20px;} 
.h_beam_div_r > div:nth-child(2) { width: 65%; background-image: url("/asset/img/h_beam_main_2.jpg"); background-size: cover; margin: 20px;}
/* H-BEAM 소개 Part */

/* HYFO-BEAM 소개 Part */
.hyfo_beam_div_l, .hyfo_beam_div_r {height: 30vw; display: flex; width: 90%;}
.hyfo_beam_div_l > div:nth-child(1) { width: 65%; background-image: url("/asset/img/hyfo_beam_1.jpg"); background-size: cover; margin: 20px; border: 10px solid #fff; box-shadow: 13px 15px 20px 0px #333;}
.hyfo_beam_div_l > div:nth-child(2) { width: 35%; background-image: url("/asset/img/hyfo_beam_5.jpg"); background-size: cover; margin: 20px; border: 10px solid #fff; box-shadow: 13px 15px 20px 0px #333;}
.hyfo_beam_div_r > div:nth-child(1) { width: 35%; background-image: url("/asset/img/hyfo_beam_6.jpg"); background-size: cover; margin: 20px; border: 10px solid #fff; box-shadow: -20px 19px 20px 0px #333;} 
.hyfo_beam_div_r > div:nth-child(2) { width: 65%; background-image: url("/asset/img/hyfo_beam_4.jpg"); background-size: cover; margin: 20px; border: 10px solid #fff; box-shadow: -20px 19px 20px 0px #333;}
/* HYFO-BEAM 소개 Part */

/* ACT-COlUMN 적용사례 */
.act_column_div > img {width: 50%; height: 11vw; margin-top: 5vw;}
/* ACT-COlUMN 적용사례 */

/* SMART-BEAM Part */
.smart_beam_facilities > img {display: block;}
.smart_beam_div {display: flex;}
.smart_beam_table {width: 30%; margin-left: 4vw; border: 1px solid #6c9ae9;}
.smart_beam_table thead { background-color: #6c9ae9; text-align: center;}
.smart_beam_table tr { height: 2vw;}
.smart_beam_table th { color: #fff; vertical-align: middle; font-size: 0.8vw;}
.smart_beam_table td { vertical-align: middle; font-size: 0.8vw; padding-left: 5%;}
/* SMART-BEAM Part */

/* AU-Beam Part */
.au_const {display: flex; width: 100%;}
.au_const > div:first-child{width: 40%; margin-right: 3vw;}
.au_const > div:first-child img {width: 100%; height: 100%; margin: 0.5vw; border: 10px solid #fff; box-shadow: 13px 15px 20px 0px #333;}

.au_const > div:nth-child(2) {display: flex; flex-direction: column; width: 30%; height: 100%;}
.au_const > div:nth-child(2) img {margin: 0.5vw; border: 10px solid #fff; box-shadow: 13px 15px 20px 0px #333;}
/* AU-Beam Part */

/* ACT-PILE Part */
#expect_effect tr > td:nth-child(2), #expect_effect tr > td:nth-child(3) {text-align: left;}
/* ACT-PILE Part */

/* MB Item */
#mb_items {width: 75%; display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; justify-content: flex-start; align-items: center;}
.mb_item {border: 2px solid #88aacc; width: 18%; height: 15vw; margin: 1%; border-radius: 10px; box-shadow: 0px 5px 3px 0px gray;}
.mb_item > p {display: inline-flex; width: 100%; height: 15%; align-items: center; justify-content: center; margin: 0; border-bottom: 1px solid #88aacc; font-weight: bold; font-size: 0.85vw;}
.mb_item > img {width: 100%; height: 70%; display: block;}
.mb_item > button {text-align: center; width: 100%; height: 15%; font-weight: bold; background-color: #88aacc; color: white;}
.mb_item > button:hover {background-color: #7190af;}

#mb_org_tb {width: 80%; text-align: center;}
#mb_org_tb tr {height: 60px; line-height: 60px;}
#mb_org_tb th {color: white; background-color: #88aacc;}
#mb_org_tb td {vertical-align: middle; border: 1px solid #88aacc;}

.mb_product_tb {width: 75%; border: 1px solid #7190af;}
.mb_product_tb tr {height: 40px; line-height: 40px;}
.mb_product_tb th {text-align: center; background-color: #88aacc; color: white; font-weight: bold; vertical-align: middle;}
.mb_product_tb td:first-child{text-align: center;}
.tb_pl2 {padding-left: 2%;}
.mb_product_tb td {border: 1px solid #7190af; font-size: 0.9vw; vertical-align: middle; text-align: center;}

/* Product_page CSS */