@charset "UTF-8";
/* ==========================================================
   静的サイト化で追加したスタイル（元テーマの style.css の後に読み込む）
   ========================================================== */

/* JavaScriptが動かない環境でも、フェードイン対象が見えなくならないようにする */
html:not(.js) .fadein,
html:not(.js) .fadeinsp,
html:not(.js) .fadein img {
  opacity: 1 !important;
  transform: none !important;
}

/* ---------- フォーム ---------- */
.gas-form label { cursor: pointer; }
.gas-form textarea { width: 100%; }
.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.gas-form .cf-turnstile {
  margin: 24px 0 8px;
  text-align: center;
  min-height: 65px;
}
.form-message {
  color: #c0392b;
  white-space: pre-line;
  margin: 1em 0;
  text-align: center;
  font-weight: bold;
}
.gas-form .wpcf7-submit {
  font-family: inherit;
  border: none;
  cursor: pointer;
}
.gas-form .wpcf7-submit:disabled {
  opacity: .6;
  cursor: wait;
}

/* ---------- 下層ページ（プライバシーポリシー・サンクス・404） ---------- */
#main.subpage-main {
  padding: 150px 0 100px;
}
.subpage-container {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 20px;
  line-height: 1.9;
  color: #333;
}
.subpage-title {
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  letter-spacing: .1em;
  margin-bottom: 48px;
  padding-bottom: 20px;
  border-bottom: 1px solid #ccc;
}
.privacy-body h2 {
  font-size: 20px;
  font-weight: bold;
  margin: 40px 0 16px;
}
.privacy-body h3 {
  font-size: 17px;
  font-weight: bold;
  margin: 32px 0 10px;
  padding-left: 10px;
  border-left: 4px solid #f39800;
}
.privacy-body h4 {
  font-size: 15px;
  font-weight: bold;
  margin: 18px 0 6px;
}
.privacy-body p { margin-bottom: 12px; }
.privacy-meta { text-align: right; }
.privacy-contact {
  margin-top: 32px;
  padding: 20px 24px;
  background: #f5f5f5;
}
.thanks-box { text-align: center; }
.thanks-box p { margin-bottom: 16px; }
.thanks-back { margin-top: 40px; }
.thanks-back a {
  display: inline-block;
  margin: 0 8px 12px;
  padding: 14px 40px;
  background: #333;
  color: #fff;
  text-decoration: none;
}
.thanks-back a:hover { opacity: .8; }

@media (max-width: 640px) {
  #main.subpage-main { padding: 110px 0 80px; }
  .subpage-title { font-size: 20px; margin-bottom: 32px; }
}


/* 送信中のお知らせ */
.form-message.is-info { color: #e08300; font-weight: normal; }

/* ---------- 下層ページの追加 ---------- */
.subpage-container.wide { max-width: 1000px; }
.subpage-lead { text-align: center; margin-bottom: 10px; }
.thanks-back a { background: #f39800; border-radius: 30px; }

/* ログインページ */
.login-box { text-align: center; }
.login-links { list-style: none; padding: 0; margin: 0 auto 40px; max-width: 420px; }
.login-links li { margin-bottom: 16px; }
.login-links a {
  display: block; padding: 18px 20px; border: 2px solid #f39800; border-radius: 40px;
  color: #f39800; font-weight: bold; text-decoration: none; background: #fff;
}
.login-links a:hover { background: #f39800; color: #fff; }

/* ---------- アプリ開発プラン（旧サロンOMOのページ） ---------- */
.app-plan-name {
  font-size: 22px; font-weight: bold; color: #f39800; letter-spacing: .08em; margin: 18px 0 !important;
}
.static-slider .slide { display: block; }

/* サイトマップ */
.sitemap-list { list-style: none; padding: 0; max-width: 480px; margin: 0 auto; }
.sitemap-list li { border-bottom: 1px solid #ddd; }
.sitemap-list a { display: block; padding: 16px 8px; color: #333; text-decoration: none; }
.sitemap-list a::before { content: "›"; color: #f39800; margin-right: 10px; font-weight: bold; }
.sitemap-list a:hover { color: #f39800; }

/* アプリ開発プラン：スマホ表示のSTEPの写真（元画像が見つからないため表示しない） */
.index__section .caseBlock .text .body:after { display: none !important; }

/* ---------- ヘッダー：ログインボタンを画面の右端に寄せる（お問合せと離す） ---------- */
.header-wrapper { position: relative; }
.header-container.pc .headerRight {
  position: absolute;
  top: 11px;
  right: 24px;
  margin: 0;
  float: none;
}

/* ---------- アプリ開発プラン：見出しの帯 ----------
   サニポ共通の「オレンジの帯」が当たってしまうので、白背景に戻し、英字見出しを水色にする */
.app-plan-wrap .top-s5Wrapper {
  background: #fff none !important;
  color: inherit;
}
.app-plan-wrap .h2title span { color: #2CCBDB !important; }

/* TOP：メイン画像と料金表の間をあける */
body.home .top-section4 { padding-top: 70px; }
@media (max-width: 640px) { body.home .top-section4 { padding-top: 40px; } }