@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
*/

/* キャプションボックス内の余白を縮める */
.cap_box_ttl {
  padding: 10px 5px !important;
}
.cap_box_content {
  padding: 5px !important;
}
.cap_box_content .wp-block-image {
  margin-bottom: 10px !important; /* 画像と下の文章の間の距離 */
}

/** custom TOC+ */
#toc_container.paging_toc>ul>li {
	margin-left: 2ex;
}
#toc_container.paging_toc>ul>li.pageNo {
	margin-top: .5rem;
	margin-bottom: .5rem;
	margin-left: 0;
	border-bottom: 1px dashed #ccc;
	font-weight: bold;
	color: #f00;
}
#toc_container.paging_toc ul li.pageNo.currentpage .note  {
	font-size: 70%;
	font-weight: normal;
}


/* ページネーション全体のコンテナ */
#post_pagination {
    margin: 4em 0 2em;
    padding: 0;
    text-align: center;
}

/* 「次ページ > タイトル」の大きなボタン部分 */
.nextpage {
    margin-bottom: 1.5em;
}

.nextpage a.nextonly {
    display: block;
    padding: 1.5em;
    background-color: #f8f9fa; /* 薄い灰色 */
    color: #333;
    text-decoration: none;
    font-weight: bold;
    border: 1px solid #ddd;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.nextpage a.nextonly:hover {
    background-color: #bbbbbb; /* 先ほどのボタンに合わせた薄い灰色 */
    color: #fff;
    border-color: #999;
}

/* ページ番号（数字・矢印）の並び */
.pagenumber {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px; /* 数字同士の間隔 */
}

/* 数字と矢印の共通スタイル */
.pagenumber a, 
.current-post-page {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    text-decoration: none;
    border-radius: 2px;
    font-size: 14px;
    font-weight: bold;
}

/* リンクがある数字（通常時） */
.pagenumber a {
    background-color: #fff;
    color: #555;
    border: 1px solid #ddd;
    transition: all 0.2s;
}

.pagenumber a:hover {
    background-color: #bbbbbb;
    color: #fff;
}

/* 現在表示しているページの数字（current） */
.current-post-page {
    background-color: #555555; /* 濃い灰色（先ほどのボタンに合わせた系統） */
    color: #fff;
    border: 1px solid #555555;
    margin: 0; /* pタグのデフォルトマージンをリセット */
}

/* 前後矢印 (< >) の調整 */
.pagenumber a.prev,
.pagenumber a.next {
    background-color: #f0f0f0;
    font-family: serif; /* 矢印を綺麗に見せる */
}

/* スマホ表示での調整 */
@media (max-width: 767px) {
    .nextpage a.nextonly {
        font-size: 14px;
        padding: 1em;
    }
    .pagenumber a, 
    .current-post-page {
        width: 35px;
        height: 35px;
    }
}


/* Contact Form 7のレイアウト設定 */
.wpcf7-form label {
font-weight: bold;
}
/* フォームの下に余白 */
.wpcf7-form p {
margin-bottom: 30px;
}
/* フォームのカスタマイズ */
.wpcf7-text, .wpcf7-email, .wpcf7-tel, .wpcf7-textarea {
width: 100%;
background-color: #fff;
margin-top: 5px;
}
/* ラジオボタンの左の余白 */
.wpcf7-radio span {
margin-left: 0;
}
/* ボタンのカスタマイズ */
.wpcf7-submit, .wpcf7-previous {
display: inline-block;
width: 240px;
padding: 1.2em 1em;
border-radius: 50px;
background: #114000;/* ここにメインカラー */
font-size: 16px;
font-weight: 700;
letter-spacing: 0.2em;
line-height: 1;
color: #fff!important;
}
/* 必須マーク */
.required {
color: #fff;
background: #D53633;/* ここにメインカラー */
font-size: 0.8em;
padding: 0.3em;
border-radius: 0.5em;
}

/***** 入力ボックスのレイアウト *****/
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 select,
.wpcf7 textarea {
    border-radius: 8px; /* 角の丸み（数値を大きくするとより丸くなります） */
    padding: 12px;      /* 入力しやすくするための内側の余白 */
    border: 1px solid #ccc; /* 枠線を少しはっきりさせる（お好みで） */
    background: #FFF;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus {
    outline: none;
    border-color: #888; /* フォーカス時の枠線の色 */
}

/***** チェックボックス・ラジオボタンのレイアウト *****/
span.wpcf7-radio,
span.wpcf7-checkbox {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 20px;
    margin-top: 5px !important;
}
.wpcf7-radio .wpcf7-list-item,
.wpcf7-checkbox .wpcf7-list-item {
    margin: 0 !important;
}
.wpcf7-radio .wpcf7-list-item label,
.wpcf7-checkbox .wpcf7-list-item label {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 15px 16px;
    background-color: #f9fafc;
    border: 1px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.2s ease;
    box-sizing: border-box;
}
.wpcf7-radio input[type="radio"],
.wpcf7-checkbox input[type="checkbox"] {
    accent-color: var(--color_main); /* SWELLメインカラー */
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
}
.wpcf7-radio .wpcf7-list-item-label,
.wpcf7-checkbox .wpcf7-list-item-label {
    margin-left: 10px;
    font-size: 16px;
    line-height: 1.4;
}
.wpcf7-radio .wpcf7-list-item label:hover,
.wpcf7-checkbox .wpcf7-list-item label:hover {
    background-color: #eef4fb;
    border-color: #ddd;
}
@media (max-width: 600px) {
    span.wpcf7-checkbox {
        grid-template-columns: 1fr;
    }
}

/***** プライバシーポリシーへのリンク *****/
.form-privacy {
  margin-bottom: 1.5em;
  font-size: 1.0rem;
  font-weight: bold;
  text-align: left;
}
.form-privacy a {
  color: var(--main-color, #0066cc);
  text-decoration: underline;
}