@charset "utf-8";
/* ==========================================================
   サービスLP（service_window / service_interior / service_renovation）
   採用ページ（recruit）・ディスクロージャー・service.html のLPリンク
   ========================================================== */

/* ---------- service.html：LPへのリンクボタン ---------- */
.biz-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  margin: 10px auto 30px;
}
.biz-links a {
  display: inline-block;
  min-width: 300px;
  padding: 18px 30px;
  border: 1px solid #a86b3c;
  background: #fff;
  color: #a86b3c;
  font-size: 15px;
  text-align: center;
  text-decoration: none;
  transition: background .2s, color .2s;
}
.biz-links a:hover {
  background: #a86b3c;
  color: #fff;
}

/* ---------- LP 共通 ---------- */
.lp {
  font-family: "Noto Sans JP", "游ゴシック", "Yu Gothic", sans-serif;
  color: #333;
  line-height: 1.9;
}
.lp strong {
  color: #a86b3c;
  font-weight: 700;
}
.lp p {
  font-size: 15px;
  margin-bottom: 12px;
}
.lp_section {
  margin-bottom: 80px;
}
.lp_section h3 {
  font-size: 18px;
}
.lp_section h4 {
  font-size: 17px;
  color: #3a2c22;
  margin: 0 0 12px;
  padding-bottom: 10px;
  border-bottom: 2px solid #e9e2d6;
  position: relative;
}
.lp_section h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 32px;
  height: 2px;
  background: #a86b3c;
}

/* ファーストビュー */
.lp_hero {
  margin-bottom: 80px;
}
.lp_hero h2 {
  line-height: 1.6;
}
.lp_hero .lp_hero_img {
  margin-bottom: 30px;
}
.lp_hero .lp_hero_img img {
  display: block;
  width: 100%;
}
.lp_hero p {
  text-align: center;
}

/* ボタン */
.lp_btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 15px;
  margin: 30px 0 10px;
}
.lp_btn {
  display: inline-block;
  padding: 20px 60px;
  background: #ee8620;
  color: #fff !important;
  font-size: 12pt;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
}
.lp_btn:hover {
  opacity: .85;
}
.lp_tel {
  display: inline-block;
  padding: 16px 30px;
  border: 1px solid #6d6349;
  color: #4b3d21 !important;
  font-family: 'Josefin Sans', sans-serif;
  font-size: 16pt;
  text-decoration: none;
}

/* チェックリスト */
.lp_check {
  background: #fbf9f3;
  padding: 30px 40px;
  margin-bottom: 25px;
}
.lp_check li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 8px;
  font-size: 15px;
}
.lp_check li::before {
  content: "\f00c";
  font-family: FontAwesome;
  position: absolute;
  left: 0;
  top: 0;
  color: #a86b3c;
}

/* タグ一覧（対応施設など） */
.lp_tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}
.lp_tags li {
  padding: 6px 16px;
  border: 1px solid #e3ddd3;
  background: #f7f3ec;
  font-size: 14px;
}

/* 項目：説明 */
.lp_dl {
  margin: 0 0 20px;
  border-top: 1px solid #e3ddd3;
}
.lp_dl > div {
  display: flex;
  border-bottom: 1px solid #e3ddd3;
  padding: 14px 0;
}
.lp_dl dt {
  flex: 0 0 220px;
  font-weight: 700;
  color: #a86b3c;
}
.lp_dl dd {
  margin: 0;
  flex: 1;
  font-size: 15px;
}

/* カード */
.lp_cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 50px;
  margin-bottom: 20px;
}
.lp_card .lp_card_img {
  margin-bottom: 15px;
}
.lp_card .lp_card_img img {
  display: block;
  width: 100%;
}
.lp_card h4 .num {
  display: inline-block;
  margin-right: 10px;
  color: #a86b3c;
  font-family: 'Josefin Sans', sans-serif;
  font-size: 22px;
}
.lp_card h4 .en {
  display: block;
  color: #a86b3c;
  font-family: 'Josefin Sans', sans-serif;
  font-size: 13px;
  letter-spacing: .1em;
}

