html{ width:100%; height:100%; font-size:100%; background:#333333;}
body{ font-family:Microsoft Yahei, arial; line-height:100%; margin:0px; padding:0px; width:100%; height:100%; margin:0 auto; background:#161616; color:#000000;}
img{ width:100%; height:auto; border:0px;}
form{ margin:0px; padding:0px;}
ul,li{ margin:0; padding:0; list-style-type:none;}
input,select,textarea{ font-size:1rem; padding:1% 0; font-family:Microsoft Yahei;}
a{ color:#000000; text-decoration:none;}
.remark{ color:#999999;}
.msg{ color:#ff0000; font-size:0.9rem;}
.clear{ clear:both;}
.st{ font-family:SimSun;}

/*****Public*****/
.loading{ width:1.8rem; height:1.8rem; margin:1rem auto; clear:both; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/FuEXfsboxpgFFph.png) center no-repeat; background-size:80% auto; text-align:center; animation:rotate 1s linear infinite;}
@-webkit-keyframes rotate{
	from{ transform:rotate(0deg);}
	to{ transform: rotate(360deg);}
}

.template{ display:none;}

.wrap{ width:100%; height:auto; min-height:100%; clear:both; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/xEsrwgboxphaafn.jpg) top center no-repeat #161616; background-size:100% auto;}
.wrap-over{ height:100%; overflow:hidden;}
.wrap-pic{ position:absolute; left:-200%; top:0;}
.header{ width:100%; height:11rem; margin:0 auto; padding-top:0; clear:both; position:relative;}
.popup{ width:100%; height:100%; clear:both; position:fixed; top:0; left:0; z-index:1000; background:rgba(255,255,255,0.5);}
.popup-cot{ width:92%; height:92%; clear:both; position:fixed; top:4%; left:4%; background:#000000; border-radius:0.5rem; -webkit-border-radius:0.5rem; -moz-border-radius:0.5rem; -webkit-box-shadow:0 0 40px rgba(0,0,0,0.5); -moz-box-shadow:0 0 40px rgba(0,0,0,0.5); box-shadow:0 0 40px rgba(0,0,0,0.5); overflow:hidden;}
.popup-cot .close{ width:2.4rem; height:2.4rem; clear:both; position:absolute; top:0.1rem; right:0.1rem; z-index:10; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/IiLFdFboxpgFFoB.png) center no-repeat; background-size:60% auto; text-align:center; cursor:pointer;}
.popup-cot .tit{ width:100%; height:2.5rem; margin:0 auto; padding-top:1.3rem; clear:both; text-align:center; font-size:0; line-height:0; overflow:hidden;}
.popup-cot .tit img{ width:120%; height:auto; margin-left:-10%;}
.popup-cot .screen{ width:95%; height:1.8rem; margin:0 auto; padding:1rem 0; clear:both; display:flex;}
.popup-cot .screen .li{ width:20%; height:1.8rem; line-height:1.8rem; margin:0 0.3rem; float:left; background:#000000; border:1px solid #666666; box-sizing:border-box; border-radius:2rem; -webkit-border-radius:2rem; -moz-border-radius:2rem; text-align:center; font-size:0.8rem; color:#ffffff; cursor:pointer;}
.popup-cot .screen .li-on{ background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/NicKcbboxpgFFpb.png) left center no-repeat; background-size:auto 100%; border:0; color:#1d005a;}
.popup-cot .explain{ width:92.5%; height:1.7rem; margin:0 auto; clear:both; font-size:0.7rem; color:#999999;}
.popup-cot .cot{ width:100%; height:calc(100% - 7.6rem); margin:0 auto; clear:both; overflow-y:auto; position:relative;}
.popup-cot .cot-card{ height:calc(100% - 9.3rem);}
.popup-cot .cot-pic{ height:calc(100% - 0rem); font-size:0; line-height:0;}
.popup-cot .cot .role{ width:96%; height:auto; margin:0 auto; padding:0 0 0 0; clear:both; overflow:hidden;}
.popup-cot .cot .role .li{ width:10.7rem; height:13.6rem; margin:0 0.4rem 0.8rem 0.4rem; float:left; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/vyXNWEboxpgFFkn.png) center bottom no-repeat; background-size:100% auto; position:relative;}
.popup-cot .cot .role .li .pic{ width:100%; height:7.5rem; margin:0 auto; clear:both; font-size:0; line-height:0; border-radius:0.4rem; -webkit-border-radius:0.4rem; -moz-border-radius:0.4rem; overflow:hidden;}
.popup-cot .cot .role .li .pic img{ width:100%; height:100%;}
.popup-cot .cot .role .li .txt{ width:88%; height:auto; margin:0 auto; padding-top:0.7rem; clear:both;}
.popup-cot .cot .role .li .txt .rtit{ width:100%; height:auto; clear:both; font-size:1.15rem; color:#ffffff;}
.popup-cot .cot .role .li .txt .rtit .rtit-cn{ padding-right:0.5rem;}
.popup-cot .cot .role .li .txt .rtit .rtit-en{ font-size:0.9rem; text-transform:uppercase;}
.popup-cot .cot .role .li .txt .rexp{ width:100%; height:auto; padding-top:0.4rem; clear:both;}
.popup-cot .cot .role .li .txt .rexp .reli{ width:100%; height:auto; clear:both; font-size:0.7rem; color:#999999; line-height:150%;}
.popup-cot .cot .role .li .but{ width:3.4rem; height:1.25rem; clear:both; position:absolute; bottom:0.5rem; right:0.5rem; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/MiGrrBboxpgFFyw.png) center no-repeat; background-size:100% 100%; font-size:0; line-height:0; cursor:pointer;}
.popup-cot .cot .card{ width:96%; height:auto; margin:0 auto; padding:0 0 0 0; clear:both; overflow:hidden;}
.popup-cot .cot .card .li{ width:6.85rem; height:auto; margin:0 0.4rem 1rem 0.4rem; float:left; position:relative;}
.popup-cot .cot .card .li .pic{ width:100%; height:10.6rem; margin:0 auto; clear:both; font-size:0; line-height:0; border-radius:0.4rem; -webkit-border-radius:0.4rem; -moz-border-radius:0.4rem; overflow:hidden;}
.popup-cot .cot .card .li .pic img{ width:100%; height:100%;}
.popup-cot .cot .card .li .txt{ width:100%; height:10.6rem; margin:0 auto; clear:both; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/RQnpNqboxpgFFtx.png) center no-repeat; background-size:100% 100%;}
.popup-cot .cot .card .li .txt .ctit{ width:80%; height:2rem; line-height:2rem; margin:0 auto; clear:both; border-bottom:1px solid #3d3a45; text-align:center; font-size:0.9rem; color:#ffffff;}
.popup-cot .cot .card .li .txt .ccot{ width:80%; height:calc(100% - 3.5rem); margin:0.4rem auto 0 auto; padding:0 5%; clear:both; overflow-y:auto; font-size:0.7rem; color:#cccccc; line-height:140%;}
.popup-cot .cot .card .li .but{ width:3.4rem; height:1.25rem; margin:0.5rem auto 0 auto; clear:both; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/MiGrrBboxpgFFyw.png) center no-repeat; background-size:100% 100%; font-size:0; line-height:0; cursor:pointer;}
.popup-cot .download{ width:50%; height:2.2rem; line-height:2.2rem; clear:both; position:absolute; bottom:1rem; left:25%; background:#1d005a; border-radius:2.2rem; -webkit-border-radius:2.2rem; -moz-border-radius:2.2rem; text-align:center; font-size:1rem; color:#ffffff;}

/*****Simulator*****/
.simulator{ width:94%; height:auto; margin:0 auto; clear:both;}
.simulator .card-cot{ width:100%; height:auto; margin:0 auto; clear:both;}
.simulator .card-cot .li{ width:100%; height:auto; margin:0 auto 1rem auto; clear:both; background:#000000; border-radius:0.5rem; -webkit-border-radius:0.5rem; -moz-border-radius:0.5rem; -webkit-box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2); -moz-box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2); box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2); overflow:hidden;}
.simulator .card-cot .li .role{ width:100%; height:8.2rem; clear:both; position:relative; background:#3b0078;}
.simulator .card-cot .li .role .select{ width:100%; height:100%; clear:both; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/bXtKVcboxphaang.png) center no-repeat; background-size:100% auto; font-size:0; line-height:0; cursor:pointer;}
.simulator .card-cot .li .role .rcot{ width:100%; height:100%; clear:both;}
.simulator .card-cot .li .role .pic{ width:52%; height:100%; clear:both; font-size:0; line-height:0; overflow:hidden;}
.simulator .card-cot .li .role .pic img{ width:100%; height:auto;}
.simulator .card-cot .li .role .txt{ width:75%; height:100%; clear:both; position:absolute; top:0; right:0; /*background-image:-webkit-linear-gradient(-0deg,rgba(59,0,120,0) 0%,rgba(59,0,120,1) 35%);*/ background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/fYkdzcboxpgFFkt.png) center repeat-y; background-size:100% auto;}
.simulator .card-cot .li .role .txt .rtit{ width:10rem; height:auto; padding:1.5rem 0 0 7rem; clear:both; font-size:1.6rem; color:#ffffff; line-height:90%;}
.simulator .card-cot .li .role .txt .rtit .rtit-cn{ padding-right:0.8rem;}
.simulator .card-cot .li .role .txt .rtit .rtit-en{ font-size:1rem; text-transform:uppercase;}
.simulator .card-cot .li .role .txt .rexp{ width:10rem; height:auto; padding:0.4rem 0 0 7rem; clear:both;}
.simulator .card-cot .li .role .txt .rexp .reli{ width:100%; height:auto; clear:both; font-size:0.9rem; color:#ffffff; line-height:135%;}
.simulator .card-cot .li .card{ width:97%; height:auto; margin:0 auto; padding:0.8rem 0 0 0; clear:both; overflow:hidden;}
.simulator .card-cot .li .card .cli{ width:5.29rem; height:8.2rem; margin:0 0.3rem 0.8rem 0.3rem; float:left; font-size:0; line-height:0; border-radius:0.3rem; -webkit-border-radius:0.3rem; -moz-border-radius:0.3rem; overflow:hidden;}
.simulator .card-cot .li .card .cli img{ width:100%; height:auto;}
.simulator .remark{ width:94%; height:auto; margin:0 auto; padding:0.3rem 3%; clear:both; background:#000000; border-radius:0.5rem; -webkit-border-radius:0.5rem; -moz-border-radius:0.5rem; -webkit-box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2); -moz-box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2); box-shadow:0.3rem 0.3rem 0 rgba(0,0,0,0.2);}
.simulator .remark textarea{ width:100%; height:7rem; background:none; border:0; font-size:0.9rem; color:#ffffff; -webkit-appearance:none; border-radius:0;}
.simulator .remark textarea::-webkit-input-placeholder{ color:#ffffff;}
.simulator .remark textarea::-moz-placeholder{ color:#ffffff;}
.simulator .buts{ width:100%; height:auto; margin:0 auto; padding:2rem 0 2rem 0; clear:both; overflow:hidden;}
.simulator .buts .but-clear{ width:auto; height:1.8rem; line-height:1.8rem; margin:0.45rem 0 0 0; padding:0 1rem; float:left; background:rgba(255,255,255,0.5); border:1px solid #ff0000; border-radius:1.8rem; -webkit-border-radius:1.8rem; -moz-border-radius:1.8rem; text-align:center; font-size:0.9rem; color:#ff0000; cursor:pointer;}
.simulator .buts .but-create{ width:14rem; height:2.9rem; float:right; background:url(//i.17173cdn.com/2fhnvk/YWxqaGBf/cms3/IKMRGaboxpgFFAp.png) center no-repeat; background-size:100% 100%; font-size:0; line-height:0; cursor:pointer;}
.simulator .qrcode{ width:6.8rem; height:6.8rem; margin:0 auto; padding:0.5rem 0 2rem 0; clear:both; font-size:0; line-height:0; overflow:hidden;}
.simulator .qrcode img{ width:100%; height:100%;}

.wrap-pic .simulator .remark{ padding:1rem 3%; color:#ffffff;}