@charset "utf-8";

/* 페이지 전체 */
.service-overview-page {  /* menu1 */
  padding: 0 0 0 0;
  width: 100%;
  height: 100vh;
  object-fit: cover;
  background-size: cover;
  background-position: bottom;
  position: relative;
}
.service-overview-page::before{
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, #ff0000, #0000ff); /* Red to blue gradient */
  opacity: 0.7; /* Adjust transparency of the overlay */
  z-index: 9879999;
}
.service-overview-page.on{
  display: block;
}
.service-overview-page .breadcrumb{
  padding-left: 214px;
}
.service-overview-page .sub-desc{
  color: #fff;
}


/* 상단 경로 */
.breadcrumb {
  color: #fff;
}
/* 제목 영역 */
.title-area {
  margin: 137px 0 37px;
}
.left-fixed .desc{
  display: flex;
  align-items: baseline;
}
.main-title {
  font-size: 60px;
  color: #fff;
  margin-bottom: 55px;
}
.menu_subtit{
  font-size: 16px;
  line-height: 1.6;
}
.list_dot{
  content: "";
  width: 10px;
  height: 10px;
  background-color: #fff;
  border-radius: 100%;
  display: inline-block;
  margin-right: 10px;
}
.sub-desc {
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  margin-bottom: 70px;
}

/* menu1 */
.service-overview-page .slider-header {
  position: absolute;
  padding: 115px 0 100px 0;
  color: #fff;
  left: 0;
  z-index: 2;
}
.service-overview-page .title-area{
  display: flex;
  flex-direction: column;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  line-height: 1.3;
  align-items: center;
  margin: 0;
  text-align: center;
}
.service-overview-page .main-title{
  margin-bottom: 40px;
}.service-overview-page_wrap
.service-overview-page .sub-desc{
  margin-bottom: 0;
  font-size: 16px;
  color: #FFFFFFA6;
}
.service-overview-page_wrap{
  width: 100%; background: #111013;
}

