.container {
  width: 100%;
  position: relative;
}

#top {
  width: 100%;
  height: 1.52rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  /* border-bottom: 1px solid #fff; */
}

#top .top-box {
  width: 16.11rem;
  height: 1.08rem;
  margin-left: 2.48rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

#top .top-menu-box {
  display: flex;
  flex-direction: row;
  align-items: center;
}

#top .logo {
  width: 1.03rem;
  height: 1.08rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

#top .star-logo {
  width: 0.54rem;
  height: 0.51rem;
  cursor:pointer;
}

#top .star-title {
  width: 1.04rem;
  height: 0.43rem;
  cursor:pointer;
}

#top .top_menu {
  /* width: 7.25rem; */
  height: 1.08rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  /* margin-left: 5.51rem; */
  position: relative;
}

#top .float-box {
  width: 1.7rem;
  height: 1.4rem;
  background-color: #fff;
  position: absolute;
  top: 0.85rem;
  right: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 999;
  box-shadow: 3px 4px 10px 0px rgba(0, 0, 0, 0.1);
}

#top .float-box a {
  width: 100%;
  text-align: center;
  padding: 0.12rem 0.15rem;
  box-sizing: border-box;
}

#top .float-box a:hover {
  background-color: #808080;
}

#top .top_menu li {
  height: 1.08rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 0.21rem;
}

#top .top_menu li:nth-last-child(1) {
  padding: 0 0 0 0.19rem;
  line-height: 1.08rem;
}

#top .top_menu a {
  font-size: 0.28rem;
  color: #45505b;
  font-family: HYWenHei-EEW;
}

#top .star-more {
  width: 0.28rem;
  cursor: pointer;
}

#top .search-input-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-bottom: 1px solid #b1b0b0;
  padding: 0.05rem 0;
  box-sizing: border-box;
  display: none;
}

#top .close-search {
  width: 0.28rem;
  height: 0.28rem;
  background-image: url("../images/jianhao.png");
  background-repeat: no-repeat;
  background-size: 0.28rem 0.28rem;
  margin-left: -0.4rem;
}

#top .search-input-box input {
  width: 4.85rem;
  outline: none;
  background: none;
  border: 0;
  padding: 0 0.4rem 0 0.4rem;
}

#top .search-btn {
  width: 0.28rem;
  height: 0.28rem;
  background-image: url("../images/star_search.png");
  background-repeat: no-repeat;
  background-size: 0.28rem 0.28rem;
}

#top .star-img-box {
  /* width: 1.22rem; */
  height: 1.08rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-left: 1.17rem;
}

#top .star-img-box a {
  width: 0.28rem;
  height: 0.28rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

#top .star-img-box a:nth-of-type(1) {
  margin-right: 0.25rem;
}

#top .star-img-box a:nth-of-type(2) {
  margin-right: 0.15rem;
}

#top .star-img-box img {
  width: 0.28rem;
  height: 0.28rem;
}

#top .more-btn {
  width: 0.6rem;
  height: 0.6rem !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
}

#header {
  width: 100%;
  height: 8.23rem;
  background-image: url("../images/star-ad.jpg");
  background-repeat: no-repeat;
  background-size: 100% 8.23rem;
  border-top: 1px solid #fff;
  position: relative;
}

#header .SMG {
  width: 0.96rem;
  height: 0.9rem;
  background-image: linear-gradient(0deg, #d7d7d7 0%, #ffffff 100%),
    linear-gradient(#ffffff, #ffffff);
  background-blend-mode: normal, normal;
  box-shadow: 0.02rem 0.04rem 0.12rem 0 rgba(0, 0, 0, 0.1);
  border: solid 0.02rem #cdcdcd;
  position: absolute;
  top: -0.23rem;
  right: 3.1rem;
  text-align: center;
}

#header .SMG p:nth-of-type(1) {
  font-size: 0.3rem;
  color: #3b90f9;
  font-weight: bold;
  margin-top: 0.2rem;
}

#header .SMG p:nth-of-type(2) {
  font-size: 0.12rem;
  color: #3b90f9;
}

#nav {
  width: 100%;
  height: 0.69rem;
  background: #a7a7a7;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

#nav .nav-list {
  display: flex;
  flex-direction: row;
  align-items: center;
}

