div{ margin:0 auto}
img{ border:0;  }

*{ font: normal 0.22rem/100% Helvetica, Arial, sans-serif;}
*{ padding:0; margin:0;font-family:Helvetica; font-family:'黑体';   -webkit-tap-highlight-color: transparent;	font-family:'微软雅黑'; font-family:'Microsoft YaHei';}
@media screen and (min-width: 320px) {html{font-size:50px;}}
@media screen and (min-width: 360px) {html{font-size:56.25px;}}
@media screen and (min-width: 375px) {html{font-size:58.59375px;}}
@media screen and (min-width: 400px) {html{font-size:62.5px;}}
@media screen and (min-width: 414px) {html{font-size:64.6875px;}}
@media screen and (min-width: 440px) {html{font-size:68.75px;}}
@media screen and (min-width: 480px) {html{font-size:75px;}}
@media screen and (min-width: 520px) {html{font-size:81.25px;}}
@media screen and (min-width: 560px) {html{font-size:87.5px;}}
@media screen and (min-width: 600px) {html{font-size:93.75px;}}
@media screen and (min-width: 640px) {html{font-size:100px;}}
@media screen and (min-width: 680px) {html{font-size:100px;}}
@media screen and (min-width: 720px) {html{font-size:100px;}}
@media screen and (min-width: 760px) {html{font-size:100px;}}
@media screen and (min-width: 800px) {html{font-size:100px;}}
@media screen and (min-width: 960px) {html{font-size:100px;}}


a{ text-decoration:none;}

  .swiper-container {
      width: 100%;
     
    }
    .swiper-slide {
      text-align: center;
     
          width: 100%;  

		  
    }

 .swiper-container {
      width: 100%;
      height: 100%;
    }
