@import url("normalize.css");
* {
  margin: 0;
  padding: 0;
  outline: none;
  text-decoration: none; }

html {
  overflow-x: hidden; }

html,
body {
  background-position: top center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  background-color: #000;
  background-image: url(../img/bg.jpg); }
  @media all and (min-width: 1440px) {
    html,
    body {
      background-position: 50% 10%; } }
  @media all and (min-width: 1200px) and (max-width: 1440px) {
    html,
    body {
      background-position: 50% 30%; } }
  @media all and (min-width: 1024px) and (max-width: 1200px) {
    html,
    body {
      background-position: 50% 40%; } }
  @media all and (min-width: 960px) and (max-width: 1024px) {
    html,
    body {
      background-position: 50% 50%; } }
  @media all and (min-width: 750px) and (max-width: 960px) {
    html,
    body {
      background-position: 50% 40%; } }
  @media all and (min-width: 480px) and (max-width: 750px) {
    html,
    body {
      background-position: 50% 35%; } }
  @media all and (max-width: 480px) {
    html,
    body {
      background-position: 50% 40%; } }

.menuBar {
  position: fixed;
  width: 100%;
  height: auto;
  border-bottom: solid #fff 2px;
  background: -moz-linear-gradient(90deg, black, rgba(0, 0, 0, 0.6));
  background: -webkit-linear-gradient(90deg, black, rgba(0, 0, 0, 0.6));
  background: -ms-linear-gradient(90deg, black, rgba(0, 0, 0, 0.6));
  z-index: 9999; }
  @media all and (min-width: 1440px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 1100px; } }
  @media all and (min-width: 1200px) and (max-width: 1440px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 1100px; } }
  @media all and (min-width: 1024px) and (max-width: 1200px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 1000px; } }
  @media all and (min-width: 960px) and (max-width: 1024px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 1000px; } }
  @media all and (min-width: 750px) and (max-width: 960px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 780px; } }
  @media all and (min-width: 480px) and (max-width: 750px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 100%;
      height: auto;
      max-width: 500px; } }
  @media all and (max-width: 480px) {
    .menuBar .box {
      position: relative;
      display: block;
      margin: 0 auto;
      width: 80%;
      height: auto; } }
  .menuBar .box .btn {
    display: inline-block;
    background-position: center;
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    height: 130px; }
  .menuBar .box .btnLogo {
    width: 228px;
    background-image: url(../img/logo01.png); }
  .menuBar .box .btn01 {
    width: 164px;
    background-image: url(../img/btn_01.png); }
  .menuBar .box .btn02 {
    width: 215px;
    background-image: url(../img/btn_02.png); }
  .menuBar .box .btn03 {
    width: 267px;
    background-image: url(../img/btn_03.png); }
  .menuBar .box .btnLogo2 {
    width: 114px;
    background-image: url(../img/logo03.png); }
  .menuBar .box img.hr {
    display: inline-block;
    margin: 0 1%; }
  .menuBar .box .dropdown {
    cursor: pointer; }
  .menuBar .box .dropdown-content {
    display: none;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.6);
    max-width: 30%;
    width: auto;
    height: auto;
    z-index: 1;
    padding: 1% 3%;
    margin-top: 130px; }
    .menuBar .box .dropdown-content a {
      display: block;
      padding: 1%;
      text-align: center;
      text-decoration: none; }
    .menuBar .box .dropdown-content hr {
      margin: 0 auto;
      width: 75%; }
  .menuBar .box .dropdown:hover .dropdown-content {
    display: block; }
  @media all and (min-width: 1024px) and (max-width: 1200px) {
    .menuBar .box .btn {
      height: 117px; }
    .menuBar .box .btnLogo {
      width: 205.2px; }
    .menuBar .box .btn01 {
      width: 147.6px; }
    .menuBar .box .btn02 {
      width: 193.5px; }
    .menuBar .box .btn03 {
      width: 240.3px; }
    .menuBar .box .btnLogo2 {
      width: 102.6px; }
    .menuBar .box .dropdown-content {
      margin-top: 117px; }
    .menuBar .box .dropdown-content a img {
      width: 90%; } }
  @media all and (min-width: 960px) and (max-width: 1024px) {
    .menuBar .box img.hr {
      height: 117px; }
    .menuBar .box .btn {
      height: 117px; }
    .menuBar .box .btnLogo {
      width: 182.4px; }
    .menuBar .box .btn01 {
      width: 147.6px; }
    .menuBar .box .btn02 {
      width: 193.5px; }
    .menuBar .box .btn03 {
      width: 240.3px; }
    .menuBar .box .btnLogo2 {
      width: 91.2px; }
    .menuBar .box .dropdown-content {
      margin-top: 117px; }
    .menuBar .box .dropdown-content a img {
      width: 90%; } }
  @media all and (min-width: 750px) and (max-width: 960px) {
    .menuBar .box img.hr {
      height: 97.5px; }
    .menuBar .box .btn {
      height: 97.5px; }
    .menuBar .box .btnLogo {
      width: 171px; }
    .menuBar .box .btn01 {
      width: 123px; }
    .menuBar .box .btn02 {
      width: 161.25px; }
    .menuBar .box .btn03 {
      width: 200.25px; }
    .menuBar .box .btnLogo2 {
      display: none; }
    .menuBar .box .dropdown-content {
      margin-top: 97.5px; }
    .menuBar .box .dropdown-content a img {
      width: 75%; }
    .menuBar .box .dropdown-content a.btn_03-2,
    .menuBar .box .dropdown-content a.btn_03-3,
    .menuBar .box .dropdown-content a.btn_03-4,
    .menuBar .box hr {
      display: none; } }
  @media all and (min-width: 480px) and (max-width: 750px) {
    .menuBar .box img.hr {
      height: 91px; }
    .menuBar .box .btn {
      height: 91px; }
    .menuBar .box .btnLogo {
      width: 182.4px;
      display: block;
      margin: -1.5% auto -6% auto; }
    .menuBar .box .btn01 {
      width: 114.8px; }
    .menuBar .box .btn02 {
      width: 150.5px; }
    .menuBar .box .btn03 {
      width: 186.9px; }
    .menuBar .box .btnLogo2 {
      display: none; }
    .menuBar .box .dropdown-content {
      margin-top: 91px; }
    .menuBar .box .dropdown-content a img {
      width: 100%; }
    .menuBar .box .dropdown-content a.btn_03-2,
    .menuBar .box .dropdown-content a.btn_03-3,
    .menuBar .box .dropdown-content a.btn_03-4,
    .menuBar .box hr {
      display: none; } }
  @media all and (max-width: 480px) {
    .menuBar .box img.hr {
      height: 65px; }
    .menuBar .box .btn {
      height: 65px; }
    .menuBar .box .btnLogo {
      width: 182.4px;
      display: block;
      margin: 1% auto -2.5% auto; }
    .menuBar .box .btn01 {
      width: 82px; }
    .menuBar .box .btn02 {
      width: 107.5px; }
    .menuBar .box .btn03 {
      width: 133.5px; }
    .menuBar .box .btnLogo2 {
      display: none; }
    .menuBar .box .dropdown-content {
      margin-top: 65px; }
    .menuBar .box .dropdown-content a img {
      width: 100%; }
    .menuBar .box .dropdown-content a.btn_03-2,
    .menuBar .box .dropdown-content a.btn_03-3,
    .menuBar .box .dropdown-content a.btn_03-4,
    .menuBar .box hr {
      display: none; } }