#nav .nav-list li {
  padding: 0 0.38rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

#nav .nav-list a {
  color: #fff;
  font-size: 0.24rem;
  font-family: HYWenHei-EEW;
}

#nav .nav-list .active {
  height: 0.8rem;
  background: #9f8b49;
  z-index: 99;
}

#nav-content {
  position: relative;
}

.nav-content {
  padding: 0.4rem 0 1.49rem;
}

#nav-content .center-box {
  width: 13.8rem;
  margin: 0 auto;
}

#nav-content .head {
  margin: 0.55rem 0;
}

#nav-content .box {
  display: flex;
  margin-top: 0.12rem;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

#nav-content .title {
  font-size: 0.45rem;
  color: #1761a6;
  font-family: HYRunYuan-FEW;
}

#nav-content .intro {
  font-size: 0.16rem;
  color: #808080;
  font-family: 微软雅黑;
}

#nav-content .detail {
  font-size: 0.21rem;
  color: #425766;
  font-family: 微软雅黑;
}

#nav-content .title-box {
  width: 6.9rem;
  height: 4rem;
  display: flex;
  /* padding-top: 2.08rem; */
  box-sizing: border-box;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 0.4rem;
}

#nav-content .content {
  display: flex;
  flex-direction: column;
}

#nav-content .content-list {
  display: flex;
  flex-direction: row;
}

#nav-content .posi-box {
  display: flex;
  flex-direction: row;
}

#nav-content .posi-two-box {
  justify-content: flex-end;
}

#nav-content .green-title {
  color: #67b41c;
}

#nav-content .teach-content {

  height: 8.1rem;
  background-image: url("../images/teach-bgtwo.jpg");
  background-repeat: no-repeat;
  background-position: right;
  position: relative;
  background-color: #f0f0f0;
}

.teach-content .bg-vague {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.7);
  display: flex;
  flex-direction: row;
}

.teach-nav-box {
  width: 1.96rem;
  height: 100%;
  background: #f8f8f8;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.teach-nav-box div {
  width: 1.96rem;
  height: 1.96rem;
  background-color: #a7a7a7;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
	cursor:pointer;
}

.teach-nav-box div span {
  color: #fff;
  font-size: 0.32rem;
  font-family: 微软雅黑;
}

.teach-nav-box .active-box {
  width: 0.28rem;
  height: 0.28rem;
  transform: rotate(45deg);
  background: #fff;
  position: absolute;
  top: 0.787rem;
  right: -0.14rem;
  display: none;
}

.teach-nav-box .active {
  background: #9f8b49;
}

.teach-nav-box .active div {
  display: block;
}

.posi-text-box {
  display: flex;
  flex-direction: column;
  cursor:pointer;
}

.posi-text-box span {
  margin-left: 0.6rem;
}

.posi-text-box span:nth-of-type(1) {
  font-size: 0.38rem;
  color: #cd2133;
  margin-left: 0.03rem;
  font-family: ARBONNIE;
}

.posi-text-box span:nth-of-type(2) {
  font-size: 0.26rem;
  color: #cd2133;
  margin-top: 0.1rem;
  font-family: 微软雅黑;
}

.posi-text-box span:nth-of-type(3) {
  font-size: 0.16rem;
  color: #808080;
  margin-top: 0.2rem;
  font-family: 微软雅黑;
}

.posi-text-box span:nth-of-type(4) {
  font-size: 0.16rem;
  color: #808080;
  font-family: 微软雅黑;
}

.posi-text-box:nth-of-type(2) {
  margin-left: 0.95rem;
}

.posi-text-box:nth-of-type(2) span:nth-of-type(1),
.posi-text-box:nth-of-type(2) span:nth-of-type(2) {
  color: #edb83c;
}

.posi-two-box .posi-text-box:nth-of-type(1) span:nth-of-type(1),
.posi-two-box .posi-text-box:nth-of-type(1) span:nth-of-type(2) {
  color: #67b41c;
}

.posi-two-box .posi-text-box:nth-of-type(2) span:nth-of-type(1),
.posi-two-box .posi-text-box:nth-of-type(2) span:nth-of-type(2) {
  color: #1761a6;
}

