@charset 'UTF-8';
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/* Path: agr-theme/css/form.css */
/* Compare this snippet from agr-theme/css/agr.css: */

* {
    font-family: "Noto Sans JP", sans-serif;
}

div.form-title {
    background: #fff;
    padding: 2em 0;
}

div.form-title h1 {
    color: #3e3a39;
    font-size: 1.5em;
    font-weight: 400;
    font-family: serif;
    margin: 0;
    text-align: center
}

section#form {
    background: #f5f5f5;
    padding: 3em 0;
}

section#form form {
    width: 100%;
    margin: auto;
    background: none;
}

.form-wrapper {
    max-width: 800px;
    margin: auto;
}

.form-wrapper h1 {
    line-height: 1.6;
}

section#form .form-title-text {
    padding: 50px 0 100px;
    text-align: center;
}

section#form .form-title-text h2{
    color: #3e3a39;
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 2em;
    text-align: center
}


section.form input[type="text"],
section.form input[type="email"],
section.form input[type="tel"],
section.form select {
  width: 100%!important;
  border: none;
  padding: 3px 15px;
  margin-top: 6px;
  font-size: 14px;
  height: 41px;
  color: #3e3a39;
}

section.form input::placeholder {
    color: #67605e;
}

section.form input[type="checkbox"] {
    border: none;
    outline: none;
    width: 20px;
    height: 20px;
}

#form form textarea {
    width: 100%!important;
    height: 130px;
    border: none;
    resize: none;
    color: #3e3a39;
}



div.hs_company.hs-company.field hs-form-field {
  padding-left: 5%;
}

section.form .hs-form label {
    font-size: 14px;
}

section.form .hs-form label span {
    vertical-align: bottom;
    line-height: 16px;
}

section.form input[type="submit"] {
  background: #3e3a39;
  border-radius: 0px;
  display: block;
  border: none;
  color: #fff;
  font-size: 17px;
  font-weight: normal;
  letter-spacing: 1em;
  padding: 2em 1em 2em 2em;
  width: 80%;
  height: 83px;
  margin: auto;
}

section.form input[type="submit"]:hover {
  cursor: pointer;
  background: #5a5452;
}

section.form span.hs-form-required {
    display: none;
  }

section.form .hs-form-booleancheckbox label:has(span.hs-form-required)::before  {
    display: none;
}

.hs-form-required:after {
    display: none;
}

section.form form legend,
section.form form legend p {
    font-size: 12px;
    color: #666;
}

section.form .hs-form-field {
    margin-bottom: 3.4rem;
}

section.form .hs-form-field>label {
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 700;
    gap: 4px;
}

section.form label:has(span.hs-form-required)::after {
    background: #933b2e;
    color: #fff;
    content: "必須";
    display: block;
    font-weight: normal;
    line-height: 1;
    padding: 3px 0;
    text-align: center;
    width: 32px;
    font-size: .625rem;
}

section.form .hs-form-booleancheckbox label:has(span.hs-form-required)::after {
    display: none;
}

section.form .hs-form-booleancheckbox label:has(span.hs-form-required)>span::after {
    background: #933b2e;
    color: #fff;
    content: "必須";
    display: inline-block;
    font-weight: normal;
    line-height: 1;
    padding: 3px 0;
    text-align: center;
    width: 32px;
    font-size: .625rem;
}

#form form input[type="checkbox"] {
    position: relative;
    width: 20px;
    height: 20px;
    background: #fff;
    vertical-align: -5px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }

#form form input[type="checkbox"]:checked:before {
    position: absolute;
    top: 2px;
    left: 6px;
    transform: rotate(50deg);
    width: 8px;
    height: 12px;
    border-right: 1px solid #933b2e;
    border-bottom: 1px solid #933b2e;
    content: '';
  }


/* オーナーズサイト用 */
footer.owner-site .footer_wrapper {
    background: initial;
    text-align: center;
}

footer.owner-site .footer_wrapper .footer_text span {
    font-size: 14px;
    font-weight: bold;
}

footer.owner-site .footer_wrapper img {
    width: 369px;
}

@media (max-width: 767px) {
    section#form {
        padding: 2em 1em;
    }
  
  /* オーナーズサイト用 */

    footer.owner-site .footer_wrapper {
        max-width: 100%;
        padding: 1em 2em;
    }

    footer.owner-site .footer_wrapper img {
        width: 100%;
    }    
}

