@charset "utf-8"; /* HYENC */
.p_wrap p { margin-bottom: 4rem; color: #111; line-height: 1.7; } 
b { font-weight: 700; } 
.sub_page_visual { background-repeat: no-repeat; background-position: center; background-size: cover; height: 100%; height: 49rem; overflow: hidden; animation: bg-active 5s; } 
.sub_page_visual1 { background-image: url(../img/sub_visual_1.jpg); } 
.sub_page_visual2 { background-image: url(../img/sub_visual_2.jpg); } 
.sub_page_visual3 { background-image: url(../img/sub_visual_3.jpg); } 
.sub_page_visual4 { background-image: url(../img/sub_visual_4.jpg); } 
.sub_page_visual5 { background-image: url(../img/sub_visual_5.jpg); } 
@keyframes bg-active { 
 0% { transform: scale(1.09); opacity: 0.9; } 
 100% { transform: scale(1); opacity: 1; } 
 }
/* sub_visual */
.sub_top_box { margin-bottom: 12rem; } 
.sub_top_box .sub_visual_txt { text-align: center; font-size: 2.4rem; font-weight: 700; margin-top: 18rem; margin-bottom: 8rem; } 
.sub_top_box .sub_visual_txt h2 { font-weight: 700; font-size: clamp(22px, 4vw, 6rem); margin-bottom: 1rem; } 

/* SUB PAGE CSS */
.sub_com .container { margin-bottom: 17rem; } 
.sub_com .page_tit { margin-bottom: 3rem; } 
.page_tit h2 { color: var(--main-color); position: relative; padding-left: 4rem; } 
.page_tit .plus_icon::before { content:''; position:absolute; left:0; top: 34%; width: 2rem; height: 0.4rem; background: var(--sub-color); } 
.page_tit .plus_icon::after { content:''; position:absolute; left:0; top: 34%; width: 2rem; height: 0.4rem; background: var(--sub-color); transform: rotate(90deg); } 
.page_sub_tit { margin-bottom: 6rem; position: relative; } 
.page_1 .contain1 .flex_box { display: flex; align-items: center; } 
.page_1 .contain1 .flex_box .img_box { width: 48%; } 
.page_1 .contain1 .flex_box .info_box { flex: 1; display: flex; align-items: center; padding: 2rem 0rem 2rem 6rem; } 
.page_1 .contain1 .flex_box .info_box p { line-height: 1.5; } 
#company .contain2 .box_wrap { position: relative; z-index: -1; } 
#company .contain2 .box_wrap .info_box p { position: relative; z-index: 10; } 
#company .contain2 .letter { position: absolute; top: -226px; right: 0; color: #f9f9f9; font-size: 240px; font-weight: 800; z-index: -1; mix-blend-mode: hard-light; } 
#company .contain2 .box_wrap .info_box { background: #f9f9f9; border-radius: 15px; padding: 13rem 0; position: relative; z-index: 10; } 
.gray_box { position: absolute; bottom: 0; right: 7%; } 
.gray_box .img_box { position: relative; z-index: 1; } 
.gray_box .img_box img { margin-right: 0; } 
.ceo_comment { margin-top: 10rem; display: flex; justify-content: flex-start; align-items: stretch; flex-direction: row; gap: 4rem; } 
.ceo_comment .p_wrap { flex: 1; display: flex; flex-direction: column; } 
.sign_box { display: flex; height: 100%; justify-content: flex-end; align-items: flex-end; } 
.sign_box .sign_inner { display: flex; align-items: center; } 
.sign_box .sign_inner span { display: block; margin-right: 3rem; } 

#company .contain3 .dot_list li { font-size: 1.5rem; } 
#company .contain3 .flex_box { gap: 2.4rem; display: flex; align-items: stretch; } 
#company .contain3 .flex_box .box { flex: 1; border-radius: 20px; color: #fff; padding: 6rem 5rem; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; position: relative; } 
#company .contain3 .flex_box .box1 { background-image: url(../img/company2_img1.jpg); } 
#company .contain3 .flex_box .box2 { background-image: url(../img/company2_img2.jpg); /* top: 14rem; */ } 
#company .contain3 .flex_box .box3 { background-image: url(../img/company2_img3.jpg); position: relative; /* top: 7rem; */ } 
#company .contain3 .flex_box .box h4 { line-height: 1.1; height: 10rem; } 
#company .contain3 .flex_box .box p { font-weight: 700; padding: 4rem 0; } 
#company .dot_list li:before { background: #fff; } 
#company .contain4 { padding-top: 12rem; } 
#company .contain4 .flex_box { display: flex; justify-content: flex-start; border-top: 1px solid #222; border-left: 1px solid #222; } 
#company .contain4 .flex_box .box { border-right: 1px solid #222; border-bottom: 1px solid #222; flex: 1 0 33%; height: 53.6rem; padding: 2.2vw; display: flex; flex-direction: column; justify-content: space-between; } 
#company .contain4 .flex_box .box .dot_list { height: 27rem; } 
#company .contain4 .flex_box .box .year { margin-bottom: 2rem; } 
#company .contain4 .flex_box .box .dot_list li { padding-top: 0.5rem; padding-bottom: 0.5rem; font-weight: 600; font-size: 1.9rem; } 
#company .contain4 .flex_box .box .dot_list li::before { background: #222; top: 1.5rem; } 
#company .contain5 .tab_tit { display: flex; gap: 1rem; margin-top: 5rem; margin-bottom: 7rem; } 
#company .contain5 .tab_tit li { width: 19rem; height: 6rem; background: #f8f8f8; display: flex; justify-content: center; align-items: center; font-weight: 700; color: #999; border-radius: 50px; cursor: pointer; transition: all .2s; } 
#company .contain5 .tab_tit li:hover { background: var(--main-color); color: #fff; } 
#company .contain5 .tab_tit li.on { background: var(--main-color); color: #fff; } 
#company .contain5 .tab_wrap { position: relative; height: 40rem; width: 100%; } 
#company .contain5 .tab_wrap .tab_list { opacity: 0; width: 100%; transition: all .3s; } 
#company .contain5 .tab_wrap .tab_list.on { opacity: 1; } 
#company .contain5 .tab_wrap .tab_list .certi_box .img_box { background: #f8f8f8; padding: 4rem 2rem; border-radius: 15px; } 
#company .contain5 .tab_wrap .tab_list .certi_box .img_box img { box-shadow: 0 0 14px -1px #dcdcdc; } 
#company .contain5 .tab_wrap .tab_list .certi_box p { text-align: center; font-weight: 700; margin-top: 2rem; } 
/* 기본 상태 */
.tab_list { opacity: 0; transform: translateY(15px); pointer-events: none; position: absolute; top: 0; left: 0; width: 100%; transition: all 0.4s ease; } 
/* 활성 상태 */
.tab_list.on { opacity: 1; transform: translateY(0); pointer-events: auto; position: relative; /* 활성만 자리 차지 */ } 
.dot_list.list2 { padding-left: 2rem; } 
.dot_list.list2 li::before { width: 0.8rem; height: 2px; border-radius: unset; top: 1.4rem; background: #333; } 
.dot_list li { position: relative; padding-left: 1.5rem; padding-top: 0.5rem; padding-bottom: 0.5rem; word-break: keep-all; font-size: 2rem; font-weight: 700; } 
.dot_list li::before { content:''; display:block; position:absolute; top: 1.2rem; left:0; border-radius: 50%; width: 0.3rem; height: 0.3rem; background: #111; } 

#products .grid_box { display: grid; gap: 3rem; grid-template-columns: repeat(3, 1fr); } 
#products .top_box p { font-weight: 400; } 
#products .top_box { color: #fff; background:url(../img/pro_top.png) no-repeat 50% 50%/cover; position: relative; height: 49rem; padding: 7rem 8.4rem; display: flex; flex-direction: column; justify-content: space-between; grid-column: 1/4; } 
#products .top_box .contact_btn { position: relative; top: 0; bottom: unset; left: 0; transform: unset; max-width: 25.4rem; height: 7rem; } 
#products .top_box .contact_btn a { color: #fff; font-weight: 600; } 
#products .grid_box .box { background: #f9f9f9; height: 35.3rem; overflow: hidden; padding: 5rem; position: relative; } 
#products .grid_box .box a { display: flex; flex-direction: column; justify-content: space-between; } 
#products .grid_box .box > div { z-index: 1; } 
#products .grid_box .box .info_box { z-index: 2; width: 64%; } 
#products .grid_box .box .info_box p br { display:none; } 
#products .grid_box .box .img_box { position: absolute; z-index: 0; right: -10%; top: 63%; transform: translateY(-50%); } 
#products .grid_box .box .info_box h4 { padding-bottom: 3rem; } 
#products .grid_box .box .info_box p { line-height: 1.6; font-weight: 400; } 
#products .grid_box .box1 .img_box { right: -18%; } 
#products .grid_box .box .item_btn { width: 36px; height: 36px; background: var(--sub-color); border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 2.1rem; } 
#products .grid_box .box .item_btn { width: 36px; height: 36px; background: var(--sub-color); border-radius: 50%; display: flex; justify-content: center; align-items: center; color: #fff; font-size: 2.1rem; transition: all 0.3s ease; cursor: pointer; transform: rotate(
225deg); } 
#products .grid_box .box:hover .item_btn { background: #fff; color: var(--sub-color); } 
#products .contain2 .flex_box { gap: 6rem; margin-bottom: 18rem; display: flex; align-items: stretch; } 
#products .contain2 .flex_box .img_box_wrap { flex: 0 1 54%; color: #fff; padding: 5rem; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } 
#products .contain2 .flex_box .img_box_wrap .inner { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } 
#products .contain2 .flex_box .img_box_wrap.pro2_img1 { background-image: url(../img/pro2_img1.png); } 
#products .contain2 .flex_box .img_box_wrap.pro2_img2 { background-image: url(../img/pro2_img2.png); } 
#products .contain2 .flex_box .img_box_wrap.pro2_img3 { background-image: url(../img/pro2_img3.png); } 
#products .contain2 .flex_box .img_box_wrap.pro2_img4 { background-image: url(../img/pro2_img4.png); } 
#products .intro_btn a { color: inherit; } 
#products .intro_btn { position: relative; overflow: hidden; border: 2px solid #fff; border-radius: 50px; transition: color 0.5s ease; align-self: end; } 
#products .intro_btn a { position: relative; z-index: 2; color: inherit; text-decoration: none; padding: 1.4rem 4rem; } 

/* 대각선 배경 */
#products .intro_btn::before { content: ""; position: absolute; top: -10%; left: -170%; width: 150%; height: 120%; background: #fff; transform: skewX(-25deg); transition: left 0.6s cubic-bezier(0.22, 1, 0.36, 1); } 
#products .intro_btn:hover { color: #111; } 
#products .intro_btn:hover::before { left: -20%; } 
#products .contain2 .flex_box .info_box { flex: 1; } 
#products .contain2 .flex_box .info_box h3 { font-weight: 800; } 
#products .contain2 .flex_box .info_box p { font-weight: 500; padding: 2rem 0; } 
#products .flex_box .info_box .dot_list li { font-weight: 300; line-height: 1.4; } 
#products .flex_box .info_box .dot_list li:before { top: 1.5rem; } 
#products .contain3 .flex_box { gap: 3rem; } 
#products .contain3 .flex_box .img_box_wrap { flex: 1; height: 54rem; color: #fff; padding: 5rem; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } 
#products .contain3 .flex_box .img_box_wrap.pro3_img1 { background-image: url(../img/pro3_img1.png); } 
#products .contain3 .flex_box .img_box_wrap.pro3_img2 { background-image: url(../img/pro3_img2.png); } 
#products .contain3 .flex_box .img_box_wrap .inner { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } 
#products .contain3 .flex_box .info_box ul li { background: #11111154; border-radius: 50px; margin-bottom: 1rem; padding-left: 3.4rem; padding-top: 0.3rem; padding-bottom: 0.3rem; width: fit-content; padding-right: 2.2rem; font-size: 1.7rem; } 
#products .contain3 .flex_box .info_box ul li:before { background: #fff; left: 2rem; } 
#products .contain3 .flex_box .info_box p { font-weight: 600; margin: 2rem 0; height: 7rem; } 
#products .contain2 .box2 .img_box_wrap { order: 2; } 
#products .contain2 .box2 .info_box { order: 1; } 

/* INQUIRY */
#inquiry2 .contain1 .flex_box { gap: 3rem; display: flex; align-items: stretch; } 
#inquiry2 .contain1 .loca_box { height: 58.6rem; width: 59%; } 
#inquiry2 .contain1 .info_box { flex: 1; background: #f9f9f9; padding: 2rem; display: flex; flex-direction: column; justify-content: space-between; } 
#inquiry2 .contain1 .info_box .inner { display: flex; justify-content: space-evenly; flex-direction: column; height: 100%; width: 87%; margin: 0 auto; } 
#inquiry2 .contain1 .info_box .top_box { display: flex; margin-top: 2rem; justify-content: space-between; } 
#inquiry2 .contain1 .info_box .top_box .img_box { max-width: 20rem; } 
#inquiry2 .contain1 .info_box .top_box .loca_icon { width: 7rem; height: 7rem; border-radius: 50%; background: #fff; display: flex; justify-content: center; align-items: center; } 
#inquiry2 .contain1 .info_box .top_box .loca_icon i { font-size: 4rem; color: var(--main-color); } 
#inquiry2 .contain1 .info_box ul { color: #999; } 
#inquiry2 .contain1 .info_box ul li { display: flex; align-items: center; font-weight: 600; padding: 0.5rem 0; } 
#inquiry2 .contain1 .info_box ul li i { margin-right: 2rem; } 

.map_link { background: #fff; text-align: center; transition: all .3s; border-radius: 7px; } 
.map_link a { padding: 2.2rem 0; color: #999; font-weight: 700; display: flex; align-items: center; justify-content: center; transition: all .3s; } 
.map_link a i { font-size: 2.4rem; margin-left: 1.4rem; } 
.map_link:hover { background: var(--main-color); } 
.map_link:hover a { color: #fff; } 
#inquiry2 .contain1 .loca_box a { display:inline-block; width:fit-content } 
#inquiry2 .contain1 .loca_box >div { width: 100% !important; height: 100% !important; } 
#inquiry2 p.in2_p { padding-bottom: 2rem; color: #000; opacity: 0.4; } 
#inquiry2 .inquiry_wrap section { display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; margin-bottom: 1.8rem; align-items: center; padding: 0rem 2rem; } 
#inquiry2 .inquiry_wrap .in_check_sec_wrap .in_check_sec:nth-child(1) { margin-bottom: 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } 
#inquiry2 .inquiry_wrap .in_check_sec_wrap .in_check_sec:nth-child(2) { margin-top: 0; border-bottom: 1px solid #ddd; } 
#inquiry2 .inquiry_wrap section.in_check_sec { padding: 0; margin-top: 5rem; } 
#inquiry2 .inquiry_wrap section h4 { margin-right: 2rem; width: 14rem; } 
#inquiry2 .inquiry_wrap section > div { flex-grow: 1; flex-basis: 0; margin-bottom: 0; background: #f9f9f9; border-radius: 7px; } 
#inquiry2 .inquiry_wrap section > div.flex_div_3 { display: flex; align-items: center; background: unset; } 
#inquiry2 .inquiry_wrap section > div.flex_div_3 span { margin: 0 1.4rem; } 
#inquiry2 .inquiry_wrap section > div.flex_div_3 input { background: #f9f9f9; border-radius: 6px; } 
#inquiry2 .inquiry_wrap section div.file_wrap { display: flex; align-content: center; align-items: center; } 
#inquiry2 .inquiry_wrap section .filebox input { flex-grow: 1; flex-basis: 0; } 
#inquiry2 .inquiry_wrap section input { border: unset; padding: 1rem 2rem; background: unset; height: 5rem; width: 100%; outline: none; -webkit-appearance : none; -moz-appearance: none; appearance: none; color: #666; font-weight: 400; font-size: 1.8rem; } 
#inquiry2 .inquiry_wrap section input::placeholder { font-weight: 400; color: #b7b7b7 } 
#inquiry2 input:focus,#inqruiy2 { outline: none; box-shadow: unset; border: unset !important; } 
#inquiry2 textarea:focus { outline: none; box-shadow: unset; border: unset !important; } 
#inquiry2 .width100 { width: 100% !important; } 
#inquiry2 .inquiry_wrap section textarea { border: unset; background: unset; height: 180px; width: 100%; padding: 3rem; font-size: 1.8rem; } 
#inquiry2 .inquiry_wrap section div.check_wrap { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between; background: unset; padding: 2rem 0; } 
#inquiry2 .inquiry_wrap section div.check_wrap i { color: #d5d5d5; font-size: 4rem; } 
#inquiry2 .inquiry_wrap section div.check { flex-grow: unset; /* flex-basis: auto; */padding: 1rem; margin-left: 1rem; display: flex; align-items: center; cursor: pointer; color: #999; font-weight: 700; } 
#inquiry2 .inquiry_wrap section div.check i { margin-left: 1rem; font-size: 2.4rem; color: #999999; } 
#inquiry2 .inquiry_wrap section div.check_wrap .agree_txt { display: flex; align-content: center; flex-direction: row; align-items: center; } 
#inquiry2 .inquiry_wrap section div.check_wrap .agree_txt input { display: none; } 
#inquiry2 .inquiry_wrap section div.check_wrap .agree_txt i { margin-right: 1rem; font-size: 3rem; color: #d5d5d5; } 
#inquiry2 .inquiry_wrap section div.check_wrap input i { height: auto; width: auto; display: none; } 
#inquiry2 .inquiry_wrap section div.check_wrap label { display: flex; align-items: center; cursor: pointer; } 
.agree_txt input[id="agree1"] + label i::before { content: "\e92b"; color: #d5d5d5; } 
.agree_txt input[id="agree1"]:checked + label i::before { content: "\e92b"; color: var(--main-color); } 
.agree_txt input[id="agree2"] + label i::before { content: "\e92b"; color: #d5d5d5; } 
.agree_txt input[id="agree2"]:checked + label i::before { content: "\e92b"; color: var(--main-color); } 
#inquiry2 .inquiry_wrap section.message_wrap h4 { margin-top: 2rem; height: 100%; align-self: flex-start; } 
.file_wrap input::file-selector-button { margin-right: 1rem; background: #222; color: #fff; font-family: 'GmarketSans'; padding: 1rem; border: unset } 
#inquiry2 .inquiry_wrap section div.file_wrap input { height: 100%; margin: 0.5rem; } 
.btn_submit1:hover { background: var(--main-color); } 
.btn_submit1 { border: unset; background: var(--main-color); color: #fff; border-radius: 7px; text-align: center; width: 24rem; height: 6.8rem; font-size: 18px; display: block; margin-top: 6.7rem; margin-left: auto; transition: all .4s; } 
#inquiry2 .contain2 .contact_box .box1 { width: 46%; margin-right: 4%; } 
#inquiry2 .contain2 .contact_box .box2 { flex: 1; } 
.btn_submit1 { position: relative; overflow: hidden; border: unset; background: var(--main-color); color: #fff; border-radius: 7px; text-align: center; width: 24rem; height: 6.8rem; font-size: 18px; display: block; margin-top: 4rem; margin-left: auto; transition: transform .3s ease, box-shadow .3s ease, background .3s ease; } 

 /* Base reset for the component */
 .popup_wrap .text_wrap { font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; color: #333; line-height: 1.6; max-width: 800px; margin: 0 auto; padding: 20px; box-sizing: border-box; } 
 .popup_wrap .text_wrap .pop_contents { background-color: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); border: 1px solid #e0e0e0; } 

 /* Typography */
 .popup_wrap .text_wrap .pop_contents h1 { font-size: 24px; font-weight: 700; margin-bottom: 10px; color: #111; text-align: center; } 
 .popup_wrap .text_wrap .pop_contents .date_info { text-align: right; font-size: 14px; color: #666; margin-bottom: 30px; } 
 .popup_wrap .text_wrap .pop_contents p { font-size: 15px; margin-bottom: 15px; word-break: keep-all; } 
 .popup_wrap .text_wrap .pop_contents h2 { font-size: 18px; font-weight: 600; margin-top: 30px; margin-bottom: 15px; color: var(--main-color); padding-bottom: 8px; border-bottom: 1px solid #eee; } 
 .popup_wrap .text_wrap .pop_contents h3 { font-size: 16px; font-weight: 600; margin-top: 20px; margin-bottom: 10px; color: #444; } 
 .popup_wrap .text_wrap .pop_contents ul,
 .popup_wrap .text_wrap .pop_contents ol { margin-bottom: 15px; padding-left: 20px; } 
 .popup_wrap .text_wrap .pop_contents li { font-size: 15px; margin-bottom: 8px; } 
 .popup_wrap .text_wrap .pop_contents .notice { font-size: 14px; color: #666; background-color: #f8f9fa; padding: 15px; border-radius: 4px; margin: 15px 0; } 

 /* Tables */
 .popup_wrap .text_wrap .table_wrap { width: 100%; overflow-x: auto; margin-bottom: 20px; } 
 .popup_wrap .text_wrap .pop_contents table { width: 100%; border-collapse: collapse; min-width: 500px; } 
 .popup_wrap .text_wrap .pop_contents th,
 .popup_wrap .text_wrap .pop_contents td { border: 1px solid #ddd; padding: 12px 15px; font-size: 14px; text-align: left; vertical-align: middle; } 
 .popup_wrap .text_wrap .pop_contents th { background-color: #f5f7f9; font-weight: 600; color: #333; text-align: center; } 

 /* Responsive adjustments */
 @media (max-width: 768px){
 .popup_wrap .text_wrap { padding: 10px; } 
 .popup_wrap .text_wrap .pop_contents { padding: 20px 15px; } 
 .popup_wrap .text_wrap .pop_contents h1 { font-size: 20px; } 
 .popup_wrap .text_wrap .pop_contents h2 { font-size: 16px; } 
 .popup_wrap .text_wrap .pop_contents p,
 .popup_wrap .text_wrap .pop_contents li { font-size: 14px; } 
 .popup_wrap .text_wrap .pop_contents th,
 .popup_wrap .text_wrap .pop_contents td { padding: 10px; font-size: 13px; } 
 }
/* shine 효과 레이어 */
.btn_submit1::before { content: ""; position: absolute; top: 0; left: -150%; width: 60%; height: 100%; background: linear-gradient(
 120deg,
 transparent,
 rgba(255, 255, 255, 0.25),
 transparent
 ); transform: skewX(-20deg); pointer-events: none; } 

/* hover 시 애니메이션 */
.btn_submit1:hover::before { animation: shine 0.8s ease; } 

/* 이동 키프레임 */
@keyframes shine { 
 0% { left: -150%; } 
 100% { left: 150%; } 
 }

/* optional: 살짝 떠오르는 효과 */
.btn_submit1:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0,0,0,0.15); } 
 /* POP UP */
.about_popup { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: #222222cc; z-index: 1000; width: 100%; height: 100%; } 
/* fullpage */
.about_popup .popup_info { width: 80%; max-width: 900px; position: absolute; /* top: 56%; */bottom: 22vh; left: 50%; transform: translateX(-50%); } 
/* no full page */
/* .about_popup .popup_info { width: 80%; max-width: 900px; position: absolute; top: 56%; left: 50%; transform: translate(-50%, -50%); } */
.about_popup .popup_info .art1 { display: flex; background: #fff; justify-content: space-between; align-items: flex-start; padding: 6rem 2rem; position: relative; border-radius: 13px; } 
.about_popup .popup_info .art1 .box1 { width: 100%; } 
.about_popup .popup_info .art1 .box1 .text_wrap { width: 100%; height: 400px; font-size: 15px; padding: 20px; border: unset; line-height: 1.5; word-break: keep-all; overflow-y: scroll; overflow-x: hidden; } 
.about_popup .popup_info .art1 .box1 h1 { font-size: 2.4rem; padding-bottom: 3rem; } 
.about_popup .popup_info .close_btn { color: #fff; padding: 10px; position: absolute; color: #111; top: 1rem; right: 1rem; cursor: pointer; z-index: 100; } 
.about_popup .popup_info .close_btn i { font-size: 2.4rem; } 
.about_popup { transform:translate(9999px); opacity: 0; } 
.about_popup.show { transition: opacity 0.3s linear; transform:translate(0); opacity: 1; } 
.about_popup .popup_info .textwrap { box-shadow: 0px 0px 2px 0px #111111a1; } 

/* swiper */
.certiSwiper { position:relative; } 
.certiSwiper .swiper-wrapper { align-items:stretch; } 
.certiSwiper .swiper-slide { height:auto; } 
.certi_box { height:100%; } 
.certi_box .img_box { overflow:hidden; border-radius:20px; background:#f5f5f5; } 
.certi_box .img_box img { width:100%; display:block; transition:transform .4s; } 
.certi_box p { margin-top:20px; line-height:1.5; word-break:keep-all; } 

/* 화살표 */
.certiSwiper .swiper-button-prev,
.certiSwiper .swiper-button-next { width:54px; height:54px; border-radius:50%; background:#fff; border:1px solid #ddd; top: 38%; transition:all .3s; box-shadow:0 5px 15px rgba(0,0,0,0.08); } 
.certiSwiper .swiper-button-prev { left: 0; } 
.certiSwiper .swiper-button-next { right:0; } 
.certiSwiper .swiper-button-prev:hover,
.certiSwiper .swiper-button-next:hover { background:#111; border-color:#111; } 
.certiSwiper .swiper-button-prev::after,
.certiSwiper .swiper-button-next::after { font-size:18px; font-weight:700; color:#111; transition:all .3s; } 
.certiSwiper .swiper-button-prev:hover::after,
.certiSwiper .swiper-button-next:hover::after { color:#fff; } 
/* disabled */
.certiSwiper .swiper-button-disabled { opacity:.3; pointer-events:none; } 

/* 모바일 */
@media all and (max-width:1280px){
 .sub_top_box { margin-bottom: 9rem; } 
 #company .contain4 { padding-top: 9rem; } 
.sub_com .container { margin-bottom: 10rem; } 
 #company .contain3 .flex_box .box { padding: 5rem 4rem; } 
 #company .contain3 .flex_box .box h4 { height: 9rem; } 
 #company .contain4 .flex_box .box { height: 48rem; } 
 #company .contain4 .flex_box .box .dot_list { height: 274px; } 
 #products .grid_box .box .img_box { right: -30%; width: 260px; } 
 #products .grid_box .box .img_box img { margin-left: 0; } 
 #products .contain2 .flex_box .info_box h3 br { display:none; } 
 #products .contain3 .flex_box .img_box_wrap { height: 50rem; padding: 5rem 4rem; } 
 }
@media all and (max-width:1024px){
 #company .contain3 .flex_box { display: flex; flex-direction: column; } 
 #company .contain3 .flex_box .box h4 br { display:none; } 
 .certiSwiper { padding:0 50px; } 
 }

@media all and (max-width:768px){
 .certiSwiper { padding:0 20px; } 
 .certiSwiper .swiper-button-prev,
 .certiSwiper .swiper-button-next { width:40px; height:40px; top:38%; } 
 .certiSwiper .swiper-button-prev::after,
 .certiSwiper .swiper-button-next::after { font-size:14px; } 
 .certi_box p { margin-top:14px; } 
 }


/************************************* RESPONSIVE *******************************************/
@media (max-width: 1700px){
 #inquiry .inquiry_wrap { width: 87%; margin: 0 auto; } 
 .write-tbl th { width: 20%; } 
 }
@media (max-width: 1360px) { } 
@media (max-width: 1270px){
 #history .contain2 { height: 34rem; } 
 }
@media (max-width: 1080px){
 .sub_page_visual { height: 32rem; } 
 .page_1 .contain1 .flex_box .info_box { padding: 2rem 0 2rem 4rem; } 
 .page_1 .contain1 .flex_box { display: flex; align-items: stretch; } 
 .page_1 .contain1 .flex_box .img_box img { height: 100%; object-fit: cover; } 
 .gray_box .img_box { width: 55%; margin-left: auto; } 
 #company .contain2 .letter { font-size: 18rem; top: -17rem; } 
 #company .contain2 .box_wrap .info_box { padding: 10rem 0; } 
 .p_wrap p br { display:none; } 
 .page_1 .contain1 .flex_box .info_box p br { display:none; } 
 #company .contain3 .flex_box .box h4 { height: auto; } 
 #company .contain3 .flex_box .box p { padding: 2rem 0; } 
 #company .contain3 .dot_list li { font-size: 1.8rem; } 
 #company .contain4 .flex_box .box .dot_list { height: 30rem; } 
 #company .contain4 .flex_box .box { flex: 0 1 50%; height: 45rem; padding: 3.4vw; } 
 #company .contain5 .tab_tit { margin-top: 4rem; margin-bottom: 4rem; } 
 #company .contain4 { padding-top: 4rem; margin-bottom: 4rem; } 
 .sub_top_box .sub_visual_txt { margin-top: 14rem; margin-bottom: 5rem; } 
 .sub_top_box { margin-bottom: 9rem; } 
 /* HISTORY */
 .history_wrap>ul>li { margin-bottom: 7rem; } 
 /* LOCATION */
 .loca_list li b { width: fit-content; margin-right: 2rem; } 
 .loca_list li { font-size: 1.9rem; } 
 .loca_list li br { display: none; } 
 .location_info { width: 40%; } 
 .ci_info_wrap2 li .app_box { height: 18rem; } 
 .ci_info_wrap2 li p { font-size: 1.8rem; padding: 1rem; } 
 .q_inno_wrap .img_box h3 { font-size: 2.4rem; border-radius: 50%; background: #fff; z-index: 5; } 
 #products .top_box { padding: 6rem 6rem; height: 38rem; grid-column: 1/5; } 
 #products .grid_box .box { padding: 4rem; grid-column: auto / span 2; } 
 #products .grid_box { grid-template-columns: repeat(4, 1fr); gap: 2rem; } 
 #products .contain2 .flex_box { gap: 4rem; margin-bottom: 12rem; } 
 #inquiry2 .contain1 .info_box .top_box .img_box { max-width: 15rem; } 
 #inquiry2 .contain1 .info_box .top_box { margin-top: 0; display: flex; align-items: center; } 
 #inquiry2 .contain1 .loca_box { height: 46rem; width: 54%; } 
 #inquiry2 .contain2 .contact_box .box1 { width: 36%; margin-right: 3%; } 
 .page_sub_tit { margin-bottom: 3rem; } 
 #inquiry2 .inquiry_wrap section h4 { width: 76px; } 
 }
@media (max-width: 840px){
 .visual_menu_wrap .tab_sub_menu { margin-bottom: 6rem; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list li.on a { font-size: 1.8rem; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list li { margin-right: 0; border: 1px solid #dcdcdc; flex: 1 1 33%; text-align: center; height: 5rem; max-width: unset; margin: 0 -1px -1px 0; word-break: keep-all; order: unset; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list { border-right: 1px solid #dcdcdc; display: flex; align-items: stretch; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list li.on { background: #6dba44; color: #fff; order: unset; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list li.on::before { display: none; } 
 .visual_menu_wrap .tab_sub_menu .tab_menu_list li.on a { color: #fff; font-weight: 300; } 
.sub_top_wrap .cir_txt img { width: 15rem; } 
 .sub_top_wrap .cir_txt { top: -4rem; } 
 .container { margin-bottom: 6rem; } 
 /* 특허 */
 .sub_com .container .left_box { flex: 100%; margin-bottom: 3rem; } 
 .step_circle ul li span { width: 90%; margin: 0 auto; word-break: keep-all; } 
 .step_circle { height: 27rem; } 
 .step_info ul { width: 100%; } 
 .down_wrap .box { height: 7rem; } 
 /* 문의하기 */
 #inquiry2 .inquiry_wrap section { width: 100%; } 
 #inquiry2 .inquiry_wrap section div.check { padding: 0.5rem; margin: 1rem 0; } 
 .agree_txt label { padding-left: 0; } 
 #inquiry2 section.in_check_sec { display: flex; flex-direction: row; padding-top: 2rem; padding-bottom: 3rem; } 
 #inquiry2 section.in_check_sec h4 { width: 100%; padding-bottom: 0rem; } 
 /* 문의끝 */
 /* HISTORY */
 .history_wrap>ul { padding-top: 10rem; } 
 .history_wrap>ul>li { margin-bottom: 4rem; } 
 .history_wrap>ul>li.left > div { padding-right: 4rem; } 
 .history_wrap>ul>li.right > div { padding-left: 4rem; } 
 .history_wrap>ul>li h4 { font-size: 2.5em; padding-bottom: 2rem; margin-bottom: 2rem; } 
 .history_wrap>ul>.left span.month { padding-left: 2rem; } 
 .history_wrap>ul>.right span.month { padding-right: 2rem; } 
 .right .ball_wrap { left: -5.8rem; } 
 .history_wrap>ul>li.left h4::after { width: calc(100% + 4rem); right: -4rem; } 
 .history_wrap>ul>li.right h4::after { width: calc(100% + 4rem); left: -4rem; } 
 .left .ball_wrap { right: -6rem; } 
 /* LOCATION */
 .loca_list li { font-size: 1.8rem; } 
 .loca_list { margin-top: 2rem; } 
 .location_info { margin-right: 3rem; } 
 #location .loca_wrap { padding: 3rem; display: flex; flex-direction: row; flex-wrap: nowrap; } 
 }

@media (max-width: 480px){
 .about_popup .popup_info { bottom: unset; top: 54%; transform: translate(-50%, -50%); width: 90%; } 
 .about_popup .popup_info .art1 .box1 h1 { font-size: 2rem; padding-bottom: 1rem; } 
 .popup_wrap .text_wrap .pop_contents .date_info { margin-bottom: 1rem; } 
 .about_popup .popup_info .art1 .box1 .text_wrap { padding: 0; } 
 .sub_top_box .sub_visual_txt h2 { line-height: 1; } 
 #inquiry2 .inquiry_wrap section div.check_wrap .agree_txt i { font-size: 2.2rem; position: relative; top: 1px; } 
 #inquiry2 .contain1 .info_box .inner { width: 100%; } 
 #inquiry2 .inquiry_wrap section.in_check_sec { margin-top: 4rem; margin-bottom: 4rem; } 
 #inquiry2 .inquiry_wrap section div.check_wrap { padding: 1rem 0; } 
 #inquiry2 .contain2 .contact_box .box2 { margin-top: 2rem; } 
 #inquiry2 .contain2 .contact_box .box1 { width: 100%; margin-right: 0; } 
 #inquiry2 .contain2 .contact_box .box1 .page_sub_tit h3 br { display:none } 
 .map_link { margin-top: 1rem; background: var(--main-color); color: #fff; } 
 .map_link a { padding: 1.4rem 0; color: #fff; } 
 #inquiry2 .contain1 .info_box .top_box { margin-bottom: 2rem; } 
 #inquiry2 .contain1 .flex_box { gap: 2rem 0; margin-bottom: 8rem; } 
 #inquiry2 .contain1 .loca_box { height: 26rem; width: 100%; order: 2; } 
 #inquiry2 .contain1 .info_box .top_box .img_box { max-width: 10rem; } 
 #inquiry2 .contain1 .info_box .top_box .loca_icon { width: 5rem; height: 5rem; } 
 #inquiry2 .contain1 .info_box .top_box .loca_icon i { font-size: 3rem; } 
 #inquiry2 .contain1 .info_box { height: 32rem; } 
 #company .contain3 .dot_list li { font-size: 13px; padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; } 
 .dot_list li { font-size: 16px; padding-top: 0.2rem; padding-bottom: 0.2rem; padding-left: 1rem; } 
 #products .flex_box .info_box .dot_list li:before { top: 1.2rem; } 
 #products .top_box { padding: 3rem; height: 27rem; } 
 #products .grid_box .box { padding: 3rem; grid-column: auto / span 4; height: 26rem; } 
 #products .grid_box .box .img_box { width: 190px; right: -13%; } 
 #products .top_box .contact_btn { max-width: 19rem; height: 5rem; } 
 #products .grid_box .box .info_box { width: 66%; } 
 #products .grid_box .box .info_box h4 { padding-bottom: 2rem; font-size: 20px; } 
 #products .contain2 .flex_box .img_box_wrap { flex: 1 1 100%; padding: 2.4rem; height: 22rem; } 
 #products .contain2 .flex_box { margin-bottom: 7rem; gap: 2.4rem; } 
 #products .contain2 .box2 .img_box_wrap { order: 1; } 
 #products .contain3 .flex_box .img_box_wrap.pro3_img1 { flex: 1 0 100%; height: 44rem; } 
 #products .contain3 .flex_box .img_box_wrap { padding: 3rem 2rem; } 
 #products .intro_btn a { padding: 1rem 2rem; } 
 #products .contain3 .flex_box { gap: 2rem; } 
 #products .contain3 .flex_box .info_box p { height: 5rem; display: flex; flex-direction: column; justify-content: center; } 
 /* 문의하기 */
 #inquiry2 p.in2_p { font-size: 1.5rem; } 
 #inquiry2 .inquiry_wrap section h4 { min-width: fit-content; font-size: 1.5rem; width: 50px; } 
 #inquiry2 .inquiry_wrap section input {height: 5rem;font-size: 1.5rem;padding: 1.5rem;} 
 #inquiry2 .inquiry_wrap section textarea { height: 120px; padding: 1.5rem; font-size: 1.5rem; } 
 #inquiry2 .inquiry_wrap section div.check { font-size: 1.4rem; word-break: keep-all; padding: 0.2rem; margin: 0; } 
 #inquiry2 .inquiry_wrap section div.check span { white-space: nowrap; font-size: 13.2px; } 
 #inquiry2 .inquiry_wrap section div.check i { margin-left: 0.2rem; font-size: 2.4rem; } 
 #inquiry2 .inquiry_wrap section div.check_wrap label { font-size: 1.4rem; word-break: keep-all; line-height: 1.4; } 
 #inquiry2 .inquiry_wrap section div.check_wrap label > span { font-size: 13.2px; } 
 .btn_submit1 { width: 17rem; font-size: 1.6rem; height: auto; padding: 1.4rem; margin: 3rem auto; } 
 .down_wrap .box { height: 5rem; border-radius: 10px; } 
 .down_wrap .box a i { font-size: 1.8rem; } 
 .sub_top_box .sub_visual_txt { margin-top: 12rem; margin-bottom: 4rem; font-size: 1.8rem; width: 90%; margin-left: auto; margin-right: auto; } 
 .sub_page_visual { height: 20rem; } 
 .sub_top_box { margin-bottom: 5rem; } 
 .page_sub_tit { margin-bottom: 3rem; margin-bottom: 2rem; } 
 .page_1 .contain1 .flex_box .img_box { width: 100%; } 
 .page_1 .contain1 .flex_box .info_box { padding: 2rem 0 2rem 0; } 
 .sub_com .container { margin-bottom: 4rem; } 
 #company .contain2 .letter { font-size: 8rem; top: -43px; } 
 #company .contain2 .box_wrap .info_box { padding: 4rem 0; padding-right: 15rem; margin-top: 5rem; } 
 .ceo_comment { margin-top: 4rem; gap: 0; display: flex; flex-direction: column; } 
 .p_wrap p { margin-bottom: 3rem; } 
 .sign_box .img_box { width: 80px; } 
 .sign_box .sign_inner span { margin-right: 1.5rem; } 
 .page_tit h2 { padding-left: 2rem; font-size: 22px; } 
 .page_tit .plus_icon::before { width: 1.6rem; height: 0.3rem; top: 23%; } 
 .page_tit .plus_icon::after { width: 1.6rem; height: 0.3rem; top: 23%; } 
 .sub_com .page_tit { margin-bottom: 1.5rem; } 
 #company .contain4 .flex_box .box { flex: 0 1 100%; height: auto; padding: 2rem; } 
 #company .contain4 .flex_box .box .dot_list { height: auto; } 
 #company .contain3 .flex_box .box { padding: 3rem 3rem; border-radius: 14px; } 
 #company .contain5 .tab_tit { display: flex; flex-direction: row; flex-wrap: wrap; margin-top: 2rem; margin-bottom: 3rem; } 
 #company .contain5 .tab_tit li { flex: 0 0 calc((100% - 2rem) / 3); height: 4.5rem; font-size: 14px; } 
 #company .contain5 .tab_wrap { height: auto; } 
 .certi_box p { font-size: 1.7rem; } 
 #company .contain3 .flex_box .box h4 { font-size: 20px; } 
 #company .contain4 .flex_box .box .dot_list li { font-size: 1.6rem; padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; } 
 #company .contain2 .box_wrap .info_box p { font-size: 17px; } 
 #company .contain5 .tab_wrap .tab_list .certi_box .img_box { padding: 4rem 4rem; } 
 }
