@import url("https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900&display=swap");
@import url("https://fonts.googleapis.com/css?family=Noto+Serif+TC:200,300,400,500,600,700,900&display=swap");
@import url("https://fonts.googleapis.com/css?family=Roboto&display=swap");
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body {
  line-height: 1.5;
  font-family: "Roboto", "Noto Sans TC", serif;
  font-size: 16px;
  background-color: #0d0806;
  background-image: url("../img/bg_top.jpg");
  background-position: 25%  0;
  background-repeat: no-repeat;
  overflow-x: hidden; }
  @media only screen and (max-width: 1280px) {
    body {
      background-position: 50%  0;
      background-size: auto 120%; } }
  @media only screen and (max-width: 1024px) {
    body {
      background-size: 125% auto; } }
  @media all and (min-width: 0\0) {
    body {
      font-family: "Roboto", "Microsoft JhengHei", \5FAE\8EDF\6B63\9ED1\9AD4, PMingLiU, \65B0\7D30\660E\9AD4, sans-serif; } }

.wrapper {
  width: 100%;
  margin: 35px auto 0;
  min-height: 100%;
  position: relative;
  overflow-x: hidden; }
  @media only screen and (max-width: 1024px) {
    .wrapper {
      margin-top: 0; } }

#GVtopBar {
  position: fixed;
  z-index: 98 !important;
  height: 35px;
  width: 100%;
  top: 0; }
  @media only screen and (max-width: 1024px) {
    #GVtopBar {
      display: none; } }

#troSideBtn {
  z-index: 9 !important; }

