@charset "utf-8";

/* font */
html {font-size:62.5%;}
body,
body * {font-family:-apple-system, BlinkMacSystemFont,"Malgun Gothic",sans-serif;-webkit-font-smoothing: antialiased;word-wrap:break-word;word-break:keep-all;}

.logo {padding-top:10rem;margin-bottom:2rem;}
.logo img {max-width:100%;}

.intro-wrap {position:relative;width:100%;min-height:100vh;overflow:hidden;}
.intro-inwrap {width:1400px;margin:0 auto;max-width:calc(100% - 80px);position:relative;z-index:1;min-height:100vh;padding-bottom:150px;}
.intro-inwrap:before {content:"";opacity:0;transition:all 1.5s;transition-delay:.5s;position:absolute;right:-60px;top:0;bottom:0;display:block;width:100%;height:100%;background:url(/share/img/intro/bg-valve.png) no-repeat right center;background-size:auto 100%;}
.pageLoad .intro-inwrap:before {right:-100px;opacity:1;}

.intro-bgSld {position:absolute;top:0;left:0;width:100%;height:100%;}
.intro-bgSld .swiper-slide {width:100%;height:100%;background-repeat:no-repeat;background-position:right top;background-size:cover;}
.intro-bgSld .swiper-slide.sld01 {background-image:url(/share/img/intro/bg01_220427.jpg);}
.intro-bgSld .swiper-slide.sld02 {background-image:url(/share/img/intro/bg02.jpg);}
.intro-bgSld-pagination {padding-top:5rem;}
.intro-bgSld-pagination .swiper-pagination-bullet {width:30px;height:30px;position:relative;opacity:1;background:none;}
.intro-bgSld-pagination .swiper-pagination-bullet:after {content:"";position:absolute;top:50%;left:50%;margin:-5px 0 0 -5px;display:block;width:10px;height:10px;background:#fff;border-radius:50%;}
.intro-bgSld-pagination .swiper-pagination-bullet-active:before {content:"";position:absolute;top:50%;left:50%;margin:-15px 0 0 -15px;display:block;width:30px;height:30px;border:1px solid #fff;border-radius:50%;}

.intro-txtSld {margin-bottom:3rem;overflow:hidden;}
.intro-txtSld p {color:#fff;font-family: 'GmarketSans', sans-serif;letter-spacing:-0.06em;}
.intro-txtSld .btxt {font-size:4rem;font-weight:600;letter-spacing:-0.08em;line-height:130%;opacity:0;transition:all .3s;}
.intro-txtSld .stxt {color:rgba(255, 255, 255, 0.8);font-size:2rem;line-height:140%;opacity:0;transition:all .3s;}
.intro-txtSld .swiper-slide-active .btxt {animation:txtSldAni 1s;animation-delay:.3s;animation-fill-mode: forwards;}
.intro-txtSld .swiper-slide-active .stxt {animation:txtSldAni 1s;animation-delay:.5s;animation-fill-mode: forwards;}

	@keyframes txtSldAni {
		from {
			transform:translate(0, 80px);
		}
		to {
			transform:none;
			opacity:1;
		}
	}

.homepageLink-wrap {max-width:960px;margin-bottom:1.5rem;position:relative;z-index:1;opacity:0;transition:all 1s;transition-delay:.3s;}
.pageLoad .homepageLink-wrap {opacity:1;}
.homepageLink {width:33.33%;height:80px;padding:0 120px 0 60px;border-radius:10px 0 10px 0;box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);background:rgba(28, 41, 67, 0.9);position:relative;transition:all .3s;
display: -ms-flexbox; 
display: flex;
-ms-flex-align: center;
align-items: center;
}
.homepageLink:before {content:"";position:absolute;top:50%;right:60px;margin-top:-17px;display:block;width:34px;height:34px;background:url(/share/img/intro/homepageIcon.svg) no-repeat center center;background-size:100%;}
.homepageLink span {font-size:1.5rem;color:#fff;font-family: 'GmarketSans', sans-serif;letter-spacing:-0.02em;}

/* intro-mn */
.intro-mn {opacity:0;transition:all 1s;transition-delay:.3s;max-width:640px;box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);border-radius:10px 0 10px 0;overflow:hidden;
display: -ms-flexbox; display: flex;-ms-flex-align: stretch;align-items: stretch;-ms-flex-wrap: wrap; flex-wrap: wrap;}
.pageLoad .intro-mn {opacity:1;}
.intro-mn li {width:50%;}
.intro-mn li a {display:block;width:100%;height:100%;padding:40px 120px 40px 60px; border-right:1px solid #011a4b; border-bottom:1px solid #011a4b;
				background:rgba(0, 40, 117, 0.9);transition:all .3s;position:relative; display: -ms-flexbox; display: flex;-ms-flex-align: center; align-items: center;-ms-flex-wrap: wrap; flex-wrap: wrap;}
.intro-mn li:nth-child(2n){border-right:none;}
.intro-mn li:nth-child(3n){border-bottom:none;}
.intro-mn li a span {display:block;width:100%;color:#fff;font-family: 'GmarketSans', sans-serif;font-size:1.5rem;letter-spacing:-0.02em;line-height:140%;font-weight:500;}
.intro-mn li a:before {content:"";position:absolute;top:50%;right:60px;margin-top:-17px;display:block;width:34px;height:34px;}
.intro-mn li:last-child{border-right:none; border-bottom:none;}
.intro-mn li.ebook a:before {background:url(/share/img/intro/ebook.png) no-repeat center center;background-size:100%;}
.intro-mn li.video a:before {background:url(/share/img/intro/videoIcon.svg) no-repeat center center;background-size:100%;}
.intro-mn li.pdf a:before {background:url(/share/img/intro/pdfIcon.svg) no-repeat center center;background-size:100%;}

/* intro-mn2 */
.intro-mn2 {max-width:1200px; box-shadow:5px 10px 10px rgba(0, 0, 0, 0);}
.intro-mn2 li {width:30%;}
.intro-mn2 li a {padding:24px 105px 24px 50px; border-bottom:1px solid #011a4b;}
.intro-mn2 li a:before {right:45px;}
.intro-mn2 li:nth-child(3n) a {border-right:1px solid #011a4b;}
.intro-mn2 li:last-child a{border-radius:0 0 10px 0; border-top:none; border-left:none;}
/* .intro-mn li:nth-child(-n+4) a {border-bottom:1px solid #011a4b;} */
/* .intro-mn li:nth-child(4n) a {border-left:1px solid #011a4b;}
.intro-mn li:nth-child(5n) a {border-bottom:1px solid #011a4b;}
.intro-mn li:nth-child(6n) a {border-right:1px solid #011a4b; border-bottom:1px solid #011a4b;}
.intro-mn li:nth-child(7n) a {border-bottom:1px solid #011a4b; box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);}
.intro-mn li:nth-child(8n) a {border-left:none; box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);}
.intro-mn li:nth-child(9n) a {border-right:1px solid #011a4b; box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);}
.intro-mn li:nth-child(10n) a {box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1); border-radius:0 0 10px 0;} */


.footer {width:100%;position:absolute;bottom:40px;left:0;}
.footer .flogo {width:130px;height:24px;margin-left:-15px;margin-bottom:1.5rem;background:url(/share/img/intro/logo_footer.svg) no-repeat center center;}
.footer .copyright {color:#fff;font-size:1rem;font-family: 'Nanum Gothic',sans-serif;}


/* ie 사용 경고창 */
.ieAlert {position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;}
	
	@media screen and (min-width:1270px){
		.intro-mn2 li {width:25%;}
		
	}
	@media screen and (min-width:1200px){
		.homepageLink:hover,
		.homepageLink:focus {background:rgba(11, 94, 255, 0.9)}
		.intro-mn li a:hover,
		.intro-mn li a:focus {background:rgba(11, 94, 255, 0.9);border-color:rgba(11, 94, 255, 0.9);box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1);}
		.intro-mn li a:nth-child(-3n+4):hover,
		.intro-mn li a:nth-child(-3n+4):focus {box-shadow:5px -10px 10px rgba(0, 0, 0, 0.1);}
	}
	@media screen and (max-width:1000px){
	
		.intro-inwrap:before {display:none;}

		.homepageLink {padding:0 100px 0 40px;}
		.homepageLink:before {right:40px;}
		.homepageLink-wrap2 {max-width:100%;}
		.homepageLink2 {width:100%;}

		.intro-mn li a {padding:40px 100px 40px 40px;}
		.intro-mn li a::before {right:40px;}
		.intro-mn2 li {width:50%;}
		.intro-mn li:nth-child(8) a {border-bottom: 1px solid #011a4b;}
	}
	@media screen and (max-width:820px){
		
		.intro-inwrap {padding-bottom:220px;}

		.logo {padding-top:6rem;}

		.intro-bgSld .swiper-slide {background-position:left bottom;background-size:auto 100%;}
		
		.intro-txtSld {margin-bottom:5rem;}
		.intro-txtSld .btxt {font-size:3.5rem;}
		.intro-txtSld .btxt br {display:none;}
		.intro-txtSld .stxt {font-size:1.8rem;}
		
		.homepageLink-wrap {max-width:100%;}
		.homepageLink {width:100%;}

		.intro-mn {border-radius:10px;}
		.intro-mn li {width:50%;}
		.intro-mn li:nth-child(1) a {border-right: 1px solid #011a4b;}
		.intro-mn li:nth-child(3n) a {border-right:1px solid #011a4b; border-bottom:1px solid #011a4b;}
		.intro-mn li:last-child a{border-top:none; border-left:none;}
		.intro-mn2 li:nth-child(2n) a {border-right:none;}
		.intro-mn2 li:nth-child(9) a {border-bottom:none;}
		.intro-mn2 li:nth-child(10) a {border-bottom:none;}
		/* .intro-mn li:nth-child(1){order:1;-ms-flex-order: 1;}
		.intro-mn li:nth-child(1) a {border-right: 1px solid #011a4b;border-bottom: 1px solid #011a4b;}
		.intro-mn li:nth-child(2){order:3;-ms-flex-order: 3;}
		.intro-mn li:nth-child(2) a {border-right: 1px solid #011a4b;border-bottom: 1px solid #011a4b;}
		.intro-mn li:nth-child(3){order:5;-ms-flex-order: 5;}
		.intro-mn li:nth-child(3) a {border-right: 1px solid #011a4b;}
		.intro-mn li:nth-child(4){order:2;-ms-flex-order: 2;}
		.intro-mn li:nth-child(4) a {border-bottom: 1px solid #011a4b;border-left:none;}
		.intro-mn li:nth-child(5){order:4;-ms-flex-order: 4;}
		.intro-mn li:nth-child(5) a {border-bottom: 1px solid #011a4b;}
		.intro-mn li:nth-child(6){order:6;-ms-flex-order: 6;}
		.intro-mn li:nth-child(8) a {border-left: 1px solid #011a4b;}
		.intro-mn li:nth-child(9) a {border-right: 1px solid #011a4b; border-bottom: 1px solid #011a4b;} */
		.intro-mn {box-shadow:5px 10px 10px rgba(0, 0, 0, 0); border-radius:none;}
		.intro-mn li:nth-child(2){box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1); border-radius:0 0 10px 0;}
		.intro-mn li:nth-child(3){box-shadow:5px 10px 10px rgba(0, 0, 0, 0.1); border-radius:0 0 10px 0;}

		.intro-mn.single li{width:100%;}
		.intro-mn.single li:nth-child(2) a{border-bottom:1px solid #011a4b}
		.intro-mn.single li a{padding:20px 25px 20px 25px;}
		.intro-mn.single li a:before{right:30px; left:auto; top:50%; margin-top:-12px;}
	}
	@media screen and (max-width:600px){
		
		.homepageLink {padding:0 80px 0 25px;border-radius:10px;}
		.homepageLink:before {right:30px;width:22px;height:22px;margin-top:-11px;}

		.intro-mn li a {padding:20px 25px 55px 25px;}
		.intro-mn li a:before {right:auto;top:auto;left:30px;bottom:20px;width:22px;height:22px;}
	}
	@media screen and (max-width:500px){
		
		.intro-mn2 li a.mn_t{padding-top:3px;}
		.intro-txtSld .btxt {font-size:2.6rem;}
		.intro-txtSld .stxt {font-size:1.5rem;}
	}
	@media screen and (max-width:420px){
		
		.logo {text-align:center;}
		.logo img {width:200px;}

		.intro-inwrap {max-width:calc(100% - 40px);padding-bottom:150px;}
		
		.intro-bgSld-pagination {display:none;}

		.intro-txtSld {margin-bottom:3rem;}
		.intro-txtSld p {text-align:center;}
		.intro-txtSld .btxt {font-size:2rem;padding:0 30px;}

		.footer .flogo {margin-left:auto;margin-right:auto;background-size:100%;}
		.footer .copyright {text-align:center;}

		
	}