.my1 .swiper-wrapper {
      width: 100%;
      height:100%
    }
	
	.my1 .swiper-pagination-bullet{ margin:0 3px !important}
	.my1 .swiper-pagination-bullet{ width:9px !important; height:9px !important;  border:1px solid #fff;}
	.my1 .swiper-pagination-bullet-active{ background:#ffa500 !important}
	
		.my2 .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin:0 5px !important}
	.my2 .swiper-pagination-bullet,.my3 .swiper-pagination-bullet,.my4 .swiper-pagination-bullet,.my5 .swiper-pagination-bullet{ width:8px !important; height:8px !important;  border:1px solid #fff;}
	
	.my2 .swiper-pagination-bullet,.my3 .swiper-pagination-bullet，.my4 .swiper-pagination-bullet，.my5 .swiper-pagination-bullet{ background:#006390 !important}
	.my2 .swiper-pagination-bullet-active，.my3 .swiper-pagination-bullet-active，.my4 .swiper-pagination-bullet-active，.my5 .swiper-pagination-bullet-active{ background:#0087c2 !important}
	
	 .my1 .swiper-slide{ opacity:0 !important;}
 .my1 .swiper-slide-prev{ opacity:0  !important;}
.my1 .swiper-slide-next{ opacity:0  !important;}
.my1 .swiper-slide-active{ opacity:1  !important;}
	
	  .my2,.my3,.my4,.my5 {
      width: 100%;
      height: 88%;
      margin-left: auto;
	  margin-top:6%;
      margin-right: auto; padding-bottom:6%;
    }
	
	
	
    .my2 .swiper-slide,.my3 .swiper-slide,.my4 .swiper-slide,.my5 .swiper-slide {
      text-align: center; 
    
      height: calc((100%) / 2);

      /* Center slide text vertically */
    
     position:relative;
    }
	
    .gallery-top .swiper-slide {
      background-size: cover;
      background-position: center;
    }

    .gallery-top {
      height: 73%;
      width: 100%;
    }

    .gallery-thumbs {
      height: 20%;
      box-sizing: border-box;
   
    }

    .gallery-thumbs .swiper-slide {
		align-items:center; display: flex;justify-content:center;
      width: 25%;
      height: 100%;
      opacity: 1;
	  background-size:100% 100%; 
    }
	.gallery-thumbs .swiper-slide p{ background:#000; opacity:0.5; position:absolute; width:100%; height:100%; display:block; z-index:11}
 .gallery-thumbs .swiper-slide  span{align-items:center; color:#fff; font-size:0.22rem; display: flex;justify-content:center; position:absolute; z-index:22; width:100%; height:100%;}
    .gallery-thumbs .swiper-slide-thumb-active {
      opacity: 1;
    }
	 .gallery-thumbs .swiper-slide-thumb-active span{ display:none}
	 
	 	 .gallery-thumbs .swiper-slide-thumb-active p{ background:#000; opacity:0; position:absolute; width:100%; height:100%; display:block;}
	 
	.boxdem{ width:100%; max-width:640px; margin:0 auto; }
   .huanghuan{ width:100%; position:relative;}
	#ios{ position: fixed; width:100%; bottom:0%; left:0; height:30px; z-index:999; display:none }
.oscc{ position:absolute; width:100%; background:#fff; opacity:0.5; left:0%; height:100%; top:0; z-index:2}
.ostxt{ position:absolute; width:96%; overflow:hidden;text-overflow:ellipsis;white-space:nowrap;  left:2%; height:30px; font-size:12px; color:#000; text-align:left; top:0; z-index:11; line-height:30px;}
.bontxt{ width:92%; position:absolute; top:0;  height:100%; text-align:center; font-size:0.3rem; line-height:0.4rem; left:4%;}


.box1{ width:92%; position:absolute; top:0;  height:100%;  left:4%;}
.hql{ width:22%; position:absolute; bottom:10%;  height:30%;   left:13%;}
.hqr{ width:22%; position:absolute; bottom:10%;  height:30%;    right:13%;}
.hql a,.hqr a{ display:block; width:100%; height:100%;}

.myswp1{ width:82%; position:absolute; top:6%;  height:100%;  left:9%;}
.myfat{ width:100%; height:100%; position:relative}
.navbox{ width:92%; position:absolute; top:0;  height:100%;  left:4%;}

.navli{justify-content:center; width:24.25%; height:100%; background:url(../img/navoff.png) no-repeat center; font-size:0.22rem; color:#3c6b72; background-size:100% 100%; align-items:center; display: flex; float:left; margin-right:1%;}
.navli:nth-child(4){ margin-right:0px;}
.curr1{background:url(../img/navon.png) no-repeat center; background-size:100% 100%; }
.myswp2{ width:92%; position:absolute; top:0;  height:100%;  left:4%;}
.myswp2li{ width:100%; position:absolute; top:0;  height:100%;  left:0%; display:none}
  .my2 .swiper-slide p,.my3 .swiper-slide p,.my4 .swiper-slide p,.my5 .swiper-slide p{ position:absolute; width:100%; bottom:4%; left:0px; color:#fff; font-size:0.2rem; text-align:center;  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .my2 .swiper-slide a,.my3 .swiper-slide a,.my4 .swiper-slide a,.my5 .swiper-slide a{ position:absolute; left:35%; width:30%; height:20%;  display:block; bottom:27%; z-index:999;  cursor: pointer;}
  .my2 .swiper-slide span,.my3 .swiper-slide span,.my4 .swiper-slide span,.my5 .swiper-slide span{ position:absolute; left:0; bottom:13%; font-size:0.22rem; font-weight:bold; color:#e59a0f; width:100%;}
  .my2 .swiper-slide span label,.my3 .swiper-slide span label,.my4 .swiper-slide span label,.my5 .swiper-slide span label{ font-size:0.3rem;font-weight:bold; font-family:Helvetica;}
  
  .mybox3{ width:92%; position:absolute; top:0;  height:100%;  left:4%;}
  .mybox3 a{ display:block; width:100%; height:24%; margin-bottom:1%; }
  .mybox3 a:nth-child(4){ margin-bottom:0px;}
    .mybox4{ width:92%; position:absolute; top:0;   height:100%;  left:4%;}
  .mybox4 a{ display:block; width:48%; height:47%; float:left;margin-bottom:3%;}
  .mybox4 a:nth-child(2n){ float:right}
  .myswp5{width:88%; position:absolute; top:5%;  height:88%;  left:5.5%; }