/* reset */
html,body,div,p,ul,li,dl,dt,dd,em,i,span,a,img,input,h1,h2,h3,h4,h5 {margin:0;padding:0}
a,img,input {border:none;}
body{font: 14px/1.75  -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;-webkit-tap-highlight-color: rgba(0,0,0,0);}
a {text-decoration:none;}
a:active{filter:brightness(1.1)}
ul,li{list-style: none}
a, img {-webkit-touch-callout: none; /* 禁止长按链接与图片弹出菜单，根据需要选择是否删除 */}
html, body {
    -webkit-user-select: none;   /* 禁止选中文本（如无文本选中需求，此为必选项） */
    user-select: none;
}
table{border-collapse:collapse;border-spacing:0}
td,th,ul,ol{padding:0}
em{font-style: normal;}
b{font-weight: normal;}
/* reset end */
html {
  font-size: 50px;/* 兼容不支持vw的系统 */
  font-size: 13.33333333vw;/* 7.5rem === 100vw */
}

@media (max-width: 1024px) {
  html,body {
    max-width: 1024px;
  }
}
/* hid */
.hid{text-indent:-999em;font-size:0;overflow:hidden;width:0;height:0;display:block}
/* foot */
#afooter{background-color: #191219;text-align: center;font-size:.22rem;padding:.2rem 0;}
#afooter, #afooter a{color: #c0c0c0;text-decoration: none;}

