.intro{width: 100%; height: 100vh; display: flex;}
.intro > div{width: 50%;}
.intro > div a{display: block; position: relative; width: 100%; height: 100%;}
.intro > div a:before{content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0; transition: all 0.3s; background: rgba(0, 0, 0, 0.80);}
.intro .left{background: url("/img/intro/intro_img1.jpg") no-repeat center / cover; }
.intro .right{background: url("/img/intro/intro_img2.jpg") no-repeat center / cover;}
.intro .txt{text-align: center; position: absolute; transition: all 0.3s; top: 15%; left: 50%; transform:translateX(-50%); width: 100%;}
.intro .left .txt{color: #FC8A07;}
.intro .right .txt{color: #8BEEBF;}
.intro .txt em{font-size: 25px; font-family: 'GmarketSansBold';}
.intro .txt strong{font-size: 70px; font-family: 'BlackHanSans'; display: block; color: #FFF; margin-top: 25px; line-height: 1;}
.intro .txt p{margin-top: 40px; font-size: 25px; font-weight: 700; font-family: 'GmarketSansBold';}
.intro > div a:hover::before{opacity: 1;}
.intro > div:hover .txt{transform: translate(-50%,-50%); top: 50%;}
.white{color: #fff;}



@media screen and (max-width:1280px){

	.intro .txt em{font-size: 1.95vw;}
	.intro .txt strong{font-size: 5.47vw; margin-top: 1.95vw;}
	.intro .txt p{margin-top: 3.13vw; font-size: 1.95vw;}

}



@media screen and (max-width:768px){

	.intro{display: block;}
	.intro > div{width: 100%; height: 50%;}
	.intro .txt{top: 10%;}
	.intro .txt em{font-size: 3.26vw;}
	.intro .txt strong{font-size: 9.11vw; margin-top: 3.26vw;}
	.intro .txt p{margin-top: 4.21vw; font-size: 3.65vw;}
	.intro > div a:hover::before{opacity: 0;}
	.intro > div:hover .txt{transform: translateX(-50%); top: 10%;}

}