@charset "UTF-8";

/*
  toji-lab.jp トップページ専用CSS
  トップページ body.toji-lab-home 配下だけに限定しています。
*/

html,
body.toji-lab-home {
  width: 100%;
  min-height: 100%;
  margin: 0;
}

body.toji-lab-home {
  overflow-x: hidden;
  background: #d69a73;
  font-family: "Inter", "Noto Sans JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
}

body.toji-lab-home *,
body.toji-lab-home *::before,
body.toji-lab-home *::after {
  box-sizing: border-box;
}

/* PC・タブレット横・スマホ横 */
.toji-lab-home .toji-home-kv {
  position: relative;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;

  background-color: #d69a73;
  background-image: url("/static/img/pc_tojilab_kv.jpg");
  background-repeat: no-repeat;
  background-position: left top !important;
  background-size: cover;
}

/* 左肩要素：見本に合わせて上余白を詰める */
.toji-lab-home .toji-home-kv__content {
  position: absolute;
  z-index: 2;
  top: clamp(10px, 1.25vw, 24px);
  left: clamp(26px, 2.6vw, 48px);
  width: clamp(250px, 22.8vw, 390px);
}

.toji-lab-home .toji-home-kv__logo {
  margin: 0;
  line-height: 0;
}

.toji-lab-home .toji-home-kv__logo picture,
.toji-lab-home .toji-home-kv__logo img {
  display: block;
}

.toji-lab-home .toji-home-kv__logo img {
  width: 100%;
  height: auto;
  filter: none !important;
}

.toji-lab-home .toji-home-kv__date {
  margin: clamp(8px, 0.62vw, 12px) 0 0;
  color: #fff;
  font-family: "Inter", "Noto Sans JP", sans-serif;
  font-size: clamp(15px, 1.08vw, 21px);
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.18em;
}

.toji-lab-home .toji-home-kv__map {
  display: inline-block;
  width: clamp(52px, 3.5vw, 68px);
  margin-top: clamp(8px, 0.55vw, 11px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  line-height: 0;
  text-decoration: none;
}

.toji-lab-home .toji-home-kv__map picture,
.toji-lab-home .toji-home-kv__map img {
  display: block;
}

.toji-lab-home .toji-home-kv__map img {
  width: 100%;
  height: auto;
}

.toji-lab-home .toji-home-kv__map:hover {
  opacity: 0.86;
}

/* 横型は必ずPC用KV */
@media (orientation: landscape) {
  .toji-lab-home .toji-home-kv {
    background-image: url("/static/img/pc_tojilab_kv.jpg");
    background-position: left top !important;
    background-size: cover;
  }
}

/* PC幅も必ずPC用KV */
@media (min-width: 768px) {
  .toji-lab-home .toji-home-kv {
    background-image: url("/static/img/pc_tojilab_kv.jpg");
    background-position: left top !important;
    background-size: cover;
  }
}

/* タブレット・スマホ縦型 */
@media (orientation: portrait) {
  .toji-lab-home .toji-home-kv {
    background-image: url("/static/img/sp_tojilab_kv.jpg");
    background-repeat: no-repeat;
    background-position: left top !important;
    background-size: cover;
  }

  .toji-lab-home .toji-home-kv__content {
    top: clamp(24px, 3.4vh, 50px);
    left: clamp(34px, 5.7vw, 60px);
    width: min(60vw, 560px);
  }

  .toji-lab-home .toji-home-kv__date {
    margin-top: clamp(10px, 1.15vh, 18px);
    color: #6f3b22;
    font-size: clamp(20px, 2.25vw, 30px);
    letter-spacing: 0.18em;
  }

  .toji-lab-home .toji-home-kv__map {
    width: clamp(78px, 7.7vw, 104px);
    margin-top: clamp(12px, 1.25vh, 20px);
  }
}

/* スマホ縦型 */
@media (orientation: portrait) and (max-width: 767px) {
  .toji-lab-home .toji-home-kv__content {
    top: 3.4vw;
    left: 5.7vw;
    width: 66vw;
  }

  .toji-lab-home .toji-home-kv__date {
    margin-top: 2.8vw;
    font-size: 4.15vw;
  }

  .toji-lab-home .toji-home-kv__map {
    width: 15.5vw;
    margin-top: 3vw;
  }
}