/*
Theme Name: arrowlinks
Theme URI: 
Author: arrowlinks
Author URI: 
Description: 2022
Version: 
License: 
License URI: 
Tags: 
Text Domain: 
*/

@charset "utf-8";

html, body, div, span, 
h1, h2, h3, h4, h5, h6, 
p, em, strong, 
ul, ol, li, dl, dt, dd, 
table, th, td {
	margin:				0px;
	padding:			0px;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Zen Maru Gothic','Noto Sans JP','ヒラギノ角ゴ ProN',
                 'Hiragino Kaku Gothic ProN','游ゴシック Medium',
                 'Yu Gothic Medium','游ゴシック', YuGothic,
                 'メイリオ', Meiryo, sans-serif;
    font-style: normal;
    font-weight: normal;
    line-height: 1.7em;
    text-align: left;
    color: #4a4a4a;
    word-wrap: break-word;
    overflow-x: hidden;
    background: #fbfbfb;
}


h6,
h5,
h4,
h3,
h2,
h1 {
	margin:				0px;
	padding:			0px;
	font-size:			100%;
	font-weight:		normal;
	text-align:			left;
	line-height:		100%;
}

a:hover img {
	opacity:			0.8;
}

.txt_center {
	text-align:			center;
}

.txt_right {
	text-align:			right;
}

.txt_left {
	text-align:			left;
}

.box_left {
	float:				left;
}

.box_right {
	float:				right;
}

body {
    overflow-x: hidden;
}

#wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
    padding-top: 80px;
}

footer {
    width: 100%;
    text-align: center;
    margin-top: auto;
}

/* ==================================================
   home
================================================== */
/* スライド全体 */
.slider-inner {
  max-width: 1100px;
  margin: 0 auto;
  position: relative;

  transform: scale(0.6);
  transform-origin: top center;

  margin-top: 0;       /* ← できれば消す */
  margin-bottom: 0;
}

/* swiper */
.pickup-slider .swiper {
  width: 100%;
  padding-left: 7%;
  padding-right: 7%;
  box-sizing: border-box;
  overflow: visible;
}

.pickup-slider .swiper-wrapper {
  align-items: stretch;
}

/* スライドサイズ */
.pickup-slider .swiper-slide {
  width: 1150px;
}

/* ナビボタン */
.pickup-slider .swiper-button-prev,
.pickup-slider .swiper-button-next {
  position: absolute;
  top: 40%;
  z-index: 10;
  width: 50px;
  height: 50px;
  background: rgba(255,255,255,0.8);
  border-radius: 50%;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}



/* 左右位置 */
.pickup-slider .swiper-button-prev {
  left: 180px;
}

.pickup-slider .swiper-button-next {
  right: 170px;
}

/* 矢印 */
.pickup-slider .swiper-button-prev::after,
.pickup-slider .swiper-button-next::after {
  font-size: 30px;
  color: #4a4a4a;
}


/* リンク */
.swiper-slide a {
    text-decoration: none;
}

/* 画像エリア */
.pickup-thumb {
  position: relative;
  width: 100%;
  /* aspect-ratio: 16 / 9; */
  overflow: hidden;
}

.pickup-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;   /* ★横は絶対切れない */
  object-position: center;
  display: block;
}
/* 画像 */

.pickup-item {
  display: block;
  margin: 0 auto;
}

.swiper-pagination {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  justify-content: center;
}

.pickup-slider .swiper-horizontal > .swiper-pagination {
  position: absolute !important;
  bottom: 80px !important;   /* ← 高さはここで調整 */
  left: 0 !important;
  right: 0 !important;
  width: fit-content !important;
  margin: 0 auto !important;
  transform: none !important;
  z-index: 30;
}


/* 通常のドット */
.pickup-slider .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  margin: 12px !important;
  background: #484442;
  opacity: 1;
  position: relative;
}


.swiper-slide {
  display: block; /* flexは消す */
  width: auto;    /* Swiperが幅計算できるように */
}

.pickup-slider .swiper-pagination-bullet-active {
  background: #484442; /* 中の色はあとで上書き */
}

/* 外側のリング */
.pickup-slider .swiper-pagination-bullet-active::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 22px;
  height: 22px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 2px solid currentColor;
}


body[data-slide="red"] .swiper-pagination-bullet-active {
  color: #d75653;       /* ← これがリングの色になる */
  background: #d75653;  /* ← 中の● */
}

body[data-slide="yellow"] .swiper-pagination-bullet-active {
  color: #e9940e;
  background: #e9940e;
}

body[data-slide="green"] .swiper-pagination-bullet-active {
  color: #52894c;
  background: #52894c;
}

body[data-slide="blue"] .swiper-pagination-bullet-active {
  color: #2370b2;
  background: #2370b2;
}

