.intro_wrap{display:flex; height:100vh;}
.intro_wrap > a{display:block; width:50%; height:100%; position:relative; overflow: hidden;}
.intro_wrap .intro_bg{width:100%; height:100%;}
.intro_wrap .intro_lt .intro_bg{background:url("/images/intro/intro_lt_bg.jpg") no-repeat center / cover;}
.intro_wrap .intro_rt .intro_bg{background:url("/images/intro/intro_rt_bg.jpg") no-repeat center / cover;}
.intro_wrap .intro_txt{position:absolute; width:100%; height:100%; z-index:10; left: 0; bottom:100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap:40px; background: #FFE533; opacity: 0; transition: all 1.3s ease-out; box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);}
.intro_wrap .intro_txt.on{bottom:0; opacity: 1;}
.intro_wrap .intro_txt em{font-size: 24px; font-weight: 600; position:relative; opacity: 0; transition: all 1s ease-out; transition-delay:1.3s; transform:translateY(-20px);}
.intro_wrap .intro_txt em:before{content:''; display:block; width:1px; height: 150px; background: #000; position:absolute; left:50%; transform:translateX(-50%); top:-190px; z-index:20;}
.intro_wrap .intro_txt .logo{width: 448px; opacity: 0; transition: all 1s ease-out; transition-delay:1.5s; transform:translateY(-20px);}
.intro_wrap .intro_txt .logo img{width:100%;}
.intro_wrap .intro_txt span{display:inline-block; font-size: 18px; font-weight: 500; padding: 10px 25px; border-radius: 40px; border: 1px solid #000; opacity: 0; transition: all 1s ease-out; transition-delay:1.7s; transform:translateY(-20px);}
.intro_wrap .intro_txt span i{display:inline-block; vertical-align:middle; width: 20px; height: 20px; background:url("/images/intro/go_link_ic_b.svg") no-repeat center / 100%; margin-top:-5px;}

.intro_wrap .intro_txt em.on{opacity:1; transform:translateY(0);}
.intro_wrap .intro_txt .logo.on{opacity:1; transform:translateY(0);}
.intro_wrap .intro_txt span.on{opacity:1; transform:translateY(0);}

.intro_wrap .intro_rt .intro_txt{background: #000; color:#fff; gap:25px;}
.intro_wrap .intro_rt .intro_txt em:before{background: #fff;}
.intro_wrap .intro_rt .intro_txt .logo{width:561px;}
.intro_wrap .intro_rt .intro_txt span{border-color:#fff;}
.intro_wrap .intro_rt .intro_txt span i{background-image:url("/images/intro/go_link_ic.svg");}


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

.intro_wrap .intro_txt{gap:3.13vw;}
.intro_wrap .intro_txt em{font-size: 1.88vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt em:before{height: 11.72vw; top:-14.84vw;}
.intro_wrap .intro_txt .logo{width: 30.00vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt span{font-size: 1.41vw; padding: 0.78vw 1.95vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt span i{width: 1.56vw; height: 1.56vw; margin-top:-0.39vw;}

.intro_wrap .intro_rt .intro_txt{gap:1.95vw;}
.intro_wrap .intro_rt .intro_txt .logo{width:38.83vw;}

}


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

.intro_wrap{flex-direction:column; height:100vh;}
.intro_wrap > a{width:100%; height:50%;}

.intro_wrap .intro_txt{gap:4.83vw;}
.intro_wrap .intro_txt em{font-size: 3.26vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt em:before{height: 12.72vw; top:-16.84vw;}
.intro_wrap .intro_txt .logo{width: 48.98vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt span{font-size: 3.13vw; padding: 0.98vw 3.95vw; transform:translateY(-1.56vw);}
.intro_wrap .intro_txt span i{width: 3.26vw; height: 3.26vw; margin-top:-0.9vw;}

.intro_wrap .intro_rt .intro_txt{gap:3.95vw;}
.intro_wrap .intro_rt .intro_txt .logo{width:67.84vw;}


}