@charset "utf-8";
/* CSS Document */
/* --- 全体設定 --- */
html {
 scroll-behavior: smooth;}

/* --- description ボックス --- */
div#description, div.description {
 display: flex;
 flex-direction: row;
 flex-wrap: nowrap;
 /*	justify-content: space-around;*/
 padding: 0px 0px 0px;
 margin-bottom: 1em;
 width: 98%;
 height: auto;
 background-color: #fff;
 color: #000;
 top: 970px !important;
 border: none !important;
 border-radius: 10px;
 justify-content: center;
}
/* description 内の画像ホバー */
div#description p img, div.description img, div.link img, div.banner img {
 border: 3px solid transparent;
 opacity: 1;
 transition: border-color 0.3s ease, opacity 0.2s ease;
 transform: scale(1);
}
.container {
 display: flex;
 gap: 2rem 5rem;
 padding: 20px;
 flex-wrap: wrap; /* 画面が小さくなったら折り返す */
 justify-content: center; /* 全体を中央寄せ（オプション） */
}
.container img {
 height: 200px; /* 高さを揃えると綺麗 */
 width: auto;
 object-fit: cover; /* トリミングして綺麗に収める */
}
.bdr-red {
 border: 2px solid #FF0004;
}
div#description p img:hover, div.link img:hover, div.banner img:hover {
 border-color: #3498db;
 opacity: 0.9;
 transform: scale(1.08);
}
/* --- キャンペーン枠 --- */
div.campaign {
 padding: 0px 5px 40px;
 margin-bottom: 1em;
 height: auto;
 color: #000;
 top: 580px !important;
 border-radius: 10px;
 clear: both;
 background-color: #fff;
 border: 1px solid #ccc;
 box-shadow: 3px 20px 10px 2px rgba(0, 0, 0, 0.05);
 letter-spacing: .1em;
}
/* --- グラデーション背景 --- */
.gradient-2025 {
 background: linear-gradient(135deg, #fff 0%, #57D1D1 46%, #F3F3DB 100%)!important;
 min-height: 50vh;
}
/* --- リンクの横並び --- */
div.link {
 margin: 40px auto;
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 gap: 5rem 4rem;
 justify-content: space-between; /* 両端揃え（ヘッダーメニューとか最高） */
 border: 1px solid #ccc;
}
/* --- what's セクション --- */
div#whats {
 left: 590px !important;
 top: 270px !important;
 background: none;
}
/* --- バナー --- */
div.banner {
 margin-top: 550px;
 border: 0px solid;
}
div.banner img {
 margin: 20px 3px;
}
/* --- 影付き画像 --- */
img.shadow-radius {
 border-radius: 20px;
 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
/* --- text-guide --- */
.text-guide {
 width: 95%;
 padding: 50px 20px 50px 20px;
 border: 2px solid #fff;
 border-radius: 30px;
 box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
 background-color: #E6E6E6;
}
/* text-guide 内 a タグ */
div.text-guide li a {
 width: 90%;
 height: 70px;
/* display: block;
*/ padding: 1rem 1.25rem;
 margin: 1rem auto;
 font-size: 1.5rem;
 color: #082EC2;
 border: 2px solid #fff;
 border-radius: 0.5rem;
 background: linear-gradient(135deg, #6D969D 0%, #9FD9D4 46%, #70C5FF 100%);
 display: flex;
 align-items: center;
 gap: 1rem;
}
div.text-guide li a:hover {
 color: #030000;
 background: #fff;
 transform: translateY(4px);
 box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}
/* --- 日付表記 --- */
.auto-small-date .small-prefix {
 font-size: 80%;
 opacity: 0.85;
 margin-right: 0.4em;
}
.date-prefix {
 font-size: 70%;
 opacity: 0.9;
 margin-right: 2em;
 font-weight: 500;
}


