.eExercise_nrX .eExercise_nr_div.eExercise_ylj66{
  background-color: #c1d8ff;
}
.eExercise_nrX .eExercise_nr_div.eExercise_ylj66s{
  background-color: #fcb6c0;
}
.eExercise_nrX .eExercise_nr_div .eEx_zhlx a:hover{
 color: #fff !important;
}
.eExercise_nrX {
  padding-bottom: 0 !important;
}
.eExercise_nrX .eExercise_nr_img {
  max-width: 350px;
  margin: auto;
  margin-top: -35px;
}
.daanYear{
}
.daanLeft{
  width: 50px;
  height: 50px;
  background: url(../images/arrowInto.png) no-repeat center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 15px;
  cursor: pointer;
}
.daanRight{
  width: 50px;
  height: 50px;
  background: url(../images/arrowInto.png) no-repeat center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: rotate(180deg);
  margin-top: 15px;
  cursor: pointer;
}
.daanLeft:hover,
.daanRight:hover{
  background: url(../images/arrowInto1.png) no-repeat center;
}

.eListeningTCDiv {
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  z-index: 99999;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
  padding: 20px;
  justify-content: center;
}
.eListeningTCDiv > div{
  background-color: #fff;
  width: 300px;
  font-size: 18px;
  border-radius: 8px;
  padding: 25px 20px 35px 20px;
  text-align: center;
  cursor: pointer;
 }
 .eListeningTCDiv > div span{
  display: block;
  width: 100%;
  text-align: center;
 }
 .eListeningTCDiv > div img{
  margin-bottom: 20px;
 }
 .eListeningTCDiv > div span{
  line-height: 25px;
  padding-top: 2px;
 }
 .eListeningTCDiv > div span:last-child{
  padding-top: 5px;
 }
 .eListeningTCDiv.active {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
/* 听力测验*/
.eListeningDiv{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.eListeningDiv div{
  width: 16.666666%;
  padding-bottom: 16.666666%;
  height: 0;
  position: relative;
}
.eListeningDiv div a{
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  padding-top: 20%;
  text-decoration: none;
}
.eListeningDiv div a h1{
  color: #fff;
  font-size: 64px;
  margin: 0;
  letter-spacing: 0.1rem;
  font-weight: normal;
  line-height: 60px;
}
.eListeningDiv div a span{
  width: 100%;
  color: #fff;
  font-size: 22px;
  letter-spacing: 0.1rem;
}
.eListeningDiv div:nth-child(1) a{
  background: url(../images/eListeningImg1.png) no-repeat center;
}
.eListeningDiv div:nth-child(2) a{
  background: url(../images/eListeningImg2.png) no-repeat center;
}
.eListeningDiv div:nth-child(3) a{
  background: url(../images/eListeningImg3.png) no-repeat center;
}
.eListeningDiv div:nth-child(4) a{
  background: url(../images/eListeningImg4.png) no-repeat center;
}
.eListeningDiv div:nth-child(5) a{
  background: url(../images/eListeningImg5.png) no-repeat center;
}
.eListeningDiv div:nth-child(6) a{
  background: url(../images/eListeningImg6.png) no-repeat center;
}
.nav_dis1{
  height: 315px;
}
.nav_dis ul li:last-child a{
  border: 0;
}
.eLImg{
  padding-top: 15px;
  margin: 0 -5px;
  display: flex;
  flex-wrap: wrap;
}
.eLImg > div{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.eLImg img{
  max-width: 100%;
  border: 1px solid #30c3dc;
}
.eLImg span{
  padding: 5px;
}
.eLImg span:nth-child(odd){
  width: 52.9%;
}
.eLImg span:nth-child(even){
  width: 47.1%;
}
.eLImg span:nth-child(2){
}
.eLImg p{
  color: red;
  padding-top: 18px;
  padding-bottom: 15px;
  padding-left: 20px;
}
.eListeningHBody .english_bg{
  margin-top: -16px;
}

.indNavX{
  display: flex;
  width: 100%;
  justify-content: center;
}
.indNavX .container{
  display: flex;
  position: relative;
  height: 100%;
}
.indNavX .main_nav{
  position: relative;
  display: flex;
  justify-content: center;
}
.indNavX .main_nav ul li a{
  padding: 9px 15px 0 15px;
}
.indNavX .main_nav ul li .nav_dis a {
  padding: 10px 10px 0 10px;
}
.eListeningBody_ind .container{
  min-width: auto;
}
.eListeningBody_ind .eListening_Main{
  min-height: 690px;
}
.eListeningBody_ind .eListening_Main nav ul a{
  text-decoration: none;
}

.eOralFree > header{
  display: flex;
  margin: 0 -5px;
}
.eOralFree > header div{
  padding: 0 5px;
}
.eOralFree > header a{
  height: 45px;
  line-height: 45px;
  width: 100%;
  background: #fcdbcb;
  border-top: 1px solid #ff9966;
  border-left: 1px solid #ff9966;
  border-right: 1px solid #ff9966;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  text-align: center;
  font-size: 18px;
  color: #d46f3d;
  margin-top: 20px;
  display: block;
  min-width: 130px;
  text-decoration: none;
}
.eOralFree > header .active a{
  background: #ff9966;
  color: #fff;
  height: 50px;
  line-height: 50px;
  margin-top: 15px;
}
.eOralFreeMain{
  border: 1px solid rgba(0,0,0,0.1);
  padding: 10px 15px;
  margin-bottom: 20px;
  display: flex;
  min-height: 400px;
}
.eOralFreeMain .article_p{
  margin-top: 0;
}
.eOralFreeMain .eOralFreeDiv{
  display: none;
  margin-right: 0;
}
.eOralFreeMain .eOralFreeDiv.active{
  display: block;
}
.eOralFreeMain .eoral_q:last-child{
  border: 0;
}
.aMai {
  width: 150px;
  border: 0px;
  outline: none;
  color: #345311;
  background: url(https://www.ezhishi.net/eOralResources/images/mai1.png) no-repeat left center rgba(119, 191, 41, 0.74);
  background-position-x: 10px;
  height: 45px;
  font-size: 16px;
  float: left;
}
.eOralFreeDiv .star_table_tit{
  margin-bottom: 10px;
}
.TextAnswerTC{
  width: 90% !important;
  max-width: 450px;
  height: 510px !important;
}
.TextAnswerTC .layui-layer-title{
  font-size: 16px;
}

.ICTText_202210{
  padding-top: 10px;
}
.ICTTextTop{
  background-color: #99cc00;
  color: #fff;
  padding: 10px 10px 10px 35px;
  margin-bottom: 5px;
  position: relative;
}
.ICTTextTop10{
  padding-left: 45px;
}
.ICTTextTop i{
  font-style: normal;
  position: absolute;
  left: 10px;
}
.ICTTextTop div{
  font-size: 22px;
  color: #fff;
  font-weight:700;
}
.ICTTextTop span{
  font-size: 18px;
  font-family: Atilla,sans-serif !important;
}
.ICTTextTop_one{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.ICTTextBlue{
  color: #00aff0;
  font-size: 17px;
  padding: 5px;
}
.ICTTextBlue span{
  display: block;
  font-weight: bold;
}
.ICTText_202210 p{
  padding:0px 5px 5px 5px;
  margin: 0;
  font-size: 16px;
  font-family: Atilla,sans-serif !important;
  line-height: 20px;
}
.ICTText_202210 ul li{
  list-style: none;
}
.ICTText_PEn{
  padding-bottom: 5px;
}
.ICTText_img1{
  display: flex;
  flex-wrap: wrap;
  padding: 5px 0 15px 0;
}
.ICTText_img1 span{
  width: 25%;
  padding: 2px;
  display: flex;
  align-items: center;
}
.ICTText_202210 img{
  width: 100%;
}
.ICTText_img2{
  display: flex;
  padding: 5px 0 15px 0;
}
.ICTText_img2 span{
  padding: 5px;
}
.ICTText_img2 span:nth-child(1){
  width: 27%;
}
.ICTText_img2 span:nth-child(2){
  width: 35.5%;
}
.ICTText_img2 span:nth-child(3){
  width: 39%;
}
.ICTText_img2  span div{
  color: #bf041f;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
}
.ICTText_imgLeft{
  color: #bf041f;
  font-size: 18px;
  font-weight: bold;
}
b.ICTBxingxing{
  color: #ff0000;
  font-size: 22px;
}
.ICTText_img4{
  display: flex;
}
.ICTText_img4 span{
  padding: 2px;
}
.ICTTextPadB{
  padding-bottom: 10px;
}
.ICTText_img5{
  display: flex;
  flex-wrap: wrap;
}
.ICTText_img5 li{
  padding: 10px 0;
}
.ICTText_img5 li:nth-child(1){
  width: 50%;
}
.ICTText_img5 li:nth-child(2){
  width: 50%;
}
.ICTText_img5 li:nth-child(3){
  width: 100%;
}
.ICTText_img5 li > div:nth-child(2),
.ICTText_img6 li > div:nth-child(2){
  display: flex;
}
.ICTText_img5 li > div:nth-child(2) img,
.ICTText_img6 li > div:nth-child(2) img,
.ICTText_img1 img,
.ICTText_img4 img{
  height: 100%;
}
.ICTText_img6{
  display: flex;
}
.ICTText_img7{
  display: flex;
  padding-top: 10px;
}
.ICTText_img7 li:nth-child(1),
.ICTText_img8 > div{
  position: relative;
  padding-left: 25px;
}
.ICTText_img7 li:nth-child(1) b,
.ICTText_img8 > div b{
  position: absolute;
  left: 0;
  top: 0;
}
.ICTText_img7 li:nth-child(2){
  width: 40%;
  display: flex;
}
.ICTText_img7 li:nth-child(2) span{
  padding: 2px;
}
.ICTText_img8 li{
  display: flex;
}
.ICTText_img8 li span{
  padding: 2px;
}
.ICTText_TextRed{
  color: #bf041f;
  font-size: 16px;
  display: flex;
  line-height: 25px;
  padding: 0 5px;
}
.ICTText_TextRed b.ICTBxingxing{
  color: #00aff0;
}
.ICTText_TextRed span{
  padding-right: 10px;
  position: relative;
  padding-left: 20px;
  display: flex;
  align-items: center;
}
.ICTText_TextRed span b{
  position: absolute;
  left: 0;
}
.ICTText_img9{
  display: flex;
}
.ICTText_img9 span{
  padding: 2px;
}
.ICTText_img10 .ICTText_imgLeft{
  font-weight: normal;
}
.ICTText_img10 footer{
  display: flex;
  flex-wrap: wrap;
}
.ICTText_img10 footer span{
  width: 25%;
  padding: 2px;
}
.ICTText_img10 footer span img{
  height: 100%;
}
.project_nav .row div.col-md-6{
  padding: 0 5px !important;
}
.project_nav .row div.col-md-6 a{
  text-align: left;
}

/* 首页横板登录框 */
.HBLine{
  height: 30px;
  bottom: 65px;
}
.HBlogin{
  margin-top: -60px;
  margin-bottom: 10px;
  width: 1190px;
}
#login.HBloginMain{
  width: 100%;
  left: auto;
  top: auto;
  min-height: auto;
  position: relative;
  box-shadow: none;
  background: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}
#login.HBloginMain::before{
  content: '';
  display: block;
  width: 100%;
  height: 90%;
  position: absolute;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  box-shadow: 0 8px 8px rgb(0 0 0 / 25%);
}
#login.HBloginMain::after{
  content: '';
  display: block;
  background: url(../images/HB_shadowImg.png) no-repeat center top;
  width: 100%;
  height: 40px;
  background-size: 100%;
  position: absolute;
  bottom: -40px;
}
#login.HBloginMain > div{
  position: relative;
  width: 100%;
  z-index: 1;
  /* background: #fff; */
  background: #edffff;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom: 5px solid #f14d76;
  display:flex;
}

#login.HBloginMain > div.HBloginRed{
  background-color: rgba(254,235,240,1);
}
#login.HBloginMain > div.bjC2{
  background: #ffeef2;
  background-color: rgba(255,240,240,1);
  background-color: #ffe8e8;
}
div.bjC2 .HBloginL > div span:nth-child(1) input,
div.bjC2 .HBloginL > div span:nth-child(2) input{
  border: 1px solid #fbb5c7;
}
div.bjC2 .HBloginL{
  border-right: 1px solid #e7d0d6;
}
.HBloginL{
  padding: 10px 15px;
  height: 115px;
  width:65%;
  border-right: 1px solid #ebeff4;
}
.HBloginL h1 {
  font-size: 24px;
  padding-bottom: 10px;
  padding-left: 15px;
  font-weight: bold;
  color: #f53a69;
  margin: 0;
}
.HBloginL h1 a{
  color: #f53a69;
  cursor: text;
  text-decoration: none;
}
.HBloginL h1 span{
  font-size: 22px;
  font-weight: normal;
  padding-left: 5px;
}
.HBloginL > div{
  display: flex;
}
.HBloginL > div span{
  display: block;
  margin: 0 8px;
}
.HBloginL > div span input{
  width: 100%;
  line-height: 50px;
  height: auto;
  border: 0;
  border-radius: 13px;
  padding: 0 10px 0 48px;
  font-size: 16px;
  height: auto;
}
.HBloginL input::-webkit-input-placeholder{color:rgba(167,179,209,.7) !important;}
.HBloginL input::-moz-placeholder{  color:rgba(167,179,209,.7) !important;}
.HBloginL input:-moz-placeholder{ color:rgba(167,179,209,.7) !important;}
.HBloginL input:-ms-input-placeholder{ color:rgba(167,179,209,.7) !important;}