.posi-th-box .posi-text-box:nth-of-type(1) span:nth-of-type(1),
.posi-th-box .posi-text-box:nth-of-type(1) span:nth-of-type(2) {
  color: #6f3287;
}

.posi-th-box .posi-text-box:nth-of-type(2) span:nth-of-type(1),
.posi-th-box .posi-text-box:nth-of-type(2) span:nth-of-type(2) {
  color: #cd2133;
}

.nav-content.color-bg {
  background: #fff;
}

#nav-content .img-box {
  width: 6.9rem;
  height: 4rem;
  background-image: url("../images/star-write.jpg");
  background-repeat: no-repeat;
  background-size: 6.9rem 4rem;
}
#nav-content .img-boxtwo {
  width: 6.9rem;
  height: 4rem;
  background-image: url("../images/star-writetwo.jpg");
  background-repeat: no-repeat;
  background-size: 6.9rem 4rem;
}

#nav-content .img-boxthree {
  width: 6.9rem;
  height: 4rem;
  background-image: url("../images/star-writethree.jpg");
  background-repeat: no-repeat;
  background-size: 6.9rem 4rem;
}

.content-swiper-box {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-left: 0.63rem;
  display: none;
}

.swit-top {
  width: 0.32rem;
  height: 0.19rem;
  background-image: url("../images/top_btn.png");
  background-repeat: no-repeat;
  background-size: 0.32rem 0.19rem;
  margin-top: 0.22rem;
  cursor: pointer;
}

.swit-bottom {
  width: 0.32rem;
  height: 0.19rem;
  background-image: url("../images/bottom-btn.png");
  background-repeat: no-repeat;
  background-size: 0.32rem 0.19rem;
  margin-top: 0.18rem;
  cursor: pointer;
}

.swit-content {
  overflow: hidden;
  width: 6.6rem;
  height: 7rem;
  margin-top: 0.14rem;
  position: relative;
}

.scroll-box {
  position: absolute;
  top: 0;
  left: 0;
}

.swit-content div {
  width: 6.6rem;
}

.swit-card-box {
  margin-top: 0.21rem;
}

.swit-card-box:nth-of-type(1) {
  margin-top: 0;
}

.swit-card-box div {
  box-sizing: border-box;
}

.swit-card-box .card-top {
  width: 100%;
  /* height: 0.8rem; */
  background: #9f8b49;
  color: #fff;
  font-size: 0.32rem;
  line-height: 0.42rem;
  padding: 0.22rem 0.34rem 0.14rem;
  font-family:微软雅黑;
}

.swit-card-box .card-content {
  width: 100%;
  background: #fff;
  color: #808080;
  font-size: 0.16rem;
  line-height: 0.36rem;
  padding: 0.22rem 0.34rem 0.36rem;
  font-family: "微软雅黑";
}

#nav-content .orange-title {
  color: #edb83c;
}

.select-box {
  display: flex;
  margin-right: -0.18rem;
}

.select-box a {
  font-family: HYWenHei-EEW;
  color: #45505b;
  font-size: 0.22rem;
  line-height: 0.4rem;
  padding: 0 0.18rem;
}

.select-box .active {
  color: #fff;
  background: #a19153;
}

.switch-btn-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}

.switch-btn-box .left {
  width: 0.17rem;
  height: 0.27rem;
  background-image: url("../images/left-btn.png");
  background-repeat: no-repeat;
  background-size: 0.17rem 0.27rem;
  margin-right: 0.27rem;
  cursor: pointer;
}

.switch-btn-box .right {
  width: 0.17rem;
  height: 0.27rem;
  background-image: url("../images/right-btn.png");
  background-repeat: no-repeat;
  background-size: 0.17rem 0.27rem;
  cursor: pointer;
}

.img-list-box {
  margin-top: 0.3rem;
}

.img-list-box .block {
  width: 16.06rem;
  overflow: hidden;
  position: relative;
}

.img-list-box .list-box {
  display: flex;
  flex-direction: row;
  position: relative;
  top: 0;
  left: 0;
}

.cover-box {
  width: 3.02rem;
  height: 100%;
  background-color: rgba(240, 240, 240, 0.5);
  position: absolute;
  top: 0;
  right: 0;
}

