@charset "utf-8";

/* ※(Only)서브 페이지에 들어가는 디자인 작업 요망 -------------------------- */


/* --------------------------------------------
 * 서브 페이지 공통
/* ------------------------------------------ */
.ing_pic{text-align:center}
/*페이지 상단 박스*/
.desc_box {
    background-color: #f4f6f7;
    border-radius: 10px;
    padding: 50px 350px 50px 50px;
    margin-bottom: 75px;   
	position: relative;
}

.desc_box:after {
   content:'';
   display: flex;
   background-repeat: no-repeat;
   position: absolute;
  top: 0;
  right: 40px;
  width:300px;
  height:300px;
}

.desc_box .intro_title_text {
    display: inline-block;
    color: #173999;
    font-size: clamp(1.25rem, 1.1418rem + 0.4808vw, 1.5625rem);
    font-weight: 700;
    line-height: 120%;
}

.desc_box p {
    color: #31394a;
    line-height: 140%;
    margin-top: 25px;
}

.caution{font-size:14px;color:#f00;margin-top:15px}


.depart_info {
  display: flex;
  font-size: 15px;
  background:#f8f8f8;
  padding:10px
}
.depart_info_title {
  background: #f8f8f8;
  width: 150px;
  text-align: center;
  color: #4b4b4b;
  display: flex;
  align-items: center;
  display:none;
}
.depart_info_title i,
.depart_info_list li i {
  background: #fff;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  background:#fff
}

.depart_info_list {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  color: #4b4b4b;
  gap:40px
}

.depart_info_list li em{
	display:inline-flex;
	margin-right:10px;
	position: relative;
}

.depart_info_list li em:after{
	content: '\eeb4';
	display:inline-block;
	font-family:tabler-icons;
	margin-left: 10px;
}


/*프로세스 박스*/
.prcs_box {
    position: relative;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 30px
}

.prcs_box li {
    flex: 1;
    width: 100%;
    background-color: white;
    border: 1px solid #b3cbd5;
    border-radius: 5px;
    overflow: hidden;
    text-align: center;
    display: flex;
    flex-direction: column;
	justify-content: space-between;
}

.prcs_box li .prcs_header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 15px;
    background: #1f5ead;
    color: #fff;
    font-size: clamp(18px, 15.5px + 0.125vw, 22px);
    font-weight: 500;
}

.prcs_box li:nth-child(even) .prcs_header {
    background: #002b80;
}

.prcs_box .prcs_header .num {
    display: inline-flex;
    background: #fff;
    font-size: 14px;
    font-weight: 700;
    color: #1f5ead;
    padding: 10px;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
}

.prcs_box li .prcs_body {
    padding: 15px 20px;
	height: 100%;
    word-break: keep-all;
    font-size: clamp(0.9375rem, 0.8942rem + 0.1923vw, 1.0625rem);
}


.prcs_box li .prcs_footer {
    background:#f2f6fb;
	padding: 5px;
	text-align:center;
	font-size:16px;
	color:#1f5ead;
	font-weight:500
}



/*리스트*/


.list_bk li {
    position: relative;
    padding-left: 10px;
    margin-bottom: 15px;
	opacity: 0;
}
.aos-animate .list_bk li {
  opacity: 1;
}

.list_bk li:last-of-type {
    margin-bottom: 0
}

.list_bk li:before {
    content: '';
    position: absolute;
    top: 10px;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #000;
}


/*이미지 배경*/
.pic_box {
    background: #f4f7fb;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
}



/* --------------------------------------------
 * 허브소개
/* ------------------------------------------ */
.desc_box.overview:after {
	top:-20px;
    background-image: url(../images/sub/intro_box_bg_01.png);
}

.desc_box.organization:after {
	top:-27px;
    background-image: url(../images/sub/intro_box_bg_02.png);
}

.desc_box.vision:after {
	top:-27px;
    background-image: url(../images/sub/intro_box_bg_03.png);
}

.desc_box.location:after {
    background-image: url(../images/sub/intro_box_bg_04.png);
}

.desc_box.organization p{margin-top: 15px;}


.overview_pic01 {
    display: flex;
    justify-content: space-around;
}

.overview_pic01 li {
    position: relative;
}

.overview_pic01 li:after {
    content: '';
    display: flex;
    background: url(../images/sub/overview_pic_01_4.png) no-repeat;
    position: absolute;
    width: 120px;
    height: 12px;
    top: 50%;
    right: -120px;
}

