/* @charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ーーーーーーーーーーーーーー */
/* テーマ */
/* ーーーーーーーーーーーーーー */
:root {
  /* swell上書き */
  --color_border--table: #bfbfbf;
  /* --color_bg: #0b0c10; */
  /* 独自 */
  --el-sub-color: #eff7ff;
  --el-line-color: #06c755;
  /* slsh.jp Brand Variables */
  --slsh-text-white: #fff;
  --slsh-bg-main: #fafafa;
  --slsh-text-main: #111111;
  --slsh-text-gray: #e1e4ea;
  --slsh-text-muted: #666666;
  --slsh-text-sub: #8e95a5;
  --slsh-accent-red: #ff3333;
  --slsh-border-light: #e5e5e5;
  --slsh-dark-bg: #0b0c10;
  --slsh-box-bg: #12151d;
  --slsh-box-border: #1f2430;
  --slsh-border-dark: #3b3c3f;
  --slsh-bg-light-code: #eef0f5;
  --slsh-font-mono: "IBM Plex Mono", "Roboto Mono", monospace;
  --slsh-font-sans: "Inter", "Noto Sans JP", sans-serif;
  --slsh-letter-spacing: -0.03em;
}
body {
  background-color: var(--slsh-dark-bg);
}

/* ーーーーーーーーーーーーーー */
/* reCAPTCHA */
/* ーーーーーーーーーーーーーー */
.grecaptcha-badge {
  visibility: hidden;
}

/* ーーーーーーーーーーーーーー */
/* swell上書き */
/* ーーーーーーーーーーーーーー */
.post_content li {
  margin: 0.4em 0;
}

