.content { max-width: 1200px; width: 100%; margin: 0 auto; position: relative; }

/* 页面导航 */
.header { height: 80px; background: #A64701;border-bottom: 3px solid #943F01}
.header .logo { display: block; position: absolute; left: 10px; top: 4px; }
.nav-open, .nav-close, #J_nav_mask { display: none; }
.nav-bar { float: right;}
.nav-bar > li { float: left; position: relative;}
.nav-bar > li > a { display: block; line-height: 77px;font-size: 1.8em; color: #fff; text-align: center; transition: all .5s ease;padding: 0 20px;border-bottom: 3px solid #A64701; }
.nav-bar > li:hover > a, .nav-bar > li.selected > a { color: #fff; background:#FFA200;border-bottom: 3px solid #DB8B00;}

/* 页脚 */
.footer { text-align: center; line-height: 50px; color: #fff; font-size: 1.6em; background: #A64701;}
.footer span{padding:0 20px;}
body.body-cnav .footer,body.body-cware .footer,body.body-cweb .footer{background:#A64701; color: #fff;border-top: none;}

/*视频样式*/
.video { width: 800px; margin: 0 auto; position: relative; background: #FFFFFF; border: 10px solid #f6f6f6; }
.video .jwplayer { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1000 }
.video .alt { padding-top: 56.25%; height: 0 !important }

.frame-banner{position: relative; z-index: 80; height:250px; background: url('../img/common/frame_banner.png') left bottom no-repeat;border-bottom: 5px solid #FFA200; }
.frame-banner .frame-course-name{padding-top:35px;padding-left: 15%;}

/* 全局隐藏显示 */
.ware-nav-content{ display: none; }
.float-bar{display: none;}
#J_WareJump{display: none}
.body-cware .course-ware-nav { display: block; }
.body-cware .ware-nav-content{display: block}
/*返回顶部*/
.J_goTop { position: fixed; z-index: 89; right: 10px; bottom: -100px; width: 46px; height: 72px; padding: 5px; font-size: 14px; text-align: center; padding-top: 30px; color: #FFF; border-top-left-radius: 23px; border-top-right-radius: 23px; cursor: pointer; background: #A64701 url('../img/common/top.png') center 10px no-repeat ; -webkit-transition: all 0.6s ease-out; -o-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out; transition: all 0.6s ease-out;  }
.body-home .J_goTop{display: none;}

/*1024 - 1199*/
@media only screen and (max-width:1199px) {
  /*导航*/
  .nav-open { display: block; width: 50px; height: 50px; position: absolute; right: 10px; top:15px; z-index: 91; font-size: 1.8em; background: url('../img/common/btn_open_nav.png') center no-repeat; -webkit-background-size: 100%; -o-background-size: 100%; background-size: 100%; -webkit-animation: slideInRight .5s ease; -moz-animation: slideInRight .5s ease; -o-animation: slideInRight .5s ease; animation: slideInRight .5s ease; cursor: pointer; }
  .nav-open.opened { position: fixed; background-image: url('../img/common/btn_close_nav.png'); }
  .nav-box { width: 100%; max-width: 376px; height: 100%; position: fixed; top: 0; right: -100%; z-index: 90; -webkit-transition: right .3s ease; -o-transition: right .3s ease; -moz-transition: right .3s ease; transition: right .3s ease; }
  .nav-box.show { right: 0; }
  .nav-box ul.nav-bar { width: 100%; position: absolute; top: 0px; bottom: 0; padding: 80px 0 0 0; overflow-y: auto; background-color: #404042; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }
  .nav-box ul.nav-bar > li {width: auto; float: none; padding: 0}
  .nav-box ul.nav-bar > li > a { display: block; text-align: center; line-height: 60px; border-bottom: 1px solid #2A2A2E; font-size: 2em; color: #8F8F8F; }
  .nav-box ul.nav-bar > li.selected > a, .nav-box ul.nav-bar > li:hover > a { background: #37BA9A; color: #fff; box-shadow: none; border:none;border-radius: 0;}
  .J_goTop{opacity: .8}
   .frame-banner .frame-course-name{ margin: 20px 0 0 40px}
   .frame-img-change{ margin: 20px 40px 0 0 }
   .content{width: 97.5%;}

}

/*768 - 1023*/
@media only screen and (max-width:1023px) {
  .frame-img-change{display: none;}
  .frame-banner .frame-course-name{ float: none; margin: 0 auto; display: block;}
  .footer span { display: none; }
}

/*640 - 767*/
@media only screen and (max-width:767px) {
  .frame-banner .frame-course-name{padding-left: 0;}
}

/*480 - 639*/
@media only screen and (max-width:639px) {
  .header .logo{top: 5px;}
  .header .logo img { width: 258px; }
  .nav-box ul.nav-bar{padding-top: 60px;}
  .nav-box ul.nav-bar > li > a{font-size: 1.6em; line-height: 40px;}
  .frame-banner .banner{height: 200px;}
  .frame-banner .banner-bottom{display: none}
  .frame-banner .frame-course-name{ max-width: 90%;padding-left: 0; }
}

/*360 - 479*/
@media only screen and (max-width:479px) {
  .header .logo { overflow: hidden; }
  .nav-box { max-width: 256px; }
  .nav-box ul.nav-bar > li > a { line-height: 48px; border-bottom: 1px solid #2A2A2E; }
}

/*320 - 359*/
@media only screen and (max-width:359px) {
  .nav-open{ top: 15px; width: 30px; height: 30px; }
  .header .logo img{width: 200px;}
  .header{height: 60px;}
}