/* タイトルは画像の下 */
.pickup-title {
    font-size: 24px;
    line-height: 1.5;
    color: #4a4a4a;
    padding: 1%;
    font-weight: bold;

  overflow: hidden;   
}

.archive-link {
    text-align: center;
    margin-top: 5%;
    margin-bottom: 5%;
}

.archive-button {
    display: inline-block;
    padding: 18px 35px;
    background: #4a4a4a;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    border-radius: 60px;
    transition: 0.3s;
}

.archive-button:hover {
    opacity: 0.8;
    background: #2370b2;

}

.slider-description {
  border: 1px solid #999;
  background: #fff;
    max-width: 930px;
    margin: 0 auto;
    padding: 1%;
    gap: 48px;

}

.slider-description-inner {
  display: flex;
  align-items: center;
  gap: 40px;
}

.slider-description-logo img {
  max-width: 150px;
  height: auto;
}

.slider-description-logo {
  flex: 1;   /* ← 数字を大きくすると広がる */
  text-align: center;
}

.slider-description-text {
  flex: 8;
}

/* ==================================================
   記事一覧
================================================== */


.interview{
    text-align: center;
}

.home {
    width: 100%;
    background: #fbfbfb;
}

.home-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 40px 20px;
    gap: 48px;
}

.home-content {
    max-width: 1100px;
    margin: 0 auto;
    flex: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

/* 投稿1件（カード） */
.news_content_box {
    margin: 2%;
    overflow: hidden;
    background: #fff;
    transition: transform 0.2s, background-color 0.3s; /* 背景色も滑らかに */
}

.news_content_box:hover {
    /* background-color: #f5f5f5;    */
    transform: translateY(-5px);
}

/* サムネイル */
.news_thumb {
    width: 100%;
    /*aspect-ratio: 16 / 9;*/
    overflow: hidden;
    transition: transform 0.2s, background-color 0.3s; /* 背景色も滑らかに */
    background: #fff;

}

.news_thumb:hover {
    /* background-color: #f5f5f5;   薄いグレー */
}


.news_thumb img {
    width: 100%;
    height: 100%;

}

/* テキスト */
.news_body {
    padding: 16px;
    height: 200px;
    background: #fff;
    display: flex;
    flex-direction: column;
    flex: 1;  
    padding-bottom: 2%;
}

.post-date {
    font-size: 18px;
    color: #4a4a4a;
    /*margin-bottom: 6px;*/
    font-weight: bold;
}

.news_title {
    font-size: 15px;
    font-weight: bold;
    line-height: 1.6;
    min-height: 3em;
}

.news_title a {
    color: #4a4a4a;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 3em;   /* ← （1.5 × 2行） */
}

.news_item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}


/* ページネーション */

.profile-sns {
    list-style: none;
    display: flex;
}

.profile-sns li {
    margin: 1%;
}

/* ================================
   詳細ページ
================================ */

#single {
    max-width: 1200px;
    margin: 0 auto;
    margin-top: 1%;
}

.single-title {
    font-size: 32px;
    line-height: 1.4;
    margin-bottom: 10px;
    font-weight: bold;

}

.single-meta {
    font-size: 13px;
    color: #888;
    margin-bottom: 40px;
}

.single-content {
    font-size: 18px;
    line-height: 1.9;
}

.single-content p {
    margin-bottom: 1.6em;
}

.wp-block-image {
    margin: 0%;
    margin-top: 1%;
    margin-bottom: 1%;
}

.post-article {
    max-width: 620px;
    margin: 0 auto; /* 中央寄せ */
    padding-top: 1%;
    line-height: 1.8;
    color: #4a4a4a;
}

.single-eyecatch {
    width: 100%;
    max-width: 1000px;
    margin: 30px auto;
}

.single-eyecatch img {
    width: 100%;
    height: auto;
    display: block;
}


.single-date {
    font-size: 14px;
    color: #999;
    margin-bottom: 30px;
}

.single-content p {
    margin-bottom: 1.6em;
}

.single-content img {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto 30px;
}

.single-content blockquote {
    border-left: 4px solid #ccc;
    padding-left: 15px;
    color: #666;
    margin: 20px 0;
    font-style: italic;
}

.wp-block-heading{
    font-weight: bold;
    font-size: 24px;
    line-height: 1.4;

}

.single-tags {
    font-size: 18px;
    font-family:'Zen Maru Gothic';
    padding: 1%;
    border: 1px solid #c9c9c9;

}

.title_box h1 {
    text-align: center;
    font-size: 45px;
    color:#4a4a4a ;
    line-height: 1.5;
}

.hometitle_box h1 {
    text-align: center;
    font-size: 45px;
    color:#4a4a4a ;
    line-height: 1.5;
}

