@font-face {
    font-family: Eras;
    src:url("fonts/ErasDemiITC.TTF");
}
@font-face {
    font-family: FontAwesome;
    src:url("fonts/fontawesome-webfont.ttf");

    /*src:url("fonts/fa-regular-400.ttf");*/

}
html{
    height:100%;
    margin:0;
}
body{
    height:100%;
    background: radial-gradient(at 50% 0%,#7dcfe7,#01416f,#000d27);
    background-attachment:fixed;
    color:#fff;
    font:14px/1.5em  Eras;
    margin:0;
}
a{
    color:#eee;
    text-decoration: none;
    transition: all 1s;
}
a:hover{
    color: #4597bd;
    text-shadow: rgba(255,255,255,0.5) 0 0 8px;
}
body>header>h1{
    background: url("images/logotext.png") no-repeat;
    background-size: 100%;
    width:120px;
    height:29px;
    color:transparent;
    position: absolute;
    left:90px;
    top:10px;
    z-index: 2;
}

.mainnav{
    margin: 0;
}
nav .subnav{
    width:189px;
    position: absolute;
    left:37px;
    top:0;
    /*z-index: -1;*/
    box-sizing: border-box;
    padding:93px 20px 0 20px;
    background: url("images/logobg.png") no-repeat;
    list-style: none;

}
.subnav ul{
    list-style: none;
    padding-left: 10px;
    /*font-size: 1.1em;*/

}
.subnav:after{
    content: "";
    display: block;
    width:147px;
    height:17px;
    background: url("images/logobg-footer.png") no-repeat;
    position: relative;
    top:17px;
    left:-20px;
}
.subnav li{
    margin-top: 4px;
}
.subnav a{
    display: block;
    line-height: 1.6em;

}
nav{
    height:80px;
    background:url("images/navbg.png") no-repeat top right;
    padding:20px 120px 0 0;
    box-sizing: border-box;

}
nav>ul{float:right;}
nav>ul>li{
    /*float:right;*/
    list-style: none;
    padding:10px;
    float:left;
    font-size: 1.2em;
    line-height: 1.8em;
}
main{
    margin-left: 260px;
    /*width:1160px;*/
    /*display: none;*/
}


main>header>h1{
    font-size: 1.5em;
    position: relative;
    top:-20px;
}
.project{
    width:800px;
    position: relative;
    /*min-height: 500px;*/
    margin-bottom: 50px;
    background: rgba(0,0,0,0.2);
}
.project dl{
    width:200px;
    color: #8b8b8b;
    font-size: 12px;
    margin: 0;
    position: absolute;
    top:0;
    right:-200px;
    /*text-align: justify;*/
}
.project dt{
    font-size: 1.2em;
    font-weight: bold;
    padding: 10px;
    color:#fff;
    background: rgba(0,0,0,0.8);
    border-radius: 0 10px 0 0 ;
}
.project dd{
    background: rgba(255, 255, 255, 0.9);
    padding: 2px 10px;
    /*font-size: 1em;*/
    margin: 0;
    font:1.1em/1.5em  Eras;
    border-bottom:rgba(255,255,255,0.2) 1px dotted ;

}
.project dd:last-of-type{border-radius: 0 0 10px  0 ;padding-bottom: 8px}

.project label{
    /*font-weight: bold;*/
    /*background: #5d5d5d;*/
    color:#000;
    display: block;
    padding: 2px 0;
    /*margin-right: 5px;*/
    border-radius: 2px;
}
.project label:before{
    font-family: FontAwesome;
    padding-right: 4px;
}
.project dd a{
    background: #26b1e3;
}
.myduty:before{
    content:"\f040";
}
.client:before{
    content:"\f2ba";
}
.time:before{
    content:"\f017";
}
.detail:before{
    content:"\f05a";
}
.tools:before{
    content:"\f0ad";
}
.outLink:before{
    content:"\f0c1";
}


/*首页*/
.mainlogo label{

}

.mainlogo label:before{
    font-family: FontAwesome;
    padding-right: 4px;
    font-size: 60px;
    line-height: 60px;
    display: block;
    /*margin-bottom: 10px;*/
    cursor: pointer;
    width:60px;
    height:60px;
    margin: auto;
}
main>header>h1>label:before{
    font-family: FontAwesome;
    padding-right: 10px;
}
.home_aivideo{
    display: inline-block;
    background: url("images/icon_aivideo.png") center center;
    background-size:contain ;
    width:32px;
    height:24px;
    vertical-align: bottom;
    margin-right:10px ;

    /*content:"\f008";*/
}
.mainlogo .home_aivideo{
    display: block;
    margin: auto;
    width:80px;
    height:60px;
    cursor: pointer;
}
.home_aipics{
    display: inline-block;
    background: url("images/icon_aipic.png") center center;
    background-size:contain ;
    width:32px;
    height:24px;
    margin: auto;
    vertical-align: bottom;
    margin-right:10px ;
    /*content:"\f03e";*/
}
.mainlogo .home_aipics{
    display: block;
    margin: auto;
    width:80px;
    height:60px;
    cursor: pointer;
}
.home_training:before{
    content:"\f51c";
}

.home_website:before{
    content:"\f0ac";
}
.home_multimedia:before{
    content:"\f86d";
}
.home_vi:before{
    content:"\f2b4";
}
.home_bside:before{
    content:"\f201";
}
.home_ui:before{
    content:"\f3cd";
}
.mainlogo{
    background:url("images/mainlogo.png") left top no-repeat;
    width:800px;
    height:800px;
    margin: auto;
    position: relative;
    top:-100px;
    right:150px;
    padding-top: 120px;
    text-align: center;
    line-height: 30px;
}
.mainlogo ul{
    list-style: none;
    padding:0;
    margin: 0;
}
.mainlogo ul li{
    display: inline-block;
    margin: 30px 15px 0 15px;
}
.mainlogo ul li a{
    display:inline-block;
    width:200px;
    /*height:200px;*/
    background: rgba(0,0,0,0.6);
    border-radius: 20px;
    text-align: center;
    /*line-height: 40px;*/
    font-size: 1.1em;
    padding: 20px 0;
}
.mainlogo ul li a:hover{
    background: rgba(76, 190, 231, 0.6);
    color:white;
}
#mainlogogradient{
    margin:auto;
    display: block;
}
.mainlogo i{
    display: block;
    font-size: 100px;
    line-height: 100px;
    margin-bottom: 10px;
}
/*tips*/

