@charset "UTF-8";
/*定义全局*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address,
 big, cite, code,del, dfn, em,img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, 
 center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table,caption, tbody, tfoot, thead, tr, th, 
 td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav,output, 
 ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;}
body, input, button, select, textarea {font-size: 14px;color: #333;font-family: 'Microsoft Yahei', 'Arial';-webkit-font-smoothing: antialiased;}
fieldset, img { border: 0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal;font-weight: normal;}
ol, ul {list-style: none;}
q:before, q:after { content: '';}
a{text-decoration:none;border:0;blr:expression_r(this.onFocus=this.blur());color:#4c4c4c;}
a:hover{text-decoration:none;}
a:focus{outline:none;}
a, a:hover, a:visited, a:link, a:active , a:focus {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html,body {
  position: relative;
  height: 100%;
}

input:focus, textarea:focus {outline: none;}
.clearfix:after {content: "."; display: block;height: 0;visibility: hidden;clear: both;}
.index_logo, .index_menu li a{display: block;}
.hide {display: none;}
.clear{clear:both;}

::-webkit-scrollbar {
    width: 5px;}

::-webkit-scrollbar-track {
    background-color: #f5f5f5;
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.1);
    border-radius: 5px;}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 5px;}

::-webkit-scrollbar-button {
    background-color: #eee;
    display: none;}

::-webkit-scrollbar-corner {
    background-color: black;}






.image-gallery {
  display: flex;
  width: 100vw;
  height: 100vh;
}

.image-item {
  position: relative;
  flex: 1;
  overflow: hidden;
}

.image-item img.index-pic {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width:100%;
  height: 100%;
  background: -webkit-linear-gradient(top, rgba(26, 1,51, 1), rgba(45, 17, 75, 0.8));
 /* background:url(../images/cover.png) no-repeat top center;
  background-size:100%;*/
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: opacity 0.5s ease;
  height: 100vh;
}



.title, .tit,.line, .btn, .progress-bar {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.5s ease;
}


.tit{width:25%;position:absolute;top:8%;left:37.5%;}
.tit img{width:100%}



.title{height:120px;margin:10% auto 0}
.title img{height:120px;}


.line{width:70%;margin:50px 15% 0}
.line img{width:100%}


.btn{width:50%;margin:10% 25% 0;cursor: pointer;}
.btn img{width:100%}


.btn img:hover{transform: scale(1.1);transition: all .3s linear;}

.progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height:8px;
  background:#fff;
  transition: width 0.5s ease;
  z-index:99;
}
.indexs{display:none}


@media (max-width:1200px) {
    .title{height:100px;}
    .title img{height:100px;}
}
@media (max-width:1025px) {
    .title{height:80px;}
    .title img{height:80px;}
}

@media (max-width:992px) {
    .title{height:80px;}
    .title img{height:80px;}
    .progress-bar {height:5px;}
}
@media (max-width:768px) {
    .image-gallery{display:none}
    .indexs{position: absolute;left:0;top:0;
      height: 100%;display:block;}
    .swiper {width: 100%;height: 100%;}
    .swiper-slide {display: flex;justify-content: center;align-items: center;}
    .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
    .swiper-pagination-bullet-active{background:#61279f}

}