.single-tags span {
    font-family:'Zen Maru Gothic';
    text-decoration: none;
    font-size: 18px;
    color: #676767;           /* note っぽい青 */
    margin-right: 8px;
    padding: 1px 3px;
    margin-right: 5px;
}

.single-tags a:hover {
    background-color: #e0e0e0; /* マウスオーバーで色変化 */
}


.post-tags {
    font-size: 14px;
    font-family:'Zen Maru Gothic';
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; /* 左から並べる */
    margin-top: auto;
}

.post-tags .post-tag {
  font-family: 'Zen Maru Gothic';
  font-size: 14px;
  color: #676767;
  padding: 1px 3px;
  font-weight: normal;
  white-space: nowrap;
}

.post-tags span {
    font-family:'Zen Maru Gothic';
    text-decoration: none;
    font-size: 14px;
    color: #676767;           /* note っぽい青 */
    margin-right: 8px;
    padding: 1px 3px;
    margin-right: 5px;
    font-weight: normal;

}

.post-tags a:hover {
    background-color: #e0e0e0; /* マウスオーバーで色変化 */
}

/* ページ上部タグ見出し */



/* タグ */
#tag-archive .content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 1100px;
    margin: 0 auto;
}

#tag-archive .news_content_box {
    width: 30%;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.2s;
}

#tag-archive .news_content_box:hover {
    transform: translateY(-5px);
}


#tag-archive .news_title {
    font-size: 15px;
    font-weight: bold;
    line-height: 1.4;
    margin: 8px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

#tag-archive .news_content_box a,
#tag-archive .news_content_box a:hover {
    color: #000;
    text-decoration: none;
}

/* 前後の記事 */
.prev-next-box{
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
}

.prev-next-wrapper {
  display: flex;
  max-width: 1000px;
  margin: 0 auto;
  border: 1px solid #5a5958;
  margin-bottom: 8%;
}

.prev-next-item {
  flex: 1;
  padding: 40px 60px;
  text-decoration: none;
  font-size: 18px;
  color: #4a4a4a;
  position: relative;
}

.prev-next-item + .prev-next-item {
  border-left: 1px solid #ccc;
}

.prev-next-item .label {
  display: block;
  font-size: 18px;
  color: #4a4a4a;
  margin-bottom: 6px;
}

.prev-next-item .title {
  font-size: 20px;
  line-height: 1.5;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;

  overflow: hidden;
  text-overflow: ellipsis;
}

/* 矢印 */
.prev-next-item.prev::before {
  content: "‹";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 30px;
  color: #666;
}

.prev-next-item.next::after {
  content: "›";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 30px;
  color: #666;
}

/* おすすめ記事 */
.recommend-posts {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-weight: 700;
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px;
}

.recommend-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}

.recommend-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.recommend-item img {
    width: 100%;
    border-radius: 8px;
}

.recommend-item-title {
    font-size: 15px;
    margin-top: 8px;
    line-height: 1.4;
}


/* 投稿一覧 */
.articles .content {
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 auto;
    max-width: 1200px;
}

.articles .news_content_box {
    overflow: hidden;
    transition: transform 0.2s;
    background-color: white;
}

.articles .news_content_box:hover {
    transform: translateY(-5px);
}

.articles .news_title {
    font-size: 15px;
    font-weight: bold;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 3em;
    color: #4a4a4a;
}

.articles .news_content_box a,
.articles .news_content_box a:hover {
    color: #4a4a4a;
    text-decoration: none;
}

/* 記事一覧レイアウト（3列） */
.content {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    background: #efefef;
    padding: 1%;
}

/* ページネーション */
.pagination {
  display: flex;
  gap: 20px;
  justify-content: center; /* 横方向中央揃え */
    grid-column: 1 / -1; /* 3カラムをまたぐ */
    margin-bottom: 40px;
    margin-top: 40px;
    text-align: center;

}

/* 共通スタイル（数字リンク & 現在ページ） */
.pagination a,
.pagination span.current {
  display: inline-block;
  width: 48px;
  height: 48px;
  line-height: 43px;
  text-align: center;
  font-size: 16px;
  border: 1px solid #5a5958; /* ★初期枠色 */
  border-radius: 50%;         /* 丸ボタン */
  text-decoration: none;
  color: #5a5958;             /* ★初期文字色 */
  transition: all 0.2s;
  background: #fff;            /* 背景白 */
}

/* 現在ページ（current） */
.pagination span.current {
  color: #fff;               /* 数字の色 */
  background-color: currentColor; /* 枠色と合わせたい場合は後で調整 */
}

