/* 전체 래퍼 */

/* 왼쪽 자연스러운 검은색 그라데이션 오버레이 */
.left-black-gradient {
  position: absolute;
  top: 0;
  left: 0;
  width: 10vw;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.80) 0%,
    rgba(0,0,0,0.55) 30%,
    rgba(0,0,0,0.27) 60%,
    rgba(0,0,0,0.0) 100%
  );
}

.main01 {
    position: relative;
    overflow: hidden;
}

.main-black-blur {
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        to right,
        rgba(0,0,0,0.95) 0%,
        rgba(0,0,0,0.95) 30%,
        rgba(0,0,0,0.0) 80%
    );
}

@media (max-width: 768px) {
    .main-black-blur {
        background: linear-gradient(
            to right,
            rgba(0,0,0,0.85) 0%,
            rgba(0,0,0,0.25) 40%,
            rgba(0,0,0,0.0) 90%
        );
    }
}

.bg1, .bg2, .bg3, .bg4 {
    position: relative;
}


.swiper-container.main_slide {
    position: relative;
    z-index: 2;
}


#wrap {
	overflow: hidden;
	background: #fdfaf6;
  }
  
  /* 기본 헤더 설정 (옅은 네이비 반투명 배경) */
  #header {
	position: fixed;
	width: 100%;
	z-index: 100;
	background: rgba(10, 28, 58, 0.85); /* 더 더 어두운 네이비 */
	border-bottom: 1px solid rgba(255, 255, 255, 0);
	transition: 0.3s;
  }
  
  /* 헤더 내부 구조 */
  #header .header_inner {
	padding: 0 3%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: 0.3s;
  }
  
  /* GNB 메뉴 리스트 */
  #header .gnb ul {
	display: flex;
	margin-top: 4px;
	justify-content: center;
	align-items: center;
	column-gap: 64px;
  }
  
  /* 메뉴 항목 기본 스타일 */
  #header .gnb ul li {
	text-align: center;
	transition: 0.2s;
	border-bottom: 3px solid transparent;
  }
  
  /* 메뉴 링크 공통 - 초기 색상: 흰색 */
  #header .gnb ul li a {
	display: block;
	padding: 28px 0;
	font-size: 1.1em;
	font-weight: 500;
	color: #ffffff;
	transition: 0.3s;
  }
  
  /* hover 시 메뉴 색상 변화 */
  #header .gnb ul li:hover a {
	color: #FFD700;
	border-bottom: 3px solid #FFD700;
  }
  
  /* 로고 이미지 */
  #header .logo img {
	width: 237px;
  }
  
  /* 우측 링크 리스트 */
  #header .link_list {
	display: flex;
	column-gap: 16px;
  }
  
  #header .link_list a img {
	width: 40px;
  }
  
  
  
  /* 스크롤 시 헤더 스타일 변경 */
  #header.scroll_on {
	background: linear-gradient(90deg, rgba(10, 28, 58, 0.7) 0%, rgba(10, 28, 58, 0.7) 0%);
	backdrop-filter: blur(10px);
  }
  
  /* 스크롤 시 메뉴 텍스트 기본 색상 */
  #header.scroll_on .gnb ul li a {
	color: #ffffff;
	transition: color 0.3s ease, border-bottom 0.3s ease;
  }
  
  /* 스크롤 + hover 시 강조 */
  #header.scroll_on .gnb ul li a:hover {
	color: #FFD700;
	border-bottom: 2px solid #FFD700;
  }
  
  /* 현재 페이지 활성 상태 스타일 */
  #header.scroll_on .gnb ul li a.active {
	color: #00C2FF;
	border-bottom: 2px solid #00C2FF;
  }
  


  .philosophy_section {
	background: #fdfaf6;
	padding: 80px 20px;
	margin-top: 30px; /* ✅ 섹션 위쪽과의 간격을 벌림 */
  }
  
  .philosophy_content {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	max-width: 1200px;
	margin: 0 auto;
	gap: 40px;
}
  
  .philosophy_text {
	flex: 1 1 500px;
	color: #333;
}
.philosophy_text_center {
	text-align: center;
	margin: 0 auto;
}
.philosophy_text_center h2,
.philosophy_text_center p {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
  
  .philosophy_text h2 {
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 20px;
	line-height: 1.5;
  }
  
  .philosophy_text p {
	font-size: 1.1rem;
	line-height: 1.8;
  }
  
  .philosophy_image {
	flex: 1 1 400px;
	max-width: 260px;
	margin: 0 auto;               
	display: flex;
	justify-content: center;
  }
  
  .philosophy_image img {
	width: 100%;
	border-radius: 16px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  }
  

.text.ani_list {
    display: flex;
    flex-direction: column;
    gap: 30px;
    max-width: 1200px !important;  
    margin: 0 auto;
}

/* 또는 방법 2: 더 구체적인 선택자 사용 */
#sub_content .page_company .text_ctn .text.ani_list {
    display:
}

  
#container{ margin:0 auto;width: 100%; overflow: hidden;}
#container .content_inner{width:1280px; margin:0 auto;}
#footer{position: relative;padding:5em 0 5em; background:#171717; text-align:center; color: #fff; z-index: 1;}
#footer .footer_inner{display:flex;position: relative; z-index: 5; justify-content:center; align-content:center; align-items:center;  }
#footer .footer_inner .footer_logo img{width:350px;}
#footer .footer_inner .info{margin-left:3em;text-align:left;}
#footer .footer_inner .info .foot_tel{color: #fff; margin-bottom:6px;font-size:40px; font-weight:800;}
#footer .footer_inner .info .foot_tel img{width:32px; margin-right:6px;vertical-align:baseline;}
#footer .footer_inner .info ul{font-size: 0;}
#footer .footer_inner .info ul li{display:inline-block; font-size:16px; margin-right:16px;font-weight: 400; color: #aaa;}
#footer .footer_inner .info ul li strong{color: #fff; font-weight: 600;}
#footer .footer_inner .info ul li strong:after{display: inline-block;	content:':'; margin:0 2px; font-weight: 500;}
#footer .footer_inner .info cite{display: block; margin-top:16px;font-size:12px; opacity: 0.5;}
.mo_br{display: none;}
.mo_view{display: none;}
.layer{position:fixed; display:none; left:0;top:180px; z-index:3000000; width:100%;}
.layer .close_btn{position:absolute; overflow: hidden; right:0; top:0;background:#0A1C3A; border-radius:0 10px 0 10px; color: #fff;}
.layer .close_btn a{display: block;color: #fff;padding:14px 18px; font-size:20px; font-weight:bold;}
.layer .layer_wrap{position:relative;width:100%; max-width:700px; top:0px; margin:0 auto; border-radius:10px; background:rgba(0,0,0,0.95); text-align:left; letter-spacing:-0.5px; box-shadow:0 0 50px rgba(0,0,0,0.6);}
.layer .layer_wrap .DB_info_detail{width:100%;  margin:18px auto; padding-bottom:16px; line-height:1.6; color: #fff;font-size:12px;}
.layer .layer_wrap .DB_info_detail h2{padding:22px;border-bottom:1px solid #222; font-size:24px; font-weight:bold;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap p{padding:8px;margin-bottom:12px; font-size:13px; }
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap{width:98%; height:360px; padding:8px 16px; overflow:auto; box-sizing:border-box;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dt{display:block; background: #fff;border-radius:3px; padding:7px 10px; font-weight: bold; color: #333;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dd{margin-bottom:16px; padding:4px 12px; box-sizing:border-box;}
#quick{position: fixed;right:20px;bottom:30px; z-index:10; background: #fff;padding:24px 20px 16px 20px;border:1px solid #ccc; border-radius:30px; box-shadow:5px 5px 10px rgba(0,0,0,0.1)}
#quick .quick_inner{display:flex;flex-direction: column; text-align: center; }
#quick .quick_inner h3{margin-bottom:8px; line-height:1.4;}
#quick .quick_inner a{display:flex; padding:6px; margin-bottom:6px; border-radius:100px; font-size:0.95em;font-weight:600; justify-content:center; align-content:center; align-items:center;  }
#quick .quick_inner a img{width:20px; margin-right: 4px;}
#quick .quick_inner .quick_kakao{background:#f9e000; color: #371c1d;}
#quick .quick_inner .quick_tel{background:#0A1C3A; color: #fff;}


.menu-layer {position: fixed; top: 0; left: 0; width: 100%; height: 0; overflow: hidden; backdrop-filter: blur(10px); background-color: rgba(0, 0, 0, 0.7); color: #fff; z-index: 1000; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: height 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;overflow: hidden;}
.menu-layer.active {height: 100%; opacity: 1; visibility: visible;}
.menu-layer ul {width: 90%; margin: 0 auto; text-align: center;}
.menu-layer ul li {font-size: 1.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.menu-layer ul li:hover a {color: #0A1C3A;}
.menu-layer ul li a {display: block; padding: 16px 0; color: #fff; text-decoration: none;}
.menu-layer .close-btn {position: absolute; top: 30px; right: 30px; background: none; border: none; color: #fff; font-size: 1.2rem; cursor: pointer;}
.menu-layer .close-btn img {width: 42px;}

@media all and (max-width:1200px) {
	#header .header_inner .gnb ul{column-gap:32px;}
	#header .header_inner .link_list a img{max-width:30px;}
	#header .header_inner .logo img{width:200px;}
}

@media all and (max-width:1000px) {
	#header .header_inner .gnb ul{column-gap:24px;}
	#footer .footer_inner{flex-direction: column; text-align: center;}
	#footer .footer_inner .info ul{text-align: center;}
	#footer .footer_inner .info ul li{font-size: 14px;}
	#footer .footer_inner .footer_logo img{width:250px;}
	#footer .footer_inner .info .foot_tel{font-size:30px; text-align: center;}
	#footer .footer_inner .footer_logo{margin-bottom: 1em;}
	#footer .footer_inner .info cite{text-align:center;}
}

@media all and (max-width:860px) {
	#header .header_inner .logo img{width: 150px;}
	.mo_view{display: block;}
	#header{padding:16px 0;}
	#header .header_inner .gnb ul{display: none;}
	#header .header_inner .link_list{column-gap: 12px;}
	#header .header_inner .link_list a img{min-width:30px;}
	#header .header_inner .link_list a img{min-width:30px;}


	#quick{position: fixed;width:95%;right:auto;left:50%;transform:translate(-50%,0);bottom:16px; padding:8px 0;  border-radius:100px;}
	#quick .quick_inner{display:flex;flex-direction: row; justify-content:center; align-content:center; align-items:center;  }
	#quick .quick_inner h3{margin-bottom:0; margin-right:8px; line-height: 1.2;font-size: 15px;}
	#quick .quick_inner a{width:23%;margin-bottom: 0; padding:6px 16px; margin-right:2px;}

}

@media all and (max-width:600px) {
	#header .header_inner .link_list a img{min-width:24px;}
}

/* 而⑦뀗痢� */
section{position: relative;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; text-align:center;; }
.bg_ctn{width:1920px; left:50%; margin-left:-960px;}
.main01{height:90vh; overflow: hidden; border-radius:0 0 480px 0; animation:main_slide_ani 2s 0s backwards}
@keyframes main_slide_ani{
	0%{ border-radius:0 0 0 0;}
	100%{ border-radius:0 0 480px 0;}
}
.main01 .title{position: absolute;z-index: 10; width:580px;height:400px;padding:100px 36px 100px 50px;left:110px; top: 50%; transform:translate(0,-50%);  z-index: 1; background:url(http://127.0.0.1:8080/img/main01_titlebg.png) no-repeat 100px 0 #0A1C3A; border-radius:0 500px 500px 0; text-align: left; color: #fff; box-sizing:border-box;}
.main01 .title h3{font-size:1.8em; font-weight:600; }
.main01 .title h2{margin:0.2em 0 0.3em;font-size:3.5em;  font-weight:700; letter-spacing:-2px;}
.main01 .title .text_line{display: block; width:60px; height:5px; background:#fff;}
.main01 .title p{margin-top:1.5em;font-size:1.2em; font-weight:300;}
.main01 .bg1{position: absolute; top:0; left:0;height:100%;width:100%;background:url(../img/bg_main01.png) no-repeat 50% / cover;animation:bg_ani 10s 0s infinite linear alternate,blur_ani 2.5s 0s forwards;}
.main01 .bg2{position: absolute; top:0; left:0;height:100%;width:100%;background:url(../img/bg_main02.png) no-repeat 50% / cover;animation:bg_ani 10s 0s infinite linear alternate,blur_ani 2.5s 0s forwards;}
.main01 .bg3{position: absolute; top:0; left:0;height:100%;width:100%;background:url(../img/bg_main03.png) no-repeat 50% / cover;animation:bg_ani 10s 0s infinite linear alternate,blur_ani 2.5s 0s forwards;}
.main01 .bg4{position: absolute; top:0; left:0;height:100%;width:100%;background:url(../img/bg_main04.png) no-repeat 50% / cover;animation:bg_ani 10s 0s infinite linear alternate,blur_ani 2.5s 0s forwards;}

.main01 .main_slide{position: relative;height:90vh;width: 100%; z-index: 0;}
.main01 .main_slide .swiper-pagination{bottom:60px;}
.main01 .main_slide .swiper-pagination .swiper-pagination-bullet{background:#fff !important; opacity:1; width:12px;height:12px;}
.main01 .main_slide .swiper-pagination .swiper-pagination-bullet{background:#fff !important; opacity:1; width:12px;height:12px;}
.main01 .main_slide .swiper-pagination .swiper-pagination-bullet-active{background:#0A1C3A !important;}

@keyframes bg_ani{
	0%{transform:scale(1);}
	100%{transform:scale(1.2);}
}
@keyframes blur_ani{
	0%{opacity:0;filter: blur(30px);}
	100%{ opacity:1;filter: blur(0px);}
}

.main02{padding:10vh 0;}
.main02 .cate_wrap {position: relative;padding:0 8%;display:flex; justify-content:center;  gap:36px;z-index: 1;}
.main02 .cate_wrap .list{border:1px solid #dddddd; border-radius:0 0 40px 0; box-shadow:5px 5px 3px rgba(0,0,0,0.08); transition:0.3s; background:#fff;}
.main02 .cate_wrap .list:hover{background: #0A1C3A;}
.main02 .cate_wrap .list:hover h3{color: #fff;}
.main02 .cate_wrap .list:hover h3 strong{color: #fff;}
.main02 .cate_wrap .list a{display: block; padding:3em 3em 2.5em 3em;}
.main02 .cate_wrap .list a img{width: 150px;}
.main02 .cate_wrap .list a .icon_img{margin-bottom:2em;}
.main02 .cate_wrap .list a h3{font-weight:600;font-size:1.2em;color: #111;  transition:0.3s}
.main02 .cate_wrap .list a h3 strong{font-weight:600; color: #0A1C3A;}
.main02 .bg_icon{position: absolute; z-index:0; right:0 ;bottom:-400px;}
.main_portfolio{padding:10vh 0 10vh;}
.main_portfolio .title{max-width:1400px; margin:0 auto 2.5em; text-align: left;}
.main_portfolio .title h2{font-size:3.625em; margin-bottom:0.2em;color: #111; font-weight: 800; letter-spacing:-1px;}
.main_portfolio .title p{font-size:1.5em; color: #aaa; font-weight: 600; letter-spacing:-0.5px;transition:0.5s}
.main_portfolio .title p:hover{color: #42d31a;}
.main_portfolio .swiper-container .swiper-button-next:after,.swiper-container .swiper-button-prev:after{display: none;}
.main_portfolio .portfolio_list_top{margin-bottom:2.5em;}
.main_portfolio .swiper-wrapper{transition-timing-function: linear;	}
.main_portfolio .swiper-container {
  max-width: 1700px;
  margin: 0 auto;
}
.main_portfolio .swiper-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.main_portfolio .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.main_portfolio .swiper-wrapper img,
.portfolio-img-small {
    width: 100%;
    aspect-ratio: 1 / 1;        /* CSS 최신 문법: 정사각형 비율 유지 */
    object-fit: cover;          /* 이미지가 정사각형 영역을 꽉 채우도록 */
    display: block;
    border-radius: 0 !important;
}


@media (max-width: 1280px) {
  .main_portfolio .swiper-container { max-width: 98vw; }
}
@media (max-width: 860px) {
  .main_portfolio .swiper-container { max-width: 100vw; }
}
@media (max-width: 600px) {
  .main_portfolio .swiper-container { max-width: 100vw; }
}

@media (max-width: 860px) {
  .main_portfolio .swiper-container { max-width: 100vw; }
}
@media (max-width: 600px) {
  .main_portfolio .swiper-container { max-width: 100vw; }
}


.main05{display:flex; margin:5vh 0 0;  justify-content:center;flex-wrap:wrap;}
.main05>article{width:50%; padding:6%;box-sizing:border-box;	}
.main05>article h2{margin:0.2em 0 0.5em;font-size:clamp(32px, 10vw, 64px);font-weight:800;}
.main05 .location{background:#0A1C3A ;}
.main05 .location h2{color: #fff;}
.main05 .location  .map{border-radius:32px;height:400px; overflow: hidden; font-size: 0; line-height:0;}
.main05 .location  .location_info{display:flex;margin-top: 1em; text-align: left; color: #fff; align-content:center; align-items:center; font-size:1.35em; }
.main05 .location  .location_info img{width:40px; margin-right:12px;}
.main05 .location  .location_info  strong{display: block;}
.main05 .db_wrap{border-top:1px solid #eee;border-bottom:1px solid #eee;}

#db ul{display:flex; flex-wrap:wrap; gap:8px;justify-content: space-between}
#db ul li{width: calc(100% / 2 - 8px); margin-bottom:24px;}
#db ul li.wide{width:100%}
#db ul li label{display: block;  text-align:left; font-size:1.4em; font-weight:600; margin-bottom:0.18em; letter-spacing:-1px;}
#db ul li label b{display: inline-block; color: #0A1C3A; transform:translate(2px,-4px);}
#db ul li input[type="text"],
#db ul li textarea{padding:0 12px;width:100%;height: 50px; background: #fff;border:1px solid #ddd; box-sizing:border-box;font-family:'MalgunGothic',sans-serif ; transition:0.3s;font-size:16px;}
#db ul li input[type="text"]:focus,
#db ul li textarea:focus{background: #fff; border:1px solid #333; box-shadow:5px 5px 15px rgba(0,0,0,0.1)}
#db ul li input[type="text"]::placeholder,#db ul li textarea::placeholder{color:#999 !important;}
#db ul li textarea{height:100px;padding:12px;resize:none;}
#db ul li.agree{font-size:0.7em; display:flex;  justify-content:center; align-content:center; align-items:center;  }
#db ul li.agree input[type="checkbox"]{display: inline-block;width:20px; height:20px; margin-right:4px;}
#db ul li.agree label{margin-bottom:0;font-family:'MalgunGothic',sans-serif ;}
#db ul li.agree label a{text-decoration:underline;}
#db ul li.submit{text-align: center;}
#db ul li.submit input{background:#0A1C3A;width:70%;padding:24px 0; font-size:24px; color: #fff;font-weight: 600; border:none; cursor: pointer; border-radius:100px;}
#db ul li.submit input:hover{background: #0A1C3A;}
#db ul li.more_info{width: 100%;text-align: left; font-size:0.9em; color:#666;}
#db ul li .radio_wrap{display:flex;}
#db ul li .radio_wrap .list{display:flex;margin-right:32px; align-content:center; align-items:center;  }
#db ul li .radio_wrap .list label{display: inline-block !important; margin-left:4px; font-size:1.1em ;}
#db ul li .radio_wrap .list input[type="radio"]{width:20px; height:20px;}
#db ul li .radio_wrap .list input[type="radio"]:checked ~ label{color: #0A1C3A;}





@media all and (max-width:1600px) {
.main01 .title{width:400px;left:100px;font-size:14px;}
}

@media all and (max-width:1440px) {
.main_portfolio .title{padding:0 5%;}
.main01{border-radius:0 0 320px 0; }
@keyframes main_slide_ani{
	0%{ border-radius:0 0 0 0;}
	100%{ border-radius:0 0 320px 0;}
}



@media all and (max-width:1280px) {

.main01 .title{width:340px; height:340px;padding:80px 40px 80px 40px;left:60px;font-size:12px;}
.main01 .title .text_line{width:60px; height:4px;}

.main02 .cate_wrap {padding:0 5%;gap:16px;}
.main02 .cate_wrap .list a{padding:2em;}
.main_portfolio .title{font-size:14px;}

.main05{display:flex; margin:5vh 0 0;  justify-content:center;flex-wrap:wrap;}
.main05>article{width:100%; padding:15% 6%;box-sizing:border-box;	}
.main05>article h2{font-size:clamp(24px, 10vw, 42px);}
.main05 .location  .map{height:300px;}
.main05 .location  .location_info{font-size:1em; }


}

@media all and (max-width:1000px) {
.main02 .cate_wrap {flex-wrap:wrap}
.main02 .cate_wrap .list a{padding:1.5em 1em;}
.main02 .cate_wrap .list{width:calc(100% / 3  - 16px)}
.main02 .cate_wrap .list a img{width:100px;}
.main02 .cate_wrap .list a strong{display: block;}
.main02 .cate_wrap .list a .icon_img{margin-bottom:0.5em;}
.main02 .cate_wrap .list a h3{font-size: 1em;}
.main_portfolio .swiper-wrapper img{border-radius:0 !important;}
.main01{border-radius:0 0 240px 0; }
}


@media all and (max-width:860px) {
	.main01 .title{position: absolute;z-index: 10; width:300px;height:220px;padding:40px 30px 40px 30px;left:0; top: auto;bottom: 15%; transform:translate(0,0); font-size:13px; }
	.main01 .title h3{font-size:1.4em; }
	.main01 .title h2{font-size:2.4em; }
	.main01 .title .text_line{width:40px; height:2px;}



	.mo_view{display: block;}

	.main02 .bg_icon{bottom:-50px; text-align:right;}
	.main02 .bg_icon img{width:70%;}
	.main_portfolio .title{font-size:11px}
	.main_portfolio .swiper-wrapper img{border-radius:0 !important;}
	#db ul{font-size: 15px;}

}


@media all and (max-width:600px) {
	.main01 .title{width:250px;padding:40px 20px 40px 20px; font-size:12px; }

	.main02{padding:5vh 0;}
	.main02 .cate_wrap {justify-content: flex-start}
	.main02 .cate_wrap .list a{padding:1.5em 0.5em;}
	.main02 .cate_wrap .list{width:calc(100% / 2  - 16px)}
	.main01{border-radius:0 0 120px 0; }
	#db ul{font-size: 14px;} 
}



@media (max-width: 780px) {
	.addr {
        margin-left: -10px;
    }
    .biznum {
        margin-left: -50px;
    }
}