/* Main Visual SP/PC Switch */
.mv-pc {
  display: none  /* PC用は、デフォルト（スマホ表示）では非表示 */
}
.mv-sp {
  display: block; /* SP用は、デフォルトで表示 */
}

/* PC表示（画面幅 768px以上）の場合 */
@media screen and (min-width: 768px) {
  .mv-pc {
    display: block; /* PC用を表示する */
}
  .mv-sp {
    display: none !important;  /* SP用を非表示にする */
  }
}

/* Hours House Main Title Style */
.hours-house-main-title {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 40px; /* ← 好みのサイズに調整 (例: 24px → 32px) */
  font-weight: normal; /* 太さはお好みで */
  letter-spacing: 0.1em; /* 文字間隔はお好みで */
  color: #333333; /* 文字色はお好みで */
  text-transform: uppercase; /* 大文字にする場合 */
  text-align: left; /* ← 中央揃えから左揃えに変更 */
  max-width: 1200px; /* ← コンテンツ全体の最大幅に合わせて調整 */
  margin: 0 auto; /* ← 全体の幅を指定した上で左右中央に配置（※） */
  padding: 5px 0px; /* ← 上下の余白はそのまま、左右の余白は文字の開始位置 */
}

/* Hours House Title Style */
.hours-house-title {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 32px; /* ← 好みのサイズに調整 (例: 24px → 32px) */
  font-weight: normal; /* 太さはお好みで */
  letter-spacing: 0.1em; /* 文字間隔はお好みで */
  color: #333333; /* 文字色はお好みで */
  text-transform: uppercase; /* 大文字にする場合 */
  text-align: left; /* ← 中央揃えから左揃えに変更 */
  max-width: 1200px; /* ← コンテンツ全体の最大幅に合わせて調整 */
  margin: 0 auto; /* ← 全体の幅を指定した上で左右中央に配置（※） */
  padding: 5px 0px; /* ← 上下の余白はそのまま、左右の余白は文字の開始位置 */
}

/* SP Title Break */
@media screen and (max-width: 767px) { /* ← スマートフォン表示のブレークポイント (適宜調整) */
  .hours-house-title .title-break-sp {
    display: block; /* ← spanをブロック要素にして改行させる */
  }
}
/* sp */

/* Hours House Catchphrase Style */
.hours-house-catchphrase {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px; /* ← タイトルより少し小さめに */
  font-weight: normal;
  line-height: 1.6; /* 行間を少し広めに取ると読みやすい */
  color: #555555; /* タイトルより少し薄い色にするなど */
  margin-top: 15px; /* タイトルからの間隔 */
  margin-bottom: 30px; /* サブタイトルとの間隔 */
}

/* Hours House Subtitle Style */
.hours-house-subtitle {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px; /* ← キャッチコピーよりさらに少し小さめに */
  font-weight: normal;
  line-height: 1.6;
  color: #777777; /* さらに少し薄い色にするなど */
  margin-top: 0;
  margin-bottom: 30; /* 下に続く動画との間隔は、動画側のマージンで調整 */
}

/* Concept Section Styles */
.concept-heading {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 20px; /* 見出し用のサイズ例 */
  font-weight: bold; /* または normal */
  letter-spacing: 0.1em;
  color: #333333;
  margin-bottom: 15px; /* 見出しの下のスペース */
  text-transform: uppercase; /*任意: タイトル感を出すために大文字化 */
}

.concept-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px; /* ★ PC用のサブタイトルサイズ */
  font-weight: normal;
  line-height: 1.8; /* 読みやすさのために行間を少し広めに */
  color: #555555; /* 本文用の色 */
  margin: 0; /* 段落のデフォルトマージンをリセット */
}

/* About Section Styles */
.about-heading {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px; /* 本文より少しだけ目立たせる */
  font-weight: bold;
  color: #333333;
  margin-top: 40px; /* 上のコンセプト文との余白 */
  margin-bottom: 10px;
}

.about-text {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 13px; /* 本文（16px）より少し小さくする */
  line-height: 1.7;
  color: #555555;
  margin: 0;
}

/* Annotation Text Style */
.lp-annotation {
  font-family: "Noto Sans JP", sans-serif; /* 基本フォントと統一 */
  font-size: 12px; /* 本文より小さく (12px or 13px) */
  color: #777777; /* 少し薄いグレー */
  line-height: 1.5; /* 行間 */
  margin-top: 10px; /* 特徴紹介ブロックからの間隔 */
  margin-bottom: 0px;
}