/* ホバー時の色 */
.pagination a.page-1:hover { background: #d75653; border-color: #d75653; color: #fff; }
.pagination a.page-2:hover { background: #e9940e; border-color: #e9940e; color: #fff; }
.pagination a.page-3:hover { background: #52894c; border-color: #52894c; color: #fff; }
.pagination a.page-4:hover { background: #2370b2; border-color: #2370b2; color: #fff; }
.pagination a.page-5:hover { background: #d75653; border-color: #d75653; color: #fff; }

/* 現在ページにいるときも色を反映 */
.pagination span.current.page-1 { background: #d75653; border-color: #d75653; }
.pagination span.current.page-2 { background: #e9940e; border-color: #e9940e; }
.pagination span.current.page-3 { background: #52894c; border-color: #52894c; }
.pagination span.current.page-4 { background: #2370b2; border-color: #2370b2; }
.pagination span.current.page-5 { background: #d75653; border-color: #d75653; }

/* 前へ／次へボタン */
.pagination a.prev,
.pagination a.next {
  border: 1px solid #5a5958;
  color: #5a5958;
  border-radius: 50%;
}

.pagination a.prev:hover,
.pagination a.next:hover {
  background: #5a5958;
  color: #fff;
  text-align: center;
}




/* ================================ 
アーカイブ 
================================ */

/* アーカイブ全体 */
.articles {
    display: flex;
    flex-direction: column;
    position: relative;
    margin-top: 5%;
    flex: 1;
}


/* タイトル */
.archive-title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 24px;
}

/* リスト */
.archive-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 1行ずつ */
.archive-list li {
    padding: 14px 0;
    border-bottom: 1px solid #eee;
    font-size: 16px;
}

/* リンク */
.archive-list li a {
    color: #222;
    text-decoration: none;
    font-weight: 500;
}

/* 件数（(12) の部分） */
.archive-list li {
    color: #777;
}

/* ホバー（noteっぽく控えめ） */
.archive-list li a:hover {
    text-decoration: underline;
}


/* ================================ 
となえぴについて.お問合せ 共通
================================ */
.page-about  {
    margin-top: 5%; 
    padding-bottom: 5%;
}

.page-about main {
    padding-top: 0; 
}

.tonaepi-section {
    font-family: 'Zen Maru Gothic', sans-serif;
    margin: 0 auto;
    padding: 2%;  
}

.tonaepi-section h1 {
    text-align: center;
    font-size: 45px;
    color:#4a4a4a ;
    line-height: 1.5;
}

.tonaepi-section h2 {
    text-align: center;
    padding-top: 0;
    font-size: 30px;
    color:#2370b2 ;
    line-height: 1.5;
    margin-bottom: 24px;
}

.tonaepi-section p {
    text-align: center;
    font-size: 18px;
    line-height: 1.5;
    color:#4a4a4a ;

}

.tonaepi-about-text p{
    margin-bottom: 1%;
}


/* ================================ 
お問合せ 
================================ */
.form{
    max-width: 600px;
    margin: 0 auto;
}

/* 入力画面：確認用テキストを非表示 */
.mw_wp_form_input .form-text-confirm {
  display: none;
}

/* 確認画面：入力用テキストを非表示 */
.mw_wp_form_confirm .form-text-input {
  display: none;
}

/* 送信完了画面：両方非表示 */
.mw_wp_form_complete .form-text-input,
.mw_wp_form_complete .form-text-confirm {
  display: none;
}

.tonaepi-contact{
    background-color: greenyellow;

}

.form-title{
    text-align: center;    
}

.contact {
    flex: 1;  /* これがフッターを画面下に押し下げる */
}

.contact-form{
    max-width: 800px;
    margin: 0 auto;
    padding: 1%;
    background-color: green;
}

.mine{
    max-width: 1100px;
    margin: 0 auto;
}

.name{
    font-size: large;
    margin-top: 5%;
}

.red{
    color: red;
}

/* MW WP Formの送信ボタン */
input[type="submit"] {
    background-color: #4a4a4a;  /* ボタンの背景色 */
    color: #ffffff;             /* 文字色 */
    font-size: 16px;            /* 文字サイズ */
    padding: 12px 30px;         /* 上下左右の余白 */
    border: none;               /* 枠線なし */
    border-radius: 30px;         /* 角丸 */
    cursor: pointer;            /* ホバーで手の形に */
    transition: 0.3s;           /* ホバーアニメーション */
    margin-bottom: 5%;
}

/* ホバー時のデザイン */
input[type="submit"]:hover {
    background-color: #2370b2;  /* ホバー時の背景色 */
    color: #ffffff;             /* 文字色 */

}

/* 入力欄全体の横幅と高さを統一 */
input[type="text"],
input[type="email"],
textarea {
    width: 100%;          /* 親の幅いっぱいに */
    /* max-width: 500px;      最大幅を指定すると整いやすい  */
    height: 50px;         /* 高さを統一 */
    padding: 10px;        /* 内側の余白 */
    font-size: 16px;      /* 文字サイズ */
    border: 1px solid #ccc; /* 枠線 */
    box-sizing: border-box; /* padding込みでサイズ固定 */
}

/* お問合せ内容だけ高さを大きくしたい場合 */
textarea {
    height: 180px;         /* 高さだけ大きく */
    resize: vertical;      /* ユーザーが縦にサイズ変更可能 */
}

.form_table {
    margin: 0 auto;
    margin-top: 5%;
}


/* レスポンシブ対応 */
/* ---------------------------------------------------------------- */
body {
	-webkit-text-size-adjust:	100%;
}

img {
	max-width:			100%;
	height:				auto;
	width /***/:		auto;
}

/* clearfix */
/* ================================================================ */
.clearfix:after {
	content:	"";
	display:	block;
	clear:		both;
}

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

.wrapper {
	width:		100%;
	padding:	0px;
}

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

/* ---------------------------------------------------------------- */
/* --- ヘッダー全体 --- */

/* ヘッダーを画面上部に固定 */
header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px; /* 必要なら後で auto / 100px に変更可 */
    z-index: 1000;
}

#header_menu_pc {
    background-color: #ced1d3; /* グレー */
    padding: 15px 0;
}

/* ヘッダー内レイアウト */
.h_inner {
    width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ---------------------------------------------------------------- */
/* 左右メニュー共通 */

.menu_left_pc {
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.menu_right_pc {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* 右メニューだけ */
.menu_right_pc {
    flex-wrap: nowrap;      /* 折り返し防止 */
}

/* ---------------------------------------------------------------- */
/* ロゴ */

.menu_left_pc li img {
    height: 35px;
    display: block;
}

/* ---------------------------------------------------------------- */
/* メニュー */

.menu_right_pc li {
    position: relative;
    margin-left: 20px;
}

/* リンク本体（アイコン＋文字） */
.menu_right_pc li a {
    display: inline-flex;       /* ← 重要 */
    align-items: center;
    gap: 5px;
    white-space: nowrap;        /* ← 改行防止 */
    color: #4a4a4a;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    transition: color 0.3s;
}

/* メニュー間の「｜」 */
.menu_right_pc li:not(:last-child)::after {
    content: "|";
    color: #4a4a4a;
    margin-left: 20px;
    font-size: 35px;
   
}

/* ---------------------------------------------------------------- */
/* SVGアイコン */

.title_img {
    display: flex;
    align-items: center;
}

.menu_right_pc li a .title_img img {
    width: 20px;
    height: auto;
    display: block;
    transition: filter 0.3s;
}

/* ---------------------------------------------------------------- */
/* ホバー・カレント */

.menu_right_pc li a:hover,
.menu_right_pc li a.current-menu-item {
    color: #2370b2;
}

.menu_right_pc li a:hover .title_img img,
.menu_right_pc li a.current-menu-item .title_img img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(64%) saturate(373%) hue-rotate(180deg);
}


/* ---------------------------------------------------------------- */
/* --- title共通 --- */

.tag-title {
    font-size: 16px;
    font-weight: bold;
    max-width: 1100px;
    margin-top: 1%;
    margin-bottom: 1%;
    color: #333;

}

.title_box {
  display: flex;
  align-items: center;
  justify-content: center; /* ← 横方向中央 */
  gap: 12px;
  margin-bottom: 4%;
}

.hometitle_box {
  display: flex;
  align-items: center;
  justify-content: center; /* ← 横方向中央 */
  gap: 12px;
  margin-top: 3%;
  margin-bottom: 2%;
}

.title_img img {
  width: 65px;
  height: auto;
  display: block;
  flex-shrink: 0;
}

.title_img_b img {
  width: 65px;
  height: auto;
  display: block;
  flex-shrink: 0;
}

.title_img_c img {
  width: 65px;
  height: auto;
  display: block;
  flex-shrink: 0;
}

.hometitle_box,
.title_box,
.title_img,
.title_img_b,
.title_img_c {
  max-width: 100%;
  overflow: hidden;
}


/* ---------------------------------------------------------------- */
/* --- footerー全体 --- */

#footer_menu_pc {
    background-color: #ced1d3; /* グレー */
    padding-top: 2%;
    padding-bottom: 2%;
}
.f_inner {
    align-items: center;
    justify-content: space-between;
    padding: 10px;
}

.f_inner img{
    width:          100%;
    max-width:      185px;
}

/* --- ロゴ --- */
.fooer_left_pc li img {
    height: 50px;
}

/* --- メニュー --- */
.footer_right_pc {
    display: flex;
    list-style: none;
    width: 550px;
    margin: 0 auto;
    /*padding: 1%;*/
}
.footer_right_pc li {
    position: relative;  /* 擬似要素用 */
    margin-left: 26px;
}
.footer_right_pc li a {
    color: #4a4a4a;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s;
    font-size: 20px;
}
.footer_right_pc li a:hover,
.footer_right_pc li a.current-menu-item {
    color: #2370b2; /* 黄色 */
}

/* --- メニュー間の「｜」 --- */
.footer_right_pc li:not(:last-child)::after {
    content: "|";
    color: #4a4a4a;
    font-weight: 2px;
    margin-left: 20px;
    font-size: x-large;
}

.footer_left_pc{
    list-style: none;
}


/* ---------------------------------------------------------------- */
#copyright {
	font-size:			80%;
}

#page_lift {
	position:			fixed;
	box-sizing:			border-box;
	bottom:				5%;
	width:				100%;
	padding:			0 5%;
	text-align:			right;
}

#page_lift a {
	opacity:			0.8;
	text-decoration:	none;
}
#page_lift a:hover {
	opacity:			1.0;
}

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

.contents {
	box-sizing:				border-box;
	width:					100%;
}

.form-buttons {
  display: flex;
  justify-content: center;
  gap: 20px; /* ボタンの間隔 */
  margin-top: 20px;
}

.form-buttons input,
.form-buttons button {
  min-width: 160px;
}



/* ================================
   スマホ
================================ */
@media screen and (max-width: 1500px) {
    /* ページネーション位置はそのまま */
    .swiper-pagination {
        bottom: 20px;
    }
}


@media screen and (max-width: 1680px) {
    /* ページネーション位置はそのまま */
    .swiper-pagination {
        bottom: 20px;
    } 
}

@media screen and (max-width: 1220px) {

       /* ヘッダー内レイアウト */
    .h_inner {
        width: 100%;
        display: block;
    }

       /* メニュー側 */
    .menu_right_pc {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 16px;
        padding: 0;
        margin: 0;
        padding-top: 2%;
        padding-bottom: 2%;
        background: #fff;
    }

    .menu_right_pc li {
        list-style: none;
    }

    .menu_right_pc li a .title_img img {
        width: 20px;

    }

    .menu_left_pc img  {
        height: 35px;
        margin: 0 auto;
    }

    #header_menu_pc {
        background-color:transparent; 
    }

    .menu_left_pc {
        background: #ced1d3;
        padding: 2%;
    
    }  

    #header_menu_pc {
        padding: 0;
        margin-bottom: 2%;
    }


    
    .post-article {
        margin-top: 10%;
    }

    .title_box {
        margin-top: 8%;
    }

    /* リンク本体（アイコン＋文字） */
    .menu_right_pc li a {
        font-size: 20px;
    }
  
    .menu_right_pc li {
        margin-left: 0px;
    }

    .menu_right_pc li:not(:last-child)::after {
        margin-left: 10px;
   
    }

    .footer_right_pc li:not(:last-child)::after {
    margin-left: 26px;
    }
}

@media (max-width: 1150px) {
    .pickup-slider .swiper-slide {
        width: 100%;
    }

     .pickup-slider .swiper {
        padding-left: 2%;
        padding-right: 2%;
    }
    .pickup-slider {
        padding-top: 15%; /* ← 余白はこっちで作る */
    }


}

@media all and (max-width: 1000px) {

	#header_menu_sp {
	    display:			block;
	}

	#menu {
	    display:			none;
	    width:				100%;
    }

	#menu > a {
		width:				100%;
		padding:			10px 0;
		text-align:			center;
	}

	#sns {
		display:			none;
	}

	#sns_sp {
		display:			block;
	}

    .hometitle_box {
        margin-top: 10%;
    }

    .articles {
        margin-top: 10%;
    }

    .page-about  {
        margin-top: 10%;  

    }
}

