/***************************************************************
ROOT
***************************************************************/
:root{
	--bg-color:#1f3a5f;
	--bg-color-rgb:78,78,78;
	--line-color:#162a45;
	--text-color:#ffffff;
	--muted:#777;
	--shadow:0 6px 18px rgba(0,0,0,.06);
}

img{
	width:100%;
}

body{
	overflow-x:hidden;
}

/***************************************************************
GLOBAL FIXED BACKGROUND
***************************************************************/
body.has-main-bg{
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	min-height:100dvh;
}

body.has-main-bg::before{
	content:"";
	position:fixed;
	inset:0;
	background-image:inherit;
	background-size:cover;
	background-position:center;
	z-index:-1;
	transform:translateZ(0);
}

.main-bg-overlay{
	position:fixed;
	inset:0;
	background:rgba(0,0,0,0.25);
	pointer-events:none;
	z-index:0;
}

/***************************************************************
HERO TOP AREA
***************************************************************/
.main-bg-position{
	position:relative;
	height:calc(100dvh - 61px);
	width:100%;
	z-index:1;
}

.sv-hero__titles{
	position:fixed;
	inset:0;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	color:#fff;
	z-index:10;
	pointer-events:none;
}

.sv-hero__titles{
	transition:opacity .15s linear, transform .15s linear;
	will-change:opacity, transform;
}
.sv-hero__titles .sv-meta{
	margin:0;
	font-size:18px;
	padding:10px 18px;
	background:rgba(var(--bg-color-rgb),0.85);
	color:var(--text-color);
	border-radius:999px;
}

.sv-hero__titles .sv-title{
	margin:14px 0 0;
	font-size:42px;
	text-shadow:2px 2px 6px rgba(0,0,0,.6);
}

/***************************************************************
SCROLL INDICATOR
***************************************************************/
.scroll-indicator{
	position:absolute;
	left:50%;
	bottom:30px;
	transform:translateX(-50%) translateY(10px);
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:3px;
	color:#fff;
	font-size:12px;
	letter-spacing:2px;
	opacity:0;
	pointer-events:none;
	transition:opacity .5s ease,
			   transform .5s cubic-bezier(.25,.8,.3,1);
	z-index:1000;
}

.scroll-indicator span{
	letter-spacing:normal;
	font-size:11px;
	display:block;
	margin-bottom:5px;
	color: #f00;
}

/* 보일 때 */
.scroll-indicator.is-show{
	opacity:.85;
	transform:translateX(-50%) translateY(0);
	pointer-events:auto;
	animation:fadePulse 1.5s ease-in-out infinite;
}

/* 숨길 때 */
.scroll-indicator.is-hide{
	opacity:0;
	transform:translateX(-50%) translateY(20px);
	pointer-events:none;
}
.scroll-arrows{
	display:flex;
	flex-direction:column;
	gap:0;
	margin-top:0;
}

.scroll-arrows span{
	display:block;
	width:10px;
	height:10px;
	margin:0 auto;
	position:relative;
	opacity:0;
	animation:arrowMove 1.6s infinite;
	filter:drop-shadow(0 3px 8px rgba(0,0,0,.8));
}

.scroll-arrows span::before{
	content:'';
	position:absolute;
	inset:0;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
	transform:rotate(45deg);
}

.scroll-arrows span:nth-child(1){
	animation-delay:0s;
}

.scroll-arrows span:nth-child(2){
	animation-delay:.2s;
}

.scroll-arrows span:nth-child(3){
	animation-delay:.4s;
}

@keyframes arrowMove{
	0%{ opacity:0; transform:translateY(0); }
	40%{ opacity:1; }
	100%{ opacity:0; transform:translateY(10px); }
}

@keyframes fadePulse{
	0%,100%{ opacity:.55; }
	50%{ opacity:1; }
}

.scroll-mouse{
	width:26px;
	height:40px;
	border:2px solid #fff;
	background:rgba(255,255,255,.12);
	border-radius:20px;
	position:relative;
	backdrop-filter:blur(2px);
	-webkit-backdrop-filter:blur(2px);
	box-shadow:0 6px 18px rgba(0,0,0,.55),inset 0 0 12px rgba(255,255,255,.08);
}

.scroll-wheel{
	width:4px;
	height:8px;
	background:rgba(255,0,0.85);
	border-radius:4px;
	position:absolute;
	top:8px;
	left:50%;
	transform:translateX(-50%);
	animation:wheelMove 1.6s infinite;
}

@keyframes wheelMove{
	0%{ opacity:0; top:8px; }
	30%{ opacity:1; }
	100%{ opacity:0; top:20px; }
}

