/*vars*/
@font-face {
  font-family: "latoregular";
  src: url("../fonts/lato/lato-regular-webfont.woff2") format("woff2"), url("../fonts/lato/lato-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
/*mixins*/
/*Grid*/
.col-md-1 {
  width: 8.3333333333%;
}

.col-md-2 {
  width: 16.6666666667%;
}

.col-md-3 {
  width: 25%;
}

.col-md-4 {
  width: 33.3333333333%;
}

.col-md-5 {
  width: 41.6666666667%;
}

.col-md-6 {
  width: 50%;
}

.col-md-7 {
  width: 58.3333333333%;
}

.col-md-8 {
  width: 66.6666666667%;
}

.col-md-9 {
  width: 75%;
}

.col-md-10 {
  width: 83.3333333333%;
}

.col-md-11 {
  width: 91.6666666667%;
}

.col-md-12 {
  width: 100%;
}

.col-offset-md-1 {
  margin-left: 8.3333333333%;
}

.col-offset-md-2 {
  margin-left: 16.6666666667%;
}

.col-offset-md-3 {
  margin-left: 25%;
}

.col-offset-md-4 {
  margin-left: 33.3333333333%;
}

.col-offset-md-5 {
  margin-left: 41.6666666667%;
}

.col-offset-md-6 {
  margin-left: 50%;
}

.col-offset-md-7 {
  margin-left: 58.3333333333%;
}

.col-offset-md-8 {
  margin-left: 66.6666666667%;
}

.col-offset-md-9 {
  margin-left: 75%;
}

.col-offset-md-10 {
  margin-left: 83.3333333333%;
}

.col-offset-md-11 {
  margin-left: 91.6666666667%;
}

.col-offset-md-12 {
  margin-left: 100%;
}

@media (max-width: 480px) {
  .col-xs-1 {
    width: 8.3333333333%;
  }

  .col-xs-2 {
    width: 16.6666666667%;
  }

  .col-xs-3 {
    width: 25%;
  }

  .col-xs-4 {
    width: 33.3333333333%;
  }

  .col-xs-5 {
    width: 41.6666666667%;
  }

  .col-xs-6 {
    width: 50%;
  }

  .col-xs-7 {
    width: 58.3333333333%;
  }

  .col-xs-8 {
    width: 66.6666666667%;
  }

  .col-xs-9 {
    width: 75%;
  }

  .col-xs-10 {
    width: 83.3333333333%;
  }

  .col-xs-11 {
    width: 91.6666666667%;
  }

  .col-xs-12 {
    width: 100%;
  }

  .col-offset-xs-1 {
    margin-left: 8.3333333333%;
  }

  .col-offset-xs-2 {
    margin-left: 16.6666666667%;
  }

  .col-offset-xs-3 {
    margin-left: 25%;
  }

  .col-offset-xs-4 {
    margin-left: 33.3333333333%;
  }

  .col-offset-xs-5 {
    margin-left: 41.6666666667%;
  }

  .col-offset-xs-6 {
    margin-left: 50%;
  }

  .col-offset-xs-7 {
    margin-left: 58.3333333333%;
  }

  .col-offset-xs-8 {
    margin-left: 66.6666666667%;
  }

  .col-offset-xs-9 {
    margin-left: 75%;
  }

  .col-offset-xs-10 {
    margin-left: 83.3333333333%;
  }

  .col-offset-xs-11 {
    margin-left: 91.6666666667%;
  }

  .col-offset-xs-12 {
    margin-left: 100%;
  }
}
@media (min-width: 480px) and (max-width: 768px) {
  .col-sm-1 {
    width: 8.3333333333%;
  }

  .col-sm-2 {
    width: 16.6666666667%;
  }

  .col-sm-3 {
    width: 25%;
  }

  .col-sm-4 {
    width: 33.3333333333%;
  }

  .col-sm-5 {
    width: 41.6666666667%;
  }

  .col-sm-6 {
    width: 50%;
  }

  .col-sm-7 {
    width: 58.3333333333%;
  }

  .col-sm-8 {
    width: 66.6666666667%;
  }

  .col-sm-9 {
    width: 75%;
  }

  .col-sm-10 {
    width: 83.3333333333%;
  }

  .col-sm-11 {
    width: 91.6666666667%;
  }

  .col-sm-12 {
    width: 100%;
  }

  .col-offset-xs-1 {
    margin-left: 8.3333333333%;
  }

  .col-offset-xs-2 {
    margin-left: 16.6666666667%;
  }

  .col-offset-xs-3 {
    margin-left: 25%;
  }

  .col-offset-xs-4 {
    margin-left: 33.3333333333%;
  }

  .col-offset-xs-5 {
    margin-left: 41.6666666667%;
  }

  .col-offset-xs-6 {
    margin-left: 50%;
  }

  .col-offset-xs-7 {
    margin-left: 58.3333333333%;
  }

  .col-offset-xs-8 {
    margin-left: 66.6666666667%;
  }

  .col-offset-xs-9 {
    margin-left: 75%;
  }

  .col-offset-xs-10 {
    margin-left: 83.3333333333%;
  }

  .col-offset-xs-11 {
    margin-left: 91.6666666667%;
  }

  .col-offset-xs-12 {
    margin-left: 100%;
  }
}
@media (min-width: 1248px) {
  .col-lg-1 {
    width: 8.3333333333%;
  }

  .col-lg-2 {
    width: 16.6666666667%;
  }

  .col-lg-3 {
    width: 25%;
  }

  .col-lg-4 {
    width: 33.3333333333%;
  }

  .col-lg-5 {
    width: 41.6666666667%;
  }

  .col-lg-6 {
    width: 50%;
  }

  .col-lg-7 {
    width: 58.3333333333%;
  }

  .col-lg-8 {
    width: 66.6666666667%;
  }

  .col-lg-9 {
    width: 75%;
  }

  .col-lg-10 {
    width: 83.3333333333%;
  }

  .col-lg-11 {
    width: 91.6666666667%;
  }

  .col-lg-12 {
    width: 100%;
  }

  .col-offset-xs-1 {
    margin-left: 8.3333333333%;
  }

  .col-offset-xs-2 {
    margin-left: 16.6666666667%;
  }

  .col-offset-xs-3 {
    margin-left: 25%;
  }

  .col-offset-xs-4 {
    margin-left: 33.3333333333%;
  }

  .col-offset-xs-5 {
    margin-left: 41.6666666667%;
  }

  .col-offset-xs-6 {
    margin-left: 50%;
  }

  .col-offset-xs-7 {
    margin-left: 58.3333333333%;
  }

  .col-offset-xs-8 {
    margin-left: 66.6666666667%;
  }

  .col-offset-xs-9 {
    margin-left: 75%;
  }

  .col-offset-xs-10 {
    margin-left: 83.3333333333%;
  }

  .col-offset-xs-11 {
    margin-left: 91.6666666667%;
  }

  .col-offset-xs-12 {
    margin-left: 100%;
  }
}
@media screen and (max-width: 480px) {
  .white-btn {
    font-size: 14px;
    padding: 15px 20px;
  }
  .white-btn:after {
    width: 33px;
  }
}
.product {
  padding-top: 105px;
}
@media screen and (max-width: 480px) {
  .product {
    padding-top: 55px;
  }
}
.product h3 {
  margin-bottom: 40px;
}
@media screen and (max-width: 480px) {
  .product h3 {
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 480px) {
  .product h3 img {
    margin: 0 auto;
  }
}

.main-slider {
  padding-bottom: 60px;
  background-color: #f0e9d5;
  padding-top: 80px;
}
@media screen and (max-width: 1024px) {
  .main-slider {
    padding-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .main-slider {
    padding-top: 80px;
  }
}
@media screen and (max-width: 480px) {
  .main-slider {
    padding-top: 60px;
  }
}
@media screen and (max-width: 320px) {
  .main-slider {
    padding-top: 0;
  }
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 15px;
  width: 12px;
  height: 12px;
  background: #fff;
  opacity: 1;
  outline: none;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #646464;
}

.bnr,
.bnr-creap,
.bnr-vol3 {
  height: 700px;
}
@media only screen and (max-width: 768px) {
  .bnr,
.bnr-creap,
.bnr-vol3 {
    height: 870px;
  }
}
@media only screen and (max-width: 480px) {
  .bnr,
.bnr-creap,
.bnr-vol3 {
    height: 700px;
  }
}
@media only screen and (max-width: 400px) {
  .bnr,
.bnr-creap,
.bnr-vol3 {
    height: 620px;
  }
}
@media only screen and (max-width: 360px) {
  .bnr,
.bnr-creap,
.bnr-vol3 {
    height: 580px;
  }
}
@media only screen and (max-width: 320px) {
  .bnr,
.bnr-creap,
.bnr-vol3 {
    height: 550px;
  }
}

.bnr {
  background-image: url("../../../common_files/images/bnr-bg-2nd.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
  background-color: #000;
  position: relative;
  display: block;
  overflow: hidden;
}
@media only screen and (max-width: 480px) {
  .bnr {
    padding-top: 100px;
  }
}
.bnr div {
  height: 100%;
}
.bnr .bnr-caption {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}
.bnr .bnr-caption img {
  max-height: 780px;
}

.bnr-creap {
  background-image: url("../images/main/bnr-creap-bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right 38% bottom 0;
  background-color: #000;
  position: relative;
  display: block;
}
@media only screen and (max-width: 1024px) {
  .bnr-creap {
    background-position: right 50% bottom 0;
  }
}
@media only screen and (max-width: 768px) {
  .bnr-creap {
    background-image: url("../images/main/bnr-creap-mobile.jpg");
    background-position: center bottom;
  }
}
@media only screen and (max-width: 320px) {
  .bnr-creap {
    min-height: auto;
  }
}
.bnr-creap .caption {
  padding-top: 170px;
  padding-right: 50px;
  padding-left: 30px;
  width: 40%;
  text-align: right;
  position: relative;
  z-index: 2;
}
@media only screen and (max-width: 768px) {
  .bnr-creap .caption {
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    width: 80%;
    padding-top: 30px;
  }
}
@media only screen and (max-width: 480px) {
  .bnr-creap .caption {
    padding-top: 100px;
  }
}

.bnr-vol3 {
  background-image: url("../../../common/images/bnr-bg.jpg");
  background-size: cover;
  background-position: right bottom;
}
@media only screen and (max-width: 768px) {
  .bnr-vol3 {
    background-image: url("../../../common/images/bnr-bg-sp.jpg");
    background-position: center bottom;
  }
}
.bnr-vol3 div {
  height: 100%;
}
.bnr-vol3 .caption {
  width: 40%;
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
@media only screen and (max-width: 768px) {
  .bnr-vol3 .caption {
    width: 100%;
    justify-content: center;
    align-items: flex-start;
    padding-top: 20px;
  }
}
@media only screen and (max-width: 480px) {
  .bnr-vol3 .caption {
    padding-top: 70px;
  }
}
@media only screen and (max-width: 320px) {
  .bnr-vol3 .caption {
    padding-top: 80px;
  }
}
@media only screen and (max-width: 480px) {
  .bnr-vol3 .caption img {
    height: 370px;
    width: auto;
  }
}
@media only screen and (max-width: 380px) {
  .bnr-vol3 .caption img {
    height: 340px;
  }
}
@media only screen and (max-width: 320px) {
  .bnr-vol3 .caption img {
    height: 290px;
  }
}

.block {
  padding: 70px 0;
}
@media only screen and (max-width: 480px) {
  .block {
    padding: 45px 0 !important;
  }
}

.top-campaign-link {
  margin-bottom: 90px;
}
.top-campaign-link a {
  display: inline-block;
}
@media only screen and (max-width: 480px) {
  .top-campaign-link {
    margin-bottom: 40px;
  }
}

.campaign-banner {
  border-radius: 30px;
  display: inline-block;
  overflow: hidden;
  margin-top: 65px;
  margin-bottom: 55px;
}
@media only screen and (max-width: 480px) {
  .campaign-banner {
    margin-top: 45px;
  }
}
.campaign-banner img {
  width: 100%;
}

.second-page {
  background-image: url("../../../common_files/images/bnr-bg-2nd.jpg");
  background-size: cover;
  background-position: center;
  padding-top: 75px;
}
.second-page .second-page-bnr {
  display: flex;
  align-items: flex-end;
  position: relative;
}
@media screen and (max-width: 768px) {
  .second-page .second-page-bnr {
    justify-content: center;
  }
}
@media screen and (max-width: 768px) {
  .second-page .second-page-bnr > div:first-child {
    max-width: 40%;
  }
}
@media screen and (max-width: 480px) {
  .second-page .second-page-bnr > div:first-child {
    max-width: 50%;
  }
}
@media screen and (max-width: 768px) {
  .second-page .second-page-bnr > div:last-child {
    max-width: 30%;
  }
}
@media screen and (max-width: 480px) {
  .second-page .second-page-bnr > div:last-child {
    max-width: 40%;
  }
}
.second-page .second-page-bnr .sp-bnr-author {
  width: 400px;
  padding-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .second-page .second-page-bnr .sp-bnr-author {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    padding-bottom: 2px;
  }
}
.second-page .second-page-bnr .sp-bnr-author .sp-bnr-author-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
@media screen and (max-width: 768px) {
  .second-page .second-page-bnr .sp-bnr-author .sp-bnr-author-container {
    justify-content: space-around;
    flex-direction: row-reverse;
  }
}
.second-page .second-page-bnr .sp-bnr-author .sp-bnr-author-container span:last-child {
  margin-left: 15px;
}
.second-page .second-page-bnr .sp-bnr-author .sp-bnr-author-container img {
  vertical-align: middle;
}
.second-page .sp-bnr-content {
  width: 400px;
  margin: 0 30px;
  padding: 0 30px;
  justify-self: first baseline;
  margin: 0 auto;
  margin-bottom: -30%;
}
@media screen and (max-width: 768px) {
  .second-page .sp-bnr-content {
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 480px) {
  .second-page .sp-bnr-content {
    width: 100%;
    padding: 0;
  }
}
.second-page .sp-bnr-content p {
  text-align: justify;
  margin-bottom: 35px;
}
.second-page .sp-bnr-content .sp-bnr-title {
  text-align: center;
}
.second-page .sp-bnr-content .sp-bnr-title h3, .second-page .sp-bnr-content .sp-bnr-title h5 {
  margin-bottom: 25px;
}
.second-page .sp-bnr-content .sp-bnr-btn {
  text-align: center;
  position: relative;
  z-index: 2;
}

.vol3-bnr-btm {
  background-image: url("../images/main/vol3-bg.jpg");
  background-size: cover;
  background-position: center;
}
.vol3-bnr-btm .vol3-bnr-container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 590px;
  padding-top: 70px;
}
@media screen and (max-width: 768px) {
  .vol3-bnr-btm .vol3-bnr-container {
    display: block;
    padding-top: 35px;
    min-height: auto;
  }
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid {
  text-align: center;
  max-width: 400px;
  margin-right: 20px;
}
@media screen and (max-width: 768px) {
  .vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid {
    margin: 0 auto;
  }
}
@media screen and (max-width: 480px) {
  .vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid {
    max-width: 310px;
  }
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid p {
  text-align: justify;
  margin-bottom: 50px;
}
@media screen and (max-width: 480px) {
  .vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid p {
    margin-bottom: 15px;
  }
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid h3 {
  margin-bottom: 35px;
  margin-top: 15px;
}
@media screen and (max-width: 480px) {
  .vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid h3 {
    margin-top: 0;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 480px) {
  .vol3-bnr-btm .vol3-bnr-container .vol3-bnr-mid h3 img {
    width: 200px;
  }
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-left {
  align-self: flex-end;
  flex-shrink: 0;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-left span {
  display: block;
  position: relative;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-left span .vol3-bnr-dec {
  position: absolute;
  left: -90px;
  top: -120px;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-right {
  flex-shrink: 0;
  width: 300px;
  padding-bottom: 70px;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-right span {
  position: relative;
  display: block;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-right span img:first-child {
  visibility: hidden;
  opacity: 0;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-bnr-right span img:last-child {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 310px;
  right: -30px;
  max-width: none;
}
.vol3-bnr-btm .vol3-bnr-container .vol3-footer-sm {
  text-align: center;
}

/*# sourceMappingURL=style.css.map */