.header {
  width: 100%;
  height: 1140px;
  position: relative; }
  .header-main {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    max-width: 1280px; }
    .header-main .slogan {
      position: absolute;
      width: 680px;
      height: 350px;
      top: 218px;
      right: 16px;
      z-index: 3; }
      .header-main .slogan__circle {
        position: absolute;
        width: 347px;
        height: 347px;
        top: 0;
        left: 40px;
        background: url("../img/slogan_circle.png") no-repeat;
        background-size: 100%; }
      .header-main .slogan__txt {
        position: absolute;
        bottom: 12px;
        width: 659px;
        height: 332px;
        background: url("../img/slogan.png") 50% 0 no-repeat;
        background-size: 100%; }
  .header-master {
    position: absolute;
    z-index: 2;
    left: 0;
    top: -100px;
    width: 1300px;
    height: 1680px;
    -webkit-animation: showMaster .5s forwards 1s linear;
    animation: showMaster .5s forwards 1s linear; }
    @media all and (min-width: 0\0) {
      .header-master {
        background: url("../img/master.png") no-repeat; } }
    .header-master-stars {
      width: 100%;
      height: 100%;
      position: absolute;
      z-index: 2;
      opacity: 0.7;
      -webkit-transition: all 0.25s;
      -o-transition: all 0.25s;
      transition: all 0.25s;
      pointer-events: none; }
      .header-master-stars > div {
        position: absolute;
        background: transparent;
        border-radius: 50%; }
        .header-master-stars > div:after {
          display: block;
          content: " ";
          position: absolute;
          background: transparent;
          top: 200px; }
      .header-master-stars #star1 {
        width: 1px;
        height: 1px;
        -webkit-box-shadow: 856px 471px 3px #9BFFF4 , 1064px 328px 5px #46EFD9 , 524px 580px 2px #46EFD9 , 746px 501px 4px #46EFD9 , 1022px 119px 3px #46EFD9 , 68px 838px 4px #46EFD9 , 1101px 675px 2px #46EFD9 , 79px 723px 1px #46EFD9 , 40px 612px 4px #46EFD9 , 241px 418px 2px #46EFD9 , 427px 415px 5px #46EFD9 , 175px 181px 4px #46EFD9 , 288px 329px 2px #46EFD9 , 13px 237px 4px #46EFD9 , 180px 215px 5px #46EFD9 , 628px 35px 5px #46EFD9 , 463px 214px 5px #46EFD9 , 948px 93px 4px #46EFD9 , 891px 436px 4px #46EFD9 , 389px 455px 5px #46EFD9 , 1173px 28px 2px #46EFD9 , 451px 839px 2px #46EFD9 , 594px 515px 2px #46EFD9 , 884px 526px 1px #46EFD9 , 131px 467px 3px #46EFD9 , 987px 175px 3px #46EFD9 , 844px 570px 1px #46EFD9 , 28px 536px 3px #46EFD9 , 103px 710px 1px #46EFD9 , 120px 691px 1px #46EFD9 , 575px 218px 4px #46EFD9 , 613px 451px 4px #46EFD9 , 963px 69px 1px #46EFD9 , 112px 720px 4px #46EFD9 , 935px 323px 5px #46EFD9 , 213px 292px 1px #46EFD9;
        box-shadow: 856px 471px 3px #9BFFF4 , 1064px 328px 5px #46EFD9 , 524px 580px 2px #46EFD9 , 746px 501px 4px #46EFD9 , 1022px 119px 3px #46EFD9 , 68px 838px 4px #46EFD9 , 1101px 675px 2px #46EFD9 , 79px 723px 1px #46EFD9 , 40px 612px 4px #46EFD9 , 241px 418px 2px #46EFD9 , 427px 415px 5px #46EFD9 , 175px 181px 4px #46EFD9 , 288px 329px 2px #46EFD9 , 13px 237px 4px #46EFD9 , 180px 215px 5px #46EFD9 , 628px 35px 5px #46EFD9 , 463px 214px 5px #46EFD9 , 948px 93px 4px #46EFD9 , 891px 436px 4px #46EFD9 , 389px 455px 5px #46EFD9 , 1173px 28px 2px #46EFD9 , 451px 839px 2px #46EFD9 , 594px 515px 2px #46EFD9 , 884px 526px 1px #46EFD9 , 131px 467px 3px #46EFD9 , 987px 175px 3px #46EFD9 , 844px 570px 1px #46EFD9 , 28px 536px 3px #46EFD9 , 103px 710px 1px #46EFD9 , 120px 691px 1px #46EFD9 , 575px 218px 4px #46EFD9 , 613px 451px 4px #46EFD9 , 963px 69px 1px #46EFD9 , 112px 720px 4px #46EFD9 , 935px 323px 5px #46EFD9 , 213px 292px 1px #46EFD9;
        -webkit-animation: animStar .35s infinite linear;
        animation: animStar .35s infinite linear; }
        .header-master-stars #star1:after {
          width: 1px;
          height: 1px;
          -webkit-box-shadow: 856px 471px 3px #9BFFF4 , 1064px 328px 5px #46EFD9 , 524px 580px 2px #46EFD9 , 746px 501px 4px #46EFD9 , 1022px 119px 3px #46EFD9 , 68px 838px 4px #46EFD9 , 1101px 675px 2px #46EFD9 , 79px 723px 1px #46EFD9 , 40px 612px 4px #46EFD9 , 241px 418px 2px #46EFD9 , 427px 415px 5px #46EFD9 , 175px 181px 4px #46EFD9 , 288px 329px 2px #46EFD9 , 13px 237px 4px #46EFD9 , 180px 215px 5px #46EFD9 , 628px 35px 5px #46EFD9 , 463px 214px 5px #46EFD9 , 948px 93px 4px #46EFD9 , 891px 436px 4px #46EFD9 , 389px 455px 5px #46EFD9 , 1173px 28px 2px #46EFD9 , 451px 839px 2px #46EFD9 , 594px 515px 2px #46EFD9 , 884px 526px 1px #46EFD9 , 131px 467px 3px #46EFD9 , 987px 175px 3px #46EFD9 , 844px 570px 1px #46EFD9 , 28px 536px 3px #46EFD9 , 103px 710px 1px #46EFD9 , 120px 691px 1px #46EFD9 , 575px 218px 4px #46EFD9 , 613px 451px 4px #46EFD9 , 963px 69px 1px #46EFD9 , 112px 720px 4px #46EFD9 , 935px 323px 5px #46EFD9 , 213px 292px 1px #46EFD9;
          box-shadow: 856px 471px 3px #9BFFF4 , 1064px 328px 5px #46EFD9 , 524px 580px 2px #46EFD9 , 746px 501px 4px #46EFD9 , 1022px 119px 3px #46EFD9 , 68px 838px 4px #46EFD9 , 1101px 675px 2px #46EFD9 , 79px 723px 1px #46EFD9 , 40px 612px 4px #46EFD9 , 241px 418px 2px #46EFD9 , 427px 415px 5px #46EFD9 , 175px 181px 4px #46EFD9 , 288px 329px 2px #46EFD9 , 13px 237px 4px #46EFD9 , 180px 215px 5px #46EFD9 , 628px 35px 5px #46EFD9 , 463px 214px 5px #46EFD9 , 948px 93px 4px #46EFD9 , 891px 436px 4px #46EFD9 , 389px 455px 5px #46EFD9 , 1173px 28px 2px #46EFD9 , 451px 839px 2px #46EFD9 , 594px 515px 2px #46EFD9 , 884px 526px 1px #46EFD9 , 131px 467px 3px #46EFD9 , 987px 175px 3px #46EFD9 , 844px 570px 1px #46EFD9 , 28px 536px 3px #46EFD9 , 103px 710px 1px #46EFD9 , 120px 691px 1px #46EFD9 , 575px 218px 4px #46EFD9 , 613px 451px 4px #46EFD9 , 963px 69px 1px #46EFD9 , 112px 720px 4px #46EFD9 , 935px 323px 5px #46EFD9 , 213px 292px 1px #46EFD9; }
      .header-master-stars #star2 {
        width: 2px;
        height: 2px;
        -webkit-box-shadow: 92px 132px 4px #9BFFF4 , 826px 545px 1px #46EFD9 , 949px 465px 3px #46EFD9 , 1175px 182px 4px #46EFD9 , 842px 574px 4px #46EFD9 , 560px 146px 1px #46EFD9 , 966px 22px 5px #46EFD9 , 818px 737px 4px #46EFD9 , 184px 524px 4px #46EFD9 , 109px 748px 1px #46EFD9 , 517px 573px 4px #46EFD9 , 604px 754px 3px #46EFD9 , 332px 445px 3px #46EFD9 , 566px 73px 5px #46EFD9 , 293px 316px 1px #46EFD9 , 528px 803px 4px #46EFD9;
        box-shadow: 92px 132px 4px #9BFFF4 , 826px 545px 1px #46EFD9 , 949px 465px 3px #46EFD9 , 1175px 182px 4px #46EFD9 , 842px 574px 4px #46EFD9 , 560px 146px 1px #46EFD9 , 966px 22px 5px #46EFD9 , 818px 737px 4px #46EFD9 , 184px 524px 4px #46EFD9 , 109px 748px 1px #46EFD9 , 517px 573px 4px #46EFD9 , 604px 754px 3px #46EFD9 , 332px 445px 3px #46EFD9 , 566px 73px 5px #46EFD9 , 293px 316px 1px #46EFD9 , 528px 803px 4px #46EFD9;
        -webkit-animation: animStar 7.5s infinite linear;
        animation: animStar 7.5s infinite linear; }
        .header-master-stars #star2:after {
          width: 2px;
          height: 2px;
          -webkit-box-shadow: 92px 132px 4px #9BFFF4 , 826px 545px 1px #46EFD9 , 949px 465px 3px #46EFD9 , 1175px 182px 4px #46EFD9 , 842px 574px 4px #46EFD9 , 560px 146px 1px #46EFD9 , 966px 22px 5px #46EFD9 , 818px 737px 4px #46EFD9 , 184px 524px 4px #46EFD9 , 109px 748px 1px #46EFD9 , 517px 573px 4px #46EFD9 , 604px 754px 3px #46EFD9 , 332px 445px 3px #46EFD9 , 566px 73px 5px #46EFD9 , 293px 316px 1px #46EFD9 , 528px 803px 4px #46EFD9;
          box-shadow: 92px 132px 4px #9BFFF4 , 826px 545px 1px #46EFD9 , 949px 465px 3px #46EFD9 , 1175px 182px 4px #46EFD9 , 842px 574px 4px #46EFD9 , 560px 146px 1px #46EFD9 , 966px 22px 5px #46EFD9 , 818px 737px 4px #46EFD9 , 184px 524px 4px #46EFD9 , 109px 748px 1px #46EFD9 , 517px 573px 4px #46EFD9 , 604px 754px 3px #46EFD9 , 332px 445px 3px #46EFD9 , 566px 73px 5px #46EFD9 , 293px 316px 1px #46EFD9 , 528px 803px 4px #46EFD9; }
      .header-master-stars #star3 {
        width: 3px;
        height: 3px;
        -webkit-box-shadow: 727px 816px 2px #9BFFF4 , 1110px 661px 1px #46EFD9 , 49px 600px 1px #46EFD9 , 484px 620px 4px #46EFD9 , 316px 636px 4px #46EFD9 , 453px 690px 4px #46EFD9 , 186px 481px 2px #46EFD9 , 23px 731px 2px #46EFD9 , 540px 747px 2px #46EFD9 , 281px 414px 5px #46EFD9 , 312px 646px 5px #46EFD9 , 602px 167px 5px #46EFD9 , 740px 517px 1px #46EFD9 , 671px 734px 4px #46EFD9 , 692px 727px 5px #46EFD9 , 192px 64px 3px #46EFD9 , 316px 709px 4px #46EFD9 , 272px 614px 5px #46EFD9 , 157px 31px 5px #46EFD9 , 432px 431px 1px #46EFD9 , 153px 122px 1px #46EFD9;
        box-shadow: 727px 816px 2px #9BFFF4 , 1110px 661px 1px #46EFD9 , 49px 600px 1px #46EFD9 , 484px 620px 4px #46EFD9 , 316px 636px 4px #46EFD9 , 453px 690px 4px #46EFD9 , 186px 481px 2px #46EFD9 , 23px 731px 2px #46EFD9 , 540px 747px 2px #46EFD9 , 281px 414px 5px #46EFD9 , 312px 646px 5px #46EFD9 , 602px 167px 5px #46EFD9 , 740px 517px 1px #46EFD9 , 671px 734px 4px #46EFD9 , 692px 727px 5px #46EFD9 , 192px 64px 3px #46EFD9 , 316px 709px 4px #46EFD9 , 272px 614px 5px #46EFD9 , 157px 31px 5px #46EFD9 , 432px 431px 1px #46EFD9 , 153px 122px 1px #46EFD9;
        -webkit-animation: animStar 15s infinite linear;
        animation: animStar 15s infinite linear; }
        .header-master-stars #star3:after {
          width: 3px;
          height: 3px;
          -webkit-box-shadow: 727px 816px 2px #9BFFF4 , 1110px 661px 1px #46EFD9 , 49px 600px 1px #46EFD9 , 484px 620px 4px #46EFD9 , 316px 636px 4px #46EFD9 , 453px 690px 4px #46EFD9 , 186px 481px 2px #46EFD9 , 23px 731px 2px #46EFD9 , 540px 747px 2px #46EFD9 , 281px 414px 5px #46EFD9 , 312px 646px 5px #46EFD9 , 602px 167px 5px #46EFD9 , 740px 517px 1px #46EFD9 , 671px 734px 4px #46EFD9 , 692px 727px 5px #46EFD9 , 192px 64px 3px #46EFD9 , 316px 709px 4px #46EFD9 , 272px 614px 5px #46EFD9 , 157px 31px 5px #46EFD9 , 432px 431px 1px #46EFD9 , 153px 122px 1px #46EFD9;
          box-shadow: 727px 816px 2px #9BFFF4 , 1110px 661px 1px #46EFD9 , 49px 600px 1px #46EFD9 , 484px 620px 4px #46EFD9 , 316px 636px 4px #46EFD9 , 453px 690px 4px #46EFD9 , 186px 481px 2px #46EFD9 , 23px 731px 2px #46EFD9 , 540px 747px 2px #46EFD9 , 281px 414px 5px #46EFD9 , 312px 646px 5px #46EFD9 , 602px 167px 5px #46EFD9 , 740px 517px 1px #46EFD9 , 671px 734px 4px #46EFD9 , 692px 727px 5px #46EFD9 , 192px 64px 3px #46EFD9 , 316px 709px 4px #46EFD9 , 272px 614px 5px #46EFD9 , 157px 31px 5px #46EFD9 , 432px 431px 1px #46EFD9 , 153px 122px 1px #46EFD9; }
  @media only screen and (max-width: 1280px) {
    .header {
      height: 720px; }
      .header-master {
        top: -35px;
        left: -27.5vw; }
      .header .slogan {
        top: 178px; } }
  @media only screen and (max-width: 1024px) {
    .header {
      height: 80vw; }
      .header .slogan {
        right: 10px;
        width: 60vw;
        height: 36.6vw;
        top: calc(42vw - 64px); }
        .header .slogan__circle {
          width: 33.6vw;
          height: 33.6vw;
          left: 4vw; }
        .header .slogan__txt {
          width: 60vw;
          height: 30.48vw;
          bottom: 6vw; }
      .header-master {
        width: 98vw;
        height: 120vw;
        left: -12vw;
        top: -10px;
        background: url("../img/master.png") no-repeat !important;
        background-size: 100% !important; } }

