@import "https://oss.starxw.com/fileadmin/static/font/misans/misans.css";
@font-face{font-family:'icon';src:url('//s4.zstatic.net/ajax/libs/remixicon/4.2.0/remixicon.woff2');}
i{font-family:icon;font-style:normal;font-weight:normal;}
*{user-select:none;box-sizing:border-box;font-family:'misans', '微软雅黑';}
body{margin:0;background:#E8F5FF;}
a{color:#1E9FFF;text-decoration:none;cursor:default;}
a:hover{text-decoration:underline;}
a:active{text-decoration:underline;opacity:.8;}

.intros{position:fixed;inset:0;left:10px;right:calc(50vw + 50px);width:fit-content;height:fit-content;margin:auto;z-index:2;text-align:center;}
.intros img{width:170px;height:170px;margin-bottom:20px;background:#1E9FFF;border-radius:15px;}
.intros .title{font-size:3.5em;font-weight:bold;}
.intros .intro{margin:0;padding-left:.1em;letter-spacing:.1em;font-size:1.2em;}
.intros button{transition:all .5s;font-weight:bold;font-size:1.3rem;background:#1E9FFF;border:0;outline:none;color:white;border-radius:10px;padding:10px 40px;box-shadow:0 8px 25px -8px #1E9FFF3D;margin-top:35px;}
.intros button:hover{background:#1C97F2;}
.intros button:active{background:#1B8FE5;color:#DCE1E5;transform:scale(.95);}
.intros .links{margin-top:20px;}
.intros .links a{display:inline-block;margin:0 10px;}

.images{position:fixed;inset:0;left:calc(50vw - 200px);height:100%;margin:auto;z-index:1;max-width:calc(100vh - 100px);}
.images img{transform:translateX(80px);object-fit:contain;width:100%;position:absolute;inset:0;margin:auto 0;border:25px solid #323232;border-radius:10px;box-shadow:0 0 15px 0 white;transition:all .2s;background:#323232;box-shadow:0 8px 25px -8px #0000003D;}
.images img:hover{transform:translateX(10px) scale(1.05)!important;}

.fadeIn{opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s;}
.fadeIn.show{opacity:1;transform:none;}
.images.fadeIn{transform:translateX(120px);}
.images.fadeIn.show{transform:translateX(100px);}

@media screen and (max-width: 700px){
    .images{display:none;}
    .intros{left:0;right:0;}
}