@charset "UTF-8";
/* css reset */
html, body, ul, p, h1, h2, h3, form, input {
  margin: 0;
  padding: 0;
  font-family: "Microsoft YaHei", Arial, Helvetica, sans-serif; }

body, html {
  width: 100%;
  height: 100%; }

div {
  position: relative; }

a, a:hover {
  display: inline-block;
  *display: inline;
  zoom: 1;
  text-decoration: none; }

ul {
  font-size: 0; }

li {
  list-style: none; }

img {
  border: none;
  vertical-align: top; }

body {
  -webkit-tap-highlight-color: transparent; }

/*鐐瑰嚮鏃朵笉鍑虹幇榛戝潡*/
/* css reset end */
/* momo's default */
.btn-box .btn, .inline {
  display: inline-block;
  *display: inline;
  zoom: 1; }

.btn-box {
  font-size: 0;
  position: absolute;
  transition: all .1s ease;
  -webkit-transition: all .1s ease;
  pointer-events: all; }

.btn {
  text-align: center;
  cursor: pointer; }

.popup-box {
  display: none;
  z-index: 99; }

/* .bg{display:none;position:fixed;width:100%;height:100%;background: #000;opacity:0.8;filter:Alpha(opacity=80);top:0;left:0;z-index:98;} */
.bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  top: 0;
  left: 0;
  z-index: 98; }

.centertop {
  -webkit-transform-origin: center top;
  transform-origin: center top; }

.centerbot {
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom; }

.action {
  opacity: 0;
  pointer-events: none; }
  .action.active {
    opacity: 1;
    pointer-events: all; }