.HBloginL > div span:nth-child(1) input{
  background: url(../images/HB_into5.png) no-repeat left 10px center #f5f7fb;
  background: url(../images/HB_into5.png) no-repeat left 10px center #fff;
  border: 1px solid #dde9ec;
}
.HBloginL > div span:nth-child(2) input{
  background: url(../images/HB_into6.png) no-repeat left 10px center #f5f7fb;
  background: url(../images/HB_into6.png) no-repeat left 10px center #fff;
  border: 1px solid #dde9ec;
}
.HBloginL > div span:nth-child(1){
  width:55%;
}
.HBloginL > div span:nth-child(2){
  width: 30%;
}
.HBloginL > div span:nth-child(3){
  width: 15%;
  min-width: 110px;
}
.HBloginR{
  display: flex;
  align-items: center;
  padding: 10px 5px;
  width: 40%;
}
.HBloginR ul{
  display: flex !important;
  width: 100%;
}
.HBloginR button{
  border: 0;
  position: relative;
  background: none;
  color: #25355e;
  font-size: 14px;
}
.HBloginR button::before{
  content: '';
  width: 50px;
  height: 50px;
  display: flex;
  background-size: 100%;
  justify-content: center;
  margin: auto;
}
.HBloginR button span{
  display: block;
  font-size: 15px;
}
button.GetPasswordHB{
  min-width: 110px;
}
button.LoginHelpHB{
  min-width: 100px;
}
button.FreeTrialHB{
  min-width: 95px;
}
button.HomeSubscribeHB{
  min-width: 120px;
}
button.GetPasswordHB::before{
  background: url(../images/HB_into1.png) no-repeat center;
}
button.LoginHelpHB::before{
  background: url(../images/HB_into2.png) no-repeat center;
}
button.FreeTrialHB::before{
  background: url(../images/HB_into3.png) no-repeat center;
}
button.HomeSubscribeHB::before{
  background: url(../images/HB_into4.png) no-repeat center;
}
button.txt_login{
  background-color: #ff3c86;
  background-color: #f53a69;
  color: #fff;
  padding: 0 15px;
  line-height: 50px;
  font-size: 18px;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: 13px;
  letter-spacing: 0.05rem;
  min-width: 110px;
  padding: 0 10px;
  font-size: 17px;
}
.HBloginR ul li button i{
  font-style: normal;
}
.HBloginL input:focus {
  border-color: #66afe9;
  outline: 0;
}
.notice_2023{
  position: relative;
  z-index: 1000;
  padding: 0 5px;
}
.indNavXHB .main_nav > ul{
  display: flex;
  align-items: center;
  overflow: hidden;
}
.indNavXHB .main_nav > ul > li > a{
  padding: 5px 13px;
}
.indNavXHB .main_nav > ul > li > a span{
  display: flex;
  font-size: 17px;
}
.indNavXHB .main_nav > ul > li > a:hover{
  padding-top: 8px;
}
.indNavXHB .main_nav > ul > li > a:hover span{
  margin-top: 1px;
}
.indNavXHB .main_nav img{
  width: 2px;
  height: 25px;
  background-size: auto 100%;
  padding: 0;
}
.yearC{
  display: block;
    font-weight: normal;
    font-size: 30px;
    color: #ff402c;
    padding-bottom: 3px;
}
.fen2023{

}

