@charset "UTF-8";
/* =============================================================================================== */
/* 共通設定 */
/* =============================================================================================== */
.elua {
  font-family: YakuHanJP, "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif; }

.elua .font-en {
  /* font-family: "Source Serif Pro", serif;*/
  font-family: "Roboto", "Noto Sans JP", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif; }
.elua .base {
  width: 1200px;
  margin: 0 auto;
  position: relative; }
.elua .base2 {
  width: 1300px;
  margin: 0 auto;
  position: relative; }
.elua .main-logo {
  animation-name: fadein;
  animation-duration: 2s; }
@keyframes fadein {
  from {
    opacity: 0;
    transform: translateY(20px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
.gfont {
  visibility: hidden; }

.wf-active .gfont {
  visibility: visible; }

/* =============================================================================================== */
/* トップページ */
/* =============================================================================================== */
.elua .bayer-navi {
  position: fixed;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  opacity: 0;
  transition: 0.8s; }
  .elua .bayer-navi.active {
    opacity: 1; }
  .elua .bayer-navi ul li {
    margin-bottom: 15px; }
    .elua .bayer-navi ul li img {
      width: 55px;
      transition: 0.5s;
      opacity: 0.7; }
      .elua .bayer-navi ul li img.active {
        transform: scale(1.2, 1.2);
        opacity: 1; }
.elua .main-txt {
  max-width: 600px;
  text-align: center;
  padding: 50px 0;
  line-height: 2;
  margin: 0 auto;
  font-size: 16px; }
.elua .bayer {
  background-color: #f0f0f1;
  padding: 30px 30px 20px;
  display: flex;
  justify-content: space-between;
  border-top: 2px solid #000; }
  .elua .bayer .bay-img {
    width: 15%;
    margin: 20px 0; }
  .elua .bayer .bay-txt {
    width: 35%;
    margin: 20px 30px; }
    .elua .bayer .bay-txt span {
      display: block;
      padding-bottom: 20px;
      font-size: 21px;
      font-weight: bold; }
    .elua .bayer .bay-txt p {
      line-height: 2; }
  .elua .bayer .bay-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 50%; }
    .elua .bayer .bay-list li {
      width: 23%; }
      .elua .bayer .bay-list li img {
        margin-bottom: 20px; }
.elua .product-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 50px 50px; }
  .elua .product-box .slick-slidebox {
    width: 47%; }
    .elua .product-box .slick-slidebox .thum-img {
      margin: 20px 0 0; }
      .elua .product-box .slick-slidebox .thum-img li {
        margin: 0 15px;
        background-color: #fff;
        text-align: center; }
        .elua .product-box .slick-slidebox .thum-img li:hover {
          cursor: pointer; }
  .elua .product-box .comment-box {
    width: 47%;
    border: 2px solid #000;
    padding: 40px;
    position: relative; }
    .elua .product-box .comment-box::after {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 0 0 30px 30px;
      border-color: transparent transparent #000 transparent;
      position: absolute;
      left: -30px;
      top: 100px; }
    .elua .product-box .comment-box .tit {
      font-size: 30px;
      font-weight: bold;
      border-bottom: 0px solid #000000;
      padding: 0 0 0 0;
      display: inline-block;
      margin: 0 0 15px;
      color: #ff5a00; }
    .elua .product-box .comment-box .check-point {
      border: double 4px #000;
      padding: 30px 10px 20px 40px;
      margin: 0 0 50px;
      position: relative;
      font-size: 18px; }
      .elua .product-box .comment-box .check-point::before {
        content: "BUYER'S COMMENT";
        position: absolute;
        top: -25px;
        left: -15px;
        background-color: #fff;
        padding: 15px 5px 5px;
        font-weight: bold;
        transform: rotate(-10deg); }
      .elua .product-box .comment-box .check-point ul li {
        padding: 0 0 6px;
        font-weight: bold; }
    .elua .product-box .comment-box .name {
      font-size: 18px;
      font-weight: bold;
      padding: 0 0 50px; }
    .elua .product-box .comment-box .catch {
      font-size: 22px;
      font-weight: bold;
      padding: 0 0 15px 0;
      display: block; }
    .elua .product-box .comment-box p {
      line-height: 2;
      margin: 0 0 50px; }
    .elua .product-box .comment-box .btn-more {
      width: 100%;
      display: block;
      color: #ffffff;
      font-weight: bold;
      text-align: center;
      padding: 15px 0;
      background-color: #000;
      border: 2px solid #000;
      font-size: 18px; }
      .elua .product-box .comment-box .btn-more:hover {
        transition: 0.5s;
        background-color: #ffffff;
        color: #000;
        opacity: 1; }
.elua .product-box:nth-child(odd) {
  background-color: #f7f7f7; }
  .elua .product-box:nth-child(odd) .slick-slidebox {
    order: 2; }
  .elua .product-box:nth-child(odd) .comment-box {
    order: 1; }
    .elua .product-box:nth-child(odd) .comment-box::after {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 30px 30px 0 0;
      border-color: #000000 transparent transparent transparent;
      position: absolute;
      left: auto;
      right: -30px;
      top: 100px; }
    .elua .product-box:nth-child(odd) .comment-box .check-point {
      border: double 4px #000; }
      .elua .product-box:nth-child(odd) .comment-box .check-point::before {
        background-color: #f7f7f7; }

.slick_thumb-u1 .slick-track,
.slick_thumb-u2 .slick-track,
.slick_thumb-u3 .slick-track,
.slick_thumb-u4 .slick-track,
.slick_thumb-u5 .slick-track,
.slick_thumb-u6 .slick-track,
.slick_thumb-u7 .slick-track {
  transform: unset !important; }

.slick_thumb-m1 .slick-track,
.slick_thumb-m2 .slick-track,
.slick_thumb-m3 .slick-track,
.slick_thumb-m4 .slick-track,
.slick_thumb-m5 .slick-track,
.slick_thumb-m6 .slick-track,
.slick_thumb-m7 .slick-track {
  transform: unset !important; }

.slick_thumb-s1 .slick-track,
.slick_thumb-s2 .slick-track,
.slick_thumb-s3 .slick-track,
.slick_thumb-s4 .slick-track,
.slick_thumb-s5 .slick-track,
.slick_thumb-s6 .slick-track,
.slick_thumb-s7 .slick-track {
  transform: unset !important; }

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