@font-face {
  font-family: 'shuheiti';
  src: url('../font/阿里妈妈数黑体/阿里妈妈数黑体.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: '微软雅黑';
  src: url('../font/微软雅黑/微软雅黑.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'siyuanheiti';
  src: url('../font/思源黑体旧字形Medium/思源黑体旧字形Medium.otf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* 清除所有元素的内外边距 */
* {
  margin: 0;
  padding: 0;
}

/* 可选：清除body元素的默认边距 */
body {
  margin: 0;
  padding: 0;
  width: 100%;
  font-family: 微软雅黑;
  font-weight: 600;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

body {
	line-height: 24px;
	font: 14px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
}

.header {
  height: 80px;
  padding: 0 50px;
  display: flex;
  justify-content: space-between;

  .logo {
    display: flex;

    .login-des {
      padding-top: 20px;
      margin-left: 10px;

      .logo-cn {
        font-family: shuheiti;
        font-size: 32px;
        letter-spacing: 4px;
        /* 增加字符间距 */
      }

      .logo-en {
         font-size: 10px;
         letter-spacing: 2px;
         margin-left: 15px;
      }
    }

    .logo-img {
      width: 90px;
	  padding-bottom: 13px;
    }
  }


  .item-list {
    padding-right: 30px;

    ul {
      display: flex;
      padding-top: 28px;

      li {
        cursor: pointer;
        margin-left: 47px;
		font-size: 15px;
		font-weight: 600;
      }

      .item-selected {
        color: #4192F7;
        border-bottom: 1px solid #4192F7;
        padding-bottom: 2px;
      }
    }
  }
}

.banner {
  height: 540px;
  background-image: url('../img/banner.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.banner-ej {
  height: 240px;
  background-image: url('../img/banner.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.main-container {
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  .si-title {
    width: 100%;
    height: 32px;
    position: relative;
    border-bottom: 1px solid #efefef;
    .si-top {
      position: absolute;
      right: 0;
      width: calc(100% - 200px);
      top: 0;
    }

    .si-bottom {
      position: absolute;
      left: 0;
      width: 150px;
      bottom: 0;
    }

    .sis {
      display: flex;
      justify-content: space-between;

      .si-des {
        position: relative;
        font-size: 18px;
		border-bottom: 2px solid #4592ff;
        padding-left: 25px;
		line-height: 32px;
        color: #3170E6;
        font-weight: 600;

        img {
          position: absolute;
          height: 18px;
          top: 5px;
          left: 0;
        }
      }

      .si-more {
        cursor: pointer;
        line-height: 30px;
      }
    }
  }

  .show-container1 {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    .sc1-left {
      width: 57%;
.sc1-inner {
        margin-top: 20px;
       

        img {
          height: 15px;
          margin-right: 15px;
        }

        ul {
          li {
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;

            .sc1-linl {
              position: relative;
              padding-left: 12px;
              cursor: pointer;

              img {
                position: absolute;
                top: 6px;
				width: 6px;
			    height: 6px;
                left: 0;
              }
            }

            .time {
              color: #868788;
            }
          }
        }
      }
      
    }
.sc1-inner-ej {
      
       

        img {
          height: 15px;
          margin-right: 15px;
        }

        ul {
          li {
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;
			line-height: 35px;
			border-bottom:1px dashed #eee;

            .sc1-linl {
              position: relative;
              padding-left: 12px;
              cursor: pointer;

              img {
                position: absolute;
                top: 14px;
				width: 6px;
			    height: 6px;
                left: 0;
              }
            }

            .time {
              color: #868788;
            }
          }
        }
      }
    .sc1-right {
      width: 40%;
	  float: right;
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      img {
        cursor: pointer;
        width: 100%;
		margin-bottom:10px;
      }
    }
  }

  .show-container2 {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;

    .sc2-left {
      width: 48%;

      .sc2-inner {
        margin-top: 10px;

        ul {
          li {
            padding: 5px 0px 5px 5px;
            border: 1px solid #E4E3E3;
            margin-bottom: 5px;

            .sc2-linl-top {
              color: #3170E6;
              font-size: 14px;
            }

            .sc2-linl-bottom {
              display: flex;
              justify-content: space-between;
              color: #6D7278;
              font-size: 14px;
              margin-top: 3px;
			  
			  div{ margin-right: 30px;}
            }
          }
        }
      }
    }
.sc2-inner-ej {
        margin-top: 20px;

        ul {
          li {
            padding: 10px 80px 10px 10px;
            border: 1px solid #E4E3E3;
            margin-bottom: 15px;
			width:39.8%; margin-left: 1%; margin-right:1%;float: left;

            .sc2-linl-top {
              color: #3170E6;
              font-size: 14px;
            }

            .sc2-linl-bottom {
              display: flex;
              justify-content: space-between;
              color: #6D7278;
              font-size: 14px;
              margin-top: 10px;
			  
			  div{ margin-right: 30px;}
            }
          }
        }
      }
    .sc2-right {
      width: 50%;

      .sc2-inner {
        margin-top: 20px;
        width: 100%;

        .sc2-input {
          display: flex;
          justify-content: space-between;
          margin-bottom: 15px;

          .input-com {
            width: 49%;
            position: relative;

            select,
            input {
              width: calc(100% - 20px);
              height: 30px;
              border: 1px solid #CCCCCC;
              padding-left: 15px;
            }


            select::selection {
              background: transparent;
              /* 移除背景色 */
              color: inherit;
              /* 继承父元素的文字颜色 */
            }

            input:focus {
              outline: none;
            }

            img {
              position: absolute;
              right: 13px;
              top: 9px;
              width: 15px;
            }
          }
        }
      }
    }
  }

  .show-container5 {
    width: 100%;

    .sc3-select {
      width: 100%;
      padding-bottom: 10px;
	  padding-top: 10px;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
	  display:flex;
    
      

      .sc3-i {
       
		margin-right:5%;
        width: 400px;
        height: 150px; 
		margin-bottom: 15px;
        background: #fff;
		border: 1px solid #bdd9f0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        border-radius: 20px;
        padding: 15px 1%;
		cursor: pointer;
        .sc3-i-img {
          height: 125px;
          width: 125px;
          margin-right: 20px;
		  float:left;
		  margin-top: 15px;

          img {
            height: 100%;
            width: 100%;
          }
        }

        .sc3-i-des {
			width: 200px;    float:left;
          .school {
            font-size: 16px;
			height:30px;
			line-height: 30px;
			overflow: hidden;
            margin-top: 5px;
          }

          .address {
            font-size: 12px;
            color: #3B83F9;
			line-height: 20px;
			height: 20px; 
			overflow: hidden;
          }

          .info {
            font-size: 14px;
            color: #666666;
            line-height: 20px;
			margin-top:5px;
		    height: 80px; 
			overflow: hidden;
          }
        }


      }
    }

  }
  
  
.show-container3 {
    width: 100%;
    height: 300px;

    .sc3-select {
      width: 100%;
      padding-bottom: 10px;
	  padding-top: 10px;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
    
      

      .sc3-i {
        float: left;
		margin-right: 20px;
        width: 345px;
        height: 150px; 
		margin-bottom: 15px;
        background: #fff;
		border: 1px solid #bdd9f0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        border-radius: 20px;
        padding: 15px;

        .sc3-i-img {
          height: 125px;
          width: 125px;
          margin-right: 20px;
		     float:left;
          margin-top: 15px;
          img {
            height: 100%;
            width: 100%;
          }
        }

        .sc3-i-des {
			width: 200px;    float:left;
          .school {
            font-size: 16px;
			height:30px;
			line-height: 30px;
			overflow: hidden;
            margin-top: 5px;
          }

          .address {
            font-size: 12px;
            color: #3B83F9;
			line-height: 20px;
			height: 20px; 
			overflow: hidden;
          }

          .info {
            font-size: 14px;
            color: #666666;
            line-height: 20px;
			margin-top:5px;
			height: 80px; 
			overflow: hidden;
          }
        }


      }
    }

  }

  .show-container4 {
    margin-top: 10px;

    .sc1-inner {
      ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;

        li {
          width: 23%;
          margin-bottom: 15px;
		  margin-top: 15px;
          height: 200px;
          background:#e1eaf9;
          border-radius: 8px;

          img {
            width: 90%;
            height: 136px;
			border-radius: 8px;
            margin: 15px 5% 10px 5%;
          }

          div {
            
            font-size: 14px;
			line-height: 28px;
			height: 28px;
			overflow: hidden;
			text-align: center;
            font-family: siyuanheiti;
          }
        }

        :nth-child(1) {
          margin-right: 2.5%;
        }

        :nth-child(2) {
          margin-right: 2.5%;
        }

        :nth-child(3) {
          margin-right: 2.5%;
        }

        :nth-child(5) {
          margin-right: 2.5%;
        }

        :nth-child(6) {
          margin-right: 2.5%;

        }

        :nth-child(7) {
          margin-right: 2.5%;
        }

      }
    }
  }

  .page {
    display: flex;
    justify-content: center;
    margin-top: 20px;

    div {
      margin-left: 10px;
      height: 20px;
    }

    :nth-child(1) {
      padding: 5px 5px;
      background-color: #DEDEDE;
      color: #fff;
	  border-radius: 3px;
    }

    :nth-child(2) {
      padding: 5px 5px;
      background-color: #DEDEDE;
      color: #fff;
	  border-radius: 3px;
    }

    :nth-child(3) {
      padding: 5px 10px;
      background-color: #4192F7;
	  color:#fff;
	  border-radius: 3px;
    }

    :nth-child(4) {
      padding: 5px 10px;
      background-color: #DEDEDE;
      color: #fff;
	  border-radius: 3px;
    }

    :nth-child(5) {
      padding: 5px 10px;
	  border-radius: 3px;
    }

    :nth-child(6) {
      input {
        background-color: unset !important;
        color: #000;
        border: 1px solid #DEDEDE;
		border-radius: 3px;
      }
    }

    :nth-child(7) {
      padding: 5px 10px;
	  border-radius: 3px;
    }

    :nth-child(8) {
      padding: 5px 5px;
      background-color: #DEDEDE;
      color: #fff;
	  border-radius: 3px;
    }

    :nth-child(9) {
      padding: 5px 5px;
      background-color: #DEDEDE;
      color: #fff;
	  border-radius: 3px;
    }

    :nth-child(10) {
      padding: 5px 10px;
	  border-radius: 3px;
    }

  }
}

.footer {
  display: flex;
  height: 70px;
  background-color: rgb(70, 146, 255, 0.18);
  padding-top: 10px;

  .fl {
    width: 40%;
    display: flex;
    position: relative;
    margin-left: 70px;

    img {
      height: 60px;
      width: 60px;
      position: absolute;
    }

    .fl-des {
      margin-left: 70px;

    }
  }

  .fm {
    width: 30%;
  }

  .fr {
    width: 30%;
    display: flex;
    justify-content: flex-end;
    margin-right: 50px;

    img {
      height: 60px;
      width: 60px;
      margin-left: 20px;
    }
  }
}



.body-bottom {
  width: 100%;
  height: 150px;
}

.bottom-line {
  height: 6%;
  background: rgb(65, 154, 255);
}

.bottom-box {
  background: url(../img/bottom.png)no-repeat;
  background-size: 100% 100%;
  height: 94%;
}

.bottom-main {
  width: 84%;
  height: 100px;
  margin: 0 auto;
  padding-top: 20px;
  display: flex;
}

.bottom-main-left {
  width: 70%;

  a {
    border: 0;
    margin: 0;
    padding: 0;
    font-size: 100%;
    text-decoration: none;
  }

  img {
    float: left;
    width: 70px;
    height: 70px;
    margin-top: 10px;
    margin-right: 10px;
  }
}

.bottom-main-list {
  margin-left: 90px;
}

.bottom-main-right {
  width: 30%;
}

.bottom-main-list .bottom-main-title-h1 {
  font-family: 'microsoft yahei';
  font-size: 14px;
  font-weight: 600;
  margin-right: 5px;
}

.bottom-main-list .bottom-main-title-h2 {
  color: #666666;
  font-size: 14px;
  font-family: unset;
  font-weight: unset;
}

.bottom-main-list>.bottom-main-title1 {
  margin-top: 9px;
}

.bottom-main-list>.bottom-main-title2 {
  margin-top: 6px;
}

.bottom-main-list>.bottom-main-title3 {
  margin-top: 12px;
  font-size: 14px;
}

.bottom-main-right .bottom-main-right-list img {
  width: 70px;
  height: 70px;
  float: left;
}

.bottom-main-right .bottom-main-right-list {
  margin-top: 10px;
  display: flex;
  justify-content: space-around;
}

.layui-this {
  color: #3170E6 !important;
  font-weight: 600 !important;
  font-size: 28px !important;
}

.layui-tab-brief {
  position: relative;
  .sc3icon {
    position: absolute;
    height: 18px;
    top: 11px;
    left: 0;
  }
}

.layui-tab-brief>.layui-tab-title .layui-this:after {
  border-bottom: unset !important;
}

.layui-tab-title li {
  color: #6D7278;
  font-weight: 600 !important;
  font-size: 18px !important;
  line-height: 32px;
}
.wz{width: 100%;overflow: hidden;margin: 20px 0}
.wz img{width: 14px;float: left;margin-right: 10px;margin-top: 2px;}
.wz p{float: left;font-size: 14px;color: #3D404E;}
.wz p a:hover{color: #1735C4;}
.clear { clear: both; font-size: 0px; line-height: 0px; height: 0px; overflow: hidden }
.clearfix { display: block; zoom: 1 }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden }
#container {
				overflow: hidden;
				width: 100%;
				height: 665px;
				margin: 0;
				font-family: "微软雅黑";
			}
#container  img{width:100%; height:100%}

.mod_turn_page1 { margin-bottom: 20px; margin-top: 20px; ;}
.mod_turn_page1 .turn_page {line-height: 14px;float: right; }
.mod_turn_page1 a, .mod_turn_page1 span {cursor: pointer; float: left; width: 34px; overflow: hidden; margin-left: 5px; padding: 9px 0; border: 1px solid #F2F2F2; background: #fafafa; color: #999; font-size: 16px; font-family: Arial; text-align: center; }
.mod_turn_page1 a:hover, .mod_turn_page1 .page_cur { border: 1px solid #1582ff; background: #1582ff; color: #fff; }
.mod_turn_page1 .page_break { border: none; background: none; letter-spacing: 2px; font-weight: bold; font-family: "Microsoft Yahei"; }
.mod_turn_page1 .page_start, .mod_turn_page1 .page_prev, .mod_turn_page1 .page_next, .mod_turn_page1 .page_end { width: 82px; *padding-top:6px;*padding-bottom:12px;font-size: 14px; font-family: "Microsoft Yahei"; }
.mod_turn_page1 .page_start i, .mod_turn_page1 .page_prev i { margin-right: 7px; background-position: 0 -110px; }
.mod_turn_page1 .page_next i, .mod_turn_page1 .page_end i { margin-left: 7px; background-position: 0 -125px; }
.mod_turn_page1 .page_prev:hover i { background-position: 0 -140px; }
.mod_turn_page1 .page_next:hover i { background-position: 0 -155px; }

.warp { width:100%; margin-left: auto; margin-right: auto;}
.box {
	width: 100%;
	padding-top: 1px;
	padding-bottom: 1px;
}

.platform_map{
	padding: 5px;
	box-sizing: border-box;
	height: 550px;
	background: #fff;
}
.map_left{
	height: 100%;
	display: inline-block;
	border-right: 6px solid #abc4f0;
	width: 57%;
}
.info_right{
	float: right;
	width: 40%;
}
.screen{
	font-size: 0;
	margin-top:20px;
}
.screen select{
	border: 1px solid #a9abae;
	width: 110px;
	height: 42px;
	font-size: 14px;
	color: #999999;
	padding: 0 5px;
	box-sizing: border-box;
	margin-right: 12px;
	outline: none;
	appearance:none;  
	-moz-appearance:none;  
	-webkit-appearance:none;
	background: url("../images/arrow.png") no-repeat;
	background-size: 13px 7px;
	background-position: 90%;
	float: left;
}
.seek2{
	width: 130px !important;
	border: 1px solid #a9abae !important;
	margin-top: 0 !important;
}

.seek3{
	width: 180px !important;
	border: 1px solid #a9abae !important;
	margin-top: 0 !important;
}
.seek_ico{
	display: inline-block;
	width: 60px;
	height: 41px;
	background: #0084ff;
	text-align: center;
	position: relative;
	margin-left:10px;
}
.seek_ico img{width: 25px;position: relative;top:8px;}
.info_list{
	width: 100%;
	height: 545px;
	margin-top: 10px;
}
.l_p1{
	font-size: 16px;
	color: #232323;
	display: inline-block;
	  white-space: nowrap; 
	  width: 100%; 
	  overflow: hidden;
	  text-overflow:ellipsis;
	  margin-top: 10px;
}
.l_p2{
	font-size: 12px;
	color: #999999;
	display: inline-block;
	  white-space: nowrap; 
	  width: 100%; 
	  overflow: hidden;
	  text-overflow:ellipsis;
}
.list_li2{
	height: 100px;
	border-bottom: 1px solid #cccccc;
}
.li_div{
	display: inline-block;
	float: left;
	width: 400px;
	overflow: hidden;
}
.map{
	width: 27px;
	margin-top: 28px;
	float: left;
}
.li_div_r{
	display: inline-block;
	float: right;
	text-align: center;
}
.r_p1{
	font-size: 18px;
	color: #b10808;
	display: inline-block;
	 margin-top: 15px;
}
.r_p2{
	font-size: 12px;
	color: #999999;
}

#pageMain li:nth-child(4n) .module_li2 {
	margin-right: 0 !important;
}

#containet {
	height: 440px;
}

#pageMain {
	height: 410px;
	width: 100%;
}

#pageMain li {
	list-style: none;
	line-height: 22px;
}

#pageBox {
	padding: 18px 0 0 0;
	text-align: center;
}

#pageBox span {
	display: inline-block;
	width: 60px;
	height: 26px;
	line-height: 24px;
	text-align: center;
	font-size: 12px;
	color: #6c6c6c;
	background: #fff;
	border: 1px solid #d5d5d5;
	border-radius: 3px;
	margin-right: 6px;
}

#pageNav {
	display: inline-block;
	font-size: 0;
}

#pageNav a {
	display: inline-block;
	width: 24px;
	height: 24px;
	line-height: 24px;
	text-align: center;
	font-size: 12px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	border: 1px solid #d5d5d5;
	border-radius: 3px;
	margin-right: 6px;
}