/***************************************************************
SITE VIEW (GLASS AREA)
***************************************************************/
.site-view{
	position:relative;
	z-index:5;
	padding-bottom:50px;
	background:rgba(var(--bg-color-rgb),0.97);
	color:var(--text-color);
}
.site-view-lift{
	position:absolute;
	z-index:2;
	height:120px;
	width:50px;
	bottom:65px;
	left:50%;
	transform:translateX(-50%) translateY(40px);
	border-radius:40px;
	display:flex;
	align-items:center;
	justify-content:center;

	opacity:0;

	transition:
		opacity .6s ease,
		transform .6s cubic-bezier(.25,.8,.3,1);
}
.site-view-lift .scroll-action{
	display:block;
	position:absolute;
	top:0;
	left:50%;
	font-size:10px;
	width:40px;
	margin-left:-20px;
	color:#fff;
}
/* 등장 완료 상태 */
.site-view-lift.is-ready{
	opacity:1;
	transform:translateX(-50%) translateY(0);
}
/* 숨길 때 */
.site-view-lift.is-hide{
	opacity:0;
	transform:translateX(-50%) translateY(30px);
	pointer-events:none;
}
@keyframes liftUp{
	from{ transform:translateY(120px); }
	to{ transform:translateY(0); }
}
section{
	max-width:1280px;
	margin:0 auto;
}

/***************************************************************
HERO LAYOUT + SWIPER
***************************************************************/
.sv-hero{
	padding-top:80px;
}
.sv-hero__title {
    text-align: center;
    margin-bottom: 60px;
    font-size: 42px;
    font-weight: 700;
}

.sv-hero__body {
    display: grid;
    gap: 50px;
    align-items: stretch;
	grid-template-columns: 65% 1fr;
}


.sv-hero__slider{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:10px;
}

.sv-hero__slider .swiper,
.sv-hero__slider .swiper-wrapper,
.sv-hero__slider .swiper-slide{
  height:100%;
}

.sv-hero__slide img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	display:block;
}

.swiper-button-next,
.swiper-button-prev{
	color:#fff;
}

.swiper-pagination-bullet{
	width:20px;
	height:20px;
}

/***************************************************************
HERO SPEC (사업개요)
***************************************************************/
.sv-hero__spec{
	padding:10px;
	border-radius:10px;
	background:rgba(255,255,255,0.06);
	box-shadow:0 20px 60px rgba(0,0,0,.35);
	border:1px solid rgba(255,255,255,0.08);
}

.sv-hero__spec h3{
	margin:0 0 30px;
	font-size:20px;
	font-weight:700;
	text-align:center;
	color:#fff;
}

/***************************************************************
TABLE
***************************************************************/
.sv-table{
	width:100%;
	border-collapse:collapse;
}

.sv-table th,
.sv-table td{
	padding:10px 12px;
	font-size:14px;
	line-height:1.6;
}

.sv-table th{
	width:180px;
	font-weight:600;
	color:rgba(255,255,255,.85);
}

.sv-table td{
	color:#fff;
}

.sv-table tr{
	border-bottom:1px solid rgba(255,255,255,0.15);
}

.sv-table tr:last-child{
	border-bottom:none;
}

.sv-table tr:hover{
	background:rgba(255,255,255,0.05);
	transition:.25s ease;
}

/***************************************************************
SUMMARY
***************************************************************/
.sv-summary{
	max-width:1280px;
	margin:50px auto;
	padding:0;
}

.summary-title{
	font-size:26px;
	font-weight:700;
	margin-bottom:30px;
	position:relative;
	padding-left:18px;
}

.summary-title::before{
	content:'';
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	width:6px;
	height:22px;
	background:#0d2b78;
	border-radius:3px;
}

.summary_pd{
	background:rgba(255, 255, 255, 1);
	padding:40px;
	border-radius:20px;
	line-height:1.8;
	font-size:16px;
	color:#222;
}

.summary_pd .strong-title{
	font-size: 18px;
    display: block;
    padding: 10px 20px;
    background: #233e62;
    margin-top: 0;
    color: #fff;
    border-radius: 99px;
    text-align: center;
}
.summary_pd h4{
	font-size:18px;
}
.sector-intro{
	display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
}

.sector-intro p{
	background:#eee;
	padding:12px 15px;
	border-radius:10px;
}
.sv-h3{
	color:#000;
}
.sector-intro li{
	font-size:16px;
	margin-left:0px;
}

.sector-title{
  display:flex;
  align-items:flex-start;
  gap:8px;
  line-height:1.5;
}

/* =========================================
   👉 손가락 정렬 전용
========================================= */

.sector-desc{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-top:12px;
  line-height:1.6;
}

.sector-icon{
  flex:0 0 24px;
}

.sector-desc-text{
  flex:1;
  word-break:keep-all;
}
.sector-num{
  flex:0 0 32px;   /* 숫자 고정폭 */
}

.sector-text{
  flex:1;
  word-break:keep-all;
}