.overview_pic01 li:last-child:after {
    background: none;
    width: 0px;
}

.kakaomap {
    position: relative;
    border-radius: 10px;
    border: 1px solid #004b85;
    overflow: hidden
}

.kakaomap .root_daum_roughmap_landing {
    width: 100% !important;
}



.skipMap a {
    position: absolute;
    top: -100px;
    height: 0
}

.skipMap a:focus {
    top: 0;
    height: auto;
    width: 100%;
    background: #000000;
    color: #fff;
    z-index: 1;
    position: relative;
    display: block;
    padding: 5px;
    text-align: center;
}

.kakaomap .cont {
    display: none
}

.btn.kakao {
    background: #fee601;
    color: #000 !important;
    border: 1px solid #fee601
}

.btn.naver {
    background: #09aa5c;
    color: #fff !important;
    border: 1px solid #09aa5c
}






/* --------------------------------------------
 * 시설안내
/* ------------------------------------------ */


.desc_box.machining:after{
	top:-35px;
    background-image: url(../images/sub/fac_box_bg_01.png);
	background-size: contain;
	width:250px;
    height: 250px;
	}

.desc_box.analysis:after{
	top:-15px;
    background-image: url(../images/sub/fac_box_bg_02.png);
	background-size: contain;
	width:250px;
    height: 250px;
	}
.desc_box.prototype:after{
	top:-5px;
    background-image: url(../images/sub/fac_box_bg_03.png);
	background-size: contain;
	width:250px;
    height: 250px;
	}
.desc_box.training:after{
	top:-35px;
    background-image: url(../images/sub/fac_box_bg_04.png);
	background-size: contain;
	width:250px;
    height: 250px;
	}
.desc_box.meeting:after{
	top:-35px;
    background-image: url(../images/sub/fac_box_bg_05.png);
	background-size: contain;
	width:250px;
    height: 250px;
	}



swiper.facility_pic {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    padding-bottom: 40px; /* 페이지네이션 공간 */
  }
 .facility_pic .swiper-slide img {
    width: 100%;
    display: block;
    border-radius: 8px;
  }

  .facility_pic .swiper-pagination {
	bottom: 0;
    background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(10px);
    color: #fff;
	font-weight:600;
    padding: 10px 20px;
    font-size: 14px;
    width: auto;
    right: 0;
    left: auto;
    border-radius: 8px 0 8px 0;
	}	

  /* 768px 이상일 때 페이지네이션 숨기기 (선택사항) */
  @media (min-width: 768px) {
   .facility_pic .swiper-pagination {
      display: none;
    }	

  }


dl.fac_caution{
	/* border:1px dashed #017eff; */
	background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='%236ea9d8' stroke-width='2' stroke-dasharray='6%2c 4' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
	border-radius:8px;
	margin:30px 0;
	overflow: hidden	
	}
dl.fac_caution dt{
	background:#f1f7fd;
	color:#017eff;
	font-weight: 600;
	padding:20px 45px;
	display: flex;
	align-items: center;
	border-radius:8px 8px 0 0;
	margin:1px
	}
dl.fac_caution dt i{
	font-size: 23px;
	margin-right:5px
	}
dl.fac_caution dd{
	padding: 20px 45px 20px 50px;
	color:#284664;
	font-size: 16px;
	}
dl.fac_caution dd ol
	{
	counter-reset: my-counter;
	}
dl.fac_caution dd ol > li:before{
	counter-increment: my-counter;
    content: counter(my-counter) ") ";
	position: absolute;
	left: 0;
	top: 0;
	}

dl.fac_caution dd ol > li:not(last-child){
	margin-bottom: 10px;
	position: relative;
	padding-left: 20px;
	}
.list_equip li{
	display: flex;
	align-items: center;
	gap: 70px;
	border:1px solid #b3cbd5;
	border-radius:5px;
	padding:20px 30px;
	margin-bottom:25px
	}
.list_equip li .pic{
	background:#f4f6f9;
	border-radius:5px;
	min-width:400px
	}
.list_equip li dt{
	font-size: clamp(1.125rem, 1.0673rem + 0.2564vw, 1.375rem);
	font-weight: 600;
	margin-bottom:20px
	}


.list_equip li dd {
    position: relative;
    padding-left: 10px;
    margin-bottom: 8px;
}

.list_equip li dd:last-of-type {
    margin-bottom: 0
}

.list_equip li dd:before {
    content: '';
    position: absolute;
    top: 10px;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #000;
}