#pageNav a.active,
#pageNav a:hover {
	background: #2282fd;
	color: #fff;
	border: 1px solid #2282fd;
}
#prev:hover {
	cursor: pointer;
}
#next:hover {
	cursor: pointer;
}
.nav_p{
	height: 42px;
	width: 100%;
	background: #fff;
	margin: 15px 0;
	line-height: 42px;
	font-size: 14px;
	color: #0f0f0f;
}
.nav_p img{
	margin-left:13px;
}
.nav_p a{
	font-size: 14px;
	color: #0f0f0f;
	margin:0 10px ;
}
.policy_zone{
	background: #fff;
	width: 100%;
	padding: 15px 42px 0 30px;
	box-sizing: border-box;
	margin-bottom: 20px;
}
.list_li{
	height: 44px;
	line-height: 44px;
	font-size: 14px;
	color: #0f0f0f;
	border-bottom: 1px dashed #cccccc;
}
.list_li a{
	font-size: 14px;
	color: #0f0f0f;
	line-height: 44px;
}
.list_li span{
	font-size: 14px;
	color: #888888;
	float: right;
	line-height: 44px;
}
.hei570{height: 570px !important;}
.hei500{height: 500px !important;}

.seek_ipt {
    height: 41px;
    width: 772px;
    border: 1px solid #d9d9d9;
    font-size: 14px;
    padding: 0 10px;
    box-sizing: border-box;
    margin-top: 20px;
}

  .sc3-i:nth-child(3n) {
            margin-right: 0!important;
        }
		
		#pageMain li:nth-child(4n) .module_li2 {
	margin-right: 0 !important;
}