/* ーーーーーーーーーーーーーー */
/* パンくず */
/* ーーーーーーーーーーーーーー */
.p-breadcrumb__item {
  gap: 0;
  color: var(--slsh-text-white);
}
.p-breadcrumb__list {
  gap: 5px;
}
.p-breadcrumb__item:after {
  display: none;
}
.p-breadcrumb__text:before {
  content: "/";
  margin: 0 3px 0 0;
  position: relative;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ブログパーツ */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーーーーーーーーーー */
/* ヘッダーお問合せ */
/* ーーーーーーーーーーーーーーーーーーーーーー */
.el_cta_btn_hd a {
  line-height: 1.2;
  font-weight: normal !important;
  font-size: 13px;
  white-space: nowrap;
  color: var(--slsh-text-main);
  border-radius: 5px;
  /* min-width: 130px; */
  padding: 10px 12px;
}
.el_cta_btn_hd a:hover {
  opacity: 0.8;
}
@media all and (max-width: 959px) {
  .el_cta_btn_hd a {
    width: 100%;
    padding: 13px;
  }
}
/* ーーーーーーーーーーーーーーーーーーーーーー */
/* モバイルメニューCTA */
/* ーーーーーーーーーーーーーーーーーーーーーー */
.el_cta_mobile_menu a {
  width: 100%;
}
.el_cta_btn_hd.line a {
  background: var(--el-line-color) !important;
}
.el_cta_mobile_menu .swell-block-button .swell-block-button__link[data-has-icon] {
  gap: 5px;
}
.el_cta_mobile_menu .swell-block-button .__icon:not(.-right) {
  position: relative;
  top: 2px;
}

/* ーーーーーーーーーーーーーーーーーーーーーー */
/* ファーストビュー */
/* ーーーーーーーーーーーーーーーーーーーーーー */
/* ターミナル本文 */
.slsh-terminal-body {
  padding: 30px;
  line-height: 1.6;
  color: var(--slsh-text-white, #ffffff);
}
.slsh-terminal-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.slsh-terminal-line.margin-top {
  margin-top: 10px;
}
/* プロンプト (root@slsh:~#) */
.slsh-terminal .prompt {
  color: var(--slsh-text-sub);
  user-select: none;
  font-size: 13px;
}
.slsh-terminal .command {
  color: var(--slsh-text-white, #ffffff);
  font-size: 13px;
}
/* ログテキスト */
.slsh-terminal-log {
  padding-left: 12px;
  font-size: 0.775rem;
}
.slsh-terminal-log.text-muted {
  color: var(--slsh-text-sub, #a3a3a3);
}
.slsh-terminal-log.text-green {
  color: #10b981; /* 処理成功のグリーン */
  font-weight: 500;
}
/* 点滅カーソル */
.slsh-terminal .cursor {
  display: inline-block;
  width: 8px;
  height: 1.1em;
  background-color: var(--slsh-text-sub);
  vertical-align: middle;
  animation: slsh-blink 1s infinite;
}
@keyframes slsh-blink {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@media (max-width: 600px) {
  .slsh-terminal-body {
    padding: 30px 15px 0 15px;
  }
}
/* アスキーアート用スタイル */
.slsh-terminal pre.ascii-art {
  line-height: 1;
  color: var(--slsh-text-gray);
  white-space: pre;
  overflow-x: auto;
  user-select: none;
}
/* アスキーアート下のキャッチコピー枠 */
.terminal-banner {
  margin: 12px 0 12px 0;
}
.terminal-banner .banner-title {
  font-weight: normal;
  font-size: 1em;
}
.terminal-banner .banner-desc {
  font-size: 2em;
  color: var(--slsh-text-gray);
}
/* 表示切り替え用制御 */
.terminal-output.is-hidden {
  display: none;
}
@media all and (max-width: 480px) {
  .slsh-terminal pre.ascii-art {
    font-size: 0.8em;
  }
  .terminal-banner .banner-title {
    font-size: 13px;
  }
  .terminal-banner .banner-desc {
    font-size: 1.4em;
  }
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ヘッダー */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ナビフォントサイズ */
.c-gnav > .menu-item > a .ttl {
  font-size: 15px;
  font-weight: normal;
}
.c-gnav > .menu-item > a:hover,
.c-gnav .sub-menu > .menu-item > a:hover {
  opacity: 0.8;
  transform: none !important;
  transition: none !important;
}
.c-gnav > .menu-item > a::after {
  display: none;
}
/* ヘッダー背景 */
.l-header {
  box-shadow: none;
  border-bottom: 1px solid var(--slsh-border-dark);
}
/* 固定ヘッダー */
.l-fixHeader {
  border-bottom: 1px solid var(--slsh-border-dark);
}
/* サブメニュー */
.c-gnav .sub-menu {
  color: var(--slsh-text-white);
  background: var(--slsh-box-bg);
}
.menu-item-has-children .c-submenuToggleBtn {
  display: none !important;
}
.menu-item-has-children > a .ttl::after {
  content: "/" !important;
  margin-left: 0.25em !important;
}
/* サブメニュー：リセット */
.c-gnav .sub-menu a {
  padding: 0.5em 0.75em;
}
.c-gnav .sub-menu a:before {
  display: none;
}
.c-gnav .sub-menu a:hover .ttl {
  left: 0;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* モバイルナビ */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.p-spMenu__body {
  padding: 4vw 5.5vw 10vw;
  margin-top: 50px;
}
/* メニュー見出し */
.c-widget__title.-spmenu {
  padding: 0.75em 1em 0.75em 1.5em;
  display: none;
}
/* メニューリンク */
.p-spMenu .c-listMenu a {
  font-size: 18px;
  padding: 10px 0 0 0;
}
.p-spMenu .c-listMenu .sub-menu a {
  font-size: 15px;
  padding: 7.5px 0 7.5px 1.7em;
}
.p-spMenu__body .c-spnav a {
  border: none;
}
/* 親メニュ */
.p-spMenu__body .c-listMenu a:before {
  display: none;
}
/* サブメニュー */
.p-spMenu__body .sub-menu a:before {
  display: inline-block;
  content: "--";
  left: 0.5em;
  top: 45%;
}
/* モバイルアイコン、ハンバーガー */
.c-iconBtn__icon.icon-mail:before,
i.c-iconBtn__icon.icon-menu-thin {
  color: var(--slsh-text-white);
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* フッター */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* swell上書き */
/* フッターメニューの区切り線調整 */
.l-footer__nav li:last-child a {
  border-right: none;
}
.l-footer__nav li:first-child a {
  border-left: none;
}
.l-footer__widgetArea,
.w-footer__box {
  padding-bottom: 0;
}
.l-footer {
  border-top: solid 1px var(--slsh-border-dark);
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* トップページ
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーー */
/* 共通 */
/* ーーーーーーーーーーーーーー */
/* フッター上のスペース除去*/
.home .l-content,
.home #before_footer_widget {
  margin: 0 auto 0;
}
.top #content {
  padding-top: 0;
}
/* 共通の見出し */
.el_top_midashi h2 {
  font-size: clamp(24px, 6vw, 30px) !important;
  margin-bottom: 0.5em !important;
}
.el_div {
  border-bottom: 5px solid #0d407f !important;
  width: 50px;
}
/* ボタン */
.el_full_section .el_cta_btn_hd {
  max-width: 355px;
}
.el_full_section a.swell-block-button__link {
  font-size: 25px;
}
/* 中間サイズの改行調整*/
@media all and (min-width: 960px) and (max-width: 1090px) {
  .el_full_section a {
    padding: var(--the-padding);
  }
}
/* タブレット */
@media all and (min-width: 481px) and (max-width: 820px) {
}
/* ーーーーーーーーーーーーーー */
/* サービス */
/* ーーーーーーーーーーーーーー */
.slsh-services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}
/* 個別カード */
.slsh-service-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--slsh-border-dark);
  padding: 1.3em;
  text-decoration: none !important;
  color: inherit;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease;
}
.slsh-service-card:hover {
  /* fffの透過 */
  border-color: rgba(255, 255, 255, 0.4) !important;
  background-color: rgba(255, 255, 255, 0.04) !important;
}
/* アイコンエリア */
.slsh-card-icon {
  margin-bottom: 13px;
  color: var(--slsh-text-gray);
  display: flex;
  align-items: center;
}
.slsh-card-icon svg {
  display: block;
  shape-rendering: crispEdges;
}
/* サービス名 (タイトル) */
.slsh-card-title {
  font-size: 15px !important;
  font-weight: normal !important;
  color: var(--slsh-text-gray) !important;
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
  border-left: none !important;
}
/* 説明文 */
.slsh-card-desc {
  font-size: 13px;
  color: var(--slsh-text-sub);
  line-height: 1.6;
  margin: 0;
}
@media all and (max-width: 768px) {
  .slsh-services-grid {
    grid-template-columns: 1fr;
    /* grid-template-columns: repeat(2, 1fr); */
    gap: 12px;
  }
  .slsh-service-card {
    padding: 20px;
  }
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* アーカイブ・記事一覧 */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.category .l-article,
.blog .l-article {
  max-width: 100%;
}
.blog .p-postList__item,
.archive .p-postList__item {
  color: var(--slsh-text-white);
}
.blog .c-postTimes {
  color: var(--slsh-text-muted);
}
.c-postThumb__cat {
  color: var(--slsh-text-gray);
}
.icon-folder:before,
.p-postList__meta :before {
  display: none;
}
.p-postList .p-postList__title {
  font-weight: normal;
  font-size: 15px;
}
/* ページネーション */
.c-pagination {
  margin: 0;
}
[class*="page-numbers"] {
  font-size: 15px;
  background-color: var(--slsh-dark-bg);
  color: var(--slsh-text-muted);
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 固定ページ */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーー */
/* 固定ページ：レイアウト*/
/* ーーーーーーーーーーーーーー */
/* ページ全体設定 */
.page .l-content {
  margin-top: 0;
  margin-bottom: 2em;
  padding-top: 0;
}
/* コンテンツエリア調整 */
.page .post_content {
  padding: 0;
}
/* タイトルエリアリセット */
.l-topTitleArea {
  background-color: var(--slsh-dark-bg);
  min-height: 140px;
}
.l-topTitleArea .u-obf-cover {
  display: none !important;
}
/* タイトル */
.l-topTitleArea__body {
  color: var(--slsh-text-gray) !important;
  text-shadow: none;
}
h1.c-pageTitle {
  font-size: 15px;
  font-weight: 300;
  display: flex;
  flex-direction: column-reverse;
  align-content: flex-start;
  text-shadow: none;
  line-height: 1;
}
/* サブタイトル */
.c-pageTitle .c-pageTitle__subTitle {
  font-style: normal;
  opacity: 1;
  font-size: 50px;
  margin: 0;
  letter-spacing: var(--slsh-letter-spacing);
}
/* ーーーーーーーーーーーーーー */
/* 固定ページ：デザイン */
/* ーーーーーーーーーーーーーー */
/* ボックス */
.el_box {
  background-color: var(--slsh-box-bg);
  padding: 30px;
  border: 1px solid var(--slsh-box-border);
}
/* テキストカラー*/
.page .post_content {
  color: #fff;
}
/* インラインコード */
.page .post_content :not(pre) > code {
  background: var(--slsh-box-border);
  color: var(--slsh-text-white);
  border: none;
}
/* H2：ミニマル CLI プロンプト風 */
.page .post_content h2 {
  position: relative;
  font-weight: normal !important;
  color: var(--slsh-text-gray);
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  line-height: 1.4 !important;
  margin: 1em 0 0.8em 0 !important;
}
/* 擬似要素で頭に ─# を付与 */
.page .post_content h2::before {
  content: "╰─#" !important;
  color: var(--slsh-text-gray);
  position: static !important;
  display: inline-block !important;
  margin-right: 0.4em !important;
  border: none !important;
  background: none !important;
}
/* H3*/
.page .post_content h3 {
  font-weight: normal !important;
  color: var(--slsh-text-gray);
  font-size: 1.2em;
  border: none !important;
  padding: 0 !important;
  line-height: 1.4 !important;
  margin: 1.2em 0 0.2em 0 !important;
}
.el_box h3:first-of-type {
  margin-top: 0 !important;
}

/* 投稿リスト：テキストレイアウト */
.page .-type-simple .p-postList__link {
  border-bottom: 1px solid var(--slsh-border-dark);
  padding: 0.7em 0.25em;
  transition: background-color 0.25s;
}
.page .-type-simple .p-postList__link:hover {
  opacity: 0.8;
}
.p-postList.-type-simple {
  border-top: 1px solid var(--slsh-border-dark);
}
.p-postList__meta {
  color: var(--slsh-text-muted);
  font-size: 12px;
}
/* Faq */
.swell-block-faq .faq_q {
  font-weight: normal;
  padding: 1em 1em 0em 3em;
}
[data-a="col-text"] .faq_a:before,
[data-q="col-text"] .faq_q:before {
  box-shadow: none;
}
.is-style-faq-border .swell-block-faq__item + .swell-block-faq__item {
  border-top: 1px solid var(--slsh-border-dark);
  padding-top: 1em;
}
/* 目次 */
.page .p-toc.-simple .p-toc__ttl {
  display: none;
}
.p-toc.-simple {
  border: 1px solid var(--slsh-border-dark);
}
ol.is-style-index > li:before {
  border: none !important;
  content: counters(toc, "-", decimal-leading-zero) ". ";
  top: 0.35em;
  padding: 0;
}
/* テーブル */
.page .post_content td,
.page .post_content th {
  border: 1px solid var(--slsh-border-dark);
  padding: 0.5em;
  border-left: none;
  border-right: none;
}
.page .post_content th {
  font-weight: normal;
  background: none;
}
.swl-inline-list[data-icon="dot"]:before,
.swl-inline-list[data-icon="dot"]:before {
  height: 3px;
  top: calc(0.85em);
  width: 3px;
}
/* タブコンテンツ */
.is-style-default .c-tabBody {
  padding: 15px 0 0 0 !important;
  border: none;
}
#content .c-tabList {
  border-bottom: 1px solid var(--slsh-border-dark);
  margin-top: 21px !important;
}
/* タブコンテンツ */
.is-style-default > .c-tabList .c-tabList__button {
  background: var(--slsh-border-dark);
  color: var(--slsh-text-gray);
  padding: 12px;
  opacity: 1;
  border-radius: 6px 6px 0 0;
  border-right: 1px solid var(--slsh-dark-bg);
}
.is-style-default > .c-tabList .c-tabList__button:hover {
  background: var(--slsh-border-dark);
  color: var(--slsh-text-gray);
  opacity: 0.8;
}
/* タブコンテンツ：デフォルト*/
.is-style-default > .c-tabList .c-tabList__button[aria-selected="true"] {
  background-color: var(--slsh-text-gray);
  color: var(--slsh-text-main);
  opacity: 1;
}
/* リストスタイル：ul選択時 */
.el_box ul {
  list-style: none !important;
  padding-left: 20px;
}
.el_box ul li::before {
  content: "";
  position: absolute;
  left: -0.8em;
  transform: translateY(-50%);
  background-color: var(--slsh-text-white);
  border-radius: 50%;
  height: 3px;
  top: calc(0.85em);
  width: 3px;
}
/* ステップ */
.el_box .swell-block-step__item {
  padding: 0 0 2em 3em;
}
.el_box .swell-block-step__item .swell-block-step__title {
  font-weight: normal;
  font-size: 15px !important ;
  min-height: 30px !important;
}
.el_box .swell-block-step__body {
  margin-top: 0;
  font-size: 13px;
}
/* ステップ：番号 */
.el_box .swell-block-step__number {
  background: var(--slsh-box-bg) !important;
  border: 1px solid var(--slsh-border-dark);
  height: 30px;
  width: 30px;
}
.el_box .swell-block-step__number:after {
  font-size: 12px;
}
.el_box .swell-block-step__item:before {
  border-left: 1px solid var(--slsh-border-dark);
  left: 16px;
}
/* モバイル */
@media all and (max-width: 480px) {
  .c-pageTitle .c-pageTitle__subTitle {
    font-size: 40px;
  }
  .l-topTitleArea {
    min-height: 140px;
  }
  .el_box {
    padding: 20px;
  }
  .page .post_content h2 {
    font-size: 18px;
  }
  .el_box .swell-block-step__body {
    margin-top: 1em;
    margin-left: -40px !important;
  }
  .page .post_content th {
    padding-left: 0;
    padding-right: 0;
  }
  .page .post_content td {
    padding-right: 0;
  }
}
/* ーーーーーーーーーーーーーー */
/* 固定ページ：404*/
/* ーーーーーーーーーーーーーー */
.slsh_404 {
  padding-top: 2em;
}
@media all and (max-width: 480px) {
  .slsh_404 {
    padding-top: 4em;
  }
}
.slsh_404 h1 {
  color: var(--slsh-text-gray);
  font-weight: normal;
  font-size: 3em;
  padding: 0;
}
.slsh_404 .post_content {
  color: var(--slsh-text-white);
  margin-top: 0;
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 投稿 */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 背景色 */
.single {
  background-color: #fefefe;
}
.single .l-content img {
  border-radius: 6px;
}
/* インラインコード */
.single .post_content :not(pre) > code {
  border: none;
  background: var(--slsh-bg-light-code);
}
/* 投稿ページアイキャッチ */
.p-articleThumb__img {
  box-shadow: none;
}
/* バッジ：アイコン */
.c-categoryList:before {
  display: none;
}
/* バッジ：ホバー */
.hov-flash-up:hover {
  box-shadow: none;
  animation: none;
  opacity: 0.8;
}
/* サイドバー：カテゴリーアイコン */
.widget_categories > ul > .cat-item > a:before,
.wp-block-categories-list > li > a:before {
  display: none;
}
.widget_categories > ul > .cat-item > a,
.wp-block-categories-list > li > a {
  padding-left: 0;
}
/* サイドバー：ランキングバッジ */
.-w-ranking.-type-list .p-postList__item:before {
  display: none;
}
/* サイドバー：ランキングホバー */
.p-postList__thumb {
  border-radius: 6px;
}
/* サイドバー：カテゴリーホバー */
.c-listMenu a:hover {
  opacity: 0.8;
  background-color: transparent;
}
/* 投稿タイトル */
.c-postTitle__ttl {
  font-weight: normal;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* パンくずリスト */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.p-breadcrumb.-bg-on {
  background: none;
  box-shadow: none !important;
}
.p-breadcrumb__text ::before {
  display: none;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 運営会社 */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 資格バッジ */
.slsh-cert-badge-box {
  display: flex;
  align-items: center;
  gap: 15px;
  /* border-bottom: 1px solid var(--slsh-border-dark); */
  /* padding-bottom: 15px; */
  margin-top: 15px;
}
.slsh-cert-info {
  display: flex;
  flex-direction: column;
  line-height: 1.4;
}
.slsh-cert-img {
  width: 60px;
  height: auto;
}
.slsh-cert-label {
  font-size: 12px;
  color: var(--slsh-text-muted);
}
.slsh-cert-name {
  margin: 0;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* /* 料金表 */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.el_table_price img {
  width: 20px;
  position: relative;
  top: 3px;
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* /* お問合せページ */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* /* 事例紹介*/
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.el_case_study_box {
  border-radius: 6px;
  border: 1px solid var(--slsh-border-dark);
  padding: 20px;
}
.el_case_study_box h2 {
  margin-bottom: 0.5em !important;
  font-weight: normal;
  font-size: 18px;
}
.el_case_study_box h2 img {
  top: 8px;
  margin-top: -8px;
  position: relative;
  margin-right: 5px;
}
/* 事例の概要 */
.el_case_study_box.outline h2 {
  color: var(--slsh-text-main);
}
.el_case_study_box .list div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 5px;
}
.el_case_study_box .list .item {
  width: 49%;
}
.el_case_study_box .list h4 {
  font-size: 15px;
  line-height: 1.8em;
  margin-right: 10px;
  color: var(--slsh-text-main);
}
/* モバイル */
@media all and (max-width: 480px) {
  .el_case_study_box .list div {
    flex-direction: column;
  }
  .el_case_study_box .list .item {
    width: 100%;
  }
}

/* お客様の状況 */
.el_case_study_box.situation {
  border: 1px solid #c81e1e;
}
.el_case_study_box.situation h2 {
  color: #c81e1e !important;
}
.el_case_study_box.situation blockquote {
  padding: 0 0 0 2em;
  background: none;
}
.el_case_study_box.situation blockquote::before {
  border-left: solid 3px #c81e1e !important;
  border-right: none;
  height: 100%;
  top: 0;
  left: 0.5em;
}
/* 対応 */
.el_case_study_box.support {
  border: 1px solid #0d407f;
}
.el_case_study_box.support h2 {
  color: var(--color_htag) !important;
}
/* .el_case_study_box.support li:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f058";
} */
/* 結果 */
.el_case_study_box.result {
  border: 1px solid #047857;
}
.el_case_study_box.result h2 {
  color: #047857 !important;
}
.el_case_study_box.result .point {
  padding: 15px;
  border-radius: 6px;
  background-color: #eef3f2;
}
.el_case_study_box.result .point p {
  margin-bottom: 0.2em !important;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* お問い合わせフォーム */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーー */
/* 入力欄テキストを強制的に白（Cool White）にする設定 */
/* ーーーーーーーーーーーーーー */
.page .post_content input[type="text"],
.page .post_content input[type="email"],
.page .post_content input[type="url"],
.page .post_content input[type="tel"],
.page .post_content textarea {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
/* ブラウザの自動入力（オートコンプリート）時の背景黒・文字白維持 */
.page .post_content input:-webkit-autofill,
.page .post_content input:-webkit-autofill:hover,
.page .post_content input:-webkit-autofill:focus,
.page .post_content textarea:-webkit-autofill {
  -webkit-text-fill-color: #fff !important;
  -webkit-box-shadow: 0 0 0px 1000px #0b0c10 inset !important;
  transition: background-color 5000s ease-in-out 0s;
}
/* ーーーーーーーーーーーーーー */
/* フォームデザイン */
/* ーーーーーーーーーーーーーー */
.el_section_contact {
  display: flex;
  justify-content: center;
  margin: auto;
  flex-direction: column;
}
.el_contact input,
.el_contact textarea,
.el_contact select {
  background: var(--slsh-dark-bg);
  border: solid 1px var(--slsh-box-border);
  margin-top: 0.3em;
  width: 100%;
  font-weight: normal;
}
.el_contact .wpcf7-list-item-label {
  font-weight: normal;
  font-size: 15px;
}
.el_contact .wpcf7-list-item.first {
  margin: 0;
}
.el_contact input[type="radio"] {
  width: inherit;
}
/* 一行入力系 */
.el_contact select,
.el_contact input,
.el_contact input[type="text"],
.el_contact input[type="email"],
.el_contact input[type="tel"],
.el_contact input[type="file"] {
  height: 40px;
}
/* ラベル */
.el_contact label {
  display: inline-block;
  font-size: 13px;
  margin-bottom: 1em;
  width: 100%;
  font-weight: normal;
}
/* プレースホルダー*/
.el_contact ::placeholder,
.page .post_content input::placeholder,
.page .post_content textarea::placeholder {
  color: var(--slsh-text-muted) !important;
  -webkit-text-fill-color: var(--slsh-text-muted) !important;
  opacity: 1 !important;
  padding-left: 0.5em;
  padding-top: 0.5em;
  font-size: 12px;
}
.el_contact_label_short input,
.el_contact_label_short select {
  max-width: 360px;
}
/* 承認ボックス、送信ボタン */
.el_contact_btn {
  text-align: center;
}
.el_contact_btn .policy {
  font-size: 12px;
  color: var(--slsh-text-muted);
}
/* 同意事項、reCAPTCHAミニニート */
.el_contact_btn .policy a,
.mininote,
.mininote a {
  color: var(--slsh-text-muted) !important;
}
.el_contact_btn label {
  font-weight: normal;
}
/* 送信ボタンデザイン */
.mininote .el_contact_btn [type="submit"],
.el_section_contact_fv .line,
.el_section_contact_fv .contact {
  border: none;
  margin-top: 0;
  border-radius: 10px;
  letter-spacing: 1px;
  font-weight: normal;
}
.el_contact_btn [type="submit"] {
  background: var(--slsh-text-white);
  color: var(--slsh-text-main);
  min-width: 130px;
  padding: 7.5px;
  border: none;
  margin-top: 1em;
  letter-spacing: 1px;
  border-radius: 5px;
  font-size: 15px;
  font-weight: normal;
}
.el_contact_btn .wpcf7-spinner {
  display: block;
}
/* 添付ファイル */
.el_contact input[type="file"] {
  border: none;
  padding-left: 0;
}
/* 必須マーク */
.el_contact_required {
  font-size: 13px;
  color: var(--slsh-accent-red);
  position: relative;
  margin-left: 3px;
  top: -5px;
}
/* 完了メッセージ エラーメッセージ */
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output {
  border: none;
  text-align: center;
  margin: auto;
  color: var(--slsh-text-white);
  font-size: 13px;
}
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output {
  color: var(--slsh-accent-red);
}
.wpcf7 form.sent .wpcf7-response-output::before {
  content: "\f058";
  font-weight: 900;
  font-family: "Font Awesome 6 Free";
  color: #46b450;
  padding-right: 0.3em;
}
/* エラーメッセージ：入力してください */
.wpcf7-not-valid-tip {
  color: var(--slsh-accent-red);
}
/* モバイル */
@media all and (max-width: 480px) {
  .el_contact {
    min-width: 100%;
  }
  .el_contact_label_short input,
  .el_contact_label_short select {
    max-width: 280px;
  }
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 2026/01/19調整 */
/* ファーストビューフォーム付き */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
@media all and (min-width: 481px) {
  .p-mainVisual__inner {
    height: 720px;
  }
}
.el_first_view_copy .main,
.el_first_view_copy .sub,
.el_first_view li {
  font-size: clamp(16px, 2vw, 16px);
}
.el_first_view_copy .main {
  font-size: clamp(38px, 6vw, 70px);
  font-weight: 900;
}
.el_first_view_copy .sub {
  line-height: 1.8;
}
/* リスト */
.el_first_view ul {
  gap: 0;
}
.el_first_view li {
  font-size: 20px;
}
/* 中間サイズの改行調整*/
@media all and (min-width: 960px) and (max-width: 1090px) {
  .el_first_view a {
    padding: var(--the-padding);
  }
}
/* モバイル */
@media all and (max-width: 480px) {
  .el_first_view_copy .sub {
    line-height: 1.6em;
  }
  .el_first_view li {
    margin: 0.3em 0;
  }
  /* ファーストビュー画像位置 */
  .u-obf-cover {
    object-position: 65%;
  }
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ドロップダウン（select）文字色切り替え（最小限版） */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */

/* 1. 選択済み時の文字色 ＆ カスタム矢印 */
.page .post_content select {
  color: #e1e4ea !important;
  -webkit-text-fill-color: #e1e4ea !important;
  /* カスタム矢印（アイコン） */
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E1E4EA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 1em center !important;
  background-size: 1em !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
/* 2. 【核心】未選択（最初のoptionが選ばれている時）はグレーにする */
.page .post_content select:has(option[value=""]:checked),
.page .post_content select:has(option:first-child:checked) {
  color: var(--slsh-text-muted, #666666) !important;
  -webkit-text-fill-color: var(--slsh-text-muted, #666666) !important;
}
/* 3. 展開リスト全体のダーク化（※開いたメニューが白くなる場合はコメント解除） */
.page .post_content select option {
  background-color: #12151d !important;
  color: #e1e4ea !important;
  -webkit-text-fill-color: #e1e4ea !important;
}
/* 4. 展開リスト内の「選択してください（1つ目）」だけはグレー表示 */
.page .post_content select option[value=""],
.page .post_content select option:first-child {
  color: var(--slsh-text-muted, #666666) !important;
  -webkit-text-fill-color: var(--slsh-text-muted, #666666) !important;
}

/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* 対応事例 */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
.slsh-metrics-header p {
  color: var(--slsh-text-muted);
  font-size: 0.9em;
  margin-bottom: 1.5em;
}
/* 3カラムグリッドレイアウト */
.slsh-metrics-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
/* スマホ対応（1カラムにする） */
@media (max-width: 768px) {
  .slsh-metrics-grid {
    grid-template-columns: 1fr;
  }
}
/* 各カードのスタイル */
.slsh-metric-card {
  border: 1px solid var(--slsh-border-dark);
  padding: 1.2em 1.5em;
  display: flex;
  flex-direction: column;
}
/* 英語テキスト */
.slsh-metric-label {
  font-size: 12px;
  color: var(--slsh-text-muted);
  white-space: nowrap;
}
.slsh-metric-title {
  font-size: 12px;
}
.slsh-metric-value {
  font-size: 2.2em;
  color: var(--slsh-text-gray);
  line-height: 1.1;
  margin-bottom: 0.2em;
}
.slsh-metric-value .unit {
  font-size: 0.65em;
  color: var(--slsh-accent-red);
  margin-left: 3px;
}
/* 訳注 */
.slsh-metrics-note {
  font-size: 0.75em;
  color: var(--slsh-text-muted);
  text-align: right;
  margin-top: 0.8em;
}
@media (max-width: 768px) {
  /* 横スクロール対応に切り替え */
  .slsh-metrics-grid {
    display: flex !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 12px !important;
    padding-bottom: 8px !important;
  }
  /* カード1枚ずつの幅を固定 */
  .slsh-metric-card {
    flex: 0 0 60% !important; /* 画面幅の75%で表示（次のカードがチラ見えする） */
    scroll-snap-align: start !important;
    padding: 15px;
  }
}
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* サービス */
/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */
/* ーーーーーーーーーーーーーー */
/* サービス概要 */
/* ーーーーーーーーーーーーーー */
/* テーブル全体：幅の固定（ガタつき完全防止） */
.page .post_content .service {
  width: 100%;
  table-layout: fixed;
}
.page .post_content .service th {
  width: 35%;
}
.page .post_content .service td {
  width: 65%;
  font-size: 13px;
  vertical-align: middle;
  line-height: 1.6;
}
/* 「詳細」トグルの完全インライン化 */
/* details, summary, open時すべてを inline に統一 */
.page .post_content .service .slsh-detail-toggle,
.page .post_content .service .slsh-detail-toggle summary,
.page .post_content .service .slsh-detail-toggle[open],
.page .post_content .service .slsh-detail-toggle .detail-content {
  display: inline !important;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
}
/* 「詳細」ボタンの見た目 */
.page .post_content .service .slsh-detail-toggle summary {
  font-size: 0.85em;
  color: var(--slsh-text-sub);
  cursor: pointer;
  text-decoration: underline;
  user-select: none;
  list-style: none;
  margin-left: 4px;
  position: relative;
  top: -1px;
  text-underline-offset: 2px;
}
/* コンテンツ */
.page .post_content .service .slsh-detail-toggle .detail-content {
  color: var(--slsh-text-sub);
}
/* 三角マーク消去補正 */
.page .post_content .service .slsh-detail-toggle summary::-webkit-details-marker {
  display: none;
}
/* 詳細ボタンコンテンツ、hover */
.page .post_content .service .slsh-detail-toggle summary:hover,
.page .post_content .service .slsh-detail-toggle[open] summary {
  opacity: 0.8;
}
/* pdfアイコン位置調整 */
svg.lucide {
  position: relative;
  top: 3px;
  left: 2px;
}
@media all and (max-width: 480px) {
  .page .post_content .service {
    table-layout: auto;
  }
  .page .post_content .service tr:first-child {
    border-top: 1px solid var(--slsh-border-dark);
  }
  .page .post_content .service td,
  .page .post_content .service th {
    border: none;
    display: block;
    width: 100%;
  }
  .page .post_content .service th {
    padding-bottom: 0.2em;
    padding-left: 0px;
    position: relative;
  }
  .page .post_content .service td {
    border-bottom: 1px solid var(--slsh-border-dark);
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .page .post_content .service .slsh-detail-toggle summary {
    margin-left: 0;
  }
  /* 対応内容のth要素の視認性を高める */
  /* .page .post_content .service th:before {
    content: "";
    position: absolute;
    left: 0.5em;
    transform: translateY(-50%);
    background-color: var(--slsh-text-white);
    border-radius: 50%;
    height: 3px;
    top: 55%;
    width: 3px;
  } */
}
/* ーーーーーーーーーーーーーー */
/* 料金体系 */
/* ーーーーーーーーーーーーーー */
.slsh-price-main {
  line-height: 1;
  color: var(--slsh-text-gray);
}
.slsh-price-main .number {
  font-size: 2em;
  letter-spacing: -0.02em;
}
.slsh-price-main .unit {
  bottom: 1px;
  position: relative;
}
.link-to-overview {
  margin: 0;
}
/* ーーーーーーーーーーーーーー */
/* プランラベル */
/* ーーーーーーーーーーーーーー */
.slsh-plan {
  padding-left: 7.5px;
}
.slsh-plan-title {
  font-size: 15px !important;
  font-weight: normal !important;
  color: var(--slsh-text-white) !important;
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
  border-left: none !important;
  /* padding: 3px 10px !important;
  border: 1px solid var(--slsh-border-light) !important; */
  display: inline-block;
}
.slsh-plan-desc {
  font-size: 13px;
  color: var(--slsh-text-sub);
  line-height: 1.6;
  margin: 0;
}
@media all and (max-width: 480px) {
  .slsh-plan {
    padding-left: 0;
  }
}