/* 背景色 */
.SX_bjC{
  background: #fff3f5;
  background: #fffafb;
  background: #f8fdff;
}
.SX_bjC .icon_tit{
  background-color: #fff;
}
.SX_bjC #login.HBloginMain::after{
  background-image: url(../images/HB_shadowImgX.png);
}
.SX_bjC .other_list{
  background-color: #fff;
}

.SX_bjC2{
  background: #f8fdff;
}
.SX_bjC2 .star_bg{
  background-image: url(../images/bg_06_1.png);
}
.SX_bjC .star_bg{
  background-image: url(../images/bg_06_1.png);
}

.HideDiv{
  display: none;
}
.SX_bjC .ezhishi_star .box{
  background-color: #fff;
}
.top_xm .icon_b2{
  display: flex;
  justify-content: flex-end;
}
.top_xm .icon_r2{
  width: auto;
}
.top_xm .icon_r2 a:last-child{
  display: none;
}
.SX_ebooks{
  max-width: 1199px;
  margin: auto;
  position: relative;
}
.SX_ebooks > span{
  width: 100%;
  position: relative;
  height: 0;
  padding-bottom: 75%;
  display: flex;
}
.SX_ebooks > span > iframe{
  width: 100%;
  height: 100%;
  position: absolute;
}
.SX_ebooksNav a{
  display: flex;
  justify-content: center;
}
.SX_ebooks .videolist{
  position: absolute;
  bottom: 30px;
  left: 50%;
  margin-left: 180px;
}
.videos{
  z-index: 100001;
}
.SchoolSubscribeMain{
  background-color: #f7fbfd;
}
.top_xmN{
  border-bottom: 2px solid #eb2756;
}
.top_xmN .icon_r2{
  display: flex;
  padding-top: 15px;
}
.top_xmN .icon_r2 a {
  margin-left: 5px;
  margin-right: 10px;
  display: flex;
  align-items: end;
}
.SchoolSubscribeMain .bdmain{
  margin: 0;
  padding: 15px;
  box-shadow: 0 0 3px rgb(0 0 0 / 10%);
}
.SchoolSubscribeMain .bdmain > div {
  margin-bottom: 15px;
  display: flex;
  flex-wrap: wrap;
}
.SchoolSubscribeMain .bdmain > div > div:nth-child(2){
  background-color: #f6fafd !important;
  border: rgba(0, 0, 0, 0.08) solid 1px;
  border-top: 0;
  padding: 0px !important;
}
.SchoolSubscribeMain #update{
  display: flex;
  flex-wrap: wrap;
}
.SchoolSubscribeMain #update >div{
  width: 50%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-right: 1px solid rgba(0, 0, 0, 0.08);
  padding: 10px;
}
.SchoolSubscribeMain #update >div:nth-last-child(1),
.SchoolSubscribeMain #update >div:nth-last-child(2){
  border-bottom: 0;
}
.SchoolSubscribeMain #update >div:nth-child(even){
  border-right: 0;
}
.SchoolSubscribeMain #update >div label{
  display: flex;
}
.SchoolSubscribeMain #update >div label input{
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 3px;
  outline: 0;
  background-color: #fff;
  padding: 10px;
  max-width:none !important;
}
.SchoolSubscribeMain #update >div label div{
  min-width: 150px;
  display: flex;
  justify-content: flex-end;
  align-items: center;

}
.SchoolSubscribeMain .AddOn{

}
.SchoolSubscribeMain input[type=checkbox]:after {
  content: "";
  display: block;
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  min-width: 25px;
  font-size: 26px;
  color: #f1eff0;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 5px;
  background: url(https://www.ezhishi.net/SchoolSubscribe/images/chkbg.jpg) no-repeat center #fff;
  /*box-sizing: border-box;*/
  margin: -1px;
  background-size: 80%;
  position: absolute;
}

.SchoolSubscribeMain input[type=checkbox]:checked:after {
  content: '\2714';
  background: #4bbef5;
  color: #fff;
  border: 1px solid #4bbef5;
  font-size: 20px;
}
.labelDiv{
  font-size: 16px;
  padding: 5px 15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-left: 1px solid rgba(0, 0, 0, 0.08);
  background: #fff;
}
.labelDiv label{
  display: flex;
  align-items: center;
  min-height: 40px;
  cursor: pointer;
}
.labelDiv label span{
  padding-left: 5px;
  padding-top: 3px;
}
.labelDiv label input{
  display: flex;
  align-items: center;
  margin: 0;
  cursor: pointer;
}
.AddOn table tr td:nth-child(odd) .labelDiv{
  border-left: 0;
}
.AddOn .p01 td{
  font-weight: normal;
}
.labelDiv.p01{
  padding: 0;
  border-bottom: 0;
}
.SelectPayment tr,
.SelectPayment label,
.SelectPayment input{
  cursor: pointer;
}
.labelDiv.p01 > label:nth-child(1),

.SelectPayment > div:nth-child(2) > div{
  padding: 10px 15px;
}
.labelDiv .pRed{
  background-color: #f6fafd;
  line-height: 50px;
  text-align: right;
  font-size:20px;
  font-weight: normal !important;
}
.labelDiv .pRed div{
  width: 100%;
  padding: 0 15px;
}
.SelectPayment .tableTrIB label{
  width: 100%;
  display: flex;
  align-items: center;
}
.SelectPayment .tableTrIB td{
  vertical-align: middle;
}
.SchoolSubscribeMain .bdmain > div.SelectPayment > div:nth-child(2){
  background-color: #fff !important;
}
.SchoolSubscribeMain .clean-input-message{
  width: 100%;
  padding-top: 10px;
}
.SchoolSubscribeMain .clean-input-message input{
  margin: 10px;
  line-height: 50px;
  padding: 0 20px;
  border: 0;
  border-radius: 8px;
  font-size: 18px;
  color: #fff;
  min-width: 120px;
}
.SchoolSubscribeMain input.button01{
  background-color: #108bea;
}
.SchoolSubscribeMain input.button02{
  background-color: #ff9529;
}
.SchoolSubscribeMain .clean-input-message p{
  font-size:16px;
  color: #25355e;
  padding-top: 5px;
  opacity: 0.9;
}
.tableTrIB_D{
  font-size: 17px;
}
.tableTrIB_D span{
  padding-right: 10px;
  font-size: 20px;
}
.other_titDiv{
  width: 20%;
}
.other_titDiv .oth_img_02{
  width: 100%;
}
.top_xmHBV .container > .row{
  display: flex;
  justify-content: space-between;
}
.top_xmHBV .row::after,
.top_xmHBV .row::before{
  display: none;
}
.top_xmHBV .col-md-6{
  width: auto;
}
.top_xmHBV .col-xs-7{
  width: auto;
  padding-top: 20px;
}
.version,
.top_xmHBV .icon_r,
.top_xmHBV .icon_r2{
  display: flex;
  align-items: flex-end;
  width: auto;
}
.version{
  padding: 0 5px;
  position: relative;
  padding-left: 18px;
  

}
.version::before{
  border-left: 1px dotted rgba(0, 0, 0, 0.1);
    content: '';
    display: block;
    width: 1px;
    height: 45px;
    left: 7px;
    bottom: 0;
    position: absolute;
}
.version a{
  display: flex;
  padding: 0 2px;
  max-width: 105px;
}
.top_xmHBV .icon_r2{
  padding: 0 10px 3px 10px;
}
.top_xmHBV .icon_r{
  padding: 0 5px 3px 5px;
}
.top_xmHBV .icon_r img {
  padding: 0px 5px;
  width: 100%;
}
.top_xmHBV .kf_img{
  margin-right: 8px;
}
.mContact{
  display: none;
}
.version a img:nth-child(2){
  display: none;
}
.SchoolSubscribeMain .couldSelecte input[type=checkbox]:after{
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.6);
}
.SchoolSubscribeMain .couldSelecte input[type=checkbox]:checked:after {
  background: #4bbef5;
  border: 1px solid #4bbef5;
}
.studentNotice{
  max-width: 650px !important;
}
.studentNoticeDiv{
  overflow: auto;
  max-height: 55vh;
}
.studentNoticeFooter div{
  display: flex;
  width: 100%;
}
.studentNoticeFooter br{
  display: none;
}
.maga_b{
  background: url(../images/bg_04s_new.gif) no-repeat center top;
}
.maga_titt{
  position: relative;
}
.maga_titt::before{
  position: absolute;
  display: block;
  content: '';
  width: 120px;
  height: 120px;
  background: url(../images/bg_04s_new.png) no-repeat center top;
  top: -75px;
  right: 30px;
}
.maga_titt::after{
  position: absolute;
  display: block;
  content: '';
  width: 120px;
  height: 120px;
  background: url(../images/bg_04s_new1.gif) no-repeat center top;
  top: -75px;
  right: 30px;
  z-index: 1;
  display: none;
}
.videoBig .videoDiv{
  width: 65px;
  height: 52px;
  margin-top: 5px;
  background: url(../images/videoInto1.png) no-repeat;
  background-size: 100%;
}
.IndexTopX{
  display: flex;
  align-items: flex-end;
}