#containet1 {
	height: 540px;
}

#pageMain1 {
	height: 500px;
	width: 100%;
}

#pageMain1 li {
	list-style: none;
	line-height: 22px;
}

#pageBox1 {
	padding: 18px 0 0 0;
	text-align: center;
}

#pageBox1 span {
	display: inline-block;
	width: 60px;
	height: 26px;
	line-height: 24px;
	text-align: center;
	font-size: 12px;
	color: #6c6c6c;
	background: #fff;
	border: 1px solid #d5d5d5;
	border-radius: 3px;
	margin-right: 6px;
}

#pageNav1 {
	display: inline-block;
	font-size: 0;
}

#pageNav1 a {
	display: inline-block;
	width: 24px;
	height: 24px;
	line-height: 24px;
	text-align: center;
	font-size: 12px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	border: 1px solid #d5d5d5;
	border-radius: 3px;
	margin-right: 6px;
}

#pageNav1 a.active,
#pageNav1 a:hover {
	background: #2282fd;
	color: #fff;
	border: 1px solid #2282fd;
}
#prev1:hover {
	cursor: pointer;
}
#next1:hover {
	cursor: pointer;
}

.contba {
    margin-top: 15px;
    padding-top: 10px;
    color: #474747;
    border-top: 3px solid #99b0d2;
    width: 100%;
    background-color: #FFFFFF;
    height: 50px;
}