.video-cover-box {
  width: 100%;
  height: 100%;
  background-color: rgba(225, 225, 225, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

.video-block {
  width: 10.68rem;
  height: 5.98rem;
  background-color: #ffffff;
  box-shadow: 10px 12px 30px 0px rgba(0, 0, 0, 0.15);
  border-radius: 0.12rem;
  border: solid 2px #cecece;
  margin: 2.24rem auto;
  position: relative;
}

.cover-close-btn {
  width: 0.47rem;
  height: 0.47rem;
  background-image: url("../images/close-cover.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: -0.3rem;
  right: -0.25rem;
}

.cover-video {
  width: 100%;
  height: 100%;
}

.list-li-box {
  width: 3rem;
  display: flex;
  flex-direction: column;
  margin-left: 0.26rem;
  cursor:pointer;
}

.list-li-box:nth-of-type(1) {
  margin-left: 0;
}

.list-li-box img {
  width: 3rem;
  height: 4.5rem;
}

.peo-intro-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 0.14rem;
  box-sizing: border-box;
  margin-top: 0.28rem;
}

.peo-intro-box span {
  color: #808080;
  font-size: 0.16rem;
  line-height: 0.24rem;
  font-family: 微软雅黑;
}

.peo-intro-box span:nth-of-type(1) {
  font-size: 0.2rem;
  color: #000;
  font-family: 微软雅黑;
}

.peo-intro-box span:nth-of-type(2) {
  margin-top: 0.14rem;
}

.line-intro {
  width: 16.51rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 0.42rem;
}

.line-intro div {
  width: 8.17rem;
  height: 0.01rem;
  background: #cecece;
}

.line-intro p {
  color: #808080;
  font-size: 0.16rem;
  padding: 0 0.12rem;
  font-family: 微软雅黑;
}

.line-intro .left-line {
  width: 6.17rem;
}

.line-intro .right-line {
  width: 8.95rem;
}

#nav-content .red-title {
  color: #cd2133;
}

.activity-block {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.activity-li-box {
  width: 4.1rem;
  display: flex;
  flex-direction: column;
}

.activity-img {
  width: 4.1rem;
  height: 2.3rem;

  background-repeat: no-repeat;
  background-size: cover;
}

.activity-title-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.26rem;
}

.activity-title-box span:nth-of-type(1) {
  font-size: 0.20rem;
  color: #444444;
  margin-left: -0.12rem;
  font-family: 微软雅黑;
}

.activity-title-box span:nth-of-type(2) {
  font-size: 0.14rem;
  color: #7f7f7f;
  font-family: 微软雅黑;
}

.activity-intro {
  color: #444444;
  font-size: 0.16rem;
  line-height: 0.3rem;
  margin-top: 0.07rem;
  font-family: 微软雅黑;
}

#nav-content .purple-title {
  color: #6f3287;
}

.star-perform-box {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
 
}

.star-perform-box:nth-of-type(1) {
  margin-top: 0;
}

