@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
*/
.visualnai{
  position: relative;
  top: 7em;
}

/* セクション見出し */
.topSec_en {
	letter-spacing: 0.05em;
	font-weight: 100;
	position: relative;
	top: 1rem;
	text-wrap: nowrap;
}
.topSec_jp {
	position: relative;
	top: -1.5em; /* 元の位置から下に移動 */
}

.topSec_jp2 {
	position: relative;
	top: -1.8em; /* 元の位置から下に移動 */
}

.wrap112 {
	display: flex;
}

.wrap112 .boxyoko {
	position: relative;
}

.wrap112 .boxyoko::after {
	position: absolute;
	top: 0;
	left: 100%;
	margin: 0 0.7em;
	content: "";
	width: 1px;
	height: 100%;
	background-color: #333;
}

/* メインビジュアル周り */
.square-in {
	height: 10rem;
  padding-top: 100% !important;
  background-image: url("http://think05.com/sample16/wp-content/uploads/2026/06/クレスコTOP用08.png");
	background-size: 100% 100%;
  margin: 0 !important;
    margin-top: 0px;
    margin-bottom: 0px;
}
.square-in2 {
  padding-top: 23vh !important;
  margin: 0 !important;
    margin-top: 0px;
    margin-bottom: 0px;
}
.nakami{
	position:relative;
	top:-21em;
}

.nakami2{
	position:relative;
	top:-18em;
}

.float-img {
  animation: float 5s ease-in-out infinite;
}
@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px); /* 5秒の中間（2.5秒時点）で20px上に浮き上がる */
  }
  100% {
    transform: translateY(0); /* 5秒かけて元の位置に戻る */
  }
}

.yohaku3{
 margin-left: 20px;
}

.tshadow {
	text-shadow:
		1px  1px 1px rgba(255, 255, 255, 1),
		-1px  1px 1px rgba(255, 255, 255, 1),
		1px -1px 1px rgba(255, 255, 255, 1),
		-1px -1px 1px rgba(255, 255, 255, 1),
		1px  0px 1px rgba(255, 255, 255, 1),
		0px  1px 1px rgba(255, 255, 255, 1),
		-1px  0px 1px rgba(255, 255, 255, 1),
		0px -1px 1px rgba(255, 255, 255, 1);
}
.tshadow2 {
	text-shadow:
		1px  1px 1px rgba(0, 0, 0, 1),
		-1px  1px 1px rgba(0, 0, 0, 1),
		1px -1px 1px rgba(0, 0, 0, 1),
		-1px -1px 1px rgba(0, 0, 0, 1),
		1px  0px 1px rgba(0, 0, 0, 1),
		0px  1px 1px rgba(0, 0, 0, 1),
		-1px  0px 1px rgba(0, 0, 0, 1),
		0px -1px 1px rgba(0, 0, 0, 1);
}
.tshadow3 {
	text-shadow:
		1px  1px 1px #36C1B6,
		-1px  1px 1px #36C1B6,
		1px -1px 1px #36C1B6,
		-1px -1px 1px #36C1B6,
		1px  0px 1px #36C1B6,
		0px  1px 1px #36C1B6,
		-1px  0px 1px #36C1B6,
		0px -1px 1px #36C1B6;
}

.tshadow4 {
	text-shadow:
		1px  1px 2px #F5F5F2BF,
		-1px  1px 2px #F5F5F2BF,
		1px -1px 2px #F5F5F2BF,
		-1px -1px 2px #F5F5F2BF,
		1px  0px 2px #F5F5F2BF,
		0px  1px 2px #F5F5F2BF,
		-1px  0px 2px #F5F5F2BF,
		0px -1px 2px #F5F5F2BF;
}

.toumei {
	opacity: 0.5;
	mix-blend-mode: screen;
}

.toumei2 {
	mix-blend-mode: screen;
}


.idou {
	position: relative;
	top: -80vh; /* 今の位置から20px上に移動する */
}
.idou2 {
	position: relative;
	top: 30vh; /* 今の位置から20px上に移動する */
}
@media screen and (min-width: 769px) {
.idou3 {
	position: relative;
	top: -10vh;
	left: 2em;
}
	}

/* サイト内検索変更 */
.wp-block-search .wp-block-search__input, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
  border: 1px solid var(--color_border);
	border: 1px solid hsla(0, 0%, 37.3%, 0.5);
  background-color: #ffffffcc;
}

.wp-block-search__input {
  outline: none;
}

