@charset "utf-8";
html,body{background:#f0f0f0;color:#505050;font-size:62.5%;-webkit-user-select:none;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-touch-callout:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {margin:0;padding:0;}
body,button,input,select,textarea {font:14px \5b8b\4f53,'Helvetica Neue',Arial,'Liberation Sans',FreeSans,'Hiragino Sans GB',sans-serif\"Microsoft YaHei"\"微软雅黑";line-height:20px;}
h1{font-size:24px;}
h2{font-size:22px;}
h3{font-size:18px;}
@media only screen and (min-width:360px) {
    h1{font-size:28px;}
    h2{font-size:26px;}
    h3{font-size:22px;}
    body,button,input,select,textarea {font-size:18px;line-height:26px;}
}
h1,h2,h3,h4,h5,h6 {font-weight:normal;}
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {-webkit-text-size-adjust:none;}/*阻止旋转屏幕时自动调整字体大小*/
textarea{resize:none;}
/*取消按钮在inphone上的默认样式*/
input[type=button]{-webkit-appearance:none;outline:none}
input::-webkit-input-placeholder{color:#F0F0F0;}
textarea::-webkit-input-placeholder{color:#F0F0F0;}
input::-webkit-input-speech-button {display:none}
table {border-collapse:collapse;border-spacing:0;}
th {text-align:inherit;}
fieldset,img {border:none;}
abbr,acronym {border:none;font-variant:normal;}
del {text-decoration:line-through;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
sub,sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup {top:-0.5em;}
sub {bottom:-0.25em;}
ins,a,a:hover {text-decoration:none;}
a:focus,*:focus {outline:none;}
.clearfix:before,.clearfix:after {content:"";display:table;}
.clearfix:after {clear:both;overflow:hidden;}
.clearfix {zoom:1;}
.clear {clear:both;display:block;font-size:0;height:0;line-height:0;overflow:hidden;}
.hide {display:none;}
.block {display:block;}
.outL{white-space:normal;word-break:break-all;width:100px;}
.outH{overflow:hidden;text-overflow:ellipsis;white-space:nowrap; width:100px;}
*, *:before, *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html, body {
    font-size: 62.5%;
    height: 100%;
    overflow: hidden;
}
@media (max-width: 768px) {
    html, body {
        font-size: 50%;
    }
}
@font-face {font-family: "iconfont";
    src: url('../fonts/iconfont.eot?t=1539740130540'); /* IE9*/
    src: url('../fonts/iconfont.eot?t=1539740130540#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'),
    url('../fonts/iconfont.ttf?t=1539740130540') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
    url('../fonts/iconfont.svg?t=1539740130540#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont {
    font-family:"iconfont" !important;
    font-size:26px;
    font-style:normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-shouyetianchong:before { content: "\e692"; }
.icon-yonghu:before { content: "\e727"; }
.icon-shebeiguanli:before { content: "\ebb7"; }
.icon-paiming:before { content: "\e881"; }
.icon-ziyuan:before { content: "\e600"; }
.icon-jingyingkaohe:before { content: "\e617"; }
svg {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    overflow: visible;
}

.svg-icon {
    cursor: pointer;
}
.svg-icon path {
    stroke: rgba(255, 255, 255, 0.9);
    fill: none;
    stroke-width: 1;
}

input, button {
    outline: none;
    border: none;
}

.cont {
    position: relative;
    height: 100%;
    background-size: cover;
    overflow: auto;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

.cont_bg1 {
    /**  background-image: url("../../img/slider-1.png"); **/
	background-image: url("../../img/kpbj.jpg");
}

.cont_bg2 {
    /** background-image: url("../../img/slider-2.jpg"); **/
	background-image: url("../../img/slider-2.jpg");
}
input::-moz-selection { /* Firefox */
    background: #ffffff;
}
 
input::-webkit-selection { /* Chrome/Safari */
    background: #ffffff;
}
 
input::selection { /* 其他浏览器 */
    background: #ffffff;
}
input {
    -webkit-appearance: none; /* 针对Webkit浏览器 */
    -moz-appearance: none; /* 针对Firefox */
    appearance: none; /* 通用设置 */
    outline: none; /* 移除轮廓线 */
}
.demo {
    display: none;
    position: absolute;
    top: calc(50% - 211px);    
    width: 90%;
	max-width:462px;
    /* height: 80%; */
    overflow: hidden;
	border-radius: 10px;
}
@media (min-width: 500px) {
    .demo {
        right: calc(50% - 231px);
    }
}
@media (max-width: 500px) {
    .demo {
        right: 5%;
    }
}

.check {
    display: none;
    width: 100%;
    height: 60%;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.75);
}
.check a {
    display: block;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    width: 86%;
    margin: auto;
    text-align: left;
    border-bottom: 1px dashed;
    margin: 20px 7%;
    border: 1px solid #5790be;
    border-radius: 25px;
    text-indent: 1em;
}
.check a span {
    color: #50d2c2;
    float: right;
    margin-right: 1em;
}
.login,.register {
    position: relative;
    height: 100%;
	background:#ffffff;
    /* background: -webkit-linear-gradient(top, rgba(146, 135, 187, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%);
    background: linear-gradient(to bottom, rgba(146, 135, 187, 0.8) 0%, rgba(0, 0, 0, 0.6) 100%); */
    -webkit-transition: opacity 0.1s, -webkit-transform 0.3s cubic-bezier(0.17, -0.65, 0.665, 1.25);
    transition: opacity 0.1s, -webkit-transform 0.3s cubic-bezier(0.17, -0.65, 0.665, 1.25);
    transition: opacity 0.1s, transform 0.3s cubic-bezier(0.17, -0.65, 0.665, 1.25);
    transition: opacity 0.1s, transform 0.3s cubic-bezier(0.17, -0.65, 0.665, 1.25), -webkit-transform 0.3s cubic-bezier(0.17, -0.65, 0.665, 1.25);
    -webkit-transform: scale(1);
    transform: scale(1);
	    display: inline-block;
}
.login.inactive {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.login__check {
     /* background: url(../../img/gy.png) 8px 20px;
    background-size: cover;   
    height: 35%;
	    height: 35%;background-size: 100% 83%; height: 50%;*/
	 width: 100%;	
	 text-align: center;margin:4rem 0;
}
.login__check img {width:75%;}
.login__form {
    /* position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 50%; */
    padding: 1.5rem 2.5rem;
    text-align: center;
}
.login__row {
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-left: 10px;
    text-align: left;
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.2); */
}
.login__icon {
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
}
.login__icon.name path {
    stroke-dasharray: 73.50196075439453;
    stroke-dashoffset: 73.50196075439453;
    -webkit-animation: animatePath 2s 0.5s forwards;
    animation: animatePath 2s 0.5s forwards;
}
.login__icon.pass path {
    stroke-dasharray: 92.10662841796875;
    stroke-dashoffset: 92.10662841796875;
    -webkit-animation: animatePath 2s 0.5s forwards;
    animation: animatePath 2s 0.5s forwards;
}
.login__input {
    display: inline-block;
    width: 100%;
    height: 100%;
    font-size: 1.5rem;
    /* background: transparent; 
    color: #FDFCFD;*/
	    padding-left: 15px;    border-radius: 8px;    background: #fff;
    border: 1px solid #ccc;
}
.login__row_name{
	height: 30px;line-height: 30px;font-weight:bold; font-size:16px; margin-top:8px;
}
.login__submit {
    position: relative;
    width: 100%;
    height: 4rem;
    margin: 4rem 0 2.2rem;
    /* color: rgba(255, 255, 255, 0.8); */
    background: #339fff;
    font-size: 1.5rem;
    border-radius: 3rem;
    cursor: pointer;
    overflow: hidden;
    -webkit-transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
    transition: width 0.3s 0.15s, font-size 0.1s 0.15s;
	    font-weight: bold;
    font-size: 14px;
    color: #ffffff;
	letter-spacing:16px;
}
.login__submit:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -1.5rem;
    margin-top: -1.5rem;
    width: 3rem;
    height: 3rem;
    border: 2px dotted #fff;
    border-radius: 50%;
    border-left: none;
    border-bottom: none;
    -webkit-transition: opacity 0.1s 0.4s;
    transition: opacity 0.1s 0.4s;
    opacity: 0;
}
.login__submit.processing {
    width: 4rem;
    font-size: 0;
}
.login__submit.processing:after {
    opacity: 1;
    -webkit-animation: rotate 0.5s 0.4s infinite linear;
    animation: rotate 0.5s 0.4s infinite linear;
}
.login__submit.success {
    -webkit-transition: opacity 0.1s 0.3s, background-color 0.1s 0.3s, -webkit-transform 0.3s 0.1s ease-out;
    transition: opacity 0.1s 0.3s, background-color 0.1s 0.3s, -webkit-transform 0.3s 0.1s ease-out;
    transition: transform 0.3s 0.1s ease-out, opacity 0.1s 0.3s, background-color 0.1s 0.3s;
    transition: transform 0.3s 0.1s ease-out, opacity 0.1s 0.3s, background-color 0.1s 0.3s, -webkit-transform 0.3s 0.1s ease-out;
    -webkit-transform: scale(30);
    transform: scale(30);
    opacity: 0.9;
}
.login__submit.success:after {
    -webkit-transition: opacity 0.1s 0s;
    transition: opacity 0.1s 0s;
    opacity: 0;
    -webkit-animation: none;
    animation: none;
}
.login__signup {
    font-size: 1.2rem;
    color: #ABA8AE;
}
.login__signup a {
    color: #fff;
    cursor: pointer;
}

.app {
    width: 100%;
    height: 100%;
    opacity: 0;
    display: none;
    -webkit-transition: opacity 0.1s, -webkit-transform 0.3s cubic-bezier(0.68, -0.45, 0.465, 1.25);
    transition: opacity 0.1s, -webkit-transform 0.3s cubic-bezier(0.68, -0.45, 0.465, 1.25);
    transition: opacity 0.1s, transform 0.3s cubic-bezier(0.68, -0.45, 0.465, 1.25);
    transition: opacity 0.1s, transform 0.3s cubic-bezier(0.68, -0.45, 0.465, 1.25), -webkit-transform 0.3s cubic-bezier(0.68, -0.45, 0.465, 1.25);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
.app.active {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.app.active .app__user-photo {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.app.active .app__meeting {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}
.app.active .app__logout {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.app__top {
    position: relative;
    height: 30%;
    background: rgba(0, 0, 0, 0.14);
    padding: 1rem 0;
    text-align: center;
}
.app__bot:nth-child(1) {
    display: block;
}
.app__bot {
    display: none;
    position: relative;
    width: 100%;
    height: 23%;
    background: rgba(0, 0, 0, 0.75);
}
.app__bot .app_model {
    height: 23%;
    width: 100%;
    font-size: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #50d2c2;
}
.app__bot .app_model p {
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    width: 80%;
}
.app__bot .app_model .model-tab {
    width: 10px;
    height: 10px;
    border-top: 2px solid #666;
    border-right: 2px solid #666;
    transform: rotate(45deg);
    position: absolute;
    right: 20px;
    top: 9%;
}
.app__bot .app_ranking_box {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 77%;
}
.app__bot .app_ranking  {
    position: relative;
    color: #fff;
    text-align: center;
    border: 1px solid #2b2f32;
    width: 50%;
    height: 100%;
}
.app__bot .app_ranking i {
    position: absolute;
    right: 20px;
    top: 20px;
    color: #b97575;
}
.app__bot .app_ranking span {
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 16px;
}
.app__bot .app_ranking .grade {
    font-size: 36px;
    position: absolute;
    left: 20px;
    bottom: 20px;
}
.app_notice {
    position: relative;
    height: 37%;
    background: rgba(0, 0, 0, 0.75);
}
.app_notice h2 {
    line-height: 1.4rem;
    font-size: 16px;
    padding-left: 20px;
    padding-top: 10px;
    color: #50d2c2;
    height: 16%;
}
.app_notice ul {
    margin: 10px 0;
    padding: 0 20px;
    height: 72%;
    overflow: auto;
}
.app_notice ul li {
    height: 36px;
    line-height: 36px;
    color: rgba(255, 255, 255, 0.57);
    border-bottom: 1px dotted #ccc;
}
.app_notice ul li a {
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.57);
}
.app_notice ul li a span {
    font-size: 1.5rem;
    float: right;
}
.app__menu-btn {
    position: absolute;
    top: 2rem;
    left: 1.5rem;
    width: 1.8rem;
    height: 1.7rem;
    cursor: pointer;
}
.app__menu-btn span, .app__menu-btn:before, .app__menu-btn:after {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, 0.6);
}
.app__menu-btn span {
    top: 0.8rem;
}
.app__menu-btn:before {
    content: "";
    top: 0;
}
.app__menu-btn:after {
    content: "";
    bottom: 0;
}
.app__icon {
    position: absolute;
    top: 2rem;
}
.app__icon.search {
    right: 1.5rem;
    stroke-dasharray: 61.847137451171875;
    stroke-dashoffset: 61.847137451171875;
    -webkit-animation: animatePath 0.5s 0.5s forwards;
    animation: animatePath 0.5s 0.5s forwards;
}
.app__hello {
    font-size: 2.2rem;
    color: #fff;
    font-weight: normal;
    margin-bottom: 10px;
}
.app__user {
    position: relative;
    display: inline-block;
    /* width: 9rem; */
    /* height: 9rem; */
    width: 100%;
    height: 60%;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.app__user-photo {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    -webkit-transition: -webkit-transform 0.3s 0.2s cubic-bezier(0.62, 0.35, 0.56, 1.55);
    transition: -webkit-transform 0.3s 0.2s cubic-bezier(0.62, 0.35, 0.56, 1.55);
    transition: transform 0.3s 0.2s cubic-bezier(0.62, 0.35, 0.56, 1.55);
    transition: transform 0.3s 0.2s cubic-bezier(0.62, 0.35, 0.56, 1.55), -webkit-transform 0.3s 0.2s cubic-bezier(0.62, 0.35, 0.56, 1.55);
    -webkit-transform: scale(0);
    transform: scale(0);
}
.app__username {
    position: absolute;
    /*bottom: 6%;*/
    width: 100%;
}
.app__user-notif {
    position: absolute;
    top: 0;
    right: 0;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    line-height: 3rem;
    text-align: center;
    background: #50D2C2;
    color: #fff;
    font-size: 1.5rem;
}
.app__username:after {
    content: "";
    display: table;
    clear: both;
}
.app__username .username {
    display: inline-block;
    color: rgba(255, 255, 255, 0.6);
    font-size: 2rem;
    text-transform: uppercase;
}
.own_page {
    display: none;
    width: 100%;
    height: 60%;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.75);
}
.own_page a {
    display: block;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    color: #fff;
    width: 86%;
    margin: auto;
    text-align: center;
    margin: 20px 7%;
    border: 1px solid #5790be;
    border-radius: 25px;
}
.own_page a span {
    color: #50d2c2;
    float: right;
    margin-right: 1em;
}

.app_bottom {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 10%;
    background: rgba(144, 191, 214, 0.5);
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.app_bottom i{
    display: inline-block;
    text-align: center;
    color: #fff;
}
.app_bottom .active {
    color: #50d2c2;
}
.app_bottom i span {
    font-size: 14px;
}
.ripple {
    position: absolute;
    width: 15rem;
    height: 15rem;
    margin-left: -7.5rem;
    margin-top: -7.5rem;
    background: rgba(0, 0, 0, 0.4);
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-animation: animRipple 0.4s;
    animation: animRipple 0.4s;
    border-radius: 50%;
}
._mCS_1 .mCSB_scrollTools .mCSB_dragger_bar {
    width: 8px;
}
@-webkit-keyframes animRipple {
    to {
        -webkit-transform: scale(3.5);
        transform: scale(3.5);
        opacity: 0;
    }
}

@keyframes animRipple {
    to {
        -webkit-transform: scale(3.5);
        transform: scale(3.5);
        opacity: 0;
    }
}
@-webkit-keyframes rotate {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes rotate {
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes animatePath {
    to {
        stroke-dashoffset: 0;
    }
}
@keyframes animatePath {
    to {
        stroke-dashoffset: 0;
    }
}