/***************************************************************
LOCATION
***************************************************************/
.sv-location{
	margin:50px auto;
	padding:40px;
	border-radius: 15px;
	background:rgba(255, 255, 255, .5);
	box-shadow:0 10px 35px rgba(0,0,0,0.06);
	color:#000;
}

.sv-location__row{
	display:flex;
	gap:15px;
	align-items:center;
	margin-bottom:25px;
}

.sv-map{
	width:100%;
	height:420px;
	overflow:hidden;
	box-shadow:0 8px 25px rgba(0,0,0,0.08);
}

.sv-map-btn{
	margin:15px auto;
	display:inline-block;
	padding:12px 22px;
	border-radius:0px;
	background:#f7e600;
	color:#111;
	text-align:center;
	font-weight:600;
	text-decoration:none;
	transition:.25s ease;
}

.sv-map-btn:hover{
	background:#111;
	color:#fff;
	transform:translateY(-2px);
}
.sv-map-actions{
	text-align:right;
}
/* =========================================
   Summary / Highlights / Targets Grid
========================================= */

.sv-grid2{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:28px;
  margin:60px auto;
  padding:0px;
}

/* 카드 공통 */
.sv-card{
  background:rgba(255, 255, 255, 1);
  border-radius:18px;
  padding:10px 25px 20px;
  box-shadow:0 10px 35px rgba(0,0,0,0.05);
  transition:all .35s ease;
  position:relative;
  overflow:hidden;
}

/* hover 효과 */
.sv-card:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 45px rgba(0,0,0,0.08);
}

/* 제목 */
.sv-card h2{
  font-size:20px;
  font-weight:700;
  margin-bottom:18px;
  color:#111;
  letter-spacing:-0.5px;
  position:relative;
}

/* 기본정보 텍스트 */
.sv-card p{
  font-size:15px;
  line-height:1.8;
  color:#F00;
  word-break:keep-all;
}

/* 리스트 */
.sv-card ul{
  list-style:none;
  padding:0;
  margin:0px;
}

.sv-card li{
  position:relative;
  padding-left:20px;
  margin-bottom:5px;
  font-size:15px;
  line-height:1.7;
  color:#444;
}

/* 체크 아이콘 느낌 */
.sv-card li::before{
  content:'✔';
  position:absolute;
  left:0;
  top:0;
  font-size:13px;
  color:#8c2100;
  opacity:.7;
}

/* 마지막 li 여백 제거 */
.sv-card li:last-child{
  margin-bottom:0;
}

.sector-intro div ul{
	min-height:140px;
}
/* =========================================
   반응형
========================================= */

@media (max-width:768px){

  .sv-grid2{
    margin:0px 0 50px;
    gap:20px;
	grid-template-columns:1fr;
  }

  .sv-card{
    padding:10px 15px 24px;
  }

  .sv-card h2{
	text-align:center;
    font-size:18px;
	margin-top:5px;
  }

  .sv-card p,
  .sv-card li{
    font-size:13px;
  }
  .sv-summary{
	  width:100%;
	margin:50px 0px 0;
  }
  .sv-map-btn{
	  display:block;
  }
  /* 리스트 */
  .sv-card ul{
    margin:0 0 0 10px;
  }
  .swiper-pagination-bullet{
	width:10px;
	height:10px;
  }
}

/* =========================================================
   지식산업센터 업종 안내 통합 스타일 (ji-*)
   - 다크/화이트 자동 대응
   - 중복 제거
========================================================= */

.ji-tenant{
  --ji-bg: var(--bg-color, #ffffff);
  --ji-text: var(--text-color, #111);
  --ji-muted: rgba(0,0,0,.6);
  --ji-card: rgba(0,0,0,.03);
  --ji-line: rgba(0,0,0,.08);
  --ji-shadow: 0 8px 22px rgba(0,0,0,.08);
  --ji-radius: 18px;
  --text-color:#000;

  max-width: 1180px;
  margin: 0 auto;
  padding: 28px 18px;
  color: var(--ji-text);
}

.sv-box {
	color:#000;
}
.sv-box--ok {
	padding-bottom:20px;
}
.sv-box--warn,
.ji-check__title {
	padding-top:20px;
	border-top:1px solid #ccc;
}
.ji-check__title{
	margin-top:40px;
	padding-top:40px;
	
}
.ji-note-mini{
	margin:10px 0 0 15px;
}
/* ================== 헤더 ================== */

.ji-tenant__head{
  margin-bottom: 18px;
}

.ji-tenant__title{
  font-size: clamp(20px, 2.4vw, 26px);
  margin:0;
  line-height:1.25;
  letter-spacing:-0.02em;
  word-break:keep-all;
}

.ji-tenant__sub{
  margin-top:6px;
  font-size:14px;
  color:var(--ji-muted);
  line-height:1.6;
  word-break:keep-all;
}

/* ================== 그리드 ================== */

.ji-tenant__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:16px;
}

/* ================== 카드 공통 ================== */

.ji-card{
  background: var(--ji-card);
  border: 1px solid var(--ji-line);
  border-radius: var(--ji-radius);
  box-shadow: var(--ji-shadow);
  padding:18px;
  transition:.2s ease;
}

.ji-card:hover{
  transform:translateY(-3px);
}

/* ================== 배지 ================== */

.ji-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 14px;
  border-radius:999px;
  font-size:15px;
  font-weight:600;
  border:1px solid var(--ji-line);
  margin:20px 0 14px;
}

