@charset "utf-8";



/* intro */
intro{position: relative; display: flex; align-items:center; justify-content: center; width: 100%; height: 100vh;}
intro video{position: absolute; width: 100%; height: 100%; object-fit:cover; left: 0; top: 0;}
intro .link-box{display: flex; justify-content: center; align-items:center; text-align: center; max-width:1480px; width: 100%; box-sizing: border-box; padding: 0 20px; justify-content: space-between;}
intro .link-box > a{position: relative; max-width: 620px; width: 100%; height: 580px; display: flex; flex-direction: column; justify-content: center;  align-items:center; border-radius: 30px; border: 1px solid rgba(255, 255, 255, 0.30); background: rgba(222, 222, 222, 0.06); backdrop-filter: blur(20px); transition:.3s; overflow: hidden;}
intro .link-box > a:before{position: absolute; content: ''; width: 10%; height: 10%; border-radius: 50%; right: -10%; bottom: -10%; background: rgba(37, 101, 158, 1); opacity: 0; transition:.8s; z-index: -1;}
intro .link-box > a:last-child:before{background: #EB766C;}
intro .link-box > a p{color: #FFF; text-align: center; font-size: 40px; font-weight: 400; line-height: 160%; }
intro .link-box > a p b{display: block; font-size: 50px; font-weight: 700; line-height: 120%; margin-top: 2px;}
intro .link-box > a > span{display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 50px; background: #25659E; width: 243px; height: 70px; color: #FFF; text-align: center; font-size: 24px; font-weight: 700; line-height: 160%; margin-top: 60px; transition:.3s;}
intro .link-box > a:last-child > span{background: #EB766C;}
intro .link-box > a:hover{
	&:before{width: 50%; height: 50%; scale:10; right: 0; bottom: 0; opacity: 1;}
	> span{background: #fff; color: #25659E; text-align: center;}	
}
intro .link-box > a:last-child:hover{
 > span{background: #fff; color: #EB766C;}
}

/* intro */
/* main */
#main{width: 100%; overflow: hidden;}