* {
  transition-property: transform, opacity, top, right, bottom, left;
  font-family: fot-matisse-pron, sans-serif;
  font-weight: 500;
  font-style: normal;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

p {
  margin: 0;
}

img {
  vertical-align: middle;
}

a {
  text-decoration: none;
}

.swiper-pagination-bullet {
  background: #fff !important;
}

.el-upload--picture-card {
  width: 340px !important;
  height: 71.62px !important;
  line-height: 85px !important;
}

.el-upload-list__item {
  width: 342px !important;
  height: 72px !important;
}

.el-input__inner {
  background: inherit !important;
}

.dialogNews {
  min-width: 730px;
}

.required > label:before {
  content: "*";
  color: #f56c6c;
  margin-right: 4px;
}

html {
  font-size: 16px;
}

@media screen and (min-width: 320px) and (max-width: 375px) {
  html {
    font-size: calc(84.38% + (200vw - 750px) / 39);
    font-size: calc(13.5px + (200vw - 640px) / 55);
  }
}

@media screen and (min-width: 375px) and (max-width: 414px) {
  html {
    font-size: calc(100% + (200vw - 750px) / 39);
    font-size: calc(16px + (200vw - 750px) / 39);
  }
}

@media screen and (min-width: 414px) and (max-width: 600px) {
  html {
    font-size: calc(112.5% + (400vw - 1656px) / 186);
    font-size: calc(18px + (400vw - 1656px) / 186);
  }
}

@media screen and (min-width: 600px) {
  html {
    font-size: 26px;
  }
}

@media (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape),
  (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  html {
    font-size: calc(15px + (500vw - 3840px) / 256);
  }
  html body {
    min-width: 100%;
  }
}

@media screen and (min-width: 1320px) {
  html {
    font-size: calc(162.5% + (1200vw - 15840px) / 600);
    font-size: calc(26px + (1200vw - 15840px) / 600);
  }
}

@media screen and (min-width: 1920px) {
  html {
    font-size: calc(237.5% + (500vw - 9600px) / 1000);
    font-size: calc(38px + (500vw - 9600px) / 1000);
  }
}

body {
  margin: 0;
  width: 100%;
  min-width: 1320px;
  background: #efefef;
  line-height: 1;
}

@media screen and (max-width: 600px) {
  body {
    min-width: 100%;
  }
}

body ::-moz-selection {
  color: #fff;
  background-color: #d89bdd;
}

body ::selection {
  color: #fff;
  background-color: #d89bdd;
}

body img {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#app {
  font-family: Arial, Helvetica Neue, Hiragino Sans GB, Microsoft YaHei,
    "\5FAE\8F6F\96C5\9ED1", Helvetica, Verdana, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

p {
  margin: 0;
}

img {
  vertical-align: middle;
}

a {
  text-decoration: none;
}

.swiper-pagination-bullet {
  background: #fff !important;
}

.el-upload--picture-card {
  width: 340px !important;
  height: 71.62px !important;
  line-height: 85px !important;
}

.el-upload-list__item {
  width: 342px !important;
  height: 72px !important;
}

.el-input__inner {
  background: inherit !important;
}

.dialogNews {
  min-width: 730px;
}

.required > label::before {
  content: "*";
  color: #f56c6c;
  margin-right: 4px;
}

footer {
  width: 100%;
  padding: 1.53846rem 0 1.53846rem;
  background: #000;
  text-align: center;
  font-size: 0;
}

@media screen and (max-width: 600px) {
  footer {
    padding: 1.5rem 0 1.1875rem;
  }
}

footer .logo {
  display: inline-block;
  height: 1.15385rem;
}

footer .text .item .item-bottom {
  display: inline-block;
}
footer .text .item a:not(:last-child) {
  border-right: 1px solid #fff;
}

@media screen and (max-width: 600px) {
  footer .logo {
    height: 1.625rem;
  }
  footer .text .item .item-bottom {
    display: block;
  }
}

footer .maoliang {
  margin-left: 0.76923rem;
  height: 1.15385rem;
}

@media screen and (max-width: 600px) {
  footer .maoliang {
    height: 1.625rem;
  }
}

footer .text {
  display: inline-block;
  margin-left: 3.07692rem;
  vertical-align: middle;
  text-align: center;
  color: #fff;
  margin-top: -0.26923rem;
}

@media screen and (max-width: 600px) {
  footer .text {
    width: 100%;
    margin-left: 0;
    margin-top: 1.5rem;
  }
}

footer .text .item {
  margin-bottom: 0.57692rem;
  font-size: 0.42308rem;
}

footer .text .item a {
  padding: 0 0.46154rem;
  cursor: pointer;
  color: #fff;
}

footer .text .item a:not(:last-child) {
  border-right: 1px solid #fff;
}

footer .text .item a:hover {
  color: #f5ed00;
}

@media screen and (max-width: 600px) {
  footer .text .item a {
    font-size: 0.5rem;
  }
}

footer .text .copyright {
  font-size: 0.38462rem;
}

footer .text .copyright p:not(:last-child) {
  margin-bottom: 0.03846rem;
}

@media screen and (max-width: 600px) {
  footer .text .copyright {
    font-size: 0.4375rem;
  }
}

.pirate {
  background: url("../images/bg.png") no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
@media screen and (max-width: 600px) {
  .pirate {
    background: transparent;
  }
  .pirate::before {
    content: "";
    background: url("../images/bg_sp.png") no-repeat;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    background-size: cover;
    z-index: -1;
  }
}

.pirate .pirate_public {
  position: relative;
  width: 100%;
  padding-bottom: 56.29%;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_public {
    padding-bottom: 122%;
  }
}

.pirate_public:nth-child(even) {
  background: rgba(0, 0, 0, 0.3);
}

.pirate .pirate_first {
  position: relative;
  width: 100%;
  height: 100vh;
  padding-bottom: initial;
  overflow: hidden;
}

.pirate .pirate_first .logo {
  position: absolute;
  width: 25.58%;
  top: 10.63%;
  left: 50.8%;
  z-index: 2;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_first .logo {
    width: 38%;
    top: 7.8%;
    left: 55.53%;
  }
}

.pirate .pirate_first .logo2 {
  position: absolute;
  width: 16.7%;
  left: 68%;
  top: 88.7%;
  z-index: 2;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_first .logo2 {
    left: 50%;
    transform: translateX(-50%);
    top: 80.7%;
    width: 40%;
  }
}
.pirate .pirate_first .role {
  position: absolute;
  /* width: 62.5%; */
  height: 110%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_first .role {
    width: 100%;
    height: auto;
    top: 0;
    left: 0;
  }
}

.pirate .pirate_first .pirate_first_center {
  position: absolute;
  width: 46.02%;
  height: 23.28%;
  bottom: 15.74%;
  left: 47.24%;
  background: rgba(31, 56, 113, 0.76);
  border-radius: 10px;
  box-sizing: border-box;
  padding-left: 2%;
  padding-top: 0.5%;
  padding-bottom: 0.5%;
  z-index: 2;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_first {
    height: 100vh;
  }
  .pirate .pirate_first .pirate_first_center {
    width: 92.3%;
    left: 50%;
    height: 17.5%;
    transform: translateX(-50%);
    bottom: 24%;
    padding-left: 2%;
    padding-top: 2%;
  }
}

.pirate .pirate_first .pirate_first_center .touzi {
  position: absolute;
  width: 10.48%;
  top: 6.4%;
  left: 78.76%;
}

.pirate .pirate_first .pirate_first_center .tip {
  text-align: left;
  color: #fff;
  
  font-size: 0.72rem;
  margin-top: 1.25%;
}

.pirate .pirate_first .pirate_first_center .subtitle {
  font-size: 1.3rem;
  color: #fff;
  
  margin-bottom: 3%;
}

@media screen and (max-width: 600px) {
  .pirate .pirate_first .pirate_first_center .tip {
    font-size: 0.7rem;
    margin-top: 4%;
  }
  .pirate .pirate_first .pirate_first_center .subtitle {
    margin-bottom: 6%;
  }
}

.pirate .pirate_second {
  position: relative;
}

.pirate .pirate_second .title {
  position: absolute;
  width: 34.69%;
  top: 18.98%;
  left: 32.6%;
}

.pirate .pirate_second .des {
  position: absolute;
  width: 62.45%;
  top: 51.85%;
  left: 19.01%;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_second .title {
    width: 64%;
    left: 19%;
  }
  .pirate .pirate_second .des {
    width: 85.45%;
    left: 8.01%;
  }
}

.pirate .pirate_third {
  position: relative;
}

.pirate .pirate_third .title02 {
  position: absolute;
  width: 30.15%;
  left: 34.95%;
  top: 9.72%;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_third .title02 {
    width: 57.15%;
    left: 22.95%;
  }
}

.pirate .pirate_third .pirate_third_center {
  text-align: center;
  position: absolute;
  width: 70%;
  top: 40.74%;
  left: 50%;
  padding: 2%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 20px;
  text-shadow: 1px 2px 10px #000;
}

.pirate .pirate_third .pirate_third_center mark {
  background: transparent;
  color: #fff000;
  font-size: 1.9rem;
}

.pirate .pirate_third .pirate_third_center .subtitle {
  margin-top: 0.6rem;
  font-size: 1.3rem;
  
  color: #fff;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_third .pirate_third_center .subtitle {
    font-size: 1rem;
  }
}

.pirate .pirate_third .pirate_third_center .tip {
  width: 95%;
  margin: 0.5rem auto;
  font-size: 1.18rem;
  line-height: 1.5rem;
  
  color: #fff;
  text-align: left;
}

.pirate .pirate_third .pirate_third_center .tip a {
  color: #fff000;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_third .pirate_third_center {
    width: 90%;
  }
  .pirate .pirate_third .pirate_third_center .tip {
    /* width: 90%; */
    font-size: 0.68rem;
  }
}
.pirate .pirate_third .pirate_third_center .tip:nth-child(2) {
  margin-top: 2rem;
}

.pirate .pirate_third_Edition_center {
  position: relative;
  width: 100%;
  padding-bottom: 10.15%;
}
.pirate .pirate_third_Edition_center .pcBox {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.pirate .pirate_third_Edition_center .Reward {
  display: none;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_third_Edition_center {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .pirate .pirate_third_Edition_center .pcBox {
    display: none;
  }
  .pirate .pirate_third_Edition_center .Reward {
    display: block;
    width: 80%;
  }
}
.pirate .pirate_third_Edition_center > img {
  margin: 2rem 0;
}

.pirate .pirate_third_Edition_center .vfirst {
  position: relative;
  width: 70%;
}

.pirate .pirate_third_Edition_center .vfirst > img {
  width: 100%;
}

.pirate .pirate_third_Edition_center .vfirst .textBox {
  position: absolute;
  top: 58%;
  left: 55%;
  transform: translate(-50%, -50%);
  
  width: 80%;
}

.pirate .pirate_third_Edition_center .vfirst .textBox .text_col {
  color: #966630;
  margin-bottom: 0.4rem;
  line-height: 1.5rem;
}

.text_col ._small {
  font-size: 0.8em;
}

.pirate
  .pirate_third_Edition_center
  .vfirst
  .textBox
  .text_col:nth-child(2)
  span {
  line-height: 1.6rem;
}

.pirate
  .pirate_third_Edition_center
  .vfirst
  .textBox
  .text_col:nth-child(1)
  .icon {
  color: #c35d54;
}
.pirate
  .pirate_third_Edition_center
  .vfirst
  .textBox
  .text_col:nth-child(2)
  .icon {
  color: #c35d54;
}

.pirate .pirate_third_Edition_center .vfirst .textBox .text_col .bgText {
  position: relative;
  display: inline;
}

.pirate .pirate_third_Edition_center .vfirst .textBox .text_col .bgText img {
  width: 80%;
}

.pirate
  .pirate_third_Edition_center
  .vfirst
  .textBox
  .text_col
  .bgText
  .bgText-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  color: #fff;
  margin-top: 0.1rem;
}

.bgText ._small {
  font-size: 0.7rem;
  margin-top: 0.25rem;
}

.pirate .pirate_third_Edition_center .vSecond {
  display: flex;
  justify-content: flex-start;
  width: 69.6%;
}

.pirate .pirate_third_Edition_center .vSecond .prizeBox {
  position: relative;
  width: 33.333%;
}

.pirate .pirate_third_Edition_center .vSecond .prizeBox > img {
  width: 100%;
}

.pirate .pirate_third_Edition_center .vSecond .prizeBox .text01 {
  position: absolute;
  z-index: 1;
  font-size: 0.7rem;
  
  line-height: 1.2rem;
  white-space: nowrap;
  text-align: center;
  color: #966630;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pirate .pirate_third_Edition_center .vSecond .prizeBox .text01_1 {
  position: absolute;
  z-index: 1;
  font-size: 0.37rem;
  
  line-height: 1.6rem;
  white-space: nowrap;
  text-align: center;
  color: #966630;
  bottom: 23%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pirate .pirate_third_Edition_center .vSecond .prizeBox .text02 {
  position: absolute;
  width: auto;
  height: 12%;
  z-index: 1;
  bottom: 6%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.pirate .pirate_third_Edition_center .vSecond .prizeBox .text02.grade2 {
  height: 10.5%;
  bottom: 8%;
}
.pirate .pirate_third_Edition_center .vSecond .prizeBox .text02.twoline {
  height: 20.5%;
  bottom: -2%;
}

.pirate .pirate_fourth {
  position: relative;
  width: 100%;
  padding-bottom: 154.15%;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_fourth {
    padding-bottom: 210%;
  }
}

.pirate .pirate_fourth .pirate_fourth_center {
  position: absolute;
  width: 60.49%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.pirate .pirate_fourth .board-sp {
  display: none;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_fourth .pirate_fourth_center {
    display: none;
  }
  .pirate .pirate_fourth .board-sp {
    display: block;
    width: 95%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
  }
}
.pirate .pirate_fourth .pirate_fourth_center .inner {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 228.51%;
  background: url("../images/board.png") no-repeat;
  background-size: cover;
}
.pirate .pirate_fourth .pirate_fourth_center .inner .content {
  position: absolute;
  width: 62.62%;
  height: 75.66%;
  top: 14.69%;

  left: 23.68%;
}
.pirate .pirate_fourth .pirate_fourth_center .inner .content .area {
  width: 100%;
  display: flex;
  color: #fff;
}
.pirate
  .pirate_fourth
  .pirate_fourth_center
  .inner
  .content
  .area:not(:last-child) {
  margin-bottom: 1.5rem;
}

.pirate .pirate_fourth .pirate_fourth_center .inner .content .area .subtitle {
  width: 17.74%;
  text-shadow: 0 0 0.7rem #000;
  writing-mode: vertical-lr;
  
  text-align: center;
  font-size: 0.8rem;
}

.pirate .pirate_fourth .pirate_fourth_center .inner .content .area .tip-wrap {
  width: 82.26%;
  text-shadow: 0 0 0.7rem #000;
  
  font-size: 0.6rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.pirate
  .pirate_fourth
  .pirate_fourth_center
  .inner
  .content
  .area
  .tip-wrap
  .notice {
  font-size: 0.75em;
  line-height: 1.5em;
}

.pirate
  .pirate_fourth
  .pirate_fourth_center
  .inner
  .content
  .area
  .tip-wrap
  p:not(:last-child) {
  margin-bottom: 0.3rem;
}

.pirate .pirate_fifth {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
}

@media screen and (max-width: 600px) {
  .pirate .pirate_fifth {
    padding-bottom: 200%;
  }
}

.pirate .pirate_fifth .pirate_fifth_center {
  position: absolute;
  width: 60.49%;
  left: 50%;
  top: 6.35%;
  transform: translateX(-50%);
}
@media screen and (max-width: 600px) {
  .pirate .pirate_fifth .pirate_fifth_center {
    width: 95%;
  }
}
.pirate .pirate_fifth .pirate_fifth_center .board-box {
  width: 100%;
  height: 0;
  padding-bottom: 109.45%;
  background: url("../images/board02.png") no-repeat;
  background-size: contain;
}
.pirate .pirate_fifth .pirate_fifth_center .board-box .inner {
  position: absolute;
  width: 66.73%;
  height: 73.61%;
  top: 16.48%;
  left: 16.28%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-evenly;
}
.pirate .pirate_fifth .pirate_fifth_center .board-box .inner .wrap {
  width: 44.36%;
  height: 47.46%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.pirate .pirate_fifth .pirate_fifth_center .board-box .inner .wrap .top {
  width: 100%;
  height: 83.04%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pirate .pirate_fifth .pirate_fifth_center .board-box .inner .wrap .bottom {
  width: 100%;
  height: 9.16%;
}
.pirate .pirate_fifth .pirate_fifth_center .board-box .inner .wrap .top .post {
  color: #fff;
  
  white-space: nowrap;
  writing-mode: vertical-lr;
  text-align: center;
  text-shadow: 0 0 0.7rem #000, 0 0 0.7rem #000;
}
.pirate .pirate_fifth .pirate_fifth_center .board-box .inner .wrap .top .role {
  display: block;
  width: 74.57%;
  box-shadow: 0 0 0.7rem #000;
  font-size: 0.9rem;
}
.pirate
  .pirate_fifth
  .pirate_fifth_center
  .board-box
  .inner
  .wrap
  .bottom
  .name {
  width: 74.57%;
  height: 100%;
  margin-left: auto;
  color: #fff;
  
  text-shadow: 0 0 0.7rem #000, 0 0 0.7rem #000;
  font-size: 0.8rem;
  text-align: center;
  white-space: nowrap;
}

@media screen and (max-width: 600px) {
  .pirate
    .pirate_fifth
    .pirate_fifth_center
    .board-box
    .inner
    .wrap
    .bottom
    .special {
    transform: translateX(-0.4rem);
  }
}
.pirate .pirate_fifth .pirate_fifth_center .wrap-tip {
  text-align: center;
  position: absolute;
  /* width: 90%; */
  width: 85%;
  /* top: 40.74%; */
  left: 50%;
  padding: 2%;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 20px;
  text-shadow: 1px 2px 10px #000;
}
@media screen and (max-width: 600px) {
  .pirate .pirate_fifth .pirate_fifth_center .wrap-tip {
    width: 90%;
  }
}
.pirate .pirate_fifth .pirate_fifth_center .tip-wrap {
  color: #fff;
  
  text-align: center;
}

.pirate .pirate_fifth .pirate_fifth_center .tip-wrap:not(:first-child) {
  margin-top: 3.48%;
}
.pirate .pirate_fifth .pirate_fifth_center .tip-wrap p {
  font-size: 0.8rem;
  margin-bottom: 0.2rem;
}
.pirate .pirate_fifth .pirate_fifth_center .tip-wrap .bold {
  font-size: 1rem;
  margin-bottom: 0.4rem;
}
.pirate .pirate_fifth .pirate_fifth_center .tip-wrap .middle {
  font-size: 0.9rem;
}

.fadein {
  opacity: 0;
  transform: translate(0, 40px);
  transition-duration: 1000ms;
}

.fadein.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}
.aniv-logo-container {
  width: 100%;
  margin: 64px 0;
  display: flex;
  justify-content: center;
}
.aniv-logo {
  display: block;
  margin: 0 auto;
  max-width: 208px;
  width: 100%;
}
