.intro-header {
  max-width: 1920px;
  width: 100%;
  margin: 0 auto;
  height: 250px;
  
  overflow: hidden;
  position: relative;
  text-align: center;
  color: white;
}
.site_intro_bg{
	background: url(/images/sub_visual_img_01.jpg) center center / cover no-repeat;
}
.premium_bg{
	background: url(/images/sub_visual_img_02.jpg) center center / cover no-repeat;
}
.position_bg{
	background: url(/images/sub_visual_img_05.jpg) center center / cover no-repeat;
}
.floor_bg{
	background: url(/images/sub_visual_img_03.jpg) center center / cover no-repeat;
}
.customer_bg{
	background: url(/images/sub_visual_img_04.jpg) center center / cover no-repeat;
}
/* ✅ 배경이미지 확대용 */
.intro-header::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: inherit;
  background-size: cover;
  transform: scale(1.2); /* 처음엔 1.2배 확대 */
  transition: transform 2s ease; /* 부드럽게 줄어듦 */
  z-index: 1;
}

/* ✅ 텍스트 기본 스타일 */
.intro-header h1,
.intro-header p {
  position: relative;
  z-index: 2; /* 배경 위로 올라오게 */
  opacity: 0; /* 처음엔 투명 */
  transform: translateY(30px); /* 아래쪽에 있음 */
  transition: all 1.5s ease;
}

/* ✅ 페이지 로드 후 활성화 */
.intro-header.loaded::before {
  transform: scale(1); /* 원래 크기로 복원 */
}

.intro-header.loaded h1,
.intro-header.loaded p {
  opacity: 1;
  transform: translateY(0); /* 위로 올라오면서 나타남 */
}

.intro-header h1,
.intro-header p {
  margin: 0; /* ✅ auto 제거하고 0 */
  text-align: center;
  width: 100%;
  color: #fff;
  text-shadow: 2px 2px 3px #000;
}

.intro-header h1 {
  padding: 60px 0 10px 0;
  font-size: 2.5em; /* 추천: 폰트 조금 키우면 더 멋져 보여 */
}
.site-intro-container {
  width: 1080px;
  margin: 0 auto;
}
.intro-content img{
	width:100%;
}
.site-intro-container h2{
	font-size:2.4em;
	margin-left: 0px;
	border-bottom:4px solid #43a7b7;
	display:inline-block;
}
.intro-btns{
	width:100%;
	text-align:center;
}
.intro-btns a{
	display:inline-block;
	padding:10px 50px;
	text-decoration:none;
	background:#43a7b7;
	color:#fff;
}

.floor-tabs {
  display: flex;
  justify-content:flex-start ;
  margin: 50px 0;
  gap: 10px;
}

.tab-button {
  padding: 10px 0;
  text-align:center;
  width:8.33%;
  background-color: #f2f2f2;
  border: 1px solid #ccc;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.3s;
  border-radius:5px;
}

.tab-button.active {
  background-color: #038bd0;
  color: #fff;
  border-color: #038bd0;
}

.floor-tab-contents {
  position: relative;
  width: 100%;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}
.pc-version{
    display:block;
}
.mobile-version{
    display: none;
}
.site-footer{
	margin-top:50px;
}
.location_img{
	text-align:center;
	margin-bottom:50px
}
.location_img img.pc-version{
	width:70%;
}
@media (max-width: 768px) {
	/* ✅ intro-header (타이틀 영역) */
	.intro-header {
		padding: 60px 20px 40px;
		text-align: center;
		box-sizing: border-box;
		max-width: 100%;
	}
	.intro-header h1 {
		font-size: 2rem;
		margin-bottom: 10px;
	}
	.intro-header p {
		font-size: 1rem;

	}
	/* ✅ site-intro-container (본문) */
	.site-intro-container {
		width: 100%;
		padding: 20px 0px;
	}
	.site-intro-container h2 {
		font-size: 1.5rem;
		margin-bottom: 20px;
		text-align: center;
	}
	.intro-content img {
		width: 100%;
		height: auto;
		margin-bottom: 30px;
	}

	/* ✅ 오시는 길 버튼들 */
	.intro-btns {
		display: flex;
		flex-direction: column; /* 세로 정렬 */
		gap: 15px; /* 버튼 간 간격 */
		margin-top: 30px;
		align-items: center;
	}
	.intro-btns .btn {
		width: 100%;
		max-width: 300px;
		padding: 12px;
		font-size: 1rem;
		border-radius: 8px;
		background-color: #de74aa;
		color: #fff;
		text-align: center;
		text-decoration: none;
	}
	.intro-btns .btn:hover {
		background-color: #038bd0;
	}


	.floor-tabs {
		width: 100%;
		display: flex;
		flex-wrap: nowrap;
		justify-content:flex-start ;
		margin: 20px 0;
		gap: 10px;
		overflow-x: scroll;
	}
	.tab-button {
		padding: 10px 20px;
		width:100%;
		background-color: #f2f2f2;
		border: 1px solid #ccc;
		cursor: pointer;
		font-weight: bold;
		transition: background-color 0.3s;
		border-radius:0px;
		white-space: nowrap;

	}
	.pc-version{
		display:none;
	}
	.mobile-version{
		display: block;
	}
	.m-map{
		padding:0 20px;
		box-sizing:border-box;
	}
	.site-footer{
		margin-top:0;
	}
	.site_intro_bg{
	background: url(/images/m_sub_visual_img_01.jpg) center center / cover no-repeat;
	}
	.premium_bg{
		background: url(/images/m_sub_visual_img_02.jpg) center center / cover no-repeat;
	}
	.position_bg{
		background: url(/images/m_sub_visual_img_05.jpg) center center / cover no-repeat;
	}
	.floor_bg{
		background: url(/images/m_sub_visual_img_03.jpg) center center / cover no-repeat;
	}
	.customer_bg{
		background: url(/images/m_sub_visual_img_04.jpg) center center / cover no-repeat;
	}
}