@media only screen and (min-width: 1025px) {
  @-webkit-keyframes showMaster {
    0%, 40% {
      opacity: .5;
      background: url("../img/master_shuu.png") no-repeat; }
    30%, 50%, 100% {
      opacity: 1;
      background: url("../img/master.png") no-repeat; } }
  @keyframes showMaster {
    0%, 40% {
      opacity: .5;
      background: url("../img/master_shuu.png") no-repeat; }
    30%, 50%, 100% {
      opacity: 1;
      background: url("../img/master.png") no-repeat; } } }

@-webkit-keyframes animStar {
  from {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); }
  to {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px); } }

@keyframes animStar {
  from {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); }
  to {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px); } }

section {
  position: relative;
  z-index: 2;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.method {
  width: 100%;
  text-align: center;
  padding-top: 30px;
  margin-bottom: 100px; }
  .method:before {
    width: 1620px;
    height: 100%;
    display: block;
    content: '';
    position: absolute;
    left: calc(50% - 810px);
    background: #c19266 url("../img/bg_method.jpg") 50% 0 no-repeat;
    border-radius: 20px;
    opacity: .85;
    z-index: -1; }
  .methodWrap {
    position: relative;
    margin: 30px auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 1560px;
    top: 50%;
    padding: 50px;
    box-sizing: border-box; }
  .method .title {
    font-size: 36px;
    color: #893328;
    position: relative;
    margin: 0 auto 50px;
    font-weight: bold;
    text-align: center;
    width: 224px; }
    .method .title span {
      position: relative;
      z-index: 3; }
    .method .title:before, .method .title:after {
      display: block;
      position: absolute;
      content: '';
      z-index: 1; }
    .method .title:before {
      width: 4px;
      height: 100%;
      top: 4px;
      left: 18px;
      border-right: 1px solid #893328;
      border-left: 1px solid #893328; }
    .method .title:after {
      width: 100%;
      height: 1px;
      background-color: #893328;
      bottom: 4px;
      left: 0%; }
  .method-intro-txt {
    position: relative;
    z-index: 4;
    color: #ae835a;
    font-size: 18px;
    text-align: center; }
  .method-aim, .method-title, .method-judge {
    position: relative; }
  .method-aim {
    color: #2c2a4c;
    font-size: 24px;
    margin-top: 30px;
    font-weight: bold; }
    .method-aim span {
      background: #2c2a4c;
      color: #ae835a;
      font-size: 14px;
      margin-left: 10px;
      display: inline-block;
      padding: 2px 10px;
      border-radius: 3px;
      margin-right: 10px;
      vertical-align: middle;
      letter-spacing: 2px; }
  .method-time {
    width: 100%;
    max-width: 1280px;
    margin: 30px auto 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    .method-time > li {
      text-align: center;
      position: relative;
      width: 272px;
      height: 272px;
      -moz-border-radius: 50%;
      -webkit-border-radius: 50%;
      border-radius: 50%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      padding: 16px;
      background: #2c2a4c; }
      .method-time > li:not(:last-child):after {
        display: block;
        content: '';
        width: 16px;
        height: 17px;
        background: url("../img/arrow-time.png");
        right: -45%;
        top: 122px;
        position: absolute; }
      .method-time > li .time__time, .method-time > li .time__index, .method-time > li .time__title {
        color: #ae835a;
        font-weight: bold;
        width: 100%;
        text-align: center; }
      .method-time > li .time__time {
        letter-spacing: 2px; }
      .method-time > li .time__index {
        font-size: 36px;
        line-height: 1; }
      .method-time > li .time__title {
        font-size: 30px;
        font-weight: normal; }
      .method-time > li .time_date {
        color: #ECE8E0;
        font-size: 18px;
        margin-top: 10px; }
        .method-time > li .time_date > li {
          position: relative; }
          .method-time > li .time_date > li:nth-child(2) {
            width: 1px;
            height: 15px;
            border-right: 4px dotted #ECE8E0;
            margin: 5px auto;
            left: -1px; }
          .method-time > li .time_date > li span {
            display: block;
            font-size: 14px;
            line-height: 1.1; }
      .method-time > li .time_date2 {
        font-size: 24px;
        color: #ECE8E0;
        margin-top: 25px;
        line-height: 1.33; }
  .method-judge {
    width: 100%;
    max-width: 1024px;
    margin: 50px auto 0; }
    .method-judge__title {
      font-size: 24px;
      font-weight: bold;
      position: relative;
      display: inline-block;
      color: #893328;
      width: 180px;
      vertical-align: top; }
      .method-judge__title:after {
        display: block;
        content: '';
        position: absolute;
        width: 8px;
        height: 8px;
        background-color: #a57c56;
        border-right: 2px solid #893328;
        border-top: 2px solid #893328;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        right: -10px;
        top: 12px;
        z-index: 2; }
    .method-judge_list {
      position: relative;
      width: calc(100% - 188px);
      margin: 0 auto;
      display: inline-block;
      text-align: left;
      border-left: 2px solid #893328;
      padding-left: 20px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .method-judge_list li {
        font-size: 15px;
        margin-bottom: 8px;
        position: relative;
        line-height: 1.33;
        padding-left: 20px;
        position: relative;
        color: #893328; }
        .method-judge_list li span {
          font-weight: bold;
          background-color: #a07147;
          padding: 2px; }
        .method-judge_list li i {
          width: 20px;
          height: 1px;
          background-color: #893328;
          display: inline-block;
          vertical-align: middle;
          margin-right: 4px; }
  .method-btn {
    position: relative;
    margin: 50px auto 10px; }
    .method-btn li {
      display: inline-block;
      margin: 0 10px;
      width: 480px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
    .method-btn .btnRule {
      background: #cf9c2d;
      background-size: 41px 41px, auto;
      border: 1px solid #ffc437; }
      .method-btn .btnRule em {
        font-size: 18px; }
    .method-btn .btnWrite {
      padding-left: 46px;
      background: #893328 url("../img/icon_write.png") 140px 50% no-repeat;
      background-size: 41px 41px, auto; }
  @media only screen and (max-width: 1680px) {
    .method {
      padding: 30px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      background: #c19266 url("../img/bg_method.jpg") 50% 0 no-repeat; }
      .method:before {
        display: none; }
      .methodWrap {
        width: 100%;
        margin: 0;
        padding: 30px; } }
  @media only screen and (max-width: 1024px) {
    .method-time > li {
      padding: 10px;
      width: 27vw;
      height: 27vw; }
      .method-time > li:not(:last-child):after {
        display: none; }
      .method-time > li .time__index {
        font-size: 4vw; }
      .method-time > li .time__title {
        font-size: 3vw; }
      .method-time > li .time_date {
        margin-top: 0;
        font-size: 2vw; }
        .method-time > li .time_date > li span {
          font-size: 14px; }
      .method-time > li .time_date2 {
        font-size: 3vw; }
    .method-judge__title {
      font-size: 24px;
      font-weight: bold;
      position: relative;
      display: inline-block;
      color: #893328;
      width: 130px; }
      .method-judge__title:after {
        display: none; }
    .method-judge_list {
      width: calc(100% - 138px);
      padding-left: 0px; } }
  @media only screen and (max-width: 768px) {
    .method-time {
      width: 55vw;
      display: block; }
      .method-time > li {
        padding: 10px;
        width: 55vw;
        height: 55vw;
        padding: 4.5vw; }
        .method-time > li:not(:last-child) {
          margin-bottom: 30px; }
        .method-time > li .time__title {
          font-size: 6.4vw; }
        .method-time > li .time_date {
          font-size: 4vw; }
          .method-time > li .time_date > li:nth-child(2) {
            height: 10px;
            border-right: 2px dotted #ECE8E0; }
        .method-time > li .time_date2 {
          font-size: 5.4vw; }
    .method-judge__title, .method-judge_list {
      width: 100%; }
    .method-judge__title {
      margin-bottom: 10px; }
    .method-judge_list {
      border-left: 0; }
      .method-judge_list li {
        padding-left: 0; }
        .method-judge_list li span {
          background-color: transparent; }
    .method-btn {
      position: relative; }
      .method-btn li {
        display: block;
        margin: 0 0 10px;
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box; }
      .method-btn .btnWrite {
        padding-left: 20px;
        background: #893328 url("../img/icon_write.png") 20px 50% no-repeat;
        background-size: 41px 41px, auto; } }
  @media only screen and (max-width: 414px) {
    .method {
      padding: 50px 20px; }
      .methodWrap {
        padding: 0px; } }

.devil {
  position: absolute;
  width: 492px;
  height: 478px;
  right: -100px;
  top: -240px;
  background: url("../img/devil.png");
  background-size: 100%; }
  @media only screen and (max-width: 1280px) {
    .devil {
      right: -250px; } }
  @media only screen and (max-width: 768px) {
    .devil {
      width: 40vw;
      height: 38.5vw;
      right: -10vw;
      top: -80px; } }
  @media only screen and (max-width: 414px) {
    .devil {
      width: 65vw;
      height: 62.5vw;
      right: -24vw;
      top: -134px; } }

.award {
  z-index: 3;
  padding: 200px 0;
  background: url("../img/bg_mid.jpg") 0% 50% no-repeat; }
  .award .title {
    font-size: 36px;
    color: #cf9c2d;
    position: relative;
    margin: 0 auto 50px;
    font-weight: bold;
    text-align: center;
    width: 224px; }
    .award .title span {
      position: relative;
      z-index: 3; }
    .award .title:before, .award .title:after {
      display: block;
      position: absolute;
      content: '';
      z-index: 1; }
    .award .title:before {
      width: 4px;
      height: 100%;
      top: 4px;
      left: 18px;
      border-right: 1px solid #cf9c2d;
      border-left: 1px solid #cf9c2d; }
    .award .title:after {
      width: 100%;
      height: 1px;
      background-color: #cf9c2d;
      bottom: 4px;
      left: 0%; }
  .award-box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    .award-box-intro {
      font-size: 18px;
      color: #ae835a;
      text-align: center; }
    .award-box-cate {
      position: relative;
      margin-top: 30px;
      padding: 50px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      vertical-align: top;
      width: 45vw;
      display: inline-block;
      color: #ECE8E0; }
      .award-box-cate.cate--popularity {
        border-radius: 0 20px 20px 0;
        background: url("../img/bg_award.png");
        z-index: 3; }
        .award-box-cate.cate--popularity .category {
          width: calc(100% - (50vw - 640px));
          margin-left: calc(50vw - 640px); }
      .award-box-cate.cate--others {
        border-radius: 20px;
        background-color: #5a4737;
        margin-left: 20px; }
        .award-box-cate.cate--others .category {
          width: calc(100vw - (45vw + 24px) - (50vw - 640px) -  60px); }
      .award-box-cate .category {
        position: relative; }
        .award-box-cate .category-title i {
          font-size: 30px; }
          .award-box-cate .category-title i span {
            display: inline-block;
            width: 39px;
            height: 30px;
            background: url("../img/crown.png") 0 50% no-repeat; }
        .award-box-cate .category-title p {
          margin: 0;
          display: table;
          padding-bottom: 2px;
          border-bottom: 1px solid #ECE8E0; }
          .award-box-cate .category-title p em {
            border-bottom: 1px solid #ECE8E0; }
        .award-box-cate .category-group {
          margin-top: 20px; }
          .award-box-cate .category-group-li {
            margin: 50px 0 0; }
            .award-box-cate .category-group-li:after {
              clear: both;
              content: "";
              display: table; }
            .award-box-cate .category-group-li h5 {
              font-size: 20px;
              width: 90px;
              font-style: italic; }
              .award-box-cate .category-group-li h5 i {
                margin-left: 10px;
                font-style: italic; }
        .award-box-cate .category h5, .award-box-cate .category-item {
          float: left; }
        .award-box-cate .category-item {
          position: relative;
          width: calc(50% - 58px);
          text-align: center; }
          .award-box-cate .category-item:not(:last-child) {
            margin-right: 20px; }
          .award-box-cate .category-item--no1 {
            cursor: pointer; }
          .award-box-cate .category-item-img {
            position: relative;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            margin: 0 auto 10px;
            border: 4px solid #ae835a;
            background-color: #fff;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            overflow: hidden; }
            .award-box-cate .category-item-img img {
              max-height: 100%;
              max-width: 100%;
              width: auto;
              height: auto;
              position: absolute;
              top: 0;
              bottom: 0;
              left: 0;
              right: 0;
              margin: auto; }
          .award-box-cate .category-item-name {
            color: #ae835a;
            display: block; }
          .award-box-cate .category-item-view, .award-box-cate .category-item-close {
            position: absolute;
            bottom: 30px;
            right: 20%;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background-color: #893328;
            text-align: center;
            padding: 6px;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            border: 2px solid #ae835a; }
          .award-box-cate .category-item-close {
            top: 2px;
            right: 2px; }
          .award-box-cate .category-item-preview {
            position: absolute;
            display: none;
            z-index: 5;
            margin-top: -25px;
            border: 8px solid #ae835a;
            overflow: hidden;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1);
            box-shadow: 0 10px 0 rgba(0, 0, 0, 0.1); }
            .award-box-cate .category-item-preview img {
              display: block;
              max-width: 75vw; }
        .award-box-cate .category-offical {
          position: relative;
          margin-top: 30px; }
          .award-box-cate .category-offical:after {
            clear: both;
            content: "";
            display: table; }
          .award-box-cate .category-offical-li h6 {
            width: 180px;
            font-style: italic;
            float: left;
            margin: 30px 0; }
            .award-box-cate .category-offical-li h6 i {
              font-style: italic;
              margin-left: 10px; }
          .award-box-cate .category-offical-li .category-item {
            float: left;
            width: calc(50% - 100px); }
        .award-box-cate .category--single {
          margin-top: 50px; }
          .award-box-cate .category--single .category-title, .award-box-cate .category--single .category-singleItem {
            position: relative; }
          .award-box-cate .category--single .category-title {
            float: left; }
          .award-box-cate .category--single .category-singleItem {
            width: 144px;
            text-align: center;
            float: right;
            top: 0; }
          .award-box-cate .category--single:after {
            clear: both;
            content: "";
            display: table; }
  @media only screen and (max-width: 1280px) {
    .award {
      padding: 100px 20px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .award-box {
        width: 100%;
        position: relative;
        margin: 0 auto; }
        .award-box-cate {
          width: calc(50% - 4px); }
          .award-box-cate.cate--popularity, .award-box-cate.cate--others {
            border-radius: 20px; }
            .award-box-cate.cate--popularity .category, .award-box-cate.cate--others .category {
              width: 100%;
              margin: 0; }
          .award-box-cate.cate--others {
            margin-left: 0; }
          .award-box-cate .category--single {
            position: relative;
            margin-top: 50px !important; }
            .award-box-cate .category--single .category-title {
              float: left;
              width: calc(100% - 144px); }
            .award-box-cate .category--single:after {
              clear: both;
              content: "";
              display: table; } }
  @media only screen and (max-width: 1024px) {
    .award {
      background: url("../img/bg_mid.jpg") 0% 100% no-repeat; }
      .award-box {
        width: 100%;
        position: relative;
        margin: 0 auto; }
        .award-box-cate {
          width: 100%;
          display: block;
          padding: 30px;
          height: auto; }
          .award-box-cate .category-title i {
            font-size: 24px; }
          .award-box-cate .category-item-view {
            right: 32%; } }
  @media only screen and (max-width: 414px) {
    .award-box-cate {
      padding: 20px; }
      .award-box-cate .category-group {
        margin-top: 0px; }
        .award-box-cate .category-group-li {
          margin: 30px 0 0; }
          .award-box-cate .category-group-li:after {
            clear: both;
            content: "";
            display: table; }
          .award-box-cate .category-group-li h5 {
            font-size: 16px;
            width: 70px;
            font-style: italic; }
            .award-box-cate .category-group-li h5 i {
              font-size: 12px;
              margin-left: 4px; }
      .award-box-cate .category h5, .award-box-cate .category-item {
        float: none; }
      .award-box-cate .category-item {
        width: 50%;
        text-align: center;
        float: left; }
        .award-box-cate .category-item:not(:last-child) {
          margin: 0; }
        .award-box-cate .category-item-view {
          right: 18%; }
        .award-box-cate .category-item-name {
          color: #ae835a;
          display: block; }
      .award-box-cate .category-offical-li h6 {
        width: 100%;
        font-style: italic;
        float: none;
        margin: 10px 0; }
        .award-box-cate .category-offical-li h6 i {
          font-style: italic;
          margin-left: 10px; }
      .award-box-cate .category-offical-li .category-item {
        float: left;
        margin: 0;
        width: calc(50%); }
      .award-box-cate .category--single {
        margin-top: 30px; }
        .award-box-cate .category--single .category-title {
          float: none;
          width: 100%; }
        .award-box-cate .category--single .category-singleItem {
          width: 100%;
          float: none;
          margin-top: 20px; }
        .award-box-cate .category--single:after {
          clear: both;
          content: "";
          display: table; } }

.notice {
  padding: 75px 0;
  background: url("../img/bg_bottom.jpg") 50% 0% no-repeat; }
  .notice .title {
    font-size: 36px;
    color: #ECE8E0;
    position: relative;
    margin: 0 auto 50px;
    font-weight: bold;
    text-align: center;
    width: 224px; }
    .notice .title span {
      position: relative;
      z-index: 3; }
    .notice .title:before, .notice .title:after {
      display: block;
      position: absolute;
      content: '';
      z-index: 1; }
    .notice .title:before {
      width: 4px;
      height: 100%;
      top: 4px;
      left: 18px;
      border-right: 1px solid #ECE8E0;
      border-left: 1px solid #ECE8E0; }
    .notice .title:after {
      width: 100%;
      height: 1px;
      background-color: #ECE8E0;
      bottom: 4px;
      left: 0%; }
  .notice-list {
    width: 750px;
    height: auto;
    margin: 0 auto;
    position: relative;
    color: #ECE8E0;
    font-size: 15px; }
    .notice-list > li {
      counter-increment: li;
      position: relative; }
      .notice-list > li:before {
        position: absolute;
        content: counter(li);
        font-weight: bold;
        background-color: #ae835a;
        color: #0d0d0d;
        text-align: center;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        content: counter(li);
        width: 18px;
        left: -30px; }
    .notice-list li:not(:last-child) {
      margin-bottom: 20px; }
    .notice-list li:before {
      font-size: 12px;
      font-weight: bold;
      margin-top: 2px;
      line-height: 18px;
      font-style: italic;
      height: 18px;
      text-align: center; }
  .notice footer {
    margin-top: 100px; }
  @media only screen and (max-width: 1024px) {
    .notice-list {
      width: 100%;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      margin-left: -10px; } }
  @media only screen and (max-width: 768px) {
    .notice {
      padding: 50px 20px 0; } }
  @media only screen and (max-width: 414px) {
    .notice {
      padding: 50px 20px 0; }
      .notice footer {
        margin-top: 50px; } }