/* ================== 리스트 ================== */

.ji-list{
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  flex-direction:row;
  gap:8px;
}

.ji-list li{
  position:relative;
  padding-left:14px;
  margin-bottom:0;
  font-size:14px;
  line-height:1.6;
  word-break:keep-all;
}

.ji-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.7em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--ji-text);
  opacity:.4;
}

/* ================== 강조 포인트 ================== */

.ji-point{
  margin-top:14px;
  padding:10px 12px;
  border-radius:14px;
  border:1px dashed var(--ji-line);
  background:rgba(0,0,0,.8);
  font-size:14px;
  display:flex;
  gap:8px;
  max-width: fit-content;
  color:#fff !important;
}

.ji-point__label{
  font-size:12px;
  font-weight:600;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid var(--ji-line);
  background:#f00;
}
.ji-note__text{
	color:#f00 !important;
}
/* ================== 안내 박스 공통 ================== */

.ji-box{
  margin-top:20px;
  padding:16px;
  border-radius:var(--ji-radius);
  border:1px solid var(--ji-line);
  background:rgba(0,0,0,.04);
}

.ji-box h3{
  margin:0 0 10px;
  font-size:16px;
  font-weight:600;
}

/* ================== 경고 타입 ================== */

.ji-card--warn{
  border-color: rgba(220,38,38,.25);
  background: rgba(220,38,38,.05);
}

.ji-badge--warn{
  border-color: rgba(220,38,38,.4);
  background: rgba(220,38,38,.1);
  color:#dc2626;
}

.ji-box--warn{
  border-color: rgba(234,179,8,.35);
  background: rgba(234,179,8,.08);
}

/* ================== 긍정 타입 ================== */

.ji-box--info{
  border-color: rgba(37,99,235,.25);
  background: rgba(37,99,235,.08);
}

/* ================== 하단 노트 ================== */

.ji-note{
  margin-top:20px;
  font-size:13px;
  color:var(--ji-muted);
  line-height:1.6;
}

.ji-note strong{
  color:#dc2626;
  text-decoration:underline;
}
@media ( max-width:1024px ){
	.sv-hero__title {
		font-size: 28px;
	}
	.sv-hero__body {
		display: flex;
		gap: 50px;
		flex-direction:column;
	}

	.sv-location{
		margin-bottom:0;
	}
}
/* ================== 반응형 ================== */

@media (max-width:980px){
	.ji-tenant__grid{
		grid-template-columns:1fr;
	}

	.ji-list{
		margin:0;
		padding:0;
		list-style:none;
		display:flex;
		flex-direction:column;
		gap:8px;
	}

	.ji-list li{
		position:relative;
		padding-left:14px;
		font-size:14px;
		line-height:1.6;
		word-break:keep-all;
	}
	.sv-industries{
		margin:0 5px;
	}
}
/* =========================================
   Core-info / management / 묶음
========================================= */

.sv-core-info{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:30px;
	margin-top:50px;
	margin-bottom:50px;
}
.sv-label-green{
  color:#a20303;
  font-weight:700;
}
.sv-kv strong{
	display:inline-block;
	margin-left:15px;
}

/* =========================================
   GALLERY WRAP
========================================= */
.sv-gallery-wrap{
    max-width:1400px;
    margin:50px auto;
    padding:0px;
}

/* 섹션 간 여백 */
.sv-gallery-section{
    margin-bottom:50px;
}

/* 타이틀 */
.sv-h2{
    font-size:28px;
    font-weight:700;
    margin-bottom:30px;
    letter-spacing:-0.5px;
}

/* =========================================
   GRID LAYOUT
========================================= */
.sv-gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:20px;
}

/* 이미지 카드 */
.sv-figure{
    position:relative;
    overflow:hidden;
    border-radius:14px;
    cursor:pointer;
	margin:0;
}

/* 이미지 */
.sv-figure img{
    width:100%;
    height:200px;
    object-fit:cover;
    transition:transform .6s ease, filter .6s ease;
    display:block;
}

/* hover 몰입 효과 (PC 전용) */
@media (hover:hover){
    .sv-figure:hover img{
        transform:scale(1.07);
        filter:brightness(1.05);
    }
}