.perform-img {
  width: 5rem;
  height: 3.74rem;
  background-repeat: no-repeat;
  background-position:center top;
  background-size: cover;
}
.perform-imgtop{
  vertical-align:top;
  margin-top: 0px;
}
@media (max-width:640px) {
  .perform-imgtop{
  vertical-align:top;
  margin-top: -20px;
  }
}
.perform-intro-box {
  height: 3.74rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.per-text-box {
  display: flex;
  flex-direction: row;
  
}

.per-text-box div {
  width: 5.1rem;
}

.per-text-box div p {
  font-size: 0.2rem;
  color: #444444;
  font-family: 微软雅黑;
}

.per-text-box div p:nth-of-type(1) {
  margin-left: -0.12rem;
}

.per-text-box div p:nth-of-type(2) {
  margin-top: 0.07rem;
  font-family: 微软雅黑;
}

.per-text-box div p:nth-of-type(3) {
  color: #7f7f7f;
  font-size: 0.21rem;
  margin-top: 0.1rem;
}

.per-text-box > p {
  width: 2.52rem;
  line-height: 0.36rem;
  color: #636363;
  font-size: 0.18rem;
  text-align: justify;
  font-family: 微软雅黑;
}

.per-line {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

.per-line span {
  color: #7f7f7f;
  font-size: 0.18rem;
  font-family: 微软雅黑;
}

.per-line div {
  flex-grow: 1;
  height: 0.01rem;
  background: #cecece;
}

.cover-block {
  width: 100%;
  height: 100%;
  background-color: rgba(225, 225, 225, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

.cover-block1 {
  width: 100%;
  height: 100%;
  background-color: rgba(225, 225, 225, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  display:none ;
}

.cover-tip-box {
  width: 12rem;
  height: 9rem;
  background-color: #ffffff;
  box-shadow: 10px 12px 30px 0px rgba(0, 0, 0, 0.15);
  border-radius: 0.12rem;
  border: solid 2px #cecece;
  margin: 2.24rem auto;
  position: relative;

}

.cover-top-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  margin-top: 0.62rem;
}
.cover-tip-box1 {
  width: 12rem;
  height: 9rem;
  background-color: #ffffff;
  box-shadow: 10px 12px 30px 0px rgba(0, 0, 0, 0.15);
  border-radius: 0.12rem;
  border: solid 2px #cecece;
  margin: 2.24rem auto;
  position: relative;
  z-index:999;

}

.cover-top-box1 {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  margin-top: 0.62rem;
}
.tip-left-img-box {
  width: 4.06rem;
  height: 6.09rem;
  margin-left: 0.3rem;
}

.tip-left-img-box img {
  width: 100%;
  height: 100%;
}

.tip-right-intro-box {
  width: 6.98rem;
  height: 6.09rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-left: 0.29rem;
}

.intro-top-box {
  width: 6.98rem;
  border-bottom: 1px solid #ebebeb;
  padding-bottom: 1.35rem;
}

.intro-top-box p:nth-of-type(1) {
  font-family: 微软雅黑;
  font-size: 0.56rem;
  color: #cd2133;
}

.intro-top-box p:nth-of-type(2) {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  letter-spacing: 0px;
  color: #808080;
}

.intro-bottom-box {
  width: 100%;
  overflow: auto;
  box-sizing: border-box;
  margin-top: 0.23rem;
  padding-right: 0.15rem;
}

.intro-bottom-box::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
  height: 1px;
}
.intro-bottom-box::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  /* border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #535353; */
  border-radius: 10px;
background-image: linear-gradient(0deg, 
		rgba(0, 0, 0, 0.2) 0%, 
		rgba(255, 255, 255, 0.2) 100%), 
	linear-gradient(
		#a7a8ab, 
		#a7a8ab);
	background-blend-mode: overlay, 
		normal;
	box-shadow: 0px 1px 2px 0px 
		rgba(0, 0, 0, 0.3), 
		inset 0px 1px 0px 0px 
    rgba(255, 255, 255, 0.1)
  
}
.intro-bottom-box::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  /* -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background: #ededed; */
    border-radius: 10px;
    background-image: linear-gradient(0deg, 
		rgba(255, 255, 255, 0.3) 0%, 
		rgba(0, 0, 0, 0.3) 100%), 
	linear-gradient(
		#ebeaeb, 
		#ebeaeb);
	background-blend-mode: overlay, 
		normal;
	box-shadow: 0px 1px 0px 0px 
		rgba(255, 255, 255, 0.1), 
		inset 0px 1px 3px 0px 
		rgba(0, 0, 0, 0.35);
}

.intro-bottom-box::-webkit-scrollbar-button {
  /*滚动条里面轨道*/
  
    
}

.bottom-text-box {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

.charact-text {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #45505b;
}

.star-star {
  width: 0.12rem;
  padding-right: 0.1rem;
}

.charact-intro-text,
.star-star {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #808080;
  line-height: 0.36rem;
}

.charact-intro-text {
  /* flex-grow: 1; */
}

.cover-bottom-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-top: 0.9rem;
}

.cover-bottom-text-box p {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #45505b;
}

.cover-bottom-box a {
  width: 2.4rem;
  height: 0.8rem;
  background-color: #a19153;
  border-radius: 0.12rem;
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #ffffff;
  text-align: center;
  line-height: 0.8rem;
  margin-left: 1.1rem;
}

.close-cover {
  width: 0.47rem;
  height: 0.47rem;
  background-image: url("../images/close-cover.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: -0.3rem;
  right: -0.25rem;
}

.close-cover2 {
  width: 0.47rem;
  height: 0.47rem;
  background-image: url("../images/close-cover.png");
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: -0.3rem;
  right: -0.25rem;
}

.art-club-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.art-club-box .left,
.art-club-box .right {
  width: 0.17rem;
  height: 0.27rem;
  cursor: pointer;
}

.art-club-box .left {
  background-image: url("../images/left-btn.png");
  background-repeat: no-repeat;
  background-size: 100%;
  margin-left: 0.42rem;
}

.art-club-box .right {
  background-image: url("../images/right-btn.png");
  background-repeat: no-repeat;
  background-size: 100%;
  margin-right: 0.42rem;
}

.swiper-block {
  width: 10.89rem;
  
  overflow: hidden;
}

.swiper-big-box {
  display: flex;
  flex-direction: row;
  position: relative;
  top: 0;
  left: 0;
}

#nav-content .art-club-box .content {
  width: 10.90rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-grow: 0;
  flex-shrink: 0;
}

.art-club-box .content li {
  width: 1.92rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0.28rem;
  padding: 0 0.1292rem;
}

.art-club-box .content li .image {
  width: 1.68rem;
  height: 1.68rem;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.art-club-box .content li .name {
  font-family: 微软雅黑;
  font-size: 0.27rem;
  color: #000000;
  margin-top: 0.29rem;
}

.art-club-box .content li .intro {
  font-family: 微软雅黑;
  font-size: 0.16rem;
  color: #808080;
  text-align: center;
  line-height: 0.36rem;
}

.other-img-box {
  margin-left: 0.3rem;
  width: 3.94rem;
  height: 5.92rem;
}

.other-cover-box {
  margin-top: 0.43rem;
}

.other-tip-box {
  width: 6.98rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-left: 0.29rem;
  padding-right: 0.15rem;
}

.other-tip-box1 {
  width: 6.98rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-left: 0.29rem;
  padding-right: 0.15rem;
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #808080;
  margin-top: 0.97rem;
}
.other-tip-box div:nth-of-type(1) {
  font-family: 微软雅黑;
  font-size: 0.56rem;
  color: #000000;
}

.other-tip-box div:nth-of-type(2) {
  padding-bottom: 0.33rem;
  border-bottom: 1px solid #ebebeb;
}

.other-tip-box div:nth-of-type(2) p:nth-of-type(1) {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #808080;
  margin-top: 0.97rem;
}

.other-tip-box div:nth-of-type(2) p:nth-of-type(2) {
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #45505b;
  margin-top: 0.28rem;
}

.other-tip-box div:nth-of-type(3) {
  flex-grow: 1;
  height: 3.55rem;
  font-family: 微软雅黑;
  font-size: 0.24rem;
  color: #808080;
  overflow: auto;
  line-height: 0.36rem;
  margin-top: 0.44rem;
}

.other-tip-box div:nth-of-type(3)::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
  height: 1px;
}
.other-tip-box div:nth-of-type(3)::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  /* border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #535353; */
  border-radius: 10px;
background-image: linear-gradient(0deg, 
		rgba(0, 0, 0, 0.2) 0%, 
		rgba(255, 255, 255, 0.2) 100%), 
	linear-gradient(
		#a7a8ab, 
		#a7a8ab);
	background-blend-mode: overlay, 
		normal;
	box-shadow: 0px 1px 2px 0px 
		rgba(0, 0, 0, 0.3), 
		inset 0px 1px 0px 0px 
    rgba(255, 255, 255, 0.1)
  
}
.other-tip-box div:nth-of-type(3)::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  /* -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background: #ededed; */
    border-radius: 10px;
    background-image: linear-gradient(0deg, 
		rgba(255, 255, 255, 0.3) 0%, 
		rgba(0, 0, 0, 0.3) 100%), 
	linear-gradient(
		#ebeaeb, 
		#ebeaeb);
	background-blend-mode: overlay, 
		normal;
	box-shadow: 0px 1px 0px 0px 
		rgba(255, 255, 255, 0.1), 
		inset 0px 1px 3px 0px 
		rgba(0, 0, 0, 0.35);
}

.other-tip-box div:nth-of-type(3)::-webkit-scrollbar-button {
  /*滚动条里面轨道*/
  
    
}

#footer {
  width: 100%;
  padding: 1.08rem 0 0.43rem;
}

.footer-center-box {
  width: 14.7rem;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.footer-left-list {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
}

.once-list-box {
  margin-left: 0.7rem;
}

.once-list-box:nth-of-type(1) {
  margin-left: 0;
}

.once-list-box li {
  display: flex;
  margin-top: 0.24rem;
}
.once-list-box li:nth-of-type(1) {
  display: flex;
  margin-top: 0;
}

.once-list-box li:nth-of-type(2) {
  margin-top: 0.35rem;
}

.once-list-box li:nth-of-type(1) a {
  color: #000;
  font-size: 0.24rem;
  font-family: 微软雅黑;
}

.once-list-box a {
  color: #6d6d6d;
  font-size: 0.21rem;
  font-family: 微软雅黑;
}

.footer-right-msg {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footer-right-msg a {
  color: #000;
  font-size: 0.38rem;
  font-family: 微软雅黑;
}

.footer-right-msg img {
  width: 1.78rem;
  height: 1.78rem;
  margin-top: 0.39rem;
}

.footer-right-msg span {
  color: #6d6d6d;
  font-size: 0.24rem;
  margin-top: 0.2rem;
  font-family: 微软雅黑;
}

#bottom {
  padding: 0.19rem 0 1.21rem;
  border-top: 2px solid #d2d2d2;
}

.bottom-box {
  width: 14.9rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  /* margin-left: 2.19rem; */
  margin: 0 auto;
}

.bottom-box span {
  color: #000;
  font-size: 0.21rem;
  font-family: 微软雅黑;
}

.footer-img-box {
  width: 1.54rem;
  height: 0.49rem;
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: space-between;
  margin-right: 0.4rem;
}

.footer-img-box a:nth-of-type(1) {
  width: 0.5rem;
  height: 0.49rem;
  background-image: url("../images/footer-wx.png");
  background-repeat: no-repeat;
  background-size: 0.5rem 0.49rem;
}

.footer-img-box a:nth-of-type(2) {
  width: 0.53rem;
  height: 0.44rem;
  background-image: url("../images/footer-wb.png");
  background-repeat: no-repeat;
  background-size: 0.53rem 0.44rem;
}

#fixed-nav {
  width: 0.52rem;
  position: fixed;
  top: 3.5rem;
  right: 0;
}

#fixed-nav .top,
#fixed-nav .bottom,
#fixed-nav .middle {
  width: 0.52rem;
  background-color: #ffffff;
  border-radius: 0.04rem;
  border: solid 1px #cecece;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  padding: 0.18rem 0 0.11rem;
  cursor: pointer;
}

#fixed-nav .top {
  border-bottom: none;
}

