/* 인코딩: utf-8 */

html, body { background-color: white; }
.wrap { max-width: 1920px; margin: 0 auto; overflow: hidden; min-width: 320px; }
.wrap .center-wrap { position:relative; max-width: 1280px; margin: 0 auto; }	/* 가운데 고정폭 영역 */
.wrap .center-wrap2 { max-width: 1720px; margin: 0 auto; }	/* 가운데 고정폭 영역 */
.wrap .sub-left-wrap { width: 25.2%; }	/* sub 왼쪽 영역 */
.wrap .sub-right-wrap { width: 72%; }	/* sub 오른쪽 영역 */

.wrap .mainMenuWrap { position:relative; z-index:999999999; padding:0 100px; background-color:#2e3192; transition:0.25s all }
.wrap .mainLogo { width: 40%; padding:33px 0 }
.wrap .mainMenu { float:right; width: 60%; }
.wrap .mainSitemap { display:none }

.wrap .bannerWrap {
	height: auto;
	position: relative;
	overflow: hidden;
}

.wrap .mainSlogan { position:absolute; top:calc(50% - 145px); z-index:99; width:100% }
.slogan-ti, .slogan-txt { color:#fff; text-align:center; transition:0.25s all }
.slogan-ti { font-size:60px; line-height:1.3em }
.slogan-txt { margin-top:35px; font-size:25px; font-weight:500 }

.wrap .mainBanner {
	width: 1820px;
	height: 750px;
	position: relative;
	margin-left:100px;
	z-index: 9;
}

#mainSlider div.navi {
	bottom: 12.5%;
	text-align: center;
	width: 100%;
	margin-right: inherit;
}
.wrap .mainBG { position:absolute; left:0; top:-100px; z-index:0; width:100%; height:100%; background-color:#2e3192 }

.con-padd { padding:100px 0 }
.con-ti { margin-bottom:50px; font-size:40px; font-weight:700; text-align:center }

.wrap .contentsProduct { position:relative }
.lst-m-prd li { position:relative; text-align:left }
.lst-m-prd li a { height:100%; color:#222 }
.prd-info { position:absolute; bottom:-0; z-index:99; width:90%; padding-top:25px; background-color:#fff; transition:0.3s all }
.prd-eng { font-size:14px; font-weight:600; color:#333399; letter-spacing:5px; transition:0.3s all }
.prd-ti { font-size:24px; font-weight:700; transition:0.3s all }
.prd-txt { margin-top:15px; font-size:16px; color:#444; transition:0.3s all }
.prd-btn { margin-top:50px }
.prd-bg { position:relative; transition:0.3s all; background-color:#000; overflow:hidden }
.prd-bg-img { position:relative; transform:scale(1); transition:transform 0.6s linear }
.lst-m-prd li a:hover .prd-bg-img {
	opacity:0.7;
	transition:0.5s all;
	transform:scale(1.1);             /*  default */
	  -webkit-transform:scale(1.1);     /*  크롬 */
	  -moz-transform:scale(1.1);       /* FireFox */
	  -o-transform:scale(1.1);
}
.lst-m-prd li a:hover .btn-white { border:1px solid #222 }

.wrap .contentsQuick { background:url(/img/quick-bg.jpg) no-repeat center center; background-size:cover }
.quick-wrap .con-ti { margin-bottom:15px }
.quick-wrap .lst-flex { margin-top:50px }
.quick li a:hover .quick-ti { color:#00aeef }
.quick-ti { margin-top:25px; font-size:20px; font-weight:500; color:#fff; transition:0.3s all }

.wrap .contentsQuick {  }
.gallery-ti { margin-top:15px; font-size:20px; font-weight:500; transition:0.3s all }
.gallery-wrap .page-btn { margin-top:50px }

.wrap > .copyright { background-color:#333; color:#999 }
.copy-link, .copy-wrap { padding:50px 0 }
.copy-link { border-bottom:1px solid #515151 }
.copy-link a { color:#fff }
.copy-link a + a { margin-left:35px }
.copy { margin:10px 0; padding:0; font-size:0 }
.copy li { position:relative; display:inline-block; padding-left:55px }
.copy li span { position:absolute; left:0; font-size:500; color:#fff }
.copy li + li { margin-left:55px }

.wrap .subBannerWrap {
	position: relative;
	background-color:#2e3192
}
.wrap .subBanner {
	width: 1820px;
	height: 250px;
	margin: 0 auto;
	position: relative;
	margin-left: 100px;
	z-index: 99;
}
.subBanner-ti { position:absolute; z-index:100; top:calc(50% - 32px); width:100%; text-align:center; font-size:40px; font-weight:600; color:#fff }

.wrap .contentsSubWrap { min-height: 450px; }
.wrap .subMenu { border-bottom:1px solid #ccc }
.wrap .contentsSub { margin-top:50px }
.sub-page-ti { font-size:30px; font-weight:700 }

#mmenu-icon { display: none; }

/* center-wrap width */
@media only screen and (max-width: 1280px) {
	.wrap .center-wrap { padding-left:25px; padding-right:25px }
	.wrap .mainMenuWrap { padding:0 25px }
	.wrap .bannerWrap { overflow: visible; }
	.wrap .mainBanner {
		width: 142.1875vw;			/* = 1920(image width) * 100 / 1024(site width) */
		height: auto;
		margin: 0 auto;
		position: relative;
		left: 50%;
		margin-left: -71.0937vw;	/* = width / 2 */
	}

	.wrap .subBanner {
		width: 142.1875vw;			/* = 1920(image width) * 100 / 1024(site width) */
		height: auto;
		left: 50%;
		margin-left: -71.0937vw;	/* = width / 2 */
	}

	.con-padd { padding:40px 0 }
	.con-ti { margin-bottom:20px; font-size:27px }

	.prd-info { padding-top:15px }
	.prd-eng { font-size:13px; letter-spacing:2.5px }
	.prd-ti { font-size:18px; font-weight:500 }
	.prd-txt { margin-bottom:25px; font-size:15px }
	.prd-btn { margin-top:15px }

	.quick-ti, .gallery-ti { font-size:15px }
	.quick-wrap .lst-flex, .gallery-wrap .page-btn { margin-top:25px }
	.quick-ti { margin-top:15px }

	.copy-link, .copy-wrap { padding:25px 0 }
	.copy-link a + a { margin-left:25px }
	.copy li + li { margin-left:35px }
}

/* Laptop */
@media only screen and (max-width: 1024px) {
	.wrap .mainLogo { width: 50%; padding:15px 0 }
	.wrap .mainLogo img { width:150px }
	.wrap .mainMenu { width: 50%; }
	.wrap .mainSitemap { display:none }
	.slogan-ti { font-size:5.5vw }
	.slogan-txt { font-size:2.7vw }

	#mainMenuMobile { background-color:#333 !important }
	.nav-title-wrap { height:55px; border-bottom:0 !important }
	.nav-title { display:none }
	.nav-close { top:10px !important; right:15px !important }
	nav.mobileMenu ul li { text-align:center !important }
	/* nav.mobileMenu > ul { border-top:1px solid rgba(255,255,255,0.1) }
	nav.mobileMenu > ul > li { border-bottom:1px solid rgba(255,255,255,0.1) } */
	nav.mobileMenu .nav-item-wrapper { padding:13px !important }
	nav.mobileMenu .nav-item-wrapper span { font-size:16px; color:#fff }
	nav.mobileMenu .nav-item-wrapper span.nav-next { display:none }
	nav.mobileMenu .has-children.opened > .nav-item-wrapper span { font-weight:600 }
	nav.mobileMenu .menu-sub2 { padding-left:0 !important; background-color:transparent !important }
	nav.mobileMenu > .menu-sub2 > .nav-item-wrapper { padding:5px !important }
	nav.mobileMenu .has-children.opened .menu-sub2 span { color:#999 }

	#mmenu-icon {
		display: inline-block;
		color: #fff;
		background-color: none;
		position: relative;
		float: right;
		text-align: left;
		font-size: 1.0em;
		border-radius: 5px;
		margin-top:15px;
		right: -30px;
	}
	.hamburger { padding:0 }
	.hamburger-box { position:relative; width:27px; height:25px }
	.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width:27px; height:3px; background-color:#fff; border-radius:5px }
	.hamburger-inner::before { top:-8px }
	.hamburger-inner::after { bottom:-8px }
	#mainMenu { display: none !important; }

	.subBanner-ti { top:calc(50% - 20px); font-size:25px }
	.wrap .contentsSub { margin-top:25px }
	.sub-page-ti { font-size:20px }
}

/* UIKit m-size */
@media only screen and (max-width: 960px) {
}

/* Tablet */
@media only screen and (max-width: 768px) {
	.con-ti { font-size:22px }
	.prd-txt { display:none }
	.quick li img { width:40px }
}

/* Mobile */
@media only screen and (max-width: 540px) {
	.wrap .mainSlogan { top:calc(50% - 60px) }
	.slogan-txt { margin-top:15px }

	.subBanner-ti { top:calc(50% - 16px); font-size:20px }
	.sub-page-ti { font-size:18px }

	.con-padd > .lst-3 li { width:100%; margin-top:15px }

	.copy-link, .copy-wrap { padding:15px 0 }
	.copy li { display:block }
	.copy li + li { margin-left:0 }

	#subMenuMobile { display: block !important; }
	#subMenu { display: none !important; }
}