@charset "utf-8"; /* tab */
#bo_cate h2 { position:absolute; font-size:0; line-height:0; overflow:hidden } 
#bo_cate ul { zoom:1 } 
#bo_cate ul:after { display:block; visibility:hidden; clear:both; content:"" } 
#bo_cate li { cursor: pointer; background: #fff; height: 7rem; font-size: 2rem; font-weight: 400; transition: all .3s; text-align: center; border-right: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; flex: 1 0 auto; } 
#bo_cate a { color: #111; font-weight: 400; padding: 1rem 2rem; } 
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active { color: #fff; background: var(--main-color); font-weight: 500; border: unset; transition: all .4s; } 
#bo_cate #bo_cate_on { border: unset; color: #fff; background: var(--main-color); } 
#bo_cate ul.flex_20 > li { flex: 0 1 20%; } 

/* TAB MENU */
.tab_list { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; flex-direction: row; width: 100%; margin: 4rem auto 6rem; position: relative; } 
.tab_list a { display: flex; align-items: center; justify-content: center; } 
.tab_list div { cursor: pointer; transition: all .4s; text-align: center; font-size: 2rem; padding: 1.5rem; display:inline-block; height: 6rem; font-size: 1.8rem; flex: 1 0 15%; border-bottom: 3px solid #dcdcdc; color: #999; } 
.tab_list div:hover { color: var(--main-color); border-bottom: 3px solid var(--main-color); } 
.tab_content { display: none; } 
.tab_content.current { display: block; } 
.tab_list .tab_link.current { z-index: 2; color: var(--main-color); border-bottom: 3px solid var(--main-color); background: unset; } 
.tab_list.nav-fixed { position: fixed; top: 100px; background: #fff; z-index: 10; width: 100%; margin: 0; } 


/* sub_com */
.main_wrapper p { line-height: 1.5; } 
.sub_com { padding: 0 0 14rem; line-height: 1.5; position: relative; } 
.sub_inner_wrap img { display: block; margin: 0 auto; max-width: fit-content; width: 100%; } 
.container { margin-bottom: 8rem; position: relative; } 
.container:last-child { padding-bottom:0; } 
.contain1.tit1 { position: relative; padding-top: 8rem; } 
.sub_tit { padding-top: 8rem; padding-bottom: 7rem; position:relative; text-align: center; color: #111; } 
.sub_tit2 { padding-top: 1rem; padding-bottom: 4rem; position:relative; text-align: center; color: #111; } 
.sub_tit h1 { font-weight: 600; } 
.sub_tit2 h1 { font-weight: 600; } 
.center100 { text-align: center; margin: 0 auto; width: 100%; } 
.bor_b { border-bottom: 1px solid #dcdcdc; } 
/* sub visual */
.sub_visual_wrap { position: relative; } 
.sub_visual_box { width: 100%; height: 84rem; overflow: hidden; position: relative; text-align: center; } 
.sub_img_box { width: 100%; height: 42rem; overflow: hidden; position: relative; } 
.sub_visual_box .info_box { height: 42.3rem; position: relative; color: #222; } 
.sub_page_visual { background-repeat: no-repeat; background-position: center center; background-size: cover; animation: bg-active 5s; height: 100%; width: 100%; } 
.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); } 
.sub_page_visual6 { background-image: url(../../img/sub_visual_6.jpg); } 

 /* 애니메이션 */
/* .sub_visual_3 { animation: bg-active 5s; } */
@keyframes bg-active { 
 0% { transform: scale(1.09); opacity: 0.9; } 
100% { transform: scale(1); opacity: 1; } 
 }
 /* sub_visual */
.top_letter { font-size: 16rem; color: #ffffff1a; position: absolute; right: 6%; bottom: -10%; z-index: 100; font-family: var(--font-eng); font-weight: 600; letter-spacing: -3px; } 
.sub_visual_txt { position: absolute; left: 0; z-index: 5; bottom: 15%; width: 100%; } 
.sub_visual_txt h1 { color: #222; font-size: 6.8rem; font-weight: 700; width: fit-content; text-align: center; margin: 0 auto; margin-bottom: 1rem; margin-top: 1rem; } 
.sub_visual_txt h2 { color: #fff; font-size: 2.4rem; font-weight: 300; } 
.sub_visual_txt p { color: #333333e8; font-size: 2rem; } 
.web_location { display: flex; font-size: 2rem; color: #333; align-items: center; } 
.web_location i { padding: 0 0.5rem; } 
.tit_box { padding-top: 6rem; padding-bottom: 9rem; text-align: center; } 
.tit_box .tit_bar { width: 1px; display: block; margin: 3rem auto 2rem; height: 5rem; background: #dadada; position: relative; } 
.tit_box h1 { margin-bottom: 1rem; font-weight: 600; font-family: var(--font-eng); } 
.tit_box h2 { font-size: 2.6em; font-family: inherit; font-weight: 300; letter-spacing: -3px; line-height: 1.5; } 
.tit_box h2 strong { font-weight: 500; } 
.tit_box p { font-size: 3.1rem; font-family: 'SUIT'; font-weight: 400; line-height: 1.4; color: #111; word-break: keep-all; } 
.tit_box2 h1 { font-weight: 500; font-size: 2.7em; font-family: 'GmarketSans'; padding-bottom: 4rem; padding-top: 6rem; } 
.horizon { width: 4rem; height: 2px; background: #fff; display: block; margin: 0 auto; margin-top: 2rem; } 
.web_location { text-align: center; display: flex; font-size: 1.5rem; justify-content: center; color: #000000a6; align-items: center; } 
/* top menu */
.mobile_sub_menu { display: none; } 
/* .pc_sub_menu { display: none; } */
.sub_visual_box .visual_menu_wrap { padding-top: 60px; position: relative; z-index: 1111; } 
.depth_wrap { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: flex-start; font-size: 1.8rem; margin-left: auto; width: 100%; height: 100%; max-width: 54rem; position: relative; } 
.depth_wrap .depth_name { display: flex; justify-content: space-between; min-width: 87px; width: 100%; word-break: keep-all; color: #fff; } 
.depth_wrap > div.home_btn { width: auto; } 
.depth_wrap > div.home_btn a { color: #fff; font-size: 2.2rem; display: flex; justify-content: center; align-items: center; } 
.depth_wrap > div { padding: 0 2rem; position: relative; cursor: pointer; height: 100%; display: flex; align-items: center; width: 50%; justify-content: flex-end; } 
.depth_wrap > div.depth3.show { display:block; } 
.depth_wrap > div.depth2 { width: 60%; } 
.depth_wrap > div:last-child { border-right: unset; } 
.depth_wrap > div .depth_name i { padding-left: 1rem; display: flex; align-items: center; font-size: 2.2rem; } 
.visual_menu_wrap { position: relative; height: 8rem; max-width: 1580px; margin: 0 auto; width: 94%; bottom: calc(8rem + 5.5rem); z-index: 10; } 
.visual_menu_wrap .com_depth { position: absolute; background: #113992eb; width: 94%; left: 50%; transform: translateX(-50%); top: 7rem; z-index: 5; overflow: hidden; padding: 1rem 0; border-radius: 0 0 10px 10px; } 
.visual_menu_wrap .com_depth li { padding: 0.1rem; } 
.visual_menu_wrap .com_depth li:hover a { color: #fff; background: var(--main-color); } 
.visual_menu_wrap .com_depth li a { color: #fff; text-align: center; padding: 5px; font-size: 1.6rem; font-weight: 500; transition: all .2s; word-break: keep-all; } 
.depth_wrap > div.depth1::before { content:''; display:block; position:absolute; left: 0; top: 50%; transform: translateY(-50%); width:1px; height: 2rem; background:#fff; } 
.depth_wrap > div.depth1::after { content:''; display:block; position:absolute; right: 0; top: 50%; transform: translateY(-50%); width:1px; height: 2rem; background:#fff; } 

/* SUB PAGE CSS */
.two_wrap .eq_arti { display: block; margin-bottom: 4rem; } 
.two_wrap .eq_arti { margin-bottom: 6rem; display: flex; } 
.two_wrap .eq_arti .left_box { flex: 0 1 20%; margin-right: 4%; } 
.two_wrap .eq_arti .right_box { flex: 1; } 
.two_wrap .eq_arti .left_box h3 { display: flex; flex-wrap: nowrap; font-size: 2.6rem; margin-bottom: 1rem; } 
.two_wrap .eq_arti .left_box h3 b { font-weight: 600; flex: 1; } 
.two_wrap .eq_arti .left_box h3 .num { width: 0.8rem; height: 0.8rem; background: var(--main-color); color: #fff; display: flex; justify-content: center; align-items: center; /* font-size: 2rem; */margin-right: 1rem; } 
.frame1 .pipe_wrap { display: block; } 
.frame1 .eq_arti .right_box { margin-left: 0; } 
.frame1 .eq_arti .right_box .left_img { max-width: fit-content; width: 100%; } 
.frame1 .eq_arti .right_box .new_design { margin-bottom: 4rem; } 
.frame1 .eq_arti .right_box .new_design > p { font-weight: 600; margin-bottom: 0.5rem; } 
.frame1 .eq_arti .right_box .new_design > .list4 { margin-left: 2rem; } 

.frame1.two_wrap .right_box .bg_list li .list4 { background: unset; padding: 0 2rem; } 
.frame1 .eq_arti.arti2 .right_box .list3 { display: flex; margin-top: 2rem; margin-left: -1%; margin-right: -1%; } 
.frame1 .eq_arti.arti2 .right_box .list3 > li { flex: 1 1 30%; display: block; /* border: 1px solid #dcdccd; */padding: 2rem 1rem 1rem; border-radius: 15px; margin: 0 1%; } 
.frame1 .eq_arti.arti2 .right_box .list3 li b { margin-bottom: 1rem; display: block; /* text-align: center; */font-size: 2.1rem; } 
.frame1 .pipe_wrap.wrap2 { } 
.frame1 .pipe_wrap.wrap2 .right_box { display: flex; align-items: stretch; flex-wrap: wrap; } 
.frame1 .pipe_wrap.wrap2 .right_box > p { margin-bottom: 3rem; width: 100%; } 
.frame1 .pipe_wrap.wrap2 .right_box .list3 { margin-top: 0; } 
.frame1 .pipe_wrap.wrap2 .right_box .img_box { width: 30%; display: flex; justify-content: center; align-items: center; margin-right: 3%; border-radius: 10px; } 
.frame1 .pipe_wrap.wrap2 .right_box .info_box { flex: 1; } 

.frame1 .eq_arti.arti3 .right_box .list3 { display: flex; margin-top: 4rem; margin-left: -1%; margin-right: -1%; } 
.frame1 .eq_arti.arti3 .right_box .list3 > li { flex: 1 1 30%; display: block; border: 1px solid #dcdccd; padding: 2.4rem 1rem 2rem; border-radius: 15px; margin: 0 1%; } 
.frame1 .eq_arti.arti3 .right_box .list3 li b { margin-bottom: 1rem; display: block; text-align: center; font-size: 2.1rem; } 
.frame1 .eq_arti.arti2 .right_box .new_design .list3 { display: block; } 
.frame1 .eq_arti.arti2 .right_box .new_design .list3 > li { margin-bottom: 2rem; /* display: flex; */padding: 0; /* align-items: stretch; */overflow: hidden; /* flex-wrap: nowrap; */ } 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li:last-child { margin-bottom: 0; } 
.frame1 .eq_arti.arti2 .right_box .new_design .list3 > li b { flex: 0 1 30%; margin-bottom: 0; /* background: #f7f7f7; *//* margin-right: 3rem; *//* display: flex; *//* justify-content: center; *//* align-items: center; */font-size: 2rem; padding: 1rem; font-weight: 500; color: #111; } 
.frame1 .eq_arti.arti2 .right_box .new_design .list3 > li ul { flex: 1 1 0; width: unset; display: block; /* flex: unset; *//* padding: 2rem; */ } 
.frame1 .dot_list > li { padding: 0.2rem 1rem 0.2rem 1rem; position: relative; word-break: keep-all; font-size: 1.8rem; } 
.frame1 .dot_list > li::before { content:''; display:block; position:absolute; top: 1.5rem; left: 0; transform: translateY(-50%); width: 9px; height: 1px; background: #141414; } 
.frame1 .dot_list.list4 li::before { width: 3px; height: 3px; top: 15px; } 
.frame1 .dot_list.list3 > li::before { display:none; } 
.pipe_img { display: flex; align-items: stretch; justify-content: space-between; margin-top: 4rem; } 
.pipe_img > div { flex: 1; } 
.pipe_img p { font-size: 2rem; text-align: center; padding: 1rem 0 2rem; } 
.fac_box { } 
.fac_box .right_box .list4 { display: flex; flex-direction: row; flex-wrap: wrap; } 
.fac_box .right_box .list4 li { flex: 0 1 44%; } 
#tech .img_list { margin-top: 4rem; display: flex; flex-wrap: wrap; justify-content: center; margin-left: -3rem; margin-right: -4rem; } 
#tech .img_list li { flex: 0 1 30%; margin: 0 1.5rem 5rem; } 
#tech .img_list li p { font-size: 2rem; padding-top: 2rem; } 
#tech .img_list li.center img { padding: 2rem 0; } 
.center { text-align: center; } 


/* GREETING */
#greeting { margin: 0 auto; position: relative; background: url(../img/company_bg.png) no-repeat 50% 113%/contain; padding-bottom: 18rem; } 
#greeting .inner_wrap { max-width: 1220px; margin: 0 auto; } 
#greeting .flex_box { display: flex; justify-content: space-between; } 
#greeting .p_wrap { color: #333; z-index: 1; position: relative; } 
#greeting .p_wrap p { margin-bottom: 2.6rem; font-weight: 300; line-height: 1.7; } 
#greeting .info_box { flex: 0 1 62%; } 
#greeting .info_box h2 { margin-bottom: 5rem; font-weight: 600; } 

#greeting .img_box { flex: 1; } 

/* history */
#history .img_box { position: absolute; margin-top: 7rem; } 
#history .right .img_box { right: 0; } 
#history .left .img_box { left: 0; } 
#history .left .img_box img { margin-left: 0; } 
#history.sub_com { padding: 0; } 
#history article:last-child { margin-bottom: 0; } 
#history .contain2 { background: url(../img/history_bg.jpg); height: 48rem; color: #fff; margin-bottom: 0; } 
#history .contain2 .p_wrap { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; } 
.right .ball_wrap { left: -9.8rem; bottom: -2rem; } 
.left .ball_wrap { right: -10rem; bottom: -2rem; } 
.ball_wrap { border-radius: 50%; background: #fff; width: 3.8rem; height: 3.8rem; position: absolute; } 
.ball_wrap .dot { width: 0.5rem; height: 0.5rem; display: block; background: var(--main-color); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; } 
#history .tit_box p { color: #b1b1b1; } 
.history_wrap { border-bottom: 1px #ddd solid; position: relative; width: 100%; } 
.history_wrap::before { content: ""; display: inline-block; width: 1px; height: 100%; border-right: 1px solid #ddd; position: absolute; left: 50%; top: 0; } 
.history_wrap .month { font-weight: 600; font-size: 2rem; font-family: var(--font-eng); color: #111; width: 5rem; text-align: center; display: none; } 
.history_wrap .month_now { color: #b6d7f4; font-size: 12px; } 
.history_wrap>ul { padding-top: 10rem; max-width: 1480px; width: 100%; margin: 0 auto; } 
.history_wrap>ul>li { position: relative; width: 100%; margin-bottom: 10rem; } 
.history_wrap>ul>li.left > div { width: 50%; margin-right: auto; padding-right: 8rem; position: relative; } 
.history_wrap>ul>li.right > div { width: 50%; margin-left: auto; padding-left: 8rem; position: relative; } 
.history_wrap>ul>li.left div li { display: flex; justify-content: flex-end; flex-wrap: nowrap; flex-direction: row; } 
#history .history_wrap>ul>li.left div li a { display: flex; justify-content: flex-end; flex-wrap: nowrap; flex-direction: row; } 
#history .history_wrap>ul>li div li a { transition: all .4s; } 
#history .history_wrap>ul>li div li a:hover { color: var(--main-color) } 
.history_wrap>ul>li.left div li .month { order: 2; } 
.history_tit { position: relative; } 
/* left before */
.history_wrap>ul>.right::after { left: calc(50% + 3.6rem); display: none; } 
.history_wrap>ul>.right { margin-left: auto; } 
.history_wrap>ul>.left { text-align: right; position: relative; } 
.history_wrap>ul>.left::before { right: -9px; } 
.history_wrap>ul>li.left h4 { color: #005e0e; } 
.history_wrap>ul>li.right h4 { color: #308e3e; } 
.history_wrap>ul>li h4 { font-size: 3.4rem; padding-bottom: 2rem; margin-bottom: 2rem; font-weight: 600; position: relative; } 
.history_wrap>ul>li.right h4::after { content: ''; display: block; width: calc(100% + 8rem); height: 1px; background: #dcdcdc; position: absolute; bottom: 0; left: -8rem; } 
.history_wrap>ul>li.left h4::after { content: ''; display: block; width: calc(100% + 8rem); height: 1px; background: #dcdcdc; position: absolute; bottom: 0; right: -8rem; } 
.history_wrap>ul>li> div ul>li { font-size: 1.8rem; position: relative; line-height: 1.9; font-family: 'Pretendard', sans-serif; word-break: keep-all; display: flex; color: #808080; } 
.history_wrap>ul>li>ul>li.emph { font-size: 24px; font-weight: 600; } 
.history_wrap>ul>li>ul>li.emph::after { top: 18px; } 
.history_wrap>ul>.right span.month { padding-right: 2.8rem; } 
.history_wrap>ul>.left span.month { padding-left: 2.8rem; } 
.history_wrap>ul span.dot_line { width: 2.4rem; height: 2.4rem; display: block; background: #fff; padding-right: 0; border: 1px dotted var(--main-color); border-radius: 50%; padding: 0.5rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 


/* 납품실적 */
#deliver { margin: 0 auto; } 
#deliver .container { margin-bottom: 6rem; } 
.deliver_wrap { display: flex; flex-wrap: wrap; justify-content: flex-start; } 
.deliver_wrap li { border: 1px solid #ededed; flex: 0 0 19%; margin: 0.5%; padding: 3rem 0; } 
.deliver_wrap .info_box { width: 100%; margin-left: 0.5%; } 
.deliver_wrap .info_box h4 { font-size: 2.8rem; font-weight: 600; margin-bottom: 1rem; } 
.deliver_wrap .info_box h4 i { transform: rotate(90deg); margin-right: 1rem; } 
.deliver_wrap .info_box p { font-size: 1.9rem; margin-bottom: 1rem; } 
.asia_box .deliver_wrap:nth-child(1) { width: 60%; } 
.asia_box .deliver_wrap:nth-child(2) { width: 40%; } 
.asia_box .deliver_wrap li { flex: 1; } 
.eu_box .deliver_wrap { } 
.eu_box .deliver_wrap:nth-child(1) { flex: 0 1 calc(100% / 5 *2); margin-right: 1%; } 
.eu_box .deliver_wrap:nth-child(1) li { flex: 1; } 
.eu_box .deliver_wrap:nth-child(2) { flex: 0 1 calc(100% / 5 * 1); } 
.eu_box .deliver_wrap:nth-child(3) { flex-grow: 1; } 

/* 융복합 비상벨 */
#bell .bell_bg { margin-bottom: 6rem; border-bottom: 1px solid #dcdcdc; padding-bottom: 6rem; } 
#bell .bell_bg .img_box { border: 1px solid #dcdcdc; border-radius: 1.5rem; } 
#bell .bell_bg .p_wrap p { font-size: 2rem; line-height: 1.7; padding: 0 4%; } 
#bell .info_box h2 { text-align: center; margin-bottom: 6rem; } 
.frame1 article { display: flex; margin-bottom: 8rem; color: #333; font-weight: 300; } 
.frame1 article .sub_arti { flex: 1; } 
.frame1 article .sub_arti2 { margin-bottom: 3.7rem; } 
 .frame1 article .sub_arti2:nth-child(1) { margin-top: 1rem; } 
.frame1 article .sub_arti2 h4 { margin-bottom: 1rem; } 
.frame1 article .sub_arti p { margin: 0.5rem 0; } 
.frame1 article span.main_color { font-weight: 400; margin-top: 4px; display: block; } 
.li_basic li { margin: 0.5rem 0; } 
.li_basic > * { padding-left: 1.4rem; position: relative; font-size: 1.8rem; word-break: keep-all; } 
.li_basic.hyp_list > li:before { content:''; display: block; width: 0.8rem; height: 1.3px; background: #333; position: absolute; top: 11px; left: 0; } 
.li_basic.dot_list > li:before { content:''; display: block; width: 2px; height: 2px; border-radius: 50%; background: #333; position: absolute; top: 11px; left: 0; } 
.num_list { display: flex; align-items: flex-start; flex-wrap: wrap; } 
.num_list b { font-weight: 400; margin-right: 0.7rem; } 
.num_list span { display: block; flex: 0 1 auto; flex: 1 1 0; } 

/* SYSTEM */
.system_wrap .system_bg .img_box { border: 1px solid #dcdcdc; border-radius: 1.5rem; padding: 6rem; } 

/* AS */
#as .as_wrap li { background: #ffffff; border-radius: 15px; margin-bottom: 3.4rem; padding: 5rem 4rem; position: relative; background: #ededed7a; } 
#as .box1 { display: flex; justify-content: space-between; } 
#as .box1 span { color: #fff; background: var(--main-color); width: 5rem; height: 5rem; border-radius: 10px; display: flex; justify-content: center; align-items: center; font-weight: 700; font-size: 2rem; } 
#as .box2 h3 { padding-bottom: 6rem; font-weight: 700; } 
#as .as_wrap li { background: #fff; border: 1px solid #dcdcdc; position: relative; height: 31rem; } 
 #as .as_wrap li:nth-child(1) span,#as .as_wrap li:nth-child(4) span { display: block; } 
#as .as_wrap li .box1 { position: absolute; right: 5rem; top; top: 4rem; } 
#as .icon_box { width: 8rem; height: auto; } 
#as .as_wrap li .box3 p { font-size: 1.8rem; color: #131313; font-weight: 200; } 
#as .as_wrap li .box3 p span { margin-right: 0.5rem; } 
#as .as_wrap li .box3 a { color: #666; display: inline-block; } 


/* 적용분야 */
#field .bottom_box ul li { flex: 1 0 48%; margin-bottom: 2%; position: relative; overflow: hidden; transition: all .4s; border-radius: 10px; } 
#field .arti1 { text-align: center; } 
#field .arti1 .top_wrap { margin-bottom: 10rem; } 
#field .arti1 .top_wrap h2 { margin-bottom: 3rem; } 
#field .bottom_box ul li .info_box { position: absolute; bottom: 0; color: #fff; width: 100%; padding: 1rem; background: #11111185; } 
#field .bottom_box ul li .info_box h3 { font-size: 2rem; padding-bottom: 0.5rem; } 
#field .bottom_box ul li img { transition: all .4s; } 
#field .bottom_box ul li:hover img { transform: scale(1.33); } 


/* LOCATION */
#location .contain2 .sub_inner_wrap > div:not(.current) { position: absolute; top: 0; left: 0; width: 100%; height: 0; overflow: hidden; } 

#location .contain2 .sub_inner_wrap > div.current { position: relative; } 

#location { position: relative; } 

#location .sub_inner_wrap { max-width: 1390px; } 

#location .location_tit { margin-bottom: 3rem; } 

#location .loca_wrap { display: flex; flex-direction: row; flex-wrap: wrap; padding: 5rem; box-shadow: 0 0 9px 0px #dcdcdcad; align-items: stretch; margin-bottom: 9rem; } 

#location .location_tit h3 { font-size: 2.25em; font-weight: 700; position: relative; padding-left: 2rem; } 

.location_info { margin-right: 5rem; width: 27%; min-width: 300px; } 

.location_map { flex-grow: 1; flex-basis: 0; } 
.location_map iframe { width: 100%; } 

.loca_list { margin-top: 4rem; } 

.loca_list li { font-size: 2rem; color: #808080; display: flex; padding-bottom: 0.7rem; } 

.loca_list li:last-child { padding-bottom: 0; } 

.loca_list li b { color: #222; font-weight: 600; font-family: 'Oswald'; margin-right: 1rem; } 

.location_map >div { width: 100% !important; height: 100% !important; } 

.location_map >div .wrap_map { height: 100% !important; } 

#location .location_tit h3.vl::before { content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); width: 2px; height: 70%; background: var(--main-color); } 

#location #map a, #location #map2 a { width: auto; } 

.root_daum_roughmap .wrap_controllers { display: flex; justify-content: space-between; flex-direction: row; flex-wrap: nowrap; align-items: center; display: none; } 

.root_daum_roughmap .wrap_controllers .wrap_btn_roadview { display: flex; flex-direction: row; flex-wrap: nowrap; width: 300px; justify-content: flex-end; align-items: center; } 

.root_daum_roughmap .wrap_controllers .wrap_btn_roadview a.txt { text-align: center; } 


/* ESG */
#esg { max-width: 1492px; margin: 0 auto; } 
#esg ul { display: flex; justify-content: center; } 
#esg ul li { } 
#esg ul li .info_box { margin-top: 3rem; text-align: center; position: relative; } 
#esg ul li .info_box::before { content:''; display:block; position:absolute; left:50%; width: 5rem; height:1px; background: #dcdcdc; transform: translateX(-50%); top: -1rem; } 
#esg ul li .info_box p { } 
#esg ul li .info_box h3 { font-size: 2.6rem; } 

#esg .title2 { text-align: center; margin-bottom: 5rem; } 

.esg_ul2 { margin-top: 14rem; } 
.esg_ul2 .esg_box { } 
.esg_ul2 .esg_box { display: flex; align-items: center; flex-wrap: wrap; } 
.esg_ul2 .esg_box .img_box { max-width: fit-content; width: 50%; margin-right: 6%; } 
.esg_ul2 .esg_box .info_box { flex: 1; } 
.esg_ul2 .esg_box .info_box h3 { font-weight: 600; margin-bottom: 2rem; } 
.esg_ul2 .esg_box .info_box .box_inner { } 
.esg_ul2 .esg_box .info_box .box_inner .box { margin-bottom: 3rem; font-size: 1.8rem; color: #333; } 
.esg_ul2 .esg_box .info_box .box_inner .box:last-child { margin-bottom: 0; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul { display: block; margin-bottom: 2rem; } 
#esg .esg_ul2 .esg_box.order .info_box .box_inner .box ul li { display: block; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul p.last { padding-top: 1rem; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul p { padding-bottom: 1rem; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul li { padding: 0.1rem 0; display: flex; justify-content: flex-start; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul li b { font-weight: 500; margin-right: 0.5rem; } 
#esg .esg_ul2 .esg_box .info_box .box_inner .box ul li span { } 
.esg_ul2 .esg_box .info_box .box_inner .box h4 { color: #111; margin-bottom: 1rem; } 



.esg_ul2 .esg_box.order { margin: 12rem 0; } 
.esg_ul2 .esg_box.order .img_box { margin-right: 0; margin-left: 6%; order: 2; } 
.esg_ul2 .esg_box.order .info_box { text-align: right; } 
.esg_ul2 .esg_box.order .info_box .box li { } 



/* INQURIY */
#inquiry2 p.in2_p { padding-bottom: 2rem; color: #000; opacity: 0.4; } 
#inquiry2 .new_in_1 { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; } 
#inquiry2 .inquiry_wrap section { display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; width: calc(100% / 2 - 1rem); margin-bottom: 2rem; background: #f7f7f7; align-items: center; padding: 0.5rem 3rem; } 
#inquiry2 .inquiry_wrap section h4 { margin-right: 1rem; min-width: 94px; } 
#inquiry2 .inquiry_wrap section div { flex-grow: 1; flex-basis: 0; margin-bottom: 0; } 
#inquiry2 .inquiry_wrap section div.file_wrap { display: flex; align-content: center; align-items: center; } 
#inquiry2 .inquiry_wrap section div.file_wrap input { flex-grow: 1; flex-basis: 0; line-height: 5rem; } 
 .file_wrap input::file-selector-button { margin-right:1rem; background:#222; color:#fff; font-family:'GmarketSans'; padding:0.8rem 1.5rem; border:unset } 
#inquiry2 .inquiry_wrap section .filebox input { flex-grow: 1; flex-basis: 0; } 
#inquiry2 .inquiry_wrap section input { border: unset; padding: 0.5rem; background: unset; height: 6rem; width: 100%; outline: none; -webkit-appearance : none; -moz-appearance:none; appearance:none; color: #b7b7b7; font-weight: 400; } 
#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: 200px; width: 100%; padding: 2rem 0; } 
#inquiry2 .inquiry_wrap section div.check_wrap { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; height: 7rem; justify-content: space-between; } 
#inquiry2 .inquiry_wrap section div.check { flex-grow: unset; flex-basis: auto; border: 1px solid #6b6b6b; padding: 1rem; margin-left: 1rem; display: flex; align-items: center; cursor: pointer; } 
#inquiry2 .inquiry_wrap section div.check i { margin-left: 1rem; } 
#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: 2rem; } 
#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: flex-start; cursor: pointer; } 
.agree_txt input[id="agree1"] + label i::before { content: "\e92c"; } 
.agree_txt input[id="agree1"]:checked + label i::before { content: "\e92b"; color: #000; } 
#inquiry2 .inquiry_wrap section.message_wrap h4 { margin-top: 2rem; } 
.btn_submit1 { border: unset; background: var(--main-color); background: #111; color: #fff; text-align: center; width: 22rem; height: 6rem; font-size: 1.8rem; margin: 4rem auto; transition: all .4s; display: flex; justify-content: center; align-items: center; } 
.btn_submit1:hover { background:var(--main-color); border-radius: 10px; } 

/************************************* RESPONSIVE *******************************************/

@media (max-width: 1880px) { } 
@media (max-width: 1700px){
 #inquiry .inquiry_wrap { width: 87%; margin: 0 auto; } 
.write-tbl th { width: 20%; } 
 }
@media (max-width: 1360px) { /* 최소 PC */ } 
@media (max-width: 1270px){
 .depth_wrap { width: 50%; } 
 .depth_wrap:after { left: unset; width: 100%; transform: unset; } 
 /* LOCATION */
 #location .loca_info span br:first-child { display:none; } 
 /* INQUIRY */
 #inquiry .sub_inner_wrap { width: 90%; margin: 0 auto; } 
 .write-tbl .write-input.input100 { width:100%; } 
 .write-tbl th { min-width: 116px; } 
 .write-tbl .write-input { width: 100%; } 
 .write-tbl .write-select { width: 30%; } 
.sub_visual_box .info_box { height: 34rem; } 
 .sub_img_box { height: 18rem; } 
 }

@media (max-width: 1024px){
 .frame1 .pipe_wrap.wrap2 .eq_arti.arti2 .right_box .new_design .list3 > li { display: flex; flex-wrap: wrap; } 
 .frame1 .pipe_wrap.wrap2 .eq_arti.arti2 .right_box .new_design .list3 > li b { flex: 0 1 100%; } 
 .frame1.two_wrap .eq_arti.arti2 .right_box .bg_list li .list4 { flex: 1 1 100%; } 
 .frame1 .pipe_wrap.wrap2 .right_box .new_design .list3 > li b { } 
 .tab_list div { height: 7rem; display: flex; justify-content: center; align-items: center; line-height: 1.2; } 
 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li b { margin-right: 0rem; flex: 0 1 200px; } 
 .eu_box .deliver_wrap { flex: 0 0 47%; } 
 .deliver_wrap .info_box h4 { font-size: 2.4rem; } 
 .sub_visual_box .info_box { height: 30rem; } 
 #bo_cate ul.flex_20 > li { flex: 0 1 33.3%; } 
 .sub_visual_box { height: auto; } 
 .sub_visual_txt { bottom: 6rem; } 
 .visual_menu_wrap { bottom: calc(6rem + 5.5rem); } 
 .sub_com { padding: 0 0 8rem; } 
 .container { margin-bottom: 6rem; } 
 .sub_visual_txt h1 { font-size: 4rem; } 
 .sub_tit { font-size: 4.2rem; padding-bottom: 6rem; } 
 #location .loca_info p.address { flex: 1 1 100%; } 
 .frame1 article h3 { min-width: 24rem; } 
 .frame1 article { margin-bottom: 4rem; display: flex; flex-direction: column; } 

 /* History */
 .history_wide { padding-left: 7%; } 
 .history_wrap>ul>.right> div ul>li::after { top: 11px; left: -12px; } 
 .history_wrap>ul>li { padding-left: 7%; } 
 .history_wrap::before { left: 0; } 
 .history_wrap>ul>.left { width: 100%; text-align: left; } 
 .history_wrap>ul>.right { width: 100%; position: relative; } 
 .history_wrap>ul>li.right div { padding-left: 20px; } 
 .history_wrap>ul>li.right::before { left: -7px; transform: unset; z-index: 2; } 
 .history_wrap>ul>li.right::after { z-index: 1; left: 22px; top: 7px; } 
 .history_wrap>ul>li.left div { padding-right: 0; } 
#history .container .img_box img { margin-left: 0; margin-bottom: 4rem; } 
 .history_wrap>ul>li h4 { font-size: 3.4rem; } 
 .history_wide::after { font-size: 10rem; } 
 #history article { padding: 7rem 0; } 
 
 #greeting .bg_box { height: 24rem; margin-bottom: 6rem; } 
 #greeting { padding-bottom: 7rem; } 
 #greeting:after { font-size: 7rem; } 
 #greeting .p_wrap p:last-child { margin-top: 5rem; } 
 #greeting .p_wrap { font-size: 1.8rem; } 

 .deliver_wrap li { flex: 0 0 24%; padding: 2rem 0; } 
 #deliver .container { margin-bottom: 4rem; } 
 #deliver .container.contain2 .deliver_wrap:last-child { margin-top: 4rem; } 
 #location .loca_info li b { font-size: 2rem; } 
 #location .loca_info .address li { font-size: 2rem; } 

 .system_wrap .system_bg .img_box { padding: 2rem; } 
 #as .as_wrap { display: flex; align-items: stretch; } 
 #as .icon_box { width: 6rem; } 
 #as .as_wrap li { height: auto; padding: 3rem; } 
 #as .as_wrap li .box1 { right: 4rem; top: 3rem; } 
 #as .box2 h3 { padding-top: 3rem; padding-bottom: 4rem; } 

 .fac_box .right_box .list4 li { flex: 0 1 100%; } 
 .two_wrap .eq_arti .left_box h3 { font-size: 2.4rem; } 
 }

@media (max-width: 768px){
 .esg_ul2 .esg_box .img_box { width: 100%; margin-right: 4%; height: 40rem; overflow: hidden; } 
 .esg_ul2 .esg_box .img_box img { object-fit: cover; object-position: 50% 50%; height: 100%; } 
 .sub_com { padding: 0 0 6rem; } 
 .sub_visual_box { margin-bottom: 7rem; } 
 .pc_sub_menu .second_dep { height: 60px; width: 96%; } 
 .visual_menu_wrap { height: 6rem; bottom: 6rem; background: #cdcdcd33; } 
 .visual_menu_wrap .com_depth { top: 6rem; } 
 .sub_visual_txt h2 { padding-bottom: 1rem; font-size: 2.4rem; } 
 .depth_wrap { font-size:1.8rem; width: 94%; margin: 0 auto; } 
 /* LOCATION */
#location .loca_map iframe { height: 44vh; } 
 /* INQUIRY */
#inquiry2 .inquiry_wrap section h4 { min-width: auto; } 
 }

 @media (max-width: 630px){
 .depth_wrap > div { width: 50%; padding: 0 1.5rem; } 
 .depth_wrap .depth1.dep2_none { display: none; } 
 /* 문의하기 */
 #inquiry2 .inquiry_wrap section { width: 100%; } 
 #inquiry2 .inquiry_wrap section div.check_wrap { width: 100%; display: flex; justify-content: flex-start; flex-direction: column; align-items: flex-start; } 
 #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; } 
 }

@media (max-width: 480px){
 .frame1 .pipe_wrap.wrap2 .right_box { display: flex; flex-wrap: wrap; } 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li b { flex: 0 1 98px; } 
 .asia_box .deliver_wrap:nth-child(1) { width: 100%; margin-bottom: 3rem; } 
 .asia_box .deliver_wrap:nth-child(2) { width: 66%; } 
 #greeting .info_box { flex: 1 1 100%; } 
 #greeting .info_box h2 { margin-bottom: 2rem; } 
 #greeting .img_box { flex: 0 1 100%; position: absolute; bottom: 0; opacity: 0.5; } 
 #bo_cate ul.flex_20 > li { flex: 1 1 50%; } 
 .sub_tit { padding-bottom: 4rem; padding-top: 0; } 
 .container { margin-bottom: 4rem; } 
 .tit_box { padding-top: 1rem; padding-bottom: 3rem; } 
 .sub_visual_txt h2 { font-size: 2.2rem; padding-bottom: 0.5rem; } 
 .sub_visual_txt h1 { font-size: 3rem; } 
 .flex_4 > * { width: 48%; } 
 .flex_6 > * { width: 44%; margin-right: 4%; } 
 /* top_menu */
.visual_menu_wrap { height: 5rem; bottom: 5rem; } 
.visual_menu_wrap .com_depth { top: 5rem; } 
.visual_menu_wrap .com_depth li { width: 100%; } 
.depth_wrap > div.home_btn i { top: 48%; } 
.depth_wrap > div { font-size: 1.5rem; } 
.depth_wrap { width: 96%; } 
.depth_wrap > div.depth1 { width: 50%; } 
.depth_wrap > div.depth2 { width: 50%; padding-right: 0; flex-grow: 1; } 

/* sub_visual */
.sub_visual_box .info_box { height: 28rem; } 
 .sub_visual_txt { bottom: 3rem; } 

 /* HISTORY */
 #history article { padding: 6rem 0; } 
 .history_wrap>ul>li.right div { padding-left: 0; display: flex; flex-direction: column; } 
 .history_wrap>ul>li.right div ul { padding-left: 2rem; } 
 .history_wrap>ul>.right> div ul>li::after { top: 10px; width: 4px; height: 4px; left: -11px; } 
 .history_wrap>ul>li.right::after { width: 20px; left: 9px; } 
 #history .container .tit_wrap h1 { font-size: 2.4rem; } 
 #history .container .tit_wrap p { font-size: 1.8rem; } 
 #history .container .tit_wrap { margin-bottom: 6rem; } 
 .history_wrap>ul>li h4 { font-size: 3rem; } 
 .history_wide { padding-left: 2%; } 


 /* INQUIRY */
#inquiry .inquiry_wrap { width: 100%; } 
.inquiry_tbl_style1_flex { display: flex; } 
.tbl_style1_item { width: 100%; } 
.inquiry_tbl_style1_con .write_input { width: 100% } 
.editor textarea { font-size: 13px; } 
.btn_submit1 { width: 40%; font-size: 1.8rem; height: 5rem; } 
.write-tbl th, .write-tbl td { padding: 10px 2px 10px 0; min-width: 74px; word-break: keep-all; font-size: 13px; } 
.write-tbl td.flex_div_3 { display: flex; justify-content: space-between; width: 100%; align-items: center; } 
.inquiry_btn { margin-top: 20px; } 
.inquiry_btn input { font-size: 12px; width: 110px; height: 40px; } 
#inquiry .agree_txt { font-size: 13px; } 
 #greeting { padding-bottom: 14rem; } 
 #greeting .bg_box { height: 18rem; margin-bottom: 4rem; } 
 #greeting .bg_box p { width: 68%; text-align: center; } 
 #greeting:after { font-size: 5rem; bottom: 5%; line-height: 1; } 
 #greeting .p_wrap p:last-child { margin-top: 2rem; } 
 #location .loca_info li b { font-size: 1.8rem; flex: 1 0 auto; } 
 #location .loca_info .address li { font-size: 1.7rem; display: flex; flex-direction: column; text-align: left; padding-bottom: 1rem; } 
 .frame1 article { margin-bottom: 2rem; } 
 #bell .info_box h2 { margin-bottom: 5rem; } 
 #bell article h3 { font-size: 2rem !important; margin-bottom: 0; } 
 .frame1 article .sub_arti p br { display:none; } 
 .frame1 article .sub_arti2 h4 { margin-bottom: 0; } 
 .li_basic > * { font-size: 1.6rem; } 
 .li_basic.dot_list > li:before { top: 7px; left: 3px; } 
 .li_basic.hyp_list > li:before { top: 7px; } 
 #bell .bell_bg .p_wrap p { font-size: 1.8rem; } 
 .eu_box .deliver_wrap { flex: 1; } 
.frame1 .dot_list.list4 li::before { top: 12px; width: 4px; height: 4px; } 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li ul { padding: 0.5rem 2rem; } 
 .tab_list div { flex: 1 0 45%; margin-bottom: 1rem; height: 5rem; padding: 0; } 
 .tab_list { margin: 2rem auto 4rem; } 
 .frame1 .pipe_wrap.wrap2 .right_box .img_box { width: 100%; margin-bottom: 2rem; margin-right: 0; } 
 .esg_ul2 .esg_box .img_box { margin-right: 0; height: 32rem; } 
 .esg_ul2 .esg_box .info_box { flex: 1 0 100%; margin-top: 3rem; } 
 .esg_ul2 .esg_box.order .img_box { order: 0; margin-left: auto; margin-right: 0; } 
 #esg ul li .info_box h3 { font-size: 2rem; margin-top: 1rem; } 
 .two_wrap .eq_arti .left_box h3 { font-size: 2.2rem; } 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li b { padding-bottom: 0; } 
 .frame1 .eq_arti.arti2 .right_box .new_design .list3 > li { margin-bottom: 0; } 
 .pipe_img p { font-size: 1.7rem; } 
 .pipe_img > div { flex: 1 0 100%; margin-bottom: 3rem; } 
 .pipe_img > div:last-child { margin-bottom: 0; } 
 #esg ul { display: flex; flex-wrap: wrap; } 
 #esg ul.esg_ul li { width: 70%; margin-bottom: 3rem; } 
 #esg ul.esg_ul li:last-child { margin-bottom: 0; } 
 .esg_ul2 { margin-top: 8rem; } 
 .esg_ul2 .esg_box.order { margin: 8rem 0; } 
 .eu_box .deliver_wrap:nth-child(1) { flex: 0 1 calc(100% / 3 *2); margin-bottom: 3rem; } 
 .eu_box .deliver_wrap:nth-child(2) { flex: 0 1 100%; } 
 #deliver .container.contain2 .deliver_wrap:last-child { margin-top: 3rem; } 
 .deliver_wrap li { flex: 0 0 32%; } 
 .deliver_wrap .info_box h4 { font-size: 2.2rem; } 
 }