@media screen and (max-width: 850px) {
    /* 全体：縦並び */
    .home-wrap {
        flex-direction: column;
        padding: 0;
        gap: 32px;
    }

    /* プロフィール：一番上 */
    .home-profile {
        width: 100%;
        position: static;
        order: 1;
    }

    /* 投稿一覧：1列 */
    .home-content {
        order: 2;
        display: block; /* ← gridを解除 */
    }

    /* 投稿1件：note風リスト */
    .news_content_box {
        border: none;
        border-bottom: 1px solid #eee;
        border-radius: 0;
        box-shadow: none;
        border: 1px solid #000000;
    }

    .news_content_box:hover {
        transform: none;
        box-shadow: none;
    }

    /* サムネを上に */
    .news_thumb {
        width: 100%;
        margin-bottom: 12px;
    }

    /* テキスト */
    .post-date {
        font-weight: bold;
    }

    .news_title {
        font-size: 15px;
        line-height: 1.7;
    }

    #archive .content {
        display: block;
        padding: 0 16px;
    }

    .content {
        display: block;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
    }

    .single-tags span {
        font-size: 14px;
    }



}

@media screen and (max-width: 800px) {

    .slider-inner {
        transform: scale(0.8);   /* ← ここで縮小 */
        margin-top: 0;
    }

    .pickup-slider {
        padding-top: 20%; /* ← 余白はこっちで作る */
    }

    .title_box {
        margin-top: 15%;
    }

    .menu_right_pc li a {
        font-size: 18px;
    }

  .news_content_box {
        margin-bottom: 28px;
        border: none;
        margin-top: 27px;
    }
    
  /* サムネイル */
  .news_thumb {
        margin-bottom: 0;
    }

  .news_thumb img {
        width: 100%;
        height: auto;
        display: block;
    }

  /* タイトル */
  .news_title {
        font-size: 15px;
        font-weight: 700;
        line-height: 1.5;
        margin: 0;
        color: #222;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    #tag-archive .news_content_box {
        width: 100%;
    }


    /* ロゴ側 */
    .menu_left_pc {
        width: 100%;
        display: flex;
        justify-content: center;
        padding: 0;
        padding-top: 4%;
        padding-bottom: 4%;
    }

    .menu_left_pc li {
        list-style: none;
    }

    .menu_left_pc img {
        margin: 0 auto;
        height: auto;
    }

    .menu_left_pc li img {
        padding: 2%;
    }

    /* メニュー側 */
    .menu_right_pc {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 0;
    margin: 0;
    padding-top: 2%;
    padding-bottom: 2%;
    }

    .menu_right_pc li {
    list-style: none;
    }

    .menu_right_pc li a .title_img img {
    width: 20px;

    }

    .menu_right_pc li {
    margin: 0;
    }

    .prev-next-item {
    padding: 20px 30px;
   }

    .articles {
    margin-top: 15%;
    }

    .page-about  {
    margin-top: 15%;  
   }

    .single-title {
    font-size: 26px;

    }
    .news_body {
        padding-top: 0;
        padding-left: 5%;
        padding-right: 5%;
        /*margin-bottom: 3%;*/
    }


    .slider-description-home {
    margin-top: -9%;
    }
    .pickup-title {
    font-size: 18px;
    padding: 0;
    } 
}

