@charset "utf-8";
/* CSS Document */

*, body, input, textarea, input:before, input:after {
    -webkit-user-select: auto  !important;
    -khtml-user-select: auto  !important;
    -moz-user-select: auto  !important;
    -ms-user-select: auto  !important;
    user-select: auto  !important;
}

/* °øÅë */
	#wrap{font-family:"roboto", "NotoSans", sans-serif}
		.scroll-up01, .scroll-up02, .scroll-up03, .scroll-up04, .scroll-up05,
		.scroll-right01, .scroll-right02, .scroll-right03, .scroll-a,
		.scroll-left01, .scroll-left02, .scroll-left03{opacity:0}

/* Çì´õ */
	#head{width:100%;height:90px;position:fixed;top:0;z-index:10}
	#head .inner{display:flex}
	#head .inner > div{width:80%;display:flex;align-items:center}
	#head .inner > div.nav{width:20%}
		#head .logo{height:100px;width:270px}
		#head .logo a{display:block;width:100%;height:100%}
		#head .logo img{padding:22px 0 0 7px}
		#head .menu{margin:-3px 0 0 50px}
		#head .menu li{display:inline-block}
		#head .menu a{padding:20px;display:block}
		#head .menu a:hover{opacity:0.6}
			#head .pointmenu{position:relative;top:-3px}
			#head .pointmenu a{padding:11px 25px 9px 30px !important}
			#head .pointmenu a:hover{opacity:1}
				#head .menu-study{display:none;margin:2px 90px 0 0}
				#head .menu-study.off{display:none}
		#head .nav{float:right;justify-content:flex-end;padding:0 7px 12px}
		#head .nav img{position:relative;top:3px;left:5px}
		#head .nav a:hover{opacity:0.5}
	#head .menu a, #head .menu a:hover, #head .nav a, #head .nav a:hover{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
	#head .logo a, #head .menu a{cursor:url(../img/cursor-pointer.png), pointer}

