@charset "utf-8";

/*========================================================================*\

$header

\*========================================================================*/

.theme_beige header {
  background: var(--color-theme_beige);
}

.theme_beige header #headerInner #headerL .logo img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(6%) saturate(409%)
    hue-rotate(290deg) brightness(119%) contrast(100%);
}

.theme_beige .navi > ul > li a.title,
.theme_beige .navi > ul > li.telArea a {
  color: #ffffff;
}

.theme_beige .navi > ul > li.telArea a .tel:before {
  background-image: url(../images/ico_tel_f.png);
}

.theme_beige .navi > ul .contactArea a {
  background: #504131;
  border: 1px solid #504131;
}

.theme_beige .navi ul li.contactArea a.title:before {
  border-right: solid 2px #ffffff;
  border-top: solid 2px #ffffff;
}

.theme_beige .navi > ul .contactArea a:hover {
  color: var(--color-theme_beige);
  background: #ffffff;
}

.theme_beige .navi > ul > li a.title::after {
  background: #ffffff;
}

@media screen and (max-width: 1024px) {
  .theme_beige .logo.tablet {
    background: var(--color-theme_beige);
  }

  .theme_beige .logo.tablet img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(6%) saturate(409%)
      hue-rotate(290deg) brightness(119%) contrast(100%);
  }

  .theme_beige .navi > ul > li a.title,
  .theme_beige .navi > ul > li.telArea a {
    color: var(--primary-color);
  }

  .theme_beige .navi ul li a.title::before,
  .theme_beige .navi ul li.telArea.sp a::before {
    border-right: solid 2px var(--color-theme_beige);
    border-top: solid 2px var(--color-theme_beige);
  }

  .theme_beige .navi > ul .contactArea a {
    background: var(--color-theme_beige);
    border: 1px solid var(--color-theme_beige);
    color: #ffffff !important;
  }
}

/*========================================================================*\

$main

\*========================================================================*/

.theme_beige #topmain .textBox .ss {
  color: var(--color-theme_beige);
}

.theme_beige #topmain .textBox .ss::before {
  background-color: var(--color-theme_beige);
}

.theme_beige #kasomain h1 {
  color: var(--color-theme_beige);
}

/*========================================================================*\

$section

\*========================================================================*/

.theme_beige #Co .section h3 {
  color: var(--color-theme_beige);
}

.theme_beige #Co .section .arrow-button {
  border: 1px solid var(--color-theme_beige);
  color: var(--color-theme_beige);
}

.theme_beige #Co .section .arrow-button::before {
  background-color: var(--color-theme_beige);
}

.theme_beige #Co .section .arrow-button::after {
  background-color: var(--color-theme_beige);
}

.theme_beige #Co .section .arrow-button:hover::before {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 1) 50%,
    rgba(116, 94, 72, 1) 50%
  );
}

.theme_beige #Co #newsSection .box02Inner .newsBoxInner a::before {
  border-right: solid 2px var(--color-theme_beige);
  border-top: solid 2px var(--color-theme_beige);
}
/*========================================================================*\

$page

\*========================================================================*/

.theme_beige #Co .page h2 .jp {
  color: var(--color-theme_beige);
}

.theme_beige #Co .page .section h3 {
  color: var(--primary-color);
  position: relative;
}

.theme_beige #Co .page .section h3::before {
  content: "";
  width: 20%;
  height: 1px;
  display: inline-block;
  background-color: var(--color-theme_beige);
  position: absolute;
  bottom: -1px;
  left: 0;
  transition: all 0.3s;
}

.theme_beige #Co .page h4::before {
  background: var(--color-theme_beige);
}

.theme_beige #Co .page .catch {
  color: var(--color-theme_beige);
}

.theme_beige #Co .page .catch::before {
  background-color: var(--color-theme_beige);
}

.theme_beige #Co .page .point li::before {
  border-color: transparent transparent transparent var(--color-theme_beige);
}

.theme_beige #Co .page ol li:before,
.theme_beige #Co .page .alp li::before,
.theme_beige #Co .page .point-dot li:before,
.theme_beige #Co .page .ast li::before {
  color: var(--color-theme_beige);
}

.theme_beige #Co .page a {
  color: var(--color-theme_beige);
}

.theme_beige #contactForm #btnCheck input[type="submit"],
.theme_beige #contactForm #btnSent input[type="submit"],
.theme_beige #contactForm #btnSent input[type="button"] {
  background-color: var(--color-theme_beige);
}