@media (max-width: 768px) {

    .slider-description {
        margin-left: 1%;
        margin-right: 1%;

    }

    .slider-description-inner {
        flex-direction: column;
        text-align: center;
    }

    .slider-description-inner {
        gap: 0px;
    }

    .slider-description-logo img {
    max-width: 100px;
    }

    .slider-description-text {
    font-size: 12px;
    line-height: 1.5;
    }



  
}

@media screen and (max-width: 700px) {  

    .footer_right_pc {
        display: flex;
        flex-direction: row;      /* ← 横並び */
        justify-content: center;  /* ← 中央寄せ */
        align-items: center;
        width: 100%;
        padding: 0;
    }

    .footer_right_pc li {
        margin: 0 8px; /* 左右に余白 */
    }

    /* 区切り線を残したい場合 */
    .footer_right_pc li:not(:last-child)::after {
        content: "|";
        margin-left: 14px;
    }

    .footer_right_pc li a {
        font-size: 14px; /* スマホ用に少し小さく */
    }

    .title_box h1 {
        font-size: 30px;
    }

    .tonaepi-section h2 {
        font-size: 25px;

    }

    .hometitle_box h1 {
        font-size: 30px;
    }

    .title_img img {
        width: 50px;
    }


     .title_img img {
    width: 40px;
    }

    .title_img_b img {
    width: 40px;
    }

    .title_img_c img {
    width: 40px;
    }

    .post-tags {
    margin-bottom: 10%;

    }
    
}