.wp-block-search__button.has-icon {
padding: 3px !important;
}

/* メインビジュアル動画消える */
.fade-out-element {
    /* 1秒かけて変化 / イーズインアウト / 5秒待ってから開始 / 終了状態をキープ */
    animation: blurFade 5s ease-in-out 7s forwards;
}
@keyframes blurFade {
    from {
        opacity: 1;
        visibility: visible;
    }
    to {
        opacity: 0;
        visibility: hidden; /* 完全に消えた後、クリックなどを無効化する */
        overflow: hidden;
    }
}
/* メインビジュアル文字現れる */
.fade-in-element1 {
    /* 初期状態：最初は透明で、クリックもできない状態にしておく */
    opacity: 0;
    visibility: hidden;

    /* 1秒かけて変化 / イーズインアウト / 11秒待ってから開始 / 終了状態をキープ */
    animation: fadeIn 1s ease-in-out 4.3s forwards;
}

@keyframes fadeIn {
    to {
        opacity: 1;
        visibility: visible;
    }
}
/* メインビジュアル文字現れる */
.fade-in-element2 {
    /* 初期状態：最初は透明で、クリックもできない状態にしておく */
    opacity: 0;
    visibility: hidden;

    /* 1秒かけて変化 / イーズインアウト / 11秒待ってから開始 / 終了状態をキープ */
    animation: fadeIn 1s ease-in-out 10.5s forwards;
}

@keyframes fadeIn {
    to {
        opacity: 1;
        visibility: visible;
    }
}


/* インフォメーション内余白 */
.post-flex{
	margin: 0 5em ;
}

/** トップページのお知らせ一覧 **/
/* 日付とカテゴリー並べ替え */
.top-newslist .p-postList__cat {
order: 1;
}
.top-newslist .p-postList__times.c-postTimes.u-thin {
order: 2;
}

/* 日付とカテゴリーのアイコン非表示 */
.top-newslist time.c-postTimes__posted.icon-posted::before,.top-newslist span.p-postList__cat.icon-folder::before{
display: none;
}
/* 日付とカテゴリーの文字サイズ＋色 */
.top-newslist .p-postList__cat,.top-newslist time.c-postTimes__posted {
font-size: 15px;
color: black;
}
/* カテゴリーの装飾 */
.top-newslist .p-postList__cat {
color:blue;
border: solid 1px blue;
border-radius: 3px;
padding: 4px;
}

/** トップページのお知らせ一覧（日付 → カテゴリ → 本文） **/

/* --- 1. 横一列に並べるための親要素の設定 --- */
.top-newslist .p-postList__body {
    display: flex;
    align-items: center;
    gap: 15px;
    width: 100% !important;/* ★追加：箱の幅を画面いっぱいまで強制的に広げる */
    flex: 1 !important;/* ★追加：親要素の余白もすべて使い切る */
    
    /* ▼ 変更：すべての記事には「下の線」だけを引く ▼ */
    border-bottom: 0px solid #dddddd; 
    padding: 12px 0;
}

/* ▼ 追加：1番目の記事にだけ「上の線」を引く魔法のコード ▼ */
.top-newslist li:first-child .p-postList__body,
.top-newslist div:first-child > .p-postList__body {
    border-top: 0px solid #dddddd;
}

/* --- 追加：記事と記事の間の「透明な隙間」をなくして高さを揃える --- */

/* リスト全体（ul）に設定されている隙間を解除 */
ul.top-newslist,
.top-newslist.p-postList {
    gap: 0 !important; 
}

/* 各記事（li）の外側に設定されている余白を解除 */
.top-newslist li,
.top-newslist .p-postList__item {
    margin-bottom: 0 !important;
}

/* 階層の壁をなくし、横並びの対象にする魔法のコード */
.top-newslist .p-postList__meta {
    display: contents; 
}

/* --- 2. サムネイル・アイコンの非表示 --- */
.top-newslist .p-postList__thumb,
.top-newslist time.c-postTimes__posted.icon-posted::before,
.top-newslist span.p-postList__cat.icon-folder::before {
    display: none !important;
}

/* --- 3. 要素の順番とスタイル（左から 日付(1) → カテゴリ(2) → 本文(3)） --- */

/* ① 日付 */
.top-newslist .p-postList__times {
    order: 1 !important;            /* 1番左に配置 */
    font-size: 15px;
    color: black;
    white-space: nowrap; /* 改行防止 */
}

/* timeタグへの色指定 */
.top-newslist time.c-postTimes__posted {
    color: black;
}

