@charset "UTF-8";
/*----------------------------------------------------------------------
# 메인 CSS 
----------------------------------------------------------------------*/


/*----------------------------------------------------------------------
@ MAIN COMMON 
----------------------------------------------------------------------*/
#main > section {padding-top:6.25rem;padding-bottom:6.25rem; overflow-x:clip; }

.main_title_wrap { position:relative; } 
.main_title {position:relative; display:flex; padding:0rem;line-height:1; }
.main_title h2 { position:relative; width:min-content; font-size:2.8125rem; color:#000; font-weight:700; letter-spacing:0; line-height:1; white-space:nowrap; padding-right:2.5rem; } 
.main_title .line { width:100%; height:1px; background:#000; margin-top:0.5rem; } 

@media screen and (max-width: 1024px){
	.main_title h2 { font-size:2rem; width:min-content; } 
}
@media screen and (max-width: 1024px){
	#main > section {padding-top:5rem;padding-bottom:5rem;}
}
@media screen and (max-width: 768px){
	.main_title { font-size:1.563rem;  }
}




/*----------------------------------------------------------------------
@ Layout Slider 2
----------------------------------------------------------------------*/
#layout_slider_2 {position:relative;padding:0 !important;background:#000; }
#layout_slider_2 .slider__infos {overflow:hidden;height:calc(var(--vh, 1vh) * 100);}
/*배경*/
#layout_slider_2 .slider__thumb {position:relative;width:100%;height:100%; }
#layout_slider_2 .slider__thumb:after { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.2); } 

#layout_slider_2 .slider__thumb .slider__thumb_bg {position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;}
#layout_slider_2 .slider__thumb .slider__thumb_mo {display:none;}
#layout_slider_2 .slider__thumb video {position:absolute;top:50%;left:50%;min-width:100%;min-height:100%; transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);background-size:cover;z-index:-1; object-fit: cover;}
#layout_slider_2 .slider__thumb iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
#layout_slider_2 .slider__mxw {position:absolute;top:0;left:0;right:0; width:100%;height:100%;z-index:9;margin:0 3.125rem;}

/*슬로건*/
#layout_slider_2 .slider__mxw { display:flex; justify-content:flex-start;align-items:flex-start; overflow:hidden; } 
#layout_slider_2 .slider__slogun {display:flex;height:100%;justify-content:flex-start;align-items:flex-start;flex-direction:column; top:calc(50% - 5px);position:relative; text-align:left; padding-left:3.75rem;}
#layout_slider_2 .slider__slogun > b {position:relative;display:block;font-weight:700; color:#fff; font-size:3.125rem; line-height:1.2; overflow:hidden; padding-bottom:0.625rem; letter-spacing:0; word-break:keep-all; }
#layout_slider_2 .slider__slogun > b.subtitle {display:block;font-size:2.1875rem; color:#fff; font-weight:700; line-height:1.2; overflow:hidden; padding-bottom:0.9375rem;  word-break:keep-all;}
#layout_slider_2 .slider__slogun > b > span,
#layout_slider_2 .slider__slogun > p > span { display:block; position:relative; opacity:0; }  
#layout_slider_2 .slider__slogun > p  {position:relative; font-size:1.25rem; color:#fff; font-weight:400; line-height:1.5; overflow:hidden; word-break:keep-all; }


#layout_slider_2 .slider__slogun_btn {position:relative;display:block; min-width:10.625rem; padding:7px 50px 7px 15px; margin-top:2rem;border:1px solid #fff;font-size:1rem;color:#fff;text-align:center;box-sizing:border-box;transition:all 0.3s ease-out;opacity:0; z-index:15; }
#layout_slider_2 .slider__slogun_btn:before {content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:transparent;opacity:0.8;z-index:-1;transition:all 0.3s ease-out }
#layout_slider_2 .slider__slogun_btn > span {display:flex;align-items:center; } 
#layout_slider_2 .slider__slogun_btn > span:after { content:'More Details View'; font-size:0.8125rem; font-weight:300; letter-spacing:0; }
#layout_slider_2 .slider__slogun_btn:hover {border-color:var(--menu);}
#layout_slider_2 .slider__slogun_btn:hover:before {background-color:var(--menu);opacity:1;}
#layout_slider_2 .slider__slogun_btn > i { position:absolute; right:12px; top:8px; display:inline-block; font-size:18px; } 

/*스크롤*/
#layout_slider_2 .slider-scroll-type2 { display:block; position:absolute; left:0;right:0px; text-align:center; bottom:0px; width:80px;height:80px;margin:0 auto;z-index:9; cursor:pointer; }
#layout_slider_2 .slider-scroll-type2 .scroll_text { font-size:0.875rem; color:#fff; font-weight:300; letter-spacing:0; } 
#layout_slider_2 .slider-scroll-type2 .scroll_line { position:relative; width:1px; height:30px; background:rgba(255,255,255, 0.7); margin:0 auto; margin-top:10px; } 
#layout_slider_2 .slider-scroll-type2 .scroll_line:after { content:''; position:absolute; width:5px; height:5px; top:0px; left:-2px; background:#fff; border-radius:50%; z-index:2; animation:scroll_circle 3s ease infinite 0.1s;} 
#layout_slider_2 .slider-scroll-type2 .scroll_line:before { content:''; position:absolute; width:1px; height:20px; top:0px; left:0px; background:#fff; z-index:1; animation:scroll_line 3s ease infinite 0.1s; }

@keyframes scroll_circle {0%{top:0px;}50%{top:30px;}100%{top:0px;}}
@keyframes scroll_line {0%{height:0px;}50%{height:30px;}100%{height:0px;}}

/*좌우 부가 설정*/
#layout_slider_2 .swiper_navigation { display:none; } 
#layout_slider_2 .swiper-button-prev:after, #layout_slider_2 .swiper-button-next:after {font-size:2rem;color:#fff;}
#layout_slider_2 .swiper-pagination-bullet {background-color:rgba(255,255,255, 0.5); opacity:1; transition:all 0.3s ease; }
#layout_slider_2 .swiper-pagination {top:calc(50% + 7px); left:3.125rem;width:auto; text-align:left; }
#layout_slider_2 .swiper-pagination-bullet {display:block;width:2px;height:45px;margin:0;border-radius:0px;background-color:rgba(255,255,255, 0.5); opacity:1; }
#layout_slider_2 .swiper-pagination-bullet-active {background-color:rgba(255,255,255, 1); height:45px;opacity:1; }

/*액션*/
#layout_slider_2 .slider__thumb .slider__thumb_bg {transition: all 15s ease-out; transform: scale(1,1);}
#layout_slider_2 .slider__slogun {position:relative;top:calc(50% - 5px);; transition: all .8s ease-out;} 
#layout_slider_2 .swiper-slide-active .slider__thumb .slider__thumb_bg {transform: scale(1.25);}


/*----------------------------------------------------------------------
@ MAIN 슬라이드 컨트롤러  
----------------------------------------------------------------------*/

#layout_slider_2 .swiper_control_wrap { position:absolute; left:3.125rem; top:calc(50% + 7px);  z-index:12; width:20px; height:auto;  margin:0 auto; } 
#layout_slider_2 .main_visual_state  { display: block;position: absolute;left:50%;transform:translateX(-50%); top: 0%;-webkit-transition: all 300ms;transition: all 300ms;z-index:100;}
#layout_slider_2 .swiper-pagination-fraction {color:#aaa;}

/* controller */
#layout_slider_2 .swiper_control { position: absolute; left: 50%; width:100%; font-size: 0;z-index: 2; }

/* pagination */
#layout_slider_2 .swiper_control .swiper-pagination {position: static;}
#layout_slider_2 .swiper_control .swiper-pagination-wrap {position: relative;}
#layout_slider_2 .swiper_control .swiper-pagination-fraction {display: inline-block; display:none; vertical-align: middle;width: auto;}
#layout_slider_2 .swiper_control .swiper-pagination-fraction > span {display: inline-block;vertical-align: middle;min-width: 20px;font-size: 14px;color:#fff; font-weight: 600;letter-spacing: 0.1em;text-align: center;line-height: 1;}

/* progress */
#layout_slider_2 .swiper_progress_hidden_space {display: inline-block;vertical-align: middle;width:calc(100% - 125px); height: 3px;margin: 0 2px 0 13px;position: relative;}
#layout_slider_2 .swiper_progress_wrap {display: none;width:calc(100% - 125px);height: 3px;position: absolute;left: 35px;top: 50%;margin-top: -1px;background: #767779;overflow: hidden;}
#layout_slider_2 .swiper_progress {display: block;width: 0;height: 100%;background: #fff;}

/* state */
#layout_slider_2 .swiper_play_state {display: inline-block;display:none;vertical-align: middle;width: 26px;height: 26px;position: relative;top: 0px;left:5px;}
#layout_slider_2 .swiper_play_state_btn {display: block;width: 100%;height: 100%;margin: 0;padding: 0;position: absolute;top: 0;left: 0;background: transparent;border: none;cursor: pointer;opacity: 0;visibility: hidden;-webkit-transition: opacity 300ms;transition: opacity 300ms;}

#layout_slider_2 .swiper_play_state .material-icons { color:#fff; font-size:20px; margin-top:4px;  } 
#layout_slider_2 .swiper_play_state.play .swiper_state_pause {opacity: 1; visibility: visible;}
#layout_slider_2 .swiper_play_state.pause .swiper_state_play {opacity: 1; visibility: visible;}


/* Responsive */
@media screen and (max-width: 1470px){
	#layout_slider_2 .slider__mxw { margin:0 1.25rem; padding-right:0.9375rem; } 
	#layout_slider_2 .swiper_control { left:15px; } 
	#layout_slider_2 .swiper_control_wrap { top:calc(40% + 7px); left:1.25rem; } 
	#layout_slider_2 .swiper-pagination {  margin-left:0; } 
	#layout_slider_2 .slider__slogun { top:40%; padding-left:2rem; } 
} 
@media screen and (max-width: 1024px){
	#layout_slider_2 .slider__slogun { padding-right:0.9375rem; }
	#layout_slider_2 .slider-scroll-type2 { display:none; } 
}
@media screen and (max-width:768px){
	#layout_slider_2 .slider__slogun { text-align:left; } 

	#layout_slider_2 .slider__slogun > b { font-size:2rem; }
	#layout_slider_2 .slider__slogun > b.subtitle { font-size:1.5625rem; }
	#layout_slider_2 .slider__slogun > p  { font-size:1rem; }

	/*
	#layout_slider_2 .slider__slogun > b { font-size:3rem; line-height:1.3; margin-bottom:0rem; }
	#layout_slider_2 .slider__slogun > b.subtitle { font-size:2.5rem;line-height:1.3;margin-bottom:0rem;color:transparent;overflow:hidden;text-transform:uppercase;-webkit-text-stroke: 1px #fff; }
	#layout_slider_2 .slider__slogun > p { font-size:1rem;line-height:1.47;color:#fff;overflow: }
	*/
	#layout_slider_2 .swiper-pagination-bullet { height:2.5rem; }
	#layout_slider_2 .swiper-pagination-bullet-active { height:3.438rem;}
}
@media screen and (max-width: 640px){
	#layout_slider_2 .slider__mxw { margin:0 auto; padding:0 1.25rem; padding-left:3.125rem; } 
	#layout_slider_2 .slider__infos { height:revert; aspect-ratio:640/1024; }
	#layout_slider_2 .slider__thumb .slider__thumb_bg {display:none;}
	#layout_slider_2 .slider__thumb .slider__thumb_bg.slider__thumb_mo {display:block;}
	#layout_slider_2 .slider__slogun { margin-left:0; padding-left:0rem; } 
}
@media screen and (max-width: 540px){
	/*
	#layout_slider_2 .slider__slogun > b { font-size:2.5rem; line-height:1.3; margin-bottom:0rem; }
	#layout_slider_2 .slider__slogun > b.subtitle { font-size:2rem;line-height:1.3;margin-bottom:0rem;color:transparent;overflow:hidden;text-transform:uppercase;-webkit-text-stroke: 0.5px #fff; }
	#layout_slider_2 .slider__slogun > p { font-size:1rem;line-height:1.47;color:#fff;overflow: }
	*/
} 
@media screen and (max-width: 480px){
}




/*----------------------------------------------------------------------
@ MAIN ABOUT 
----------------------------------------------------------------------*/
#main_about {   } 
.main_about { position:relative; display:flex; margin:0 9.375rem; } 
.main_about .left { width:42.3%; padding:0 5.3125rem 0 0rem; } 
.main_about .right { width:calc(100% - 42.3%); } 


.about_cont { display:flex; flex-direction:column; gap:2rem; color:#000; } 
.about_cont .rows { display:flex; flex-direction:column; gap:0.625rem; }
.about_cont .rows .row { display:flex; gap:0.5rem;  } 
.about_cont .rows .row .item { font-size:1.5625rem; font-weight:700; line-height:1; white-space:nowrap; } 
.about_cont .rows .row .desc { font-size:1.25rem; } 

.about_cont .slogun { font-size:2.8125rem; font-weight:700; line-height:1.22;  } 
.about_cont .button { margin-top:1.25rem; } 
.about_cont .button a { position:relative; display:inline-flex; align-items:center; justify-content:center; min-width:15.625rem; height:3.125rem; font-size:0.9375rem; color:#333; font-weight:500; letter-spacing:0; border:1px solid #000; border-radius:2px; box-shadow: 0px 0px 0.9375rem 0px rgba(0, 0, 0, 0.1); overflow:hidden; transition:all 0.4s ease; } 
.about_cont .button a:after { content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:0; aspect-ratio:1; background:#000; border-radius:50%; opacity:0; transition:all 0.4s ease; z-index:-1;  } 
.about_cont .button a:hover { color:#fff; } 
.about_cont .button a:hover:after { width:200%; opacity:1; } 

@media screen and (max-width: 1470px){
	.main_about { margin:0 1.25rem; } 
	.main_about .left { padding:0 2rem 0 0rem; } 
} 
@media screen and (max-width: 1024px){
	.main_about { flex-direction:column; margin:0 15px; } 
	.main_about .left { width:100%; padding:0 0 1.875rem 0; } 
	.main_about .right { width:100%; } 

	.about_cont .rows .row .item { font-size:1.25rem; line-height:1.2; } 
	.about_cont .rows .row .desc { font-size:1.125rem; }
	.about_cont .slogun { font-size:1.875rem;  } 
} 
@media screen and (max-width: 640px){
	.about_cont .rows { row-gap:0.9375rem; } 
	.about_cont .rows .row { flex-direction:column; row-gap:0.3125rem; } 
	.about_cont .slogun { font-size:1.5625rem; line-height:1.4; } 
	.about_cont .slogun br.w640 { display:none; } 
}	



/*----------------------------------------------------------------------
@ MAIN PORTFOLIO 
----------------------------------------------------------------------*/
#main_portfolio { padding-top:0 !important; } 
.main_portfolio { position:relative; margin:0 9.375rem; } 

#main_portfolio #portfolioList--1 .pf-list { margin-right:-0.3125rem; } 
#main_portfolio #portfolioList--1 .pf-list li { width: calc((100% / 4) - 0.625rem); margin-right:0.625rem; margin-bottom:0.625rem; } 


.portfolio_more { display:flex; align-items:center; justify-content:center; margin-top:4.375rem;  } 
.portfolio_more a { position:relative;   } 
.portfolio_more a span { position:relative; display:inline-flex; align-items:center; justify-content:center; width:10.625rem; aspect-ratio:1; font-size:1.0625rem; color:#000; font-weight:600; letter-spacing:0.05em; border-radius:50%; border:3px solid #000; transition:all 0.3s ease; } 
.portfolio_more a span::after { content:''; position:absolute; left:-17px; top:-17px; width:calc(100% + 34px); height:calc(100% + 34px); background:url('/images/main/icon_more_circle.png') no-repeat center center / 100%;  animation:spin 12s infinite linear; z-index:0;  } 
.portfolio_more a span:before { content:''; position:absolute; left:calc(50% - 0px); top:calc(50% - 0px); transform:translate(-50%, -50%); width:0; height:0;  background:#000; border-radius:50%; transition:all 0.3s ease; z-index:-1; } 
.portfolio_more a:hover span { color:#fff; } 
.portfolio_more a:hover span:before { width:calc(100% + 2px); height:calc(100% + 2px);  } 

@media screen and (max-width: 1470px){
	.main_portfolio { margin:0 1.25rem; } 
} 
@media screen and (max-width: 1024px){
	.main_portfolio { margin:0 15px; } 
	.portfolio_more a span { width:9rem; font-size:1rem; } 
} 
@media screen and (max-width: 640px){
	/*#main_portfolio #portfolioList--1 .pf-list { margin-right:0 !important; } */
	#main_portfolio #portfolioList--1 .pf-list li { width: calc((100% / 2) - 0.3125rem) !important; } 
}
@media screen and (max-width: 360px){
	#main_portfolio #portfolioList--1 .pf-list li { width: calc((100% / 1) - 0.3125rem) !important; } 
}