/* 캡션 */
.sv-figure figcaption{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    padding:10px;
	text-align:center;
    font-size:14px;
    background:linear-gradient(to bottom, rgba(0,0,0,.7), transparent);
    color:#fff;
	cursor: not-allowed;
}

/* ===============================
   갤러리 이미지
================================ */
.sv-figure {
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
}

.sv-figure img {
    display: block;
    width: 100%;
    transition: transform .35s ease;
	object-fit:cover;
    object-position:top;
}

.sv-figure:hover img {
    transform: scale(1.05);
}
.sv-gallery-section,
.sv-faq{
	background:rgba(255,255,255,0.5)
}
/* ===============================
   확대 아이콘
================================ */
.sv-zoom-icon {
    position: absolute;
    bottom: 14px;
    right: 14px;
    width: 42px;
    height: 42px;
	cursor: not-allowed;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.65);
    color: #fff;

    border-radius: 50%;
    backdrop-filter: blur(6px);

    box-shadow: 0 8px 18px rgba(0,0,0,0.35);

    opacity: 0;
    transform: translateY(6px);
    transition: all .25s ease;
}

/* PC hover 시 등장 */
.sv-figure:hover .sv-zoom-icon {
    opacity: 1;
    transform: translateY(0);
}

/* 모바일은 항상 살짝 보이게 */
@media (max-width: 768px) {
    .sv-zoom-icon {
        opacity: 0.9;
        transform: none;
		width: 30px;
		height: 30px;
    }
	.sector-intro div ul{
		min-height:auto;
	}
}

/* ===============================
   CTA SECTION
================================ */
.sv-cta {
    margin: 60px auto;
    padding: 60px 20px;

    text-align: center;

    background: linear-gradient(135deg, #111 0%, #1e1e1e 100%);
    border-radius: 20px;

    position: relative;
    overflow: hidden;
}

/* 은은한 빛 효과 */
.sv-cta::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at center, rgba(255,255,255,0.08), transparent 90%);
    animation: ctaGlow 6s linear infinite;
}

@keyframes ctaGlow {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ===============================
   CTA BUTTON
================================ */
.sv-btn--primary {
    position: relative;
    display: inline-block;

    padding: 20px 48px;

    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.3px;

    border-radius: 60px;

    color: #111;
    background: linear-gradient(90deg, #ffd54f, #ffb300);

    text-decoration: none;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.35),
        0 0 0 0 rgba(255,179,0,0.6);

    transition: all .3s ease;
}

/* hover */
.sv-btn--primary:hover {
    transform: translateY(-4px);
    box-shadow:
        0 16px 35px rgba(0,0,0,0.45),
        0 0 25px rgba(255,179,0,0.7);
}

/* 클릭 시 */
.sv-btn--primary:active {
    transform: translateY(0);
}

/* ===============================
   HINT TEXT
================================ */
.sv-hint {
    margin-top: 18px;
    font-size: 14px;
    color: rgba(255,255,255,0.7);
}

/* ===============================
   모바일 최적화
================================ */
@media (max-width: 768px) {

    .sv-cta {
        margin: 50px 5px;
        padding: 40px 15px;
        border-radius: 16px;
		box-sizing: border-box;
        width: calc(100% - 10px);
    }

    .sv-btn--primary {
        width: 100%;
        font-size: 18px;
        padding: 18px;
    }

    .sv-hint {
        font-size: 13px;
    }
}


/* ===============================
   VIDEO SECTION
================================ */
.sv-video {
    margin: 50px auto 0;
    background: rgba(255, 255, 255, 0.5);
    padding: 40px;
    border-radius: 15px;
}

.sv-section-title {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.5px;
    margin-bottom: 40px;
    text-align: center;
	color:#000;
}

/* ===============================
   GRID
================================ */
.sv-video-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.sv-video-grid:has(.sv-video-item:only-child){
  grid-template-columns: 1fr;
  justify-items:center;
}

.sv-video-grid:has(.sv-video-item:only-child) .sv-video-item{
  max-width:720px;
  width:100%;
}
/* ===============================
   CARD
================================ */
.sv-video-item {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
    transition: all .35s ease;
}

.sv-video-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 60px rgba(0,0,0,0.15);
}

/* ===============================
   TITLE
================================ */
.sv-video-title {
	font-size: 14px;
    font-weight: 600;
    padding: 10px 0px;
    margin: 0;
    color: #fff;
	background:#000;
    letter-spacing: -0.3px;
	text-align: center;
}

/* ===============================
   VIDEO WRAP
================================ */
.sv-video-wrap {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    background: #000;
}

.sv-video-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ===============================
   모바일 최적화
================================ */
@media (max-width: 1024px) {
    .sv-video-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
	.sv-hero__title{
		margin-bottom:30px;
	}
}