.swiper-container {
  position: relative;
  width: 100%;
  height: 100%; }
  @media all and (min-width: 1440px) {
    .swiper-container {
      min-height: 1280px; } }
  @media all and (min-width: 1200px) and (max-width: 1440px) {
    .swiper-container {
      min-height: 1000px; } }
  @media all and (min-width: 1024px) and (max-width: 1200px) {
    .swiper-container {
      min-height: 900px; } }
  @media all and (min-width: 960px) and (max-width: 1024px) {
    .swiper-container {
      min-height: 700px; } }
  @media all and (min-width: 750px) and (max-width: 960px) {
    .swiper-container {
      min-height: 0px; } }
  @media all and (min-width: 480px) and (max-width: 750px) {
    .swiper-container {
      min-height: 0px; } }
  @media all and (max-width: 480px) {
    .swiper-container {
      min-height: 0px; } }
  .swiper-container .swiper-button-next,
  .swiper-container .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 80px;
    height: 114px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 999;
    cursor: pointer;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat; }
    @media all and (min-width: 1200px) and (max-width: 1440px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 40%; } }
    @media all and (min-width: 1024px) and (max-width: 1200px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 40%; } }
    @media all and (min-width: 960px) and (max-width: 1024px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 40%; } }
    @media all and (min-width: 750px) and (max-width: 960px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 50%; } }
    @media all and (min-width: 480px) and (max-width: 750px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 50%;
        width: 56px;
        height: 79.8px; } }
    @media all and (max-width: 480px) {
      .swiper-container .swiper-button-next,
      .swiper-container .swiper-button-prev {
        top: 50%;
        width: 40px;
        height: 57px; } }
  .swiper-container .swiper-slide {
    background-position: top center;
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%; }
    @media all and (min-width: 1024px) and (max-width: 1200px) {
      .swiper-container .swiper-slide {
        -moz-background-size: 110%;
        -webkit-background-size: 110%;
        background-size: 110%; } }
    @media all and (min-width: 960px) and (max-width: 1024px) {
      .swiper-container .swiper-slide {
        -moz-background-size: 120%;
        -webkit-background-size: 120%;
        background-size: 120%; } }
    @media all and (min-width: 750px) and (max-width: 960px) {
      .swiper-container .swiper-slide {
        -moz-background-size: 180%;
        -webkit-background-size: 180%;
        background-size: 180%; } }
    @media all and (min-width: 480px) and (max-width: 750px) {
      .swiper-container .swiper-slide {
        -moz-background-size: 240%;
        -webkit-background-size: 240%;
        background-size: 240%; } }
    @media all and (max-width: 480px) {
      .swiper-container .swiper-slide {
        -moz-background-size: 270%;
        -webkit-background-size: 270%;
        background-size: 270%; } }
    .swiper-container .swiper-slide img {
      position: absolute;
      width: 70%;
      max-width: 1000px;
      right: 1%;
      top: 40%; }
    @media all and (min-width: 1200px) and (max-width: 1440px) {
      .swiper-container .swiper-slide img {
        width: 70%;
        top: 40%; } }
    @media all and (min-width: 1024px) and (max-width: 1200px) {
      .swiper-container .swiper-slide img {
        width: 70%;
        top: 50%; } }
    @media all and (min-width: 960px) and (max-width: 1024px) {
      .swiper-container .swiper-slide img {
        width: 75%;
        top: 50%; } }
    @media all and (min-width: 750px) and (max-width: 960px) {
      .swiper-container .swiper-slide img {
        width: 100%;
        top: 50%;
        left: 50%;
        -moz-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%); } }
    @media all and (min-width: 480px) and (max-width: 750px) {
      .swiper-container .swiper-slide img {
        width: 105%;
        top: 65%;
        left: 50%;
        -moz-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%); } }
    @media all and (max-width: 480px) {
      .swiper-container .swiper-slide img {
        width: 105%;
        top: 65%;
        left: 50%;
        -moz-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%); } }
  .swiper-container .slide1 {
    background-image: url(../img/header01.jpg);
    background-position: 30% 0; }
  .swiper-container .slide2 {
    background-image: url(../img/header02.jpg);
    background-position: 30% 0; }
  .swiper-container .slide3 {
    background-image: url(../img/header03.jpg);
    background-position: 30% 0; }
  .swiper-container .slide4 {
    background-image: url(../img/header04.jpg);
    background-position: 30% 0; }
  .swiper-container .slide5 {
    background-image: url(../img/header05.jpg);
    background-position: 30% 0; }
  .swiper-container .slide6 {
    background-image: url(../img/header06.jpg);
    background-position: center 0; }
    @media all and (min-width: 750px) and (max-width: 960px) {
      .swiper-container .slide6 {
        background-image: url(../img/header06.jpg);
        -moz-background-size: 170%;
        -webkit-background-size: 170%;
        background-size: 170%; } }
    @media all and (min-width: 480px) and (max-width: 750px) {
      .swiper-container .slide6 {
        background-image: url(../img/header06_b.jpg);
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        background-size: 100%; } }
    @media all and (max-width: 480px) {
      .swiper-container .slide6 {
        background-image: url(../img/header06_b.jpg);
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        background-size: 100%; } }
  .swiper-container .slide7 {
    background-image: url(../img/header07.jpg);
    background-position: 20% 0; }
  .swiper-container .slide8 {
    background-image: url(../img/header08.jpg);
    background-position: 30% 0; }
  .swiper-container .slide9 {
    background-image: url(../img/header09.jpg);
    background-position: 30% 0; }
  .swiper-container .slide10 {
    background-image: url(../img/header10.jpg);
    background-position: 30% 0; }
  .swiper-container .slide11 {
    background-image: url(../img/header11.jpg);
    background-position: 30% 0; }
  .swiper-container .slide12 {
    background-image: url(../img/header12.jpg);
    background-position: 30% 0; }
  .swiper-container .slide13 {
    background-image: url(../img/header13.jpg);
    background-position: 30% 0; }