/* Features Section Styles */
.features-section {
  /* セクション全体の上下の余白（フォームとの間隔など）は、
     HTMLの style="margin: 40px auto;" で調整 */
}

.feature-block {
  display: flex; /* ← 横並びにする */
  align-items: center; /* ← 上下中央揃え */
  margin-bottom: 60px; /* ← 各ブロック間の余白（たっぷり取る） */
}

/* PC表示（768px以上）では左右反転 */
@media screen and (min-width: 768px) {
  .feature-block.reverse {
    flex-direction: row-reverse; /* ← 左右の配置を反転 */
  }
}

.feature-image {
  flex: 1 1 50%; /* ← 左右の幅を 50% に */
  padding: 20px; /* ← 画像の周りの余白 */
}

.feature-text {
  flex: 1 1 50%; /* ← 左右の幅を 50% に */
  padding: 20px; /* ← テキストの周りの余白 */
}

.feature-text h3 {
  /* テキスト内の見出しのスタイル */
  font-family: 'Your Chosen Font Name', sans-serif;
  font-size: 20px;
  font-weight: bold;
  color: #333333;
  margin-bottom: 15px;
}

.feature-text p {
  /* テキスト内の本文のスタイル */
  font-family: 'Your Chosen Font Name', sans-serif;
  font-size: 16px; /* PC用 */
  line-height: 1.8;
  color: #555555;
}

/* SP Adjustments (767px以下) */
@media screen and (max-width: 767px) {
  .feature-block {
    flex-direction: column; /* ← SPでは縦積みにする */
    margin-bottom: 40px;
  }
  
  .feature-block.reverse {
     flex-direction: column; /* ← SPでは反転させず、縦積みに戻す */
  }

  .feature-image,
  .feature-text {
    flex-basis: 100%; /* ← SPでは幅を100%に */
    padding: 10px 0; /* ← SP用の余白 */
  }
  
  .feature-text p {
    font-size: 14px; /* SP用 */
    line-height: 1.7;
  }
}

/* Section Divider Style */
.section-divider {
  border: 0; /* ブラウザ標準の線を消す */
  height: 1px; /* 線の太さ */
  background-color: #cccccc; /* 線の色 (薄めのグレー) */
  max-width: 1200px; /* ページの最大幅に合わせる */
  margin: 60px auto; /* ★上下にたっぷり余白を取り(60px)、左右中央に配置 */
}

/* SP Adjustments (Optional) */
@media screen and (max-width: 767px) {
  .hours-house-catchphrase {
    font-size: 16px; /* スマホでは少し小さく */
  }
  .hours-house-subtitle {
    font-size: 14px; /* スマホでは少し小さく */
  }
}

/* ===== アセットソリューション事業部 カスタムフッター START ===== */
.as-custom-footer {
  /* ▼ブロック全体の設定 */
  background-color: #3e3a39; /* 背景色 */
  color: #ffffff; /* 基本の文字色 */
  max-width: 1200px; /* ★コンテンツの最大幅（他と合わせる） */
  margin: 40px auto 0 auto; /* ★上下余白・左右中央寄せ */
  padding: 40px 200px; /* ブロックの内側の余白 */
  text-align: left; /* ★中のテキストを左揃え */
}

/* フッター内の「見出し」のスタイル */
.as-custom-footer h3 {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px;
  font-weight: bold;
  color: #ffffff;
  margin-bottom: 25px; 
  padding: 0;
}

/* フッター内の「本文（住所など）」のスタイル */
.as-custom-footer p {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px; 
  line-height: 1.7; 
  color: #ffffff;
  margin-bottom: 10px; 
}

/* フッター内のリンクのスタイル */
.as-custom-footer a {
  color: #ffffff; 
  text-decoration: underline;
}
.as-custom-footer a:hover {
  text-decoration: none;
}

/* ===== ↓↓カスタムフッターのレスポンシブ（SP）対応↓↓ ===== */
@media screen and (max-width: 767px) {
  .as-custom-footer {
    padding: 30px 20px; /* スマホでは余白を少し詰める */
    margin-top: 20px; /* 上の余白も少し詰める */
  }

  .as-custom-footer h3 {
    font-size: 16px; 
    margin-bottom: 20px;
  }

  .as-custom-footer p {
    font-size: 13px; 
    line-height: 1.6;
  }
}
/* ===== アセットソリューション事業部 カスタムフッター END ===== */