/* header start */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


body {
	visibility: hidden;
}

.header-content {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top: -1px;
    background-color: rgba(0, 0, 0, 0.5);
	min-width: 1021px;
}

.header_logo img {
    height: 45px;
}

.header-content nav {
	font-size: 11pt;
	font-weight: 300;
}

nav .nav-menu {
    list-style: none;
    display: flex;
	padding: 0;
	margin: 0;
}

nav .nav-item {
    position: relative;
	width: 120px;
}

nav .nav-item a {
    text-decoration: none;
    color: white;
    padding: 11px 15px;
    display: block;
	background-color: rgba(0, 0, 0, 0);
	border: none;
	text-align: center;
	font-weight: 400;
}

nav .nav-item:hover > a {
    background-color: #FFFFFF;
    color: #215F9A;
    font-weight: 500;
	transition: background 0.3s;
}



nav .nav-item .dropdown {
	text-align: center;
	padding: 0;
    position: absolute;
    top: 44px;
    background-color: rgba(0, 0, 0, 0.3);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

nav .nav-item .dropdown li {
    list-style: none;
	padding-bottom: 6px;
	width: 120px;
	display: flex;
	justify-content: center;
}

nav .nav-item .dropdown a {
	padding: 9px 2px 3px 2px;
    color: white;
    display: block;
	position: relative;
}

nav .nav-item .dropdown a::after {
	content: "";
	  position: absolute;
	  left: 0;
	  bottom: 0;
	  width: 100%;
	  height: 2px;
	  background-color: #FFFF00; /* 밑줄 색상 */
	  transform: scaleX(0); /* 초기 상태: 밑줄 숨김 */
	  transition: transform 0.3s ease; /* transition 효과 */
}

nav .nav-item .dropdown a:hover::after {
	transform: scaleX(1); /* hover 시: 밑줄 나타남 */
}

nav .nav-item:hover .dropdown {
    display: block;
    opacity: 1;
    transform: translateY(0);
	pointer-events: auto
}

.site-map-btn {
	margin: 8px 10px;
	font-size: 11pt;
    background-color: #000000;
    border-radius: 5px;
	border: none;
}

.site-map-btn a {
	color: #FFFFFF;
	padding: 0px 10px;
}

/* header end */ 

.bg {
	width: 100%;
	overflow: hidden;
	margin: 0px auto;
	position: relative;
}

video {
	height: 100vh;
	width: 100vw;
	object-fit: cover;
	pointer-events: none;
}

/* first section start */
.first-inner {
	height: 100vh;
}

.first-inner .text {
	position: absolute;
	top: 35px;
	padding: 30px;
	font-size: 17pt;
	
}

.first-inner .text p {
	font-weight: bold;
	padding-bottom: 10px;
}
	

/* first section end */

/* second section start */
.second-inner {
	height: 100vh;
	background-image: url('../assets/img/main/main_02.webp');
	background-size: cover;
	background-position: center center;
}

.second-inner .text {
	position: absolute;
	top: 70px;
	left: 30px;
	background-color: rgba(0, 0, 0, 0.7);
	color: #FFFFFF;
	font-size: 10.5pt;
	font-weight: 300;
	padding: 10px 23px;
	border-radius: 10px;
}

.second-inner .text h3 {
	color: #00B0F0;
	font-weight: bold;
	font-size: 23pt;
}

.second-inner .text p {
	padding-bottom: 3px;
}

.second-inner .text p span {
	font-weight: 500;
}

.second-inner .text div {
	display: flex;
	justify-content: space-between;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 5px 15px;
	border-radius: 10px;
}

/* second section end */


/* third section start */
.third-inner {
	height: 100vh;
}

.third-inner .text {
	position: absolute;
	bottom: 80px;
	left: 70px;
	color: #FFFFFF;
	font-size: 11.5pt;
	font-weight: 300;
}

.third-inner .text p {
	padding-bottom: 5px;
}

/* third section end */

/* forth section start */ 
.forth-inner {
	height: 100vh;
	background-image: url('../assets/img/main/main_04.webp');
	background-size: cover;
	background-position: center center;
}

.forth-inner > div {
	display: flex;
	justify-content: center;
}

.forth-inner .text {
	margin-top: 120px;
}

.forth-inner .text h3 {
	color: #00B0F0;
	font-weight: bold;
	font-size: 23pt
}

.forth-inner .text h3 span {
	color: #FFFF00;
	font-size: 30pt;
	padding: 0px 5px;
}

.forth-inner .text p {
	color: #FFFFFF;
	padding-bottom: 5px;
}

/* forth section end */

/* fifth section start */
.fifth-inner {
	display: flex;
	justify-content: center;
	height: 100vh;
	background-image: url('../assets/img/main/main_05.webp');
	background-size: cover;
	background-position: center center;
}

.fifth-inner .fifth-box {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.fifth-inner .text {
	color: #FFFFFF;
	padding-bottom: 70px;
}

.fifth-inner p {
	color: #FFFFFF;
}

.fifth-inner .text p:last-child {
	font-size: 10pt;
	text-align: right;
}

.fifth-inner .text h2 {
	letter-spacing: 3px;
	font-weight: bold;
	font-size: 27pt;
}

.fifth-inner .env-text {
	position: absolute;
	font-size: 10pt;
	font-weight: 500;
	text-align: center;
	line-height: 16px;
}

.fifth-inner .pos-01 {
	transform: translate(7%, -310%);
}

.fifth-inner .pos-02 {
	transform: translate(-184%, -250%);
}

.fifth-inner .pos-03 {
	transform: translate(225%, -250%);
}

.fifth-inner .pos-04 {
	transform: translate(-315%, 50%);
}

.fifth-inner .pos-05 {
	transform: translate(280%, 75%);
}

.fifth-inner .pos-06 {
	transform: translate(-315%, 428%);
}

.fifth-inner .pos-07 {
	transform: translate(317%, 925%);
}

.fifth-inner .pos-08 {
	transform: translate(-227%, 1480%);
}

.fifth-inner .pos-09 {
	transform: translate(235%, 770%);
}

.fifth-inner .pos-10 {
	transform: translate(-7%, 655%);
}

.fifth-inner .pos-11 {
	transform: translate(0%, 500%);
	font-size: 18pt;
	font-weight: bold;
	letter-spacing: -3px;
}

.fifth-inner .pos-11 span:last-child {
	letter-spacing: 1px;
}


/* fifth section end */

/* sixth section start */
.sixth-inner {
	display: flex;
	height: 100vh;
	background-image: url('../assets/img/main/main_06.webp');
	background-size: cover;
	background-position: center center;
}

.sixth-inner > div {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	flex-direction: column;
	padding-left: 50px;
}

.sixth-inner .text h2 {
	color: #00B0F0;
	padding: 5px;
	font-weight: bold;
	font-size: 23pt;
}

.sixth-inner .text p {
	font-size: 10.5pt;
	padding-bottom: 5px;
	font-weight: 400;
	color: #A6A6A6;
}

.sixth-inner .text p span {
	font-weight: 500;
}

.sixth-inner .color-text {
	text-align: center;
	color: #A6A6A6;
	font-size: 17pt;
	font-weight: bold;
	letter-spacing: 1px;
}

.sixth-inner .color-text p:first-child {
	padding-bottom: 25px;
	font-size: 17pt;
	font-weight: 500;
}

.sixth-inner .color-text p:first-child span {
	font-size: 18pt;
	font-weight: bold;
}

.sixth-inner .color-text p:last-child span {
	font-size: 23pt;
	color: #FFFFFF;
	padding: 0px 3px;
}


/* sixth section end */


/* seventh section start */
.seventh-inner {
	height: 100vh;
	background-color: #000000;
}

.seventh-inner .text {
	position: absolute;
	bottom: 70px;
	left: 50px;
	font-size: 10.5pt;
	color: #A6A6A6;
}

.seventh-inner .text h2 {
	font-size: 23pt;
	font-weight: bold;
	padding: 0px;
	margin: 0px;
	letter-spacing: 1px;
}

.seventh-inner .text h2:first-child {
	color: #FFFFFF;
}

.seventh-inner .text h2:nth-child(2) {
	padding-bottom:20px;
	color: #00B0F0;
}

.seventh-inner .text p {
	padding-bottom: 5px;	
}

/* seventh section end */

/* eighth section start */
.eighth-inner {
	height: 100vh;
	background-color: #000000;
}

.eighth-inner .text {
	position: absolute;
	bottom: 260px;
	left: 50px;
	font-size: 10.5pt;
	color: #A6A6A6;
}

.eighth-inner .text h2 {
	color: #FFFFFF;
	font-size: 23pt;
	font-weight: bold;
}

.eighth-inner .text h2 > span {
	color: #00B0F0;
}

.eighth-inner .text p {
	padding-bottom: 5px;
}


/* eighth section end */


/* float start */
.main-float {
	position: fixed;
	top: 80px;
	right: 20px;
	display: grid;
	row-gap: 10px;
	font-weight: 300;
}

.main-float .video {
	cursor: pointer;
	padding: 5px;
	background-color: rgba(0, 0, 0, 0.7);
}

.main-float .text {
	font-size: 9pt;
	display: flex;
	align-items: center;
	line-height: 13px;
	color: #FFFFFF;
}

.main-float .text i {
	font-size: 17px;
	padding-left: 6px;
}


.main-float .video .text p {
	padding: 6px 0 6px 50px;
}

.main-float .profile {
	cursor: pointer;
	padding: 6px;
	background-color: rgba(0, 0, 0, 0.7);
}

.main-float .profile .text div {
	padding-left: 17px;
	text-align: center;
}

/* float end */

/* popup start*/
.popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out;
}

/* 팝업 창 */
.popup {
	background: white;
	padding: 10px;
	border-radius: 10px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
	text-align: center;
	position: relative;
	transform: translateY(-20px);
	transition: transform 0.3s ease-in-out;
}

/* 팝업 제목 */
.popup h2 {
	margin: 0 0 10px;
	font-size: 20px;
}

/* 닫기 버튼 */
.popup-close {
	position: absolute;
	top: 10px;
	right: 15px;
	background: none;
	border: none;
	font-size: 30px;
	cursor: pointer;
}

/* 활성화된 팝업 */
.popup-overlay.show {
	opacity: 1;
	visibility: visible;
}

.popup-overlay.show .popup {
	transform: translateY(0);
}

.popup img {
	border-radius: 5px;
}

/* popup end */