#fixed-nav .middle {
  border-bottom: none;
}

#fixed-nav .top img {
  /* width: 0.17rem; */
  height: 0.22rem;
  /* background-image: url('../images/jilu.png');
    background-repeat: no-repeat;
    background-size: 0.17rem 0.22rem; */
}

#fixed-nav .top span {
  font-size: 0.14rem;
  margin-top: 0.1rem;
  color: #f18700;
}

#fixed-nav .bottom div {
  width: 0.16rem;
  height: 0.11rem;
  background-image: url("../images/fanhui.png");
  background-repeat: no-repeat;
  background-size: 0.16rem 0.11rem;
}

#fixed-nav .bottom span:nth-of-type(1) {
  margin-top: 0.08rem;
}

#fixed-nav .bottom span {
  font-size: 0.14rem;
  color: #9b9b9b;
  font-family: HYWenHei-EEW;
}

#fixed-nav .middle div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#fixed-nav .middle div:nth-of-type(2) {
  margin-top: 0.12rem;
}

#fixed-nav .middle span {
  font-size: 0.14rem;
  margin-top: 0.08rem;
  color: #763590;
  font-family: HYWenHei-EEW;
}

#fixed-nav .middle div:nth-of-type(2) span {
  color: #1567b2;
}

#fixed-nav .middle img {
  width: 0.22rem;
  height: 0.21rem;
}

.yc {
  display: none; 
}