.IndexTopR{
  padding-bottom: 5px;
}
.IndexTopR .kf_img{
  max-width: 45px;
}
.IndexTopR .col-md-5.icon_r img{
  max-width: 44px;
  padding: 0px 3px;
}
.IndexTopR .col-md-7.icon_r2{
  padding-left: 0px;
  padding-right: 0px;
}
.version3Login{
  display: flex;
  align-items: flex-end;
  margin-right: 10px;
}
.SecondaryText,
.OverseasText{
  text-align: center;
  border-radius: 8px;
  color: #fff;
  margin: 0 2px;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.SecondaryText{
  background: url(../images/version1a.png) no-repeat center;
  background-size: auto  100%;
}
.OverseasText{
  background: url(../images/version2a.png) no-repeat center;
  background-size: auto 110%;
}
.SecondaryText span,
.OverseasText span{
  display: block;
  width: 100%;
}
.SecondaryText span:nth-child(1),
.OverseasText span:nth-child(1){
  font-size: 16px;
  line-height: 20px;
}
.SecondaryText span:nth-child(2),
.OverseasText span:nth-child(2){
  font-size: 13px;
  line-height:15px;
}

.eyeDiv {
    position: relative;
    display: flex !important;
    align-items: center;
}

.eyeDiv b {
    position: absolute;
    right: 10px;
    width: 25px;
    height: 25px;
    background: url(../images/eyes.png) no-repeat center;
    cursor: pointer;
}

.control_password_text b {
    background: url(../images/eye.png) no-repeat center;
}

@media (max-width:1580px) {
  .top_xmHBV .col-xs-7 {
    padding-top: 0px;
  }
  .carouselHB .item img{
    height: 560px !important;
  }
  #login.HBloginMain::after{
    background-size: auto 110%;
  }
  .top_xmHB{
    padding:8px 10px;
  }
  .top_xmHB .icon_logo{
    height: 65px;
    width: auto;
  }
  .top_xmHB .logo_0{
    padding-top: 15px;
  }
  .top_xmHB .icon_r2{
    padding-top: 10px;
  }
  
  .top_xmHB .icon_r img{
    padding-top: 20px;
  }
  .indNavXHB{
    height: 60px;
  }
  .indNavXHB .main_nav ul li a:hover{
    /* height: 60px; */
    padding-top: 11px;
  }
  
  .indNavXHB .main_nav > ul > li > a:hover span{
    margin-top: 0px;
  }
  .indNavXHB .nav_dis,
  .indNavXHB .nav_dis1{
    top: 60px;
  }
  .indNavXHB .main_nav > ul > li > a {
    padding: 5px 17px;
  }
  .indNavXHB .main_nav > ul > li > a span {
    font-size: 16px;
    line-height: 18px;
  }
}
@media (max-width:1440px) {
}
@media (max-width:1200px) {
  .videoBig .videoDiv{
    width: 55px;
    height: 44px;
  }
  .eListeningBody_ind .eListening_Main .container{
    padding-top: 65px;
  }
  .eListeningDiv div a{
    background-size: 100% !important;
  }
  .eListeningDiv div a h1{
    font-size:5.5vh;
  }
  .eListeningDiv div a span{
    font-size:2vh;
  }
  .indNavX .container{
    width: 100%;
  }
  .indNavX .main_nav ul li a{
    padding: 9px 10px 0 10px;
  }
  .HBlogin{
    width:100%;
  }
  .HBloginL{
    padding: 12px 5px 5px;
  }
  .HBloginL h1{
    font-size: 22px;
  }
  .HBloginL > div span {
    margin: 0 5px;
  }
  .top_xm .kf_img2{
    width: auto;
    height: 40px;
  }
  .IndexTopR .col-md-7.icon_r2 .kf_img2{
    width: 40px;
    height: auto;
    max-height: none;
  }
  .IndexTopR .kf_img{
    max-width: 40px;
    height: auto !important;
    margin-right: 5px;
  }
  .IndexTopR .col-md-5.icon_r img {
    max-width: 40px;
  }
  .IndexTopR .col-md-5.icon_r{
  }
  

}
@media (max-width:1199px){
  button.HomeSubscribeHB {
    min-width: 125px;
  }
  .top_xmHB .icon_logo {
    height: 55px;
  }
  #login.HBloginMain::after {
    background-size: auto 90%;
  }
  button.GetPasswordHB{
    min-width: 95px;
  }
  button.LoginHelpHB{
    min-width: 90px;
  }
  button.FreeTrialHB{
    min-width: 75px;
  }
  #login ul li button{
    padding: 0 2px;
  }
  .HBlogin {
    max-width: 1020px;
  }
  .top_xm .kf_img{
    width: auto;
    height: 45px;
  }
  .SX_ebooks{
    max-width: 970px;
  }
  .SX_ebooks > span{
    padding-bottom: 80%;
  }
  .top_xmN .icon_r2{
    padding-top: 5px;
  }
  .icon_r2 img {
    max-height: 50px;
  }
}
@media (max-width:1100px) {
  .version{
    padding-left: 5px;
  }
  .version::before{
    display: none;
  }
  .version a{
    width: 100px;
  }
  .SecondaryText, .OverseasText{
    border-radius: 5px;
  }
  .SecondaryText span:nth-child(2), 
  .OverseasText span:nth-child(2) {
    font-size: 12px;
    line-height: 12px;
  }
  .top_xmHBV .icon_b2{
    display: flex !important;
    align-items: center;
  }
  .top_xmHBV .icon_r,
  .top_xmHBV .icon_r2{
    display: none !important;
  }
  .mContact{
    display: flex;
  }
  .top_xmHBV .icon_b, 
  .top_xmHBV .mob_close{
    padding: 0 5px !important
  }
  .top_xmHBV .col-md-6:nth-child(2){
    display: flex;
  }
  .top_xmHBV .icon_intoX{
    display: none;
  }
  .version3Login{
    display: none;
  }
  .IndexTopR{
    display: flex;
    align-items: center;
    padding-bottom: 0;
  }
  .IndexTopR .mContact{
    align-items: center;
  }
  .IndexTopR .mContact img{
    width: 45px;
    height: auto !important;
  }
  .IndexTopR .icon_b,
  .IndexTopR .mob_close{
    height: auto !important;
    max-width: 48px;
  }
  .SchoolSubscribeMain{
    padding-top: 70px;
  }
  .container_top{
    margin-top: 50px;
  }
  .indNavX{
    display: none;
  }
  .HBlogin {
    max-width: 990px;
    margin-bottom: 0px;
    margin-top: 15px;
  }
  .HBloginR ul {
    justify-content: center;
  }
  
  #login.HBloginMain::after{
    height: 30px;
    bottom: -30px;
  }
  .sj_HBlogin .HBloginL > div{
    flex-wrap: wrap;
  }
  .HBloginR ul li{
    text-align: center;
  }
  .sj_HBlogin .HBloginL{
    width: 100%;
    height: 100%;
    padding: 12px 10px 0px 10px;
    border: 0;
  }
  .sj_HBlogin .HBloginL > div span:nth-child(1),
  .sj_HBlogin .HBloginL > div span:nth-child(2),
  .sj_HBlogin .HBloginL > div span:nth-child(3){
    width: 100%;
  }
  .HBloginL > div span{
    margin-bottom: 10px;
  }
  .sj_HBlogin{
    border-radius: 10px;
    padding: 0;
  }
  .sj_HBlogin ::marker{
    display: none !important;
    color: transparent;
  }
  .sj_HBlogin .HBloginR {
    padding: 0 10px 10px;
    width: 100%;
  }
  .sj_HBlogin .HBloginR ul li{
    position: relative;
    width: 25%;
  }
  .sj_HBlogin .HBloginR ul li:last-child{
    width: 28%;
  }
  .sj_HBlogin .HBloginR ul li:last-child::before{
    display: none;
  }
  .sj_HBlogin .HBloginR ul li::before {
    border-right: 1px dotted rgba(0, 0, 0, 0.2);
    width: 1px;
    height: 80%;
    top: 10%;
    display: block;
    content: '';
    right: 0;
    position: absolute;
  }
  .sj_HBlogin .HBloginL h1{
    text-align: center;
    padding-left: 0;
    font-size: 20px;
  }
  .sj_HBlogin .HBloginL h1 span{
    font-size: 18px;
  }
  .HBloginL > div span input,
  button.txt_login{
    border-radius: 8px;
  }
  .HBloginR button{
    padding: 0 3px;
    font-size: 12px;
  }
  button.GetPasswordHB {
    min-width: 85px;
  }
  button.LoginHelpHB {
    min-width: 80px;
  }
  button.FreeTrialHB {
    min-width: 72px;
  }
  button.HomeSubscribeHB {
    min-width: 105px;
  }
  .HBloginR button::before{
    width: 45px;
    height: 45px;
    background-size: 85%;
  }
  .sj_login{
    z-index: 9999;
  }

  .top_xmN .icon_b2 {
    display: flex !important;
  }
  .top_xmN .icon_r2{
    padding-top: 0;
  }
  .top_xmN .col-md-6:nth-child(2){
    height: auto !important;
  }
  .top_xmN .icon_r2 img{
    max-height: 45px;
  }
  
}