/* momo's default end */
body {
  background: #fff; }

h1, p, a {
  color: #fff; }

/* 鍏ㄩ儴css */
@font-face {
  font-family: hyqh35;
  src: url("../../font/HYQiHei-35S.otf"); }
@font-face {
  font-family: hyqh40;
  src: url("../../font/HYQiHei-40S.otf"); }
@font-face {
  font-family: hyqh45;
  src: url("../../font/HYQiHei-45S.otf"); }
@font-face {
  font-family: hyqh55;
  src: url("../../font/HYQiHei-55S.otf"); }
@font-face {
  font-family: hyqh60;
  src: url("../../font/HYQiHei-60S.otf"); }
@font-face {
  font-family: dinM;
  src: url("../../font/DIN-MEDIUM.OTF"); }
body {
  background-color: #000; }

.main {
  width: 1920px;
  height: 1080px;
  position: relative;
  margin: 0 auto;
  /* background: $t; */ }

.main-non-zoom {
  height: 100%;
  width: 100%; }

.swiper-container-index, .swiper-container-marketing, .swiper-container-person {
  width: 100%;
  height: 100%;
  position: relative;
  margin: 0 auto;
  overflow: hidden; }
  .swiper-container-index .swiper-slide, .swiper-container-marketing .swiper-slide, .swiper-container-person .swiper-slide {
    pointer-events: none; }
    .swiper-container-index .swiper-slide .swiper-container .swiper-slide, .swiper-container-marketing .swiper-slide .swiper-container .swiper-slide, .swiper-container-person .swiper-slide .swiper-container .swiper-slide {
      pointer-events: none; }
  .swiper-container-index .swiper-slide-active, .swiper-container-marketing .swiper-slide-active, .swiper-container-person .swiper-slide-active {
    pointer-events: all; }
    .swiper-container-index .swiper-slide-active .swiper-container .swiper-slide, .swiper-container-marketing .swiper-slide-active .swiper-container .swiper-slide, .swiper-container-person .swiper-slide-active .swiper-container .swiper-slide {
      pointer-events: all; }

.logo0 {
  width: 186px;
  height: 63px;
  position: absolute;
  top: 35px;
  right: 40px;
  background: url("../../img/logo0.png") no-repeat center;
  z-index: 9;
  opacity: 0;
  -webkit-transition: all 0.6s;
  transition: all 0.6s; }
  .logo0.active {
    opacity: 1; }

.logo1 {
  width: 186px;
  height: 63px;
  position: absolute;
  top: 5%;
  left: 50%;
  margin-left: -93px;
  background: url("../../img/logo0.png") no-repeat center;
  z-index: 9;
  -webkit-transition: all 0.6s;
  transition: all 0.6s; }

.logo-20year {
  width: 190px;
  height: 108px;
  position: absolute;
  top: 35px;
  left: 130px;
  background: url("../../img/logo-20year.png") no-repeat center;
  z-index: 9;
  -webkit-transition: all 0.6s;
  transition: all 0.6s; }

.s {
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  /* .cont{height: 100%; width: 100%; position: absolute; top: 50%; left: 50%; margin-top: -50%; margin-left: -50%; background-size: 100%;} */ }
  .s.person {
    pointer-events: none; }
    .s.person .intro-box, .s.person .words-box, .s.person .words-box .words {
      pointer-events: none; }
    .s.person.swiper-slide-active {
      pointer-events: all; }
      .s.person.swiper-slide-active .intro-box, .s.person.swiper-slide-active .words-box {
        pointer-events: all; }
      .s.person.swiper-slide-active .words-box .words {
        pointer-events: none;
        opacity: 0; }
      .s.person.swiper-slide-active .words-box .words.active {
        pointer-events: all;
        opacity: 1; }
  .s .cont {
    width: 1920px;
    height: 1080px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -960px;
    margin-top: -540px;
    background: none no-repeat center; }

.loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 9; }
  .loading .rect {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -25px;
    background: none no-repeat center;
    border: solid 1px #fff; }

.next-box {
  width: 80px;
  height: 77px;
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -40px;
  background: none no-repeat center;
  z-index: 99;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  pointer-events: none;
  opacity: 0; }
  .next-box.active {
    opacity: 1;
    pointer-events: all;
    cursor: pointer; }
  .next-box .title {
    width: 80px;
    height: 77px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -40px;
    background: none no-repeat center;
    font-size: 12px;
    line-height: 77px;
    color: #fff;
    font-family: "Microsoft YaHei";
    font-family: "hyqh35","Microsoft YaHei", Arial, Helvetica, sans-serif;
    text-align: center; }
  .next-box .line {
    opacity: 0; }

.btn-svg-box {
  position: absolute;
  bottom: 237px;
  right: 664px;
  opacity: 0; }
  .btn-svg-box .btn {
    width: 214px;
    height: 57px;
    background: none no-repeat center; }
  .btn-svg-box .icon {
    width: 22px;
    height: 19px;
    position: absolute;
    top: 20px;
    left: 0;
    background: url("../../img/btn-video-icon.png") no-repeat center;
    pointer-events: none;
    opacity: 0; }
  .btn-svg-box .label-box {
    opacity: 0; }
  .btn-svg-box .label {
    width: 204px;
    height: 57px;
    position: absolute;
    top: 0;
    left: 10px;
    background: none no-repeat center;
    font-size: 22px;
    line-height: 57px;
    color: #fff;
    font-family: "Microsoft YaHei";
    font-family: "hyqh35", "Microsoft YaHei", Arial, Helvetica, sans-serif;
    letter-spacing: .22em;
    text-align: center;
    pointer-events: none;
    overflow: hidden; }
    .btn-svg-box .label.active {
      -webkit-animation: btnTitle 0.2s ease-in-out forwards;
      -moz-animation: btnTitle 0.2s ease-in-out forwards;
      -ms-animation: btnTitle 0.2s ease-in-out forwards;
      -o-animation: btnTitle 0.2s ease-in-out forwards;
      animation: btnTitle 0.2s ease-in-out forwards; }
  .btn-svg-box svg {
    width: 204px;
    height: 57px;
    position: absolute;
    top: 0;
    left: 10px;
    background: none no-repeat center;
    pointer-events: none; }
    .btn-svg-box svg path {
      stroke: #fff;
      fill: none;
      stroke-width: 4px;
      stroke-dasharray: 498;
      stroke-dashoffset: 498;
      -webkit-transition: all 0.4s;
      -moz-transition: all 0.4s;
      -ms-transition: all 0.4s;
      -o-transition: all 0.4s;
      transition: all 0.4s; }
  .btn-svg-box.active .label-box {
    -webkit-animation: fadeIn 0.3s ease-in-out 0.5s forwards;
    -moz-animation: fadeIn 0.3s ease-in-out 0.5s forwards;
    -ms-animation: fadeIn 0.3s ease-in-out 0.5s forwards;
    -o-animation: fadeIn 0.3s ease-in-out 0.5s forwards;
    animation: fadeIn 0.3s ease-in-out 0.5s forwards; }
  .btn-svg-box.active .icon {
    -webkit-animation: fadeIn 0.3s ease-in-out 0.3s forwards;
    -moz-animation: fadeIn 0.3s ease-in-out 0.3s forwards;
    -ms-animation: fadeIn 0.3s ease-in-out 0.3s forwards;
    -o-animation: fadeIn 0.3s ease-in-out 0.3s forwards;
    animation: fadeIn 0.3s ease-in-out 0.3s forwards; }
  .btn-svg-box.active path {
    stroke-dashoffset: 0; }

/* index */
.index0 .cont0 {
  background-image: url("../../img/pc-index0-cont0.png"); }
.index0 .cont1 {
  background-image: url("../../img/pc-index0-cont1.png"); }
.index0 .cont2 {
  background-image: url("../../img/pc-index0-cont2.png"); }
.index0 .bot-logo {
  background-image: url("../../img/pc-index0-logo.png?v6"); }

.index1 {
  background-color: #000; }
  .index1 .swiper-container-index-season {
    width: 100%;
    height: 80%;
    position: absolute;
    bottom: 0;
    left: 0; }
    .index1 .swiper-container-index-season .swiper-slide {
      height: 100%;
      min-height: 500px;
      overflow: hidden;
      -webkit-transform: skew(-10deg);
      transform: skew(-10deg);
      pointer-events: all; }
      .index1 .swiper-container-index-season .swiper-slide .mask {
        height: 100%;
        width: 100%;
        -webkit-transform: skew(10deg);
        transform: skew(10deg); }
        .index1 .swiper-container-index-season .swiper-slide .mask .img-box {
          width: 100%;
          height: 100%;
          text-align: center; }
          .index1 .swiper-container-index-season .swiper-slide .mask .img-box img {
            position: absolute;
            bottom: 0;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            height: 100%;
            pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .content {
          width: 1086px;
          height: 863px;
          position: absolute;
          bottom: 0px;
          left: 50%;
          margin-left: -543px;
          background: none no-repeat center; }
        .index1 .swiper-container-index-season .swiper-slide .mask .contentbg0 {
          background-color: rgba(0, 0, 0, 0.7);
          opacity: 1;
          -webkit-transition: all 0.6s;
          transition: all 0.6s;
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .contentbg1 {
          background-image: url("../../img/contentbg.png");
          opacity: 0;
          -webkit-transition: all 0.6s;
          transition: all 0.6s;
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .word {
          width: 100%;
          position: absolute;
          left: 0;
          text-align: center;
          text-shadow: 0px 4px 5px rgba(0, 0, 0, 0.8);
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .bot-line {
          width: 22px;
          height: 4px;
          position: absolute;
          top: 59%;
          left: 50%;
          margin-left: -11px;
          background: #fff no-repeat center;
          box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.8);
          opacity: 0;
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .vol {
          top: 50%;
          font-size: 24px;
          line-height: 60px;
          color: #fff;
          font-family: "Microsoft YaHei";
          font-family: "dinM", "Microsoft YaHei", Arial, Helvetica, sans-serif;
          font-style: italic;
          opacity: 0;
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .season {
          top: 63%;
          font-size: 56px;
          line-height: 56px;
          color: #fff;
          font-family: "Microsoft YaHei";
          font-family: "hyqh60", "Microsoft YaHei", Arial, Helvetica, sans-serif;
          letter-spacing: .2em;
          opacity: 0; }
        .index1 .swiper-container-index-season .swiper-slide .mask .description {
          top: 72%;
          font-size: 16px;
          line-height: 26px;
          color: #fff;
          font-family: "Microsoft YaHei";
          font-family: "hyqh40", "Microsoft YaHei", Arial, Helvetica, sans-serif;
          letter-spacing: .1em;
          font-style: italic;
          opacity: 0;
          pointer-events: none; }
        .index1 .swiper-container-index-season .swiper-slide .mask .btn-svg-box-out {
          pointer-events: all;
          width: 214px;
          height: 57px;
          position: absolute;
          top: 82%;
          left: 50%;
          margin-left: -107px;
          background: none no-repeat center;
          -webkit-transform: scale(0.8);
          transform: scale(0.8); }
        .index1 .swiper-container-index-season .swiper-slide .mask .btn-go-box {
          bottom: 0;
          right: 0;
          opacity: 1;
          cursor: pointer; }
          .index1 .swiper-container-index-season .swiper-slide .mask .btn-go-box .icon {
            width: 22px;
            height: 19px;
            position: absolute;
            top: 20px;
            left: 0;
            background: url("../../img/btn-go-icon.png") no-repeat center; }
        .index1 .swiper-container-index-season .swiper-slide .mask.active {
          z-index: 9;
          opacity: 1;
          /* img{opacity:1;} */ }
          .index1 .swiper-container-index-season .swiper-slide .mask.active .contentbg0 {
            -webkit-transition: all 0.6s;
            transition: all 0.6s;
            opacity: 0; }
          .index1 .swiper-container-index-season .swiper-slide .mask.active .contentbg1 {
            -webkit-transition: all 0.6s;
            transition: all 0.6s;
            opacity: 1; }
    .index1 .swiper-container-index-season .swiper-button {
      width: 100px;
      height: 25px;
      position: absolute;
      top: 50%;
      background-image: url("../../img/btn-slide-pc.png?v2");
      background-repeat: no-repeat;
      background-size: 200px 25px;
      margin-top: -25px; }
      .index1 .swiper-container-index-season .swiper-button.swiper-button-prev {
        background-position: 0 0;
        left: 50px; }
      .index1 .swiper-container-index-season .swiper-button.swiper-button-next {
        background-position: -100px 0;
        right: 50px; }

.index2 .cont {
  background-image: url("../../img/pc-index2-cont.png"); }

/* marketing */
.marketing0 .cont {
  background-image: url("../../img/pc-marketing0-cont.png"); }
.marketing0 .bot-logo {
  background-image: url("../../img/pc-index0-logo.png?v6"); }

.marketing1 .swiper-container-marketing-person {
  width: 1740px;
  height: 780px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -870px;
  margin-top: -390px;
  background: none no-repeat center; }
  .marketing1 .swiper-container-marketing-person .swiper-slide .one {
    color: #fff;
    width: 430px;
    height: 260px;
    cursor: pointer;
    float: left;
    /* .name{@include placetr(255px,36px,50px,0);@include font(36px,36px,#fff);font-family:"hyqh60", "Microsoft YaHei", Arial, Helvetica, sans-serif;} */
    /* .title{@include placetr(255px,30px,89px,0);@include font(16px,18px,#fff);font-family:"hyqh35", "Microsoft YaHei", Arial, Helvetica, sans-serif;font-style: italic;} */
    /* .topic-box{
    	@include placetl(295px,25px,170px,120px,$red);
    	.topic{@include placetl(240px,25px,0,55px);@include font(13px,25px,#fff);font-family:"hyqh45", "Microsoft YaHei", Arial, Helvetica, sans-serif;overflow:hidden;}
    } */ }
    .marketing1 .swiper-container-marketing-person .swiper-slide .one .word-box {
      width: 255px;
      height: 125px;
      position: absolute;
      top: 45px;
      right: 0;
      background: none no-repeat center;
      overflow: hidden; }
    .marketing1 .swiper-container-marketing-person .swiper-slide .one .portrait {
      width: 200px;
      height: 200px;
      position: absolute;
      top: 30px;
      left: 10px;
      background: none no-repeat center;
      z-index: 9; }
    .marketing1 .swiper-container-marketing-person .swiper-slide .one .vol {
      width: 255px;
      height: 13px;
      position: absolute;
      top: 30px;
      right: 0;
      background: none no-repeat center;
      font-size: 13px;
      line-height: 13px;
      color: #e03226;
      font-family: "Microsoft YaHei";
      font-family: "hyqh55", "Microsoft YaHei", Arial, Helvetica, sans-serif;
      font-style: italic; }
    .marketing1 .swiper-container-marketing-person .swiper-slide .one .des {
      width: 430px;
      height: 260px;
      position: absolute;
      top: 0;
      left: 0;
      background: none no-repeat center; }
.marketing1 .swiper-button {
  width: 25px;
  height: 40px;
  position: absolute;
  top: 50%;
  background-image: url("../../img/btn-slide.png?v1");
  background-repeat: no-repeat;
  background-size: 50px 40px;
  margin-top: -20px;
  cursor: pointer; }
  .marketing1 .swiper-button.swiper-button-prev {
    background-position: 0 0;
    left: 40px; }
  .marketing1 .swiper-button.swiper-button-next {
    background-position: -25px 0;
    right: 40px; }
.marketing1 .swiper-button-prev {
  -webkit-animation: btnPrev 1s cubic-bezier(0.7, 0.01, 0.34, 0.99) infinite;
  animation: btnPrev 1s cubic-bezier(0.7, 0.01, 0.34, 0.99) infinite; }
.marketing1 .swiper-button-next {
  -webkit-animation: btnNext 1s cubic-bezier(0.7, 0.01, 0.34, 0.99) infinite;
  animation: btnNext 1s cubic-bezier(0.7, 0.01, 0.34, 0.99) infinite; }
.marketing1 .swiper-pagination {
  width: 100%;
  height: 15px;
  position: absolute;
  left: 0;
  bottom: 10%;
  z-index: 9; }
  .marketing1 .swiper-pagination .swiper-pagination-bullet {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 7px;
    background-color: #fff;
    opacity: 1;
    -webkit-transition: all 0.5s;
    transition: all 0.5s; }
  .marketing1 .swiper-pagination .swiper-pagination-bullet-active {
    background-color: #e03226; }

/* person */
.swiper-pagination.swiper-pagination-person {
  width: 10px;
  height: 144px;
  position: fixed;
  top: 50%;
  right: 20px;
  z-index: 9; }
  .swiper-pagination.swiper-pagination-person .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 48px;
    margin: 0;
    opacity: .3;
    background: none;
    background-image: url("../../img/pagination.png");
    -webkit-transition: all 1s;
    transition: all 1s; }
  .swiper-pagination.swiper-pagination-person .swiper-pagination-bullet-active {
    opacity: 1; }

.swiper-pagination-person-inner {
  width: 615px;
  height: 9px;
  position: absolute;
  top: 535px;
  left: 510px;
  background: none no-repeat center;
  text-align: right; }
  .swiper-pagination-person-inner .swiper-pagination-bullet {
    display: inline-block;
    width: 12px;
    height: 11px;
    opacity: .5;
    background: none;
    border: 1px solid #fff;
    border-radius: 0;
    margin: 0 3px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }
  .swiper-pagination-person-inner .swiper-pagination-bullet-active {
    width: 35px;
    background: #fff;
    opacity: 1; }

.person0 .cont {
  opacity: 0; }
.person0 .btn-video-box {
  position: absolute;
  bottom: 237px;
  right: 664px; }
  .person0 .btn-video-box .btn {
    width: 214px;
    height: 57px;
    background: none no-repeat center; }
  .person0 .btn-video-box .icon {
    background-image: url("../../img/btn-video-icon.png"); }

.intro-box, .words-box {
  width: 850px;
  height: 300px;
  position: absolute;
  top: 635px;
  left: 50%;
  margin-left: -425px;
  background: none no-repeat center;
  overflow: hidden; }
  .intro-box p, .words-box p {
    font-size: 18px;
    line-height: 40px;
    color: #fff;
    font-family: "Microsoft YaHei";
    font-family: "hyqh35", "Microsoft YaHei", Arial, Helvetica, sans-serif;
    text-indent: 30px;
    padding-bottom: 10px; }
  .intro-box h2, .words-box h2 {
    font-size: 24px;
    line-height: 40px;
    color: #fff;
    font-family: "Microsoft YaHei";
    font-family: "hyqh35", "Microsoft YaHei", Arial, Helvetica, sans-serif;
    text-indent: 30px;
    padding-bottom: 20px;
    font-weight: bold; }
  .intro-box .no-indent, .words-box .no-indent {
    text-indent: 0; }
  .intro-box .yihan, .words-box .yihan {
    font-weight: bold;
    font-size: 22px; }

.person1 .title {
  background-image: url("../../img/pc-person1-title.png");
  pointer-events: none; }
.person1 .pic {
  width: 723px;
  height: 405px;
  position: absolute;
  top: 140px;
  right: 370px;
  background: none no-repeat center; }

.person2 .title {
  background-image: url("../../img/pc-person2-title.png");
  pointer-events: none;
  z-index: 9; }
.person2 .swiper-container-person-video {
  width: 615px;
  height: 345px;
  position: absolute;
  top: 160px;
  left: 515px;
  background: none no-repeat center; }
  .person2 .swiper-container-person-video .swiper-slide {
    width: 615px;
    height: 345px; }
    .person2 .swiper-container-person-video .swiper-slide .btn-play-box {
      position: absolute;
      top: 131px;
      left: 50%;
      margin-left: -41px; }
      .person2 .swiper-container-person-video .swiper-slide .btn-play-box .btn {
        width: 82px;
        height: 82px;
        background: url("../../img/btn-play.png") no-repeat center; }
.person2 .swiper-button {
  width: 100px;
  height: 25px;
  position: absolute;
  top: 50%;
  background-image: url("../../img/btn-slide-pc.png?v2");
  background-repeat: no-repeat;
  background-size: 200px 25px;
  margin-top: -25px;
  -webkit-transform: scale(1.5);
  transform: scale(1.5); }
  .person2 .swiper-button.swiper-button-prev {
    background-position: 0 0;
    left: 200px; }
  .person2 .swiper-button.swiper-button-next {
    background-position: -100px 0;
    right: 200px; }
.person2 .words-box {
  width: 765px;
  height: 295px;
  margin-left: -321.5px;
  /* p{line-height: 40px;} */ }
  .person2 .words-box .words {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    position: absolute;
    top: 0;
    left: 0;
    width: 765px;
    height: 295px; }

.popup-video-box {
  width: 100%;
  height: 100%;
  background-color: #000;
  position: fixed;
  top: 0;
  left: 0; }
  .popup-video-box .btn-close-box {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 9; }
    .popup-video-box .btn-close-box .btn {
      width: 50px;
      height: 50px;
      background: url("../../img/btn-close.png") no-repeat center; }
  .popup-video-box .video {
    width: 1920px;
    height: 1080px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -960px;
    background: none no-repeat center; }
  .popup-video-box #video {
    background-color: #000; }

.person3 .title {
  background-image: url("../../img/pc-person3-title.png");
  pointer-events: none; }
.person3 .swiper-container-person-pic {
  position: absolute;
  bottom: 200px;
  left: 10%;
  width: 80%;
  /* width: 2679px; */
  /* left: 50%; margin-left: -1340px; */
  padding-top: 50px;
  padding-bottom: 50px; }
  .person3 .swiper-container-person-pic .swiper-slide {
    background-position: center;
    background-size: cover;
    width: 893px;
    height: 501px; }
.person3 .swiper-pagination-person-pic {
  width: 100%;
  height: 9px;
  position: absolute;
  top: 880px;
  left: 50%;
  margin-left: -50%;
  background: none no-repeat center;
  text-align: center; }
.person3 .btn-more-box {
  position: absolute;
  bottom: 60px;
  left: 50%;
  margin-left: -112px;
  pointer-events: none;
  opacity: 0;
  z-index: 9; }
  .person3 .btn-more-box .btn {
    width: 224px;
    height: 41px;
    background: url("../../img/btn-more.png?v1") no-repeat center; }
  .person3 .btn-more-box .btn {
    background-size: 100% 100%; }
  .person3 .btn-more-box.active {
    pointer-events: all;
    opacity: 1; }

.ani.person0 .title {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards; }
.ani.person0 .des {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards; }
.ani.person0 .btn-video-box {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.9s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.9s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.9s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.9s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.9s forwards; }

.index1 .swiper-container-index-season .mask.active .vol, .index1 .swiper-container-index-season .mask.active .bot-line {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.1s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.1s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.1s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.1s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.1s forwards; }
.index1 .swiper-container-index-season .mask.active .season {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.3s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.3s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.3s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.3s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.3s forwards; }
.index1 .swiper-container-index-season .mask.active .description {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.5s forwards; }
.index1 .swiper-container-index-season .mask.active .btn-svg-box {
  -webkit-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -moz-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -ms-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  -o-animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards;
  animation: fadeInUp 0.8s cubic-bezier(0, 0.64, 0.32, 1.15) 0.7s forwards; }

/* ani */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-o-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeInUp {
  0% {
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@-moz-keyframes fadeInUp {
  0% {
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@-ms-keyframes fadeInUp {
  0% {
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@-o-keyframes fadeInUp {
  0% {
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@keyframes fadeInUp {
  0% {
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0; }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; } }
@-webkit-keyframes btnTitle {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1; }
  45% {
    -webkit-transform: translate(0, 30px);
    -moz-transform: translate(0, 30px);
    -ms-transform: translate(0, 30px);
    -o-transform: translate(0, 30px);
    transform: translate(0, 30px);
    opacity: 0; }
  55% {
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 0; } }
@-moz-keyframes btnTitle {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1; }
  45% {
    -webkit-transform: translate(0, 30px);
    -moz-transform: translate(0, 30px);
    -ms-transform: translate(0, 30px);
    -o-transform: translate(0, 30px);
    transform: translate(0, 30px);
    opacity: 0; }
  55% {
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 0; } }
@-ms-keyframes btnTitle {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1; }
  45% {
    -webkit-transform: translate(0, 30px);
    -moz-transform: translate(0, 30px);
    -ms-transform: translate(0, 30px);
    -o-transform: translate(0, 30px);
    transform: translate(0, 30px);
    opacity: 0; }
  55% {
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 0; } }
@-o-keyframes btnTitle {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1; }
  45% {
    -webkit-transform: translate(0, 30px);
    -moz-transform: translate(0, 30px);
    -ms-transform: translate(0, 30px);
    -o-transform: translate(0, 30px);
    transform: translate(0, 30px);
    opacity: 0; }
  55% {
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 0; } }
@keyframes btnTitle {
  0%, 100% {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1; }
  45% {
    -webkit-transform: translate(0, 30px);
    -moz-transform: translate(0, 30px);
    -ms-transform: translate(0, 30px);
    -o-transform: translate(0, 30px);
    transform: translate(0, 30px);
    opacity: 0; }
  55% {
    -webkit-transform: translate(0, -30px);
    -moz-transform: translate(0, -30px);
    -ms-transform: translate(0, -30px);
    -o-transform: translate(0, -30px);
    transform: translate(0, -30px);
    opacity: 0; } }
@-webkit-keyframes hoverSeason {
  0% {
    opacity: .5; }
  100% {
    -webkit-transform: scale(1.1) skew(-10deg);
    transform: scale(1.1) skew(-10deg);
    opacity: 1; } }
@-moz-keyframes hoverSeason {
  0% {
    opacity: .5; }
  100% {
    -webkit-transform: scale(1.1) skew(-10deg);
    transform: scale(1.1) skew(-10deg);
    opacity: 1; } }
@-ms-keyframes hoverSeason {
  0% {
    opacity: .5; }
  100% {
    -webkit-transform: scale(1.1) skew(-10deg);
    transform: scale(1.1) skew(-10deg);
    opacity: 1; } }
@-o-keyframes hoverSeason {
  0% {
    opacity: .5; }
  100% {
    -webkit-transform: scale(1.1) skew(-10deg);
    transform: scale(1.1) skew(-10deg);
    opacity: 1; } }
@keyframes hoverSeason {
  0% {
    opacity: .5; }
  100% {
    -webkit-transform: scale(1.1) skew(-10deg);
    transform: scale(1.1) skew(-10deg);
    opacity: 1; } }
@-webkit-keyframes btnPrev {
  0%,100% {
    -webkit-transform: translateY(0) scale(2);
    transform: translateY(0) scale(2); }
  50% {
    -webkit-transform: translateX(10px) scale(2);
    transform: translateX(10px) scale(2); } }
@keyframes btnPrev {
  0%,100% {
    -webkit-transform: translateY(0) scale(2);
    transform: translateY(0) scale(2); }
  50% {
    -webkit-transform: translateX(10px) scale(2);
    transform: translateX(10px) scale(2); } }
@-webkit-keyframes btnNext {
  0%,100% {
    -webkit-transform: translateY(0) scale(2);
    transform: translateY(0) scale(2); }
  50% {
    -webkit-transform: translateX(-10px) scale(2);
    transform: translateX(-10px) scale(2); } }
@keyframes btnNext {
  0%,100% {
    -webkit-transform: translateY(0) scale(2);
    transform: translateY(0) scale(2); }
  50% {
    -webkit-transform: translateX(-10px) scale(2);
    transform: translateX(-10px) scale(2); } }

/*# sourceMappingURL=scss.css.map */