/*导航nav*/


.nav {
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
    background:  linear-gradient(top, rgba(0, 0, 0, 0.5), transparent);
    width: 100%;
    height: 80px;
    height: 70px \9;
    position: absolute;
    top: 0;
    z-index: 99;
    left: 0;
}
.nav .navBg{
    position: absolute;
    width:100%;
    height:100%;
    background: #000 \9;
    filter: Alpha(opacity = 20);
    z-index: 0;
}

.nav > div {
    height: 100%;
    position: relative;
    z-index: 1;
}

.nav .logo {
    padding-top: 20px;
    float: left;
}

.nav ul {
    float: left;
    margin-left: 30px;
}

.nav li {
    float: left;
    padding: 0 23px;
    line-height: 70px;
}

.nav li > a {
    font-size: 18px;
    color: #fff;
}
.nav li > a:hover{
    filter: Alpha(opacity = 100);
}
.nav .tel {
    float: right;
    font-size: 18px;
    line-height: 70px;
    color: #fff;
    background: url("../img/tel.png") no-repeat left center;
    padding-left: 40px;
}

/*part1 美国上市公司公开课：0基础入门C语言*/

.video{ position: relative; height: 560px;}

.video-nr{ width: 586px;
    height: 354px;

    border: 1px solid #fff;

    -webkit-box-shadow:3px 2px 15px #dedede;
    -moz-box-shadow:3px 2px 15px #dedede;
    box-shadow:3px 2px 15px #dedede;
    filter:alpha(opacity=100,finishOpacity=100,style=1,startX=0, startY=0,finishX=0,finishY=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#ffffff,endcolorstr=#ededed,gradientType=0) \9;/*IE8*/

    -ms-filter:alpha(opacity=100,finishOpacity=50,style=1,startX=0, startY=0,finishX=0,finishY=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#ffffff,endcolorstr=#ededed,gradientType=0);/*IE8*/
    background:#eee; /* 一些不支持背景渐变的浏览器 */
    background:-moz-linear-gradient(top, #fff, rgba(236, 236, 236, 1));
    background:-webkit-gradient(linear, 0 0, 0 bottom, from(#fff), to(rgba(236, 236, 236, 1)));
    background:-o-linear-gradient(top, #fff, rgba(236, 236, 236, 1));
    position: absolute;
    top:95px;
    left: 0;
    z-index: 0;
    border: 1px solid #e2e2e2 \9;}
.video-nr:before{ content: 'The C Programming Language'; position: absolute; left: 30px; top:5px; z-index: 1;  font-size: 24px; color: #f1f1f1;}

.video-nr dl{ width: 370px;  padding:16px 10px 10px 0px; cursor:pointer; z-index: 2;}
.video-nr dl dt{ font-size: 36px; color: #848484; font-weight: bold; margin-left: 25px; line-height: 2.1;}
.video-nr dl dd{ font-size: 18px; line-height: 2; color: #999; margin-left: 30px;}
/*.video-nr dl dd.dd-1{ margin-left: 140px;}*/
/*.video-nr dl dd.dd-2{ margin-left: 12px;}*/
/*.video-nr dl dd.dd-3{ margin-left: 210px;}*/
/*.video-nr dl dd.dd-4{ margin-left: 25px;}*/
/*.video-nr dl dd.dd-5{ margin-left: 170px;}*/
.video-nr dl p{ margin-left: 164px; margin-top: 27px;}
.video-nr dl p a{ width: 164px; position: relative;
    height: 38px; line-height: 35px; font-size: 16px; display: block; background: #3e71cc; color: #fff; text-align: center; border-radius:3px;}

.video-nr dl p a:hover{
    background: #fff; color: #3e71cc; border: 1px  solid #3e71cc; transition: all 0.2s linear;
}
.video-nr dl:before{ content:''; }








.computer{ width: 611px;
    height: 464px;
    position: absolute;
    top: 0; right: 0;

}
.computer p{ background: url("../img/comp.png") no-repeat; width: 100%;height: 100%;}

.computer iframe{ z-index: 3; position: relative; top: -440px; left: 23px;}
.computer  .player{width:565px !important;
    height: 320px;z-index: 3; position: relative; top: -441px; left: 23px; top: -441px \9; left: 23px \9; }

.computer  .player>div>div>div{ line-height: 320px !important;}
.computer .player object{ width:565px !important;
    height: 320px;}

.computer .player embed{ width:565px !important;
    height: 320px;}

/*part2 达内前沿技术讲座：区动世界，链接未来*/

.part2{ background: #292929;overflow: hidden;}
.part2 p.bor{ width:28px; height:28px;
    border-width:15px; border-style:solid; border-color:#fff  transparent transparent transparent;
    position: absolute;left: 50%; z-index: 0;

   }
.part2 p.bor:after{content:'';width:0px; height:0px;
    border-width:9px; border-style:solid; border-color:#292929  transparent transparent transparent;
    position: absolute; top:-15px;left:-9px; z-index: 1;}
.p2Cont{ margin-top: 50px; background: #1c1c1c;
    height: 540px; overflow: hidden;margin-bottom: 82px;}

.p2Cont .da-sp{ }

.p2Cont .sp-big{ width: 670px; padding-top: 20px; float: left;display:none;}

.p2Cont .sp-big h2{ font-size: 24px; color: #a5a5a5; background: url("../img/sp-h2-bg.png") no-repeat center left; padding-left: 50px; margin: 0px 0px 10px 10px; }

.p2Cont .sp-big .vid-big{ width: 670px;
    height: 397px; background: #000; overflow: hidden;}

.p2Cont .sp-big .sp-big-pre{ margin-top: 19px;}

.p2Cont .sp-big .sp-big-pre p{ float:left; font-size: 16px;}

.p2Cont .sp-big .sp-big-pre .sp-big-pre1{ width: 200px; background: url("../img/ren.png") no-repeat center left; padding-left: 25px; margin: 2px 0px 10px 10px; color: #c5c5c5;}
.p2Cont .sp-big .sp-big-pre .sp-big-pre2{ float: right;}
.p2Cont .sp-big .sp-big-pre .sp-big-pre2 a{width: 146px; border-radius: 3px; text-align: center;
    height: 34px; line-height: 33px;  background: #9a9a9a;color: #1c1c1c; display: inline-block;}
.p2Cont .sp-big .sp-big-pre .sp-big-pre2 a:hover{ background: #ccc; transition: all 0.1s linear;}

/*视频滚动*/
.sp-sm{ width:308px; float: right;}
.sp-sm>p{ font-size: 22px; padding-top:20px; margin-bottom: 14px;}
.sp-sm>a{width: 146px; border-radius: 3px; text-align: center;
    height: 34px; line-height: 33px; font-size: 16px;  background: #bf203e;color: #cacaca; display: inline-block; margin: 15px 25% 0px;}
.sp-sm>a:hover{
    background:#bf203e; color: #fff;  transition: all 0.2s linear;
}

.sp-sm ul li>div{ float: left;}
.sp-sm ul{height: 400px;}
.sp-sm ul li a{ width: 297px; display: block;
    height: 85px; overflow: hidden; margin-bottom: 18px;box-sizing: border-box; }
.sp-sm ul li a .sm-nr{ width: 130px; margin-left: 14px;  float: right; margin-right: 5px;}
.sp-sm ul li a .sm-nr .sm-nr1{ font-size: 16px; color: #868686;}
.sp-sm ul li a .sm-nr .sm-nr2{ font-size: 12px; color: #c5c5c5; margin-top: 5px;}
.sp-sm li a .vid{ width: 148px;height: 85px; overflow: hidden; float: left; box-sizing: border-box; background: #000;}

/*滚动条*/
.content{width:308px;height:400px;overflow:auto;}







/*滚动条
.scroll-bar{    z-index: 1;
    position: relative;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-3dlight-color: #3f3f3f;
    scrollbar-highlight-color: #3f3f3f;
    scrollbar-arrow-color: #999;
    scrollbar-shadow-color: #3f3f3f;
    scrollbar-darkshadow-color: #3f3f3f;
    scrollbar-base-color: #3f3f3f;
    scrollbar-track-color: #010101;

}*/
/*兼容谷歌等高版本浏览器
.scroll-bar::-webkit-scrollbar {
    width:7px;
    height:7px;

}
.scroll-bar::-webkit-scrollbar-button {
    background-color:#1c1c1c;
    display: none;
}
.scroll-bar::-webkit-scrollbar-track {
    background:#1c1c1c;
}
.scroll-bar::-webkit-scrollbar-track-piece {

}
.scroll-bar::-webkit-scrollbar-thumb{
    background:#424242;
    border-radius:4px;
}*/

/*兼容火狐
@-moz-document url-prefix（） {
    .scroll-bar{opacity: 1 !important;
        -moz-appearance: none !important;
        background-color: transparent !important;
        min-width: 9px !important;
        max-width: 9px !important;}

}*/






/*鼠标经过*/
.sp-sm ul li.click-li .vid{ border: 3px solid #bf203e;}

.sp-sm ul li.click-li a .sm-nr1{ color: #bf203e;}







/*part3 在线申领多元化教学福利*/

.part3{ margin-bottom: 65px;
    overflow: hidden;}
.p3Cont .box{ width: 290px; margin-left: 29px; border-radius: 2px;
    height: 324px; position: relative; display: inline-block; }
.p3Cont .del,.p3Cont .pop{ width: 290px; border-radius: 2px;
    height: 324px;}

.p3Cont .box .del{ z-index: 2;}
.p3Cont .box .pop{ position: absolute; top: 0;left: 0; opacity: 0; filter: alpha(opacity=0);transform: rotateY(90deg);
    transition: 0.4s; box-shadow: 1px 1px 10px #ddd; border:1px solid #dddddd \9;}
.p3Cont .box:hover .pop{ opacity: 1; filter: alpha(opacity=100);transform: rotateY(0deg);
    transition: 0.4s;}
.p3Cont .box:hover .pop p{opacity: 1; filter: alpha(opacity=100);}
.p3Cont .box .del p,.p3Cont .box .pop p{ font-size: 30px; color: #fff; text-align: center; position: relative; top: 170px;}

.p3Cont .box .del1{ background: #bf203e;}
.p3Cont .box .del2{ background: #f7bf01;}
.p3Cont .box .del3{ background: #3e71cc;}
.p3Cont .box .del2 p{ color: #222;}

.p3Cont .box .del:before{
    content: '';
    width: 90px;
    height: 90px;
    margin:67px 107px 25px;
    position: absolute;
    display: block;
    background: url("../img/3-1.png") no-repeat;
}

.p3Cont .box .del1:before{
    background-position: 0 top;
}
.p3Cont .box .del2:before{
    background-position: -83px top;
}
.p3Cont .box .del3:before{
    background-position: -173px top;
}
.p3Cont .box .del:after{
    content: '';
    width: 83px;
    height: 12px;
    position: absolute;
    bottom: 43px;
    margin: 0 105px;
    display: block;
    background: url("../img/3-2.png") no-repeat;
    animation: breathe 1000ms ease infinite;
    transition: all 1s;

}
.p3Cont .box .del1:after{
    background-position: 0 top;
}
.p3Cont .box .del2:after{
    background-position: -83px top;
}
.p3Cont .box .del3:after{
    background-position: 0 top;
}


.p3Cont .box .pop p{ position: relative; top: 150px; display:block; color: #222;opacity: 0; filter: alpha(opacity=0);}


.p3Cont .box .pop div{font-size: 18px; width: 198px; margin: 0 auto; padding-top:170px;}
.p3Cont .box .pop2 p{color: #f7bf01;}
.p3Cont .box .pop2 div{color: #fff;}


.p3Cont .pop1{ background: #f8f8f8;}
.p3Cont .pop2{ background: #222;}
.p3Cont .pop3{ background: #f8f8f8;}

.p3Cont .box .pop1 p{
    color: #bf203e;
}
.p3Cont .box .pop2 p{
    color: #f7bf01;
}
.p3Cont .box .pop3 p{
    color: #3e71cc;
}

.p3Cont .box .pop a{ text-align: center;display: block;font-size: 14px; margin-top: 8px; padding-bottom: 2px;text-decoration: underline;
}


.p3Cont .box .pop1 a{
    color: #bf203e;
}
.p3Cont .box .pop2 a{
    color: #f7bf01;
}
.p3Cont .box .pop3 a{
    color: #3e71cc;
}




.p3Cont .box .pop:before{
    content: '';
    width: 90px;
    height: 90px;
    margin:38px 107px 28px;
    position: absolute;
    display: block;
    background: url("../img/3-1.png") no-repeat;
}
.p3Cont .box .pop1:before{
    background-position: 0 -100px;
}
.p3Cont .box .pop2:before{
    background-position: -83px -100px;
}
.p3Cont .box .pop3:before{
    background-position: -173px -100px;
}


/*鼠标滑过*/



/*part9*/
/*表单*/
.formPart {
    background: url("../img/form_bg.jpg") no-repeat top center;
    padding-top: 1px;
    height: 458px;

}
.formPart .tit{padding-top: 12px;margin-bottom: 10px;}
.formPart .tit h3 ,.formPart .tit p{
    color: #fff;
}
.formPart .tit p{
    font-size: 30px;
    color: #6099ff;
    margin-top: 0;
}
.formPart .topBox{margin-top: 10px;}

/*.formPart > .biaoti {
    margin-top: 55px;
    margin-bottom: 55px;
}

.biaodan > .biaoti > p {
    margin-bottom: 10px;
}*/

/*.biaodan > p {
    text-align: center;
    font-size: 30px;
    color: #6099ff;
}*/


.formPart button {
    width: 45%;
    float: right;
    display: block;
    text-align: center;
    border: 1px solid #3e71cc;
    border-radius: 5px;
    background: #3e71cc;
    color: #fff;
    font-size: 18px;
    height: 48px;
    line-height: 46px;
    overflow: hidden;
}

.formPart a {
    width: 45%;
    float: left;
    display: block;
    text-align: center;
    border: 1px solid #3e71cc;
    border-radius: 5px;
    background: #3e71cc;
    color: #fff;
    font-size: 18px;
    height: 48px;
    line-height: 48px;
    overflow: hidden;
}

.formPart > form > div > a:hover {
    background: rgba(62, 113, 204, 0.5);
    color: #c3c3c3;
    cursor: pointer;
}

.formPart > form > div > button:hover {
    background: rgba(62, 113, 204, 0.5);
    color: #c3c3c3;
    cursor: pointer;
}


/***************/
/*算一算*/
.suan {
    background: #000000 \9;
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    padding-top: 1px;
    bottom: -380px;
    z-index: 500;
    width: 100%;
    transition: all 0.5s;
}


.suan.true {
    bottom: 0;
}

.suan > .title {
    text-align: left;
    /*position: absolute;*/
    /*top:-90px;*/
    width: 900px;
    margin: 15px auto 15px;
    position: relative;
}

.suan > .title p {
    height: 47px;
    font-size: 30px;
    line-height: 47px;
    color: #fff;
    font-weight: 600;
    display: inline-block;
}

.suan > .title p span {
    font-size: 47px;
    font-weight: 600;
    color: #ffe400;
    display: inline-block;
    margin-left: 20px;
}

.suan > .title > .xiaoren {
    position: absolute;
    bottom: -5px;
    margin-left: 40px;
}

.suan > .title > .jiantou {
    width: 20px;
    height: 40px;
    display: inline-block;
    float: right;
    background: url("../img/suan_jiantou.gif") no-repeat center;
}

.suan > .title > .jiantou.true {
    background-image: url("../img/suan_jiantou_xia.gif");
}

.suan_c {
    width: 900px;
    height: 380px;
    margin: 0 auto 0;
    background: #fff;
    position: relative;
}

.suan_z {
    padding-left: 24px;
    width: 546px;
    float: left;
    padding-top: 35px;
    border-right: 1px solid #d8d8d8;
    height: 100%;
}

.suan_z > p > span {
    font-size: 24px;
    font-weight: 900;
    color: #000;
    display: inline-block;
    margin-right: 5px;
}

.suan_z > p {
    color: #5f5f5f;
    font-size: 16px;
    margin-bottom: 4px;
}

.suan_z > p > i {
    color: #d81e06;
    font-style: normal;
}

.suan_z > div > p {
    font-size: 20px;
    color: #000000;
    vertical-align: middle;
    margin-bottom: 5px;
    margin-top: 24px;
}

.suan_z > div > p > img {
    margin-right: 10px;
}

.suan_z > div > p > span {
    display: inline-block;
    height: 15px;
    width: 15px;
    margin-left: 20px;
    border: 1px solid #000;
}

.suan_z > div > p > span.true {
    background: url("../img/duigou.png") no-repeat center;
}

.suan_z .fenlei {
    padding-left: 10px;
    display: inline-block;
}

.suan_z .fenlei > p {
    font-size: 16px;
    margin-top: 12px;
    display: inline-block;
}

.suan_z .fenlei > span {
    font-size: 16px;
    cursor: pointer;
}

.suan_z .fenlei > span > i {
    width: 10px;
    height: 10px;
    border: 1px solid #333;
    border-radius: 50%;
    margin-left: 18px;
    margin-right: 38px;
    display: inline-block;
    margin-top: 10px;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    padding: 1px;
}

.suan_z .fenlei > span > i.true > em {
    width: 100%;
    height: 100%;
    background: #000;
    display: block;
    border-radius: 50%;
}

.suan_z .fenlei > p > i {
    width: 10px;
    height: 10px;
    border: 1px solid #333;
    border-radius: 50%;
    margin-left: 11px;
    margin-right: 0;
    display: inline-block;
    margin-top: 10px;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    padding: 1px;
}

.suan_z .fenlei > p > i.true > em {
    width: 100%;
    height: 100%;
    background: #000;
    display: block;
    border-radius: 50%;
}

.suan_y {
    width: 350px;
    float: left;
}

.suan_y > p {
    font-size: 36px;
    font-weight: 900;
    color: #000;
    margin: 50px auto 112px;
    width: 62%;
}

.suan_y > p > span {
    color: #3e71cc;
}

.suan_y > a {
    width: 195px;
    height: 50px;
    color: #fff;
    text-align: center;
    line-height: 50px;
    margin: 0 auto;
    font-size: 18px;
    display: block;
    background: #3e71cc;
    border-radius: 5px;
}

.baojia {
    position: absolute;
    left: 480px;
    top: 135px;
    cursor: pointer;
}

/*弹出表单*/
.tan_form.true {
    display: block;
}

.tan_form {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    top: 0;
    left: 0;
    display: none;
    z-index: 501;
    background: #000 \9;
    /*-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";*/
    /*IE4-IE9*/
    /*filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=90);*/
}

.tan_form > form {
    width: 500px;
    height: 300px;
    background: #fff;
    position: absolute;
    margin-left: -175px;
    margin-top: -150px;
    left: 50%;
    top: 50%;
    border-radius: 10px;
}

.tan_form > form > span {
    cursor: pointer;
}

.tan_form > form > p {
    font-size: 18px;
    color: #999;
    text-align: center;
    margin-top: 55px;
    margin-bottom: 30px;
}

.tan_form > form > input {
    width: 40%;
    height: 35px;
    line-height: 35px;
    border: 1px solid #3e71cc;
    border-radius: 5px;
    margin: 20px auto 0;
    display: block;
    padding-left: 20px;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
}

.tan_form > form > button {
    width: 40%;
    height: 35px;
    line-height: 35px;
    border: 1px solid #3e71cc;
    border-radius: 5px;
    margin: 20px auto 0;
    display: block;
    background: #3e71cc;
    color: #fff;
}

.tan_form > form > button:hover {
    background: transparent;
    color: #3e71cc;
    cursor: pointer;
}

@keyframes zouchu {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes youchu {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes diannao {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}




.zuo_53 {
    width: 140px;
    position: fixed;
    left: 0;
    top: 100px;
    z-index: 99999;
}

.zuo_53_top {
    width: 100%;
}

.zuo_53_top img {
    width: 100%;
    height: auto;
}

.zuo_53_bottom {
    padding: 0 10px;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    margin-top: -25px;
    position: relative;
}

.zuo_53_bottom .button_53 {
    height: 56px;
    text-align: center;
    background: #3e71cc;
}

.zuo_53_bottom .button_53 > a {
    width: 90%;
    height: 100%;
    display: block;
    line-height: 56px;
    margin: 0 auto;
    font-size: 16px;
    color: #fff;
    border-bottom: 1px dashed #fff;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
}

.zuo_53_bottom .button_53:hover {
    background: #f7bf01;
}

.zuo_53_bottom .button_53:hover > a {
    border-bottom: 1px dashed #f7bf01;
    color: #000;
}

.zuo_53_bottom .button_53 > .border_none {
    border: none;
}

.zuo_53_bottom .kong_53 {
    /* border:1px solid #3e71cc; */
    padding-top: 1px;
    height: 76px;
    background: rgba(214, 214, 214, 0.8);
    background: #d6d6d6 \9;
}

.zuo_53_bottom .kong_53 > a {
    width: 80%;
    display: block;
    margin: 14px auto 0;
    text-align: center;
    font-size: 14px;
    height: 20px;
    line-height: 20px;
    border-radius: 10px;
}

.zuo_53_bottom .kong_53 > .lan {
    color: #fff;
    background: #3e71cc;
}

.zuo_53_bottom .kong_53 > .lan:hover {
    color: #000;
    background: #f7bf01;
}

.zuo_53_bottom .kong_53 > .huang {
    color: #000;
    background: #f7bf01;
}

.zuo_53_bottom .kong_53 > .huang:hover {
    color: #fff;
    background: #3e71cc;
}