@media (max-width:1024px){
  
  .ICTText_202210{
    width: 100%;
  }
  
.studentNotice{
  max-height: 90% !important;
}
  
}
@media (max-width:992px) {
  .eListeningDiv div a{
    padding-top: 25%;
  }
  .eListeningDiv div {
    width: 33.333333%;
    padding-bottom: 33.333333%;
  }
  .eListeningDiv div a h1{
    font-size:8.6vw;
    line-height: 8vw;
  }
  .eListeningDiv div a span{
    font-size:3vw;
  }

}
@media (max-width: 991px){
  .HBlogin {
    max-width: 770px;
  }
  #login.HBloginMain::before,
  #login.HBloginMain::after{
    display: none;
  }
  #login.HBloginMain > div{
    border: 0;
    border-radius: 15px;
    background-color: #edf9ff;
    flex-wrap: wrap;
    box-shadow: none;
    border-bottom: none;
    border-radius: 15px;
    margin-top: 10px;
  }
  #login.HBloginMain > div.bjC2{
    background-color: #edf9ff;
  }
  #login.HBloginMain .HBloginL{
    width: 100%;
    border: 0;
    height: auto;
  }
  .HBloginR{
    width: 100%;
  }
  #login.HBloginMain .HBloginR ul li{
    width: 25%;
    padding: 0 3px;
  }
  #login.HBloginMain .HBloginR ul li button{
    border-radius: 5px;
    width: 100%;
    padding-top: 3px;
    padding: 5px 5px 5px 45px;
    text-align: left;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(1) button{
    background-color: #f1e7fe;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(2) button{
    background-color: #deeffe;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(3) button{
    background-color: #fee9ee;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(4) button{
    background-color: #fff2dc;
  }
  #login.HBloginMain .HBloginL > div span:nth-child(1) input,
  #login.HBloginMain .HBloginL > div span:nth-child(2) input{
    background-color: #fff;
    border: 1px solid #9fdcfb;
  }
  #login.HBloginMain .HBloginR {
    padding-top: 0;
    margin: 0 5px;
  }
  #login.HBloginMain .HBloginR button::before {
    position: absolute;
    top: 3px;
    left: 0;
  }
  #login.HBloginMain .HBloginL > div span{
    margin-bottom: 0;
  }
  #login.HBloginMain .HBloginL > div{
    flex-wrap: wrap;
  }
  #login.HBloginMain .HBloginL > div span{
    width: 98%;
    margin: 5px 1%;
  }
  #login.HBloginMain .HBloginL > div span:nth-child(1),
  #login.HBloginMain .HBloginL > div span:nth-child(2){
  }
}
@media (max-width:990px) {
  .eExercise_nrX .eExercise_nr_div{
    width: 98% !important;
    margin-bottom: 30px !important;
  }
  .other_titDiv {
    width: 33.333333%;
  }
  .other_titDiv .oth_img_02{
    width: 80%;
    margin-left: 10%;
  }
  .studentNoticeDiv {
    max-height: 40vh;
  }
  .maga_titt::before,
  .maga_titt::after{
    top: 0;
  }



}
@media (max-width:850px) {
  .ICTTextTop div{
    font-size: 20px;
  }
  .ICTTextTop span{
    font-size: 16px;
  }
  .ICTText_img2 span div{
    font-size: 16px;
  }
  .ICTText_img7 li:nth-child(2){
    min-width: 250px;
  }
  .ICTText_TextRed{
    flex-wrap: wrap;
  }
}
@media (max-width:768px){
  .version a {
    width: 90px;
  }
  .videoBig{
    margin: 0 -10px;
  }
  .videoBig .videoDiv {
    width: 40px;
    height: 32px;
  }
  .videoBig .col-xs-4{
    padding-right: 10px;
    padding-left: 10px;
  }
  .videoBig .col-xs-4 img{
    width: 100% !important;
  }
  .top_xmHBV{
    padding: 8px 0 8px 5px;
  }
  .version img{
    height: 40px;
  }
  .SchoolSubscribeMain #update >div{
    width: 100%;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
  }
  .SchoolSubscribeMain #update >div:last-child{
    border: 0 !important;
  }
  .labelDiv .pRed div{
    font-size: 18px;
  }
  .tableTrIB_D span{
    font-size: 18px;
    width: 100%;
    display: block;
  }
  .tableTrIB_D {
    font-size: 15px;
  }
  .SchoolSubscribeMain .bdmain > div{
    margin-bottom: 5px;
  }
  
  .ICTText_img2 span:nth-child(1),
  .ICTText_img2 span:nth-child(2),
  .ICTText_img4 span,
  .ICTText_img1 span,
  .ICTText_img5 li:nth-child(3) > div:nth-child(2) span,
  .ICTText_img9 span,
  .ICTText_img10 footer span{
    width: 50%;
  }
  .ICTText_img2 span:nth-child(3){
    width: 50%;
  }
  .ICTText_img4_1 span,
  .ICTText_img5 li:nth-child(1),
  .ICTText_img5 li:nth-child(2){
    width: 100%;
  }
  .ICTText_img2,
  .ICTText_img4,
  .ICTText_img5 li:nth-child(3) > div:nth-child(2),
  .ICTText_img7,
  .ICTText_img9{
    flex-wrap: wrap;
  }
  .ICTText_img7 li:nth-child(2){
    padding-left: 25px;
    width: auto;
  }
  .ICTText_img7 li:nth-child(2) span{
    max-width: 150px;
  }
  .ICTTextTop div {
    font-size: 18px;
  }
  .ICTText_202210 {
    padding: 10px;
  }
  .ICTTextTop span {
    font-size: 14px;
  }
  .ICTTextBlue span{
    font-size: 16px;
  }
  .ICTText_202210 p{
    font-size: 14px;
  }
  .ICTTextTop {
    background-color: #99cc00;
    color: #fff;
    padding: 5px 10px 5px 35px;
    margin-bottom: 5px;
    position: relative;
  }
  .MagAn .title_with{
    display:block !important;
  }
  .MagAn .daanLeft,
  .MagAn .daanRight{
    display: none !important;
  }
  .daanYear{
    display: flex;
    flex-wrap: wrap;
  }
  .maga_tit_sub2 a{
    background: #34d3c0;
    border: 1px solid #34d3c0;
  }
  .maga_tit_sub a {
    background: #ed406a !important;
    border: 1px solid #ed406a !important;
  }
  .eLImg{
    position: relative;
    padding-bottom: 55px;
  }
  .eLImg span{
    width: 100% !important;
  }
  .eLImg p{
    position: absolute;
    bottom: -32px;
    margin: 0;
    padding: 0;
    text-align: center;
  }
  .eOralFree > header div {
    width: 25%;
    display: flex;
    align-items: flex-end;
  }
  .top_xmHB .icon_logo {
    height: 50px;
  }
  .notice_2023 .notice_fb{
    margin: 10px 1%;
    width: 98%;
  }
  .HBlogin {
    margin: 3px 0;
  }
  .SX_ebooks{
    padding: 0 3%;
  }
  .SX_ebooks > span{
    padding-bottom: 90%;
  }
}
@media (max-width:767px){
  .other_titDiv,
  .other_indLike .col-xs-6{
    width: 33.333333%;
    padding: 0;
  }
  .other_titDiv .oth_img_02{
    width: 100%;
    margin-left: 0;
  }
}
@media (max-width:753px){
  .SX_ebooks .videolist{
    bottom: 25px;
    margin-left: 120px;
  }
}
@media (max-width:670px) {
  #login.HBloginMain .HBloginR button::before {
    position: relative;
    left: auto;
    top: auto;
  }
  #login.HBloginMain .HBloginR ul li button{
    padding: 3px 0 !important;
    text-align: center !important;
  }
}
@media (max-width:650px) {
  .mContact .mContact_a{
      display: none;
  }
  .eOralFree > header div a {
    font-size: 16px;
    height: 40px;
    line-height: 40px;
    min-width: auto;
  }
  .SX_ebooks > span {
    padding-bottom: 95%;
  }
  .maga_titt::before, 
  .maga_titt::after {
    top: 5px;
    right: 0;
    background-size: 80%;
  }

}
@media (max-width:550px) {
  .eListeningHBody .article_p,
  .eOralFreeMain .eOralFreeDiv,
  .ICTText_img8 li:last-child span:nth-child(1),
  .ICTText_img6 li div:nth-child(2) span,
  .ICTText_img2 span,
  .article_p1{
    width: 100% !important;
  }
  .ICTText_img6,
  .ICTText_img6 li div:nth-child(2),
  .ICTText_img8 li{
    flex-wrap: wrap;
  }
  .ICTText_img8 li span{
    width: 50%;
  }
  .studentNoticeDiv {
    max-height: 60vh;
  }

  
}
@media (max-width:500px) {
  .ICTText_img9 span{
    width: 100%;
  }
  .version a img:nth-child(1) {
    display: none;
  }
  .version a img:nth-child(2) {
    display: flex;
  }
  .top_xmHBV .container > .row{
    justify-content: flex-end;
  }
  .IndexTopX{
    justify-content: space-between !important;
    margin: 0 -5px;
  }
  .IndexTopX .icon_logo{
    max-width: none;
  }
  .IndexTopR .icon_b,
  .IndexTopR .mob_close {
    max-width: 35px;
  }
  .top_xmHBV .col-xs-7 {
    padding-bottom: 0px;
  }
  .top_xmHBV .col-md-6:nth-child(2){
    height: 28px !important;
    padding-right: 8px;
  }
  .version a{
    display: flex;
    width: 65px;
    height: 35px;
    overflow: hidden;
    border-radius: 6px;
    padding: 0;
    margin-left: 5px;
  }
  .version img {
    height: 100%;
    object-fit: cover;
    width: 100%;
    display: flex;
  }
  .SecondaryText span:nth-child(1), 
  .OverseasText span:nth-child(1) {
    font-size: 14px;
    line-height: 15px;
  }
  .SecondaryText span:nth-child(2), .OverseasText span:nth-child(2) {
    font-size: 10px;
    line-height: 8px;
  }
  .top_xmHBV a#ios2{
    padding-bottom: 3px;
  }
  .top_xmHBV .icon_b, 
  .top_xmHBV .mob_close {
    padding: 0 3px !important;
  }
  .top_xmN .icon_r2 img:nth-child(1),
  .top_xmN .icon_r2 a{
    display: none;
  }
  .top_xmN .icon_r2 img {
    max-height: 40px;
  }
  .SchoolSubscribeMain {
    padding-top: 50px;
  }
  .SchoolSubscribeMain .container{
    padding: 0;
  }
  .SchoolSubscribeMain .bdmain{
    padding: 10px;
  }
  .SchoolSubscribeMain #update >div label{
    flex-wrap: wrap;
  }
  .SchoolSubscribeMain #update >div label div{
    width: 100%;
    text-align: left;
    display: block;
    font-size: 18px;
    padding-bottom: 8px;
  }
  .SchoolSubscribeMain #update >div label input{
    margin-top: 0 !important;
  }
  .SchoolSubscribeMain .bdmain > div > div:nth-child(2){
    margin-bottom: 8px;
  }
  .labelDiv{
    padding: 0 10px;
  }
  .labelDiv label input{
    margin-right: 18px !important;
  }
  .labelDiv.p01 > label:nth-child(1), 
  .SelectPayment > div:nth-child(2) > div {
    padding: 10px;
  }
  .SchoolSubscribeMain .clean-input-message {
    padding-top: 0px;
  }
  .SchoolSubscribeMain .AddOn > div:nth-child(1){
    line-height: 20px !important;
    letter-spacing: 0.03rem !important;
    font-size: 18px !important;
  }
  .SchoolSubscribeMain .clean-input-message p{
    line-height: 20px;
    font-size: 15px;
  }
  .SelectPayment table tr td:nth-child(1){
    width: 25px !important;
  }
  .container_top{
    margin-top: 30px;
  }
  .eOralFree > header{
    flex-wrap: wrap;
    padding: 10px 0;
  }
  .eOralFree > header div{
    width: 50%;
  }
  .eOralFree > header div a{
    border: 1px solid #ff9966;
    border-radius: 5px;
    font-size: 15px;
    line-height: 40px;
    height: auto;
    margin: 5px 0;
  }
  .eOralFree > header .active a{
    line-height: 40px;
    font-size: 16px;
    height: auto;
    margin: 5px 0;
  }
  .top_xmHB .icon_logo {
    height: 35px;
    margin-left: -5px;
  }

}
@media (max-width:480px) {
  .eListeningBody_ind .eListening_Main .container {
    padding-top: 45px;
  }
  .HBlogin{
    display: flex;
    margin-top: 0;
    padding: 0 10px;
  }
  #login.HBloginMain{
    margin-top: 0;
  }
  .HBloginL > div span{
    width: 100% !important;
  }
  #login.HBloginMain > div,
  #login.HBloginMain .HBloginL > div{
    flex-wrap: wrap;
    background-color: #edf9ff;
  }
  #login.HBloginMain .HBloginL h1{
    text-align: center;
    font-size: 20px;
    padding-left: 0;
  }
  #login.HBloginMain .HBloginL h1 span{
    font-size: 18px;
  }
  #login.HBloginMain > div{
    box-shadow: none;
    border-bottom: none;
    border-radius: 15px;
    margin-top: 10px;
  }
  #login.HBloginMain .HBloginR ul li{
    width: 25%;
    padding: 0 3px;
  }
  #login.HBloginMain .HBloginR ul li button{
    border-radius: 5px;
    width: 100%;
    padding-top: 3px;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(1) button{
    background-color: #f1e7fe;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(2) button{
    background-color: #deeffe;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(3) button{
    background-color: #fee9ee;
  }
  #login.HBloginMain .HBloginR ul li:nth-child(4) button{
    background-color: #fff2dc;
  }
  #login.HBloginMain .HBloginL > div span:nth-child(1) input,
  #login.HBloginMain .HBloginL > div span:nth-child(2) input{
    background-color: #fff;
    border: 1px solid #9fdcfb;
  }
  #login.HBloginMain::after,
  #login.HBloginMain::before{
    display: none;
  }
  .HBloginL{
    width: 100%;
    border-radius: 0;
    height: auto;
    border: 0;
  }
  #login.HBloginMain .HBloginR{
    width: 100%;
    padding-top: 0;
  }
  #login.HBloginMain .HBloginL > div span:nth-child(3){
    margin-bottom: 5px;
  }
  .HBloginR button span{
    font-size: 13px;
    line-height: 15px;
    padding-bottom: 8px;
  }
  .HBloginR button::before {
    background-size: 85%;
    width: 40px;
    height: 40px;
  }
  button.GetPasswordHB,
  button.LoginHelpHB,
  button.FreeTrialHB{
    min-width: auto;
  }
  button.HomeSubscribeHB {
    min-width: auto;
  }
  .HBloginR ul li{
    width: 23% !important;
  }
  .HBloginR ul li:nth-child(4){
    width: 30% !important;
  }
  
  .HBloginR ul li button i{
    display: none !important;
  }
  .other_indLike .oth_img_tit{
    font-size: 17px;
    height: 55px;
  }
  .other_indLike .oth_img_02{
    height: 80px;
  }
  .other_indLike .oth_img_tit span{
    font-size: 14px;
  }
  
}
@media (max-width:420px){
  .SX_ebooks > span {
    padding-bottom: 100%;
  }
  .top_xmHBV .icon_intoXm {
    display: none;
  }
  .version {
    padding-right: 0;
  }
  .version a{
    width: 55px;
    height: 28px;
    border-radius: 4px;
    margin-left: 6px;
  }
  .SecondaryText span:nth-child(1), 
  .OverseasText span:nth-child(1) {
    font-size: 12px;
    line-height: 13px;
  }
  .SecondaryText span:nth-child(2), 
  .OverseasText span:nth-child(2) {
    font-size: 8px;
    line-height: 10px;
  }
  .studentNoticeFooter label{
    font-size: 15px;
    font-weight: normal;
  }

}