.bs {
    width: 100%;
    background-color: #eaf2fa;
    min-width: 1200px;
}

.bs>div {
    width: 94%;
    margin: 0 auto;
    line-height: 32px;
    overflow: hidden;
    padding: 20px 0;
}

.bs>div>b {
    width: 80px;
    display: block;
    float: left;
    margin: 0 10px 0 23%;
}

.bs>div>p {
    float: left;
    text-align: left;
}

.bs a {
    font-size: 14px;
	padding: 0;
    list-style: none;
    text-decoration: none;
    outline: none;
    border: 0;
    font-family: "寰蒋闆呴粦";
    color: #282828;
}

.bs>div>p a {
    margin: 0 6px;
}

.dt-right{
	width: 18%;
    margin-top: 50px;
    height: 40%;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    position: absolute;
    z-index: 100;
    bottom: 19%;
    left: 35%;
}

.dtleft-top {
    width: 100%;
    height: 36px;
    background: #14A5FF;
    text-align: center;
    line-height: 36px;
    color: #fff;
    font-size: 15px;
}

.rd {
    width: 100%;
    height: 90%;
    overflow-y: scroll;
    overflow-x: hidden;
}

.dt2 {
    width: 94%;
    padding: 10px 3%;
    border-bottom: 1px solid #eaeaea;
    overflow: hidden;
    cursor: pointer;
}

