@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?ij4000');
  src:  url('fonts/icomoon.eot?ij4000#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?ij4000') format('truetype'),
    url('fonts/icomoon.woff?ij4000') format('woff'),
    url('fonts/icomoon.svg?ij4000#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-close:before {
  content: "\e900";
}
.icon-cross:before {
  content: "\ea0f";
}
* {
  outline: none;
  border: 0;
}

abbr,acronym,address,applet,big,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,iframe,ins,kbd,label,legend,li,object,ol,pre,q,s,samp,small,span,strike,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,ul,var {
  margin: 0;
  padding: 0;
  outline: 0;
  border: 0;
  vertical-align: baseline;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%
}

html { 
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
   max-width: 640px;
  overflow-x: hidden;
  background: #FFF!important;
  color: rgba(0,0,0,.8);
  font-size:16px;
  line-height: 1.8;
  font-family: "PingFang SC Light","WenQuanYi Micro Hei",Arial,Verdana,Tahoma,sans-serif;
  margin: 0 auto;
  border: 0;
  outline: 0;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-user-select: none;
  -webkit-text-size-adjust: 100%!important
}

a,div {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  outline: 0
}

a {
  color: inherit;
  text-decoration: none
}

a:active,a:hover {
  outline: 0
}

.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.course_page {margin-bottom:50px}
.flex-align-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.course-infomation {
  background: #FFFFFF;
  overflow: hidden;
  padding: 15px 15px 0;
}

.course-infomation .course-title {
  margin-bottom: 10px;
  line-height: 1.6;
  font-size:16px;
  font-weight: bold;
}

.course-infomation .leibie {
  color: #999999;
  margin:10px 0;
}

.course-infomation .sm_xiao {
  color: #ff0000;
}

.course-infomation .sm_da {
  font-size:30px;
  color: #ff0000;
  font-weight: bold;
}

.course-infomation .sm_ks {
  font-size:14px;
}

.course-sm {
  background: #FFFFFF;
}

.course-sm .course-sm_head:before {
  content: '';
  display: block;
  position: absolute;
  width:8px;
  height:14px;
  left: 0;
  top: 50%;
  margin-top: -7px;
  background: #FE0139;
}

.course-sm_head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  padding:20px;
  font-size:18px;
  color: #24252C;
  font-weight: bold;
}

.teacher_body {
  margin: 0 15px;
}

.course-sm_body {
  padding: 0;
  overflow: hidden;
}

.teacher-avatar {
  width:80px;
  height:80px;
  position: relative;
  display: inline-block;
  text-align: center;
}

.teacher-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 100%;
}

.teacher_info {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  max-width: 100%;
  margin-left:14px;
}

.teacher_info .teacher_name {
  font-weight: bold;
  font-size:18px;
}

.teacher_tag span {
  background: #f5f5f5;
  font-size:14px;
  padding: 0 6px;
  margin-right:8px;
  margin-top:5px;
  height:22px;
  line-height:22px;
  border-radius: 22px;
  display: inline-block;
}

.course_des {
  margin:5px 15px;
}
.embedvideo {width: 640px;margin:15px 0;}
.embedvideo iframe {width: 640px;height: 360px}
.course_des p { font-size:16px;line-height:1.8;color: #343434}
.course_des h3{display:inline-block;justify-content:center;align-items: center;height:30px;background-color: #ff6633;line-height:30px;font-size:15px;font-weight: bold; letter-spacing:1.2px;color: #fff;padding:0px 12px;margin:0 0 20px 8px; transform: skewX(-10deg);-webkit-transform: skewX(-10deg);-moz-transform: skewX(-10deg);-o-transform: skewX(-10deg);}
.entry-content p a,.entry-content p a:hover{color:#ff6607;border-bottom: 1px dotted #ff6607;padding-bottom:3px;}
.course_des img {max-width: 640px;height: auto;}
.qrbox{
  position: fixed;
  width: 100%;
  height: 100%; 
  display: none;
  padding:100px 0;
  left: 50%;
  top:-2px;
  margin-left: -50%;
  background: #ffffff;
}
.closeqr { position: fixed; top:10%; right:10%; width:50px; height:50px; display:table-cell;vertical-align:middle; text-align: center; }
.learn-box {position: fixed; bottom:0;max-width:640px; width:100%  }
.learn {text-align:center;background:#ff0000; color:#ffffff;font-size:14px;font-weight: bold; line-height:45px;height:45px; }
.course-qr {margin:0 auto; text-align: center;}
  .course-qrimg {text-align:center; margin:0 auto; width: 70%;}
  .course-qrimg img {padding:30px;;box-shadow:10px rgba(67,72,84,.3); width: 200px; height: auto;}
  .course-tip {margin:20px auto; width: 100%; text-align: center;}
  .course-tip .shima {background:#00b050;color:#FFFFFF;padding:3px 5px;}
  .course-tip .tishi{color:#666666;padding:20px 5px; width:250px; margin:0 auto; font-size: 12px;}
  .pcourse-qr {position:fixed; right:100px;top:120px;border:1px solid #ececec;-webkit-box-shadow:0 0 30px rgba(0,0,0,0.1);box-shadow:0 0 30px rgba(0,0,0,0.15);-webkit-transform:translate3d(0,0px,-2px);transform:translate3d(0,1px,-2px);border-radius:3px;padding:14px;}
.pcourse-qrimg img{width:150px; height: auto;}
.pcourse-qrimg .pcourse-qrtip{ background:#00b050;display: block;font-size: 14px;color: #ffffff;text-align: center;margin-top: 6px}