/* ② カテゴリー */
.top-newslist .p-postList__cat {
    order: 2 !important;            /* 2番目に配置 */
    color: blue;
    border: solid 1px blue;
    border-radius: 3px;
    padding: 4px;
    font-size: 15px;
    white-space: nowrap; /* 改行防止 */
}

/* ③ タイトル */
.top-newslist .p-postList__title {
    order: 3 !important;            /* 3番目（一番右）に配置 */
    flex: 1;             /* 余った右側のスペースをすべて本文エリアにする */
    margin: 0;
    line-height: 1.5;
    font-size: 1em;
    color: #333333;
    
    /* 本文が長すぎる場合、1行に収めて末尾を「...」にする設定 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- 4. カテゴリごとの色分け（SWELL対応版） --- */

/* カテゴリ（ID: 9）の色を変更する */
.top-newslist .p-postList__cat[data-cat-id="9"] {
    color: #4c4c4c !important;        /* 文字の色（例：赤） */
    border-color: #4c4c4c !important; /* 枠線の色（例：赤） */
}

.top-newslist .p-postList__cat[data-cat-id="15"] {
    color: #4c4c4c !important;        /* 文字の色（例：赤） */
    border-color: #4c4c4c !important; /* 枠線の色（例：赤） */
}

.top-newslist .p-postList__title {
  font-weight: normal;
}

.mainvisualfont {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
}

/* 親要素：はみ出た部分を隠す */
.image-wrap {
  width: 100%;
  max-width: 500px;
  overflow: hidden;
}

/* 初期状態：あらかじめ拡大（1.2倍）し、ぼかし（8px）をかけておく */
.image-wrap img {
  width: 100%;
  height: auto;
  display: block;
  transform: scale(1.2);
  filter: blur(8px);
  /* アニメーションの速度（1秒かけて滑らかに変化） */
  transition: transform 1s ease-out, filter 1s ease-out;
}

/* 画面内に入った時：拡大とぼかしをゼロにする */
.image-wrap.is-active img {
  transform: scale(1);
  filter: blur(0);
}

/************************************
** お問い合わせフォームの入力
************************************/
#cf-tbl{
width: 100%;
}

#cf-tbl table{
width: 100%;
border-collapse: collapse;
border: none;
border-width: 0px;
color: #444;
}
#cf-tbl table tr th,
#cf-tbl table tr td{
padding: 0.5em;
text-align: left;
vertical-align: top;
border: none;
border-width: 0px;
vertical-align: middle;
}
#cf-tbl table tr th{
width: 30%;
background: none;
}
@media screen and (max-width:768px){
#cf-tbl{
width: 100%;
}

#cf-tbl table,
#cf-tbl table tbody,
#cf-tbl table tr,
#cf-tbl table tr th,
#cf-tbl table tr td{
display: block;
}

#cf-tbl table{
width: 100%;
border-width: 0 0 1px 0;
}

#cf-tbl table tr th,
#cf-tbl table tr td{
width: 100%;
padding: 3% 5%;
}

#cf-tbl table tr td{
border-width: 0px 1px 0px 1px;
}
}
/*「必須」文字デザイン*/
.required{
font-size:.8em;
padding: 5px;
background: #F57500;
color: #fff;
border-radius: 3px;
margin-right: 5px;
}

/*「任意」文字デザイン*/
.optional{
font-size:.8em;
padding: 5px;
background: #000080;
color: #fff;
border-radius: 3px;
margin-right: 5px;
}

/* 入力項目を見やすく */
input.wpcf7-form-control.wpcf7-text,
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 100%;
	padding: 8px 15px;
	margin-right: 10px;
	margin-top: 10px;
	border: 1px solid #d0d5d8;
	border-radius: 3px;
	background-color: #eff1f5;
}
textarea.wpcf7-form-control.wpcf7-textarea {
	height: 200px;
}

/* 「送信する」ボタン */
input.wpcf7-submit {
    display: block;
    padding: 15px;
    width: 400px;
    background: #153396;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    border-radius: 2px;
    margin: 15px auto 0
}
@media screen and (max-width:768px){
input.wpcf7-submit {
width: 250px;
}

input.wpcf7-submit:hover {
	box-shadow: 0 15px 30px -5px rgba(0,0,0,.15), 0 0 5px rgba(0,0,0,.1);
	transform: translateY(-4px);
	opacity:0.7;
}
/* エラーメッセージを見やすく */
span.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
	color: red;
	font-weight: 600;
}