/* --------------------------------------------
 * 사업안내
/* ------------------------------------------ */
.desc_box.consulting:after{
	top:-65px;
    background-image: url(../images/sub/biz_box_bg_01.png);
	background-size: contain;
}

.desc_box.automation:after {
	top:-45px;
    background-image: url(../images/sub/biz_box_bg_02.png);
	background-size: contain;

}
.desc_box.smart-mfg{
 padding: 50px 450px 50px 50px;
}

.desc_box.smart-mfg:after {
	top:-45px;
    background-image: url(../images/sub/biz_box_bg_03.png);
	background-size: contain;
	width: 350px;	
}

.desc_box.certified:after {
	top:-70px;
    background-image: url(../images/sub/biz_box_bg_04.png);
	background-size: contain;

}

.desc_box.equipment:after {
	top:-75px;
    background-image: url(../images/sub/biz_box_bg_05.png);
	background-size: contain;
}


.list_bk strong {
    font-size: 20px;
    color: #0a5b9f;
    font-weight: 600;
    display: block;
    margin-bottom: 8px
}




/* --------------------------------------------
 * 공지사항
/* ------------------------------------------ */

.st_waiting{
display:inline-block;
background:#ff5736;
border-radius:4px;
color:#fff;
font-size: 13px;
padding: 5px 18px;
text-align:center
}
.st_apply{
display:inline-block;
background:#017eff;
border-radius:4px;
color:#fff!important;
font-size: 13px;
padding: 5px 10px;
text-align:center
}



.st_closed{
display:inline-block;
background:#484e55;
border-radius:4px;
color:#fff;
font-size: 13px;
padding: 5px 18px;
text-align:center
}


/* --------------------------------------------
 * 풋터 메뉴
/* ------------------------------------------ */

.noemail_01{font-size:18px;padding: 50px;color:#001966}
.noemail_02{font-size: 25px;font-weight: 600;margin-bottom: 20px;	}
.noemail_02 span{font-size:17px}
.noemail_03>li:not(last-child){margin-bottom: 30px;}
.noemail_03 li strong{display: block;margin-bottom: 10px;}
.noemail_03 li ol{padding-left:25px ;}
.noemail_03 li ol li{list-style-type: decimal;margin-bottom: 5px;}

/* --------------------------------------------
 * 미디어쿼리 시작
/* ------------------------------------------ */

@media (max-width: 1400px) {

    /* --------------------------------------------
 * 서브 페이지 공통
/* ------------------------------------------ */
    .desc_box,.desc_box.smart-mfg {
        padding: 30px 25px;
        margin-bottom: 25px;
    }


}


/* 1200px 이하 */
@media screen and (max-width: 1200px) {

    /* --------------------------------------------
 * 서브 페이지 공통
/* ------------------------------------------ */
    .pc_br {
        display: none;
    }
	.desc_box {
        padding: 30px 25px;
        margin-bottom: 25px;
    }
    .desc_box:after {
        background-image: none !important
    }
	
    .prcs_box {
        flex-direction: column;
    }

	.inwrap{padding:0 20px}
  /* --------------------------------------------
 * 시설안내
/* ------------------------------------------ */
	.list_equip li {
	gap:40px;
	}

	.list_equip li .pic{
	min-width:auto
	}

}


@media screen and (max-width: 768px) {

    /* --------------------------------------------
 * 서브 페이지 공통
/* ------------------------------------------ */
    .desc_box {
        padding: 20px 15px;
    }

    .desc_box p {
        margin-top: 15px;
    }

    .prcs_box {
        flex-direction: column;
    }


    /* --------------------------------------------
 * 허브소개
/* ------------------------------------------ */
    .overview_pic01 li {
        gap: 10px
    }

    .overview_pic01 li:after {
        background: none
    }

  /* --------------------------------------------
 * 시설안내
/* ------------------------------------------ */
.list_equip li dt{
margin-bottom:10px;}

.list_equip li .pic{
	width:100%;
	text-align:center
	}
.list_equip li {
  display: flex;
  gap: 20px;
  flex-direction: column;
      align-items: flex-start;
	}

}


@media screen and (max-width: 500px) {

    /* --------------------------------------------
 * 서브공통
/* ------------------------------------------ */
    .pic_box {
        padding: 20px 10px;
    }

    /* --------------------------------------------
 * 허브소개
/* ------------------------------------------ */
    .overview_pic01 {
        flex-direction: column;
        align-items: center;
    }

    .overview_pic01 li {
        width: 80%
    }

}