/* Çì´õ(½ºÆ¼Å°) */
	#head.on{height:70px}
		#head.on .logo{height:80px}
		#head.on .logo img{transform:scale(85%, 85%);padding:12px 0 0 7px}
	#head, #head.on, #head .logo, #head.on .logo, #head .logo img, #head.on .logo img, #head.on .menu-bt-wrapper, #head .menu-bt-wrapper{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
		.sticky{position:sticky;z-index:3;top:70px;left:0;width:100%;height:3px;margin-top:-3px;background:#4a3232}

/* Çì´õ(¸ð¹ÙÀÏ) */
	#head .menu-bt-wrapper{display:none;z-index:15;position:fixed;top:6px;right:10px;padding:10px 7px;background:rgba(0,0,0,0);cursor:pointer}
	#head.on .menu-bt-wrapper{top:0}
		.menu-bt{width:60px;height:45px;display:block;position:relative;padding:10px;box-sizing:border-box}
		.menu-bt-line{float:right;position:relative;height:3px;width:100%;background:#4a3232;transition:all .3s ease-in-out;-webkit-transform-origin:left center;-moz-transform-origin:left center;-ms-transform-origin:left center;-o-transform-origin:left center; transform-origin:left center;}
		.menu-bt-line1{top:0}
		.menu-bt-line2 {width:70%;top:11px;opacity:1}
		.menu-bt-line3 {top:22px}
		.menu-open .menu-bt .menu-bt-line1{left:5px;transform: rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform: rotate(45deg)}
		.menu-open .menu-bt .menu-bt-line2{opacity:0}
		.menu-open .menu-bt .menu-bt-line3{left:5px;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform: rotate(-45deg)}
	#mbmenu{display:none;z-index:7;position:fixed;top:0;left:0;width:100%;height:100vh}
	#mbmenu > div{width:100%;height:100%}
	#mbmenu ul{position:absolute;top:50%;left:0;width:100%;transform:translate(0, -50%);margin-top:40px}
	#mbmenu li{padding:0 50px}
	#mbmenu li:first-child a{border:none}
	#mbmenu li a{display:block;font-size:22px;padding:20px 10px 18px;cursor:url(../img/cursor-pointer.png), pointer;border-top:1px solid rgba(0,0,0,0.1)}
	#mbmenu li a:hover{opacity:0.5}
		#mbmenu li.mmsr{margin-top:20px}
		#mbmenu li.mmsr a{background:#4a3232;color:#fedd01;border:none;border-radius:5px}
		#mbmenu li.mmsr a img{position:relative;top:2px;left:2px}
		#mbmenu li.mmlo a{border:none;text-align:right;font-family:"roboto", "NotoSans", sans-serif;font-weight:500;font-size:16px;color:#4a3232}
		#mbmenu li.mmlo a img{position:relative;top:2px;left:4px}
	#mbmenu li a, #mbmenu li a:hover{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}

/* ǪÅÍ */
	#foot .info{height:90px;position:relative;top:-45px;padding-top:30px}	
	#foot .text{margin-top:-5px}
	#foot .text li{display:inline-block;padding:0 10px;margin:0 5px}
	#foot .text li a:hover{opacity:0.6}
	#foot .text > p{padding:20px 0 40px;line-height:28px}
	#foot .text > p span{padding:0 8px}
		.topbtn{z-index:5;display:none;position:fixed;bottom:20px;right:21px;width:55px;height:55px;line-height:56px}
		.topbtn a{display:block;color:#fff;position:relative;left:1px}
		.topbtn:hover a{color:#fedd01}
		.topbtn:hover{animation:on-motion 1s ease-in-out infinite}
			@keyframes on-motion{
				0%{bottom:20px}
				50%{bottom:30px}
				100%{bottom:20px}
			}
	#foot .text li, #foot .text li a:hover, .topbtn a, .topbtn:hover a{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}

/* ÀͽºÆ˾÷ */
	#expopup{display:none;z-index:30;position:fixed;top:0;left:0;width:100%;height:100vh}
	#expopup > div{display:none;height:400px;padding-top:10px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
	#expopup div{width:100%}
	#expopup div img{position:absolute;top:20px;right:20px;cursor:pointer}
	#expopup div img.illu{top:0;right:auto;left:30px;cursor:default}
	#expopup div h5{margin-top:50px}
	#expopup div p{margin:5px 0 50px}
	#expopup div ul{width:100%}
	#expopup div ul li{width:47%;margin:0 1.5%}
		#expopup .popup02{height:360px}
		#expopup .popup02 p{margin:30px 0}

/* ¸ÞÀÎ(¹è³Ê) */
	.mainbn{width:100%;height:100vh;}
		.swiper{width:100%;height:95%;top:5%}
		.swiper-slide{display:flex;justify-content:center;align-items:center;background-size:cover !important;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center}
		.swiper-slide1{background:url(../img/main-bg1.jpg) no-repeat center center}
		.swiper-slide2{background:url(../img/main-bg2.jpg) no-repeat center center}
		.swiper-slide3{background:url(../img/main-bg3.jpg) no-repeat center center}
		.swiper-pagination-progressbar{height:7px !important;top:auto !important;bottom:0;background:rgba(255,255,255,0.2)}
		.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{--swiper-theme-color:#fad406}
		.swiper-button-next, .swiper-button-prev{color:rgba(255,255,255,0.5) !important}
		.swiper-button-next:hover, .swiper-button-prev:hover{color:#fff !important}
		.swiper-button-next:after, .swiper-button-prev:after{font-size:30px}
		.swiper-button-next, .swiper-button-prev, .swiper-button-next:hover, .swiper-button-prev:hover{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
			.swiper-slide p{width:100%;max-width:1700px;padding:0 170px;line-height:50px;opacity:0;position:absolute;top:40%;left:50px}
			.swiper-slide-active p{opacity:1;left:0}
			.swiper-slide p, .swiper-slide-active p{-webkit-transition:all 1.25s ease-in-out;-moz-transition:all 1.25s ease-in-out;-ms-transition:all 1.25s ease-in-out;-o-transition:all 1.25s ease-in-out;transition:all 1.25s ease-in-out}
			/* .swiper-slide1 p{bottom:250px}
			.swiper-slide3 p{top:250px} */

/* ¸ÞÀÎ(¿µ»ó) */
	.mainvideo{padding:100px 0 120px;position:relative}
	.mvtab{padding:25px 0}
		.mvtab li{display:inline-block;padding:0 5px;margin:0 20px}
		.mvtab li.on{color:#4a3232;box-shadow:inset 0 -15px 0 #fedd01;cursor:default}
		.mvtab li:hover{color:#4a3232}
			.mvtab li, .mvtab li.on, .mvtab li:hover{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
		.mvcont li{display:none;position:relative;top:30px}
		.mvcont li.on{display:block;top:0}
		.mvcont button{display:block;cursor:pointer;margin:0 auto;background:rgba(0,0,0,0)}
		.mvcont img{width:100%;max-width:956px}

/* ¸ÞÀÎ(Æ÷ÀÎÆ®:ŸÀÌƲ) */
	.mainpoint .num{width:75px;height:75px;line-height:77px;display:inline-block}
		.mptitle{height:120px;display:flex;justify-content:center;align-items:center;position:relative}
		.mptitle:after{clear:both;display:block;content:'';position:absolute;bottom:-15px;left:50%;margin-left:-20px;width:40px;height:40px;background:#4a3232;transform:rotate(45deg)}
		.mptitle p{padding:5px 30px 0}
			.mpcont > div{border-top:none}
			.mpcont h3 span{box-shadow:inset 0 -30px 0 #80d4ff;padding:0 3px}
			.mpcont p.cp{margin:30px 0 27px}

/* ¸ÞÀÎ(Æ÷ÀÎÆ®:1~5) */
	.mpcont .p1{padding:150px 0}
	.mpcont .p1 h3{margin:30px 0 30px}
	.mpcont .p1 h5{margin:25px 0 20px}
	.mpcont .p1 li{width:230px}
	.mpcont .p1 .just li > div{width:180px;height:180px;margin:0 20px;padding:28px 0 0 3px;background:#fff}
	.mpcont .p1 .just li > div div{width:30px;height:30px;line-height:32px;margin-bottom:15px}
	.mpcont .p1 .icon li{position:relative}
	.mpcont .p1 .icon li:after{clear:both;display:block;content:'';position:absolute;top:50%;right:0;margin:-36px -18px 0 0;width:36px;height:36px;background:url(../img/main-p1-plus.png) no-repeat center center;background-size:cover}
	.mpcont .p1 .icon li:last-child:after{display:none}
	.mpcont .p1 .icon li p{margin-top:5px}
	.mpcont .p1 .icon li img{width:100%;max-width:126px}
		.mpcont .p2 li{width:50%}
		.mpcont .p2 li img{width:100%;border-radius:300px 0 0 0}
		.mpcont .p2 li:nth-child(1){z-index:0}
		.mpcont .p2 li:nth-child(2){z-index:1;padding-left:80px}
		.mpcont .p2{position:relative}
		.mpcont .p2 .num{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:78px;height:78px;line-height:75px;border:4px solid #fff}
	.mpcont .p3{position:relative;margin-top:60px}
	.mpcont .p3 .pointstiker{position:absolute;top:0;left:50%;transform:translate(-50%, -50%);margin-top:-100px}
	.mpcont .p3 li{width:50%}
	.mpcont .p3 li:first-child{justify-content:end;z-index:1;padding-right:80px}
	.mpcont .p3 li img{width:100%}
	.mpcont .p3 ul{position:relative}
	.mpcont .p3 ul .num{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:78px;height:78px;line-height:75px;border:4px solid #fff}
	.mpcont .p3 > p{margin:75px 0 70px}
	.mpcont .p3 > p img{margin:0 20px;position:relative;top:-3px}
	.mpcont .p3 > img{width:100%;border-radius:0 0 300px 0}
		.mpcont .p4{margin:150px 0}
		.mpcont .p4 .num{margin-bottom:50px}
		.mpcont .p4 > img{width:100%;margin:50px 0 30px;border-radius:300px 0 0 0}
		.mpcont .p4 a{margin:0 10px}
	.mpcont .p5{padding:50px 0 200px}
	.mpcont .p5 h3{margin:40px 0}
	.mpcont .p5 .backline{width:100%;height:2px;background:#4a3232;margin-top:130px}
	.mpcont .p5 .just{margin-top:-90px}
	.mpcont .p5 .imgbox{width:100%;margin-top:40px}
	.mpcont .p5 .imgbox li img{width:100%}
	.mpcont .p5 .imgbox li:nth-child(1){width:45%}
	.mpcont .p5 .imgbox li:nth-child(2){width:10%;z-index:1}
	.mpcont .p5 .imgbox li:nth-child(2) img{max-width:59px;position:relative;left:20px;top:-150px}
	.mpcont .p5 .imgbox li:nth-child(3){width:45%}
	.mpcont .p5 .imgbox li:nth-child(3) img{position:relative;top:-5px}

/* Àͽº */
	@media(-ms-high-contrast: none), (-ms-high-contrast: active) {
		.swiper-slide p{opacity:1}
		#expopup{display:block}
		#expopup .popup02{display:flex}
	}

/* ¹ÝÀÀÇü */
	@media(max-width:1400px){
		#head{height:80px}		
		#head .inner{padding:0}
		#head .inner > div{width:50% !important}
		#head .logo{height:80px;width:270px}
		#head .logo img{width:148px;padding:15px 0 0 7px}
		#head.on{height:65px;box-shadow:0px 2px 5px rgb(0 0 0 / 4%)}
		#head.on .logo{height:65px}
		#head.on .logo img{padding:7px 0 0 7px}
		#head .nav{padding:0}
		#head .menu, #head .nav a{display:none}
		#head .menu-study, #head .menu-study a{display:block}
		#head .menu-bt-wrapper{display:block;top:4px;right:5px}
		#head.on .menu-bt-wrapper{top:-3px}
			.sticky{display:none}
		.swiper-slide p{text-align:center}
		.mpcont .p5 .text-justify{text-align:left}
		.mpcont .p5 .imgbox{align-items:flex-start}
		.mpcont .p5 .imgbox li:nth-child(2){visibility:hidden}
	}
	@media(max-width:1150px){
		.swiper-slide p{padding:0 100px;line-height:38px;left:0}
			.mpcont{padding:0}
			.mpcont > div{border:none}		
		.mpcont .p1{padding:110px 0}
		.mpcont .p1 h3{margin:25px 0 20px}
		.mpcont .p1 h5{margin:20px 0 15px}
		.mpcont .p1 li{width:205px}
		.mpcont .p1 .just li > div{width:160px;height:160px}
			.mpcont .p3 .pointstiker{margin-top:-100px}
			.mpcont .p3 .pointstiker img{width:200px}
		.mpcont .p4{margin:110px 0}
		.mpcont .p4 .num{margin-bottom:30px}
			.mpcont .p5{padding:20px 20px 200px}
			
	}
	@media(max-width:900px){
		#head .logo{width:220px}
		#head .logo img{width:130px;padding:20px 0 0 7px}
		#head.on .logo img{padding:12px 0 0 7px}
		#head .menu-bt-wrapper{top:6px}
		#head.on .menu-bt-wrapper{top:0}
			.menu-bt{width:55px}
			.menu-bt-line{height:3px}
			.menu-bt-line2 {top:9px}
			.menu-bt-line3 {top:18px}
			.menu-open .menu-bt .menu-bt-line1{left:4px}
			.menu-open .menu-bt .menu-bt-line3{left:4px}
		#head .menu-study{display:none !important}
		#foot .info{height:auto;top:-35px;padding:20px 0 19px}
		#foot .text{margin-top:-5px}
		#foot .text li{margin:0;font-size:16px}
		#foot .text > p{padding:20px 0 40px;font-size:14px;line-height:24px}
			.topbtn{bottom:7px;right:7px;width:50px;height:50px;line-height:51px}
			.topbtn a{font-size:14px}
			.topbtn:hover a{color:#fff}
			.topbtn:hover{animation:no-motion}

		#expopup > div{width:90%}

		.mainbn{height:75vh}
		.swiper{height:75vh;top:0;margin-top:75px}
			.swiper-button-next, .swiper-button-prev{display:none}
			.swiper-slide1{background-position:55% 50%}
			.swiper-slide2{background-position:70% 50%}
			.swiper-slide3{background-position:65% 50%}
			.swiper-slide p{padding:0 30px}
		.mainvideo{padding:60px 0 70px}
			.mvtab{padding:20px 0}
			.mvtab li{padding:0 2px;font-weight:400}
		.mptitle{height:80px}
		.mptitle:after{bottom:-10px;margin-left:-15px;width:30px;height:30px}
		.mptitle p{font-size:20px;padding:2px 15px 0;font-weight:400}
			.mpcont h3 span{box-shadow:inset 0 -25px 0 #80d4ff}
			.mainpoint .num{width:60px !important;height:60px !important;line-height:62px !important}
		.mpcont .p1{padding:80px 20px}
		.mpcont .p1 > p{text-align:justify}
		.mpcont .p1 .just{display:block;margin:0 auto}
		.mpcont .p1 .just li{float:left;width:25%;margin:10px 0}
		.mpcont .p1 .just li > div{width:150px;height:150px;margin:0 auto;padding:30px 0 0 3px}
		.mpcont .p1 .just li > div div{width:25px;height:25px;line-height:27px;margin-bottom:5px}
		.mpcont .p1 .icon{display:block;margin:0 auto}
		.mpcont .p1 .icon li{float:left;width:25%;margin:10px 0}
		.mpcont .p1 .icon li img{width:140px}
		.mpcont .p1 .icon li:after{display:none}
			.mpcont .p2{text-align:center}
			.mpcont .p2 ul{flex-direction:column}
			.mpcont .p2 li{width:100%;flex:1}
			.mpcont .p2 li:nth-child(1){order:2;order:-ms-2}
			.mpcont .p2 li:nth-child(2){order:1;order:-ms-1;padding-left:0;margin-bottom:40px}
			.mpcont .p2 li img{border-radius:150px 0 0 0}
			.mpcont .p2 li p:not(.cp){text-align:justify}
			.mpcont .p2 .num{position:relative;top:0;left:0;transform:translate(0, 0);border:none;margin:50px 0 30px}
		.mpcont .p3{margin-top:80px}
		.mpcont .p3 .pointstiker{display:none}
		.mpcont .p3 ul{flex-direction:column}
		.mpcont .p3 ul div{order:2}
		.mpcont .p3 ul div.num{order:1;position:relative;top:0;left:0;transform:translate(0, 0);border:none;margin:50px auto 30px !important}
		.mpcont .p3 li{width:100%;flex:1;text-align:center;display:flex;flex-direction:column}
		.mpcont .p3 li:first-child{justify-content:center;padding-right:0}
		.mpcont .p3 li img{margin-top:40px}
		.mpcont .p3 li p:last-child{text-align: justify}
		.mpcont .p3 > p{margin:30px auto 25px}
		.mpcont .p3 > p img{display:block;text-align:center;margin:20px auto}
		.mpcont .p3 > img{border-radius:0 0 100px 0}
			.mpcont .p4 > img{margin:40px 0 30px;border-radius:100px 0 0 0}
			.mpcont .p4 ul{display:block}
			.mpcont .p4 p:not(.cp){text-align:justify}
			.mpcont .p4 a{margin:0 auto 15px}
		.mpcont .p5{padding:10px 20px 100px}
		.mpcont .p5 h3{margin:25px 0 20px}
		.mpcont .p5 .backline{display:none}
		.mpcont .p5 .just{margin-top:0}
		.mpcont .p5 .imgbox{margin-top:20px;padding:0}
		.mpcont .p5 .imgbox li:nth-child(1){width:48%;margin-right:2%}
		.mpcont .p5 .imgbox li:nth-child(2){display:none}
		.mpcont .p5 .imgbox li:nth-child(3){width:48%;margin-left:2%}

		.scroll-up01, .scroll-up02, .scroll-up03, .scroll-up04, .scroll-up05,
		.scroll-right01, .scroll-right02, .scroll-right03, .scroll-a,
		.scroll-left01, .scroll-left02, .scroll-left03{opacity:1 !important;transform: matrix(1, 0, 0, 1, 0, 0) !important}
	}
	@media(max-width:600px){
		#head .logo{width:100%}
		#mbmenu li{padding:0 35px}
		#foot .info{padding:10px 0 9px}
		#foot .info p{font-size:18px;line-height:28px}
		.mpcont .p1 .icon{max-width:330px}
		.mpcont .p1 .icon li{width:50%}
		.mpcont .p1 .just{max-width:330px}
		.mpcont .p1 .just li{width:50%}
		.mpcont .p5 .imgbox{display:block}
		.mpcont .p5 .imgbox li{margin:50px auto}
		.mpcont .p5 .imgbox li:nth-child(1){width:100%;margin-right:0}
		.mpcont .p5 .imgbox li:nth-child(3){width:100%;margin-left:0}
		#expopup div img.illu{width:120px}
	}