.dtspan {
    float: right;
    font-size: 14px;
    width: 100%;
}

.sdr1 {
    font-size: 15px;
    color: #333;
    font-weight: bold;
    display: block;
    margin-bottom: 4px;
}

.sdr2 {
    font-size: 14px;
    color: #999;
    display: block;
}


    .container2 {
            max-width: 1200px;
            margin: 30px auto;
            padding: 0 20px;
            display: flex;
        }
        
        .course-main {
            flex: 2;
            background-color: white;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            padding: 30px;
            margin-right: 20px;
        }
        
        .course-header {
            display: flex;
            margin-bottom: 20px;
        }
        
        .course-cover {
            width: 300px;
            height: 180px;
            object-fit: cover;
            border-radius: 8px;
            margin-right: 20px;
            background-color: #e0e0e0;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #888;
            font-size: 14px;
        }
		
		.course-cover img{
            width: 100%;
            height: 100%;
        }
        
        
        .course-info {
            flex: 1;
        }
        
        .course-title {
            font-size: 25px;
            color: #1a56a8;
            margin-bottom: 10px;
			margin-top: 10px;
        }
        
        .course-teacher {
            font-size: 15px;
            color: #666;
            margin-bottom: 10px;
        }
        
        .course-category {
            display: inline-block;
            background-color: #f0f7ff;
            color: #1a56a8;
            padding: 5px 10px;
            border-radius: 4px;
            font-size: 18px;
            margin-bottom: 10px;
			margin-top: 10px;
        }
        
        .course-price {
            font-size: 24px;
            color: #ff6b6b;
        }
        
        .course-actions {
          display: flex;
    margin: 30px 5px 30px;
        }
        
        .btn-preview {
            background-color: #f0f7ff;
            color: #1a56a8;
            border: 1px solid #1a56a8;
            padding: 8px 20px;
            border-radius: 4px;
            margin-right: 15px;
            cursor: pointer;
        }
        
       .btn-join {
    background-color: #1a56a8;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
}
        
        .course-tabs {
            display: flex;
            border-bottom: 1px solid #eee;
            margin-bottom: 20px;
        }
        
        .tab {
            padding: 10px 20px;
            cursor: pointer;
        }
        
        .tab.active {
            color: #1a56a8;
            border-bottom: 2px solid #1a56a8;
        }
        
        .course-content h2 {
            font-size: 20px;
            margin: 20px 0 15px;
            color: #1a56a8;
        }
        
        .course-content p {
            line-height: 1.6;
            margin-bottom: 15px;
			font-size:14px;
        }
        
        .course-content ul {
            margin-left: 20px;
            margin-bottom: 15px;
        }
        
        .course-content li {
            margin-bottom: 8px;
        }