section label.tips1{
    display: none;
}
section label.tips2{
    color:rgba(255,255,255,0.2);
    text-align: center;
}
section label.tips2:before{
    content:"\f05a";
    font-family: FontAwesome;
}
iframe{
    display: block;
    margin-left: auto;
    margin-right: auto;
}
/*下一页*/
.nexttopic{
    float:right;
    margin-right:300px;
    font-size: 1.2em;
    display: inline-block;
    background: #000;
    line-height: 50px;
    padding:0 20px;
    border-radius: 25px;
}
.nexttopic:before{
    content:"\f101";
    font-family: FontAwesome;
}
.top{
    margin-left: 20px;
}
.top:before{
    content:"\f102";
    font-family: FontAwesome;
}
footer{
    height:50px;
}

.fade{
    opacity: 0.5;
}

.current{
    color:#26b1e3;
}

/*轮播图*/
.swiper {
    width: 100%;
    height: auto;
    max-width: 800px;
}
.swiper-slide img{
    width:100%;
}

.videoframe{
    position: relative;
}
.poster{
    width: 333px;
    height:592px;
    position: absolute;
    left:50%;
    top:0;
    transform: translate(-50%, 0)
}
.poster .posterImg{
    width: 333px;
    height:592px;

}
.poster .playbutton{
    width: 50px;
    height:50px;
    position: absolute;
    left:50%;
    top:280px;
    transform: translate(-50%,0)
}