/* 写真（カード以外） */
.lp_photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 20px 0;
}
.lp_photos img {
  display: block;
  width: 100%;
}

/* STEP */
.lp_steps {
  counter-reset: none;
}
.lp_steps li {
  display: flex;
  gap: 25px;
  padding: 20px 25px;
  margin-bottom: 12px;
  background: #fbf9f3;
}
.lp_steps .step {
  flex: 0 0 90px;
  color: #a86b3c;
  font-family: 'Josefin Sans', sans-serif;
  font-size: 18px;
  font-weight: 600;
}
.lp_steps .tit {
  display: block;
  font-weight: 700;
  color: #3a2c22;
  margin-bottom: 4px;
}
.lp_steps p {
  margin: 0;
}

/* FAQ */
.lp_faq > div {
  padding: 20px 25px;
  border-bottom: 1px solid #e3ddd3;
}
.lp_faq > div:nth-child(2n) {
  background: #fbf9f3;
}
.lp_faq dt {
  color: #836812;
  font-size: 16px;
  margin-bottom: 6px;
}
.lp_faq dt::before {
  content: "Q.";
  margin-right: 5px;
}
.lp_faq dd {
  margin: 0;
  font-size: 15px;
}
.lp_faq dd::before {
  content: "A.";
  margin-right: 5px;
  color: #a86b3c;
}

/* 募集要項 */
.lp_table {
  width: 100%;
}
.lp_table th {
  width: 200px;
  vertical-align: top;
}

/* 締めの相談エリア */
.lp_cta {
  background: #f7f3ec;
  border: 1px solid #e3ddd3;
  padding: 50px 40px;
  text-align: center;
}
.lp_cta h3 {
  text-align: left;
}
.lp_cta .lp_sign {
  margin-top: 25px;
  color: #6d6349;
  font-size: 16px;
}

/* 施工事例（仮・非表示用） */
.lp_case {
  display: flex;
  gap: 30px;
  margin-bottom: 20px;
}
.lp_case .lp_case_img {
  flex: 0 0 40%;
}
.lp_case_ba {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 15px;
}
.lp_case_ba span {
  display: block;
  font-family: 'Josefin Sans', sans-serif;
  color: #a86b3c;
}

/* ---------- ディスクロージャー ---------- */
.disclosure {
  max-width: 900px;
  margin: 0 auto;
  font-family: "Noto Sans JP", "游ゴシック", "Yu Gothic", sans-serif;
}
.disclosure .lead {
  text-align: center;
  margin-bottom: 50px;
}
.disclosure table {
  width: 100%;
  margin-bottom: 30px;
}
.disclosure table th {
  width: 200px;
}
.disclosure .foot {
  margin-top: 60px;
  text-align: center;
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 750px) {
  .biz-links a {
    min-width: 0;
    width: 100%;
    padding: 15px 10px;
  }
  .lp {
    padding: 0 10px;
  }
  .lp_section,
  .lp_hero {
    margin-bottom: 50px;
  }
  .lp_hero p {
    text-align: left;
  }
  .lp_btn {
    width: 100%;
    padding: 18px 10px;
  }
  .lp_tel {
    width: 100%;
    text-align: center;
  }
  .lp_check {
    padding: 20px;
  }
  .lp_dl > div {
    display: block;
  }
  .lp_dl dt {
    margin-bottom: 4px;
  }
  .lp_cards,
  .lp_photos,
  .lp_case_ba {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .lp_steps li {
    display: block;
    padding: 15px;
  }
  .lp_cta {
    padding: 30px 15px;
  }
  .lp_cta h3 {
    text-align: left;
  }
  .lp_table th,
  .disclosure table th {
    width: 90px;
  }
  .lp_case {
    display: block;
  }
  .disclosure {
    padding: 0 10px;
  }
}
