/* 公共样式表css */
body, html {
    font: 14px/1.5 "PingFang SC", "微软雅黑", "Microsoft YaHei", Helvetica, "Helvetica Neue", Tahoma, Arial, sans-serif;
}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
a {
    text-decoration: none;
    color: #000;
}
img {
    border: 0;
}
body {
    background: #fff;
    color: #666;
}
html, body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, p, blockquote, pre, button, fieldset, form, input, legend, textarea, th, td {
    margin: 0;
    padding: 0;
}
a {
    text-decoration: none;
    color: #08acee;
}
button {
    outline: 0;
}
img {
    border: 0;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: inherit;
    outline: none;
}
li {
    list-style: none;
}
a {
    color: #666;
}
a:hover {
    color: #eee;
}
.clearfix::after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.clearfix {
}
/* banner */
body .bk {
    width: 100%;
    height: 490px;
    position: absolute;
    top: 0;
    transition: all .3s;
}
body .bk {
    height: 180px;
    opacity: .3;
    -webkit-filter: blur(100px);
    -moz-filter: blur(100px);
    -o-filter: blur(100px);
    -ms-filter: blur(100px);
    filter: blur(100px);
 filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='100');
}
body .bk, div {
    background-size: cover
}
.banner-box {
    padding-top: 32px
}
.g-banner {
    position: relative;
    height: 444px;
    overflow: hidden;
    width: 1152px;
    margin: auto;
    background-color: #fff;
    border-radius: 8px
}
.g-banner .g-banner-content {
    position: relative;
    float: left;
    width: 936px
}
.g-banner .g-banner-content .g-banner-box {
    position: relative;
    height: 316px;
    width: 936px;
}
.g-banner .banner-anchor {
    position: absolute;
    top: 50%;
    margin-top: -30px;
    width: 36px;
    height: 60px;
    overflow: hidden;
    font-size: 24px;
    color: rgba(255,255,255,.6);
    text-align: center;
    line-height: 60px;
    text-shadow: 0 2px 4px rgba(7,17,27,.6)
}
.g-banner .next {
    right: 0;
    border-radius: 4px 0 0 4px
}
.g-banner .prev {
    left: 0;
    border-radius: 0 4px 4px 0
}
.g-banner .next:hover, .g-banner .prev:hover {
    color: #fff;
    background: rgba(7,17,27,.6)
}
.g-banner .g-banner-box>a:first-child .banner-slide {
    display: block
}
.g-banner .banner-slide {
    position: relative;
    height: 100%;
    z-index: 0;
}
.g-banner .banner-slide img {
    height: 316px;
    width: 936px;
}
.g-banner .inner {
    position: relative;
    width: 1200px;
    margin: 0 auto
}
.g-banner .banner-dots {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    text-align: right;
    padding-right: 24px;
    line-height: 12px
}
.g-banner .banner-dots li {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-left: 8px;
    background: rgba(7,17,27,.8);
    border: 1px solid rgba(255,255,255,.6);
    transition: transform .2s;
    cursor: pointer
}
.g-banner .banner-dots li.on {
    background: #FFF;
    border: 1px solid rgba(7,17,27,.4)
}
.menuwrap, .submenu {
    position: absolute;
    top: 0;
    height: 444px
}
.menuwrap {
    background-color: rgba(7,17,27,.5);
    opacity: .502;
    left: 0;
    width: 216px;
    z-index: 1
}
.submenu {
    background: #fff;
    left: 216px;
    width: 768px;
    z-index: 581;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,.1)
}
.submenu .subinnerBox {
    overflow: hidden
}
.submenu .banner-line {
    position: relative;
    height: 1px;
    margin: 35px 0 23px;
    background-color: rgba(77,85,93,.08)
}
.submenu .banner-line span {
    position: absolute;
    top: -12px;
    left: 0;
    padding-right: 12px;
    font-size: 14px;
    font-weight: 700;
    color: #F20D0D;
    line-height: 24px;
    background-color: #fff
}
.submenu .tag-box {
    font-size: 0
}
.submenu .tag-box a {
    margin-bottom: 16px;
    font-size: 14px;
    color: #4D555D;
    line-height: 22px;
    margin-right: 24px;
    display: inline-block
}
.submenu .tag-box a:last-child {
    margin-right: 0
}
.submenu .subinnerBox .title {
    color: #07111b;
    font-size: 16px;
    line-height: 16px;
    margin-top: 32px;
    font-weight: 700;
    margin-bottom: 13px
}
.submenu .subinnerBox .recommend {
    margin-top: 33px;
    margin-bottom: 16px
}
.submenu a:hover {
    color: #f01414!important
}
.submenu .subinnerBox .title a:hover {
    color: #f01414
}
.menuContent {
    position: relative;
    float: left;
    width: 216px;
    height: 444px;
    z-index: 2;
    padding-top: 12px;
    background: #2b333b;
    border-bottom-left-radius: 4px;
    font-weight: 400
}
.menuContent .item .box a:hover {
    color: #f01414!important
}
.menuContent .item {
    height: 60px;
    line-height: 60px;
    font-size: 12px;
    cursor: pointer;
    padding-left: 12px;
    position: relative
}
.menuContent .item>a {
    display: block;
    color: rgba(255,255,255,.6);
    padding: 0 16px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    height: 60px;
    transition: all .1s
}
.menuContent .item i {
    position: absolute;
    right: 8px;
    top: 21px;
    color: rgba(255,255,255,.5);
    font-size: 16px
}
.menuContent .item .box a {
    color: #fff!important
}
.menuContent .on a {
    color: #fff;
    background-color: rgba(255,255,255,.3)
}
.g-banner {
    background-color: #93999f;
    box-shadow: 0 12px 24px 0 rgba(7,17,27,.2)
}
.path-banner {
    width: 936px;
    height: 128px;
    overflow: hidden;
    box-shadow: 0 4px 8px 0 rgba(7,17,27,.1);
    background-color: #fff;
    text-align: center;
    padding: 0 18px
}
.path-banner i {
    display: inline-block;
    width: 36px;
    height: 36px;
    background: url(../images/path_new.png) no-repeat;
    background-size: 100%;
    margin-top: 22px
}
.container-types .wonderful-list .wenda-tit, .path-banner>a {
    display: block;
    transition: all .3s
}
.path-banner .i-web {
    background-position: center 0
}
.path-banner .i-php {
    background-position: center -36px
}
.path-banner .i-java {
    background-position: center -72px
}
.path-banner .i-android {
    background-position: center -108px
}
.path-banner .i-ios {
    background-position: center -144px
}
.path-banner>a {
    float: left;
    font-size: 0;
    width: 180px;
    height: 128px;
    overflow: hidden
}
.path-banner>a:hover {
    margin-top: -4px
}
.path-banner .tit {
    font-size: 14px;
    color: #07111B;
    letter-spacing: 1px;
    margin-top: 4px
}
.path-banner .desc {
    font-size: 12px;
    color: #93999F;
    line-height: 16px;
    margin-top: 2px;
    font-weight: 400
}
.submenu .innerBox {
    background-color: #fff;
    padding: 12px 48px 32px;
    position: relative;
    min-height: 150px
}
.submenu .innerBox .bkimg {
    position: absolute;
    bottom: 0;
    right: -1px
}
.recomment-box {
    position: absolute;
    bottom: 0;
    background: #F8FAFC;
    padding: 36px 0 0 48px
}
.recomment-box a {
    display: block;
    width: 100%;
    height: 100%
}
.recomment-box .adsense-box {
    width: 312px;
    height: 64px;
    background-color: #ccc;
    border-radius: 4px;
    margin-right: 48px
}
.recomment-box .banner-course-card {
    width: 312px;
    height: 60px;
    margin-right: 48px;
    margin-bottom: 36px
}
.recomment-box .banner-course-card img {
    width: 64px;
    height: 42px;
    border-radius: 4px;
    background-color: #ccc
}
.recomment-box .banner-course-card .course-card {
    margin-left: 16px
}
.recomment-box .banner-course-card .course-card-name {
    width: 232px;
    font-size: 12px;
    color: #07111B;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}
.recomment-box .banner-course-card .course-card-info, .recomment-box .banner-course-card .course-card-price {
    font-size: 12px;
    color: #4D555D;
    line-height: 20px
}
.recomment-box .banner-course-card .course-card-info span {
    margin-right: 12px
}
.recomment-box .banner-course-card .course-card-price.sales {
    color: #f01414
}
.recomment-box .banner-course-card .course-card-price.studentsales .sales-tip {
    padding: 0;
    border: 0
}
.l {
    float: left;
}
@font-face {
    font-family: imv2;
    src: url(fonts/imv2.eot?elwc2w);
    src: url(fonts/imv2.eot?elwc2w#iefix) format('embedded-opentype'), url(fonts/imv2.ttf?elwc2w) format('truetype'), url(fonts/imv2.woff?elwc2w) format('woff'), url(fonts/imv2.svg?elwc2w#imv2) format('svg');
    font-weight: 400;
    font-style: normal
}
[class*=" imv2-"], [class^=imv2-] {
    font-family: imv2!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.imv2-arrow1_r:before {
    content: "\e5cb";
}
@font-face {
    font-family: icomoon;
    src: url(fonts/icomoon.eot?d8493nx);
    src: url(fonts/icomoon.eot?d8493nx#iefix) format('embedded-opentype'), url(fonts/icomoon.ttf?d8493nx) format('truetype'), url(fonts/icomoon.woff?d8493nx) format('woff'), url(fonts/icomoon.svg?d8493nx#icomoon) format('svg');
    font-weight: 400;
    font-style: normal
}
[class*=" icon-"], [class^=icon-] {
    font-family: icomoon!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.icon-left2:before {
    content: "\e913"
}
.icon-right2:before {
    content: "\e914"
}