@charset "UTF-8";
/********************************************************

		main

********************************************************/
/*----------------------------------------------------------------------
@ MAIN HEADER
----------------------------------------------------------------------*/
/*
#header {border-bottom:none;}
#header.nav-up {border-bottom:1px solid #f5f5f5;}
#header.nav-down {border-bottom:1px solid #f5f5f5;} 
.lnb-menu > li > a {color:#fff;}
#header.nav-up .lnb-menu > li > a {color:#fff;}
#header.nav-down .lnb-menu > li > a {color:#111;}
#header.type2.open_menu .lnb-menu > li > a {color:#111;}
#header.nav-down.nav-top .lnb-menu > li > a {color:#fff;}
#header.type2.open_menu.nav-down.nav-top .lnb-menu > li > a {color:#111;}
#header.nav-down.nav-top {border-bottom:none;}
#header .logo1 {display:none;}
#header.nav-down .logo1 {display:block;}
#header.nav-down .logo2 {display:none;}
#header.nav-down.nav-top .logo1 {display:none;}
#header.nav-down.nav-top .logo2 {display:block;}
#header__mobile span {background-color:#fff;}
#header.nav-down.nav-top #header__mobile span {background-color:#fff;}
@media screen and (max-width: 1024px){
	#header.nav-up .logo1 {display:block;}
	#header.nav-up .logo2 {display:none;}
}
*/