/* spr */
.spr{display:block; width:0; height:0; background:url(//game.gtimg.cn/images/lol/act/a20191010invitation/spr.png) no-repeat; background-size:10rem 10rem;}
.tett {top: 2.8rem;}

/* basic */
/* html{width:100%; height:100%;overflow:hidden;} */
html,body,.wrapper{width:100%; height:100%;background: #dfd9c9;position: relative;overflow:hidden;}
.container,.video-con{position:absolute; width:100%; height:100%; top:0; left:0; overflow:hidden;}
.load-con{z-index:40; background:#e6e48b;}
.kv-con{z-index:30; background:url(//game.gtimg.cn/images/lol/act/a20191010invitation/bg1.png) no-repeat center center;background-size: 100% 16.24rem;;position: relative;}
.letter-con{z-index:20;background:url(//game.gtimg.cn/images/lol/act/a20191010invitation/bg2.jpg) no-repeat center center;background-size: 100% 16.24rem;}
.landing-con{z-index:10; background:#857fda;}
.video-con{z-index:-1;}
.kv-video{width: 100%;height: auto;}

/* load-con */
.load-con{width: 100%;height: 100%;background: url(//game.gtimg.cn/images/lol/act/a20191010invitation/loading-bg.jpg) no-repeat left top;background-size: 100% 14.96rem;background-color: #dfd9c9;}
.show-load-perc {width: 100%;height: .3rem;margin-top: 5rem;text-align: center;line-height: .3rem;font-size: .4rem;color: #e7c15d;}
.btn-play-kv {width: 3.42rem;height: .78rem;display: block;background: url(//game.gtimg.cn/images/lol/act/a20191010invitation/paly-btn.png) no-repeat;background-size: 100% 100%;margin: 2.38rem auto 0;opacity: 0;transform: translateY(-1rem);}

/* kv-con */
/* letter-con */
.btn-play-letter{font-size:1rem; position:absolute;}
.input-tel{-webkit-appearance:none; -moz-appearance:none; appearance:none; color:#000; font-size:0.26rem; line-height:0.34rem; text-align:center; border:none; border-radius:0; outline:none; background-position:0 0; width:4.18rem; height:0.34rem;  margin:0rem auto 0.08rem;width: 5.5rem;height: .63rem;opacity: 0;}
.error-tip{color:#de441b; font-size:0.2rem; line-height:0.28rem; height:0.28rem; text-align:center; margin-bottom:0.26rem; pointer-events:none;}
.error-tip.red::before{content:'（'}
.error-tip.red::after{content:'）'}
.btn-submit-test{width:4.04rem; height:0.82rem; background-position:0 -1rem; margin:0 auto; font-size:0; text-indent:-999em; overflow:hidden;opacity: 0;}
/* .kv-video{position: absolute;top: 50%;left: 0;transform: translateY(-50%);} */

/* letter */
.info-box{width: 100%;height: 2.5rem;position: absolute;z-index: 2;top: 62%;left: 0;}
.letter-video-box {width: 100%;height: 100%;position: absolute;z-index: 15;background:url(//game.gtimg.cn/images/lol/act/a20191010invitation/bg2.jpg) no-repeat center center;background-size: 100% 16.24rem;top: 0;left: 0;}
.video-boxs{top: .26rem;}

/* landing-con */
.landing-con{width: 100%;height: 16.24rem;background: url(//game.gtimg.cn/images/lol/act/a20191010invitation/bg3.jpg) no-repeat;background-size: 100% 16.24rem;top: 50%;transform: translateY(-50%);}
.mail-box{width: 7.5rem;height: 11.87rem;display: block;background: url(//game.gtimg.cn/images/lol/act/a20191010invitation/mail-box.png) no-repeat;background-size: 100% 100%;overflow: hidden;margin: 2.1rem auto 0;}
.mail-title{width: 3.1rem;height: 1.11rem;display:block;background-position: -6.89rem -.01rem;margin: 2.4rem auto 0;}
.mail-text-dear{width: 100%;height: .53rem;text-align: center;font-size: .2rem;color: #626b7b;line-height: .65rem;display: block;}
.mail-user-name{width: 3rem;height: .59rem;display: block;background-position: -.79rem -2.3rem;margin: 0 auto;text-align: center;line-height: .59rem;font-size: .3rem;color: #ffffff;}
.mail-user-name p{width: 1.4rem;height: 100%;margin: 0 auto;overflow: hidden;}
.mail-text-invitation{width: 100%;height: .6rem;display: block;line-height: .42rem;font-size: .2rem;color: #626b7b;text-align: center;}
.mail-subtitle{width: 4.64rem;height: .62rem;display: block;background-position: -.01rem -3.29rem;margin: 0 auto .3rem;}
.site-box{width: 5.4rem;height: .45rem;margin: 0 auto;font-size: 0;line-height: 0;border-bottom: .01rem dashed #c9ccd1;}
.site-box i{width: .31rem;height: .32rem;display: inline-block;background-position: -9.53rem -2.62rem;vertical-align: middle;margin-right: .2rem;}
.site-box p{display: inline-block;font-size: .26rem;color: #626b7b;vertical-align: middle;margin-right: .1rem;}
.site-box span{display: inline-block;font-size: .2rem;color: #deaf4f;vertical-align: middle;}
.time-box{width: 5.4rem;height: .74rem;margin: 0 auto;font-size: 0;border-bottom: .01rem dashed #c9ccd1;padding-top: .1rem;position: relative;}
.time-icon{width: .29rem;height: .29rem;display: block;float: left;background-position: -9.57rem -3.18rem;}
.time-text {height: .29rem;line-height: .29rem;margin-left: .55rem;font-size: 0;margin-bottom: .08rem;}
.time-text span{font-size: .22rem;color: #626b7b;display: inline-block;vertical-align: middle;margin-right: .1rem;}
.time-text b{font-size: .34rem;vertical-align: middle;display: inline-block;color: #626b7b;}
.time-text i{width: .17rem;height: .11rem;display: inline-block;background-position: -9.04rem -2.81rem;vertical-align: middle;margin: 0 .05rem;font-size: .24rem;color: #626b7b;}
.time-text p{display: inline-block;font-size: .24rem;color: #626b7b;vertical-align: middle;}
.arrow-icon {width: .12rem;height: .1rem;display: block;background-position: -9.65rem -3.57rem;position: absolute;bottom: -.15rem;left: 50%;transform: translateX(-50%);}
.tips-box{width: 100%;height: 2.94rem;}
.tips-title{width: 3.97rem;height: .86rem;display: block;background-position: -.01rem -4.28rem;margin: 0 auto .15rem;}
.tips-list{width: 5.6rem;height: auto;margin: 0 auto;}
.tips-list li{width: 100%;height: auto;font-size: .2rem;color: #626b7b;line-height: .28rem;margin-bottom: .12rem;text-indent: -.2rem;padding-left: .2rem;}
.tips-list li b{font-weight: bold;}
.lol-icon {width: 2.25rem;height: .45rem;display: block;background-position: -7.63rem -1.75rem;margin: 0 auto;}

/* keyframs */
.btn-play-kv.btnshow {transform: translateY(0);opacity: 1;transition: all 1s ease;}
.input-tel.up-show {animation: upShow 1s ease both;}
.btn-submit-test.up-show {animation: upShow 1.2s ease both}
.input-tel.dowm-hid {animation: dowmHid 1.2s ease both}
.btn-submit-test.dowm-hid {animation: dowmHid 1s ease both;}

@keyframes upShow {
  0% {transform: translateY(5rem);opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}
@-webkit-keyframes upShow {
  0% {transform: translateY(5rem);opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}

@keyframes dowmHid {
  0%{transform: translateY(0);opacity: 1;}
  100%{transform: translateY(5rem);opacity: 0;}
}
@-webkit-keyframes dowmHid {
  0%{transform: translateY(0);opacity: 1;}
  100%{transform: translateY(5rem);opacity: 0;}
}/* #t6Hl8#DD267D7003BA14170000F97F7E64BAD9 */