/* 서비스개요 */
.service-overview {
  padding: 200px 30px 200px;
  color: #fff;
  font-family: "Pretendard-Regular", sans-serif;
}
.service-overview .container {
  max-width: 1490px;
  margin: 0 auto;
}
.service-overview .section-label {
  font-size: 16px;
  color: #FFFFFFA6;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #707070;
}
.service-overview .section-title {
  font-size: 32px;
  font-weight: normal;
  margin-bottom: 70px;
}
.service-overview1 .overview-list {
  display: flex;
  flex-direction: column;
  gap: 60px;
  position: relative;
  padding-left: 124px;
}
.service-overview1 .overview-list::before {
  content: "";
  position: absolute;
  left: 30px;
  top: 0;
  bottom: 0;
  width: 16px;
  background: url(../images/service_sec1_line.png) no-repeat center;
}
.service-overview1 .overview-item {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}
.service-overview1 .icon-box {
  width: 102px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.service-overview1 .text-box {
  display: flex;
  align-items: center;
}
.service-overview1 .text-box .title{
  line-height: 1.7em;
  width: 230px;
}
.service-overview1 .text-box .sub-label {
  font-size: 13px;
  color: #fff;
  font-family: "DMSansR";
  letter-spacing: 3.25px;
}
.service-overview1 .text-box h3 {
  font-size: 23px;
  margin: 5px 0;
  font-family: "Pretendard-Regular";
}
.service-overview1 .text-box p {
  font-size: 28px;
}
.service-overview1 .text-box .highlight {
  color: #DDEC39;
  font-family: "Pretendard-Bold";
}

/* 성과목표 */
.service-overview2{
  padding-top: 0;
}
.service-overview2 .section-title{
  margin-bottom: 104px;
}
.service-overview2 .goal-wrapper {
  position: relative;
}
.service-overview2 .goal-line {
  position: absolute;
  top: 250px;
  bottom: 0;
  right: 60px;
  width: 59px;
  background: url(../images/service_sec2_line.png) no-repeat center top;
}
.service-overview2 .goal-box {
  display: flex;
  align-items: stretch;
  background: #222;
  border-radius: 12px;
  padding: 60px 40px 0 0;
  gap: 40px;
  margin-right: 120px;
  -webkit-user-select: none;
}
.service-overview2 .goal-box.box01{
  margin-bottom: 58px;
}
.service-overview2 .goal-box.box02{
  margin-bottom: 76px;
}
.service-overview2 .goal-box.box03{
  margin-right: 0;
  padding-left: 20px;
}
.service-overview2 .goal-number {
  display: flex;
  align-items: end;
}
.service-overview2 .goal-number img {
  max-width: 100%;
  height: auto;
  display: block;
  -webkit-user-drag: none;
}
.service-overview2 .goal-content {
  flex: 1;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  height: calc(100% - 60px);
}
.service-overview2 .goal-label {
  font-size: 16px;
  color: #fff;
  letter-spacing: 4px;
  margin-bottom: 8px;
}
.service-overview2 .goal-title {
  font-size: 32px;
  margin-bottom: 60px;
}
.service-overview2 .goal-subtitle {
  font-size: 26px;
  margin-bottom: 32px;
}
.service-overview2 .goal-subtitle span {
  color: #DDEC39;
}
.service-overview2 .goal-desc {
  font-size: 20px;
  margin-bottom: 60px;
  line-height: 1.6;
}
.service-overview2 .goal-desc .highlight {
  color: #DDEC39;
}
.service-overview2 .goal-list {
  list-style: none;
  padding: 0;
  margin: 0 0 60px;
  border-left: 5px solid #DDEC39;
  padding-left: 25px;
}
.service-overview2 .goal-list li {
  font-size: 16px;
  line-height: 1.6;
}
.service-overview2 .goal-image {
  width: 300px;
  height: calc(100% - 60px);
  border-radius: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.service-overview2 .goal-image img {
  max-width: 100%;
  height: 400px;
  -webkit-user-drag: none;
}

.goal-models {
  display: flex;
  gap: 40px;
  margin: 23px 0 60px;
}
.goal-models .model {
  display: flex;
  gap: 16px;
  align-items: baseline;
}
.goal-models .model-title {
  display: block;
  font-size: 20px;
  color: #fff;
  opacity: 0.5;
}
.goal-models ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.goal-models ul li {
  font-size: 20px;
  line-height: 1.6;
  color: #fff;
}

/* 안전정보 디지털화 , 원격 현장조사·점검, 광역단위 안전관리시스템 및 실증 */
.service-overview3,
.service-overview4,
.service-overview5{
  padding-top: 0;
}
.service-overview3 .tech-header,
.service-overview4 .tech-header,
.service-overview5 .tech-header {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 145px;
  margin-bottom: 60px;
}
.service-overview3 .section-label,
.service-overview4 .section-label,
.service-overview5 .section-label{
  border-bottom:0;
  padding-bottom:0;
}
.service-overview3 .line,
.service-overview4 .line,
.service-overview5 .line{
  border-bottom: 1px solid #707070;
  margin-bottom: 20px;
  width: 358px;
}
.service-overview3 .tech-title,
.service-overview4 .tech-title,
.service-overview5 .tech-title {
  font-size: 32px;
}
.service-overview3 .desc-box ul,
.service-overview4 .desc-box ul,
.service-overview5 .desc-box ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.service-overview3 .desc-box li,
.service-overview4 .desc-box li,
.service-overview5 .desc-box li {
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 6px;
  color: #fff;
  opacity: 0.65;
}

.service-overview5 .tech-header{
  align-items: center;
}
.service-overview5 .tech-title{
  line-height: 1.3em;
}

/* menu2-2 성과 서비스 > 오픈 API */
.openapi_wrap{width: 100%;background: #0d0d0d;}
.openapi {
  background: #0d0d0d;
  color: #fff;
  width: 100%;
  height: 100vh;
  padding: 115px 0 150px 0;
  width: 1490px;
  max-width: 1490px;
  margin: 0 auto;
  overflow-y: scroll;
}
.openapi__head {
    margin: 57px auto 40px;
}
.openapi__title{
  font-size:50px;
  margin:0 0 20px;
}
.openapi__desc {
  margin: 0;
  color: #FFFFFFA6;
  line-height: 1.7;
  font-size: 16px;
}
.api-list {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 25px
}
.api {
  border-radius: 25px;
  overflow: hidden;
  background: #222;
  min-height: 150px;
}

.api-category {
    font-size: 32px;   /* 글자 크기 크게 */
    font-weight: 700;  /* 글자 두껍게 */
    color: white;    /* 원하시면 색상도 추가 */
    margin-bottom: 20px; /* 아래 간격 */
}
.api__btn {
  width: 100%;
  height: 150px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 45px;
  padding: 25px 50px;
  background: #2E2E2E;
  color: #fff;
  border: none;
  text-align: left;
  transition: background .2s ease;
}
.api__btn:hover{background:#2f2f2f}
.api__icon {
  width: 100px;
  height: 100px;
  background: url(../images/ico_open_api_1.png) no-repeat center;
}
.api.item1 .api__icon {background: url(../images/ico_open_api_1.svg) no-repeat center;}
.api.item2 .api__icon {background: url(../images/ico_open_api_2.svg) no-repeat center;}
.api.item3 .api__icon {background: url(../images/ico_open_api_3.svg) no-repeat center;}
.api.item4 .api__icon {background: url(../images/ico_open_api_4.svg) no-repeat center;}
.api__main{display:flex;flex-direction:column;gap:6px}
.api__name{font-size:24px;}
.api__summary{color:#FFFFFFA6;font-size:16px}
.api__meta{display:flex;align-items:center;gap:20px;color:#fff;font-size:14px}
.api__meta em{font-style:normal;color:#FFFFFFA6;margin-right:8px}
.api__chev{
  width:28px;height:28px;border-radius:50%;
  display:inline-grid;place-items:center;
  position:relative; margin-left:8px
}
.api__chev::before{
  content:""; width:8px; height:8px; border-right:2px solid #fff; border-bottom:2px solid #fff;
  transform:rotate(45deg); display:block
}
.api__panel{background:#222;}
.api__panel-in{margin:30px;padding: 20px;color:#d9d9d9;background: #111013;border-radius: 10px;line-height: 1.6em;}
.api__panel-in code{background:rgba(255,255,255,.06);padding:2px 6px;border-radius:6px}

.api__panel-in .li-title { height: 84px; font-size: 20px; display: flex; align-items: center; margin-bottom: 20px; padding: 0 33px; cursor: pointer;background-color: #2E2E2E; border-radius: 10px; }
.api__panel-in li:nth-last-child(1) .li-title { margin-bottom: 0; }

/* 목록 조회 카드 스타일 */
.list-card-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
    margin-top: 20px;
}
.list-card {
    background: linear-gradient(135deg, #1e1e1e, #2a2a2a);
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.3);
    transition: transform 0.3s, box-shadow 0.3s;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.list-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 28px rgba(0,0,0,0.45);
}

.list-card .card-title {
    font-size: 20px;
    margin-bottom: 15px;
    color: #ffffff; /* 강조 색상 */
}

.list-card .card-subtitle {
    font-size: 16px;
    color: #FFFFFFA6;
    margin-bottom: 16px;
    font-weight: normal;
}

.list-card .card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #ccc;
    flex-grow: 1;
}

.list-card .card-link {
    margin-top: 16px;
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    text-decoration: none;
    color: #090909;
    background: #DDEC39;
    padding: 8px 16px;
    border-radius: 12px;
    text-align: center;
    transition: background 0.3s;
}

.list-card .card-link {
    display: inline-block;   /* 크기 지정 가능하게 */
    width: 98px;            /* 가로 */
    height: 30px;            /* 세로 */
    line-height: 30px;       /* 텍스트 세로 가운데 정렬 */
    text-align: center;      /* 텍스트 가로 가운데 정렬 */
    border-radius: 10px;      /* 모서리 둥글게 */
    background: #DDEC39;     /* 기본 배경색 */
    transition: background 0.3s;
}

.list-card .card-link:hover {
    background: #c4d931;     /* 호버 시 색상 */
}

/* menu2-2 성과서비스 > 오픈API 상세페이지 */
.openapi_detail .openapi__body {
  background-color: #2E2E2E;
  color: #fff;
  padding: 30px;
  border-radius: 12px;
}
.openapi_detail .api__detail__wrap {
  position: relative;
  border-bottom: 1px solid #FFFFFF99;
}
.openapi_detail .api__subtitle {
  font-size: 24px;
  margin-bottom: 10px;
}
.openapi_detail .api__desc {
  font-size: 16px;
  color: #FFFFFFA6;
  margin-bottom: 30px;
}
.openapi_detail .btn-list {
  background-color: #DDEC39;
  color: #070707;
  font-size: 16px;
  border: none;
  padding: 10px 24px;
  border-radius: 6px;
  font-family:"Pretendard-Bold";
  position: absolute;
  right: 0;
  top: 0;
  cursor: pointer;
  transition: 0.2s;
  width: 135px;
  height: 50px;
}
.openapi_detail .btn-list:hover {
  opacity: .8;
}
.openapi_detail .api__section {
  padding: 30px 0;
  border-bottom: 1px dashed #FFFFFF99;
  display: flex;
  justify-content: space-between;
}
.openapi_detail .api__section:nth-last-child(1){
  border-bottom:0;
}
.openapi_detail .api__section__title {
  font-size: 18px;
  margin-bottom: 10px;
  color: #fff;
  width: 7%;
}
.openapi_detail .api__section__content {
  font-size: 16px;
  line-height: 1.7;
  background: #636363;
  border-radius: 5px;
  padding: 20px;
  width: 93%;
}


/* menu2-1 성과서비스 > 연구성과 */
.research-showcase {
  padding: 70px 0 0 30px;
  color: #fff;
  background: #111013;
  font-family: "Pretendard-Regular", sans-serif;
}
.research-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* max-width: 1490px; */
  height: calc(100vh - 70px);
  gap: 60px;
}
.research-list {
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
  position: relative;
  left: 25%;
  transform: translateX(-25%);
}
.research-list li {
  margin-bottom: 27px;
}
.research-list a {
  font-size: 40px;
  color: #FFFFFFB3;
  font-family: "Pretendard-Bold";
  transition: color 0.3s;
}
.research-list a span{
  font-size: 30px;
  font-family: "Pretendard-Regular";
}
.research-list li:hover a,
.research-list li.active a {
  color: #fff;
}
.research-list li:hover a span,
.research-list li.active a span{
  color: #DDEC39;
}
#preview-img {
  background: url(../images/service_thumb_00.png) no-repeat center;
  width: 100%;
  height: 100%;
  background-size: cover;
  flex: 1;
  opacity: .4;
}
#preview-img.active{
  display: flex;
}
#preview-img.thumb_01{ background: url(../images/service_thumb_01.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_02{ background: url(../images/service_thumb_02.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_03{ background: url(../images/service_thumb_03.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_04{ background: url(../images/service_thumb_04.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_05{ background: url(../images/service_thumb_05.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_06{ background: url(../images/service_thumb_06.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_07{ background: url(../images/service_thumb_07.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_08{ background: url(../images/service_thumb_08.png) no-repeat center; background-size: cover; opacity:1;}
#preview-img.thumb_09{ background: url(../images/service_thumb_09.png) no-repeat center; background-size: cover; opacity:1;}

/* menu2-1_1 연구성과 > 지자체 업무지원 서비스 */
.research-detail-header {
  position: relative;
  background: url(../images/service_1_thumb_header.png) no-repeat;
  color: #fff;
  background-size: contain;
}
.research-detail-header .container {
  max-width: 1490px;
  margin: 0 auto;
  padding: 0 30px;
}
.research-detail-header .back-btn {
  position: fixed;
  top: 120px;
  left: 30px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #111;
  color: #fff;
  align-items: center;
  justify-content: center;
  display: flex;
  font-size: 20px;
  z-index: 2;
}
.research-detail-header .back-btn:hover{
  opacity: .8;
}
.research-detail-header .back-btn img {
  width: 30px;
  height: auto;
  cursor: pointer;
}
.research-detail-header .banner {
  padding: 175px 0 53px;
}
.research-detail-header .title {
  font-size: 50px;
  margin-bottom: 20px;
}
.research-detail-header .desc {
  font-size: 16px;
  color: #FFFFFFA6;
  line-height: 1.6;
}
.research-detail-header .breadcrumb {
  background: #111013;
  color: #FFFFFFA6;
  padding: 30px 0;
}
/* 본문내용 */
.research-detail-header .process-section {
  background: #111013;
  padding: 60px 0 150px;
  color: #fff;
}
.research-detail-header .process-section .container {
  max-width: 1490px;
  padding: 0 30px;
  margin: 0 auto;
}
.research-detail-header .process-section .section-label {
  font-size: 16px;
  color: #FFFFFFA6;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #707070;
}
.research-detail-header .process-section .section-title {
  font-size: 32px;
  margin-bottom: 22px;
  font-weight: normal;
}
.research-detail-header .process-section .section-desc {
  font-size: 16px;
  color: #FFFFFFA6;
  margin-bottom: 40px;
  line-height: 1.6;
}
.research-detail-header .process-card-list {
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
}
.research-detail-header .process-card {
  flex: 1;
  background: #1c1c1c;
  padding: 20px;
  border-radius: 8px;
}
.research-detail-header .process-card h3 {
  font-size: 23px;
  border-bottom: 1px solid #707070;
  padding-bottom: 15px;
  margin-bottom: 15px;
}
.research-detail-header .process-card p {
  font-size: 16px;
  color: #FFFFFFA6;
  line-height: 1.6;
}
.research-detail-header .img_caption {
  font-size: 16px;
  color: #FFFFFFA6;
  text-align: center;
  margin-top: 10px;
}
.research-detail-header .img_second{
  margin-top: 40px;
}

.research-detail-header .visual-result-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 48px;
  margin: 50px;
}
.research-detail-header .visual-item {
  text-align: center;
  color: #fff;
  width: 358px;
  height: 358px;
  background: #222;
  border-radius: 50%;
}
.research-detail-header .circle-icon {
  width: 106px;
  height: 106px;
  margin: 50px auto 32px;
}
.research-detail-header .visual-item h3 {
  font-size: 24px;
  margin-bottom: 20px;
}
.research-detail-header .visual-item p {
  font-size: 16px;
  color: #FFFFFFA6;
  line-height: 1.6;
  width: 284px;
  margin: 0 auto;
}
.research-detail-header .arrow {
  flex-shrink: 0;
  background: url(../images/service_arrow_dot.png);
  width: 24px;
height: 44px;
}

/* menu2-1_2 연구성과 > 안전전검 디지털화 지원 서비스 */
.research-detail-header.menu2-1_2{
  background: url(../images/service_2_thumb_header.png) no-repeat;
  background-size: contain;
}
/* menu2-1_3 연구성과 > 건축물 스마트 검색 서비스 */
.research-detail-header.menu2-1_3{
  background: url(../images/service_3_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_3 .process-section{
  padding-bottom: 100px;
}
.menu2-1_3 .process-section.box02{
  padding-top: 0;
}
.menu2-1_3 .process-card-list{
  margin-top: 40px;
}
.menu2-1_3 .process-section.box04{
  padding-top: 0;
}
.menu2-1_3 .process-section.box04 img{
  margin-top: 18px;
}
/* menu2-1_4 연구성과 > 간략 내진성능평가 서비스 */
.research-detail-header.menu2-1_4{
  background: url(../images/service_4_thumb_header.png) no-repeat;
  background-size: contain;
}
/* menu2-1_5 연구성과 > 안전관리용 경량 3D BIM(sBIM) */
.research-detail-header.menu2-1_5{
  background: url(../images/service_5_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_5 .process-card h3{
  border: 0;
  padding-bottom: 20px;
  margin-bottom: 0;
}
.menu2-1_5 .process-card-list.box03{
  margin-bottom: 0;
}
.menu2-1_5 .process-card-list.box03 .process-card h3{
  padding-bottom: 15px;
}
.menu2-1_5 .process-card-list.box03 .txt{
  padding-bottom: 20px;
  font-size: 16px;
  color: #FFFFFFA6;
}
.menu2-1_5 .process-card-list.box03 .txt span{
  color: #DDEC39;
}
/* menu2-1_6 연구성과 > AI 기반 2D 도면 디지털화 */
.research-detail-header.menu2-1_6{
  background: url(../images/service_6_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_6 .process-section{
  padding-bottom: 100px;
}
.menu2-1_6 .process-section.box02,
.menu2-1_6 .process-section.box03,
.menu2-1_6 .process-section.box04{
  padding-top: 0;
}
.menu2-1_6 .process-section.box03 .section-title,
.menu2-1_6 .process-section.box04 .section-title{
  margin-bottom: 40px;
}
.menu2-1_6 .data_list{
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
}
.menu2-1_6 .data_list .list{
  width: 50%;
  overflow: hidden;
}
.menu2-1_6 .data_list p{
  font-size: 24px;
  margin-bottom: 20px;
}
.menu2-1_6 .data_list img{
  width: 100%;
}
/* menu2-1_7 연구성과 > 무인기 기반 실외 정보 구축 */
.research-detail-header.menu2-1_7{
  background: url(../images/service_7_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_7 .process-section{
  padding-bottom: 100px;
}
.menu2-1_7 .process-section.box02,
.menu2-1_7 .process-section.box03{
  padding-top: 0;
}
.menu2-1_7 .process-section.box02 .process-card-list{
  margin-bottom: 0;
}
.menu2-1_7 .process-section.box02 .process-card-list .process-card{
  background:transparent;
}
.menu2-1_7 .process-section.box02 .process-card-list .process-card h3{
  border-bottom: 0;
  padding-bottom: 20px;
  margin-bottom: 0;
}
.menu2-1_7 .process-card-list p img{
  width: 100%;
}
/* menu2-1_8 연구성과 > 영상스캔 및 AI 기반 실내 정보 구축 */
.research-detail-header.menu2-1_8{
  background: url(../images/service_8_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_8 .process-section{
  padding-bottom: 100px;
}
.menu2-1_8 .process-section.box02,
.menu2-1_8 .process-section.box03,
.menu2-1_8 .process-section.box04,
.menu2-1_8 .process-section.box05{
  padding-top: 0;
}
.menu2-1_8 .process-section.box04 .section-title,
.menu2-1_8 .process-section.box05 .section-title{
  margin-bottom: 40px;
}
.menu2-1_8 .process-section.box04 .section-title span{
  color: #DDEC39;
}
/* menu2-1_8 비디오 */
.menu2-1_8 .process-section.box03 .process-card-list{
  margin-bottom: 80px;
}
.menu2-1_8 .process-section.box03 .process-card p{
  display: flex;
  gap: 20px;
}
.menu2-1_8 .background-video {
  cursor: pointer;
  width: 716px;
  height: 403px;
  object-position: top;
  border-radius: 10px;
  /* object-fit: contain; */ /* 높이 안잘리게 나오도록..해야할 경우 대신 좌우 잘림 */
}
.menu2-1_8 .background-video:nth-child(2){
  object-position: center;
}

/* menu2-1_9 연구성과 > AI 기반 결함탐지 자동화 */
.research-detail-header.menu2-1_9{
  background: url(../images/service_9_thumb_header.png) no-repeat;
  background-size: contain;
}
.menu2-1_9 .process-section{
  padding-bottom: 100px;
}
.menu2-1_9 .process-section.box02,
.menu2-1_9 .process-section.box03,
.menu2-1_9 .process-section.box04,
.menu2-1_9 .process-section.box05{
  padding-top: 0;
}
.menu2-1_9 .process-section.box02 .section-title,
.menu2-1_9 .process-section.box03 .section-title,
.menu2-1_9 .process-section.box04 .section-title,
.menu2-1_9 .process-section.box05 .section-title{
  margin-bottom: 40px;
  gap: 0;
}
.menu2-1_9 .process-section.box03 .section-title span,
.menu2-1_9 .process-section.box04 .section-title span,
.menu2-1_9 .process-section.box05 .section-title span{
  color: #DDEC39;
}


/* menu3-1 민간 서비스 > 관련 법령 */
.menu3-1 .law-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
  gap: 20px;
  margin-top: 100px;
}
.menu3-1 .law-card {
  background: #2e2e2e;
  border-radius: 10px;
  padding: 20px 30px 30px;
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.menu3-1 .law-badge {
  background: #000;
  color: #FFFFFFA6;
  font-size: 16px;
  padding: 5px 14px;
  border-radius: 25px;
  width: fit-content;
}
.menu3-1 .law-title {
  font-size: 24px;
  margin: 0;
}
.menu3-1 .law-meta {
  display: flex;
  gap: 50px;
  font-size: 16px;
  color: #fff;
  margin: 15px 0 5px;
}
.menu3-1 .law-meta em {
  font-style: normal;
  color: #FFFFFFA6;
  margin-right: 6px;
}
.menu3-1 .law-btn {
  width: 130px;
  height: 46px;
  background: #DDEC39;
  color: #090909;
  font-size: 16px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 19px;
}
.menu3-1 .law-btn:hover {
  opacity: .8;
}


/* menu3-2 민간 서비스 > 점검/진단업체 정보 */
.menu3-2 .openapi__head{margin-bottom: 40px;}
.menu3-2 .filter-box {
  background: #333;
  border-radius: 14px;
  padding: 30px 60px;
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 60px;
  align-items: center;
  color: #fff;
}
.menu3-2 .filter-left,
.menu3-2 .filter-right {
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative; padding-right: 60px;
  border-right: 1px dashed #6c6c6c;
  height: 100%;
}
 .menu3-2 .filter-right{
  padding-right: 40px;
 }
.menu3-2 .form-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  color: #fff;
}
.menu3-2 .form-row label {
  min-width: 80px;
}
.menu3-2 .form-row select,
.menu3-2 .form-row input[type="text"] {
  flex: 1;
  background: #555;
  border: none;
  border-radius: 6px;
  padding: 0 10px;
  color: #FFFFFFA6;
  width: 320px;
  height: 30px;
  font-size: 16px;
}
.menu3-2 .form-row input[type="text"]::placeholder{
  font-size: 16px;
  color:#888;
}
.menu3-2 .form-row select{
  background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='white'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center; /* 아이콘 위치 */
  background-size: 20px;
}
.menu3-2 .form-row input[type="radio"] {
  margin-right: 10px;
  width: 16px;
  height: 16px;
  box-shadow: 0 0 0 6px #636363;
  background: #636363;
}
.menu3-2 .form-row input[type="radio"]:checked {
  box-shadow: 0 0 0 6px #636363;background: #DDEC39;
  width: 16px;
  height: 16px;
}
.menu3-2 .filter-actions {
  display: flex;
  gap: 20px;
  justify-content: center;
}
.menu3-2 .btn {
  border: none;
  border-radius: 6px;
  padding: 10px 18px;
  font-size: 15px;
  cursor: pointer;
  background: #DDEC39;
  color: #070707;
  transition: background 0.2s;
  width : 135px;
  height: 50px;
}
.menu3-2 .btn:hover { opacity: 0.8; }
.menu3-2 .filter-right .form-row {
  display: block;
}
.menu3-2 .filter-right .form-row span.txt{
  display: inline-block;
  margin-bottom: 16px;
}
.menu3-2 .filter-right .form-row.spaceTop{
  margin-top: 10px;
}
.menu3-2 .filter-right label{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  cursor:pointer; user-select:none;
}
.topradioArea{
  justify-content: space-between;
}
.menu3-2 .filter-right .form-row .flexDiv label {
  margin-right: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #FFFFFFA6;
}
.menu3-2 .form-row input[type="radio"]:checked + span {
  color: #fff;
}

/* menu3-2 table */
.result-table {
  margin: 40px 0;
  background: #2E2E2E;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #707070;
  border-radius: 10px;
}
.result-table table {
  width: 100%;
  border-collapse: collapse;
  color: #fff;
  font-size: 16px;
}
.result-table thead {
  background: #2E2E2E;
}
.result-table th,
.result-table td {
  padding: 14px 20px;
  border-bottom: 1px solid #4f4f4f;
  text-align: center;
}
.result-table th{
  padding: 26px 20px;
}
.result-table thead tr:first-child th:nth-child(4){ /* 기관명 */
  width: 220px;
}
.result-table thead tr:first-child th:nth-child(5){ /* 안전진단 여부 */
  width: 70px;
}
.result-table thead tr:first-child th:nth-child(6){ /* 정기점검 여부 */
  width: 70px;
}
.result-table thead tr:first-child th:nth-child(7){ /* 점검규모 */
  border: 0;
}
.result-table thead tr:first-child th:nth-child(8){ /* 기관 소재지 주소 */
  width: 355px;
}
.result-table thead tr:last-child th {
  padding: 0 0 20px;
  width: 100px;
}
.result-table td {
  color: #FFFFFFA6;
  line-height: 1.4em;
  vertical-align: middle;
}
.result-table tbody tr:last-child td {
  border-bottom: none;
}
.result-table td:last-child {
  text-align: left; /* 주소는 왼쪽 정렬 */
}


/* menu1-3 */
.research-page {
  display: flex;
  height: 100vh;
  overflow: hidden;
  position: relative;
}
/* 왼쪽 고정 영역 */
.left-fixed {
  width: 50%;
  background: linear-gradient(rgba(0,0,0,1), rgba(36,30,83,0.8)), url(../images/rnd_hero_slide_1_thumb.jpg);
  background-size: cover;
  background-position: left;
  padding: 115px 40px 80px 214px;
  box-sizing: border-box;
  overflow-y: scroll;
  height: 100vh;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}
.slider2 .left-fixed{
  background: linear-gradient(rgba(0,0,0,1), rgba(25,41,45,0.8)), url(../images/rnd_hero_slide_2_thumb.jpg);
  background-size: cover;
  background-position: center;
}

.slider3 .left-fixed{
  background: linear-gradient(rgba(0,0,0,1), rgba(25,41,45,0.8)), url(../images/rnd_hero_slide_3_thumb.jpg);
  background-size: cover;
  background-position: center;
}

.slider4 .left-fixed{
  background: linear-gradient(rgba(0,0,0,1), rgba(25,41,45,0.8)), url(../images/rnd_hero_slide_4_thumb.jpg);
  background-size: cover;
  background-position: center;
}

.left-fixed .breadcrumb{
  padding: 0;
}
.left-fixed .title-area {
  padding: 0;
}
.left-fixed .main-title{
  margin: 0;
  line-height: 1.4;
}
.left-fixed .summary,
.left-fixed .results {
  margin-bottom: 40px;
}
.left-fixed .summary h2{
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
}
.left-fixed .summary p{
  font-size: 16px;
  line-height: 1.6;
}
.highlight{
  color: #BC1818;
}
.result-list {
  display: flex;
  gap: 50px;
  margin-bottom: 30px;
}
.result-box {
  flex: 1;
  border-top: 1px solid #707070;
  padding-top: 20px;
}
.result-box h3{
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 15px;
}
.result-box p{
  font-size: 16px;
  line-height: 1.4;
}
.summary-text{
  border-top: 1px solid #707070;
  padding-top: 30px;
  font-size: 16px;
  line-height: 1.6;
}
.after-scroll-show {
  display: flex;
    width: 135px;
    height: 50px;
    background: #FFFFFF45;
    border-radius: 10px;
    backdrop-filter: blur(50px);
    margin-top: 100px;
    font-size: 16px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.after-scroll-show a{
  color: #FFFFFFA6;
}

.back-btn {
  display: inline-block;
  margin-top: 20px;
  font-weight: bold;
  text-decoration: none;
  color: #111;
  border: none;
  background: none;
  cursor: pointer;
}

/* 오른쪽 스크롤 영역 */
.right-scroll {
  width: 50%;
  height: calc(100vh - 280px);
  overflow-y: scroll;
  scroll-behavior: smooth;
  position: relative;
  background-color: #070707;
  padding: 280px 0 0 60px;
}
.right-scroll  .p100{padding-top: 30px;}
.right-scroll .desc{
  max-width: 687px;
  color: #fff;
  font-size: 16px;
}
.right-scroll img {
  width: 100%;
  display: block;
  margin-bottom: 20px;
}

.slider2 .right-scroll h4,
.slider3 .right-scroll h4,
.slider4 .right-scroll h4{
  margin-bottom: 20px;
}
h4{
  font-size: 24px;
}
.slider2 .right-scroll .desc p::before,
.slider3 .right-scroll .desc p::before,
.slider4 .right-scroll .desc p::before{
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #FFFFFFA6;
  border-radius: 100%;
  margin-right: 10px;
  position: relative;
  top: -3px;
}
.slider2 .right-scroll .desc p.caption::before,
.slider3 .right-scroll .desc p.caption::before,
.slider4 .right-scroll .desc p.caption::before{
  background: none;
  width: 0; margin:0;
}
.right-scroll .desc p {
    line-height: 1.8;
    color: #FFFFFFA6;
}
.right-scroll .img_wrap{
  margin: 40px 0 60px;
    width: 100%;
    height: 406px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.right-scroll .img_wrap .img_box{
  height: 386px;
  background-color: #141414;
  margin-bottom: 5px;
}

.right-scroll .img_wrap_multi{
  margin: 0px 0 0 0px;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.right-scroll .img_wrap_multi .img_box{
  height: auto;
  background-color: #141414;
  margin-bottom: 5px;
}

.caption{
  font-size: 13px;
  color: #FFFFFFA6;
}
/* menu3-2 민간서비스 > 점검/진단업체 정보 */
.agency-page {
  padding: 115px 0 0;
}

.agency-page .title-area {
  margin-bottom: 60px;
}
.agency-page .main-title{
  margin: 0;
}
.page-title {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 40px;
}
.agency-page .agency-section{
  background-color: #eee;
  padding-left: 214px;
  padding-right: 214px;
  padding-top: 60px;
  max-width: 1490px;
  margin: 0 auto;
}
.section-title {
  font-size: 30px;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
}
.agency-page .icon_star {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.section-title img {
  width: 28px;
  height: 27px;
}
.agency-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 30px 20px;
}
.agency-page .agency-section .agency-list {
  border-bottom: 1px solid #aaa;
  padding-bottom: 60px;
}
.agency-page .agency-section:nth-last-child(1) .agency-list {
  border: 0;
  padding-bottom: 90px;
}
.agency-box {
  text-align: center;
}
.agency-box .agency-img {
  width: 228px;
  height: 100px;
  border: 1px solid #707070;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.agency-box img {
  width: auto;
  height: auto;
  margin-bottom: 12px;
}

.agency-box p {
  font-size: 18px;
  font-weight: 500;
  color: #111;
  line-height: 1.4;
}

/* menu5-3 알림 > 연락처 안내 */
.contacts-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 20px;
  margin: 60px 0;
}
.menu5-3 .contacts-grid{
  margin-top: 40px;
}
.contact-card{
  background:#3a3a3a;
  border:1px solid #4a4a4a;
  border-radius:10px;
  padding:40px 20px 30px;
  color:#fff;
  display:flex;
  flex-direction:column;
  width: auto;
  height: auto;
}
.contact-card .card-title{
  font-size:24px;
  margin:0 0 25px 20px;
  color:#fff;
}
.contact-card .thumb{
  height:180px;
  margin-bottom:26px;
  width: 318px;
  cursor: default;
}
.contact-card .thumb::before{
  display: none;
}
.contact-card:nth-child(1) .thumb{background: url(../images/contact_01.svg);}
.contact-card:nth-child(2) .thumb{background: url(../images/contact_02.svg);}
.contact-card:nth-child(3) .thumb{background: url(../images/contact_03.svg);}
.contact-card:nth-child(4) .thumb{background: url(../images/contact_04.svg);}
.contact-card .meta{
  display:grid;
  grid-template-columns: 70px 1fr;
  row-gap:15px; column-gap:12px;
  margin:0;
}
.contact-card .meta dt{
  color:#FFFFFFA6; font-size:16px;
}
.contact-card .meta dd{
  margin:0; font-size:16px; color:#fff;
}
.contact-card .meta a{
  color:#e9e9e9; text-decoration:none;
}
.contact-card .meta a:hover{ text-decoration:underline; }

/* menu7 개인정보처리 등등 */
.policy-wrap{
  display:grid;
  grid-template-columns: 240px 1fr;
  gap: 28px;
  margin: 24px 0 0;
}
.policy-tabs{
  display:flex;
  flex-direction:column;
  gap:21px;
  width: 250px;
}
.policy-tabs .tab{
  display:flex; align-items:center; gap:10px;
  width:100%;
  padding:12px 14px;
  border-radius:10px;
  background:transparent;
  color:#FFFFFFA6; border:0; text-align:left; cursor:pointer;
  transition:background .2s, color .2s;
  font-size: 24px;
}

.policy-tabs .tab.is-active{color:#fff;}
.policy-tabs .ico{ width:20px;height: 20px;text-align:center; opacity:.9 }
.policy-tabs .ico.icon1{background: url(../images/terms_01.svg) no-repeat center;}
.policy-tabs .ico.icon2{background: url(../images/terms_02.svg) no-repeat center;}
.policy-tabs .ico.icon3{background: url(../images/terms_03.svg) no-repeat center;}
.policy-tabs .ico.icon4{background: url(../images/terms_04.svg) no-repeat center;}

.policy-tabs .tab.is-active .ico.icon1{background: url(../images/terms_01_on.svg) no-repeat center;}
.policy-tabs .tab.is-active .ico.icon2{background: url(../images/terms_02_on.svg) no-repeat center;}
.policy-tabs .tab.is-active .ico.icon3{background: url(../images/terms_03_on.svg) no-repeat center;}
.policy-tabs .tab.is-active .ico.icon4{background: url(../images/terms_04_on.svg) no-repeat center;}
.policy-content{
  width: auto;
  margin-left: 50px;
}
.policy-content .panel{
  background:#333;
  padding:24px;
  display: none;
  max-height: 700px;
  overflow: scroll;
}
.policy-content .panel.is-active{
   display: block;
}
.panel-title{
  margin:0 0 14px 0;
  font-size:24px;color:#FFFFFFA6;
}

.panel-body{
  color:#FFFFFFA6;font-size:16px;line-height:1.7;
}
.panel-body ul{ margin:8px 0 8px 20px; }

.panel-body::-webkit-scrollbar{ width:10px }
.panel-body::-webkit-scrollbar-thumb{ background:#5a5a5a; border-radius:10px }
.panel-body::-webkit-scrollbar-track{ background:#3a3a3a }

@view-transition {
  navigation: auto;
}