@media (max-width: 768px) {
	
	.sv-video-wrap {
		width: 100%;
		margin:0 auto;
	}

    .sv-video {
        margin: 70px 0;
    }

    .sv-section-title {
		color:#000;
        font-size: 18px;
        margin-bottom: 25px;
    }

    .sv-video-item {
        border-radius: 0px;
    }

    .sv-video-title {
        font-size: 16px;
        padding: 8px 0px;
        text-align: center;
        border-radius: 999px;
        margin: 0 0px 5px;
    }
}

/* =========================================
   FAQ SECTION
========================================= */

.sv-faq {
    margin: 60px auto;
    padding: 40px;
}

/* 리스트 */
.sv-faq-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* 개별 아이템 */
.sv-faq-item {
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    transition: all .3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}

/* 질문 버튼 */
.sv-faq-q {
    width: 100%;
    padding: 20px 24px;
    background: #fff;
    border: none;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    transition: all .25s ease;
}

/* 화살표 아이콘 */
.sv-faq-q::after {
    content: '\f078';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform .3s ease;
}

/* 열림 상태 */
.sv-faq-item.active .sv-faq-q {
    background: linear-gradient(90deg,#111,#333);
    color: #fff;
}

.sv-faq-item.active .sv-faq-q::after {
    transform: translateY(-50%) rotate(180deg);
}

/* 답변 래퍼 (슬라이드용) */
.sv-faq-a-wrap {
    max-height: 0;
    overflow: hidden;
    transition: max-height .45s cubic-bezier(.4,0,.2,1);
    background: #fafafa;
}

/* 열림 상태 */
.sv-faq-item.active .sv-faq-a-wrap {
    max-height: 500px; /* 충분히 큰 값 */
}

/* 답변 텍스트 */
.sv-faq-a {
    padding: 20px 24px;
    font-size: 15px;
    line-height: 1.7;
    color: #444 !important;
}
.frequently{
	display:inline-block;
	padding:3px 10px;
	border-radius:5px;
	font-size:10px;
	font-weight:normal;
	background:#000;
	color:#fff;
}
/* 모바일 */
@media (max-width:768px){
	.sv-faq-list {
	  gap: 8px;
	}
    .sv-faq {
        padding: 10px 5px 24px;
    }

    .sv-faq-q {
        font-size: 14px;
        padding: 10px 25px 10px 10px;
		word-break: keep-all;
		font-weight:normal;
    }

    .sv-faq-a {
        padding: 16px 18px;
        font-size: 13px;
    }
	
}

/***************************************************************
RESPONSIVE
***************************************************************/
@media (max-width:1023px){
	menu{
		display:none;
	}
	.main-bg-position{
		height:calc(100dvh - 61px);
	}
	.sv-hero{
		grid-template-columns:1fr;
		height:auto;
		padding:15px;
	}

	.sv-location{
		border-radius:0;
	}

	.summary_pd,
	.sv-core-info,
	.sv-grid2,
	.sv-gallery-wrap,
	.sv-cta,
	.sv-faq{
		margin:50px 15px;
	}
	.sv-video{
		margin:50px 0;
	}
}

@media (max-width:768px){
	.site-view{
		background:rgba(var(--bg-color-rgb),0.95);
	}
	.sv-hero__titles .sv-title{
		font-size:28px;
	}
	.sv-hero__titles .sv-meta{
		font-size:14px;
		padding:6px 12px;
	}
	.summary_pd{
    	padding:20px;
		margin: 0 5px;
		letter-spacing: -1px;
		word-break: keep-all;
    }
    .sv-hero__spec table th,
    .sv-hero__spec table td{
        width:40%;
        font-weight:400;
        text-align: left;
    }
    .sv-hero__spec table td{
        width: 60%;
    }
	.sv-map{
		height:300px;
	}
	.sv-location{
    	padding:20px;
		border-radius:0;
	}
    .sector-intro{
        grid-template-columns: 1fr;
		gap:20px;
    }

    .sv-location__row{
    	display:flex;
    	gap:15px;
    	align-items:center;
    	margin-bottom:25px;
    }
    
    .sv-map{
    	height:250px;
    }
    .summary-title{
    	font-size:25px;
    }
	.sv-core-info{
		grid-template-columns:1fr;
	}
	.sv-figure{
		margin:0;
	}

	.summary_pd,
	.sv-core-info,
	.sv-grid2,
	.sv-gallery-wrap,
	.sv-cta,
	.sv-faq{
		margin:50px 5px;
	}
	.sv-video{
		margin:10px 5px;
		padding:10px 15px 24px;
	}
}

@media (max-width:420px){
	.sv-hero__slider{
		max-height:220px !important;
	}
}


/* =========================================
   MOBILE 최적화
========================================= */
@media (max-width:768px){
    .sv-gallery{
        grid-template-columns:repeat(2,1fr);
        gap:10px;
    }

    .sv-figure img{
        height:100px;
    }

    .sv-h2{
        font-size:22px;
    }
}
/* ===============================
   PREMIUM MODAL
================================ */

.sv-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.96);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:99999;
    overflow:hidden;
}

