@charset "UTF-8";

/*  サイト内検索  */

.SL_wrapper {		/* 1カラム */
  display: grid;
  grid-template-columns: 1fr;
}
.SL_content {
    position: relative;
				margin-bottom: 80px;
  }
.SL_content:last-child {
				margin-bottom: 0px;
  }
@media screen and (max-width: 480px) {
.SL_content {
				margin-bottom: 50px;
  }
}


/* タイトル（大見出し） */
.SL_section-title {
		color: var(--color-title);
  font-size: 2rem;
  margin-bottom: 30px;
  position: relative;
		font-weight: bold;	
		display: flex;
		align-items:center;
		line-height: normal;
}
.SL_section-title._detail {
	border-left: 5px solid var(--color-border);
	padding-left: 20px;
}
@media screen and (max-width: 898px) {
.SL_section-title {
  font-size: 1.8rem;
  margin-bottom: 20px;
}
}
@media screen and (max-width: 480px) {
.SL_section-title {
  font-size: 1.3rem;
}
}


/* -------------------------------------------------

サイト内検索

------------------------------------------------- */
/* 大枠 */
.search-box {
  background-color: var(--color-card-bg);
  border-radius: 20px;
  border: 3px solid var(--color-frame);
  box-shadow: 4px 4px 0px 0px var(--color-frame);
		margin-bottom: 50px;
}
.search-box._p50 {
  padding: 50px;
}
@media screen and (max-width: 1400px) {
.search-box._p50 {
  padding: 40px 30px;
}
}
@media screen and (max-width: 1300px) {
.search-box._p50 {
  padding: 30px 20px;
}
}
@media screen and (max-width: 480px) {
.search-box {
		margin-bottom: 30px;
}
.search-box._p50 {
  padding: 10px !important;
}
}

/* Googleカスタム検索（Google用）
================================================== */
/* ========================================================
   PC版・スマホ版共通：.search-box の中でGoogle検索の横幅を100%にする
   （.search-box 自体のCSSコードには一切手を付けません）
   ======================================================== */
.search-box .gsc-control-cse,
.search-box .gsc-results-wrapper-visible,
.search-box .gsc-webResult,
.search-box table.gsc-search-box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}


/* ========================================================
   スマホ版（画面横幅767px以下）のみ：375px時のはみ出しを防ぐ
   ======================================================== */
@media screen and (max-width: 767px) {

    /* 1. Googleが自動生成する独自の左右パディングを0にして内側に収める */
    .search-box .gsc-control-cse,
    .search-box .gsc-results-wrapper-visible {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 2. 長いURLや英数字テキストを強制折り返し（375pxを突き抜けないようにする） */
    .search-box .gsc-webResult *,
    .search-box .gsc-webResult .gsc-url-top,
    .search-box .gsc-webResult .gs-bka-anchor-div {
        word-break: break-all !important;
        word-wrap: break-word !important;
        white-space: normal !important;
    }

    /* 3. 検索窓の入力エリア（インプットボックス）の最小幅の縛りを解除 */
    .search-box .gsc-input-box {
        min-width: 0 !important;
    }

    /* 4. ページネーション（下のページ番号リンク）の横はみ出しを防ぐ */
    .search-box .gsc-cursor-box {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 10px 0 !important;
        text-align: center !important;
    }

    /* 5. ページ番号のボタンサイズ・余白をスマホ用に最適化 */
    .search-box .gsc-cursor-box .gsc-cursor-page {
        padding: 4px 8px !important;
        margin: 2px !important;
        display: inline-block !important;
    }
}

/* すべての主要モダンブラウザ（Chrome, Safari, Edge, Firefoxなど）に対応 */
input.gsc-input::placeholder {
  color: #333333 !important;
  opacity: 1 !important; /* Firefoxなどのデフォルトの薄さをリセット */
}

/* 念のため古いブラウザやベンダープレフィックス用（不要な場合もありますが記述しておくと確実です） */
input.gsc-input::-webkit-input-placeholder {
  color: #333333 !important;
}
input.gsc-input::-moz-placeholder {
  color: #333333 !important;
  opacity: 1 !important;
}
input.gsc-input:-ms-input-placeholder {
  color: #333333 !important;
}
@media screen and (max-width: 480px) {
	input.gsc-input::-webkit-input-placeholder {
		font-size: 12px !important;
}
input.gsc-input::-moz-placeholder {
  font-size: 12px !important;
}
input.gsc-input:-ms-input-placeholder {
  font-size: 12px !important;
}
}