.container {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 1; }
  .container .youtubeBox {
    position: relative;
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
    background-position: top center;
    background-repeat: no-repeat;
    max-width: 789px;
    margin-top: -15%;
    margin-bottom: 50px; }
  .container .banner {
    position: relative;
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
    max-width: 1200px;
    padding-bottom: 50px; }

.footer {
  position: relative;
  display: block;
  margin: 0 auto;
  width: 100%;
  height: auto;
  background-position: top center;
  background-repeat: no-repeat;
  height: 7%;
  background-image: url(../img/footer_02.jpg);
  background-color: #000;
  -moz-background-size: 1000px auto;
  -webkit-background-size: 1000px auto;
  background-size: 1000px auto;
  bottom: 0; }
  @media all and (min-width: 1024px) and (max-width: 1200px) {
    .footer {
      -moz-background-size: 100%;
      -webkit-background-size: 100%;
      background-size: 100%; } }
  @media all and (min-width: 960px) and (max-width: 1024px) {
    .footer {
      -moz-background-size: 100%;
      -webkit-background-size: 100%;
      background-size: 100%; } }
  @media all and (min-width: 750px) and (max-width: 960px) {
    .footer {
      -moz-background-size: 100%;
      -webkit-background-size: 100%;
      background-size: 100%; } }
  @media all and (min-width: 480px) and (max-width: 750px) {
    .footer {
      -moz-background-size: 100%;
      -webkit-background-size: 100%;
      background-size: 100%; } }
  @media all and (max-width: 480px) {
    .footer {
      -moz-background-size: 100%;
      -webkit-background-size: 100%;
      background-size: 100%; } }

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

.fixedBtnArea {
  position: fixed;
  top: 150px;
  right: 30px;
  z-index: 100;
}

.fixedBtnArea__btn {
  box-sizing: border-box;
  display: block;
  width: 150px;
  padding: 10px;
  margin: 5px;
  background-color: burlywood;
  text-align: center;
  text-decoration: none;
  box-shadow: 1px 1px 3px #000;
}
.fixedBtnArea__btn--1 {
  background-color: #680909;
}
.fixedBtnArea__btn--2 {
  background-color: #340E50;
}
.fixedBtnArea__btn--3 {
  background-color: #295A15;
}


.fixedBtnArea__btn span {
  font-family:'Arial Black';
  font-size: 16px;
  color: white;
  text-shadow: 1px 1px 3px #000;
}

@media screen and (max-width:1024px){
  .footer{
    display: none;
  }
  .fixedBtnArea{
      top:initial;
      bottom:0;
      right: 0;
      width: 100%;
      font-size: 0;
  }
  .fixedBtnArea__btn {
      display: inline-block;
      width: 50%;
      margin: 0;
  }
  .fixedBtnArea__btn span {
      font-size: 30px;
  }
}