.sv-modal.active{
    display:flex;
}

/* 무대 */
.sv-modal-stage{
    position:relative;
    width:90vw;
    height:85vh;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

/* 이미지 */
.sv-modal-stage img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    transition: transform .2s ease;
    opacity:1;
}

/* 슬라이드 방향 클래스 */
.slide-left{
    transform:translateX(-60px);
    opacity:0;
}
.slide-right{
    transform:translateX(60px);
    opacity:0;
}

/* 버튼 */
.sv-modal-close,
.sv-modal-prev,
.sv-modal-next{
    position:fixed;
    background:none;
    border:none;
    color:#fff;
    font-size:42px;
    cursor:pointer;
    z-index:100000;
    transition:.3s;
}

.sv-modal-close{
    top:25px;
    right:40px;
    font-size:32px;
}

.sv-modal-prev{
    left:40px;
    top:50%;
    transform:translateY(-50%);
}

.sv-modal-next{
    right:40px;
    top:50%;
    transform:translateY(-50%);
}

.sv-modal-prev:hover,
.sv-modal-next:hover,
.sv-modal-close:hover{
    opacity:.6;
}

/* 카운터 */
.sv-modal-counter{
    position:fixed;
    bottom:30px;
    left:50%;
    transform:translateX(-50%);
    color:#fff;
    font-size:14px;
    letter-spacing:1px;
    opacity:.8;
}
/* ===============================
   ZOOM SUPPORT
================================ */

.sv-modal-stage {
    cursor: default;
}

.sv-modal-stage.zoomable {
    cursor: grab;
}

.sv-modal-stage.zoomable.dragging {
    cursor: grabbing !important;
}

.sv-modal-stage img{
    transform-origin:center center;
    will-change:transform;
    transition:transform .08s linear; /* 즉각 반응 */
	user-select: none;
    -webkit-user-drag: none;
    pointer-events: auto;
}
.sv-modal-stage.dragging img{
    transition:none !important;
}
/* 모바일 */
@media (max-width:768px){
    .sv-modal-prev{ left:15px; }
    .sv-modal-next{ right:15px; }
    .sv-modal-close{ right:20px; top:15px; }
}
/* 모달 타이틀 */
.sv-modal-stage {
    position: relative;
	touch-action: none;
}

.sv-modal-caption {
    position: absolute;
    bottom: 20px;
    left: 20px;

    background: rgba(0,0,0,0.65);
    color: #fff;

    padding: 10px 14px;
    border-radius: 8px;

    font-size: 14px;
    line-height: 1.4;

    max-width: 70%;
    backdrop-filter: blur(6px);
}

/* =====================================================
   FLOATING PC
===================================================== */
.sv-float{
  position:fixed;
  right:50%;
  margin-right:-730px;
  bottom:150px;
  transition: transform .25s ease, opacity .25s ease;
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:0px;
  border-radius:10px;
  overflow: hidden;
  opacity:0;
  transform:translateY(10px);
  pointer-events:none;
  transition:.25s ease;
}
.sv-float a:hover,
.sv-float button:hover{
	background:#36b1e0;
	color:#fff;
}
.sv-float.is-show{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.sv-float__btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0px;
  height:45px;
  padding:0 15px;
  border-radius:0px;
  background:#fff;
  border:none;
  box-shadow:0 6px 16px rgba(0,0,0,.5);
  font-weight:600;
  text-decoration:none;
  color:#111;
  cursor:pointer;
}

.sv-mobile-bar{
  display:none;
}

/* =========================================
   PREMIUM MOBILE BAR
========================================= */

@media (max-width:768px){

  body.has-main-bg{
	min-height:100dvh;
}

  body{
    padding-bottom:50px;
  }

  .sv-mobile-bar{
    position:fixed;
    left:0;
    bottom:0;
    width:100%;
    height:50px;
    display:flex;
    z-index:9999;
    background:#0f172a;
    box-shadow:0 -6px 25px rgba(0,0,0,.35);
    transform:translateY(100%);
    transition:.35s cubic-bezier(.22,.61,.36,1);
  }

  .sv-mobile-bar.is-show{
    transform:translateY(0);
  }
  
  .sv-mobile-btn{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    font-size:13px;
    font-weight:normal;
    letter-spacing:.2px;

    text-decoration:none;
    color:#fff;
    position:relative;
    transition:.25s ease;
  }

  /* TOP */
  .sv-mobile-btn[data-action="top"]{
    background:#1e293b;
	border:none;
  }

  /* 전화 */
  .sv-mobile-call{
    background:#1d4ed8;
    flex:2;
  }

  /* 온라인 문의 */
  .sv-mobile-inquiry{
    background:#047857;
    flex:1.5;
  }

  .sv-mobile-btn:active{
    filter:brightness(1.1);
  }
  .sv-float__btn i,
  .sv-mobile-btn i{
	font-size:16px;
  }
  .sv-float__btn{
	gap:8px;
  }
  .sv-mobile-btn{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:6px;
  }

  .sv-mobile-btn span{
	font-size:14px;
  }

}