/*----------------------------------------------------------------------
	메인
----------------------------------------------------------------------*/
#main > section {/*padding-top:6.25rem;padding-bottom:6.25rem;*/}
#main #main__bnr .bnr-list li {width:48.5%;}
.main__title {margin-bottom:0.938rem;font-weight:600;font-size:1.25rem;color:#333;text-align:center;}
.main__title span {display:block;font-size:0.875rem;color:#b3a586;letter-spacing:0}
.main__desc {margin-bottom:3.75rem;font-size:0.875rem;color:#221916;line-height:1.7;text-align:center;}
@media screen and (max-width: 1024px){
	#main > section {/*padding-top:5rem;padding-bottom:5rem;*/}
}
@media screen and (max-width: 768px){
}

section { overflow-x:clip; }

/*----------------------------------------------------------------------
@ Layout Slider 1
----------------------------------------------------------------------*/
#layout_slider_1 {position:relative;padding:0 !important;background:#000; }
#layout_slider_1 .slider__infos {overflow:hidden;height:100vmin;}

/*배경*/
#layout_slider_1 .slider__thumb {position:relative;width:100%;height:100%; }
#layout_slider_1 .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_1 .slider__thumb .slider__thumb_mo {display:none;}
#layout_slider_1 .slider__thumb video {position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);background-size:cover;z-index:-1;}
#layout_slider_1 .slider__thumb iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
#layout_slider_1 .slider__mxw {position:absolute;top:0;left:0;right:0;max-width:1440px;width:100%;height:100%;z-index:9;margin:0 auto;}

/*슬로건*/
#layout_slider_1 .slider__slogun {display:flex;height:100%;justify-content:center;align-items:flex-start;flex-direction:column;text-align:left;font-weight:900; color:#fff;}
#layout_slider_1 .slider__slogun > b.title {margin-bottom:1.875rem; display:block;font-weight:400;font-size:1.563rem; color:rgba(255,255,255,0.5); overflow:hidden; letter-spacing:0.3em; }
#layout_slider_1 .slider__slogun > b {position:relative;display:block;font-weight:700;font-size:3.75rem;line-height:1.2;color:#fff;overflow:hidden; word-break:keep-all;}
#layout_slider_1 .slider__slogun > b.subtitle {margin-top:1.875rem; display:block;font-weight:300;font-size:1.563rem;line-height:1;color:#fff;overflow:hidden; word-break:keep-all;}
#layout_slider_1 .slider__slogun > b > span,
#layout_slider_1 .slider__slogun > p > span { display:block; position:relative; opacity:0; } 
#layout_slider_1 .slider__slogun > p {position:relative;margin-top:20px;font-weight:400;font-size:1.375rem;line-height:1.47;color:#fff;overflow:hidden; word-break:keep-all;}
#layout_slider_1 .slider__slogun_btn {position:relative;display:block;padding:1rem 2rem; 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; }
#layout_slider_1 .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_1 .slider__slogun_btn > span {display:flex;align-items:center;justify-content:center;}
#layout_slider_1 .slider__slogun_btn > span:after {content:'More View';}

/*스크롤*/
#layout_slider_1 .slider-scroll { position:relative;  } 
#layout_slider_1 .slider-scroll a {display:block;position:absolute; width:1.25rem; height:10rem; right:7.5rem;margin:0 auto;font-weight:500;font-size:0.813rem;color:#fff;animation:scrolltype1 2s linear infinite;cursor:pointer;text-align:center;letter-spacing:0.1em; ;z-index:9;writing-mode:vertical-lr;}
#layout_slider_1 .slider-scroll a:before {content:'';position:absolute; bottom:0; display:block;width:17px;height:24px;margin:0 auto;background-image:url(/images/common/visual_scroll_new.png);background-repeat:no-repeat;background-position:center;background-size:cover;}

@keyframes scrolltype1 {0%{bottom:3.125rem;}50%{bottom:4.375rem;}100%{bottom:3.125rem;}}

/*액션*/
#layout_slider_1 .slider__thumb .slider__thumb_bg {transition: all 8s ease-out; transform: scale(1,1);}
#layout_slider_1 .slider__slogun {position:relative;top:0rem; transition: all .8s ease-out;}
#layout_slider_1 .swiper-slide-active .slider__slogun {top:0;}
#layout_slider_1 .swiper-slide-active .slider__thumb .slider__thumb_bg {transition: all 8s ease-out; transform: scale(1.25);}

/* SWIPER PAGINATION */
#layout_slider_1 .swiper-button-prev:after, #layout_slider_1 .swiper-button-next:after {font-size:1rem;color:#fff;}
#layout_slider_1 .swiper-button-prev { right:30px; left:revert; } 
#layout_slider_1 .swiper-button-next { right:10px; }

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

#layout_slider_1 .swiper_control_wrap { position:absolute; left:50%; transform:translateX(-50%); z-index:12; bottom:80px; max-width:1440px; width:100%; height:auto;  margin:0 auto;   } 
#layout_slider_1 .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_1 .swiper-pagination-fraction {color:#aaa;}

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

/* pagination */
#layout_slider_1 .swiper_control .swiper-pagination {position: static;}
#layout_slider_1 .swiper_control .swiper-pagination-wrap {position: relative;}
#layout_slider_1 .swiper_control .swiper-pagination-fraction {display: inline-block; display:none; vertical-align: middle;width: auto;}
#layout_slider_1 .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_1 .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_1 .swiper_progress_wrap {display: block;width:calc(100% - 125px);height: 3px;position: absolute;left: 35px;top: 50%;margin-top: -1px;background: #767779;overflow: hidden;}
#layout_slider_1 .swiper_progress {display: block;width: 0;height: 100%;background: #fff;}

/* state */
#layout_slider_1 .swiper_play_state {display: inline-block;vertical-align: middle;width: 26px;height: 26px;position: relative;top: 0px;left:5px;}
#layout_slider_1 .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_1 .swiper_play_state .material-icons { color:#fff; font-size:20px; margin-top:4px;  } 
#layout_slider_1 .swiper_play_state.play .swiper_state_pause {opacity: 1; visibility: visible;}
#layout_slider_1 .swiper_play_state.pause .swiper_state_play {opacity: 1; visibility: visible;}

/* Responsive */
@media screen and (max-width: 1720px){
	#layout_slider_1 .slider-scroll a { bottom:4rem; right:1.25rem; } 
} 
@media screen and (max-width: 1520px){
	#layout_slider_1 .swiper_control_wrap { margin-left:0px;   } 
	#layout_slider_1 .swiper_progress_hidden_space {  width:calc(100% - 170px); }
	#layout_slider_1 .swiper_progress_wrap { width:calc(100% - 170px);  } 
	#layout_slider_1 .swiper-button-prev { right:80px; left:revert; } 
	#layout_slider_1 .swiper-button-next { right:60px; }
}
@media screen and (max-width: 1480px){
	#layout_slider_1 .slider__mxw { margin:0 20px;}
} 
@media screen and (max-width: 1200px){
	#layout_slider_1 .slider__mxw { padding:0 15px; margin:0 auto; }
} 
@media screen and (max-width: 1024px){
	#layout_slider_1 .slider-scroll { display:none; } 

	#layout_slider_1 .slider__slogun > b.title { font-size:1.25rem; ; word-break:keep-all;} 
	#layout_slider_1 .slider__slogun > b { font-size:2.75rem;  word-break:keep-all;} 
	#layout_slider_1 .slider__slogun > b.subtitle { font-size:1.25rem;line-height:1.2; word-break:keep-all; }
	#layout_slider_1 .slider__slogun > p { font-size:1.25rem; } 

	#layout_slider_1 .slider__slogun img { max-width:85%; } 
	#layout_slider_1 .swiper_progress_hidden_space {  width:calc(100% - 100px); }
	#layout_slider_1 .swiper_progress_wrap { width:calc(100% - 100px);  } 
	#layout_slider_1 .swiper_play_state { left:5px;}
	#layout_slider_1 .swiper-button-prev { right:30px; left:revert; } 
	#layout_slider_1 .swiper-button-next { right:10px; }
}
@media screen and (max-width: 640px){
	#layout_slider_1 .slider__infos {height:640px;}
	#layout_slider_1 .slider__thumb .slider__thumb_bg {display:none;}
	#layout_slider_1 .slider__thumb .slider__thumb_bg.slider__thumb_mo {display:block;}
	#layout_slider_1 .slider__slogun > b { font-size:2.25rem; } 
	#layout_slider_1 .slider__slogun > p { font-size:1rem; } 
}
@media screen and (max-width: 540px){
	#layout_slider_1 .slider__slogun > b { font-size:2rem; } 
	#layout_slider_1 .slider__slogun > b.subtitle {font-size:1rem; } 
	#layout_slider_1 .swiper_control_wrap { bottom:10%; }  
}
@media screen and (max-width: 480px){
	#layout_slider_1 .slider__infos {height:480px;}
}

/*----------------------------------------------------------------------
@ Layout Service 7
----------------------------------------------------------------------*/
#layout_service_7 { position:relative; display:flex; align-items:center; justify-content:center;   } 
#layout_service_7 .container { width:100%; margin:0 auto}
#layout_service_7 .thk-row { flex-wrap:nowrap; margin-right:0rem; }
#layout_service_7 .thk-col { position:relative; display:flex; align-items:center; justify-content:center;  margin-right:0rem; min-height:37.5rem; padding:0.938rem;  background-repeat:no-repeat; background-size:cover;background-position:center center;  }
#layout_service_7 .thk-col:after { content:''; position:absolute; left:0px; top:0px; width:100%; height:100%; background:rgba(0,0,0,0.6); opacity:0; transition:all 0.4s ease; z-index:0; } 
#layout_service_7 .thk-col:last-of-type { }
#layout_service_7 .row-md6 .thk-col { flex:revert; width: calc((100% / 6 )); transition:all 0.5s ease; } 
#layout_service_7 .service7_cont { text-align:center; color:#fff; pointer-events: none; z-index:2; } 
#layout_service_7 .service7_title { font-size:1.563rem; font-weight:700; line-height:1.2; letter-spacing:0rem; transition:all 0.4s ease; } 
#layout_service_7 .service7_summ { position:relative; font-size:1.125rem; color:#b4b4b4; font-weight:400; line-height:1.25; margin-top:1.875rem; word-break:keep-all; transition:all 0.4s ease; } 

/* active */ 
#layout_service_7 .row-md6 .thk-col.active { width: calc(((100% / 6 ) * 2.7) - 0rem); } 
#layout_service_7 .row-md6 .thk-col.active:after { opacity:1; } 
#layout_service_7 .row-md6 .thk-col.active .service7_title { font-size:2.188rem; } 
#layout_service_7 .row-md6 .thk-col.active .service7_summ { font-size:1.25rem; color:#fff; } 

/* Responsive */
@media screen and (max-width: 1440px) and (min-width: 1025px){
	#layout_service_7 .service7_title { font-size:1.25rem; }
	#layout_service_7 .service7_summ { font-size:1rem; margin-top:1.25rem; } 
	#layout_service_7 .row-md6 .thk-col.active .service7_title { font-size:1.563rem; } 
	#layout_service_7 .row-md6 .thk-col.active .service7_summ { font-size:1.12rem; } 
} 
@media screen and (max-width:1200px){
}
@media screen and (max-width:1024px){
	#layout_service_7 .thk-col { min-height:16.875rem;  } 
	#layout_service_7 .thk-row  { flex-wrap:wrap; } 
	#layout_service_7 .row-md6 .thk-col,
	#layout_service_7 .row-md6 .thk-col.active { width: calc((100% / 3 )); } 
	/* 7개 일때 */
	#layout_service_7 .row-md6 .thk-col:nth-of-type(n+4), 
	#layout_service_7 .row-md6 .thk-col.active:nth-of-type(n+4) { width: calc((100% / 4 )); } 
	#layout_service_7 .service7_title { font-size:1.25rem; }
	#layout_service_7 .service7_summ { font-size:1rem; margin-top:1.25rem; } 
	#layout_service_7 .row-md6 .thk-col.active .service7_title { font-size:1.563rem; } 
	#layout_service_7 .row-md6 .thk-col.active .service7_summ { font-size:1.12rem; } 
}
@media screen and (max-width:768px){
	#layout_service_7 .row-md6 .thk-col,
	#layout_service_7 .row-md6 .thk-col.active { width: calc((100% / 2 )) !important; } 
	/* 7개 일때 */
	#layout_service_7 .row-md6 .thk-col:nth-of-type(n+7), 
	#layout_service_7 .row-md6 .thk-col.active:nth-of-type(n+7) { width: calc((100% / 1 )) !important; } 
}  
@media screen and (max-width:640px){
	#layout_service_7 .service7_summ br { display:block; } 
} 
@media screen and (max-width:480px){
	#layout_service_7 .row-md6 .thk-col,
	#layout_service_7 .row-md6 .thk-col.active { width: calc((100% / 1 )) !important; } 
	#layout_service_7 .service7_summ br { display:none; } 
}

/*----------------------------------------------------------------------
@ Layout About 5 
----------------------------------------------------------------------*/
#layout_about_5 { position:relative; display:flex; align-items:center; justify-content:center; padding-top:7.5rem; padding-bottom:7.5rem; } 
#layout_about_5 .container { width:100%; max-width:1170px; margin:0 auto; }
#layout_about_5 .mueeui{ width:100%; }
#layout_about_5 .thk-col:last-of-type { }

#layout_about_5 .about5_img { position:relative; text-align:left;  } 
#layout_about_5 .about5_img:after { content:''; position:absolute; left:0px; top:0px; width:calc(100% - 4.375rem); height:calc(100% - 4.375rem); background:#eff4f4; z-index:-1; } 

#layout_about_5 .about5_inner { position:relative; padding-top:4.375rem; margin-left:4.375rem; overflow-x:clip; } 
#layout_about_5 .about5_thumb { }
#layout_about_5 .about5_text { display:flex; flex-direction:column; align-items:center; justify-content:center;position:absolute; left:0px; top:0px; width:100%; height:100%; color:#fff; } 
#layout_about_5 .about5_text_medium { font-size:3rem; font-weight:700; line-height:1; }
#layout_about_5 .about5_text_big { font-size:3.75rem; font-weight:700; line-height:0.8; }
#layout_about_5 .about5_text_small { font-size:1rem; font-weight:700; letter-spacing:0.05em; }

#layout_about_5 .about5_cont { padding:4.375rem 0 4.375rem 4.375rem; color:#222;  } 
#layout_about_5 .about5_subtitle { font-size:1.375rem; font-weight:400; margin-bottom:5px; } 
#layout_about_5 .about5_title { font-size:2.375rem; font-weight:600; line-height:1.4; } 
#layout_about_5 .about5_title b { }
#layout_about_5 .about5_entitle { font-family:'Merriweather'; font-size:1.125rem; font-style:italic; color:#333; margin-top:1.563rem; } 
#layout_about_5 .about5_summ { position:relative; font-size:1rem; color:#666; font-weight:300; line-height:1.56; margin-top:0.725rem; word-break:keep-all; } 

#layout_about_5 .about5_btn { position:relative; text-align:left; margin-top:3.125rem; } 
#layout_about_5 .about5_btn a { display:inline-flex; align-items:center; font-size:14px; color:#000; font-weight:600; letter-spacing:0; padding:0.625rem 1.875rem; background:#fff; border:2px solid #222; } 
#layout_about_5 .about5_btn a:hover { color:#fff; } 
#layout_about_5 .about5_btn a:after { background:#14171d; } 
#layout_about_5 .about5_btn .arrow_icon6 { margin-top:2px; margin-left:10px; } 
#layout_about_5 .about5_btn .arrow_icon6 .material-icons { font-size:20px; } 

#layout_about_5 .about5_img2 { position:relative; text-align:left; padding-top:2.188rem; padding-left:2.188rem; margin-top:4.375rem;  } 
#layout_about_5 .about5_img2 img { max-width:100%; } 
#layout_about_5 .about5_img2:after { content:''; position:absolute; left:0px; top:0px; width:calc(100% - 4.375rem); height:calc(100% - 4.375rem); border-top:10px solid #addcdb; border-left:10px solid #addcdb;  z-index:-1; } 

#layout_about_5 .swiper-button-prev:after { content:'PREVIOUS'; } 
#layout_about_5 .swiper-button-next:after { content:'NEXT'; } 

#layout_about_5 .swiper-button-prev:after, 
#layout_about_5 .swiper-button-next:after { font-size:14px; color:#999; font-weight:700; transition:all 0.4s ease; letter-spacing:0.1em;  } 

#layout_about_5 .swiper-button-prev:hover:after, 
#layout_about_5 .swiper-button-next:hover:after { color:#282828; } 

#layout_about_5 .swiper-button-prev {left:revert; right:60px; top:revert; bottom:-45px; width:100px; height:45px; margin-top:0rem;  justify-content:flex-end; }
#layout_about_5 .swiper-button-next { right:0px; top:revert; bottom:-45px; width:55px; height:45px; margin-top:0rem; justify-content:flex-end; }

/* Responsive */
@media screen and (max-width:1200px){
	#layout_about_5 { padding-top:5rem; padding-bottom:5rem; } 
	#layout_about_5 .container { margin:0 15px; }
	#layout_about_5 .about5_cont { padding:4.375rem 0 2.375rem 2.375rem; } 
}
@media screen and (max-width:1024px){
	#layout_about_5 { padding-top:4rem; padding-bottom:4rem; } 
	#layout_about_5 .about5_inner { padding-top:2.5rem; margin-left:2.5rem;  } 
	#layout_about_5 .about5_cont { padding:2.5rem 0 0; } 
	#layout_about_5 .about5_text_medium { font-size:2rem;  }
	#layout_about_5 .about5_text_big { font-size:2.5rem;  line-height:0.9; }
	#layout_about_5 .about5_text_small { font-size:0.875rem; }

	#layout_about_5 .about5_subtitle { font-size:1.25rem;  } 
	#layout_about_5 .about5_title { font-size:2rem;  } 
}
@media screen and (max-width:640px){
	#layout_about_5 .container { padding:0 15px; }
	#layout_about_5 .mueeui{ width:revert; }
	#layout_about_5 .thk-row { flex-direction:column; margin-right:0rem; } 
	#layout_about_5 .thk-col:first-of-type { margin-bottom:1.875rem; }
	#layout_about_5 .row-md2 .thk-col { width: calc((100% / 1) ); margin-right:0rem; }  

	#layout_about_5 .about5_thumb img { width:100%; } 
	#layout_about_5 .about5_img2 img { width:100%; } 
}

/*----------------------------------------------------------------------
@ Layout Portfolio 5
----------------------------------------------------------------------*/
#layout_portfolio_5 { position:relative; display:flex; align-items:center; justify-content:center; padding-top:7.5rem; padding-bottom:7.5rem; background:#f4f4f4; } 
#layout_portfolio_5 .container { width:100%; max-width:1170px; margin:0 auto; }
#layout_portfolio_5 .thk-col { margin-bottom:1.875rem; overflow:hidden;  }

#layout_portfolio_5 .portfolio5_sec_title_wrap { text-align:left; margin-bottom:2.5rem; } 
#layout_portfolio_5 .portfolio5_sec_entitle { font-family:'Merriweather'; font-size:1.125rem; font-style:italic; color:#999; margin-bottom:5px; } 
#layout_portfolio_5 .portfolio5_sec_title { font-size:1.875rem; color:#222; font-weight:700; line-height:1.2; letter-spacing:0rem; } 
#layout_portfolio_5 .portfolio5_sec_summ { position:relative; font-size:1rem; color:#666; font-weight:400; padding-top:1.563rem; margin-top:1.563rem; word-break:keep-all; } 
#layout_portfolio_5 .portfolio5_sec_summ:after { content:''; position:absolute; top:0rem; left:0;  width:10.625rem; height:2px; background:#38aae1;; } 

#layout_portfolio_5 .thk-col a { width:100%; height:100%; overflow:hidden; } 

#layout_portfolio_5 .portfolio5_list {  }
#layout_portfolio_5 .portfolio5_list_inner { overflow:hidden; } 
#layout_portfolio_5 .portfolio5_thumb_wrap { position:relative;overflow:hidden; } 
#layout_portfolio_5 .portfolio5_thumb {position:relative;width:100%;height:0;padding-top:73%;text-align:center; overflow:hidden; transition:all 0.3s ease; z-index:1; }
#layout_portfolio_5 .portfolio5_thumb:after { content:''; position:absolute; left:0px; top:0px; width:100%; height:100%; background:rgba(0,0,0,0.5); opacity:0; transition:all 0.3s ease; } 
#layout_portfolio_5 .portfolio5_thumb img {position:absolute; width:100%; top:50%;left:50%; transform:translate(-50%,-50%); -o-object-fit: cover;object-fit: cover;}
#layout_portfolio_5 .portfolio5_info { display:flex; background:#fff; padding:1.563rem; transition:all 0.3s ease; z-index:2;  } 

#layout_portfolio_5 .portfolio5_cont { text-align:left; color:#333; } 
#layout_portfolio_5 .portfolio5_title { font-size:1.125rem; font-weight:600; line-height:1.2;  } 
#layout_portfolio_5 .portfolio5_cate { font-size:0.875rem; color:#666; font-weight:400; margin-top:0.625rem; letter-spacing:0;  } 

#layout_portfolio_5 .thk-col:hover .portfolio5_thumb { transform:scale(1.1); } 
#layout_portfolio_5 .thk-col:hover .portfolio5_thumb:after { opacity:1; } 

#layout_portfolio_5 .swiper-container { position:revert; overflow:; } 
#layout_portfolio_5 .swiper-position { position:absolute; top:52%; width:100%; max-width:1170px; }
#layout_portfolio_5 .swiper-button-prev:after, 
#layout_portfolio_5 .swiper-button-next:after { font-size:10px; color:#fff; font-weight:700; transition:all 0.4s ease;  } 
#layout_portfolio_5 .swiper-button-prev {left:-4.375rem; top:calc(50% - 1.5625rem);width:3.125rem; height:3.125rem; background:#8c8c8d; }
#layout_portfolio_5 .swiper-button-next  {right:-4.375rem;top:calc(50% - 1.5625rem); width:3.125rem; height:3.125rem;  background:#8c8c8d; }

/* Responsive */
@media screen and (max-width:1200px){
	#layout_portfolio_5 { padding-top:5rem; padding-bottom:5rem; } 
	#layout_portfolio_5 .container { margin:0 15px; } 

	#layout_portfolio_5 .swiper-position { left:0; } 
	#layout_portfolio_5 .swiper-button-prev { left:10px; } 
	#layout_portfolio_5 .swiper-button-next { right:10px; } 
}
@media screen and (max-width:1199px){
	#layout_portfolio_5 .container { padding:0 15px; margin:0 auto; } 
}
@media screen and (max-width:1024px){
	#layout_portfolio_5 { padding-top:4rem; padding-bottom:4rem; } 
	#layout_portfolio_5 .container { :0 15px; } 
}

/*----------------------------------------------------------------------
@ Layout Portfolio 8
----------------------------------------------------------------------*/
#layout_portfolio_8 { position:relative; display:flex; align-items:center; justify-content:center; padding-top:7.5rem; padding-bottom:7.5rem; } 
#layout_portfolio_8 .container { width:100%; max-width:1170px; margin:0 auto; }
#layout_portfolio_8 .thk-row { display:block; }
#layout_portfolio_8 .thk-row:after { content:''; display:block; clear:both; }
#layout_portfolio_8 .thk-col { float:left; margin-bottom:1.875rem; }
#layout_portfolio_8 .row-md4 .thk-col:nth-of-type(1) { width: calc((100% / 2 ) - 1.875rem); } 
#layout_portfolio_8 .portfolio8_sec_title_wrap { text-align:center; margin-bottom:3.75rem; } 
#layout_portfolio_8 .portfolio8_sec_title { font-size:1.875rem; color:#222; font-weight:700; line-height:1.2; letter-spacing:0rem; } 

#layout_portfolio_8 .portfolio8_thumb { position:relative;width:100%; height:100%;  } 
#layout_portfolio_8 .portfolio8_thumb_wrap { position:relative;overflow:hidden; } 
#layout_portfolio_8 .portfolio8_thumb {position:relative;width:100%;height:0;padding-top:100%;text-align:center; overflow:hidden; transition:all 0.3s ease; z-index:1; }
#layout_portfolio_8 .portfolio8_thumb:after { content:''; position:absolute; left:0px; top:0px; width:100%; height:100%; background:rgba(0,0,0,0.8); opacity:0; transition:all 0.3s ease; } 
#layout_portfolio_8 .portfolio8_thumb img {position:absolute; width:100%; top:50%;left:50%; transform:translate(-50%,-50%); -o-object-fit: cover;object-fit: cover;}

#layout_portfolio_8 .portfolio8_info { display:flex; align-items:center; justify-content:center; position:absolute; left:0px; top:0px; width:100%; height:100%;  opacity:0; transition:all 0.3s ease; z-index:2; } 
#layout_portfolio_8 .portfolio8_cont { text-align:center; color:#fff; } 
#layout_portfolio_8 .portfolio8_title { font-size:1.125rem; font-weight:600; line-height:1.2; transition:all 0.3s ease} 
#layout_portfolio_8 .portfolio8_entitle { font-family:'Merriweather'; font-size:0.813rem; font-style:italic; color:#999; margin-top:0.625rem; letter-spacing:0rem; transition:all 0.3s ease} 

#layout_portfolio_8 .portfolio8_btn { position:relative; text-align:center; margin-top:3.125rem; } 
#layout_portfolio_8 .portfolio8_btn a { display:inline-block; min-width:15.625rem; font-size:0.938rem; color:#14171d; font-weight:600; padding:1rem 3.125rem; letter-spacing:0; border:1px solid #e9e9e9; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1); background:#fff; } 
#layout_portfolio_8 .portfolio8_btn a:hover { color:#fff; } 
#layout_portfolio_8 .portfolio8_btn a:after { background:#14171d; } 

#layout_portfolio_8 .portfolio8_category { display:flex; align-items:center; justify-content:center; margin-bottom:2.5rem; } 
#layout_portfolio_8 .portfolio8_category .portfolio8_category_list { }
#layout_portfolio_8 .portfolio8_category a { display:inline-block; font-size:0.875rem; color:#666; font-weight:400; margin-right:2.813rem; margin-bottom:0.625rem; letter-spacing:0; transition:all 0.3s ease; } 
#layout_portfolio_8 .portfolio8_category a span { position:relative; } 
#layout_portfolio_8 .portfolio8_category a span:after { content:''; position:absolute; top:-10px; left:50%; transform:translateX(-50%); width:0; height:2px; background:#38aae1; transition:all 0.3s ease;  } 
#layout_portfolio_8 .portfolio8_category a:last-of-type { margin-right:0; } 

#layout_portfolio_8 .portfolio8_category a.on, 
#layout_portfolio_8 .portfolio8_category a:hover { color:#38aae1; font-weight:600; } 
#layout_portfolio_8 .portfolio8_category a.on span:after, 
#layout_portfolio_8 .portfolio8_category a:hover span:after { width:100%; } 

#layout_portfolio_8 .thk-col:hover .portfolio8_info { opacity:1; } 
#layout_portfolio_8 .thk-col:hover .portfolio8_thumb {  } 
#layout_portfolio_8 .thk-col:hover .portfolio8_thumb:after { opacity:1; } 
#layout_portfolio_8 .thk-col:hover .portfolio8_title { color:#fff; } 
#layout_portfolio_8 .thk-col:hover .portfolio8_entitle { color:#fff; } 

/* Responsive */
@media screen and (max-width:1200px){
	#layout_portfolio_8 { padding-top:5rem; padding-bottom:5rem; } 
	#layout_portfolio_8 .container { margin:0 15px; }
}
@media screen and (max-width:1024px){
	#layout_portfolio_8 { padding-top:4rem; padding-bottom:4rem; } 
	#layout_portfolio_8 .row-md4 .thk-col { width: calc((100% / 4 ) - 1.875rem); } 
	#layout_portfolio_8 .row-md4 .thk-col:nth-of-type(1) { width: calc((100% / 2 ) - 1.875rem); } 
}
@media screen and (max-width:1024px){
	#layout_portfolio_8 .portfolio8_category a { margin-right:1.875rem; } 
	#layout_portfolio_8 .portfolio8_category a:last-of-type { margin-right:0; } 
	#layout_portfolio_8 .thk-row { margin-right:-1.25rem; } 
	#layout_portfolio_8 .row-md4 .thk-col { width: calc((100% / 2 ) - 1.25rem); margin-right:1.25rem; } 
	#layout_portfolio_8 .row-md4 .thk-col:nth-of-type(1) { width: calc((100% / 2 ) - 1.25rem); } 
}

/*----------------------------------------------------------------------
@ INPUT BASIC
----------------------------------------------------------------------*/
.form input[type=text], .form input[type=password] { width:100%;  height:3.75rem; padding:0.625rem 1.25rem ;border:1px solid #ddd;font-size:1rem; border-radius:3px; box-sizing:border-box;}
.form select { 	font-size:1rem; font-weight:400; color:#333; width:100%; height:3.75rem; padding-left:20px; background:url(/images/common/icon_select_arrow.png) no-repeat ; background-position:calc(100% - 20px) 50%; background-color:#fff;  background-size:12px;  border:1px solid #ddd; border-radius:3px; } 
.form textarea { border:1px solid #ddd; border-radius:3px; padding:1.25rem; width:100%; box-sizing:border-box; font-size:1rem; } 

.form ::-webkit-input-placeholder { color: #aaa; font-size:1rem; font-weight:300; } /* Chrome/Opera/Safari */
.form ::-moz-placeholder { color: #aaa; font-size:1rem; font-weight:300;  }  /* Firefox 19+ */
.form ::-ms-input-placeholder { color: #aaa; font-size:1rem; font-weight:300;  } /* IE 10+ */
.form ::-moz-placeholder { color: #aaa; font-size:1rem; font-weight:300;  } /* Firefox 18- */

.form { display:flex; justify-content:space-between; align-items:center; margin-right:-1.25rem; }
.form .form_row { flex:0 0 auto; width:calc((100% / 1) - 1.25rem); margin-right:1.25rem; } 
.form.two .form_row { width:calc((100% / 2) - 1.25rem); } 
.form.three .form_row { width:calc((100% / 3) - 1.25rem); } 

.form_row { width:100%; display:block;margin-bottom:0.9375rem; position:relative;  }
.form_row > label {display:block;color:#333; font-size:1rem; line-height:2rem; padding-bottom:5px; font-weight:500; cursor:pointer; }
.form_row label .need { position:relative; }
.form_row label .need:after { position:absolute; top:-10px;  content:'*'; color:red; margin-left:5px;  } 

.form_row .icon { position:absolute !important; right:5px; bottom:15px;  }

.form .form_group { display:flex; justify-content:space-between;align-items:center; } 
.form .form_group.two label, .form .form_group.two input, .form .form_group.two select { width:calc(50% - 0.625rem) !important; } 
.form .form_group.three label, .form .form_group.three input, .form .form_group.three select { width:calc(33% - 0.625rem) !important; } 
.form .form_group.four label, .form .form_group.four input, .form .form_group.four select { width:calc(25% - 0.625rem) !important; } 

.form .form_row input[type="radio"] {display:none;}
.form .form_row input[type="radio"] + label { font-weight:400 !important; line-height:1 !important; cursor:pointer; margin-right:0.5rem; } 
.form .form_row input[type="radio"] + label span.check { position:relative; display:inline-block;width:18px;height:18px;margin-top:-2px;margin-right:10px;vertical-align:middle; border:1px solid #999; border-radius:50%; cursor:pointer;}
.form .form_row input[type="radio"]:checked + label { } 
.form .form_row input[type="radio"]:checked + label span.check:after { content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:10px; height:10px; border:5px solid #38aae1; /*background:#929ca2;*/ border-radius:50%; } 

.form .form_row input[type="checkbox"] {display:none;}
.form .form_row input[type="checkbox"] + label { font-weight:400 !important; line-height:1 !important; cursor:pointer; margin-right:0.5rem; } 
.form .form_row input[type="checkbox"] + label span.check { position:relative; display:inline-block;width:18px;height:18px;margin-top:-2px;margin-right:10px;vertical-align:middle; border:1px solid #999; cursor:pointer;}
.form .form_row input[type="checkbox"]:checked + label {  } 
.form .form_row input[type="checkbox"]:checked + label span.check:after { 	content:'done';position:absolute; left:50%; top:calc(50% - 3px); transform:translate(-50%,-50%);  font-family:'Material Icons'; font-size:30px; font-weight:600; color:#000; }

/*----------------------------------------------------------------------
@ Layout Contact 4 
----------------------------------------------------------------------*/
#layout_contact_4 { position:relative; display:flex; align-items:center; justify-content:center; padding-top:7.5rem; padding-bottom:7.5rem; background:#16181e; } 
#layout_contact_4 .container { width:100%; max-width:1170px; margin:0 auto; }

#layout_contact_4 .contact4_title_wrap { text-align:left; margin-bottom:3.75rem; } 
#layout_contact_4 .contact4_title { font-size:1.875rem; color:#fff; font-weight:700; line-height:1.2; letter-spacing:0rem; } 
#layout_contact_4 .contact4_summ { position:relative; font-size:1rem; color:#999; font-weight:400; line-height:1.875; padding-top:1.563rem; margin-top:1.563rem; word-break:keep-all; } 
#layout_contact_4 .contact4_summ:after { content:''; position:absolute; top:0rem; left:0; width:10.625rem; height:2px; background:#38aae1; } 

#layout_contact_4 .location_addr {margin-top:3.125rem;} 
#layout_contact_4 .location_addr .addr_row { font-size:1rem; color:#fff; font-weight:500;  margin-bottom:2.5rem; } 
#layout_contact_4 .location_addr .addr_row:last-of-type { margin-bottom:0rem; }
#layout_contact_4 .location_addr .addr_row b { display:block; color:#fff; letter-spacing:0; margin-bottom:8px; } 

#layout_contact_4 .form .form_row { margin-bottom:1.25rem; } 
#layout_contact_4 .form .form_text { margin-bottom:0.625rem !important; } 
#layout_contact_4 .form .form_row > label { display:none; } 
#layout_contact_4 .form .form_tag label { font-size:0.875rem; color:#999; } 

#layout_contact_4 .form input[type=text], 
#layout_contact_4 .form input[type=password] { font-size:0.875rem; color:#fff; border:1px solid #444957; background:transparent;  }
#layout_contact_4 .form textarea { font-size:0.875rem; color:#fff; height:12.5rem; border:1px solid #444957; background:transparent; } 
#layout_contact_4 .form ::-webkit-input-placeholder { color: #999; font-size:0.875rem; font-weight:300; } /* Chrome/Opera/Safari */
#layout_contact_4 .form input[type=text]:focus,
#layout_contact_4 .form input[type=password]:focus,
#layout_contact_4 .form select:focus,
#layout_contact_4 .form textarea:focus {border-color:#38aae1 !important; box-shadow: 0 0 0.2rem 0.25rem rgba(0, 0, 0, 0.03); }
#layout_contact_4 .form .form_row input[type="checkbox"] + label span.check { border:1px solid #444957; } 

#layout_contact_4 .contact4_btn { position:relative; text-align:center; margin-top:2px; } 
#layout_contact_4 .contact4_btn a { display:; font-size:1rem; color:#fff; font-weight:600; letter-spacing:0; padding:1rem 3.125rem; background:#38aae1; border-radius:3px; transition:all 0.3s ease; } 
#layout_contact_4 .contact4_btn a:hover { color:#333; } 
#layout_contact_4 .contact4_btn a:after { background:#fff; } 
#layout_contact_4 .contact4_btn .material-icons { font-size:20px; margin-right:5px; }

/* Responsive */
@media screen and (max-width:1200px){
	#layout_contact_4 { padding-top:5rem; padding-bottom:5rem; } 
	#layout_contact_4 .container { margin:0 15px; } 
}
@media screen and (max-width:1024px){
	#layout_contact_4 { padding-top:4rem; padding-bottom:4rem; } 
}
@media screen and (max-width:768px){
	#layout_contact_4 .row-md2 .thk-col { width: calc((100% / 1) - 1.875rem); } 
	#layout_contact_4 .row-md2 .thk-col:last-of-type { margin-top:1.563rem; } 
}

.btn_cmm1 { text-align:center; } 
.btn_cmm1.two { display:flex;justify-content:space-around;  } 

.btn_cmm1 a { position:relative; overflow:hidden; display:block; padding:0.75rem 1.25rem; color:#fff; background:var(--menu); font-size:0.938rem; z-index:2; margin-right:5px; box-sizing:border-box;} 
.btn_cmm1 a:last-of-type{ margin-right:0px; } 

.btn_cmm1.two a { width:calc(100% / 2); display:inline-block; } 

.btn_cmm1 a span { z-index:1; } 
.btn_cmm1 a span:after { z-index:-1; opacity:0; height:100%; content:''; position:absolute; background:#fff; transform:skewX(-45deg); left:-50%; top:0px; transition:all .4s cubic-bezier(.42,0,.58,1); width:0px;  border-radius:0px; } 
.btn_cmm1 a:hover span:after { opacity:0.5; width:100%; left:200%; }

.btn_cmm1 a:hover { color:#fff; } 
.btn_cmm1 a:after { z-index:-1; opacity:0; height:102%; content:''; position:absolute; background:var(--bgC2); transform:skewX(-45deg); left:-100%; top:0px; transition:all .3s cubic-bezier(.42,0,.58,1); width:100%;  border-radius:0px; } 
.btn_cmm1 a:hover:after { opacity:1; width:220%; }

/* out-line */
.btn_cmm2 { text-align:center;  } 
.btn_cmm2.two { display:flex;justify-content:space-around;  } 

.btn_cmm2 a { position:relative; overflow:hidden; display:block; padding:0.75rem 1.25rem; color:var(--menu); border:1px solid var(--menu); background:none; font-size:0.938rem; z-index:2; margin-right:5px; box-sizing:border-box;} 
.btn_cmm2 a:last-of-type{ margin-right:0px; } 

.btn_cmm2.two a { width:calc(100% / 2); display:inline-block; } 

.btn_cmm2 a:hover { color:#fff; } 
.btn_cmm2 a:after { z-index:-1; opacity:0; height:100%; content:''; position:absolute; background:var(--bgC2); transform:skewX(-45deg); left:-100%; top:0px; transition:all .3s cubic-bezier(.42,0,.58,1); width:100%;  border-radius:0px; } 
.btn_cmm2 a:hover:after { opacity:1; width:220%; }