@media all and (max-width: 650px) {	/* 以下 */
    #single {  
        margin-left: 4%;
        margin-right: 4%;
    }    
}

@media all and (max-width: 550px) {	/* 以下 */

    /* ヘッダーメニュー */
    .menu_right_pc {
        flex-wrap: wrap;          /* ← 折り返しOKにする */
        justify-content: center;
        gap: 10px;                /* ← 余白を縮める */
    }

    .menu_right_pc li a {
        font-size: 13px;          /* ← 文字を小さく */
        white-space: nowrap;      /* ← 変な改行防止 */
    }

    /* ロゴも少しだけ縮小 */
    .menu_left_pc li img {
        height: 30px;
        padding: 1%
    }

    .tonaepi-section {
    margin-top: 5%;
    margin-bottom: 3%;
    }

    .menu_right_pc li:not(:last-child)::after {
    font-size: 25px;
   
    }

    .post-article{
        margin-top: 0;
    }  

    .slider-inner{
        margin-top: 10%;

    }
    

}

@media all and (max-width: 500px) {	/* 以下 */

	#header {
		padding:			0 0 10px 0;
	}

	#menu h1 {
		width:				100%;
		padding:			0;
		margin:				0 0 10px;
		text-align:			center;
	}

	#menu {
		float:				none;
		margin-bottom:		10px;
		text-align:			center;
	}

	#sns {
		float:				none;
		padding-right:		0;
		text-align:			center;
    }


    /* ヘッダーメニュー */
    .menu_right_pc {
        flex-wrap: wrap;          /* ← 折り返しOKにする */
        justify-content: center;
        gap: 10px;                /* ← 余白を縮める */
    }

    .menu_right_pc li a {
        font-size: 13px;          /* ← 文字を小さく */
        white-space: nowrap;      /* ← 変な改行防止 */
    }

    /* ロゴも少しだけ縮小 */
    .menu_left_pc li img {
        height: 30px;
        padding: 1%
    }

    .tonaepi-section {
    margin-top: 5%;
    margin-bottom: 3%;
    }

    .f_inner{
        padding: 0;
    }

    .f_inner img{
        max-width: 150px;
    }

    #footer_menu_pc{
        padding:5% 0;
    }

    .tonaepi-section p,
    .tonaepi-section h2
    {
        text-align: left;
    }


}