@keyframes pulseGlow{
  0%{ box-shadow:0 0 0 0 rgba(37,99,235,.6); }
  70%{ box-shadow:0 0 0 12px rgba(37,99,235,0); }
  100%{ box-shadow:0 0 0 0 rgba(37,99,235,0); }
}

.sv-mobile-call{
  animation:pulseGlow 2.5s infinite;
}
menu{
    width:100%;
    height:80px;
    position:relative;
	bottom:80px;
	margin:0;
    left:0;
    background:rgba(30,30,30,1);
    opacity:0;
}

menu.is-show{
    animation: menuSlideUp .7s ease forwards;
}
@keyframes menuSlideUp{
    from{
        transform:translateY(80px);
        opacity:0;
    }
    to{
        transform:translateY(0);
        opacity:1;
    }
}
menu.is-fixed{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:9999;
}
menu ul{
	display:flex;
	justify-content:right;   /* 가운데 정렬 */
	gap:20px;
	margin-right:50px;
	padding:0;
	align-items:center;
}
menu ul li{
	list-style:none;
}
menu ul li a{
	position:relative;
	display:block;
	color:#fff;
	text-decoration:none;
	line-height:80px;
	text-align:center;
	font-size:15px;
	font-weight:400;
}

menu .menu-title{
	position:absolute;
	left:50px;
	top:50px;
	line-height:60px;
	font-size:24px;
	font-weight:bold;
	color:#fff;
	margin-top:-40px;
}
/* active + hover 동일 스타일 */
menu ul li a.active,
menu ul li a:not(.active):hover{
    color:#ffd54f;
    font-weight:700;
}

/* underline */
menu ul li a.active::after,
menu ul li a:not(.active):hover::after{
    content:"";
    position:absolute;
    left:0px;
    right:0px;
    bottom:20px;
    height:2px;
    background:#ffd54f;
}
/*  헤드 사라지고 상세페이지 메뉴가 헤드역할  */
.jp-header{
    position:sticky;
    top:0;
    transition:transform .35s ease;
}

.jp-header.is-hide{
    transform:translateY(-100%);
}
.menu-title a{
	color:#fff;
}

/***************************************************************
FAB FLOAT MENU
***************************************************************/

.sv-fab{

    position:fixed;
	
    right:50%;
	margin-right:-720px;
    bottom:150px;
    z-index:9999;

    opacity:0;
    pointer-events:none;
    transform:translateY(20px);
    transition:.35s ease;
}

.sv-fab.is-show{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
}
/* 메인 버튼 */

.sv-fab-main{

    width:60px;
    height:60px;

    border-radius:50%;
    border:none;

    background:#ffd54f;
    color:#111;

    font-size:34px;
    font-weight:700;

    cursor:pointer;

    box-shadow:0 15px 35px rgba(0,0,0,.35);

    display:flex;
    align-items:center;
    justify-content:center;

    transition:.35s ease;
}

/* + 아이콘 */

.sv-fab-plus{
    transition:.35s ease;
}

/* 열림 */

.sv-fab.open .sv-fab-plus{
    transform:rotate(45deg);
    opacity:1;
	
}

/***************************************************************
SUB MENU
***************************************************************/

.sv-fab-item{

    position:absolute;

    width:60px;
    height:60px;

    border-radius:50%;

    background:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    text-decoration:none;
    color:#111;

    box-shadow:0 10px 25px rgba(0,0,0,.3);

    opacity:0;
    transform:translateY(0) scale(.5);

    transition:.35s cubic-bezier(.25,.8,.3,1);
}

/* 위치 */

.sv-fab-top{
    bottom:60px;
    right:0px;
	font-size:x-large;
}

.sv-fab-contact{
    bottom:130px;
    right:0px;
	font-size:x-large;
}

/* 열림 */

.sv-fab.open .sv-fab-item{
    opacity:1;
    transform:translateY(-10px) scale(1);
}

/* 통통 튀기 */

.sv-fab.open .sv-fab-top{
    animation:fabBounce .45s ease;
	cursor:pointer;
	border:none;
}

.sv-fab.open .sv-fab-contact{
    animation:fabBounce .55s ease;
}

@keyframes fabBounce{

    0%{
        transform:translateY(40px) scale(.5);
        opacity:0;
    }

    60%{
        transform:translateY(-12px) scale(1.1);
    }

    100%{
        transform:translateY(-10px) scale(1);
        opacity:1;
    }

}