/** 회사소개 - CEO 인사말 **/
.greeting.container {padding-bottom: 0;}
.greeting .sec3 {background: url('../images/greeting_bg.jpg') no-repeat center / cover; margin-left: 160px; height: 640px; padding: 100px 320px; position: relative;}
.greeting .sec3 .left {padding-right: 200px;}
.greeting .sec3 .left .f60 {color:#fff; text-shadow: 0px 2px 4px rgb(0 0 0 / 20%);}
.greeting .sec3 .left .f60 span {display: block;}
.greeting .sec3 .left .signature {display: flex; align-items: center; justify-content: flex-end; margin-top: 70px; margin-right: 100px;}
.greeting .sec3 .left .signature .text {text-shadow: 0px 2px 4px rgb(0 0 0 / 20%);}
.greeting .sec3 .left .signature .text .f20 {color:#fff; margin-bottom: 10px;}
.greeting .sec3 .left .signature .text .f32 {color:#fff;}
.greeting .sec3 .left .signature .sign {}
.greeting .sec3 .right {position: absolute; bottom: 140px; right: 200px;}
.greeting .sec3 .right img {max-width: 562px;}
.greeting .sec4 .txt_box {background: #fff; margin-left: 25%; position: relative; top: -140px; padding: 100px 100px 0;}
.greeting .sec4 .txt_box .inner {max-width: 900px;}
.greeting .sec4 .txt_box .f20 {line-height: 36px; color:#555; margin-bottom: 40px; font-weight: 400;}
.greeting .sec4 .txt_box .f20 strong {font-weight: 600;}


/** 회사소개 - 연혁 **/
.history.container {overflow: initial;}
.history .sec3 .history_wrap {display: flex; margin-bottom: 95px;}
.history .sec3 .history_wrap:last-child {margin-bottom: 0;}
.history .sec3 .left {width: 45%;  position: relative;}
.history .sec3 .left .title_box {display: inline-block; position: sticky; top: 150px; margin-bottom: 150px;}
.history .sec3 .left .f110.gradient {display: inline-block; background: linear-gradient(to right, #a39d97, #c7c2bd 30%, #a39d97); color: transparent; -webkit-text-fill-color: transparent; -webkit-background-clip: text; width: 100%;}
.history .sec3 .left .f40 {color:#d4d1cf; letter-spacing: 7px; margin-top: 20px;}
.history .sec3 .right {width: 55%; border-top: 2px solid #e6e6e6; padding-top: 80px;}
.history .sec3 .right .box {margin-bottom: 70px;}
.history .sec3 .right .box:last-child {margin-bottom: 0;}
.history .sec3 .right .box .f44 {}
.history .sec3 .right .box ul {margin-top: 22px;}
.history .sec3 .right .box ul li {color:#555; margin-bottom: 10px; padding-left: 12px; position: relative;}
.history .sec3 .right .box ul li:last-child {margin-bottom: 0;}
.history .sec3 .right .box ul li::before {content: ''; display: inline-block; width: 4px; height: 4px; background:#ccc; vertical-align: top; margin-top: 13px; position: absolute; left: 0;}
.history .sec3 .right .box .box_img {border: 10px solid #ebebeb; display: inline-block; margin-top: 10px;}
.history .sec3 .right .box .box_img.first {margin-top: 32px;}
.history .sec3 .right .box .box_img img {max-width: 420px;}


/** 회사소개 - 사업장 소개 **/
.workplace {}
.workplace .sec3, .workplace .sec4 {margin-bottom: 200px;}
.workplace .workplace_wrap .map {position: relative; display: flex;}
.workplace .workplace_wrap .map iframe {width: 100%; height: 600px;}
.workplace .workplace_wrap .map .map_title {background: #fff; width: 100%; max-width: 580px; height: 110px; border-right: 20px solid #a39d97; position: absolute; bottom: 0; left: 0; display: flex; align-items: flex-end;}
.workplace .workplace_wrap .map .map_title .f48 {padding: 0 50px; position: relative; bottom: -10px;}
.workplace .workplace_wrap .map_info_txt {display: flex; justify-content: space-between; margin-top: 60px;}
.workplace .workplace_wrap .map_info_txt .left {padding: 20px 50px 0; width: 60%;}
.workplace .workplace_wrap .map_info_txt .left ul {}
.workplace .workplace_wrap .map_info_txt .left ul li {margin-bottom: 15px;}
.workplace .workplace_wrap .map_info_txt .left ul li:last-child {margin-bottom: 0;}
.workplace .workplace_wrap .map_info_txt .left ul li span.f20 {color:#666; font-weight: 400;}
.workplace .workplace_wrap .map_info_txt .left ul li span.f20.title {color:#222; font-weight: 600; margin-right: 30px;}
.workplace .workplace_wrap .map_info_txt .left ul.detail1 {border-bottom: 1px solid #e6e6e6; padding-bottom: 30px;}
.workplace .workplace_wrap .map_info_txt .left ul.detail1 li {display: inline-block;}
.workplace .workplace_wrap .map_info_txt .left ul.detail1 li:nth-child(1) {display: block;}
.workplace .workplace_wrap .map_info_txt .left ul.detail1 li:nth-child(2) {margin-right: 45px;}
.workplace .workplace_wrap .map_info_txt .left ul.detail2 {padding: 45px 0;}
.workplace .workplace_wrap .map_info_txt .left ul.detail3 {display: flex; flex-flow: wrap; align-items: flex-start;}
.workplace .workplace_wrap .map_info_txt .left ul.detail3 li {flex: 1 1 50%; display: flex; align-items: center;}
.workplace .workplace_wrap .map_info_txt .left ul.detail3 li span.f20.title {background: #f9f9f9; border-radius: 50px; font-weight: 400; width: 85px; height: 48px; display: flex; justify-content: center; align-items: center; margin-right: 25px;}
.workplace .workplace_wrap .map_info_txt .right {width: 40%;}
.workplace .workplace_wrap .map_info_txt .right .image100 {justify-content: flex-end;}
.workplace .workplace_wrap .map_info_txt .right .image100 img {max-width: 510px;}


/** 회사소개 - 사원갤러리 - list **/
.gallery_list .list_wrap {display: flex; flex-flow: wrap; margin-top: 60px;}
.gallery_list .list_wrap .item {flex: 0 1 calc(33.3% - 27px); width: calc(33.3% - 27px); margin: 0 20px 140px; position: relative;}
.gallery_list .list_wrap .item:nth-child(3n) {margin-right: 0;}
.gallery_list .list_wrap .item:nth-child(3n - 2) {margin-left: 0;}
.gallery_list .list_wrap .item .thum {overflow: hidden; position: relative; cursor: pointer; border: 1px solid rgb(0 0 0 / 7%);}
.gallery_list .list_wrap .item .txt {margin-top: 50px;}
.gallery_list .list_wrap .item .txt .f26 {color:#222; display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gallery_list .list_wrap .item .txt .f20 {color:#888; font-weight: 400; margin-top: 20px; width :100%; overflow: hidden; text-overflow: ellipsis; white-space: normal; height: 62px; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.gallery_list .list_wrap .item .txt .f16 {color:#bbb; margin-top: 35px;}


/** BOARD - view **/
.board_detail {}
.board_detail .bd_title {border-top: 1px solid #222; border-bottom: 1px solid #e6e6e6; padding: 40px 0 ;}
.board_detail .bd_title .f28 {font-weight: 700; display: inline-block; margin-bottom: 10px;}
.board_detail .bd_title ul {display: flex;}
.board_detail .bd_title ul li {margin-right: 40px;}
.board_detail .bd_title ul li:last-child {margin-right: 0;}
.board_detail .bd_title ul li .f18 {color:#aaa; font-weight: 400;}
.board_detail .bd_title ul li .f18.title {color:#666; margin-right: 15px; font-weight: 500;}
.board_detail .attached_file {}
.board_detail .attached_file .file_box {display: flex; align-items: flex-start; background: #f9f9f9; border-bottom: 1px solid #e6e6e6; padding: 32px 40px;}
.board_detail .attached_file .file_box .icon {margin-top: 7px; margin-right: 20px;}
.board_detail .attached_file .file_box .icon img {width: 15px;}
.board_detail .attached_file .file_box .f18 {color:#666; font-weight: 400;}
.board_detail .attached_file .file_box .f18:hover {color:#000;}
.board_detail .bd_con {padding: 75px 0; border-bottom: 1px solid #e6e6e6;} 
.board_detail .bd_con .txt_box {}
.board_detail .bd_con .txt_box .f20 {color:#666; font-weight: 400; margin-bottom: 30px;} 
.board_detail .bd_con .txt_box .f20:last-child {margin-bottom: 0;}
.board_detail .bd_con .bd_img {text-align: center; margin: 60px 0;}
.board_detail .list_btn {display: flex; justify-content: flex-end; margin-top: 40px;}
.board_detail .list_btn .f24 {background: #333;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 400;
    width: 100%;
    max-width: 200px;
    height: 50px;
    transition: all 0.3s;
    margin-left: 10px;
    font-size: 18px;}
.board_detail .list_btn .f24:hover {background: #112e57; transition: all 0.3s;}

.list_btn2{display: flex; justify-content: flex-end; margin-top: 40px;}
.list_btn2 .f24 {background: #333;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 400;
    width: 100%;
    max-width: 200px;
    height: 50px;
    transition: all 0.3s;
    margin-left: 10px;
    font-size: 18px;}
.list_btn2 .f24:hover {background: #112e57; transition: all 0.3s;}

/** 제품안내 **/
.container.product {padding-bottom: 0;}
.product .sec5 {position: relative; background: #f8f8f8; width: 100%; padding: 120px 0;}
.product .tab {display: flex; justify-content: center; margin-bottom: 100px;}
.product .tab li a {width: 280px; height: 75px; display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #ddd;}
.product .tab li a.f24 {font-weight: 500;}
.product .tab li a.f24:hover {border: 1px solid #333; font-weight: 700;}
.product .tab li a.f24.active {background: #333; border: 1px solid #333; color:#fff;}
.product .tab li a.f24.active:hover {font-weight: 500;}
.product .sec4 {text-align: center; margin-bottom: 120px; }
.product .sec4 .f44 {font-weight: 500;}
.product .sec4 .f20 {color:#a39d97; margin-top: 10px;}
.product .sec4 .f18 {color:#666; margin-top: 60px;}
.product .product_img {width: 1400px; height: 840px; display: flex; margin: 0 auto; position: relative;}
.product .item_wrap .item {position: absolute;cursor: pointer;text-align: center;}
.product .item_wrap .item .marker {border-radius: 50%; position: relative;}
.product .item_wrap .item .marker span {display: inline-block; width: 10px; height: 10px;  background: #fff; border-radius: 50%; z-index: 2; position: relative;}
.product .item_wrap .item .marker:before,
.product .item_wrap .item .marker:after{display: block;content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%; background:#1b42e8; opacity:0; transition:0.3s;  z-index: 1;}
.product .item_wrap .item .marker:before{animation:motion 3s ease-in infinite 0s;}
.product .item_wrap .item .marker:after{animation:motion 3s ease-in infinite 1s;}

.product .item_wrap .item .marker:hover:before,
.product .item_wrap .item .marker:hover:after{background:#10d2e6;}
@keyframes motion{
	0%{
		opacity:0.1;
		width:10px;height:10px;
	}
	50%{
		opacity:0.9;
	}
	100%{
		opacity:0;
		width:70px;height:70px;
	}
}
.product .item_wrap .item .line_wrap {position: absolute;}
.product .item_wrap .item .line_wrap .pointer {width: 6px; height: 6px; background: #1b42e8; border-radius: 50%; position: absolute; opacity: 0; transition: all 0.3s; display: none;}
.product .item_wrap .item.on .line_wrap .pointer {opacity: 1; display: inline-block; transition: all 0.3s;}
.product .sec_box_wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 1920px;  padding: 0 16px; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.product .sec_box_wrap .box {position: absolute; width: 0; background: #fff; text-align: center; box-shadow: 2px 5px 20px rgb(0 0 0 / 3%); opacity: 0; cursor: pointer; z-index: 2; transition: all 0.5s; transition-delay: 0.3s;}
.product .sec_box_wrap .box.on {opacity: 1; width: 320px; transition: all 0.5s;}
.product .sec_box_wrap .box .pd_box_img {padding: 0; display: flex; justify-content: center; transition: all 0.3s; transition-delay: 1s;}
.product .sec_box_wrap .box.on .pd_box_img {padding: 20px; transition: all 0.3s;}
.product .sec_box_wrap .box .pd_box_img img {width: 0; height: 180px; max-width: 260px; opacity: 0; transition: all 0.6s; transition-delay: 0.6s;}
.product .sec_box_wrap .box.on .pd_box_img img {width: 100%; ; opacity: 1; transition: all 0.1s; transition-delay: 0.1s;}
.product .sec_box_wrap .box .info_txt {border-top: 1px solid #ebebeb; border-left: 5px solid #a39d97; padding: 0; text-align: left; position: relative; width: 0; transition: all 0.3s; transition-delay: 2s; width: 0;}
.product .sec_box_wrap .box.on .info_txt {padding: 20px 25px; width: 100%; transition: all 0.3s; width: 100%;}
.product .sec_box_wrap .box .info_txt .txt .f14 {color:#a39d97; width: 0; overflow: hidden;transition: all 0.3s; white-space: nowrap;}
.product .sec_box_wrap .box.on .info_txt .txt .f14 {width: 100%; transition: all 0.3s;}
.product .sec_box_wrap .box .info_txt .txt .f18 {color:#333; font-weight: 700; white-space:nowrap; width: 0; overflow: hidden; transition: all 0.3s;}
.product .sec_box_wrap .box.on .info_txt .txt .f18 {width: 100%; transition: all 0.3s;}
.product .sec_box_wrap .box .info_txt .more_btn {background: #222; position: absolute; right: 0; top: 0; width: 0; height: 100%; display: flex; justify-content: center; align-items: center; cursor: pointer; opacity: 0; transition: all 0.3s;}
.product .sec_box_wrap .box .info_txt .more_btn span {display: inline-block; width: 2px; height: 10px; background: #fff; position: relative;}
.product .sec_box_wrap .box .info_txt .more_btn span:after {content: ''; display: inline-block; width: 10px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.product .sec_box_wrap .box.on .info_txt .more_btn {right: -40px; opacity: 1; transition: all 0.8s; transition-delay: 0.5s; width: 40px;}
.product .product_popup_wrap {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; background: rgba(0,0,0,0.5); display: none;}
.product .product_popup_wrap.on {display: inline-block;}
.product .product_popup_wrap .pop_box {width: calc(100% - 40px); max-width: 1500px; height: 850px; background: #fff; position: relative; top: 50%; left: calc(50% - 20px); transform: translate(-50%, -50%); margin: 0 20px; display: none;}
.product .product_popup_wrap .pop_box.on {display: flex; }
.product .pop_box .left {display: flex; flex-flow: column; height: 100%; background: #a09a94;}
.product .pop_box .left .box {display: flex; justify-content: center; width: 80px;}
.product .pop_box .left .top {background: #88827d; height: 290px; align-items: flex-start;}
.product .pop_box .left .bottom {align-items: flex-end; height: calc(100% - 290px);}
.product .pop_box .left .txt {transform: rotate(-90deg); position: relative; letter-spacing: 3px;}
.product .pop_box .left .top .f24 {color:#fff; white-space:nowrap; top: 70px;}
.product .pop_box .left .bottom .f24 {color:#b5b1ad; white-space:nowrap; bottom: 180px;}

.product.ev .pop_box .left .top .f24 {top: 55px;}
.product.engine .pop_box .left .top .f24 {top: 60px;}
.product.etc .pop_box .left .top .f24 {top: 60px;}
.product .pop_box .right {width: calc(100% - 80px);}
.product .pop_box .right .title {height: 90px; width: 100%; border-bottom: 1px solid #e6e6e6; display: flex; justify-content: space-between; align-items: center; padding: 0 45px;}
.product .pop_box .right .m_title {text-align: center; margin: 60px 0 0; display: none;}
.product .pop_box .right .m_title .f16 {color:#888;}
.product .pop_box .right .title .pc {display: inline-block;}
.product .pop_box .right .title .m {display: none;}
.product .pop_box .right .title .close_btn {cursor: pointer;}
.product .pop_box .right .title .close_btn::after {content: "\00d7"; display: inline-block; font-size: 70px; color: #444;}
.product .pop_box .right .pop_con_wrap {display: flex; height: calc(100% - 91px);}
.product .pop_box .right .pop_con_wrap .left_con {width: 46%; border-right: 1px solid #e6e6e6; padding: 0 40px; }
.product .pop_box .right .pop_con_wrap .left_con .product_pop_slide  {display: flex; align-items: center; justify-content: center;}
.product .pop_box .right .pop_con_wrap .left_con .pop_con .view_img {display: flex; justify-content: center;}
.product .pop_box .right .pop_con_wrap .left_con .pop_con .view_img img {max-width: 400px;}
.product .pop_box .right .pop_con_wrap .left_con .product_pop_swiper {display: flex; flex-flow: column; height: 100%;}
.product .pop_box .right .pop_con_wrap .left_con .controller {position: relative; left: 50%; transform: translate(-50%); z-index: 1; width: 100%; padding: 0 0 80px;}
.product .pop_box .right .pop_con_wrap .left_con .swiper-pagination {position: static;}
.product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet {border: 2px solid #fff; width: 120px; height: 120px; border-radius: 0; overflow: hidden; box-sizing: border-box; background: transparent; opacity: 1;}
.product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet:hover {border: 2px solid #a09a94; opacity: 1;}
.product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet-active {border: 2px solid #a09a94;}
.product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet img {width: 120px; height: 120px;}
.product .pop_box .right .pop_con_wrap .left_con .slide_arrow:after {color: #999; font-size: 12px; font-weight: 900;}
.product .pop_box .right .pop_con_wrap .left_con .slide_arrow {border: 1px solid rgb(0 0 0 / 10%); width: 50px; height: 50px; border-radius: 50%;}
.product .pop_box .right .pop_con_wrap .left_con .slide_arrow:hover {border: 1px solid rgb(0 0 0 / 30%);}
.product .pop_box .right .pop_con_wrap .left_con .slide_arrow:hover:after {color:#000;} 
.product .pop_box .right .pop_con_wrap .right_con {display: flex; flex-flow: column; height: 100%; overflow-y: auto; width: 54%;}
.product .pop_box .right_con .con_box {padding: 60px 50px; border-bottom: 1px solid #e6e6e6;}
.product .pop_box .right_con .con_box:last-child {border: none;}
.product .pop_box .right_con .con_box .con_title {position: relative; padding-left: 22px; color:#7b6e61; font-weight: 600; margin-bottom: 25px;}
.product .pop_box .right_con .con_box .con_title::before {content: ''; display: inline-block; background: #a39d97; width: 4px; height: 18px; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.product .pop_box .right_con .con_box .f18 {color:#555;}
.product .pop_box .right_con .con_box .advantage {display: flex; flex-flow:wrap;}
.product .pop_box .right_con .con_box .advantage li {display: flex; align-items: center; border: 2px solid #eee; height: 125px; padding: 0 30px; margin: 0 7px 15px; flex: 0 1 calc(50% - 7px);}
.product .pop_box .right_con .con_box .advantage li:nth-child(odd) {margin-left: 0;}
.product .pop_box .right_con .con_box .advantage li:nth-child(even) {margin-right: 0;}
.product .pop_box .right_con .con_box .advantage li:nth-last-child(-n+2) {margin-bottom: 0;}
.product .pop_box .right_con .con_box .advantage li .icon {flex-shrink: 0;}
.product .pop_box .right_con .con_box .advantage li .icon img {max-width: 50px;}
.product .pop_box .right_con .con_box .advantage li .f18 {color:#555; margin-left: 25px; line-height: 21px;}


/********** EV 파트 **********/
.ev .product_img.product_img1 {background: url('../images/product_img1.jpg') no-repeat center / cover;}
.ev .item_wrap .item1 {bottom: 400px; left: 360px;}
.ev .item_wrap .item2 {bottom: 380px; left: 515px;}
.ev .item_wrap .item3 {bottom: 355px; left: 715px;}
.ev .item_wrap .item4 {bottom: 325px; left: 380px;}
.ev .item_wrap .item5 {bottom: 300px; left: 460px;}
.ev .sec_box_wrap .box.box1 {top: 90px; left: 90px;}
.ev .sec_box_wrap .box.box2 {top: 90px; right: 90px;}
.ev .sec_box_wrap .box.box3 {bottom: 90px; left: 90px;}
.ev .sec_box_wrap .box.box4 {bottom: 90px; right: 500px;}
.ev .sec_box_wrap .box.box5 {bottom: 90px; right: 90px;}
.ev .item_wrap .item.item1 .line_wrap {right: 4px; bottom: 40px;}
.ev .item_wrap .item.item1 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.ev .item_wrap .item.item1 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s;}
.ev .item_wrap .item.item1.on .line_wrap .line1 {height: 160px; transition: all 0.3s; opacity: 1;}
.ev .item_wrap .item.item1.on .line_wrap .line2 {width: 162px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.ev .item_wrap .item.item1.on .line_wrap .pointer {bottom: 0; right: -2px; }
.ev .item_wrap .item.item2 .line_wrap {right: 4px; bottom: 40px;}
.ev .item_wrap .item.item2 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.ev .item_wrap .item.item2 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s;}
.ev .item_wrap .item.item2.on .line_wrap .line1 {height: 180px; transition: all 0.3s; opacity: 1;}
.ev .item_wrap .item.item2.on .line_wrap .line2 {width: 720px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.ev .item_wrap .item.item2.on .line_wrap .pointer {bottom: 0; right: -2px;}
.ev .item_wrap .item.item3 .line_wrap {right: 40px; top: 8px;}
.ev .item_wrap .item.item3 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s; transition-delay: 0.6s;}
.ev .item_wrap .item.item3 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.2s;}
.ev .item_wrap .item.item3 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 348px; right: 80px;  opacity: 0; transition: all 0.3s;}
.ev .item_wrap .item.item3.on .line_wrap .line1 {width: 80px; transition: all 0.3s; opacity: 1;}
.ev .item_wrap .item.item3.on .line_wrap .line2 {height: 350px; transition: all 0.6s; opacity: 1; transition-delay: 0.2s;}
.ev .item_wrap .item.item3.on .line_wrap .line3 {width: 400px; transition: all 0.9s; opacity: 1; transition-delay: 0.7s}
.ev .item_wrap .item.item3.on .line_wrap .pointer {top: -2px; right: 0;}
.ev .item_wrap .item.item4 .line_wrap {right: 4px; top: 40px;}
.ev .item_wrap .item.item4 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.ev .item_wrap .item.item4 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; bottom: 0; left: 0; opacity: 0; transition: all 0.3s;}
.ev .item_wrap .item.item4.on .line_wrap .line1 {height: 220px; transition: all 0.3s; opacity: 1;}
.ev .item_wrap .item.item4.on .line_wrap .line2 {width: 440px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.ev .item_wrap .item.item4.on .line_wrap .pointer {top: 0; right: -2px;}
.ev .item_wrap .item.item5 .line_wrap {left: 40px; top: 8px;}
.ev .item_wrap .item.item5 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.9s;}
.ev .item_wrap .item.item5 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; bottom: 0; right: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.6s;}
.ev .item_wrap .item.item5 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; bottom: 78px; left: 280px; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.ev .item_wrap .item.item5 .line_wrap .line4 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: -78px; left: 880px; opacity: 0; transition: all 0.3s;}
.ev .item_wrap .item.item5.on .line_wrap .line1 {width: 280px; transition: all 0.3s; opacity: 1;}
.ev .item_wrap .item.item5.on .line_wrap .line2 {height: 80px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.ev .item_wrap .item.item5.on .line_wrap .line3 {width: 600px; transition: all 0.3s; opacity: 1; transition-delay: 0.6s;}
.ev .item_wrap .item.item5.on .line_wrap .line4 {height: 90px; transition: all 0.3s; opacity: 1; transition-delay: 0.9s;}
.ev .item_wrap .item.item5.on .line_wrap .pointer {top: -2px; left: 0;}
/* EV 파트 - TEST*/
.test_ev .test_sec {margin-bottom: 130px;}
.test_ev .test_sec .box_wrap {display: flex; flex-wrap: wrap;}
.test_ev .test_sec .box_wrap .box {border: 1px solid #ebebeb; padding: 30px 35px; flex: 0 1 calc(33.3% - 20px); position: relative; height: 280px; display: flex; flex-flow: column; justify-content: space-between; cursor: pointer; margin: 0 15px 30px;}
.test_ev .test_sec .box_wrap .box:nth-child(3n) {margin-right: 0;}
.test_ev .test_sec .box_wrap .box:nth-child(3n -2) {margin-left: 0;}
.test_ev .test_sec .box_wrap .box:nth-last-child(-n + 3) {margin-bottom: 0;}
.test_ev .test_sec .box_wrap .box .txt {}
.test_ev .test_sec .box_wrap .box .txt .f14 {color:#a39d97;}
.test_ev .test_sec .box_wrap .box .txt .f20 {color:#333; font-weight: 700;}
.test_ev .test_sec .box_wrap .box .btn {background: #f7f7f7; width: 60px; height: 60px; display: flex; justify-content: center; align-items: center;}
.test_ev .test_sec .box_wrap .box .btn .square {background: #ccc; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border: 1px solid #f2f2f2;}
.test_ev .test_sec .box_wrap .box:hover .btn .square {background: #a39d97;}
.test_ev .test_sec .box_wrap .box .btn .square span {display: inline-block; height: 2px; width: 10px; position: relative; background: #fff;}
.test_ev .test_sec .box_wrap .box .btn .square span::after {content: ''; display: inline-block; width: 2px; height: 10px; background: #fff; position: absolute; top: -4px; left: 4px;}
.test_ev .test_sec .box_wrap .box .img {position: absolute; right: 0; bottom: 0; z-index: -1;}
.test_ev .test_sec .box_wrap .box .img img {width: 100%; max-width: 260px;}
/* EV 파트 - TEST*/
/********** EV 파트 **********/


/********** 경량화부품 **********/
.lightweight .product_img.product_img1 {background: url('../images/product_img2.jpg') no-repeat center / cover;}
.lightweight .item_wrap .item1 {bottom: 480px; left: 270px;}
.lightweight .item_wrap .item2 {bottom: 470px; left: 1100px;}
.lightweight .item_wrap .item3 {bottom: 303px; left: 700px;}
.lightweight .item_wrap .item4 {bottom: 460px; left: 810px;}
.lightweight .item_wrap .item5 {bottom: 550px; left: 1020px;}
.lightweight .sec_box_wrap .box.box1 {top: 90px; left: 90px;}
.lightweight .sec_box_wrap .box.box2 {top: 90px; right: 90px;}
.lightweight .sec_box_wrap .box.box3 {bottom: 90px; left: 90px;}
.lightweight .sec_box_wrap .box.box4 {bottom: 90px; right: 500px;}
.lightweight .sec_box_wrap .box.box5 {bottom: 90px; right: 90px;}
.lightweight .item_wrap .item.item1 .line_wrap {right: 4px; bottom: 40px;}
.lightweight .item_wrap .item.item1 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item1 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s;}
.lightweight .item_wrap .item.item1.on .line_wrap .line1 {height: 80px; transition: all 0.3s; opacity: 1;}
.lightweight .item_wrap .item.item1.on .line_wrap .line2 {width: 75px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item1.on .line_wrap .pointer {bottom: 0; right: -2px; }
.lightweight .item_wrap .item.item2 .line_wrap {right: 4px; bottom: 40px;}
.lightweight .item_wrap .item.item2 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item2 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s;}
.lightweight .item_wrap .item.item2.on .line_wrap .line1 {height: 90px; transition: all 0.3s; opacity: 1;}
.lightweight .item_wrap .item.item2.on .line_wrap .line2 {width: 135px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item2.on .line_wrap .pointer {bottom: 0; right: -2px;}
.lightweight .item_wrap .item.item3 .line_wrap {right: 40px; top: 8px;}
.lightweight .item_wrap .item.item3 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s; transition-delay: 0.6s;}
.lightweight .item_wrap .item.item3 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.2s;}
.lightweight .item_wrap .item.item3 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 298px; right: 80px;  opacity: 0; transition: all 0.3s;}
.lightweight .item_wrap .item.item3.on .line_wrap .line1 {width: 80px; transition: all 0.3s; opacity: 1;}
.lightweight .item_wrap .item.item3.on .line_wrap .line2 {height: 300px; transition: all 0.6s; opacity: 1; transition-delay: 0.2s;}
.lightweight .item_wrap .item.item3.on .line_wrap .line3 {width: 390px; transition: all 0.9s; opacity: 1; transition-delay: 0.7s}
.lightweight .item_wrap .item.item3.on .line_wrap .pointer {top: -2px; right: 0;}
.lightweight .item_wrap .item.item4 .line_wrap {top: 4px; left: 40px;}
.lightweight .item_wrap .item.item4 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item4 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s;}
.lightweight .item_wrap .item.item4.on .line_wrap .line1 {width: 150px; transition: all 0.3s; opacity: 1;}
.lightweight .item_wrap .item.item4.on .line_wrap .line2 {height: 180px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item4.on .line_wrap .pointer {top: -2px; left: 0;}
.lightweight .item_wrap .item.item5 .line_wrap {top: 40px; left: 8px;}
.lightweight .item_wrap .item.item5 .line_wrap .line1 {height: 0; width: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.9s;}
.lightweight .item_wrap .item.item5 .line_wrap .line2 {height: 2px; width: 0; background: #1b42e8; position: absolute; bottom: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.6s;}
.lightweight .item_wrap .item.item5 .line_wrap .line3 {height: 0; width: 2px; background: #1b42e8; position: absolute; top: 140px; left: 378px; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item5.on .line_wrap .line1 {height: 140px; transition: all 0.3s; opacity: 1;}
.lightweight .item_wrap .item.item5.on .line_wrap .line2 {width: 380px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.lightweight .item_wrap .item.item5.on .line_wrap .line3 {height: 95px; transition: all 0.3s; opacity: 1; transition-delay: 0.6s;}
.lightweight .item_wrap .item.item5.on .line_wrap .pointer {top: 0; left: -2px;}
/********** 경량화부품 **********/

/********** ENGINE 파트 **********/
.engine .product_img.product_img1 {background: url('../images/product_img3.jpg') no-repeat center / cover;}
.engine .item_wrap .item1 {bottom: 646px; left: 452px;}
.engine .item_wrap .item2 {bottom: 573px; left: 975px;}
.engine .item_wrap .item3 {bottom: 441px; left: 724px;}
.engine .item_wrap .item4 {bottom: 500px; left: 972px;}
.engine .item_wrap .item5 {bottom: 557px; left: 898px;}
.engine .sec_box_wrap .box.box1 {top: 90px; left: 90px;}
.engine .sec_box_wrap .box.box2 {top: 90px; right: 90px;}
.engine .sec_box_wrap .box.box3 {bottom: 90px; left: 90px;}
.engine .sec_box_wrap .box.box4 {bottom: 90px; right: 500px;}
.engine .sec_box_wrap .box.box5 {bottom: 90px; right: 90px;}
.engine .item_wrap .item.item1 .line_wrap {right: 4px; top: 40px;}
.engine .item_wrap .item.item1 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.engine .item_wrap .item.item1 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; bottom: 0; right: 0; opacity: 0; transition: all 0.3s;}
.engine .item_wrap .item.item1.on .line_wrap .line1 {height: 30px; transition: all 0.3s; opacity: 1;}
.engine .item_wrap .item.item1.on .line_wrap .line2 {width: 255px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.engine .item_wrap .item.item1.on .line_wrap .pointer {top: 0; right: -2px; }
.engine .item_wrap .item.item2 .line_wrap {right: 4px; bottom: 40px;}
.engine .item_wrap .item.item2 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.engine .item_wrap .item.item2 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s;}
.engine .item_wrap .item.item2.on .line_wrap .line1 {height: 30px; transition: all 0.3s; opacity: 1;}
.engine .item_wrap .item.item2.on .line_wrap .line2 {width: 250px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.engine .item_wrap .item.item2.on .line_wrap .pointer {bottom: 0; right: -2px;}
.engine .item_wrap .item.item3 .line_wrap {right: 40px; top: 8px;}
.engine .item_wrap .item.item3 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s; transition-delay: 0.6s;}
.engine .item_wrap .item.item3 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.2s;}
.engine .item_wrap .item.item3 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 428px; right: 80px;  opacity: 0; transition: all 0.3s;}
.engine .item_wrap .item.item3.on .line_wrap .line1 {width: 80px; transition: all 0.3s; opacity: 1;}
.engine .item_wrap .item.item3.on .line_wrap .line2 {height: 430px; transition: all 0.6s; opacity: 1; transition-delay: 0.2s;}
.engine .item_wrap .item.item3.on .line_wrap .line3 {width: 410px; transition: all 0.9s; opacity: 1; transition-delay: 0.7s}
.engine .item_wrap .item.item3.on .line_wrap .pointer {top: -2px; right: 0;}
.engine .item_wrap .item.item4 .line_wrap {top: 4px; right: 40px;}
.engine .item_wrap .item.item4 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.engine .item_wrap .item.item4 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s;}
.engine .item_wrap .item.item4.on .line_wrap .line1 {width: 50px; transition: all 0.3s; opacity: 1;}
.engine .item_wrap .item.item4.on .line_wrap .line2 {height: 220px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.engine .item_wrap .item.item4.on .line_wrap .pointer {top: -2px; right: 0;}
.engine .item_wrap .item.item5 .line_wrap {top: 40px; left: 4px;}
.engine .item_wrap .item.item5 .line_wrap .line1 {height: 0; width: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.9s;}
.engine .item_wrap .item.item5 .line_wrap .line2 {height: 2px; width: 0; background: #1b42e8; position: absolute; bottom: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.6s;}
.engine .item_wrap .item.item5 .line_wrap .line3 {height: 0; width: 2px; background: #1b42e8; position: absolute; top: 140px; left: 478px; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.engine .item_wrap .item.item5.on .line_wrap .line1 {height: 140px; transition: all 0.3s; opacity: 1;}
.engine .item_wrap .item.item5.on .line_wrap .line2 {width: 480px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.engine .item_wrap .item.item5.on .line_wrap .line3 {height: 95px; transition: all 0.3s; opacity: 1; transition-delay: 0.6s;}
.engine .item_wrap .item.item5.on .line_wrap .pointer {top: 0; left: -2px;}
/********** ENGINE 파트 **********/

/********** 기타 파트 **********/
.etc .product_img.product_img1 {background: url('../images/product_img4.jpg') no-repeat center / cover;}
.etc .item_wrap .item1 {bottom: 480px; left: 385px;}
.etc .item_wrap .item2 {bottom: 740px; left: 960px;}
.etc .item_wrap .item3 {bottom: 390px; left: 518px;}
.etc .item_wrap .item4 {bottom: 530px; left: 910px;}
.etc .item_wrap .item5 {bottom: 624px; left: 860px;}
.etc .sec_box_wrap .box.box1 {top: 90px; left: 90px;}
.etc .sec_box_wrap .box.box2 {top: 90px; right: 90px;}
.etc .sec_box_wrap .box.box3 {bottom: 90px; left: 90px;}
.etc .sec_box_wrap .box.box4 {bottom: 90px; right: 500px;}
.etc .sec_box_wrap .box.box5 {bottom: 90px; right: 90px;}
.etc .item_wrap .item.item1 .line_wrap {right: 4px; bottom: 40px;}
.etc .item_wrap .item.item1 .line_wrap .line1 {width: 2px; height: 0; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.etc .item_wrap .item.item1 .line_wrap .line2 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s;}
.etc .item_wrap .item.item1.on .line_wrap .line1 {height: 85px; transition: all 0.3s; opacity: 1;}
.etc .item_wrap .item.item1.on .line_wrap .line2 {width: 190px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.etc .item_wrap .item.item1.on .line_wrap .pointer {bottom: 0; right: -2px; }
.etc .item_wrap .item.item2 .line_wrap {left: 40px; top: 8px;}
.etc .item_wrap .item.item2 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s; transition-delay: 0.6s;}
.etc .item_wrap .item.item2 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.2s;}
.etc .item_wrap .item.item2 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 148px; left: 30px;  opacity: 0; transition: all 0.3s;}
.etc .item_wrap .item.item2.on .line_wrap .line1 {width: 30px; transition: all 0.3s; opacity: 1;}
.etc .item_wrap .item.item2.on .line_wrap .line2 {height: 150px; transition: all 0.6s; opacity: 1; transition-delay: 0.2s;}
.etc .item_wrap .item.item2.on .line_wrap .line3 {width: 210px; transition: all 0.9s; opacity: 1; transition-delay: 0.7s}
.etc .item_wrap .item.item2.on .line_wrap .pointer {top: -2px; left: 0;}
.etc .item_wrap .item.item3 .line_wrap {right: 40px; top: 8px;}
.etc .item_wrap .item.item3 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.3s; transition-delay: 0.6s;}
.etc .item_wrap .item.item3 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.2s;}
.etc .item_wrap .item.item3 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 378px; right: 80px;  opacity: 0; transition: all 0.3s;}
.etc .item_wrap .item.item3.on .line_wrap .line1 {width: 80px; transition: all 0.3s; opacity: 1;}
.etc .item_wrap .item.item3.on .line_wrap .line2 {height: 380px; transition: all 0.6s; opacity: 1; transition-delay: 0.2s;}
.etc .item_wrap .item.item3.on .line_wrap .line3 {width: 400px; transition: all 0.9s; opacity: 1; transition-delay: 0.7s}
.etc .item_wrap .item.item3.on .line_wrap .pointer {top: -2px; right: 0;}
.etc .item_wrap .item.item4 .line_wrap {top: 8px; right: 40px;}
.etc .item_wrap .item.item4 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.5s;}
.etc .item_wrap .item.item4 .line_wrap .line2 {height: 0; width: 2px; background: #1b42e8; position: absolute; top: 0; left: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.etc .item_wrap .item.item4 .line_wrap .line3 {height: 2px; width: 0; background: #1b42e8; position: absolute; top: 518px; left: 0; opacity: 0; transition: all 0.6s;}
.etc .item_wrap .item.item4.on .line_wrap .line1 {width: 320px; transition: all 0.3s; opacity: 1;}
.etc .item_wrap .item.item4.on .line_wrap .line2 {height: 520px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.etc .item_wrap .item.item4.on .line_wrap .line3 {width: 270px; transition: all 0.3s; opacity: 1; transition-delay: 0.6s;}
.etc .item_wrap .item.item4.on .line_wrap .pointer {top: -2px; right: 0;}
.etc .item_wrap .item.item5 .line_wrap {left: 40px; top: 8px;}
.etc .item_wrap .item.item5 .line_wrap .line1 {width: 0; height: 2px; background: #1b42e8; opacity: 0; transition: all 0.3s; transition-delay: 0.9s;}
.etc .item_wrap .item.item5 .line_wrap .line2 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 0; right: 0; opacity: 0; transition: all 0.3s; transition-delay: 0.6s;}
.etc .item_wrap .item.item5 .line_wrap .line3 {width: 0; height: 2px; background: #1b42e8; position: absolute; top: 298px; left: 80px; opacity: 0; transition: all 0.3s; transition-delay: 0.3s;}
.etc .item_wrap .item.item5 .line_wrap .line4 {width: 2px; height: 0; background: #1b42e8; position: absolute; top: 298px; left: 418px; opacity: 0; transition: all 0.3s;}
.etc .item_wrap .item.item5.on .line_wrap .line1 {width: 80px; transition: all 0.3s; opacity: 1;}
.etc .item_wrap .item.item5.on .line_wrap .line2 {height: 300px; transition: all 0.3s; opacity: 1; transition-delay: 0.3s;}
.etc .item_wrap .item.item5.on .line_wrap .line3 {width: 340px; transition: all 0.3s; opacity: 1; transition-delay: 0.6s;}
.etc .item_wrap .item.item5.on .line_wrap .line4 {height: 90px; transition: all 0.3s; opacity: 1; transition-delay: 0.9s;}
.etc .item_wrap .item.item5.on .line_wrap .pointer {top: -2px; left: 0;}
/********** 기타 파트 **********/
/** 제품안내 **/



/** 기술 - DESIGN & ENGINEERING **/
.container.design {padding-bottom: 0;}
.design .half_wrap {display: flex;}
.design .half_wrap.top {flex-flow: wrap;}
.design .half_wrap.top .process_box {flex: 1 1 calc(50% - 10px); width: calc(50% - 10px); margin-bottom: 20px;}
.design .half_wrap.top .process_box:nth-last-child(-n + 2) {margin-bottom: 0;}
.design .process_box {width: 50%; position: relative; margin: 0 10px;}
.design .process_box:nth-child(odd) {margin-left: 0;}
.design .process_box:nth-child(even) {margin-right: 0;}
.design .process_box .title_box {background: #f9f9f9; display: flex; height: 160px; padding: 0 50px; align-items: center; border-bottom: 1px solid #ebebeb;}
.design .process_box.design .title_box {border-left: 8px solid #ebebeb;}
.design .process_box.product .title_box {border-left: 8px solid #d1d6dd;}
.design .process_box.test .title_box {border-left: 8px solid #ece4db;}
.design .process_box .title_box .icon {width: 60px; height: 60px; background: #f2f2f2; border-radius: 50%; display: flex; justify-content: center; align-items: center; box-shadow: 0px 2px 5px 0px rgb(0 0 0 / 6%) inset; flex-shrink: 0;}
.design .process_box .title_box .icon img {max-width: 26px;}
.design .process_box .title_box .txt {margin-left: 45px;}
.design .process_box .title_box .txt .f28 {color:#2e2e2e; font-weight: 700;}
.design .process_box .title_box .txt .f18 {color:#aaa; font-weight: 400;}
.design .process_con {background: #f9f9f9;}
.design .process_con .inner {margin: 0 105px; box-shadow: 8px 6px 19px 0px rgb(0 0 0 / 5%);}
.design .process_box.test .process_con .pd {padding: 50px 0 70px;}
.design .process_con .design_swiper_wrap .design_swiper {padding: 50px 0 40px;}
.design .process_con .design_slide .image100 {height: 223px;}
.design .process_con .design_slide .image100 img {object-fit: cover;}
.design .process_con .design_slide .txt { height: 77px; display: flex; align-items: center; padding: 0 40px;}
.design .process_box.design .process_con .design_slide .txt {background: linear-gradient(to right, #c4c7cc 20%, #d5d8df);}
.design .process_box.product .process_con .design_slide .txt.pro_txt1 {background: linear-gradient(to right, #20385b 60%, #314b70);}
.design .process_box.product .process_con .design_slide .txt.pro_txt2 {background: linear-gradient(to right, #32566f 60%, #437293);}
.design .process_box.product .process_con .design_slide .txt.pro_txt3 {background: linear-gradient(to right, #2e5d70 60%, #49798d);}
.design .process_box.test .process_con .design_slide .txt {background: linear-gradient(to right, #97836f 60%, #a69788);}
.design .process_con .design_slide .txt .f20 {color:#fff; font-weight: 700;}
.design .process_con .explanation_box .box {display: flex; flex-flow: column; justify-content: center; padding: 0 40px;}
.design .process_con .explanation_box .top {height: 140px;}
.design .process_box.design .process_con .explanation_box .top {background: linear-gradient(to right, #c4c7cc 60%, #d5d8df);}
.design .process_box.product .process_con .explanation_box .top {background: linear-gradient(to right, #20385b 60%, #314b70);}
.design .process_box.test .process_con .explanation_box .top {background: linear-gradient(to right, #97836f 60%, #a69788);}
.design .process_con .explanation_box .top .f20 {color:#fff; font-weight: 700; margin-bottom: 6px;}
.design .process_con .explanation_box .top .f16 {color: rgb(255 255 255 / 50%); line-height: 24px;}
.design .process_con .explanation_box .bottom {background: #fff; height: 160px;}
.design .process_con .explanation_box .bottom .f18 {color:#666;}
.design .process_con .design_swiper .swiper-pagination {position: static; margin-top: 15px;}
.design .process_con .design_swiper .swiper-pagination .swiper-pagination-bullet {border: 1px solid #d9d9d9; background: #f9f9f9; width: 10px; height: 10px; opacity: 1;}
.design .process_con .design_swiper .swiper-pagination .swiper-pagination-bullet-active {background: #c3c6cb; border: none;}
.design .process_con .design_swiper_wrap .swiper_btn {background: #fff; color:#adadad; width: 50px; height: 50px; border-radius: 50%; box-shadow: 0px 2px 14px rgb(0 0 0 / 6%); margin-top: 40px;}
.design .process_con .design_swiper_wrap .swiper_btn.swiper-button-disabled {opacity: 0.5;} 
.design .process_con .design_swiper_wrap .swiper_btn::after {font-size: 12px; font-weight: 700;}
.design .process_con .design_swiper_wrap .swiper-button-prev {left: 30px;}
.design .process_con .design_swiper_wrap .swiper-button-next {right: 30px;}
.design .brick_wrapper .brick_top {height: 160px; display:flex; justify-content: center; align-items: center;}
.design .brick_wrapper .brick_top .top_arrow {width: 90px; height: 90px; background: #fff; border-radius: 50%; display: flex; justify-content: center; align-items: center; box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 6%);} 
.design .brick_wrapper .brick_top .top_arrow img {max-width: 41px;} 
.design .brick_wrapper .brick_con {display: flex; flex-wrap: wrap;} 
.design .brick_wrapper .brick_con .brick {background: #f9f9f9; height: 200px; padding: 40px; margin: 0 10px 20px; flex: 0 1 calc(50% - 10px); display: flex; flex-flow: column; justify-content: space-between;} 
.design .brick_wrapper .brick_con .brick:nth-child(odd) {margin-left: 0;}
.design .brick_wrapper .brick_con .brick:nth-child(even) {margin-right: 0;}
.design .brick_wrapper .brick_con .brick .icon {} 
.design .brick_wrapper .brick_con .brick .icon img {max-width: 52px;} 
.design .brick_wrapper .brick_con .brick .f20 {color:#2e2e2e;} 
.design .sec3 .design_line {position: relative; top: -20px;}
.design .sec3 .design_line .pc {display: inline-block;}
.design .sec3 .design_line .m {display: none;}
.design .sec4 .small_box_wrap {display: flex; background: #f9f9f9; padding: 20px;} 
.design .sec4 .small_box_wrap .inner_box {background: #fff; width: calc(33.3% - 10px); margin: 0 10px; padding: 25px 30px; height: 190px; display: flex; flex-flow: column; justify-content: space-between;}
.design .sec4 .small_box_wrap .inner_box:nth-child(1) {margin-left: 0;}
.design .sec4 .small_box_wrap .inner_box:nth-child(3) {margin-right: 0;}
.design .sec4 .small_box_wrap .inner_box .f20 {color:#2e2e2e;} 
.design .sec4 .small_box_wrap .inner_box .bt {justify-content: flex-end; display: flex;} 
.design .sec4 .small_box_wrap .inner_box .bt .image100 img {max-width: 82px;} 
.design .sec4 .small_box_wrap .inner_box .bt ul {}
.design .sec4 .small_box_wrap .inner_box .bt ul li {position: relative; padding-left: 28px;}
.design .sec4 .small_box_wrap .inner_box .bt ul li::before {content: ''; display: inline-block; background: url('../images/design_inner_box_check.png') no-repeat center / cover; width: 14px; height: 10px; position: absolute; left: 0; top: 10px;}
.design .sec4 .small_box_wrap .inner_box .bt ul li .f20 {color:#aaa; font-weight: 400;}
.design .sec4 .brick_wrapper .brick_con .brick {height: 230px;}
.design .sec5 .tool_wrap {background: #f9f9f9; padding: 50px 0 0 60px;}
.design .sec5 .measurement_wrap .tool_wrap {padding: 50px 60px 60px;}
.design .sec5 .tool_wrap .text {width: 45%;}
.design .sec5 .tool_wrap .text .f28 {font-weight: 700;}
.design .sec5 .tool_wrap .text .f16 {color:#a6a6a6; margin-top: 15px;}
.design .sec5 .tool_wrap .capability_img {display: flex; justify-content: flex-end;}
.design .sec5 .tool_wrap .capability_img .image100 {}
.design .sec5 .tool_wrap .capability_img .image100 img {max-width: 530px;}
.design .sec5 .measurement_tools {padding-top: 50px;}
.design .sec5 #prev, .design .sec5 #next {background:white; padding:2px 5px; font-weight:200; font-size:15px;  cursor:pointer; margin:0 0.5em; width:fit-content; position:absolute; top:0; left:0; transform:transl}
.design .sec5 #prev {left:20px;}
.design .sec5 #next {left:90px;}
.design .sec5 #carousel-container {width:100%; display: flex; flex-flow:column nowrap;}
.design .sec5 #carousel-content {height:100%;}
.design .sec5 #carousel-dots {position: absolute; bottom:150px;}
.design .sec5 #carousel-content, #carousel-dots {width:100%; display:flex; justify-content:center; align-items:center;}
.design .sec5 .card {width:480px; height:260px; background-color:white; margin:0 1em; display:flex; justify-content:center; align-items:center; transition:0.8s ease-in; opacity: 0; border-radius:7px; box-shadow: 0px 0px 45px 5px rgba(0,0,0,0.3);}
.design .sec5 .card img {width: 100%;}
.design .sec5 .card_hidden {display:none;}
.design .sec5 .left img, .design .sec5 .right img {filter: grayscale(100%);}
.design .sec5 .left {position: absolute; transform-origin: center;  animation: card-out 0.9s cubic-bezier(0.25, 0.1, 0.25, 1.0); transform: translateX(-18%) scale(0.85); opacity: 1 !important;  z-index: 0;}
.design .sec5 .selected {transform-origin: center; animation: card-in 0.9s cubic-bezier(0.25, 0.1, 0.25, 1.0); transform: translateX(0%); opacity: 1 !important; z-index: 1;}
.design .sec5 .right {position: absolute; transform-origin: center;  animation: new-card 0.9s cubic-bezier(0.25, 0.1, 0.25, 1.0); transform: translateX(18%) scale(0.85);   opacity: 1 !important; z-index: 0;}
.design .sec5 .dot {width:10px; height:10px; background-color:rgb(200,200,200); border-radius:50%; margin:0 0.5rem; cursor:pointer;}
.design .sec5 .active-dot {transform: scale(1.2); background-color:rgb(120,120,120);}
@keyframes card-in {
    0% { z-index: 1; }
    50% { transform: translateX(30%); }
    80% { z-index: 20; transform: translateX(0px); }
    100% { transform: translateX(0%); }
}
@keyframes card-out {
    0% { z-index: 20; transform: translateX(0px);}
    50% { transform: translateX(-30%);}
    80% { z-index: 1; }
    100% { transform: translateX(-18%) scale(0.85);}
}
@keyframes new-card {
    from { 
        transform: translateX(0%) scale(0.5);
    } to {
        transform: translateX(18%) scale(0.85);
    }
}
.design .sec6 {text-align: center; margin-top: 180px; margin-bottom: 160px;}
.design .sec6 .capability_swiper {padding: 20px 0; margin-top: 60px;}
.design .sec6 .capability_slide {box-shadow: 4px 4px 24px 0px rgb(0 0 0 / 6%); padding: 15px;}
.design .sec6 .capa_box .capa_logo {background: #fafafa; height: 155px; justify-content: center; align-items: center;}
.design .sec6 .capa_box .capa_logo img {max-width: 310px; height: 65px; object-fit: contain;}
.design .sec6 .capa_box .bt_text {display: flex; justify-content: space-between; align-items: center; padding: 25px 5px 10px 25px;}
.design .sec6 .capa_box .bt_text .f20 {color:#aaa;text-align: left; font-weight: 600; line-height: 24px;}
.design .sec6 .capa_box .bt_text .f20.cate {color:#666;}
.design .sec6 .capa_box .bt_text .link {width: 50px; height: 50px; border: 1px solid #e8e8e8; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all 0.3s;}
.design .sec6 .capa_box .bt_text .link .icon {display: inline-block; background: url('../images/design_link_icon.png') no-repeat center / cover; width: 21px; height: 21px; transition: all 0.3s;}
.design .sec6 .capa_box:hover .bt_text .link {background: #a39d97; border: 1px solid #a39d97; transition: all 0.3s;}
.design .sec6 .capa_box:hover .bt_text .link .icon { background: url('../images/design_link_icon_w.png') no-repeat center / cover; transition: all 0.3s;}
.design .sec7 {background: #fafafa; padding: 100px 0 150px;}
.design .sec7 .f32 {text-align: center; margin-bottom: 80px;}
.design .sec7 .cadcae_wrap {display: flex; flex-flow: wrap;} 
.design .sec7 .cadcae_wrap .box {display: flex; background: #fff; box-shadow: 4px 4px 24px 0px rgb(0 0 0 / 6%); flex: 0 1 calc(50% - 10px); padding: 15px; align-items: center; margin: 0 10px 20px;} 
.design .sec7 .cadcae_wrap .box:nth-child(odd) {margin-left: 0;}
.design .sec7 .cadcae_wrap .box:nth-child(even) {margin-right: 0;}
.design .sec7 .cadcae_wrap .box .left .image100 {background: #fafafa; width: 155px; height: 190px; display: flex; justify-content: center; align-items: center;} 
.design .sec7 .cadcae_wrap .box .left .image100 img {max-width: 70px; object-fit: contain;} 
.design .sec7 .cadcae_wrap .box .right {padding-left: 55px; width: 100%;} 
.design .sec7 .cadcae_wrap .box .right .title {margin-bottom: 25px;} 
.design .sec7 .cadcae_wrap .box .right .title .f24 {color:#444; line-height: 34px;} 
.design .sec7 .cadcae_wrap .box .right .title .f16 {color:#aaa; line-height: 24px;} 
.design .sec7 .cadcae_wrap .box .right ul {display: flex; flex-flow: column; width: 100%;} 
.design .sec7 .cadcae_wrap .box .right ul li {position: relative; display: flex; align-items: center;} 
.design .sec7 .cadcae_wrap .box:nth-child(1) .right ul {display: flex; flex-flow: wrap; width: 100%;} 
.design .sec7 .cadcae_wrap .box:nth-child(1) .right ul li { flex: 0 1 50%;}
.design .sec7 .cadcae_wrap .box .right ul li .icon {width: 25px; height: 25px; border-radius: 50%; border: 1px solid #eee; display: flex;  justify-content: center; align-items: center; margin-right: 16px; flex-shrink: 0;}
.design .sec7 .cadcae_wrap .box .right ul li .icon::before {content: ''; display: inline-block; background: url('../images/design_check_icon.png') no-repeat center / cover; width: 12px; height: 8px;} 
.design .sec7 .cadcae_wrap .box .right ul li .f20 {color:#66625f;}
.design .sec7 .cadcae_wrap .box .right ul li .f20 span {color:#a39d97;}



/** 기술 - CASTING **/
.casting .tab {display: flex; justify-content: center; margin-bottom: 100px;}
.casting .tab li {width: 20%; border: 1px solid #ddd; border-right: 0;}
.casting .tab li a {width: 100%; height: 75px; display: flex; justify-content: center; align-items: center; background: #fff; text-align: center;}
.casting .tab li:last-child {border-right: 1px solid #ddd;}
.casting .tab li a.f20 {font-weight: 500;}
.casting .tab li a.f20:hover {border: 1px solid #333; font-weight: 700;}
.casting .tab li a.f20.active {background: #333; border: 1px solid #333; color:#fff;}
.casting .tab li a.f20.active:hover {font-weight: 500;}
.casting .sec4 {display: flex;}
.casting .left {width: 50%;}
.casting .left .f32 {margin-top: 40px; font-weight: 700;}
.casting .left .left_acco_wrap {margin-top: 110px;}
.casting .left .left_acco_wrap .acco_box {border: 1px solid #eee; border-left: 5px solid #e6e0db; box-shadow: 1px 7px 16px rgb(0 0 0 / 5%); margin-bottom: 10px;}
.casting .left .left_acco_wrap .acco_box .title_box {height: 70px; border-bottom: 1px solid #eee; padding: 0 45px; display: flex; align-items: center; justify-content: space-between; cursor: pointer;}
.casting .left .left_acco_wrap .acco_box .title_box .text .f20 {font-weight: 600;}
.casting .left .left_acco_wrap .acco_box .title_box .arrow span {display: inline-block; width: 10px;  height: 10px; transform: rotate(225deg); position: relative;}
.casting .left .left_acco_wrap .acco_box .title_box .arrow span::after {content: ''; position: absolute; width: 100%; height: 100%; border: 2px solid #bfbfbf; border-right: 0; border-bottom: 0;}
.casting .left .left_acco_wrap .acco_box .cont_box {padding: 30px 45px 40px; display: none;}
.casting .left .left_acco_wrap .acco_box .cont_box .f18 {color:#888;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li {position: relative; display: inline-block; cursor: pointer; margin: 0 15px;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li:first-child {margin-left: 0;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li:last-child {margin-right: 0;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li .icon {display: inline-block; width: 90px; height: 90px; background: #ddd; box-shadow: -1px 4px 5px rgb(0 0 0 / 6%) inset; border-radius: 50%; position: relative; display: flex; justify-content: center; align-items: center; transition: opacity 300ms ease, transform 600ms ease;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li:hover .icon {background: #a29282; transition: opacity 300ms ease, transform 600ms ease;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li .icon img {width: 100%; max-width: 38px; z-index: 1;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li .speech_bubble {display: inline-block; position: absolute; left: 50%; transform: translateX(-50%); margin-top: 15px; opacity: 0; visibility: hidden; transform: translate(-50%, 10px); transition: opacity 300ms ease, transform 600ms ease;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li:hover .speech_bubble {opacity: 1; visibility: visible; transform: translate(-50% , 0px);}
.casting .left .left_acco_wrap .acco_box .cont_box ul li .speech_bubble .f20 {color:#fff; background: #2e2e2e; border-radius: 8px; padding: 16px 30px; position: relative; white-space:nowrap; margin-top: 9px; font-weight: 400;}
.casting .left .left_acco_wrap .acco_box .cont_box ul li .speech_bubble .f20::before {content: ''; width: 0px; height: 0px; border-bottom: 10px solid #2e2e2e; border-left: 7px solid transparent; border-right: 7px solid transparent; position: absolute; top: -9px; left: 50%; transform: translateX(-50%);}
.casting .right {width: 50%; display: flex; justify-content: flex-end;}
.casting .right .img_view_wrap {display: inline-block; padding-left: 20px;}
.casting .right .img_view_wrap .item_detail {text-align: center; margin-bottom: 7px; display: flex;}
.casting .right .img_view_wrap .item_detail img {width: 100%; max-width: 430px;}
.casting .right .img_view_wrap .item_thum {display: flex;}
.casting .right .img_view_wrap .item_thum .item {object-fit: cover; display: flex; justify-content: center; cursor: pointer; margin: 0 2px; background: #fff; border: 3px solid #fff; box-sizing: content-box;}
.casting .right .img_view_wrap .item_thum .item:first-child {margin-left: 0;}
.casting .right .img_view_wrap .item_thum .item:last-child {margin-right: 0;}
.casting .right .img_view_wrap .item_thum .item img {object-fit: contain; width: 100%; max-width: 100px;}
.casting .right .img_view_wrap .item_thum .item:hover, .casting .right .img_view_wrap .item_thum .item.active {border: 3px solid #a39d97; }
.casting .casting_acco_wrap {margin-top: 110px;}
.casting .casting_acco_wrap .acco_box {margin-bottom: 40px;}
.casting .casting_acco_wrap .acco_box .title_box {height: 100px; border: 1px solid #eee; border-left: 5px solid #ced3da; background: #f9f9f9; padding: 0 45px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; margin-bottom: 10px;}
.casting .casting_acco_wrap .acco_box .title_box .text .f20 {font-weight: 600;}
.casting .casting_acco_wrap .acco_box .title_box .arrow span {display: inline-block; width: 11px;  height: 11px; transform: rotate(225deg); position: relative;}
.casting .casting_acco_wrap .acco_box .title_box .arrow span::after {content: ''; position: absolute; width: 100%; height: 100%; border: 2px solid #919599; border-right: 0; border-bottom: 0;}
.casting .casting_acco_wrap .acco_box .cont_box {padding: 35px 40px 60px; border: 1px solid #eee; background: #f9f9f9; border-bottom: 1px solid #e6e6e6; display: none;}
.casting .casting_acco_wrap .acco_box .cont_box .sub_t {color:#888; font-weight: 400; padding-bottom: 35px; border-bottom: 1px solid #eee; margin-bottom: 30px;}
.casting .casting_acco_wrap .acco_box .cont_box .top {display: flex;  margin: 0 30px;}
.casting.esdc .casting_acco_wrap .acco_box .cont_box .top {border-bottom: 1px solid #e6e6e6; padding-bottom: 70px; }
.casting .casting_acco_wrap .acco_box .cont_box .ca_left {width: 50%; padding-top: 25px; padding-right: 70px;}
.casting .casting_acco_wrap .acco_box .cont_box .con_title {border-bottom: 1px solid #e6e6e6; padding-bottom: 30px;}
.casting .casting_acco_wrap .acco_box .cont_box .con_title .f28 {font-weight: 700;}
.casting .casting_acco_wrap .acco_box .cont_box .con_title .f16 {color:#666;}
.casting .casting_acco_wrap .acco_box .cont_box .text {margin-top: 40px; display: flex; flex-flow: column; justify-content: space-between; height: calc(100% - 140px);} 
.casting .casting_acco_wrap .acco_box .cont_box .text .f18 {color:#888;} 
.casting .casting_acco_wrap .acco_box .cont_box .text .f18 span {display: block;}
.casting .casting_acco_wrap .acco_box .cont_box .text .img_txt {display: flex; align-items: flex-end;} 
.casting .casting_acco_wrap .acco_box .cont_box .text .img_txt .image100 {flex-shrink: 0;} 
.casting .casting_acco_wrap .acco_box .cont_box .text .img_txt .image100 img {max-width: 221px;} 
.casting .casting_acco_wrap .acco_box .cont_box .text .img_txt .inner_txt {margin-left: 50px;} 
.casting .casting_acco_wrap .acco_box .cont_box .ca_right {width: 50%; display: flex; justify-content: flex-end;}
.casting .casting_acco_wrap .acco_box .cont_box .ca_right .diagram {position: relative;     display: flex; justify-content: center; align-items: center;}
.casting .casting_acco_wrap .acco_box .cont_box .ca_right .diagram .dg1 {position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%);}
.casting .casting_acco_wrap .acco_box .cont_box .ca_right .diagram .dg2 {z-index: 1;}
.casting .casting_acco_wrap .acco_box .cont_box .ca_right .diagram .image100 {width: 100%;}
.casting .casting_acco_wrap .acco_box .cont_box .ca_right .diagram .image100 img {max-width: 571px;}
.casting .casting_acco_wrap .acco_box .cont_box .bottom {padding-top: 60px;}
.casting .casting_swiper_wrap {position: relative;;}
.casting .casting_swiper_wrap .casting_swiper {margin: 0 70px; display: flex;}
.casting .casting_swiper_wrap .casting_swiper .swiper-wrapper {padding: 10px 0;}
.casting .casting_swiper_wrap .casting_swiper .casting_slide {border: 1px solid #eee; box-shadow: 0 3px 14px rgb(0 0 0 / 4%);}
.casting .casting_swiper_wrap .casting_swiper1 .casting_slide:nth-child(2) .box_line, .casting .casting_swiper_wrap .casting_swiper1 .casting_slide:nth-child(3) .box_line {width: 100%; height: 100%; box-shadow: 0 0 0 5px #a39d97 inset; position: absolute;}
.casting .casting_swiper_wrap .casting_swiper1 .casting_slide:nth-child(2) .box_line .f18, .casting .casting_swiper_wrap .casting_swiper1 .casting_slide:nth-child(3) .box_line .f18 {background: #a39d97; color:#fff; display: inline-block; padding: 5px 28px;}
.casting .casting_swiper_wrap .casting_swiper .casting_slide .image100 {}
.casting .casting_swiper_wrap .casting_swiper .casting_slide .txt {background: #fff; border-top: 1px solid #eee; padding: 18px 25px;}
.casting .casting_swiper_wrap .casting_swiper .casting_slide .txt .f14 {color:#a39d97; font-weight: 700; line-height: 16px;}
.casting .casting_swiper_wrap .casting_swiper .casting_slide .txt .f18 {font-weight: 700;}
.casting .casting_swiper_wrap .swiper_btn {background: #fff; color:#c9c9c9; width: 50px; height: 50px; border-radius: 50%; box-shadow: 0px 2px 14px rgb(0 0 0 / 6%);}
.casting .casting_swiper_wrap .swiper_btn.swiper-button-disabled {opacity: 0.5;} 
.casting .casting_swiper_wrap .swiper_btn::after {font-size: 12px; font-weight: 700;}
.casting .casting_swiper_wrap .swiper-button-prev1 {left: 0;}
.casting .casting_swiper_wrap .swiper-button-next1 {right: 0;}
.casting .casting_swiper_wrap .swiper-button-prev2 {left: 0;}
.casting .casting_swiper_wrap .swiper-button-next2 {right: 0;}
.casting .advatages_box .box_warp {display: flex; justify-content: space-between;}
.casting .advatages_box .box_warp.top_box {margin-bottom: 40px;}
.casting .advatages_box .box_warp .box {background: #fff; border: 1px solid #eee; margin: 0 10px; box-shadow: 0px 8px 14px rgb(0 0 0 / 4%); width: 33.3%;}
.casting .advatages_box .box_warp .box:first-child {margin-left: 0;}
.casting .advatages_box .box_warp .box:last-child {margin-right: 0;}
.casting .advatages_box .box_warp.top_box .box .image100 {margin: 60px 0; justify-content: center;}
.casting .advatages_box .box_warp.top_box .box .image100 img {max-width: 220px;}
.casting .advatages_box .box_warp.top_box .box .txt {padding: 23px 0; border-top: 1px solid #eee;}
.casting .advatages_box .box_warp.top_box .box .txt .f20 {color:#2e2e2e; font-weight: 500;text-align: center; margin-top: 0;}
.casting .advatages_box .box_warp.bt_box {border-top: 0; padding-top: 0;}
.casting .advatages_box .box_warp.bt_box .box {display: flex; justify-content: space-between; align-items: center; padding: 37px 60px;}
.casting .advatages_box .box_warp.bt_box .box .icon {flex-shrink: 0;}
.casting .advatages_box .box_warp.bt_box .box .icon img {max-width: 60px;}
.casting .advatages_box .box_warp.bt_box .box .txt .f20 {color:#555; font-weight: 500; margin-top: 0;}
.casting .advatages_box .box_warp.bt_box .box .txt .f20 span {display: block;}
.casting .advatages_box .box_warp.bt_box .box .txt .f24 {color:#555; font-weight: 500;}

.casting .graph_wrap {display: flex; align-items: center; justify-content: center;} 
.casting .graph_wrap .graph_con {margin: 0 28px; width: 100%; max-width: 416px;} 
.casting .graph_wrap .graph_con:first-child {margin-left: 0;}
.casting .graph_wrap .graph_con:last-child {margin-right: 0;}
.casting .graph_wrap .graph_con .graph_m {display: none;}
.casting .graph_wrap .graph_con .graph {width: 100%; border-radius: 15px; overflow: hidden; position: relative;}
.casting .graph_wrap .graph_con .graph .img {width: 100%;}
.casting .graph_wrap .graph_con .graph .bg {display: flex;}
.casting .graph_wrap .graph_con .graph .bg img {width: 427px;}
.casting .graph_wrap .graph_con .graph .group {position: absolute; display: inline-block; bottom: 80px;}
.casting .graph_wrap .graph_con .graph .group1 {left: 112px;}
.casting .graph_wrap .graph_con .graph .group2 {left: 260px;}
.casting .graph_wrap .graph_con .graph .graph_bar { width: 55px; position: relative;}
.casting .graph_wrap .graph_con .graph .graph_bar.first {margin-right: 40px; background-color: #20385b;}
.casting .graph_wrap .graph_con .graph .graph_bar.second {background-color: #ccc; position: absolute; right: 0; bottom: 0;}
.casting .graph_wrap .graph_con .graph .graph_bar1 {animation: graph_bar1 1s 0.3s ease-out forwards; animation-iteration-count: 1;}
@keyframes graph_bar1 {
    0% {height: 0;}
    100% {height: 260px;}
}
.casting .graph_wrap .graph_con .graph .graph_bar2 {animation: graph_bar2 1s 0.3s ease-out forwards; animation-iteration-count: 1;}
@keyframes graph_bar2 {
    0% {height: 0;}
    100% {height: 190px;}
}

.casting .graph_wrap .graph_con .graph .graph_bar3 {animation: graph_bar3 1s 0.3s ease-out forwards; animation-iteration-count: 1;}
@keyframes graph_bar3 {
    0% {height: 0;}
    100% {height: 110px;}
}
.casting .graph_wrap .graph_con .graph .graph_bar4 {animation: graph_bar4 1s 0.3s ease-out forwards; animation-iteration-count: 1;}
@keyframes graph_bar4 {
    0% {height: 0;}
    100% {height: 50px;}
}

.casting .advatages_box .circle_graph_wrap {}
.casting .advatages_box .circle_graph_wrap .circle_graph_container span {display: inline-block;}
.casting .advatages_box .circle_graph_wrap .graph_one {padding: 39px 0 48px;}
.casting .advatages_box .circle_graph_wrap .circle_graph_container {position: relative; display: flex; justify-content: center; align-items: center; }
.casting .advatages_box .circle_graph_wrap .circle_graph {}
.casting .advatages_box .circle_graph_wrap .circle_graph_bg {rotate:120deg}
.casting .advatages_box .circle_graph_wrap .circle_graph1 {position: absolute;rotate:179deg}
.casting .advatages_box .circle_graph_wrap .circle_graph2 {position: absolute;rotate:115deg}

.casting .advatages_box .circle_graph_wrap .circle_graph .f20 {text-align: center; padding: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: 700;} 
.casting .advatages_box .circle_graph_wrap .circle_graph .f32 {position: absolute;}
.casting .advatages_box .circle_graph_wrap .circle_graph .f32.left_per {color:#20385b; left: 70px; bottom: -15px;}
.casting .advatages_box .circle_graph_wrap .circle_graph .f32.left_per .f20{color:#20385b;}
.casting .advatages_box .circle_graph_wrap .circle_graph .f32.right_per {color:#999; right: 70px; bottom: -15px;}
.casting .advatages_box .circle_graph_wrap .circle_graph .f32.right_per .f20 {color:#999;}
.casting .advatages_box .circle_graph_wrap .circle_graph .f32 .f20 {position: static; padding: 0; transform: none;}

.casting .advatages_box .circle_graph_wrap .txt {display: flex; justify-content: space-between; padding: 23px 28px !important;}
.casting .advatages_box .circle_graph_wrap .txt .legend {display: flex; align-items: center; padding-right: 20px;}
.casting .advatages_box .circle_graph_wrap .txt .legend .bullet {display: block; width: 13px; height: 13px; margin-right: 15px; flex-shrink: 0;}
.casting .advatages_box .circle_graph_wrap .txt .legend .bullet1 {background: #20385b;}
.casting .advatages_box .circle_graph_wrap .txt .legend .bullet2 {background: #ccc;}
.casting .advatages_box .circle_graph_wrap .txt .legend .f20 {text-align: left !important;}



/** 기술 - MACHINING & ASSEMBLY **/
.container.machining {padding-bottom: 0;}
.machining .cardbox_wrap {display: flex; justify-content: space-between;}
.machining .cardbox_wrap .box {background: #f9f9f9; display: flex; align-items: center; padding: 45px 50px; border-left: 8px solid #f2f2f3; margin: 0 15px; width: 33.3%;}
.machining .cardbox_wrap .box:first-child {margin-left: 0;}
.machining .cardbox_wrap .box:last-child {margin-right: 0;}
.machining .cardbox_wrap .box .icon {background: #f2f2f2; width: 60px; height: 60px; border-radius: 50%; display: flex; justify-content: center; align-items: center; flex-shrink: 0;}
.machining .cardbox_wrap .box .icon img {max-width: 31px;     object-fit: contain; }
.machining .cardbox_wrap .box .txt {margin-left: 45px;}
.machining .cardbox_wrap .box .txt .f28 {font-weight: 700;}
.machining .cardbox_wrap .box .txt .f18 {margin-top: 6px; color:#aaa;}
.machining .sec4 {margin-top: 140px;}
.machining .table_wrap {display: flex;}
.machining .table_wrap .half {width: 50%; margin: 0 55px;}
.machining .table_wrap .half .f24 {font-weight: 700; color:#222; margin-bottom: 30px;}
.machining .table_wrap .left {margin-left: 0;}
.machining .table_wrap .right {margin-right: 0;}
.machining .table_wrap .tb1 table tbody td:nth-child(1) {background: #f9f9f9; font-weight: 700; color: #222; padding: 0 10px;}
.machining .table_wrap .tb1 table tbody td:nth-child(2), .machining .table_wrap .tb1 table tbody td:nth-child(3) {text-align: right;}
.machining .sec4 .bt_txt {font-weight: 600; text-align: center; margin-top: 50px;}
.machining .sec4 .bt_txt strong {font-weight: 700;}
.machining .sec5 {text-align: center; margin: 130px 0 190px;}
.machining .sec5 .f32 {font-weight: 700; margin-bottom: 70px;}
.machining .automation_wrap {display: flex;}
.machining .automation_wrap .box {margin: 0 15px; text-align: left; width: 33.3%;}
.machining .automation_wrap .box:first-child {margin-left: 0;}
.machining .automation_wrap .box:last-child {margin-right: 0;}
.machining .automation_wrap .box .image100 {}
.machining .automation_wrap .box .image100 img {}
.machining .automation_wrap .box .title {border: 1px solid #f2f2f2; padding: 40px 30px 30px;}
.machining .automation_wrap .box .title .cate {color:#b2b2b2; font-size: 12px; background: #f9f9f9; border: 1px solid #e6e6e6; padding: 4px 20px; display: inline-block; margin-bottom: 12px;}
.machining .automation_wrap .box .title .f20 {font-weight: 700; color:#222;}
.machining .automation_wrap .box .txt {border: 1px solid #f2f2f2; border-top: 0; padding: 20px 30px 40px;}
.machining .automation_wrap .box .txt .f16 {color:#888;}
.machining .sec6 {background: #f9f9f9; padding: 90px 0 100px;}
.machining .sec6 .f32 {text-align: center; margin-bottom: 90px;}
.machining .process_wrap {display: flex; padding-bottom: 155px;}
.machining .process_wrap .box {display: flex; align-items: center; position: relative;}
.machining .process_wrap .box .pro_img {}
.machining .process_wrap .box .pro_img img {max-width: 206px;}
.machining .process_wrap .box .arrow {}
.machining .process_wrap .box .arrow img {max-width: 32px;}
.machining .process_wrap .box3 .bt_img {position: absolute; width: 434px; left: calc(50% - 16px); transform: translateX(-50%); bottom: -155px;}
.machining .process_wrap .box3 .bt_img img {max-width: 434px;}


/** 기술 - TESTING & VALIDATION **/
.container.testing {padding-bottom: 0;}
.testing .sec2.sub_title {text-align: center; margin: 170px 0 60px;}
.testing .sec3 .f40 {text-align: center; margin-bottom: 80px;}
.testing .testing_infog_wrapper {text-align: center; padding-top: 50px;}
.testing .testing_infog_wrapper.pc {display: block;}
.testing .testing_infog_wrapper .dot_warp {z-index: 9; width: 90%; height: 100%; position: absolute;  top: 0; left: 50%; transform: translateX(-50%); margin: 0 auto;}
.testing .testing_infog_wrapper .dot_warp .dot_inner {width: 100%; height: 100%;}
.testing .testing_infog_wrapper .dot_warp .dot {position: absolute;}
.testing .testing_infog_wrapper .dot_warp .dot.dot1 {top: -10px; left: 50%; transform: translateX(-50%);}
.testing .testing_infog_wrapper .dot_warp .dot.dot2 {right: 5px; top: 25%;}
.testing .testing_infog_wrapper .dot_warp .dot.dot3 {right: 5px; bottom: 25%;}
.testing .testing_infog_wrapper .dot_warp .dot.dot4 {bottom: -10px; left: 50%; transform: translateX(-50%);}
.testing .testing_infog_wrapper .dot_warp .dot.dot5 {left: 5px; bottom: 25%;}
.testing .testing_infog_wrapper .dot_warp .dot.dot6 {left: 5px; top: 25%;}
.testing .testing_infog_wrapper .dot_warp .dot .marker {cursor: pointer; border-radius: 50%; position: relative;}
.testing .testing_infog_wrapper .dot_warp .dot .marker span {display: inline-block; width: 10px; height: 10px; background: #fff; border-radius: 50%; z-index: 2; position: relative;}
.testing .dot_warp .dot .marker:before,
.testing .dot_warp .dot .marker:after{display: block;content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%; background:#cacbcc; opacity:0; transition:0.3s;  z-index: 1;}
.testing .dot_warp .dot.dot1 .marker:hover::before, 
.testing .dot_warp .dot.dot1 .marker:hover::after {background:#568e9c;}
.testing .dot_warp .dot.dot2 .marker:hover::before, 
.testing .dot_warp .dot.dot2 .marker:hover::after {background:#436d81;}
.testing .dot_warp .dot.dot3 .marker:hover::before, 
.testing .dot_warp .dot.dot3 .marker:hover::after {background:#294861;}
.testing .dot_warp .dot.dot4 .marker:hover::before, 
.testing .dot_warp .dot.dot4 .marker:hover::after {background:#406681;}
.testing .dot_warp .dot.dot5 .marker:hover::before, 
.testing .dot_warp .dot.dot5 .marker:hover::after {background:#56839c;}
.testing .dot_warp .dot.dot6 .marker:hover::before, 
.testing .dot_warp .dot.dot6 .marker:hover::after {background:#558e9b;}
.testing .dot_warp .dot .marker:before{animation:marker_motion 3s ease-in infinite 0s;}
.testing .dot_warp .dot .marker:after{animation:marker_motion 3s ease-in infinite 1s;}
@keyframes marker_motion{
	0%{
		opacity:0.1;
		width:10px;height:10px;
	}
	50%{
		opacity:0.9;
	}
	100%{
		opacity:0;
		width:60px;height:60px;
	}
}
.testing .testing_infog_wrapper .dot_warp .dot .bubble {background: #568e9c; padding: 32px 30px 35px; border-radius: 5px; width: 350px; margin-top: 50px; box-shadow: 4px 13px 24px 0px rgb(0 0 0 / 25%); position: absolute; left: 50%; transform: translate(-50%, 10px); opacity: 0; transition: all 0.3s;}
.testing .testing_infog_wrapper .dot_warp .dot .bubble::before {content: ''; display: inline-block; width: 0px; height: 0px; border-bottom: 12px solid #568e9c; border-left: 13px solid transparent; border-right: 13px solid transparent; position: absolute; top: -12px; left: 50%; transform: translateX(-50%);}
.testing .testing_infog_wrapper .dot_warp .dot4 .bubble {bottom: 70px;}
.testing .testing_infog_wrapper .dot_warp .dot4 .bubble::before {border-top: 12px solid #568e9c; border-bottom: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; bottom: -12px; top: auto;}

.testing .testing_infog_wrapper .dot_warp .dot .marker:hover ~ .bubble {opacity: 1; transform: translate(-50%, 0); transition: all 0.3s;}

.testing .testing_infog_wrapper .dot_warp .dot .bubble .f18 {color:#fff; text-align: left; margin-bottom: 10px;}
.testing .testing_infog_wrapper .dot_warp .dot .bubble ul li {position: relative;}
.testing .testing_infog_wrapper .dot_warp .dot .bubble ul li .f16 {color:#fff; text-align: left; padding-left: 12px; line-height: 26px;}
.testing .testing_infog_wrapper .dot_warp .dot .bubble ul li .f16::before {content: ''; width: 3px; height: 3px; background: rgb(255 255 255 / 20%); position: absolute; left: 0; top: 11px;}
.testing .testing_infog_wrapper .box {display: flex; justify-content: center; align-items: center; position: relative; width: 100%; max-width: 811px; margin: 0 auto;}
.testing .testing_infog_wrapper .box img {max-width: 811px;}
.testing .testing_infog_wrapper .box .element {position: absolute; top: 0; left: 0;}
.testing .testing_infog_wrapper .box .bg {}
.testing .testing_infog_wrapper .box .arrow_bg {}
.testing .testing_infog_wrapper .box .arrow {}
.testing .testing_infog_wrapper .box .txt {}
.testing .testing_infog_wrapper .box .title {top: 50%; left: 50%; transform: translate(-50%, -50%);}
.testing .testing_infog_wrapper .box .title .circle_box {width: 251px; height: 251px; background: #fff; border-radius: 50%; box-shadow: 4px 4px 24px 0px rgb(0 0 0 / 6%); display: flex; justify-content: center; align-items: center;}
.testing .testing_infog_wrapper .box .title .circle_box .f24 {color: #457084; line-height: 32px; font-weight: 700;}

.testing .sec4 {margin-top: 200px; margin-bottom: 150px; }
.testing .testing_swiper {}
.testing .testing_swiper .testing_slide .box .txt {height: 56px; display: flex; justify-content: center; align-items: center;}
.testing .testing_swiper .testing_slide .box .txt .f18 {color:#fff;}
.testing .testing_swiper .testing_slide .box.box1 .txt, .testing .testing_swiper .testing_slide .box.box2 .txt {background: #558e9b;}
.testing .testing_swiper .testing_slide .box.box3 .txt {background: #56839c;}
.testing .testing_swiper .testing_slide .box.box4 .txt {background: #406681;}
.testing .testing_swiper .testing_slide .box.box5 .txt {background: #294861;}
.testing .testing_swiper .testing_slide .box.box6 .txt, .testing .testing_swiper .testing_slide .box.box7 .txt {background: #436d81;}
.testing .testing_swiper .testing_slide .box.box8 .txt {background: #568e9c;}
.testing .sec5 {text-align: center; background: #f9f9f9; padding-top: 160px;}
.testing .sec5 .tab {display: flex; justify-content: center; margin: 100px 0 120px;}
.testing .sec5 .tab li {width: 50%; cursor: pointer;}
.testing .sec5 .tab li a {width: 100%; height: 75px; display: flex; justify-content: center; align-items: center; border: 1px solid #ddd;}
.testing .sec5 .tab li a.f20 {font-weight: 500;}
.testing .sec5 .tab li a.f20:hover {border: 1px solid #333; font-weight: 700;}
.testing .sec5 .tab li a.f20.active {background: #333; border: 1px solid #333; color:#fff;}
.testing .sec5 .tab li a.f20.active:hover {font-weight: 500;}
.testing .sec5 .tab_con {display: none;}
.testing .sec5 .tb1 tbody td:nth-child(1), .testing .sec5 .tb1 tbody td:nth-child(2) {background-color: #f2f2f2;}
.testing .sec5 .tb1 tbody td:nth-child(2) {font-weight: 700;}
.testing .sec6 {background: #f9f9f9; padding-top: 120px;}
.testing .validation_wrap {display: flex;}
.testing .validation_wrap .box {margin: 0 11px;}
.testing .validation_wrap .box:first-child {margin-left: 0;}
.testing .validation_wrap .box:last-child {margin-right: 0;}
.testing .validation_wrap .box .image100 {}
.testing .validation_wrap .box .image100 img {}
.testing .validation_wrap .box .txt {border: 1px solid #eee; padding: 18px 30px; background: #fff;}
.testing .validation_wrap .box .txt .f14 {font-weight: 700; color:#a39d97; line-height: 20px;}
.testing .validation_wrap .box .txt .f20 {font-weight: 700; line-height: 30px;}
.testing .sec7 {background: #f9f9f9; padding: 110px 0 150px;}
.testing .testing_tab {border-bottom: 1px solid #ddd;}
.testing .testing_tab .contents_wrapper {display: flex; align-items: center;}
.testing .testing_tab li {color:#999; font-weight: 700; list-style: none; flex: 1 1 33.3%; text-align: center; padding: 20px 10px; cursor: pointer;}
.testing .testing_tab li.on {color:#222; border-bottom: 2px solid #222;}
.testing .testing_tab li:hover {color:#222;}
.testing .testing_tab_con {display: none;}
.testing .testing_tab_con .title {text-align: center; margin: 80px 0 90px;}
.testing .testing_tab_con .title .f28 {font-weight: 700; margin-bottom: 25px;}
.testing .testing_tab_con .title .f20 {color:#888; font-weight: 500;}
.testing .testing_tab_con .con_wrap {display: flex;}
.testing .testing_tab_con .con_wrap .box {margin: 0 10px; border: 1px solid #eee;}
.testing .testing_tab_con .con_wrap .box:first-child {margin-left: 0;}
.testing .testing_tab_con .con_wrap .box:last-child {margin-right: 0;}
.testing .testing_tab_con1 .con_wrap .box {width: 50%; background: #fff;}
.testing .testing_tab_con .con_wrap .box .image100 {}
.testing .testing_tab_con .con_wrap .box .text {border-top: 1px solid #eee; padding: 20px 25px; background: #fff;}
.testing .testing_tab_con .con_wrap .box .text .f14 {font-weight: 700; color:#a39d97; line-height: 20px;}
.testing .testing_tab_con .con_wrap .box .text .f20 {color:#222; font-weight: 700; line-height: 28px;}
.testing .testing_tab_con3 .tb1 table tbody tr td:nth-child(1) {padding: 40px; background-color: #f2f2f2;}

.testing .testing_infog_wrapper.m {display: none;  flex-flow: wrap;}
.testing .testing_infog_wrapper.m .m_box {background: #f7f7f7; text-align: left; padding: 25px 30px; border-radius: 20px; margin: 0 4px 8px; flex: 1 1 calc(50% - 8px);}
.testing .testing_infog_wrapper.m .m_box:first-child {margin-left: 0;}
.testing .testing_infog_wrapper.m .m_box:last-child {margin-right: 0;}
.testing .testing_infog_wrapper.m .m_box .title {margin-bottom: 6px;}
.testing .testing_infog_wrapper.m .m_box .title .f14 {color: #568f9c; font-weight: 600;}
.testing .testing_infog_wrapper.m .m_box .title .f32 {color:#222; font-weight: 700;}
.testing .testing_infog_wrapper.m .m_box .txt {}

.testing .testing_infog_wrapper.m .m_box .txt ul li {position: relative;}
.testing .testing_infog_wrapper.m .m_box .txt ul li .f16 {color:#222; text-align: left; padding-left: 12px; line-height: 26px;}
.testing .testing_infog_wrapper.m .m_box .txt ul li .f16::before {content: ''; width: 3px; height: 3px; background: rgb(0 0 0 / 20%); position: absolute; left: 0; top: 11px;}


/** IR 정보 - 공지사항 - list **/
.notice_list .list_wrap {margin-top: 50px; margin-bottom: 140px; border-top: 2px solid #222;}
.notice_list .list_wrap .item {display: flex; align-items: flex-start; padding: 50px 30px; border-bottom: 1px solid #e5e5e5; transition: all 0.3s;}
.notice_list .list_wrap .item .cate {width: 100px;}
.notice_list .list_wrap .item .txt_con {width: calc(100% - 100px);}
.notice_list .list_wrap .item .txt_con .f26 {display: inline-block; width: 100%; white-space: nowrap;  overflow: hidden; text-overflow: ellipsis; transition: all 0.3s;}
.notice_list .list_wrap .item .txt_con .f20 {color:#888; font-weight: 400; display: inline-block; width: 100%; white-space: nowrap;  overflow: hidden; text-overflow: ellipsis; margin: 10px 0 20px; transition: all 0.3s;}
.notice_list .list_wrap .item .txt_con .f16 {color:#bbb;}
.notice_list .list_wrap .item:hover {background: #f9f9f9; transition: all 0.3s;}
.notice_list .list_wrap .item:hover .txt_con .f26 {color:#112e57; transition: all 0.3s;}
.notice_list .list_wrap .item:hover .txt_con .f20 {color:#333; transition: all 0.3s;}


/** IR 정보 - 주가정보/공시 **/
.stock_disclosure .tab {display: flex; justify-content: center; margin-bottom: 100px;}
.stock_disclosure .tab li a {width: 280px; height: 75px; display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #ddd;}
.stock_disclosure .tab li a.f24 {font-weight: 500;}
.stock_disclosure .tab li a.f24:hover {border: 1px solid #333; font-weight: 700;}
.stock_disclosure .tab li a.f24.active {background: #333; border: 1px solid #333; color:#fff;}
.stock_disclosure .tab li a.f24.active:hover {font-weight: 500;}


/** IR 정보 - 주가정보/공시 - 주가정보 **/
.stock_price .top_info {margin-bottom: 45px;}
.stock_price .top_info .f20 {margin-bottom: 15px; color:#444;}
.stock_price .top_info .figure {display: flex; justify-content: space-between; align-items: flex-end;}
.stock_price .top_info .figure .left {display: flex; align-items: flex-end;}
.stock_price .top_info .figure .left .f80 {color:#3364e1;}
.stock_price .top_info .figure .left ul {display: flex; align-items: center; margin-bottom: 10px; margin-left: 35px;}
.stock_price .top_info .figure .left ul li {}
.stock_price .top_info .figure .left ul li.divider {margin: 0 15px;}
.stock_price .top_info .figure .left ul li span {color:#444;}
.stock_price .top_info .figure .left ul li span.number {font-weight: 700; color:#3364e1; margin-left: 12px;}
.stock_price .top_info .figure .right {margin-bottom: 10px;}
.stock_price .sec5 {display: flex; margin-top: 80px;}
.stock_price .sec5 .left {width: 55%;}
.stock_price .sec5 .right {width: 45%; padding-left: 40px;}
.stock_price .sec5 .left .tb1 th {text-align: left;}
.stock_price .sec5 .left .tb1 td {text-align: right;}
.stock_price .sec5 .left .tb1 .title {font-weight: 700; text-align: left;}
.stock_price .sec5 .right .tb1 td {text-align: right;}
.stock_price .sec6 {margin-top: 80px;}
.stock_price .sec6 .tb1 td {width: 12.5%;}


/** IR 정보 - 주가정보/공시 - 공시 **/
.disclosure .list_wrap {margin-top: 25px; margin-bottom: 140px;}
.disclosure .list_wrap {border-top:2px solid #aaa;}
.disclosure .list_wrap table {width: 100%;}
.disclosure .list_wrap table th {font-size:20px; font-weight: 700; color: #222; padding: 37px 0; border-bottom: 1px solid #e1e1e1;}
.disclosure .list_wrap table td {border-bottom: 1px solid #e5e5e5; font-weight: 400; font-size:20px; color: #222; text-align: center; padding: 37px 0;}
.disclosure .list_wrap table td.title {text-align: left;}
.disclosure .list_wrap table td.date {color:#999; white-space: nowrap;}
.disclosure .list_wrap table td a {display:inline-block; color: #222; font-weight: 700; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 750px;}
.disclosure .list_wrap table td a:hover {color:#12458e;}


/** IR 정보 - 재무정보 **/
.financial .f18 {text-align: right; margin-bottom: 6px; color:#888;}
.financial .tb1 table thead th span {display: block;}
.financial .tb1 table tbody td {text-align: right;}
.financial .tb1 table tbody td.left {text-align: left;}
.financial .tb1 table tbody td.left span {margin-left: 16px;}
.financial .sec3 .tb1 table thead th {height: 100px;}
.financial .sec3 .tb1 table thead .seg th, .financial .sec4 .tb1 table thead .seg th {height: 50px;}
.financial .sec4 .tb1 table thead th {height: 120px;}
.financial .sec4 {margin-top: 120px;}


/** 주요고객사 **/
.client .tab {display: flex; justify-content: center; margin-bottom: 100px; width: 100%;}
.client .tab li {width: 50%; }
.client .tab li a {width: 100%; height: 75px; display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #ddd;}
.client .tab li a.f20 {font-weight: 500;}
.client .tab li a.f20:hover {border: 1px solid #333; font-weight: 700;}
.client .tab li a.f20.active {background: #333; border: 1px solid #333; color:#fff;}
.client .tab li a.f20.active:hover {font-weight: 500;}
.client .sec4 {padding: 100px 0 120px; background: #f9f9f9;}
.client .sec4 .image100 img {max-width: 1400px;}
.client .sec5 {padding-top: 120px;}
.client .sec5 .f40 {text-align: center; margin-bottom: 80px; font-weight: 700;}
.client .client_box_wrap {display: flex; flex-flow: wrap;  border-left: 1px solid #e5e5e5;  border-top: 1px solid #e5e5e5;}
.client .client_box_wrap li {flex: 0 1 25%; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; position: relative; height: 120px;}
.client .client_box_wrap li:hover {border: 1px solid #776758;}
.client .client_box_wrap li a {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;}
.client .client_box_wrap li .image100 {opacity: 1; transition: all 0.3s;}
.client .client_box_wrap li:hover .image100 {opacity: 0; transition: all 0.3s;}
.client .client_box_wrap li .image100 img {max-width: 250px;}
.client .client_box_wrap li .hover {display: flex; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: all 0.3s;}
.client .client_box_wrap li:hover .hover {opacity: 1; transition: all 0.3s;}
.client .client_box_wrap li .hover .txt {display: flex; align-items: center; height: 40px;}
.client .client_box_wrap li .hover .txt .com {font-weight: 700; color:#776758; padding-left: 10px;  white-space:nowrap;}
.client .client_box_wrap li .hover .txt .location {display: inline-block; font-weight: 400; color:#888; border-right: 1px solid #e5e5e5; line-height: 18px; padding-right: 10px; white-space:nowrap;}
.client .client_box_wrap li .hover .icon {width: 40px; height: 40px; border-radius: 50%; background: #776758; display: flex; justify-content: center; align-items: center; margin-left: 20px; flex-shrink: 0;}
.client .client_box_wrap li .hover .icon img {max-width: 10px;}





/* 20230103 수정 - 시작 */
.client .sec4 .image100.m {display: none;}

/* 20230103 수정 - 끝 */










@media (max-width: 1750px) {
    .greeting .sec3 {margin-left: 6vw; padding: 100px 10vw;}
    .greeting .sec3 .right {right: 2vw;}
    .greeting .sec4 .txt_box {margin-left: 15vw;}
    .ev .item_wrap .item.item5.on .line_wrap .line3 {width: 30vw;}
    .ev .item_wrap .item.item5 .line_wrap .line4 {left: calc(30vw - -280px);}
    .lightweight .item_wrap .item.item5.on .line_wrap .line2 {width: 17vw;}
    .lightweight .item_wrap .item.item5 .line_wrap .line3 {left: calc(17vw - 2px);}
    .lightweight .item_wrap .item.item4.on .line_wrap .line1 {width: 5vw;}
}


@media (max-width: 1600px) {
    .greeting .sec2 .f28 {line-height: 40px;}
    .product .sec_box_wrap .box.box1 {top: 90px; left: 10px;}
    .product .sec_box_wrap .box.box2 {top: 90px; right: 50px;}
    .product .sec_box_wrap .box.box3 {bottom: 90px; left: 10px;}
    .product .sec_box_wrap .box.box4 {bottom: 90px; right: 460px;}
    .product .sec_box_wrap .box.box5 {bottom: 90px; right: 50px;}
    .engine .item_wrap .item.item5.on .line_wrap .line2 {width: 20vw;}
    .engine .item_wrap .item.item5 .line_wrap .line3 {left: calc(20vw - 2px);}
}



@media (max-width: 1440px) { 
    .greeting .sec3 {height: 580px;}
    .greeting .sec3 .right .image100 { justify-content: flex-end;}
    .greeting .sec3 .right .image100 img {width: 90%;}
    .greeting .sec3 .left .signature {margin-top: 40px;}
    .greeting .sec3 .left .signature .text .f20 {margin-bottom: 2px;}
    .greeting .sec3 .left .signature .sign img {width: 90%;}
    .workplace .workplace_wrap .map iframe {height: 500px;}
    .workplace .workplace_wrap .map .map_title {height: 100px;}
    .workplace .workplace_wrap .map .map_title .f48 {bottom: -5px;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail3 li {flex: 1 1 100%;}
    .gallery_list .list_wrap .item {margin: 0 20px 100px;}
    .notice_list .list_wrap .item {padding: 40px 30px;}
    .notice_list .list_wrap {margin-bottom: 100px;}
    .board_detail .attached_file {padding: 32px 30px;}
    .disclosure .list_wrap {margin-bottom: 100px;}
    .product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet {width: 80px; height: 80px;}
    .product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet img {width: 80px; height: 80px;}
    .product .pop_box .right_con .con_box .advantage li {height: 100px;}
    .product .tab {margin-bottom: 60px;}
    .product .sec4 {margin-bottom: 80px;}
    .product .sec4 .f18 {margin-top: 30px;}
    .product .product_img {left: -4vw;}
    .casting .casting_acco_wrap .acco_box .cont_box .text .img_txt .inner_txt {margin-left: 20px;}
    .casting .advatages_box .box_warp.bt_box .box {padding: 30px 30px;}
    .test_ev .test_sec .box_wrap .box {margin: 0 5px 10px; flex: 0 1 calc(33.3% - 7px);}
    .design .sec5 .card {width: 380px; height: 200px; overflow: hidden;}
    .design .sec5 .tool_wrap {padding: 30px 0 0 35px;}
    .design .sec5 .tool_wrap .text {width: 70%;}
    .design .sec5 .tool_wrap .capability_img .image100 img {max-width: 460px; margin-top: 10px;}
    .design .sec5 .measurement_tools {padding-top: 64px;}
    .design .sec5 .measurement_wrap .tool_wrap {padding: 30px 35px 50px;}
    .design .brick_wrapper .brick_con .brick {padding: 30px 25px;}
    .design .sec6 {margin-top: 100px; margin-bottom: 110px;}
    .design .sec6 .capability_swiper {margin-top: 30px;}
    .design .sec7 .f32 {margin-bottom: 60px;}
    .design .sec7 .cadcae_wrap .box .left .image100 {width: 130px; height: 160px;}
    .design .sec7 .cadcae_wrap .box .right {padding-left: 30px;}
    .design .sec7 .cadcae_wrap .box .right .title {margin-bottom: 15px;}
    .testing .testing_infog_wrapper {padding-top: 0;}
    .testing .sec4 {margin-top: 150px;}
    .testing .sec5 {padding-top: 100px;}
    .testing .sec5 .tab {margin: 60px 0 80px;}
    .testing .testing_infog_wrapper .dot_warp .dot .bubble {width: 300px;}
    .testing .sec2.sub_title {margin: 120px 0 80px;}
    .machining .cardbox_wrap .box {padding: 35px 30px;}
    .machining .cardbox_wrap .box .txt{margin-left: 30px;}
    .machining .table_wrap .half {margin: 0 20px;}
    .machining .table_wrap .left {margin-left: 0;}
    .machining .table_wrap .right {margin-right: 0;}
    .machining .table_wrap .half .f24 {margin-bottom: 16px;}
    .machining .sec5 {margin: 100px 0 120px;}
    .machining .sec5 .f32 {margin-bottom: 40px;}
    .machining .automation_wrap .box {margin: 0 10px;}
    .machining .sec6 .f32 {margin-bottom: 50px;}
    .client .sec5 .f40 {margin-bottom: 60px;}
    .client .client_box_wrap li .hover .txt {flex-flow: column; align-items: flex-start;}
    .client .client_box_wrap li .hover .txt .location {border: none;}
    .client .client_box_wrap li .hover .txt .com {padding-left: 0;}
    .client .client_box_wrap li .hover .icon {margin-left: 10px;}

    /* 20230103 수정 - 시작 */
    .product .product_img {background-size: 60% !important; height: 500px;}
    .product .sec_box_wrap .box.on .pd_box_img {padding: 10px;}
    .product .sec_box_wrap .box.on .info_txt {padding: 15px 20px;}
    .lightweight .item_wrap .item1 {bottom: 283px; left: 438px;}
    .lightweight .item_wrap .item2 {bottom: 283px; left: 934px;}
    .lightweight .item_wrap .item3 {bottom: 175px; left: 695px;}
    .lightweight .item_wrap .item4 {bottom: 271px; left: 764px;}
    .lightweight .item_wrap .item5 {bottom: 326px; left: 893px;}
    .engine .item_wrap .item1 {bottom: 385px; left: 545px;}
    .engine .item_wrap .item2 {bottom: 342px; left: 860px;}
    .engine .item_wrap .item3 {bottom: 260px; left: 724px;}
    .engine .item_wrap .item4 {bottom: 300px; left: 865px;}
    .engine .item_wrap .item5 {bottom: 333px; left: 818px;}
    .etc .item_wrap .item1 {bottom: 285px; left: 510px;}
    .etc .item_wrap .item2 {bottom: 225px; left: 590px;}
    .etc .item_wrap .item3 {bottom: 435px; left: 853px;}
    .etc .item_wrap .item4 {bottom: 310px; left: 820px;}
    .etc .item_wrap .item5 {bottom: 370px; left: 790px;}
    .product .sec_box_wrap .box.box1 {top: 120px; left: 10px;}
    .product .sec_box_wrap .box.box2 {top: 120px; right: 50px;}
    .product .sec_box_wrap .box.box3 {bottom: 10px; left: 10px;}
    .product .sec_box_wrap .box.box4 {bottom: 10px; right: 460px;}
    .product .sec_box_wrap .box.box5 {bottom: 10px; right: 50px;}
    /* 20230103 수정 - 끝 */

    /* 20230106 수정 - 시작 */
    .product.ev .product_img {background-size: 65% !important; height: 600px;}
    .ev .item_wrap .item1 {bottom: 280px; left: 478px;}
    .ev .item_wrap .item2 {bottom: 272px; left: 585px;}
    .ev .item_wrap .item3 {bottom: 255px; left: 715px;}
    .ev .item_wrap .item4 {bottom: 232px; left: 500px;}
    .ev .item_wrap .item5 {bottom: 220px; left: 543px;}
    .product.ev .sec_box_wrap .box.box1 {top: 220px; left: 10px;}
    .product.ev .sec_box_wrap .box.box2 {top: 220px; right: 50px;}
    .product.ev .sec_box_wrap .box.box3 {bottom: 10px; left: 10px;}
    .product.ev .sec_box_wrap .box.box4 {bottom: 10px; right: 460px;}
    .product.ev .sec_box_wrap .box.box5 {bottom: 10px; right: 50px;}

    .ev .item_wrap .item.item1 .line_wrap {right: 4px; bottom: auto; top: 40px;}
    .ev .item_wrap .item.item1 .line_wrap .line1 {}
    .ev .item_wrap .item.item1 .line_wrap .line2 {bottom: 0; top: auto;}
    .ev .item_wrap .item.item1.on .line_wrap .line1 {height: 20px;}
    .ev .item_wrap .item.item1.on .line_wrap .line2 {}
    .ev .item_wrap .item.item1.on .line_wrap .pointer {bottom: auto; top: 0; right: -2px;}
    .ev .item_wrap .item.item2.on .line_wrap .line1 {height: 80px;}
    .ev .item_wrap .item.item2.on .line_wrap .line2 {width: 520px;}
    .ev .item_wrap .item.item3.on .line_wrap .line1 {width: 40px;}
    .ev .item_wrap .item.item3.on .line_wrap .line2 {height: 70px;}
    .ev .item_wrap .item.item3 .line_wrap .line3 {top: 68px; right: 40px; transition-delay: 0.1s;transition: all 0.3s;}
    .ev .item_wrap .item.item3 .line_wrap .line3::after {content: ''; width: 2px; height: 0; position: absolute; background: #1b42e8; top: 0; left: 0;     transition: all 0.3s;}
    .ev .item_wrap .item.item3.on .line_wrap .line3::after {height: 30px; transition: all 0.3s; transition-delay: 1.3s;}
    .ev .item_wrap .item.item4.on .line_wrap .line2 {width: 200px;}
    .ev .item_wrap .item.item5 .line_wrap .line2 {top: 0; bottom: auto;}
    .ev .item_wrap .item.item5.on .line_wrap .line2 {height: 30px;}
    .ev .item_wrap .item.item5 .line_wrap .line3 {top: 28px;}
    .ev .item_wrap .item.item5.on .line_wrap .line3 {width: 20vw;}
    .ev .item_wrap .item.item5 .line_wrap .line4 {top: 28px; left: calc(20vw - -280px);}
    .ev .item_wrap .item.item5.on .line_wrap .line4 {height: 40px;}

    .lightweight .item_wrap .item.item2.on .line_wrap .line2 {width: 170px;}
    .lightweight .item_wrap .item.item3 .line_wrap .line3 {top: 248px; right: 228px;}
    .lightweight .item_wrap .item.item3.on .line_wrap .line1 {width: 230px;}
    .lightweight .item_wrap .item.item3.on .line_wrap .line2 {height: 250px;}
    .lightweight .item_wrap .item.item3.on .line_wrap .line3 {width: 40px;}
    .lightweight .item_wrap .item.item4.on .line_wrap .line1 {width: 30px;}
    .lightweight .item_wrap .item.item4.on .line_wrap .line2 {height: 120px;}
    .lightweight .item_wrap .item.item5 .line_wrap .line3 {top: 110px;}
    .lightweight .item_wrap .item.item5.on .line_wrap .line1 {height: 110px;}
    

    .engine .item_wrap .item.item4 .line_wrap {top: 15px; right: 30px;}
    .engine .item_wrap .item.item5 .line_wrap {top: 30px;}

    .engine .item_wrap .item.item1.on .line_wrap .line1 {height: 110px;}
    .engine .item_wrap .item.item3.on .line_wrap .line1 {width: 260px;}
    .engine .item_wrap .item.item3.on .line_wrap .line2 {height: 330px;}
    .engine .item_wrap .item.item3 .line_wrap .line3 {top: 328px; right: 260px;}
    .engine .item_wrap .item.item3.on .line_wrap .line3 {width: 40px;}
    .engine .item_wrap .item.item4.on .line_wrap .line1 {width: 85px;}
    .engine .item_wrap .item.item5.on .line_wrap .line1 {height: 130px;}
    .engine .item_wrap .item.item5 .line_wrap .line3 {top: 130px;}
    .engine .item_wrap .item.item5.on .line_wrap .line3 {height: 25px;}


    
    .etc .item_wrap .item.item2.on .line_wrap .line1 {width: 40px;}
    .etc .item_wrap .item.item2 .line_wrap .line2 {bottom: 0; top: auto;}
    .etc .item_wrap .item.item2.on .line_wrap .line2 {height: 30px;}
    .etc .item_wrap .item.item2 .line_wrap .line3 {top: -28px; left: 40px;}
    .etc .item_wrap .item.item2.on .line_wrap .line3 {width: 430px;}


    .etc .item_wrap .item.item2.on .line_wrap .line2 {}
    .etc .item_wrap .item.item2.on .line_wrap .line3 {}
    .etc .item_wrap .item.item3.on .line_wrap .line1 {width: 380px;}
    .etc .item_wrap .item.item3 .line_wrap .line3 {right: 378px;}
    .etc .item_wrap .item.item3.on .line_wrap .line3 {width: 70px;}
    .etc .item_wrap .item.item4.on .line_wrap .line1 {width: 60px;}
    .etc .item_wrap .item.item4.on .line_wrap .line2 {height: 150px;}
    .etc .item_wrap .item.item4.on .line_wrap .line3 {display: none;}
    .etc .item_wrap .item.item5.on .line_wrap .line1 {width: 60px;}
    .etc .item_wrap .item.item5 .line_wrap .line3 {left: 60px; top: 183px;}
    .etc .item_wrap .item.item5.on .line_wrap .line2 {height: 185px;}
    .etc .item_wrap .item.item5.on .line_wrap .line3 {width: 280px;}
    .etc .item_wrap .item.item5 .line_wrap .line4 {top: 183px; left: 338px;}
    /* 20230106 수정 - 끝 */

}



@media (max-width: 1300px) { 
    /* 20230106 수정 - 시작 */
    .lightweight .product_img {background-size: 50% !important; left: -8vw;}
    .lightweight .item_wrap .item1 {left: 483px;}
    .lightweight .item_wrap .item2 {left: 892px;}
    .lightweight .item_wrap .item3 {bottom: 184px;}
    .lightweight .item_wrap .item4 {bottom: 270px; left: 756px;}
    .lightweight .item_wrap .item5 {bottom: 314px; left: 860px;}
    .lightweight .item_wrap .item.item4.on .line_wrap .line1 {width: 15px;}
    .lightweight .item_wrap .item.item3.on .line_wrap .line1 {width: 180px;}
    .lightweight .item_wrap .item.item3 .line_wrap .line3 {right: 178px;}
    /* 20230106 수정 - 끝 */
}


@media (max-width: 1250px) { 
    /* 20230106 수정 - 시작 */
    .lightweight .product_img {left: -8vw;}
    .etc .product_img {left: -7vw;}
    .etc .item_wrap .item.item3.on .line_wrap .line1 {width: 355px;}
    .etc .item_wrap .item.item3 .line_wrap .line3 {right: 353px;}
    .etc .item_wrap .item.item3.on .line_wrap .line3 {width: 60px;}
    /* 20230106 수정 - 끝 */

}







@media (max-width: 1200px) { 
    .product .sec_box_wrap {display: none;}
    /* 20230103 수정 - 시작 */
    .product .product_img {left: 50% !important; transform: translateX(-50%) !important;}
    .product .item_wrap .item .line_wrap {display: none;}
    .lightweight .item_wrap .item .line_wrap {display: none;}
    /* 20230103 수정 - 끝 */


}


@media (max-width: 1199px) { 
    .greeting .sec2 .f28 {line-height: 36px;}
    .greeting .sec4 .txt_box {padding: 80px 80px 0;}
    .greeting .sec4 .txt_box .f20 {line-height: 32px; margin-bottom: 30px;}
    .history .sec3 .right {padding-top: 40px;}
    .history .sec3 .right .box {margin-bottom: 30px;}
    .history .sec3 .right .box ul {margin-top: 12px;}
    .history .sec3 .right .box ul li {margin-bottom: 2px;}
    .history .sec3 .left .f40 {letter-spacing: 4px;}
    .history .sec3 .right .box ul li::before {margin-top: 10px;}
    .workplace .sec3, .workplace .sec4 {margin-bottom: 150px;}
    .workplace .workplace_wrap .map iframe {height: 450px;}
    .workplace .workplace_wrap .map .map_title {height: 80px;}
    .workplace .workplace_wrap .map .map_title .f48 {padding: 0 16px;}
    .workplace .workplace_wrap .map_info_txt .left {padding: 20px 16px 0;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail1 {padding-bottom: 20px;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail2 {padding: 30px 0;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail3 li span.f20.title {width: 80px; height: 38px; margin-right: 20px;}
    .workplace .workplace_wrap .map_info_txt .left ul li {margin-bottom: 10px;}
    .gallery_list .list_wrap .item {margin: 0 20px 80px;}
    .gallery_list .list_wrap .item .txt {margin-top: 30px;}
    .gallery_list .list_wrap .item .txt .f20 {margin-top: 10px;}
    .gallery_list .list_wrap .item .txt .f16 {margin-top: 20px;}
    .board_detail .bd_title {padding: 30px 0;}
    .board_detail .bd_con {padding: 50px 0;}
    .board_detail .list_btn .f24 {max-width: 220px; height: 60px;}
    .board_detail .attached_file {padding: 22px 20px;}
    .notice_list .list_wrap .item {padding: 30px 20px;}
    .notice_list .list_wrap .item .txt_con .f20 {margin: 2px 0 6px;}
    .client .tab {margin-bottom: 60px;}
    .client .tab li a {height: 65px;}
    .stock_disclosure .tab {margin-bottom: 60px;}
    .stock_disclosure .tab li a {width: 250px; height: 65px;}
    .stock_price .top_info .f20 {margin-bottom: 6px;}
    .stock_price .sec5 .right {padding-left: 20px;}
    .disclosure .list_wrap table th, .disclosure .list_wrap table td {font-size: 18px; padding: 30px 0;}
    .disclosure .list_wrap table td a  {max-width: 600px;}
    .disclosure .list_wrap {margin-bottom: 80px;}
    .financial .sec4 {margin-top: 80px;}
    .product .tab {width: 100%;}
    .product .tab li {width: 25%;}
    .product .tab li a {height: 60px; width: 100%;}
    .product .pop_box .right .pop_con_wrap .left_con {padding: 0 20px;}
    .product .pop_box .right_con .con_box {padding: 40px 30px;}
    .product .pop_box .right_con .con_box .advantage li {margin: 0 4px 8px; flex: 0 1 calc(50% - 4px);}
    .product .pop_box .right .title {padding: 0 25px;}
    .txt_block span {display: inline;}
    .product .sec5 {padding: 0;}
    .product .product_img {left: -16vw; transform: translateX(1%);}
    .etc .sec5 {padding: 60px 0;}
    .casting .tab li a {height: 60px;}
    .casting .left .left_acco_wrap {margin-top: 60px;}
    .casting .casting_acco_wrap .acco_box {margin-bottom: 20px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li .speech_bubble .f20 {padding: 10px 20px;}
    .casting .casting_acco_wrap .acco_box .title_box {height: 70px; padding: 0 20px;}
    .casting .casting_acco_wrap .acco_box .cont_box {padding: 30px 20px 40px;}
    .casting .casting_acco_wrap .acco_box .cont_box .top {margin: 0;}
    .casting .casting_acco_wrap .acco_box .cont_box .text .img_txt {flex-flow: column; justify-content: flex-start; align-items: flex-start; margin-top: 20px;}
    .casting .casting_acco_wrap .acco_box .cont_box .text .img_txt .inner_txt {margin-left: 0; margin-top: 12px;}
    .casting .casting_swiper_wrap .casting_swiper {margin: 0 20px;}
    .casting .advatages_box .box_warp.top_box {margin-bottom: 24px;}
    .casting .advatages_box .box_warp .box {margin: 0 4px;}
    .casting .advatages_box .box_warp.bt_box .box {padding: 22px 25px;}
    .test_ev .test_sec .box_wrap .box {height: 220px; padding: 20px 25px;}
    .test_ev .test_sec .box_wrap .box .img img {max-width: 200px;}
    .design .half_wrap.top .process_box {flex: 1 1 calc(50% - 5px); width: calc(50% - 5px); margin-bottom: 10px;}
    .design .process_box {margin: 0 5px;}
    .design .process_con .inner {margin: 0 50px;}
    .design .process_box .title_box {padding: 0 30px; height: 110px;}
    .design .process_box .title_box .txt {margin-left: 20px;}
    .design .process_con .explanation_box .box {padding: 0 30px;}
    .design .process_con .design_swiper_wrap .design_swiper {padding: 30px 0 25px;}
    .design .process_box.test .process_con .pd {padding: 30px 0 40px;}
    .design .brick_wrapper .brick_top {height: 110px;}
    .design .brick_wrapper .brick_top .top_arrow {width: 70px; height: 70px;}
    .design .brick_wrapper .brick_top .top_arrow img {max-width: 34px;}
    .design .brick_wrapper .brick_con .brick {height: 180px; padding: 25px 22px; margin: 0 5px 10px; flex: 0 1 calc(50% - 5px);}
    .design .sec3 .design_line {top: -10px;}
    .design .process_con .design_slide .image100 {height: 240px;}
    .design .process_con .design_slide .txt {height: 60px; padding: 0 25px;}
    .design .sec4 .small_box_wrap .inner_box {height: 160px;}
    .design .sec4 .brick_wrapper .brick_con .brick {height: 200px;}
    .design .sec4 .small_box_wrap .inner_box {padding: 20px;}
    .design .sec4 .small_box_wrap .inner_box .bt ul li .f20 {font-size: 18px; line-height: 26px;}
    .design .process_con .design_swiper_wrap .swiper_btn {margin-top: 20px;}
    .design .sec5 .card {width: 340px; height: 180px; overflow: hidden;}
    .design .sec5 .tool_wrap {padding: 30px 0 0 35px;}
    .design .sec5 .tool_wrap .text {width: 100%;}
    .design .sec5 .tool_wrap .capability_img .image100 img {max-width: 460px; margin-top: 10px;}
    .design .sec5 .measurement_tools {padding-top: 64px;}
    .design .sec5 .measurement_wrap .tool_wrap {padding: 30px 35px 50px;}
    .design .brick_wrapper .brick_con .brick {padding: 30px 25px;}
    .design .sec5 .tool_wrap .capability_img .image100 img {max-width: 430px;}
    .design .sec7 {padding: 90px 0 100px;}
    .design .sec7 .cadcae_wrap .box .right {padding-left: 20px;}
    .design .sec7 .cadcae_wrap .box .right ul li .icon {margin-right: 10px;}
    .design .sec7 .cadcae_wrap .box .left .image100 {width: 120px; height: 150px;}
    .design .sec7 .cadcae_wrap .box .left .image100 img {max-width: 60px;}
    .testing .sec5 .tab {margin: 60px 0 50px;}
    .testing .sec5 .tab li a {height: 60px;}
    .testing .sec6 {padding-top: 90px;}
    .testing .validation_wrap .box {margin: 0 5px;}
    .testing .validation_wrap .box .txt {padding: 12px 20px;}
    .testing .testing_tab_con .title {margin: 50px 0 40px;}
    .testing .testing_tab_con .title .f28 {margin-bottom: 10px;}
    .testing .testing_tab_con .con_wrap .box {margin: 0 5px;}
    .testing .testing_tab_con3 .tb1 table tbody tr td:nth-child(1) {padding: 20px;}
    .testing .testing_infog_wrapper .dot_warp .dot .bubble {padding: 22px 25px; width: 260px;}
    .machining .cardbox_wrap .box {margin: 0 5px; padding: 20px 22px;}
    .machining .cardbox_wrap .box .txt {margin-left: 20px;}
    .machining .sec4 {margin-top: 100px;}
    .machining .automation_wrap .box {margin: 0 5px;}
    .machining .automation_wrap .box .title {padding: 20px 25px 20px;}
    .machining .automation_wrap .box .txt {padding: 20px 25px 30px;}
    .machining .process_wrap {flex-flow: wrap; align-items: flex-start; justify-content: center; padding-bottom: 0;}
    .machining .process_wrap .box.box3 {margin-bottom: 180px; }
    .machining .process_wrap .box3 .bt_img {left: 30px;}
    .casting .advatages_box .box_warp {flex-flow: wrap;}
    .casting .advatages_box .box_warp .box {flex: 1 1 calc(50% - 8px); margin-bottom: 8px;}
    .casting .advatages_box .box_warp .box:first-child {width: 100%; flex: 1 1 100%;}
    .casting .advatages_box .box_warp.top_box .box .txt {padding: 18px 0;}
    .casting .advatages_box .box_warp.top_box .box .image100 {margin: 30px 0;}
    .client .client_box_wrap li .hover .txt .f18 {font-size: 16px; line-height: 22px;}
}



@media (max-width: 1024px) { 
    .greeting .sec3 {margin-left: 0; padding: 70px 40px; height: 400px;}
    .greeting .sec3 .right .image100 img {width: 100%; max-width: 400px;}
    .greeting .sec4 .txt_box {top: 0; margin-left: 0; padding: 60px 40px;}
    .greeting .sec3 .right {right: 0; bottom: 0;}
    .greeting .sec3 .left .signature {margin-right: 50px;}
    .history .sec3 .history_wrap {margin-bottom: 70px;}
    .history .sec3 .right .box .box_img.first {margin-top: 12px;}
    .workplace .sec3, .workplace .sec4 {margin-bottom: 100px;}
    .workplace .workplace_wrap .map .map_title .f48 {padding: 0;}
    .workplace .workplace_wrap .map_info_txt .left {padding: 0 16px 0 0;}
    .workplace .workplace_wrap .map_info_txt {margin-top: 40px;}
    .workplace .workplace_wrap .map .map_title {max-width: 50vw;}
    .workplace .workplace_wrap .map_info_txt .left ul li {margin-bottom: 6px;}
    .workplace .workplace_wrap .map_info_txt .left ul li span.f20.title {margin-right: 20px;}
    .workplace .workplace_wrap .map iframe {height: 400px;}
    .workplace .workplace_wrap .map_info_txt .left, .workplace .workplace_wrap .map_info_txt .right {width: 50%;}
    .gallery_list .list_wrap {margin-top: 30px;}
    .gallery_list .list_wrap .item {margin: 0 20px 60px;}
    .gallery_list .list_wrap .item .txt {margin-top: 20px;}
    .gallery_list .list_wrap .item .txt .f20 {height: 54px; margin-top: 2px;}
    .gallery_list .list_wrap .item .txt .f16 {margin-top: 10px;}
    .notice_list .list_wrap {margin-top: 30px; margin-bottom: 60px;}
    .notice_list .list_wrap .item .txt_con .f16 {font-size: 14px;}
    .board_detail .attached_file .file_box .icon {margin-top: 5px;}
    .client .tab li a {height: 60px;}
    .stock_disclosure .tab li a {width: 220px; height: 60px;}
    .stock_price .top_info {margin-bottom: 30px;}
    .stock_price .sec5, .stock_price .sec6 {margin-top: 50px;}
    .disclosure .list_wrap {margin-top: 10px;}
    .disclosure .list_wrap table th, .disclosure .list_wrap table td {font-size: 18px; padding: 25px 0;}
    .disclosure .list_wrap table td a  {max-width: 50vw;}
    .disclosure .list_wrap {margin-bottom: 60px;}
    .financial .sec3 .tb1 table thead th {height: 80px;}
    .financial .sec4 .tb1 table thead th {height: 100px;}
    .product .product_popup_wrap {overflow-y: auto; background: #fff;}
    .product .product_popup_wrap::-webkit-scrollbar {width:0; height: 3px;}
    .product .product_popup_wrap::-webkit-scrollbar-thumb {background-color: #e1e1e1; background-clip : padding-box; border: 0 solid transparent;}
    .product .product_popup_wrap::-webkit-scrollbar-track {background:none;}
    .product .product_popup_wrap .pop_box {width: 100%; height: 100% !important;  max-height: 100% !important; left: 50%; margin: 0; top: 0; transform: translate(-50%, 0);}
    .product .pop_box .right .pop_con_wrap {flex-flow: column; height: calc(100% - 116px);}
    .product .pop_box .right .pop_con_wrap .left_con {width: 100%; border-right: 0; border-bottom: 1px solid #e6e6e6; padding: 0 10px 30px;}
    .product .pop_box .right .pop_con_wrap .left_con .controller {padding: 10px 0 0;}
    .product .pop_box .right_con .con_box {padding: 30px 20px;}
    .product .pop_box .right .pop_con_wrap .right_con {overflow: inherit; width: 100%;}
    .product .pop_box .left {display: none;}
    .product .pop_box .right {width: 100%;}
    .product .pop_box .right .m_title {display: block;}
    .product .pop_box .right .title {background: #a09a94; padding: 0; height: 60px;}
    .product .pop_box .right .title .pc {display: none;}
    .product .pop_box .right .title .m {width: 360px; height: 100%; display: flex; align-items: center; background: #88827d; padding: 0 16px;} 
    .product .pop_box .right .title .m .f24 {color:#fff;}
    .product .pop_box .right .title .close_btn {margin-right: 16px;}
    .product .pop_box .right .title .close_btn::after {font-size: 50px; color:#fff;}
    
    .casting .tab {margin-bottom: 60px;}
    .casting .casting_acco_wrap {margin-top: 80px;}
    .casting .left .left_acco_wrap {margin-top: 40px;}
    .casting .right .img_view_wrap .item_thum .item img {max-width: 80px;}
    .casting .casting_acco_wrap .acco_box .cont_box .text .f18 span {display: inline;}
    .casting .casting_acco_wrap .acco_box .cont_box .ca_left {padding-right: 30px; padding-top: 0;}
    .casting .casting_acco_wrap .acco_box .cont_box .con_title {padding-bottom: 20px;}
    .casting .casting_acco_wrap .acco_box .cont_box .text {margin-top: 30px;}
    .test_ev .test_sec {margin-bottom: 90px;}
    .design .process_con .explanation_box .box {padding: 0 20px;}
    .design .process_con .inner {margin: 0 30px;}
    .design .process_con .design_swiper_wrap .swiper-button-prev {left: 10px;}
    .design .process_con .design_swiper_wrap .swiper-button-next {right: 10px;}
    .design .process_con .explanation_box .top {height: 120px;}
    .design .process_con .explanation_box .bottom {height: 140px;}
    .design .process_con .design_slide .image100 {height: 200px;}
    .design .brick_wrapper .brick_con .brick {height: 160px; padding: 20px 18px;}
    .design .brick_wrapper .brick_con .brick .f20 {font-size: 16px; line-height: 24px;}
    .design .sec4 .small_box_wrap .inner_box {width: calc(33.3% - 4px); margin: 0 4px;}
    .design .sec4 .small_box_wrap .inner_box .bt ul li .f20 {font-size: 16px; line-height: 24px;}
    .design .sec4 .small_box_wrap .inner_box .bt .image100 img {max-width: 60px;}
    .design .sec5 .half_wrap {flex-flow: column;}
    .design .sec5 .process_box {margin: 0; width: 100%; margin-bottom: 10px;}
    .design .sec5 .measurement_tools {padding-top: 20px;}
    .design .sec5 .tool_wrap {padding: 25px 0  0 0;}
    .design .sec5 .measurement_wrap .tool_wrap {padding: 25px 20px 30px;}
    .design .sec6 {margin-top: 80px; margin-bottom: 90px;}
    .design .sec6 .capability_swiper {margin-top: 10px;}
    .design .sec6 .capa_box .bt_text {padding: 20px 0 5px;}
    .design .sec7 {padding: 80px 0 90px;}
    .design .sec7 .f32 {margin-bottom: 30px;}
    .design .sec7 .cadcae_wrap .box {flex: 0 1 calc(50% - 5px); margin: 0 5px 10px;}
    .design .sec7 .cadcae_wrap .box .right .title {margin-bottom: 10px;}
    .design .sec7 .cadcae_wrap .box .right ul li .icon {width: 20px; height: 20px;}
    .design .sec7 .cadcae_wrap .box .left .image100 {width: 100px; height: 130px;}
    .design .sec7 .cadcae_wrap .box .left .image100 img {max-width: 54px;}
    .testing .testing_tab_con .con_wrap .box .text {padding: 12px 20px;}
    .testing .sec4 {margin: 80px 0 90px;}
    .testing .sec5 {padding-top: 80px;}
    .testing .sec7 {padding: 80px 0 100px;}

    .testing .testing_infog_wrapper.pc {display: none;}
    .testing .testing_infog_wrapper.m {display: flex;}
    .testing .sec3 .f40 {margin-bottom: 60px;}
    .testing .sec2.sub_title {margin: 80px 0;}
    .machining .sec4 {margin-top: 80px;}
    .machining .sec2.sub_title {margin: 80px 0 60px;}
    .machining .sub_title .f18 span {display: inline;}
    .machining .table_wrap .half {margin: 0 5px;}
    .machining .table_wrap .left {margin-left: 0;}
    .machining .table_wrap .right {margin-right: 0;}
    .machining .sec4 .bt_txt {margin-top: 30px;}
    .machining .sec5 {margin: 80px 0 90px;}
    .machining .sec6 {padding: 80px 0 90px;}
    .machining .sec6 .f32 {margin-bottom: 40px;}
    .machining .automation_wrap .box .title {padding: 20px 15px 20px;}
    .machining .automation_wrap .box .txt {padding: 15px 15px 20px;}
    .machining .automation_wrap .box .title .cate {margin-bottom: 8px;}

    .client .client_box_wrap li {height: 110px; flex: 0 1 33.3%;}
    .client .client_box_wrap li .hover {width: 100%; padding: 0 30px; justify-content: space-between;}
    .client .client_box_wrap li .hover .txt {height: auto;}
    .client .client_box_wrap li .hover .txt .location {white-space: normal;}
    .client .sec4 {padding: 80px 0 90px;}
    .client .sec5 {padding-top: 80px;}
    .client .sec5 .f40 {margin-bottom: 40px;}
}

@media (max-width: 959px) { 
    .gallery_list .list_wrap .item {flex: 0 1 calc(33.3% - 14px); width: calc(33.3% - 14px); margin: 0 10px 60px;}
    .board_detail .list_btn .f24 {max-width: 180px; height: 56px;}
    .disclosure .list_wrap table colgroup col:nth-child(3), .disclosure .list_wrap table colgroup col:nth-child(4) {width: 20%;}
    /* 20230103 수정 - 시작 */
    .product.ev .product_img {left: 55% !important; transform: translateX(-50%)  !important; height: 800px;}
    .ev .item_wrap .item1 {bottom: 380px; left: 478px;}
    .ev .item_wrap .item2 {bottom: 372px; left: 585px;}
    .ev .item_wrap .item3 {bottom: 355px; left: 715px;}
    .ev .item_wrap .item4 {bottom: 332px; left: 500px;}
    .ev .item_wrap .item5 {bottom: 320px; left: 543px;}
    /* 20230103 수정 - 끝 */
    .casting .left .left_acco_wrap .acco_box .title_box {padding: 0 20px; height: 60px;}
    .casting .left .left_acco_wrap .acco_box .cont_box {padding: 20px 20px 25px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li .icon {width: 70px; height: 70px;}
    .casting .casting_acco_wrap .acco_box .cont_box .top {flex-flow: column; padding-bottom: 40px;}
    .casting .casting_acco_wrap .acco_box .cont_box .ca_left, .casting .casting_acco_wrap .acco_box .cont_box .ca_right {width: 100%; justify-content: center;}
    .casting .casting_acco_wrap .acco_box .cont_box {padding: 25px 20px 30px;}
    .casting .casting_acco_wrap .acco_box .cont_box .ca_left {padding-right: 0;}
    .casting .casting_acco_wrap .acco_box .cont_box .ca_right {margin-top: 40px;}
    .casting .casting_acco_wrap .acco_box .cont_box .bottom {padding-top:30px;}
    .casting .casting_acco_wrap .acco_box .cont_box .sub_t {padding-bottom: 16px; margin-bottom: 20px;}
    .casting .advatages_box .box_warp.bt_box .box {padding: 18px 22px;}
    .casting .advatages_box .box_warp.bt_box .box .txt .f20 {padding-left: 20px; font-size: 16px; line-height: 22px;}
    .casting .advatages_box .box_warp.bt_box .box .txt .f20 span {display: inline;}
    .test_ev .test_sec .box_wrap .box, .test_ev .test_sec .box_wrap .box:nth-child(3n), .test_ev .test_sec .box_wrap .box:nth-child(3n -2) {height: 180px; padding: 20px 25px; flex: 0 1 calc(50% - 5px); margin: 0 5px 10px;}
    .test_ev .test_sec .box_wrap .box:nth-child(odd) {margin-left: 0;}
    .test_ev .test_sec .box_wrap .box:nth-child(even) {margin-right: 0;}
    .test_ev .test_sec .box_wrap .box .img img {max-width: 160px;}
    .design .sec4 .brick_wrapper .brick_con .brick {height: 160px;}
    .design .sec4 .small_box_wrap {padding: 10px;}
    .design .sec4 .small_box_wrap .inner_box {height: 140px; padding: 12px;}
    .design .sec4 .small_box_wrap .inner_box .bt ul li {padding-left: 20px;}
    .design .sec4 .small_box_wrap .inner_box .bt ul li::before {top: 6px;}
    .design .sec4 .small_box_wrap .inner_box .bt ul li .f20 {font-size: 15px; line-height: 23px;}
    .design .sec6 .capa_box .bt_text .f20 {font-size: 16px;}
    .design .sec6 .capa_box .bt_text .f20.cate {font-size: 16px;}
    .design .sec6 .capa_box .bt_text {padding: 10px 0 0;}
    .design .sec7 .cadcae_wrap .box:nth-child(1) .right ul {flex-flow: column;}
    .design .sec7 .cadcae_wrap .box .right ul li .f20 {font-size: 16px; line-height: 26px;}
    .testing .validation_wrap .box .txt {padding: 8px 14px;}
    .testing .testing_tab li {padding: 14px 5px; font-size: 16px; line-height: 24px;}
    .machining .cardbox_wrap {flex-flow: wrap;}
    .machining .cardbox_wrap .box {width: calc(50% - 5px); flex: 0 1 calc(50% - 5px); margin: 0 5px 10px;}
    .machining .cardbox_wrap .box:nth-child(odd) {margin-left: 0;}
    .machining .cardbox_wrap .box:nth-child(even) {margin-right: 0;}
    .machining .table_wrap .half .f24 {margin-bottom: 10px;}
    .casting .advatages_box .box_warp .box {flex:  1 1 100%; margin: 0 0 8px;}
    .casting .advatages_box .circle_graph_wrap .txt {padding: 12px 20px !important;}
    /* 20230103 수정 - 시작 */
    .client .sec4 .image100.pc {display: none;}
    .client .sec4 .image100.m {display: flex;}
    .client .sec4 .image100 {justify-content: center;}
    .client .sec4 .image100 img {max-width: 735px;}
    /* 20230103 수정 - 끝 */

}



@media (max-width: 767px) {
    .greeting .sec3 .left .signature .sign img {width: 70%;}
    .greeting .sec3 .left .signature {justify-content: flex-start; margin-right: 0; margin-top: 20px;}
    .greeting .sec4 .txt_box {padding: 40px 16px 80px;}
    .history .sec3 .left .f40 {letter-spacing: 2px;}
    .workplace .workplace_wrap .map_info_txt {flex-flow: column;}
    .workplace .workplace_wrap .map_info_txt .left, .workplace .workplace_wrap .map_info_txt .right {width: 100%;}
    .workplace .workplace_wrap .map_info_txt .right .image100 {justify-content: center; margin-top: 30px;}
    .workplace .workplace_wrap .map_info_txt .left ul li span.f20.title {margin-right: 10px;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail3 li span.f20.title {margin-right: 10px; height: 34px;}
    .workplace .workplace_wrap .map iframe {height: 350px;}
    .workplace .workplace_wrap .map .map_title {height: 60px; max-width: 260px;}
    .workplace .workplace_wrap .map .map_title .f48 {bottom: 0;}
    .gallery_list .list_wrap .item .txt {margin-top: 16px;}
    .gallery_list .list_wrap .item .txt .f26 {font-size: 17px; font-weight: 27px;}
    .gallery_list .list_wrap .item .txt .f20 {font-size: 16px; line-height: 26px; margin-top: 0;}
    .gallery_list .list_wrap .item .txt .f16 {margin-top: 6px; font-size: 14px;}
    .board_detail .bd_title {padding: 25px 0;}
    .board_detail .bd_con {padding: 40px 0 50px;}
    .board_detail .bd_con .bd_img {margin: 30px 0;}
    .board_detail .bd_con .bd_img img {width: 100%;}
    .board_detail .bd_con .txt_box .f20 {margin-bottom: 20px;}
    .board_detail .attached_file {padding: 14px 16px;}
    .notice_list .list_wrap { margin-bottom: 30px;}
    .notice_list .list_wrap .item .cate {font-size: 15px;}
    .client .tab {margin-bottom: 40px;}
    .client .tab li a {height: 54px; font-size: 16px;}
    .stock_disclosure .tab {margin-bottom: 40px;}
    .stock_disclosure .tab li a {width: 220px; height: 54px; font-size: 16px;}
    .disclosure .list_wrap table th, .disclosure .list_wrap table td {font-size: 16px; padding: 20px 0;}
    .disclosure .list_wrap table th:nth-child(1), .disclosure .list_wrap table td:nth-child(1), .disclosure .list_wrap table colgroup col:nth-child(1) {display: none;}
    .disclosure .list_wrap {margin-bottom: 30px;}
    .financial .sec4 {margin-top: 40px;}
    .etc .sec5 {padding: 40px 0;}
    .casting .tab {flex-flow: wrap; margin-bottom: 50px;}
    .casting .tab li {flex: 1 1 33.3%;}
    .casting .tab li:nth-child(-n+3) {border-bottom: 0;}
    .casting .tab li:nth-child(3n) {border-right: 1px solid #ddd;}
    .casting .tab li a {height: 50px;}
    .casting .left .left_acco_wrap {margin-top: 30px;}
    .casting .right .img_view_wrap .item_thum .item img {max-width: 60px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li {margin: 0 5px;}
    .casting .casting_swiper_wrap .casting_swiper {margin: 0;}
    .casting .casting_swiper_wrap .swiper-button-prev {left: -10px;}
    .casting .casting_swiper_wrap .swiper-button-next {right: -10px;}
    .casting .casting_acco_wrap {margin-top: 60px;}
    .casting .casting_acco_wrap .acco_box {margin-bottom: 14px; }
    .casting .casting_acco_wrap .acco_box .title_box {height: 64px; margin-bottom: 6px;}
    .casting .advatages_box .box_warp {flex-flow: column;}
    .casting .advatages_box .box_warp .box {width: 100%; margin: 0 0 4px;}
    .casting .advatages_box .box_warp.bt_box .box .icon img {max-width: 40px;}
    .design .half_wrap.top {flex-flow: column;}
    .design .half_wrap.top .process_box {flex: 1 1 100%; width: 100%; margin: 0 0 10px;}
    .design .brick_wrapper .brick_con .brick {padding: 25px 18px; height: 140px;}
    .design .sec3 .design_line .image100 {justify-content: center;}
    .design .sec3 .design_line .pc {display: none;}
    .design .sec3 .design_line .m {display: inline-block; max-width: 10px;}
    .design .half_wrap {flex-flow: column;}
    .design .process_box {width: 100%; margin: 0; margin-bottom: 10px;}
    .design .sec4 .brick_wrapper .brick_con .brick {height: 140px; padding: 25px 18px;}
    .design .sec4 .small_box_wrap .inner_box {padding: 15px; height: 120px;}
    .testing .sec5 .tab {margin: 50px 0 30px;}
    .testing .sec6 {padding-top: 70px;}
    .testing .validation_wrap {flex-flow: wrap;}
    .testing .validation_wrap .box {margin-bottom: 10px; width: calc(50% - 5px);}
    .testing .validation_wrap .box:nth-child(odd) {margin-left: 0;}
    .testing .validation_wrap .box:nth-child(even) {margin-right: 0;}
    .testing .validation_wrap .box .txt .f20 {font-size: 16px;}
    .testing .testing_tab_con .con_wrap .box {margin: 0 3px;}
    .testing .testing_tab_con .title {margin: 50px 0 30px;}
    .testing .testing_tab_con .con_wrap .box .text .f20 {font-size: 16px; line-height: 22px;}
    .testing .testing_tab_con .title .f28 {margin-bottom: 4px;}
    .testing .testing_tab_con3 .tb1 table tbody tr td:nth-child(1) {padding: 10px;}
    .testing .testing_infog_wrapper .box .title .circle_box {width: 200px; height: 200px;}
    .testing .testing_swiper .testing_slide .box .txt {height: 46px;}
    .testing .sec2.sub_title {margin: 60px 0;}
    .testing .sec3 .f40 {margin-bottom: 30px;} 
    .machining .cardbox_wrap .box {width: 100%; flex: 1 1 100%; margin: 0 0 6px;}
    .machining .process_wrap .box {margin-bottom: 10px;}
    .machining .process_wrap .box.box3 {margin-bottom: 130px;}
    .machining .process_wrap .box3 .bt_img  {left: -30px; bottom: -120px; transform: none;}
    .machining .process_wrap .box3 .bt_img img {max-width: 340px;}
    .machining .process_wrap .box .arrow img {max-width: 25px;}
    .machining .automation_wrap {flex-flow: wrap;}
    .machining .automation_wrap .box {width: calc(50% - 5px); flex: 0 1 calc(50% - 5px); margin: 0 5px 10px;}
    .machining .automation_wrap .box:nth-child(odd) {margin-left: 0;}
    .machining .automation_wrap .box:nth-child(even) {margin-right: 0;}
    .machining .sec5 .f32, .machining .sec6 .f32 {margin-bottom: 30px;}
    .client .sec4 {padding: 70px 0;}
    .client .sec5 {padding-top: 70px;}
    .client .client_box_wrap {border:none;}
    .client .client_box_wrap li {flex: 0 1 calc(50% - 2px); height: auto; margin: 0 2px 6px; border: 1px solid #e5e5e5}
    .client .client_box_wrap li:nth-child(odd) {margin-left: 0;}
    .client .client_box_wrap li:nth-child(even) {margin-right: 0;}
    .client .client_box_wrap li a {flex-flow: column;}
    .client .client_box_wrap li:hover a .image100 {opacity: 1;}
    .client .client_box_wrap li .hover {opacity: 1; position: static; transform: none; padding: 14px 16px; border-top: 1px solid #e5e5e5;}
    .client .client_box_wrap li .hover .txt .com {white-space: normal;}
    .client .client_box_wrap li .image100 {height: 90px; display: flex;  justify-content: center; align-items: center;}

}


@media (max-width: 640px) {
    .greeting .sec3 {height: auto; padding: 70px 40px 0;}
    .greeting .sec3 .right {position: static; margin-top: 20px;}
    .greeting .sec3 .left {padding-right: 0;}
    .greeting .sec3 .left .signature .text .f20 {white-space:nowrap;}
    .greeting .sec4 .txt_box .f20 {margin-bottom: 20px; line-height: 28px;}
    .history .sec3 .history_wrap {flex-flow: column; margin-bottom: 100px;}
    .history .sec3 .left {width: 100%;}
    .history .sec3 .left .title_box {margin-bottom: 20px;}
    .history .sec3 .left .f110, .history .sec3 .left .f110.gradient {display: inline;}
    .history .sec3 .left .f110.gradient {margin-left: 4px;}
    .history .sec3 .left .f40 {font-size: 18px; margin-top: 10px;}
    .history .sec3 .right {width: 100%; padding-top: 30px;}
    .history .sec3 .right .box {margin-bottom: 20px;}
    .history .sec3 .right .box ul {margin-top: 8px;}
    .workplace .sec3, .workplace .sec4 {margin-bottom: 80px;}
    .workplace .workplace_wrap .map iframe {height: 320px;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail2 {padding: 20px 0;}
    .workplace .workplace_wrap .map_info_txt .left ul li span.f20 {font-size: 16px;}
    .workplace .workplace_wrap .map_info_txt .left ul li span.f20.title {margin-right: 6px;}
    .workplace .workplace_wrap .map_info_txt .right .image100 {margin-top: 20px;}
    .gallery_list .list_wrap {margin-top: 10px;}
	.gallery_list .list_wrap .item, .gallery_list .list_wrap .item:nth-child(3n), .gallery_list .list_wrap .item:nth-child(3n - 2) {flex: 0 1 calc(50% - 6px); width: calc(50% - 6px); margin: 0 6px 30px;}
    .gallery_list .list_wrap .item:nth-child(odd) {margin-left: 0;} 
    .gallery_list .list_wrap .item:nth-child(even) {margin-right: 0;} 
    .gallery_list .list_wrap .item .txt .f26 {font-size: 16px; font-weight: 26px;}
    .gallery_list .list_wrap .item .txt .f20 {font-size: 15px; line-height: 25px;}
    .notice_list .list_wrap {margin-top: 10px;}
    .notice_list .list_wrap .item {padding: 20px 0;}
    .notice_list .list_wrap .item .txt_con .f20 {margin: 0 0 2px;}
    .notice_list .list_wrap .item .cate {width: 60px;}
    .notice_list .list_wrap .item .txt_con {width: calc(100% - 60px);}
    .stock_price .sec5 {flex-flow: column;}
    .stock_price .sec5 .left, .stock_price .sec5 .right {width: 100%;} 
    .stock_price .sec5 .right {padding: 0; margin-top: 20px;}
    .stock_price .sec6 .tb1 {overflow-x: scroll;}
    .stock_price .top_info .figure {flex-flow: column; align-items: flex-start;}
    .stock_disclosure .tab li {width: 50%;}
    .stock_disclosure .tab li a {width: 100%;}
    .disclosure .list_wrap table th:nth-child(3), .disclosure .list_wrap table td:nth-child(3), .disclosure .list_wrap table colgroup col:nth-child(3) {display: none;}
    .disclosure .list_wrap table th, .disclosure .list_wrap table td {padding: 16px 10px; font-size: 15px;}
    .disclosure .list_wrap table colgroup col:nth-child(4) {width: 25%;} 
    .financial .tb1 {overflow-x: scroll;}
    .financial .f18 {font-size: 14px;}
    .financial .sec4 .tb1 table thead th {height: 80px;}
    .product .pop_box .right_con .con_box .advantage li {padding: 0 20px; flex:  1 1 100%; height: 80px; margin: 0 0 5px;}
    .product .pop_box .right_con .con_box .advantage li:nth-last-child(-n+2) {margin: 0 0 5px;}
    .product .pop_box .right_con .con_box .advantage li .icon img {max-width: 40px;}
    .product .tab {flex-flow: wrap;}
    .product .tab li {flex: 1 1 50%;}
    .product .tab li a {height: 50px; font-size: 16px;}
    .product .product_img {background-size: 45% !important; height: 400px;}
    .product.etc .product_img {left: 55%;}
    .lightweight .item_wrap .item1 {bottom: 224px; left: 502px;}
    .lightweight .item_wrap .item2 {bottom: 226px; left: 874px;}
    .lightweight .item_wrap .item3 {bottom: 142px; left: 695px;}
    .lightweight .item_wrap .item4 {bottom: 214px; left: 750px;}
    .lightweight .item_wrap .item5 {bottom: 255px; left: 844px;}
    .engine .item_wrap .item1 {bottom: 300px; left: 582px;}
    .engine .item_wrap .item2 {bottom: 269px; left: 817px;}
    .engine .item_wrap .item3 {bottom: 205px; left: 710px;}
    .engine .item_wrap .item4 {bottom: 233px; left: 822px;}
    .engine .item_wrap .item5 {bottom: 258px; left: 782px;}
    .etc .item_wrap .item1 {bottom: 222px; left: 560px;}
    .etc .item_wrap .item2 {bottom: 177px; left: 615px;}
    .etc .item_wrap .item3 {bottom: 337px; left: 812px;}
    .etc .item_wrap .item4 {bottom: 244px; left: 789px;}
    .etc .item_wrap .item5 {bottom: 288px; left: 767px;}
    .casting .tab li a {font-size: 16px; line-height: 20px;}
    .casting .casting_acco_wrap .acco_box .cont_box {padding: 20px 16px 25px;}
    .casting .sec4 {flex-flow: column;}
    .casting .left {width: 100%;}
    .casting .right {width: 100%; justify-content: center; margin-top: 20px;}
    .casting .right .img_view_wrap {padding: 0;}
    .casting .right .img_view_wrap .item_detail img {max-width: 320px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li {margin: 0 4px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li .icon {width: 60px; height: 60px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li .icon img {max-width: 30px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li .speech_bubble .f20 {font-size: 14px; padding: 6px 10px;}
    .casting .casting_acco_wrap .acco_box .cont_box .sub_t  {margin-bottom: 10px;}
    .casting .casting_acco_wrap .acco_box .cont_box .bottom {padding-top: 20px;}
    .test_ev .test_sec .box_wrap .box, .test_ev .test_sec .box_wrap .box:nth-child(3n), .test_ev .test_sec .box_wrap .box:nth-child(3n -2), .test_ev .test_sec .box_wrap .box:nth-child(odd), .test_ev .test_sec .box_wrap .box:nth-child(even) {height: 180px; padding: 20px 25px; flex: 0 1 100%; margin: 0 0 10px;}
    .casting .left .left_acco_wrap .acco_box .cont_box ul li:hover .speech_bubble {transform: translate(-50% , -20px);}
    .design .sec4 .small_box_wrap .inner_box .f20 {font-size: 16px;}
    .design .sec3 .design_line .m {max-width: 6px;}
    .design .process_box .title_box {padding: 0 20px; height: 90px;}
    .design .process_box .title_box .txt {margin-left: 12px;}
    .design .process_con .design_swiper_wrap .design_swiper {padding: 20px 0 15px;}
    .design .process_box.test .process_con .pd {padding: 20px 0 25px;}
    .design .process_con .explanation_box .bottom .f18 {font-size: 15px; line-height: 23px;}
    .design .sec5 .card {width: 100%; height: 40vw;}
    .design .sec7 .cadcae_wrap .box {flex: 0 1 100%; margin: 0 0 10px; align-items: flex-start;}
    .design .sec7 .cadcae_wrap .box .left .image100 {width: 70px; height: 110px;}
    .design .sec7 .cadcae_wrap .box .left .image100 img {max-width: 46px;}
    .testing .sec5 .tab {margin: 40px 0 25px;}
    .testing .sec5 .tab li a {font-size: 16px; height: 50px;}
    .testing .sec2.sub_title {margin: 50px 0;}
    .testing .testing_tab li {font-size: 15px; line-height: 21px; padding: 10px 5px; flex: 1 1 25%;}
    .testing .testing_tab li:nth-child(1) {flex-basis: 50%;}
    .testing .testing_tab_con .title .f20 {font-size: 16px; line-height: 24px;}
    .testing .testing_tab_con .title {margin: 40px 0 24px;}
    .testing .testing_infog_wrapper .box .title .circle_box {width: 150px; height: 150px;}
    .testing .testing_infog_wrapper.m {flex-flow: column;}
    .testing .testing_infog_wrapper.m .m_box {flex: 1 1 100%; margin: 0 0 8px; padding: 20px 24px;}
    .machining .table_wrap {flex-flow: column;}
    .machining .table_wrap .half {margin: 0; width: 100%;}
    .machining .table_wrap .left {margin-bottom: 30px;}
    .machining .automation_wrap .box .title {padding: 15px 16px;}
    .machining .automation_wrap .box .title .cate {margin-bottom: 5px;}
    .machining .automation_wrap .box .txt {padding: 14px 16px 16px;}
    .client .client_box_wrap li .hover {padding: 10px 12px;}
    .client .client_box_wrap li .hover .txt .f18 {font-size: 14px; line-height: 18px;}
    .client .client_box_wrap li .hover .icon {width: 30px; height: 30px;}
    .client .client_box_wrap li .hover .icon img {max-width: 8px;}
}


@media (max-width: 560px) {
    .product.ev .product_img {left: 70% !important;}
    .casting .advatages_box .box_warp.bt_box .box {justify-content: flex-start; padding: 14px 16px;}
    .casting .advatages_box .box_warp.bt_box .box .txt {padding-left: 20px;}
    .casting .advatages_box .box_warp.bt_box .box .txt .f20 {padding-left: 0;}
    .machining .process_wrap .box {flex: 1 1 calc(50% - 10px); margin: 0 5px;}
    .machining .process_wrap .box:nth-child(odd) {margin-left: 0;}
    .machining .process_wrap .box:nth-child(even) {margin-right: 0;}
    .machining .process_wrap .box3 .bt_img {bottom: -110px; left: 0;}
    .machining .process_wrap .box3 .bt_img img {max-width: 300px;}
    .machining .process_wrap .box .arrow {display: none;}
}

@media (max-width: 479px) {
    .greeting .sec3 {padding: 50px 16px 0;}
    .workplace .workplace_wrap .map .map_title {height: 50px; max-width: 220px;}
    .workplace .workplace_wrap .map iframe {height: 260px;}
    .workplace .workplace_wrap .map_info_txt .left ul.detail3 li span.f20.title {width: 80px; height: 36px;}
    .board_detail .list_btn .f24 {max-width: 100%; height: 56px;}
    .board_detail .bd_con .txt_box .f20 {font-size: 16px; line-height: 26px;}
    .board_detail .bd_con {padding: 30px 0 40px;}
    .board_detail .list_btn {margin-top: 30px;}
    .board_detail .bd_title ul {justify-content: space-between;}
    .board_detail .bd_title ul li {display: flex; flex-flow: column; justify-content: center; align-items: center;}
    .board_detail .bd_title ul li .f18.title {margin-right: 0;}
    .board_detail .attached_file .file_box .f18 {line-height: 22px;}
    .stock_price .top_info .figure .left {flex-flow: column; align-items: flex-start;}
    .stock_price .top_info .figure .left ul {margin-left: 0;}
    .stock_price .top_info .figure .left ul li span.number {margin-left: 4px;}
    .stock_price .top_info .figure .left ul li.divider {margin: 0 8px;}
    .product .pop_box .right .title {background: #88827d;}
    .product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet {width: 60px; height: 60px;}
    .product .pop_box .right .pop_con_wrap .left_con .swiper-pagination-bullet img {width: 60px; height: 60px;}
    .product.ev .product_img {left: 82% !important;}
    .product.lightweight .product_img {background-size: 32% !important; height: 300px;}
    .lightweight .item_wrap .item1 {bottom: 160px; left: 557px;}
    .lightweight .item_wrap .item2 {bottom: 164px; left: 824px;}
    .lightweight .item_wrap .item3 {bottom: 102px; left: 695px;}
    .lightweight .item_wrap .item4 {bottom: 160px; left: 739px;}
    .lightweight .item_wrap .item5 {bottom: 184px; left: 802px;}
    .casting .casting_acco_wrap .acco_box .cont_box .ca_right {margin-top: 30px;}
    .casting.esdc .casting_acco_wrap .acco_box .cont_box .top {padding-bottom: 30px;}
    .design .brick_wrapper .brick_con {flex-flow: column;}
    .design .brick_wrapper .brick_con .brick {flex: 1 1 100%; margin: 0 0 8px; flex-flow: nowrap; align-items: center; padding: 18px 15px;}
    .design .sec4 .brick_wrapper .brick_con .brick {height: 90px; margin-bottom: 6px; padding: 18px 15px;}
    .design .sec4 .small_box_wrap {flex-flow: column;}
    .design .sec4 .small_box_wrap .inner_box {width: 100%; margin: 0; height: 90px; margin-bottom: 6px; flex-flow: nowrap;}
    .design .sec4 .small_box_wrap .inner_box .bt .image100 img {object-fit: contain;}
    .design .process_con .inner {margin: 0 20px;}
    .design .process_con .explanation_box .top {height: 140px;}
    .design .process_con .design_swiper_wrap .swiper_btn {margin-top: 0;}
    .design .process_box .title_box {padding: 0 14px;}
    .design .process_box .title_box .txt .f18 {font-size: 15px; line-height: 21px;}
    .design .sec5 .card {height: 32vw;}
    .design .sec6 .capability_swiper {margin-top: 0;}
    .design .sec7 .f32 {margin-bottom: 30px;}
    .design .sec7 .cadcae_wrap .box .right {padding-left: 14px;}
    .design .sec7 .cadcae_wrap .box .right ul li .f20 {font-size: 15px; line-height: 25px;}
    .design .sec7 .cadcae_wrap .box .right ul li .icon {margin-right: 6px;}
    .testing .validation_wrap .box{width: calc(50% - 2px); margin: 0 2px 4px;}
    .testing .validation_wrap .box .txt {padding: 6px 8px;}
    .testing .validation_wrap .box .txt .f20 {font-size: 15px;}
    .testing .testing_tab_con1 .con_wrap, .testing .testing_tab_con2 .con_wrap {flex-flow: column; align-items: center;}
    .testing .testing_tab_con .con_wrap .box {margin: 0 0 15px; width: 100%; max-width: 350px;}
    .testing .sec3 .f40 {margin-bottom: 30px;} 
    .machining .cardbox_wrap .box {padding: 18px 15px;}
    .machining .cardbox_wrap .box .txt {margin-left: 15px;}
    .machining .cardbox_wrap .box .txt .f18{line-height: 24px;}
    .machining .process_wrap .box.box3 {margin-bottom: 100px;}
    .machining .process_wrap .box3 .bt_img {bottom: -90px;}
    .machining .process_wrap .box3 .bt_img img {max-width: 250px;}
    .machining .automation_wrap {flex-flow: column;}
    .machining .automation_wrap .box {width: 100%; margin: 0 0 12px;}
    .casting .advatages_box .box_warp.top_box .box .txt {flex-flow: column; align-items: center;}
    .casting .graph_wrap .graph_con .graph .bg img {width: 320px;}
    .casting .graph_wrap .graph_con .graph .group {bottom: 60px;}
    .casting .graph_wrap .graph_con .graph .graph_bar {width: 35px;}
    .casting .graph_wrap .graph_con .graph .graph_bar.first {margin-right: 25px;}
    .casting .graph_wrap .graph_con .graph .group1 {left: 110px;}
    .casting .graph_wrap .graph_con .graph .group2 {left: 222px;}
    .casting .graph_wrap .graph_con .graph .bg {justify-content: center;}
    @keyframes graph_bar1 {
        0% {height: 0;}
        100% {height: 195px;}
    }
    @keyframes graph_bar2 {
        0% {height: 0;}
        100% {height: 145px;}
    }
    @keyframes graph_bar3 {
        0% {height: 0;}
        100% {height: 82px;}
    }
    @keyframes graph_bar4 {
        0% {height: 0;}
        100% {height: 36px;}
    }
}


@media (max-width: 374px) {
    .machining .process_wrap .box3 .bt_img {left: -10px;}
    .client .client_box_wrap li {flex: 1 1 100%; margin: 0 0 6px;}
}


@media (max-height: 900px) {
    /* 20230103 수정 - 시작 */
    .product .product_popup_wrap .pop_box {height: 90vh; max-height: 750px;}
     /* 20230103 수정 - 끝 */
}