@media screen and (max-width: 430px) {

    .menu_right_pc {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;      /* ← 絶対に折り返さない */
        gap: 8px;               /* ← 間隔を最小限に */
    }

    .menu_right_pc li {
        margin: 0;
    }

    .menu_right_pc li a {
        font-size: 11px;        /* ← 小さくてOKならここが最重要 */
        white-space: nowrap;   /* ← 文字の改行を防ぐ */
        padding: 0;
        align-items: center;   /* ← 縦ズレ解消 */
        gap: 4px;              /* アイコンと文字の間 */
        line-height:revert-layer;
    }

    .menu_right_pc li a .title_img img {
    width: 15px;

    }
    
    .footer_right_pc li a {
        font-size: 12px; /* スマホ用に少し小さく */
    }

  .form-buttons {
    gap: 5px; /* ボタンの間隔 */

    }
    .title_box h1 {
        font-size: 25px;
    }
}

.kesen{
    text-align: right;
    display: block;
}


/*260326*/
:root{
  --header-h: 80px;
}

/* 先頭の不要な縦余白を削る */
.home .pickup-slider{
  padding-top: calc(var(--header-h) + 8px);
  padding-bottom: 0;
  overflow: hidden;
}

@media screen and (max-width: 1220px) {
    .home .pickup-slider{
        padding-top: calc(var(--header-h) + 100px);
    }
}

@media screen and (max-width: 900px) {
    .home .pickup-slider{
        padding-top: calc(var(--header-h) + 70px);
    }
}

@media screen and (max-width: 500px) {
    .home .pickup-slider{
        padding-top: calc(var(--header-h) + 50px);
    }
}

/* スライド自体を小さく作る */
.home .pickup-slider .swiper-slide{
  width: 100%;
  max-width: 660px;
}

/* 画像エリアを低くする */
.home .pickup-thumb{
  min-height: 220px;
}

/* 下のテキストも小さめ */
.home .pickup-slider p{
  font-size: 13px;
  line-height: 1.5;
}


/* ロゴ説明との間 */
.slider-description-home{
  margin-top: 12px;
}

.slider-description{
  padding: 14px 18px;
}

/* scaleをやめる */
.home .slider-inner{
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
  transform: none;
  transform-origin: top center;
}

/* 1109px以下は画面幅に合わせて縮む */@media screen and (max-width: 1109px) {
  .pickup-slider .swiper-button-prev{
    left: clamp(0px, calc(50vw - 375px), 180px);
  }
  .pickup-slider .swiper-button-next{
    right: clamp(0px, calc(50vw - 385px), 170px);
  }

}

@media screen and (max-width: 900px) {
    .slider-description-home{
      margin-top: 20px;
    }
}

@media screen and (max-width: 740px) {
    .pickup-slider .swiper-button-prev {
      left: 0;
    }

    .pickup-slider .swiper-button-next {
      right: 0;
    }
}

@media screen and (max-width: 800px) {
  .pickup-slider .swiper-horizontal > .swiper-pagination {
    bottom: 50px !important;
  }
}

@media screen and (max-width: 430px) {
  .pickup-slider .swiper-horizontal > .swiper-pagination {
    bottom: 55px !important;
  }
}

@media screen and (max-width: 410px) {
  .pickup-slider .swiper-horizontal > .swiper-pagination {
    bottom: 65px !important;
  }
}

@media screen and (max-width: 383px) {
  .pickup-slider .swiper-horizontal > .swiper-pagination {
    bottom: 100px !important;
  }
}

@media screen and (max-width: 376px) {
  .pickup-slider .swiper-horizontal > .swiper-pagination {
    bottom: 110px !important;
  }
}