
/****** 서브 페이지 공통 ******/
.sub_title_area{ width: 100%; height: 240px; background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; align-items: center; color: rgb(255,255,255); font-size: 30px; font-weight: bold; text-align: center; word-break: keep-all; transition: all 0.2s ease-in-out; }
.sub_title_area span span{ margin: 0 5px; }
.sub_nav{ width: 100%; height: auto; display:block; border-top: 1px solid rgb(0,0,0); border-bottom: 1px solid rgb(0,0,0); }
.sub_nav ul{ width: 100%; height: 60px; margin: auto; padding: 0 20px; max-width: 1200px; display: flex; align-items: center; justify-content: flex-start; flex-flow: row nowrap; }
.sub_nav ul li{ display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; font-size: 20px; cursor: pointer; }
.sub_nav ul li:nth-of-type(1){ width: 80px; height: 100%; border-left: 1px solid rgb(0,0,0); border-right: 1px solid rgb(0,0,0); }
.sub_nav ul li:nth-of-type(2), .sub_nav ul li:nth-of-type(3){ width: 200px; height: 100%; border-right: 1px solid rgb(0,0,0); position: relative; }
.sub_nav .menu_name, .sub_nav .sub_menu_name{ width: 150px; padding: 0 10px; text-align: center; display: flex; flex-flow: row wrap; justify-content: center; word-break: keep-all; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sub_nav .menu_name span, .sub_nav .sub_menu_name span{ margin-right: 5px; }
.sub_nav .menu_select, .sub_nav .sub_menu_select{ width: 201px; position: absolute; top: 60px; left: -1px; z-index: 10; border: 1px solid rgb(0,0,0); background-color: rgb(255,255,255); display: none; }
.sub_nav i{ transition: all 0.2s ease-in-out; }
.sub_nav .menu_select p, .sub_nav .sub_menu_select p{ width: 100%; height: 60px; padding: 0 10px; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; word-break: keep-all; text-align: center; font-size: 16px; }
.sub_nav .menu_select p span, .sub_nav .sub_menu_select p span{ width: 100%; text-align: center; }
.sub_nav .menu_select p:hover, .sub_nav .sub_menu_select p:hover{ background-color: rgb(220,220,220); }

.content_title{ width: 100%; height: auto; margin: auto; padding: 50px 20px 40px; max-width: 1200px; border-bottom: 1px solid rgb(204,204,204); }
.content_title dt{ text-align: center; font-size: 36px; font-weight: bold; }
.content_title dd{ text-align: center; font-size: 14px; letter-spacing: 6px; color: rgb(204,204,204); }

.content_sub_title{ width: 100%; height: auto; padding: 120px 20px 40px; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; }
.content_sub_title:nth-of-type(1){ padding: 60px 20px 40px; }
.content_sub_title p{ font-size: 24px; font-weight: bold; border-bottom: 1px solid rgb(0,0,0); padding-bottom: 5px; word-break: keep-all; text-align: center; }


/* 전자설계 */
.content_explain_area{ width: 100%; height: auto; margin: auto; padding: 0 20px; max-width: 1200px; }
.content_explain{ width: 100%; display: flex; flex-flow: row nowrap; justify-content: space-around; align-items: center; margin-bottom: 100px; }
.content_explain>li{ width: 30%; max-width: 280px; margin: 40px 20px 0; position: relative; }
.content_explain>li>img{ width: 100%; position: relative; z-index: 5; }
.content_explain>li>div{ width: 100%; }
.content_explain>li>div:nth-of-type(1){ height: 190px; padding: 30px 0 30px 50px; }
.content_explain>li>div:nth-of-type(1) h4{ font-size: 24px; margin-bottom: 20px; font-weight: bold; }
.content_explain>li>div:nth-of-type(1) p{ font-size: 16px; font-weight: normal; }
.content_explain>li>div:nth-of-type(1) img{ margin: 0 10px 0 5px; }
.content_explain>li>div:nth-of-type(2){ height: 200px; padding: 18% 0 18% 50px; background-color: rgb(51,51,51); display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-start;}
.content_explain>li>div:nth-of-type(2)>p:nth-of-type(1), .content_explain>li>div:nth-of-type(2)>p:nth-of-type(2){ width: 100%; font-size: 14px; color: rgb(107,163,219); font-weight: normal; }
.content_explain>li>div:nth-of-type(2)>p:nth-of-type(2){ margin-bottom: 10px; }
.content_explain>li>div:nth-of-type(2)>p:nth-of-type(3), .content_explain>li>div:nth-of-type(2)>p:nth-of-type(4){ width: 100%; font-size: 16px; color: rgb(255,255,255); font-weight: normal; }
.content_explain .left_line{ width: 1px; height: 85%; position: absolute; top: 0; left: 25px;  background-color: rgb(204,204,204); }
.content_explain .left_line div:nth-of-type(1){ width: 10px; height: 10px; border: 2px solid rgb(0,72,145); border-radius: 20px; position: absolute; top: 50%; left: -4px; background-color: rgb(255,255,255); }
.content_explain .left_line div:nth-of-type(2){ width: 10px; height: 10px; border: 2px solid rgb(255,255,255); border-radius: 20px; position: absolute; bottom: -10px; left: -4px; }
.dash_line{ width: 80%; height: 30px; margin: auto; padding: 0 20px; max-width: 960px; position: relative; display: flex; flex-flow: row wrap; }
.dash_line>div{ width: 100%; position: absolute; top: 14px; left: 0; border-top: 2px dashed rgb(0,0,0); }
.dash_line>div>p{ width: 150px; height: 30px; position: absolute; top: -16px; left: 0; right: 0; margin: auto; background-color: rgb(255,255,255); text-align: center; font-weight: bold; font-size: 20px; }
.dash_line:last-of-type{ margin: 20px auto 50px; }
.platform_img_pc{ width: 80%; max-width: 900px; margin: auto; height: auto; }
.platform_img_pc>img{ width: 100%; max-width: 900px; height: auto; }
.platform_img_m{ width: 90%; max-width: 320px; margin: auto; height: auto; }
.platform_img_m>img{ width: 100%; max-width: 320px; height: auto; }
.pc_view{ display: block; }
.m_view{ display: none; }

/* 첨단 IT 소재 */
.material_content{ width: 100%; max-width: 1200px; height: auto; margin: auto; padding: 0 20px; }
.material_content>dl{ width: 100%; max-width: 800px; margin: 50px auto; display: flex; flex-flow: row wrap; justify-content: center; align-items: flex-start; }
.material_content>dl>dt{ width: 25%; max-width: 180px; margin-top: 20px; margin-right: 50px; }
.material_content>dl:nth-of-type(2)>dt{ padding: 20px; border: 1px solid rgb(147,149,152); border-radius: 20px; }
.material_content>dl>dt>img{ width: 100%; height: auto; }
.material_content>dl>dd{ width: 75%; max-width: 570px; margin-top: 20px; }
.material_content>dl>dd>h4{ width: 100%; margin-bottom: 10px; font-weight: bold; font-size: 24px; }
.material_content>dl>dd>p{ width: 100%; display: flex; flex-flow: row nowrap; line-height: 30px; font-weight: bold; }
.material_content>dl>dd>p>span:first-of-type{ margin-right: 10px; line-height: 26px; }
.material_content>dl>dd>p>span:first-of-type>i{ font-size: 4px; color: rgb(0,120,182); }
.material_content>dl>dd>p>span:nth-of-type(2){ min-width: 100px; }
.material_content>dl>dd>p>span:last-of-type{ display: flex; flex-flow: row wrap; }
.material_content>dl>dd>p>span>span{ margin-right: 5px; }
.material_content>dl>dd>div{ width: 100%; margin-top: 20px; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: flex-start; }
.material_content>dl>dd>div>h6{ min-width: 70px; margin-right: 20px; color: rgb(0,120,182); font-size: 16px; font-weight: bold; }
.material_content>dl>dd>div>div{ width: 18%; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; }
.material_content>dl>dd>div>div>img{ width: auto; height: 30%; max-height: 50px; }
.material_content>dl>dd>div>div>p{ width: 100%; text-align: center; font-size: 15px; }
.material_content>dl>dd>ul{ width: 100%; margin-bottom: 10px; display: flex; flex-flow: row wrap; justify-content: space-around; align-items: center; }
.material_content>dl>dd>ul>li{ width: 30%; min-width: 150px; height: auto; min-height: 30px; margin-top: 10px; padding: 5px 0; border-radius: 30px; background-color: rgb(230,230,230); font-size: 16px; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; text-align: center; }
.material_content>dl>dd>table{ width: 100%; margin-top: 10px; border-collapse: collapse; }
.material_content>dl>dd>table th{ background-color: rgb(230,230,230); border-top: 1px solid rgb(160,160,160); border-bottom: 1px solid rgb(200,200,200); border-right: 1px solid rgb(200,200,200); text-align: center; }
.material_content>dl>dd>table th:last-of-type{ border-right: 0; }
.material_content>dl>dd>table .border_add{ border-right: 1px solid rgb(200,200,200) !important; }
.material_content>dl>dd>table td{ border-bottom: 1px solid rgb(200,200,200); border-right: 1px solid rgb(200,200,200); text-align: center; }
.material_content>dl>dd>table td:last-of-type{ border-right: 0; }

/* DESIGN */
.design_content{ width: 100%; height: auto; margin: auto; padding: 0 20px 130px; background-color: rgb(232,244,255); position: relative; }
.design_content .content_sub_title{ padding-right: 0 !important; padding-left: 0 !important; }
.design_content #bg_top{ width: 100%; height: 521px; position: absolute; top: 0; left: 0; z-index: 0; background-repeat: repeat; background-size: auto 100%; }
.design_content #bg_bottom{ width: 100%; height: 521px; position: absolute; bottom: 5px; left: 0; z-index: 0; background-repeat: repeat; background-size: auto 100%; }
.design_content>div{ width: 100%; max-width: 837px; margin: auto; display: block; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; z-index: 1; }
.design_content>div>div{ width: 80%; height: 60%; margin: auto; padding-top: 8%; display: flex; flex-flow: row wrap; justify-content: space-around; align-items: center; }
.design_content>div>div>img{ width: 13%; height: auto; max-width: 86px; }
.design_content>div>div>figure{ width: 100%; height: 0; }
.design_content>div>img{ width: 31%; height: auto; max-width: 252px; margin: 6% auto 0; display: block; }
.design_content>div>img.design10_en_img{ width: 50%; height: auto; max-width: 419px; margin: 6% auto 0; display: block; }
.design_content>dl{ width: 100%; max-width: 1200px; margin: auto; padding: 50px 70px; background-color: rgb(255,255,255); position: relative; z-index: 1; overflow: hidden; }
.design_content>dl>dt{ width: 100%; margin-bottom: 20px; font-size: 34px; font-weight: bold; color: rgb(0,120,182); transition: all 0.2s ease-in-out; }
.design_content>dl>dd{ width: 100%; display: flex; flex-flow: row wrap; justify-content: space-around; align-items: center; }
.design_content>dl>dd>div{ width: 40%; background-position: center; background-repeat: no-repeat; background-size: auto 80%; position: relative; transition: all 0.2s ease-in-out; }
.design_content>dl>dd>div>img{ height: auto; position: absolute; animation-iteration-count: infinite; }
.design_content>dl>dd>div>img:nth-of-type(1){ width: 47%; max-width: 244px; top: -2%; right: 2%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img1_1; animation-duration: 1.8s; }
@-webkit-keyframes img1_1 {
    0%   { top: -2%; }
    50%  { top: 2%; }
    100% { top: -2%; }
}
/* Standard syntax */
@keyframes img1_1 {
    0%   { top: -2%; }
    50%  { top: 2%; }
    100% { top: -2%; }
}
.design_content>dl>dd>div>img:nth-of-type(2){ width: 42%; max-width: 220px; top: 28%; left: -2%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img1_2; animation-duration: 1.8s; }
@-webkit-keyframes img1_2 {
    0%   { left: -2%; }
    50%  { left: 2%; }
    100% { left: -2%; }
}
/* Standard syntax */
@keyframes img1_2 {
    0%   { left: -2%; }
    50%  { left: 2%; }
    100% { left: -2%; }
}
.design_content>dl>dd>div>img:nth-of-type(3){ width: 56%; max-width: 292px; top: 55%; right: -2%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img1_3; animation-duration: 1.8s; }
@-webkit-keyframes img1_3 {
    0%   { right: -2%; }
    50%  { right: 2%; }
    100% { right: -2%; }
}
/* Standard syntax */
@keyframes img1_3 {
    0%   { right: -2%; }
    50%  { right: 2%; }
    100% { right: -2%; }
}
.design_content>dl>dd>ul{ width: 40%; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; transition: all 0.2s ease-in-out; }
.design_content>dl>dd>ul>li{ width: 100%; background-position: center; background-repeat: no-repeat; background-size: auto 80%; position: relative; }
.design_content>dl>dd>ul>li:nth-of-type(1){ width: 100%; background-position: center; background-repeat: no-repeat; background-size: auto 80%; position: relative; }
.design_content>dl>dd>ul>li:nth-of-type(1)>img{ position: absolute; animation-iteration-count: infinite; }
.design_content>dl>dd>ul>li:nth-of-type(1)>img:nth-of-type(1){ width: 25%; max-width: 104px; top: 7%; left: 20%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img2_1; animation-duration: 1.8s; }
@-webkit-keyframes img2_1 {
    0%   { top: 7%; }
    50%  { top: 9%; }
    100% { top: 7%; }
}
/* Standard syntax */
@keyframes img2_1 {
    0%   { top: 7%; }
    50%  { top: 9%; }
    100% { top: 7%; }
}
.design_content>dl>dd>ul>li:nth-of-type(1)>img:nth-of-type(2){ width: 25%; max-width: 104px; top: 40%; left: 36%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img2_2; animation-duration: 1.8s; }
@-webkit-keyframes img2_2 {
    0%   { left: 36%; }
    50%  { left: 38%; }
    100% { left: 36%; }
}
/* Standard syntax */
@keyframes img2_2 {
    0%   { left: 36%; }
    50%  { left: 38%; }
    100% { left: 36%; }
}
.design_content>dl>dd>ul>li:nth-of-type(1)>img:nth-of-type(3){ width: 14%; max-width: 60px; top: 42%; right: 7%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img2_3; animation-duration: 1.8s; }
@-webkit-keyframes img2_3 {
    0%   { right: 7%; }
    50%  { right: 9%; }
    100% { right: 7%; }
}
/* Standard syntax */
@keyframes img2_3 {
    0%   { right: 7%; }
    50%  { right: 9%; }
    100% { right: 7%; }
}
.design_content>dl>dd>ul>li:nth-of-type(1)>img:nth-of-type(4){ width: 14%; max-width: 60px; top: 54%; right: 16%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img2_4; animation-duration: 1.8s; }
@-webkit-keyframes img2_4 {
    0%   { right: 16%; }
    50%  { right: 14%; }
    100% { right: 16%; }
}
/* Standard syntax */
@keyframes img2_4 {
    0%   { right: 16%; }
    50%  { right: 14%; }
    100% { right: 16%; }
}
.design_content>dl>dd>ul>li:nth-of-type(2){ width: 100%; background-position: center; background-repeat: no-repeat; background-size: auto 80%; position: relative; }
.design_content>dl>dd>ul>li:nth-of-type(2)>img{ position: absolute; animation-iteration-count: infinite; }
.design_content>dl>dd>ul>li:nth-of-type(2)>img:nth-of-type(1){ width: 42%; max-width: 178px; top: 4%; left: 8%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img3_1; animation-duration: 1.8s; }
@-webkit-keyframes img3_1 {
    0%   { left: 8%; }
    50%  { left: 12%; }
    100% { left: 8%; }
}
/* Standard syntax */
@keyframes img3_1 {
    0%   { left: 8%; }
    50%  { left: 12%; }
    100% { left: 8%; }
}
.design_content>dl>dd>ul>li:nth-of-type(2)>img:nth-of-type(2){ width: 44%; max-width: 183px; top: 35%; left: 42%; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: img3_2; animation-duration: 1.8s; }
@-webkit-keyframes img3_2 {
    0%   { top: 35%; }
    50%  { top: 39%; }
    100% { top: 35%; }
}
/* Standard syntax */
@keyframes img3_2 {
    0%   { top: 35%; }
    50%  { top: 39%; }
    100% { top: 35%; }
}
.design_content>section{ width: 100%; max-width: 1200px; margin: auto; padding: 50px 70px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; z-index: 1; overflow: hidden; display: flex; flex-flow: row nowrap; justify-content: space-between; }
.design_content>section>article{ width: 50%; max-width: 450px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; transition: all 0.2s ease-in-out; }
.design_content>section>article>img{ width: 41%; height: auto; max-width: 265px; position: absolute; top: 2%; left: 24%; opacity: 0.5; -webkit-animation-name: example; -webkit-animation-duration: 1.8s; animation-name: allformat; animation-duration: 1.8s; animation-iteration-count: infinite; }
@-webkit-keyframes allformat {
    0%   { top: 2%; opacity: 0.5; }
    50%  { top: 6%; opacity: 1; }
    100% { top: 2%; opacity: 0.5; }
}
/* Standard syntax */
@keyframes allformat {
    0%   { top: 2%; opacity: 0.5; }
    50%  { top: 6%; opacity: 1; }
    100% { top: 2%; opacity: 0.5; }
}
.design_content>section>h4{ width: auto; height: auto; min-width: 380px; padding-top: 5%; color: rgb(0,120,182); font-size: 34px; font-weight: bold; text-align: right; transition: all 0.2s ease-in-out; }


/* 정밀부품제조 */
.produce_content {word-break: keep-all;}
.produce_content .produce_wrap01 {display: flex; justify-content: space-between;}
.produce_content .produce_text {font-size: 18px; color: #333333;padding: 15px 0px; box-sizing: border-box; text-align: left;}
.produce_content .produce_text01 {border-left: 3px solid #333333; padding: 15px 15px;  margin-top: 50px;}
.produce_content .produce_box {padding: 23px 65px; background-color: #f6f6f6;  text-align: center; }
.produce_content .produce_box p {font-size: 20px; padding-top: 10px;}
.produce_content .produce_box img {width: 100%; max-width: 530px; height: auto;}
.produce_content .produce_wrap strong {font-size: 20px; color: #004891; padding-top: 50px; padding-bottom: 25px; text-align: center; width: 100%; display: block;}
.produce_content .produce_wrap02 img{width: 100%; height: auto;}
.produce_content .produce_wrap03 img{width: 50%; height: auto;}
.produce_content .produce_wrap04 img{width: 85%; height: auto;}
.produce_content .produce_wrap03 div {text-align: center;}
.produce_content .produce_wrap04 div {text-align: center;}
.produce_wrap05 {width: 100%;}
.produce_wrap05>div {display: flex;}
.produce_wrap05>div .text_box {width: 50%; box-sizing: border-box;}
.produce_wrap05>div .text_box1 {margin-right: 1%;}
.produce_wrap05>div .text_box2 {margin-left: 1%;}
.produce_wrap05>div img {width: 100%; height: auto;}
.produce_wrap05>div ul {margin-top: 20px; padding-top: 20px ; position: relative;}

.produce_wrap05>div ul::before {content:""; position: absolute; top: 0; width: 40px; height: 3px; background-color: #004891;}
/*
.produce_content .produce_wrap03 {width: 100%;}
.produce_content .produce_wrap03 div{margin: 0 auto; width: 50%;}
.produce_content .produce_wrap04 {width: 100%;}
.produce_content .produce_wrap04 div {width: 80%; margin: 0 auto;} */
.text_tip {padding-top: 50px;}
.text_tip b{width: 90px; height: 30px; border-radius: 15px; background-color: #004891; display: inline-block; color: #fff; text-align: center; line-height: 1.6; font-weight: 400;  font-size: 18px;}
.text_tip span {font-size: 17px; padding-left: 10px;}
.produce_wrap06 .text_box_wrap {display: flex;}
.produce_wrap06 .img_box1 .produce06_m{display: none;}
.produce_wrap06 .img_box1 img{width: 100%; height: auto;}
.produce_wrap06>div .text_box {width: 50%; box-sizing: border-box;}
.produce_wrap06>div .text_box1 {margin-right: 1%;}
.produce_wrap06>div .text_box2 {margin-left: 1%;}
.produce_wrap06>div ul {margin-top: 20px; padding-top: 20px ; position: relative;}
.produce_wrap06>div ul::before {content:""; position: absolute; top: 0; width: 40px; height: 3px; background-color: #004891;}
.produce_wrap .produce_text b {text-align: left; color: #004891; font-size: 20px; padding-bottom: 10px; display: inline-block;}
.produce_wrap07 {width: 100%; height: auto;}
.produce_wrap07 img {width: 100%; height: auto; position: relative;}
.produce_wrap07 .text_box5 {position: absolute; left: 4%; bottom: 7%; font-size: 18px;}
.produce_wrap08>div{display: flex; justify-content: space-between;}
.produce_wrap08 .img_box2 {width: 46%;}
.produce_wrap08 .img_box2 img{width: 100%; height: auto;}
.produce_wrap08 .text_box_wrap {width: 50%; position: relative;}
.produce_wrap08 .text_box_wrap .produce_text{padding-top: 0;}
.produce_wrap08 .img_box3 {position: absolute; bottom: 0; right: 0; width: 80%;}
.produce09 {width: 100%; height: auto;}
.produce_wrap09>div{display: flex; justify-content: space-between;}
.produce_wrap09 .img_box2 {width: 46%;}
.produce_wrap09 .img_box2 img{width: 100%; height: auto;image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden;}
.produce_wrap09 .img_box3 {width: 46%;}
.produce_wrap09 .img_box3 img{width: 100%; height: auto;image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden;}
.produce_wrap09 .text_box_wrap {width: 50%; position: relative;}
.produce_wrap09 .text_box_wrap .produce_text{padding-top: 0;}
.produce_wrap09 .img_box4 {position: absolute; bottom: 0; right: 0; width: 80%;}
.produce09 {width: 100%; height: auto;}

.border_top::before {content:''; border: solid 1px #cccccc; position: absolute; top: 0; width: calc(100% - 140px);}

/* FAB 공정 */
.fab_content_area1{ width: 100%; height: auto; margin: auto; padding: 0 20px; max-width: 1200px; }
.fab_content{ width: 100%; display: flex; flex-flow: row nowrap; justify-content: space-around; align-items: center; margin-bottom: 50px; }
.fab_content>li{ width: 30%; max-width: 280px; margin: 40px 20px 0; position: relative; }
.fab_content>li>img{ width: 100%; position: relative; z-index: 5; }
.fab_content>li>div{ width: 100%; }
.fab_content>li>div:nth-of-type(1){ height: 130px; padding: 30px 10px 30px 50px; }
.fab_content>li>div:nth-of-type(1) h4{ font-size: 18px; font-weight: bold; word-break: keep-all; color: rgb(0,72,145); }
.fab_content>li>div:nth-of-type(1) img{ margin: 0 10px 0 5px; }
.fab_content>li>div:nth-of-type(2){ height: 150px; padding: 10% 10px 10% 50px; background-color: rgb(51,51,51); }
.fab_content>li>div:nth-of-type(2)>p{ width: 100%; margin-bottom: 5px; font-size: 15px; color: rgb(255,255,255); font-weight: normal; word-break: keep-all; }
.fab_content .left_line{ width: 2px; height: 77%; position: absolute; top: 0; left: 25px;  background-color: rgb(204,204,204); }
.fab_content .left_line div:nth-of-type(1){ width: 10px; height: 10px; border: 2px solid rgb(0,72,145); border-radius: 20px; position: absolute; top: 66.5%; left: -4px; background-color: rgb(255,255,255); }
.fab_content .left_line div:nth-of-type(2){ width: 10px; height: 10px; border: 2px solid rgb(255,255,255); border-radius: 20px; position: absolute; bottom: -10px; left: -4px; }
.fab_content_area2{ width: 100%; height: auto; margin: 40px auto 100px; padding: 0 20px; max-width: 1200px; transition: all 0.12s ease-in-out; }
.fab_content_area2>ol{ width: 100%; height: auto; display: flex; flex-flow: row wrap; transition: all 0.12s ease-in-out; }
.fab_content_area2>ol.mobile_view{ display: none; }
.fab_content_area2>ol>li{ height: auto; padding: 20px; border-right: 1px solid rgb(255,255,255); border-left: 1px solid rgb(255,255,255); border-top-left-radius: 10px; border-top-right-radius: 10px; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; transition: all 0.12s ease-in-out; }
.fab_content_area2>ol>li:nth-of-type(1){ width: 16%; }
.fab_content_area2>ol>li:nth-of-type(2){ width: 28%; background-color: rgb(232,244,255); }
.fab_content_area2>ol>li:nth-of-type(3){ width: 28%; background-color: rgb(232,244,255); }
.fab_content_area2>ol>li:nth-of-type(4){ width: 28%; background-color: rgb(232,244,255); }
.fab_content_area2>ol>li>h4{ margin-bottom: 25px; color: rgb(0,72,145); font-weight: bold; font-size: 18px; word-break: keep-all; transition: all 0.12s ease-in-out; }
.fab_content_area2>ol>li>img{ width: auto; height: auto; max-width: 100%; transition: all 0.12s ease-in-out; }
.fab_content_area2>ul{ width: 100%; height: auto; display: flex; flex-flow: row wrap; transition: all 0.12s ease-in-out; }
.fab_content_area2>ul.mobile_view{ display: none; }
.fab_content_area2>ul>li{ height: auto; border-top: 1px solid rgb(255,255,255); padding: 15px; display: flex; flex-flow: row wrap; align-items: center; word-break: keep-all; font-size: 16px; transition: all 0.12s ease-in-out; }
.fab_content_area2>ul:nth-of-type(1)>li{ border-top: 0; }
.fab_content_area2>ul>li:nth-of-type(1){ width: 16%; background-color: rgb(0,72,145); color: rgb(255,255,255); font-weight: bold; }
.fab_content_area2>ul>li:nth-of-type(2){ width: 28%; background-color: rgb(173,205,234); }
.fab_content_area2>ul>li:nth-of-type(3){ width: 28%; background-color: rgb(161,184,225); }
.fab_content_area2>ul>li:nth-of-type(4){ width: 28%; background-color: rgb(165,165,165); }


/* 분석 및 측정 */
.analysis_content_title {border-bottom: 0;}
.bg_g {background-color: #f9f9f9; padding-bottom: 60px;}
.analysis_content {width: 100%; display: flex; justify-content: flex-start; align-items: center;}
.analysis {padding: 0 20px;}
.analysis .analysis_wrap01 {display: flex; flex-wrap: wrap; /* justify-content: center; */}

.analysis_wrap01 .img_box1 img {max-width: 100%;}
.analysis_wrap01 .text_box_wrap {margin-left: 40px;}
.analysis_wrap01 .text_box_wrap .analysis_text {padding-top: 20px ; position: relative; font-size: 18px;}

.analysis_wrap01 .text_box_wrap .analysis_text p>span {display: block; word-break: keep-all;}
.analysis_wrap01 .text_box_wrap .analysis_text::before {content:""; position: absolute; top: 0; width: 40px; height: 3px; background-color: #004891;}
.analysis .text_box_wrap .img_box2 {display: flex; padding-top: 50px;}
.analysis .text_box_wrap .img_box2 li {margin-right: 50px;}
.analysis .text_box_wrap .img_box2 li:last-child {margin-right: 0px;}

.analysis .text_box_wrap li>p {color: #004891; font-size: 20px; text-align: center; font-weight: bold; padding-top: 16px;}

.analysis_content02 {width: 100%;height: auto;margin: 40px auto 100px;padding: 0 20px;max-width: 1200px;transition: all 0.12s ease-in-out;}
.analysis_content02>ul{ width: 100%; height: auto; display: flex; flex-flow: row wrap; transition: all 0.12s ease-in-out; }
/* .analysis_content02>ul.mobile_view{ display: none; } */
.analysis_content02>ul>li{ height: auto; border: 1px solid #cccc; padding: 15px; /* display: flex; flex-flow: row wrap;  */align-items: center; word-break: keep-all; font-size: 16px; transition: all 0.12s ease-in-out; width: 21%; text-align: center;color: #fff;}
.analysis_content02>ul>li:first-child {width: 16%;}


/* .con_box02 li:nth-child(1) {background-color: #a1b8e1; }
.con_box02 li:nth-child(1) span {display: block; padding: 44px 0;}
.con_box03 li:nth-child(1) {background-color: #a1b8e1; }
.con_box03 li:nth-child(1) span {display: block; padding: 44px 0;} */


.con_box01 {width: 100%; background-color: #004891; }
.con_box01 th {background-color: #004891; color: #ffffff;height: auto;border: 1px solid #cccc; padding: 15px;align-items: center;word-break: keep-all;font-size: 16px;transition: all 0.12s ease-in-out;width: 21%;text-align: center; font-weight: 400;}
.con_box01 td { border: 1px solid #ccc;  padding: 15px;align-items: center;word-break: keep-all;font-size: 16px;transition: all 0.12s ease-in-out; width: 21%;text-align: center; background-color: #ffffff;}
.con_box01 td[scope="row"] {border: 1px solid #ffffff;}
.con_box01 .border_top_wh {border-top: 1px solid #ffffff;}

.con_box01 th:first-child {width: 16%;}
.con_box01 td:first-child {background-color: #a1b8e1; color: #fff; width: 16%;}
.con_box02 {margin-top: 45px; width: 100%;}
.con_box02 th {background-color: #004891; color: #ffffff;height: auto;border: 1px solid #cccc; padding: 15px;align-items: center;word-break: keep-all;font-size: 16px;transition: all 0.12s ease-in-out;width: 15%;text-align: center; font-weight: 400;}
.con_box02 td {border: 1px solid #cccc; padding: 15px;align-items: center;word-break: keep-all;font-size: 16px;transition: all 0.12s ease-in-out; width: 15%;text-align: center;}
.con_box02 td:first-child {width: 7%;}
.con_box02 .bag_bb {background-color: #a1b8e1; color: #fff;}
.color_red {color: #e83828;}
.con_box02 td:last-child {background-color: #a5a5a5; color: #ffffff;}
.con_box02_text {padding-top: 30px;}




/* S/W 개발 */
.sw_content{ width: 100%; max-width: 1200px; height: auto; margin: 60px auto 100px; padding: 0 20px; transition: all 0.12s ease-in-out; }
.sw_content>dl{ width: 100%; height: 250px; max-width: 1000px; margin: 20px auto; border: 3px solid rgb(232,244,255); display: flex; flex-flow: row wrap; transition: all 0.12s ease-in-out; }
.sw_content>dl>dt{ width: 50%; height: 100%; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; background-color: rgb(232,244,255); transition: all 0.12s ease-in-out; }
.sw_content>dl>dt>h4{ width: 100%; margin: 15px 0; padding: 0 10px; font-size: 16px; display: flex; flex-flow: row nowrap; align-items: center; transition: all 0.12s ease-in-out; }
.sw_content>dl>dt>h4>img{ width: 24px; height: 24px; min-width: 24px; min-height: 24px; margin-right: 10px; transition: all 0.12s ease-in-out; }
.sw_content>dl:nth-of-type(1)>dt>h4{ max-width: 280px; }
.sw_content>dl:nth-of-type(2)>dt>h4{ max-width: 280px; }
.sw_content>dl:nth-of-type(3)>dt>h4{ max-width: 190px; }
.sw_content>dl>dd{ width: 50%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; transition: all 0.12s ease-in-out; }

/* 인사말 */
.greeting_content{ width: 100%; max-width: 1200px; height: auto; margin: auto; padding: 0 20px; background-position: right 20px center; background-repeat: no-repeat; background-size: 60% auto; }
.greeting_content>dl{ width: 100%; margin: 50px 0 150px; display: flex; flex-flow: row wrap; justify-content: center; }
.greeting_content>dl>dd{ width: calc(100% - 510px); }
.greeting_content>dl>dd>h4{ width: 100%; padding-left: 15px; border-left: 5px solid rgb(0,0,0); display: flex; flex-flow: row wrap; font-size: 24px; }
.greeting_content>dl>dd>h4>span{ width: 100%; word-break: keep-all; }
.greeting_content>dl>dd>p{ width: 100%; margin-top: 30px; margin-left: 20px; display: flex; flex-flow: row wrap; line-height: 34px; font-size: 18px; }
.greeting_content>dl>dd>p.pc_view{ display: flex; }
.greeting_content>dl>dd>p.m_view{ display: none; }
.greeting_content>dl>dd>p>span{ width: calc(100% - 20px); word-break: keep-all; }
.greeting_content>dl>dd>p>span>span{ font-weight: bold; }
.greeting_content>dl>dt{ width: 490px; margin-left: 20px; }
.greeting_content>dl>dt>h4{ padding-left: 15px; border-left: 5px solid rgb(0,0,0); display: flex; flex-flow: row wrap; font-size: 20px; }
.greeting_content>dl>dt>h4>span{ margin: 3px 0; }
.greeting_content>dl>dt>h4>span>img{ width: 222px; height: auto; margin-right: 5px; }
.greeting_content>dl>dt>img{ width: 100%; height: auto; max-width: 743px; margin-top: 120px; }

/* 파트너 */
.partner_content{ width: 100%; max-width: 1200px; height: auto; margin: 50px auto 100px; padding: 0 20px; display: flex; flex-flow: row wrap; justify-content: center; }
.partner_content>p{ width: 100%; margin-bottom: 10px; font-weight: bold; font-size: 20px; text-align: center; }
.partner_content>ul{ width: 100%; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; }
.partner_content>ul>li{ width: 23%; height: auto; max-width: 270px; min-width: 220px; margin: 20px 1%; transition: all 0.2s ease-in-out; }
.partner_content>ul>li>img{ width: 100%; height: auto; }
.partner_content>div{ width: 100%; height: auto; height: auto; margin-top: 30px; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; }
.partner_content>div>img{ width: 100%; max-width: 660px; }

/* 오시는 길 */
.directions_content{ width: 100%; max-width: 1200px; height: auto; margin: 50px auto 100px; padding: 0 20px; }
#map{ width: 100%; height: 400px; margin-top: 50px; }
.directions_content>ul{ width: 100%; margin-top: 50px; border-top: 2px solid rgb(0,72,145); display: flex; flex-flow: row wrap; }
.directions_content>ul>li{ width: 100%; border-bottom: 1px solid rgb(204,204,204); display: flex; flex-flow: row nowrap; justify-content: center; }
.directions_content>ul>li>h4{ width: 15%; min-width: 120px; padding: 5px 10px;  border-right: 1px solid rgb(204,204,204); color: rgb(0,72,145); font-size: 16px; }
.directions_content>ul>li>p{ width: 85%; padding: 5px 10px; display: flex; flex-flow: row wrap; font-size: 16px; }
.directions_content>ul>li>p>span{ margin-right: 5px; }

/* CONTACT US */
.contact_content{ width: 100%; max-width: 1200px; height: auto; margin: 50px auto 100px; padding: 0 20px; }
.contact_content>ul{ width: 100%; margin-top: 40px; display: flex; flex-flow: row nowrap; justify-content: space-between; }
.contact_content>ul li:nth-of-type(1){ width: 50%; }
.contact_content>ul li:nth-of-type(2){ width: 45%; display: flex; flex-flow: row wrap; justify-content: center; }
.contact_content>ul .co_info{ min-width: 470px; font-size: 18px; background-position: 90% 60%; background-repeat: no-repeat; background-size: auto 40%; }
.contact_content>ul .co_info div{ display: flex; flex-flow: row wrap; margin: 5px 0; }
.contact_content>ul .co_info div:nth-of-type(2), .contact_content>ul .co_info div:nth-of-type(5){ margin-bottom: 30px; }
.contact_content>ul .co_info_01{ width: 50px; font-weight: bold; }
.contact_content>ul .co_info_02{ width: 130px; font-weight: bold; }
.contact_content>ul .contect{ width: 100%; }
.contact_content>ul .contect input{ width: 100%; border: 1px solid rgb(220,220,200); font-size: 14px; margin: 5px 0; padding: 10px; }
.contact_content>ul .contect textarea{ width: 100%; height: 130px; border: 1px solid rgb(220,220,200); font-size: 14px; margin: 5px 0; padding: 10px; }
.contact_content>ul .submit_btn{ width: 100%; background-color: rgb(0,72,145); color: rgb(255,255,255); font-size: 16px !important; font-weight: bold; border: 0 !important; }
.contact_content>ol{ width: 100%; margin-top: 50px; display: flex; flex-flow: row wrap; justify-content: center; }
.contact_content>ol>li{ width: 48%; height: auto; margin: 30px 10px 0; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; }
.contact_content>ol>li>img{ width: 100%; height: auto; max-width: 480px; }

/* 기업활동 */
.activity_content{ width: 100%; max-width: 1200px; height: auto; margin: 50px auto 100px; padding: 0 20px; }
.activity_content>.activity_video{ width:100%; max-width: 800px; height: 100%; display: block; margin: auto; }
