@charset "UTF-8";

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 1. Variables (変数定義)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
:root {
	/**** 基本要素 ****/
	/* 下部マージン */
	--margin_bottom_s: 30px;
	--margin_bottom_ml: 40px;
	/* 下部マージン（少なめ） */
	--margin_bottom_small: 5px;
	/* 下部マージン（無し） */
	--margin_bottom_none: 0px;
	/* 上部マージン（無し） */
	--margin_top_none: 0px;

	/**** ヘッダー ****/
	/* 上部マージン */
	--margin_top_h_s: 45px;
	--margin_top_h_ml: 50px;

	/* 基本カラー */
	--color-primary-navy: #16284f;		/* メインのダークブルー */
	--color-accent-gold: #c3a45e;		/* アクセントのゴールド */
	--color-accent-gold-light: #cdbe73;	/* アクセントのイエロー寄り */
    --color-navy: #8a3324;
	--color-beige: #d6cdb9;				/* 落ち着いたベージュ */
	--color-base-ivory: #f4f2ed;				/* 背景向けのオフホワイト */
	--color-brown-dark: #492d1c;		/* 深みのあるブラウン */
	--color-black: #333333;				/* 通常テキスト色 */
	--color-gray:#B0ACA4;				/* 薄いグレー */
	--color-red: #eb2f5d;				/* エラーや強調の赤 */
	--color-green: #3c763d;				/* 深みと安心感のあるグリーン */
	--color-black: #000000;				/* 開発者モードの黒 */
	--color-white: #ffffff;
	
	/* パステル系背景色 */
	--color-pastel-beige: #ede8da;
	--color-pastel-red: #ffe8ed;
	--color-pastel-blue: #d1d7dd;
	--color-pastel-green: #e5fff3;
	--color-pastel-yellow: #f3e6b1;
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 2. Base / Reset (基本設定)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
*, *:before, *:after {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
	font-family: inherit;
}

html {
	font-size: 15px;
	font-size: clamp(15px, 1.2vw, 17px);
	color: var(--color-black);
	letter-spacing: 0.05em;
	line-height: 1.7;
	touch-action: manipulation;
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
	overflow-x: hidden;
}

body {
	background-color: var(--color-pastel-beige);
	overflow-x: hidden;
}

/* リンク */
a {
	color: var(--color-accent-gold);
	text-decoration: none;
	cursor: pointer;
}

/* 画像 */
img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){
	img{
		margin-bottom: var(--margin_bottom_ml);
	}
}

/* アイコン */
i { margin-right: 0.4em; }
i.sentence { margin-left: 0.4em; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 3. Typography (文字・見出し)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* h1 Page Title */
.page_title_box {
	margin-top: 50px;
	background: var(--color-beige);
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 50px 20px 90px;
	position: relative;
}
@media only screen and (min-width: 1117px) {
	.page_title_box {
		padding: 100px 20px 90px;
		margin-top: 91px;
	}
}
.page_title_box::before {
	position: absolute;
	bottom: 0px; left: 0px;
	content: ""; display: block;
	width: 200px; aspect-ratio: 9/7;
	background-image: url(../../img/evt/img_h1_flower_left.png);
	background-size: cover; background-position: center; z-index: 1;
}
.page_title_box::after {
	position: absolute;
	top: 0px; right: 0px;
	content: ""; display: block;
	width: 220px; aspect-ratio: 97/51;
	background-image: url(../../img/evt/img_h1_flower_right.png);
	background-size: cover; background-position: center; z-index: 1;
}
@media (min-width: 738px) {
	.page_title_box::before { width: 280px; }
	.page_title_box::after { width: 308px; }	
}
@media (min-width: 1117px) {
	.page_title_box::before { width: 350px; }
	.page_title_box::after { width: 385px; }	
}
h1.page_title {
	margin-top: 0px; margin-bottom: 0px;
	position: relative; text-align: center;
}
h1.page_title::after {
	position: absolute;
	bottom: -50px; left: 50%;
	transform: translateX(-50%);
	content: ""; display: block;
	width: 100px; aspect-ratio: 266 / 106;
	background-image: url(../../img/evt/img_h1_decoration.png);
	background-size: cover; background-position: center;
}
h1.page_title .title_en {
	display: block;
	font-size: clamp(18px, 4vw, 23px);
	color: var(--color-brown-dark);
	font-family: 'Cinzel', serif;
}
h1.page_title .title_jp {
	display: block;
	font-size: clamp(30px, 5vw, 45px);
	color: var(--color-brown-dark);
}

/* h2 Section Title */
h2.section_title{
	margin-top: clamp(40px, 3.5vw, 60px);
	margin-bottom: clamp(35px, 3vw, 45px);
	text-align:center;
	font-weight:bold;
}
h2.section_title .title_en{
	display:block;
	font-size:1.5rem;
	font-size: clamp(18px, 4vw, 23px);
	color:var(--color-primary-navy);
	font-family: 'Cinzel', serif;
}
h2.section_title .title_jp{
	display:block;
	font-size: clamp(25px, 4vw, 36px);
	color:var(--color-primary-navy);
}
/* 記事用のh2 */
h2.news_title{
	margin-top:4rem;
	margin-bottom:3rem;
	font-size: clamp(25px, 4vw, 36px);
}
h1.page_title + h2.section_title,
div.inner > h2.section_title:first-child,
div.inner > h2.news_title:first-child{
	margin-top: 0px;
}

/*--------------------------------------------------------
 ■ h3
--------------------------------------------------------*/
h3.area_title{
	margin-top: clamp(35px, 3vw, 55px);
	margin-bottom: clamp(33px, 2.8vw, 43px);
	font-size: clamp(22.5px, 3.5vw, 30px);
	padding-bottom: 8px;
	border-bottom: 1px solid var(--color-accent-gold);
	color: var(--color-accent-gold);
	text-align: justify;
}
h2.section_title + h3.area_title,
div.inner > h3.area_title:first-child{
	margin-top: 0px;
}
/*--------------------------------------------------------
 ■ h4
--------------------------------------------------------*/
h4.double_line {
	margin-top: clamp(30px, 2.5vw, 50px);
	margin-bottom: clamp(30px, 2vw, 40px);
	position: relative;
	padding-left: 16px;
	font-size: clamp(20px, 3vw, 26px);
	line-height: 1.3;
	color:var(--color-primary-navy);
}
/* 太線 */
h4.double_line::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 1.2em;
  width: 3px;
  background-color: var(--color-primary-navy);
}

/* 細線 */
h4.double_line::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  height: 1.2em;
  width: 1px;
  background-color: var(--color-primary-navy);
}
h3.area_title + h4.double_line,
div.inner > h4.double_line:first-child{
	margin-top: 0px;
}
/*--------------------------------------------------------
 ■ h5
--------------------------------------------------------*/
h5.circle{
	margin-top: clamp(28px, 2vw, 45px);
	margin-bottom: clamp(30px, 2vw, 40px);
	font-size: clamp(18px, 2.5vw, 22.5px);
	position: relative;
	padding: 6px 0 6px 25px;
}
h5.circle:before{
	content: "";
	position: absolute;
	left: 0;
	background:var(--color-accent-gold);	
	border-radius:50%;
	width:16px;
	height:16px;
	top:50%;
	transform: translateY(-50%);
	margin-top:2px;/* 位置調整 */
}
h4.double_line + h5.circle,
div.inner > h5.circle:first-child{
	margin-top: 0px;
}

/* Paragraph */
p {
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){
	p { margin-bottom: var(--margin_bottom_ml); }
}
p.img_title, p.table_title { margin-bottom: 5px; }
p.error { font-weight: bold; color: var(--color-red); }

/* Text Utilities */
.number { font-family: 'Quicksand', sans-serif; }
strong.red { border-bottom: none; color: var(--color-red); font-size: 1.1em; }
.italic { font-style: italic; }
.bold { font-weight: bold; }
.small_font { font-size: 13px; }
.break_all { word-break: break-all; }

/* Colors */
p.red, span.red, i.red { color: var(--color-red); }
p.gold, span.gold, i.gold { color: var(--color-accent-gold); }
p.navy, span.navy, i.navy { color: var(--color-primary-navy); }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 4. Utilities (汎用クラス)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* 表示制御 */
.release_soon_display_none { display: none !important; }
.release_soon_transparent { opacity: 0.5; pointer-events: none; cursor: default; }

/* 配置・マージン */
.clearfix { clear: both; }
.float_right { float: right !important; }
.center { text-align: center !important; }
.right { text-align: right !important; }

.last_margin_bottom { margin-bottom: var(--margin_bottom_s) !important; }
@media only screen and (min-width: 738px){
	.last_margin_bottom { margin-bottom: var(--margin_bottom_ml) !important; }
}
.last_margin_bottom_small { margin-bottom: var(--margin_bottom_small) !important; }
.last_margin_bottom_none { margin-bottom: var(--margin_bottom_none) !important; }
.first_margin_top_none { margin-top: var(--margin_top_none) !important; }

/* レスポンシブ表示切り替え */
br.sp_new_line { display: inline; }
@media screen and (min-width: 738px){ br.sp_new_line { display: none; } }

.only_sp { display: block; }
@media only screen and (min-width: 738px) { .only_sp { display: none !important; } }

.only_pc { display: none; }
@media only screen and (min-width: 738px) { .only_pc { display: block; } }

.only_desktop { display: none; }
@media only screen and (min-width: 1117px) { .only_desktop { display: block; } }

.only_under_desktop { display: block; }
@media only screen and (min-width: 1117px) { .only_under_desktop { display: none !important; } }

/* データなしメッセージ */
main .no_data_message { text-align: center; margin: 60px 0; }
main .no_data_message .main_text { font-weight: bold; color: #666; }
main .no_data_message .sub_text { font-size: 14px; color: #999; margin-top: 5px; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 5. Layout (レイアウト)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* Main */
main { margin-top: 50px; }
@media only screen and (min-width: 1117px){ main { margin-top: 91px; } }

/* Container & Column */
div.container { margin: 0 5px; width: initial; }
@media only screen and (min-width: 738px){ div.container { margin: 0 10px; } }
@media only screen and (min-width: 1117px){
	div.container { margin: 0 auto; width: 1087px; display: flex; gap: 51px; }
	div.left_box { width: 700px; }
	div.right_box { width: 336px; }
}
div.overflow_hidden { overflow: hidden; }

/* Section Inner */
section .inner {
	width: calc(100% - 20px);
	max-width: 1117px;
	margin-left: auto; margin-right: auto;
}
@media only screen and (min-width: 1117px) { section .inner { width: 100%; } }
section .inner_lg { width: 1000%; max-width: 100%; }













/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ Header Desktop
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.header_desktop {
    width: 100%; position: fixed; top: 0; left: 0; z-index: 100;
    padding: 15px; background: var(--color-pastel-beige);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.header_desktop.is_developer {
    background: var(--color-black);
}

.header_desktop.not_fixed { position: absolute; box-shadow: none; }
.header_desktop::before {
    content: ""; position: absolute; inset: 0;
    background-image: url(../../img/evt/top/img_bg_pattern.png);
    background-size: 600px 600px; background-repeat: repeat; background-position: center;
    pointer-events: none;
}
.header_desktop .header_desktop_item {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; max-width: 1117px; margin: 0 auto;
}
.header_desktop .header_nav { width: 100%; position: relative; height: 76px; }

/* --- Navigation List --- */
.header_desktop .nav_list {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

/* --- Menu Item (Fixed Width Layout) --- */
.header_desktop .nav_list_item {
    margin-top: 0px;
    text-align: center;
    /* 幅を固定して均等配置 (1117px - 200px) / 6 items ≈ 152px */
    width: 152px;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* アイコン配置の基準点 */
}

.header_desktop .nav_list_item:nth-child(1) {/* -24 */
    width: 128px; 
}
.header_desktop .nav_list_item:nth-child(2) {/* +12 */
    width: 168px;
}
.header_desktop .nav_list_item:nth-child(3) {/* +12 */
    width: 168px;
}

/* Logo Spacer */
.header_desktop .nav_list_item.spacer {
    width: 200px;
    flex-shrink: 0;
    pointer-events: none;
}

/* Link Style */
.header_desktop .nav_list_link {
    width: 100%;
    margin: 0;
    padding: 5px 0; /* 上下の余白のみ確保 */
    position: relative;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

/* Text Styles */
.header_desktop .nav_txt_jp { font-weight: 500; color: #606060;}


.header_desktop.is_developer .nav_txt_jp {
    color: #ffffff;
}
.header_desktop .nav_txt_en { color: var(--color-accent-gold); font-family: 'Cinzel', serif; }

/* Specific Adjustment: "Competition Concept" */
.header_desktop .nav_list_item:nth-child(2) .nav_txt_jp {
    /* 文字数が多い項目の微調整 */
    letter-spacing: -0.0em;
    white-space: nowrap;
}

/* --- Logo --- */
.header_desktop .header_logo { width: 150px; margin: 0; }
.header_desktop .logo {
    position: absolute; right: 50%; bottom: -90px;
    width: 170px; margin-right: -85px;
}
.header_desktop .logo_circle {
    width: 170px; height: 170px; border-radius: 50%;
    background-color: var(--color-pastel-beige);
    display: flex; justify-content: center; align-items: center;
    overflow: hidden; cursor: pointer;
}

/* Header Desktop Service Logo (Alternate Layout) */
.with_service_logo .logo { display: none; }
.service_logo { display: none; }
.header_desktop.with_service_logo .service_logo_box {
    display: flex; width: 100%; height: 100%;
    align-items: center; justify-content: space-between;
}
.header_desktop.with_service_logo .service_logo { width: auto; }
.header_desktop.with_service_logo .service_logo img {
    width: auto; max-height: 50px; vertical-align: bottom; margin-left: 15px;
}

/* --- Submenu & Hover Effects --- */
/* Underline Effect */
.header_desktop .nav_list_link::after,
.header_desktop .menu_title::after {
    content: ""; position: absolute; bottom: 0; left: 10%;
    width: 80%; height: 2px; background-color: var(--color-accent-gold);
    transform: scaleX(0); transition: transform 0.3s ease; transform-origin: right;
}
.header_desktop .nav_list_item:hover a::after,
.header_desktop .has_submenu:hover .menu_title::after,
.header_desktop .has_submenu .submenu:hover ~ .menu_title::after {
    transform: scaleX(1); transform-origin: left;
}
.header_desktop .has_submenu .menu_title::after { width: calc(100% - 25px); }

/* Submenu Container */
.header_desktop .has_submenu {
    /* アイコン絶対配置のため gap等は不要 */
    justify-content: center;
    cursor: pointer;
}

/* Menu Title Wrapper */
.header_desktop .menu_title {
    display: flex; flex-direction: column; 
    padding: 0; margin-bottom: 0px; margin: 0;
    width: 100%; z-index: 1; /* アイコンより前面に */
}

/* Absolute Position Icon (Floating Right) */
.header_desktop .submenu_icon { 
    font-size: 0.9rem; color: var(--color-accent-gold); 
    position: absolute;
    right: -5px;        /* 枠の右端 */
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    width: auto;
    pointer-events: none;
}

/* --- Submenu Dropdown --- */
.header_desktop .submenu {
    display: none; 
    position: absolute; 
    top: 100%; 
    
    /* ▼▼▼ 修正箇所ここから ▼▼▼ */
    left: 0;           /* 必要に応じて中央寄せ等の調整可能 */
    width: max-content; /* 中身のテキストの最大長さに合わせて幅を広げる */
    min-width: 100%;    /* テキストが短くても、最低限親メニューの幅は維持する */
    /* ▲▲▲ 修正箇所ここまで（元の width: 100%; を削除または上書き） ▲▲▲ */

    background: var(--color-pastel-beige); 
    padding: 10px; 
    z-index: 200;
    
    white-space: nowrap; /* テキストを折り返さず1行にする（既存のまま） */
    
    animation: fadeInUp 0.3s ease forwards; 
    opacity: 0;
    list-style: none; 
    text-align: left; 
    margin-left: 0;
}
@keyframes fadeInUp { to { opacity: 1; } }
.header_desktop .has_submenu:hover .submenu,
.header_desktop .has_submenu .submenu:hover { display: block; }

.header_desktop .submenu_item { padding: 5px 0px; }
.header_desktop .submenu_link {
    color: #333; text-decoration: none; display: block; transition: background 0.3s;
}
.header_desktop .submenu_link_icon { color: var(--color-accent-gold); }
.header_desktop .login { color: var(--color-primary-navy); }















/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ Header SP / Tablet
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.header_sp_tb {
    width: 100%; position: fixed; top: 0; left: 0; z-index: 100;
    padding: 10px; background: var(--color-pastel-beige);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.header_sp_tb.not_fixed { position: absolute; box-shadow: none; }
.header_sp_tb::before {
    content: ""; position: absolute; inset: 0;
    background-image: url(../../img/evt/top/img_bg_pattern.png);
    background-size: 600px 600px; background-repeat: repeat; background-position: center;
    pointer-events: none;
}
.header_sp_tb .header_sp_tb_item {
    display: flex; align-items: center; max-width: 1600px;
    margin: 0 auto; position: relative; height: 30px;
}
.header_sp_tb.with_service_logo .header_sp_tb_item { height: 50px; }
.header_sp_tb .logo_circle {
    position: absolute; right: 50%; bottom: -60px;
    width: 100px; height: 100px; margin-right: -50px;
    border-radius: 50%; background-color: var(--color-pastel-beige);
    display: flex; justify-content: center; align-items: center;
    overflow: hidden; cursor: pointer;
}
.header_sp_tb .header_logo { width: 90px; margin: 0px; }
.with_service_logo .logo_circle { display: none; }
.with_service_logo .service_logo {
    display: flex; width: 100%; height: 100%;
    align-items: center; justify-content: center;
}
.with_service_logo .service_logo img {
    width: auto; max-height: 50px; vertical-align: bottom; margin-left: 15px;
}

/* Header SP Hamburger Menu */
.header_sp_tb .menu_toggle { display: none; }
.header_sp_tb .menu_icon {
    font-size: 2rem; cursor: pointer; z-index: 1100;
    color: var(--color-primary-navy); margin-left: auto;
}
.header_sp_tb .close_icon { display: none; }
.header_sp_tb .menu_toggle:checked + .menu_icon .open_icon { display: none; }
.header_sp_tb .menu_toggle:checked + .menu_icon .close_icon { display: inline; }
.header_sp_tb .menu_icon i { margin-right: 0px; }
.header_sp_tb .overlay_menu {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: var(--color-pastel-beige); opacity: 0; pointer-events: none;
    transition: opacity 0.3s ease; z-index: 1000;
    display: flex; padding-left: 30px; padding-right: 30px; padding-top: 70px;
}
.header_sp_tb .menu_toggle:checked ~ .overlay_menu { opacity: 1; pointer-events: auto; }
.header_sp_tb .menu_list {
    list-style: none; text-align: left; padding: 0;
    display: flex; flex-direction: column; gap: 6px; width: 100%;
}
.header_sp_tb .menu_list_item { border-bottom: 1px solid var(--color-gray); display: block; padding-bottom: 8px; }
.header_sp_tb .menu_list_link {
    color: #222222; text-decoration: none; display: flex; flex-direction: column;
}
.header_sp_tb .menu_txt_en { color: var(--color-accent-gold); font-family: 'Cinzel', serif; font-size: 0.8rem; }
.header_sp_tb .submenu_toggle { display: none; }
.header_sp_tb .submenu {
    max-height: 0; overflow: hidden; transition: max-height 0.3s ease;
    padding-left: 0.5rem; list-style: none;
}
.header_sp_tb .submenu_toggle:checked + .submenu_label + .submenu { max-height: 500px; }
.header_sp_tb .submenu_label {
    display: flex; justify-content: space-between; align-items: center;
    cursor: pointer; gap: 8px;
}
.header_sp_tb .submenu_title { display: flex; flex-direction: column; margin-bottom: 0px; }
.header_sp_tb .submenu_icon {
    font-size: 1.5rem; transition: transform 0.3s ease; color: var(--color-accent-gold);
}
.header_sp_tb .submenu_toggle:checked + .submenu_label .submenu_icon { transform: rotate(180deg); }
.header_sp_tb .submenu_item { border: none; }
.header_sp_tb .submenu_link {
    font-size: 0.9rem; color: #333; padding: 4px 0; display: block;
}
.header_sp_tb .submenu_link i { color: var(--color-accent-gold); font-size: 0.8rem; }

/* Footer */
.footer {
	background: var(--color-primary-navy); position: relative;
	padding: 30px 0 20px 0; width: 100%; margin-top: 50px; 
}
@media only screen and (min-width: 1117px){ .footer { margin-top: 91px; } }
.footer::after {
	content: ""; position: absolute; inset: 0;
	background-image: url(../../img/evt/top/img_bg_pattern.png);
	background-size: 600px 600px; background-repeat: repeat; background-position: center;
	pointer-events: none; opacity: 0.1;
}
.footer .footer_inner {
	width: calc(100% - 20px); margin-right: auto; margin-left: auto;
	max-width: 1117px; display: flex; flex-direction: column; gap: 10px;
}
.footer::before {
	content: ""; position: absolute; top: 10px; left: 0;
	width: 100%; height: 8px;
	background-image: linear-gradient(to bottom, white 0px, white 3px, transparent 3px, transparent 7px, white 7px, white 8px);
}
.footer .footer_service_logo { width: 110px; margin-right: auto; margin-left: auto; }
.footer .footer_service_logo_img { width: 100%; margin-bottom: 0px; }
.footer .footer_sns { display: none; justify-content: center; gap: 20px; }
.footer .footer_sns_link { width: 30px; cursor: pointer; }
.footer .footer_sns_img { width: 100%; }
.footer .footer_link_group {
	display: flex; margin: 10px 0; padding: 0; list-style: none;
	flex-direction: column; gap: 5px; justify-content: flex-end; text-align: right;
}
.footer .footer_link_item { margin: 0; padding: 0; display: flex; align-items: center; }
.footer .footer_link { display: inline-block; line-height: 1.6; padding: 4px 0; color: #ffffff; }
@media only screen and (min-width: 738px){
	.footer .footer_link_group {
		flex-direction: row; justify-content: center; gap: 20px; align-items: center !important;
	}
}
.footer .footer_copyright_txt { color: #ffffff; font-size: 0.8rem; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 6. Components (UI)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* Buttons */
.filled_button {
	font-size: 16px; font-weight: bold; display: inline-block; min-width: 250px;
	text-align: center; padding: 15px; outline: none;
	color: var(--color-base-ivory); background-color: var(--color-accent-gold);
	position: relative; border: 1px solid transparent; cursor: pointer;
	overflow: hidden; transition: color 0.5s ease, background-color 0.5s ease;
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){
	.filled_button { font-size: 18px; margin-bottom: var(--margin_bottom_ml); }
}
.filled_button::before {
	content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: var(--color-base-ivory); transform: scaleX(0); transform-origin: left;
	transition: transform 0.5s ease; z-index: 0;
	border: 1px solid var(--color-accent-gold); box-sizing: border-box; pointer-events: none;
}
.filled_button:not(:disabled):hover::before { transform: scaleX(1); }
.filled_button:not(:disabled):hover {
	color: var(--color-accent-gold); background-color: var(--color-base-ivory);
	border-color: var(--color-accent-gold);
}
.filled_button .text { position: relative; z-index: 1; }
.filled_button:disabled { opacity: 0.4; cursor: not-allowed; }

div.main_box .two_btn button.big_border_btn {
	margin-right: auto; margin-left: auto; display: block;
}
@media only screen and (min-width: 738px){
	div.main_box .two_btn { margin-bottom: var(--margin_bottom_ml); }
	div.main_box .two_btn button.big_border_btn {
		margin: 0 10px; display: inline-block;
	}
}

.line_button {
	font-size: 16px; font-weight: bold; display: inline-block; min-width: 250px;
	text-align: center; padding: 15px; outline: none;
	color: var(--color-accent-gold); background-color: transparent;
	border: 1px solid var(--color-accent-gold); cursor: pointer;
	transition: color 0.4s ease, border-color 0.4s ease;
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px) {
	.line_button { font-size: 18px; margin-bottom: var(--margin_bottom_ml); }
}
.line_button:not(:disabled):hover {
	color: var(--color-brown-dark); border-color: var(--color-brown-dark);
}
.line_button:disabled { opacity: 0.4; cursor: not-allowed; }

.center_flex_box {
	display: flex;
	justify-content: center;
	gap: 20px;
}
@media only screen and (max-width: 737px) {

	.center_flex_box {
		flex-direction: column;
		align-items: center;
		gap: 0;
	}

	.center_flex_box .line_button {
		margin-bottom: 20px;
	}

	.center_flex_box .filled_button {
		margin-bottom: var(--margin_bottom_s);
	}
}

/* Tabs */
.tab_wrap_title { font-weight: bold; font-size: 17px; }
@media only screen and (min-width: 738px){ .tab_wrap_title { font-size: 18px; } }
.tab_wrap { display: flex; flex-wrap: wrap; position: relative; }
.tab_wrap .tab_switch { display: none; }
.tab_btn_with_triangle {
	color: var(--color-primary-navy); border: 1px solid var(--color-primary-navy);
	font-weight: bold; white-space: nowrap; text-align: center; padding: 8px;
	order: -1; position: relative; z-index: 1; cursor: pointer; flex: 1;
	display: flex; flex-direction: column; justify-content: center; align-items: center;
	margin-right: 10px;
}
.tab_btn_with_triangle:last-of-type { margin-right: 0px; }
.tab_switch:checked+.tab_btn_with_triangle, .tab_btn_with_triangle:hover, .tab_btn_with_triangle.selected {
	background: var(--color-primary-navy); color: #fff;
}
.tab_switch:checked+.tab_btn_with_triangle:before, .tab_btn_with_triangle:hover:before, .tab_btn_with_triangle.selected:before {
	content: ""; border: 10px solid transparent; border-top-color: var(--color-primary-navy);
	display: block; left: 50%; bottom: 2px; transform: translate(-50%, 100%); position: absolute;
}
.tab_content { width: 100%; height: 0; overflow: hidden; opacity: 0; }
.tab_switch:checked+.tab_btn_with_triangle+.tab_content {
	height: auto; padding: 20px 0px 0px 0px; opacity: 1; transition: .5s opacity;
}

/* Lists (ul/ol) */
ul, ol { margin-left: 25px; margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ ul, ol { margin-bottom: var(--margin_bottom_ml); } }
ul ul, ol ul { margin-bottom: 0px; list-style-type: circle; }
ul ol, ol ol { margin-bottom: 0px; list-style-type: decimal; }
ul li.none { list-style-type: none; }

ul li { padding: 4px 0; }
ul li ul li:nth-child(1), ul li ol li:nth-child(1) { padding-top: 8px; }
ul li:nth-child(1) { margin-top: -4px; }
ul li ul li:nth-child(1), ul li ol li:nth-child(1) { margin-top: 0px; }
ul li:nth-last-child(1) { margin-bottom: -4px; }

ol li { padding: 5px 0; }
ol li ul li:nth-child(1), ol li ol li:nth-child(1) { padding-top: 10px; }
ol li ul li:nth-last-child(1), ol li ol li:nth-last-child(1) { padding-bottom: 0px; }
ol li:nth-child(1) { margin-top: -5px; }
ol li ul li:nth-child(1), ol li ol li:nth-child(1) { margin-top: 0px; }
ol li:nth-last-child(1) { margin-bottom: -5px; }
ol li ul li:nth-last-child(1), ol li ol li:nth-last-child(1) { margin-bottom: 0px; }

ol.ol_circle { list-style-type: none; margin-left: 0px; counter-reset: list-counter; }
.ol_circle li { position: relative; padding-left: 34px; display: flex; align-items: center; }
.ol_circle li:before {
	display: flex; align-items: center; justify-content: center; position: absolute; left: 0;
	width: 1.5em; height: 1.5em; line-height: 1.5em; border-radius: 50%; color: #fff;
	counter-increment: list-counter; content: counter(list-counter); font-weight: bold;
}
.ol_circle.navy li:before { background: var(--color-primary-navy); }
.ol_circle.brown li:before { background: var(--color-brown-dark); }
.ol_circle.gold li:before { background: var(--color-accent-gold); }

/* HR */
hr { border: 0; border-top: 1px solid var(--color-primary-navy); margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ hr { margin-bottom: var(--margin_bottom_ml); } }
hr.gold { border: 0; border-top: 1px solid var(--color-accent-gold); margin-bottom: var(--margin_bottom_s); }
.double_line_hr {
	position: relative; border: none; height: 10px; background: transparent; margin: 2em 0; padding: 0;
}
.double_line_hr::before, .double_line_hr::after {
	content: ""; position: absolute; left: 0; right: 0; background-color: var(--color-black);
}
.double_line_hr::before { height: 3px; top: 0; }
.double_line_hr::after { height: 1px; top: 7px; }

/* Tables */
table {
	width: 100%; border: 1px solid var(--color-gray); padding: 0px 5px;
	margin-bottom: var(--margin_bottom_s); border-collapse: collapse;
	table-layout: fixed; /* レイアウト固定 */
}
table tr { border-bottom: 1px solid #dddddd; }
@media only screen and (min-width: 738px){ table { margin-bottom: var(--margin_bottom_ml); } }
table th {
	padding: 9px; font-weight: bold; text-align: center; color: #505050;
	border: 1px solid var(--color-gray);
}
table.beige_table th { background: var(--color-beige); }
@media only screen and (min-width: 738px){ table th { padding: 12px; } }
table td { border: 1px solid var(--color-gray); padding: 9px; background: var(--color-base-ivory); }
@media only screen and (min-width: 738px){ table td { padding: 12px; } }
table th.break_word, table td.break_word { overflow-wrap: break-word; }

main table + div.comment.error.table_bottom{
	margin-top:-25px;
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){
	main table + div.comment.error.table_bottom{
		margin-top:-35px;
		margin-bottom: var(--margin_bottom_ml)
	}
}

/* Scrollable Table */
.scrollable_table_block { position: relative; }
.scrollable_table_wrap { overflow-x: scroll; overflow-y: visible; }
.scrollable_table_block .scrollable_icon::before {
	position: absolute; right: 12px; top: -12px; z-index: 10;
	animation: scrollAnimation 1.5s ease-in-out infinite;
	font-family: 'Font Awesome 6 Pro'; content: '\e1a2';
	color: var(--color-brown-dark); font-weight: 900; font-size: 20px;
}
@keyframes scrollAnimation {
	0% { transform: translateX(0); }
	50% { transform: translateX(10px); }
	100% { transform: translateX(0); }
}
.scrollable_table_block .scrollable_icon img { width: 100%; margin-bottom: 0px; }
.scrollable_table_wrap table {
	margin-bottom: 0px; min-width: max-content; width: auto;
	table-layout: fixed; border-collapse: separate; border-spacing: 0px;
	padding: 0px; border-right: 1px solid #dddddd;
}
.scrollable_table_wrap table.scrollable_table tr > :first-child {
	position: sticky; top: 0; left: 0; z-index: 2;
}
.scrollable_table_wrap table.scrollable_table tr > th,
.scrollable_table_wrap table.scrollable_table tr > td { z-index: -1; }
.scrollable_table_wrap table.scrollable_table td,
.scrollable_table_wrap table.scrollable_table th {
	max-width: 1000px; min-width: 100px; border-top: none; border-right: none;
}
.scrollable_table_wrap td.table_icon_double_circle {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><circle cx="12" cy="12" r="10" fill="none" stroke="%23f6dddd" stroke-width="2"/><circle cx="12" cy="12" r="6" fill="none" stroke="%23f6dddd" stroke-width="2"/></svg>');
	background-repeat: no-repeat; background-position: center; background-size: 60px; padding: 10px;
}
.scrollable_table_wrap td.table_icon_circle {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><circle cx="12" cy="12" r="10" fill="none" stroke="%23e8f1ff" stroke-width="2"/></svg>');
	background-repeat: no-repeat; background-position: center; background-size: 60px; padding: 10px;
}
.scrollable_table_wrap td.table_icon_triangle {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><polygon points="12,4 4,20 20,20" fill="none" stroke="%23e5fff3" stroke-width="2"/></svg>');
	background-repeat: no-repeat; background-position: center; background-size: 60px; padding: 10px;
}
.scrollable_table_wrap table.scrollable_table td .link_btn {
	display: inline-block; background: var(--color-accent-gold); cursor: pointer;
	padding: 6px 10px; border-radius: 3px; color: #fff; font-weight: bold;
}

/* Pager */
div#pager ul.pagination {
	text-align: center; margin-left: 0px; letter-spacing: -.4em; height: 40px;
	margin-bottom: var(--margin_bottom_s); padding: 0;
}
@media only screen and (min-width: 738px){ div#pager ul.pagination { margin-bottom: var(--margin_bottom_ml); } }
div#pager ul.pagination.bottom { text-align: center; margin-top: 15px; }
@media only screen and (min-width: 738px){ div#pager ul.pagination.bottom { margin-bottom: var(--margin_bottom_ml); } }
div#pager ul.pagination li { display: none; } /* 基本非表示 */

/* SP Pager */
div#pager ul.pagination li.prev, div#pager ul.pagination li.next {
	padding: 0; position: relative; border-radius: 6px; background: var(--color-base-ivory);
	border: 1px solid var(--color-accent-gold); display: inline-block; width: 40%;
	height: 40px; text-align: center; margin: 0; letter-spacing: normal; transition: all 0.3s;
}
div#pager ul.pagination li.prev { margin-right: 10px; }
div#pager ul.pagination li.next { margin-left: 10px; }
div#pager ul.pagination li.prev a, div#pager ul.pagination li.next a {
	vertical-align: middle; position: absolute; top: 0; left: 0; height: 100%; display: table;
	color: var(--color-primary-navy); text-decoration: none; width: 100%; text-align: center; font-weight: bold;
}
div#pager ul.pagination li.prev span.prev_txt::after { content: "前の5件へ"; }
div#pager ul.pagination li.next span.next_txt::before { content: "次の5件へ"; }
div#pager ul.pagination li.disabled { opacity: 0.4; pointer-events: none; }
div#pager ul.pagination li a span { display: table-cell; vertical-align: middle; }

/* PC Pager */
@media only screen and (min-width: 738px){
	div#pager ul.pagination { text-align: right; }
	div#pager ul.pagination li {
		padding: 0; position: relative; border-radius: 50%; background: var(--color-base-ivory);
		border: 1px solid var(--color-accent-gold); display: inline-block; width: 40px;
		height: 40px; text-align: center; margin: 0 5px; font-size: 16px;
		letter-spacing: normal; font-family: 'Cinzel', serif; transition: all 0.3s;
	}
	div#pager ul.pagination li:not(.selected):not(.disabled):hover {
		background: var(--color-pastel-beige); transform: translateY(-2px);
	}
	div#pager ul.pagination li.prev, div#pager ul.pagination li.next { width: 40px; height: 40px; border-radius: 50%; }
	div#pager ul.pagination li.prev { margin-right: 5px; }
	div#pager ul.pagination li.next { margin-left: 5px; }
	div#pager ul.pagination li.selected {
		background-color: var(--color-accent-gold); border-color: var(--color-accent-gold);
		pointer-events: none; box-shadow: 0 2px 6px rgba(173, 135, 42, 0.3);
	}
	div#pager ul.pagination li a {
		vertical-align: middle; position: absolute; top: -1px; left: 0; height: 100%;
		display: table; color: var(--color-primary-navy); text-decoration: none; width: 100%; text-align: center;
	}
	div#pager ul.pagination li.selected a { font-weight: bold; color: #fff; }
	div#pager ul.pagination li.prev a, div#pager ul.pagination li.next a {
		width: 100%; height: 100%; position: absolute; top: -2px; left: 0;
	}
	div#pager ul.pagination li a span { height: 40px; line-height: 40px; }
	div#pager ul.pagination li.prev span.prev_txt::after { content: ""; }
	div#pager ul.pagination li.next span.next_txt::before { content: ""; }
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 7. Components (Forms)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* Form Block */
main .form_block { margin-top: 15px; margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ main .form_block { margin-bottom: var(--margin_bottom_ml); margin-top: 20px; } }
main .form_block .form_title { font-weight: bold; font-size: 16px; margin-bottom: 7.5px; }
@media only screen and (min-width: 738px){ main .form_block .form_title { font-size: 20px; margin-bottom: 10px; } }
main .form_block .value { margin-right: 7.5px; width: 100%; }
@media only screen and (min-width: 738px){ main .form_block .value { margin-right: 10px; width: 100%; } }
main .form_block mark.required {
	color: #ffffff; background-color: var(--color-accent-gold);
	margin-left: 6px; font-size: 10px; padding: 2px 8px; vertical-align: 2px;
}
@media only screen and (min-width: 738px){ main .form_block mark.required { margin-left: 10px; font-size: 12px; } }
main .form_block mark.optional {
	color: #ffffff; background-color: var(--color-brown-dark);
	margin-left: 6px; font-size: 10px; padding: 2px 8px; vertical-align: 2px;
}
@media only screen and (min-width: 738px){ main .form_block mark.optional { margin-left: 10px; font-size: 12px; } }

/* Inputs */
main .flex { display: flex; }
main input[type="text"], main input[type="number"], main input[type="email"], main input[type="password"], main input[type="search"] {
	border: 1px solid var(--color-gray); background-color: var(--color-base-ivory); cursor: text;
	-webkit-appearance: none; width: 100%; padding: 0px 7.5px; height: 40px; font: 400 15px Arial;
}
main input.white[type="text"], 
main input.white[type="number"], 
main input.white[type="email"], 
main input.white[type="password"], 
main input.white[type="search"] {
	background-color: var(--color-white);
}
@media only screen and (min-width: 738px){
	main input[type="text"], main input[type="number"], main input[type="email"], main input[type="password"], main input[type="search"] {
		padding: 0px 10px; height: 50px; font-size: 16px;
	}
}
main input::placeholder { color: #c0c0c0; }
main input[type="search"] { -webkit-appearance: searchfield; }
main input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/* Textarea */
main textarea {
	border: 1px solid var(--color-gray); background-color: var(--color-base-ivory);
	padding: 10px; width: 100%; max-width: 100%; min-height: 140px; line-height: 1.2;
	-webkit-appearance: none; overflow-y: scroll; -webkit-overflow-scrolling: touch;
	display: block; cursor: text; font: 400 16px Arial;
}
@media only screen and (min-width: 738px){ main textarea { min-height: 100px; overflow-y: visible; } }
main textarea::placeholder { color: #c0c0c0; }

/* Select Box */
.select_box { width: 200px; position: relative; margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ .select_box { margin-bottom: var(--margin_bottom_ml); } }
.select_box::after {
	content: ''; width: 8px; height: 8px; border: 0px;
	border-bottom: solid 1px var(--color-gray); border-right: solid 1px var(--color-gray);
	transform: rotate(45deg); position: absolute; top: 50%; right: 10px; margin-top: -6px; z-index: 1;
}
.select_box select {
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	width: 100%; height: 40px; background: transparent; position: relative; z-index: 1;
	padding: 0 40px 0 10px; border: 1px solid var(--color-gray);
	background: var(--color-base-ivory); font-size: 15px; cursor: pointer;
}
@media only screen and (min-width: 738px){ .select_box select { font-size: 16px; } }
.select_box select::-ms-expand { display: none; }

/* Radio Buttons */
main .radio input { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0, 0, 0, 0); }
main .radio label { display: inline-block; position: relative; cursor: pointer; margin-left: 10px; padding: 8px 20px; }
main .radio label:before {
	position: absolute; content: ""; top: 50%; left: -10px; width: 20px; height: 20px;
	margin-top: -10px; background: var(--color-base-ivory); border: 1px solid var(--color-black); border-radius: 50%;
}
main .radio input[type="radio"]:checked + label:after {
	position: absolute; content: ""; top: 50%; left: -5px; width: 10px; height: 10px;
	margin-top: -5px; border-radius: 50%; background: var(--color-accent-gold);
}

/* Checkbox */
main .checkbox input {
	position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0, 0, 0, 0);
	display: flex; justify-content: center; align-items: center; margin-top: 3px;
}
main .checkbox label { display: inline-block; position: relative; cursor: pointer; margin-left: 10px; padding: 8px 20px; }
main .checkbox label:before {
	position: absolute; content: ""; top: 50%; left: -10px; width: 20px; height: 20px;
	margin-top: -10px; background: var(--color-base-ivory); border: 1px solid var(--color-black);
}
main .checkbox input[type="checkbox"]:checked + label:after {
	position: absolute; content: ""; top: 50%; left: -6px; margin-top: -5px;
	width: 12px; height: 8px; border-left: 3px solid var(--color-accent-gold);
	border-bottom: 3px solid var(--color-accent-gold); transform: rotate(-45deg);
}
main .checkbox_devision_block { display: flex; flex-wrap: wrap; gap: 15px; }
main .checkbox_devision_block .checkbox { width: calc(100% / 2); display: flex; align-items: center; }
main .checkbox_devision_block.one_row .checkbox { width: 100%; }
@media only screen and (min-width: 738px){
	main .checkbox_devision_block .checkbox { width: calc(100% / 4); }
	main .checkbox_devision_block.one_row .checkbox { width: calc(100% / 2); }
}

/* Upload Boxes (Img/Video) */
main .img_upload_box_container, main .video_upload_box_container { font-size: 0px; }
main .img_upload_box, main .video_upload_box { display: block; position: relative; cursor: pointer; }
main input[type="file"] {
	opacity: 0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
	position: absolute; right: 0; top: 0; margin: 0; font-size: 100px; cursor: pointer; height: 100%; width: 100%;
}
main .img_upload_box label, main .video_upload_box label {
	background: var(--color-base-ivory); border: 1px solid var(--color-gray);
	padding: 10px; border-radius: 3px; display: inline-block;
	vertical-align: bottom; position: relative; height: 300px; width: 100%;
}
main .img_upload_box label i.fa-file, main .video_upload_box label i.fa-file {
	font-size: 40px; position: absolute; top: 30%; left: calc(50% - 15px); margin-right: 0px; color: var(--color-gray);
}
main .img_upload_box span.insert_img_txt, main .video_upload_box span.insert_video_txt {
	position: absolute; top: calc(50% - 20px); padding: 10px; left: 0;
	width: 100%; text-align: center; box-sizing: border-box; font-size: 15px;
}
main .img_upload_box div.update_img_txt, main .video_upload_box div.update_video_txt { display: none; }
main .img_upload_box button.clear_img_btn, main .video_upload_box button.clear_video_btn {
	opacity: 1; padding: 4px 8px; color: var(--color-accent-gold);
	z-index: 7; border: 2px solid var(--color-accent-gold); border-radius: 5px;
	position: absolute; top: auto; bottom: 10px; right: 10px; background: transparent; display: none; cursor: pointer;
}
main .img_upload_box .img_display_box img, main .video_upload_box .video_display_box video {
	max-height: 238px; width: auto;
}
main .video_upload_box .video_display_box video { width: 100%; }

/* Form Comments & Errors */
main .comment { color: #808080; font-size: 12px; margin-bottom: 9px; margin-top: 3px; }
@media only screen and (min-width: 738px){ main .comment { font-size: 14px; margin-bottom: 12px; margin-top: 4px; } }
main .comment.info { font-weight: bold; color: var(--color-green); }
main .comment.error { font-weight: bold; color: var(--color-red); }
main .background_error {
	font-weight: bold; color: var(--color-red); text-align: center;
	background-color: var(--color-pastel-red); margin: 0px auto 15px auto;
	padding: 7.5px 22.5px; max-width: 300px; font-size: 10.5px; border-radius: 6px;
}
@media only screen and (min-width: 738px){
	main .background_error { margin: 0px auto 25px auto; padding: 10px 30px; max-width: 400px; font-size: 14px; border-radius: 8px; }
}
main .comment.negative_margin { margin-top: calc(var(--margin_bottom_s) * -1); margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ main .negative_margin { margin-top: calc(var(--margin_bottom_ml) * -1); margin-bottom: var(--margin_bottom_ml); } }
main .comment.cb_radio_bottom { margin-top: -5px; }
main .comment.margin_none { margin-top: 0px; margin-bottom: 0px; }

/* Datepicker Overrides */
main .ui-widget-header { border: 1px solid var(--color-accent-gold); background: var(--color-accent-gold) url(images/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x; color: #fff; font-weight: bold; }
main .ui-state-default, main .ui-widget-content .ui-state-default, main .ui-widget-header .ui-state-default, main .ui-button { border: 1px solid var(--color-base-ivory); background: var(--color-base-ivory) url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #808080; }
main table.ui-datepicker-calendar span { color: #808080; }
main .ui-state-highlight, main .ui-widget-content .ui-state-highlight { border: 1px solid var(--color-brown-dark); background: var(--color-brown-dark); color: #ffffff; }
main .ui-state-active, main .ui-widget-content .ui-state-active { border: 1px solid var(--color-accent-gold); background: var(--color-accent-gold) url(images/ui-bg_inset-hard_100_f5f8f9_1x100.png) 50% 50% repeat-x; font-weight: bold; color: #ffffff; }
main .ui-datepicker .ui-datepicker-prev span, main .ui-datepicker .ui-datepicker-next span { cursor: pointer; }
main .ui-datepicker-header a:hover { background: var(--color-base-ivory); display: block; cursor: pointer; }

/* Form Details */
main .form_block .detail_title { margin-bottom: 6px; font-weight: bold; }
main .form_block .detail_title.with_icon { display: flex; align-items: center; margin-bottom: 10px; }
main .form_block .value.size_100_percent { width: 100%; }
main .form_block .flex_group { display: flex; align-items: center; }
main .form_block .value.zip_1 { width: 70px; }
main .form_block .value.zip_2 { width: 95px; margin: 0 0 0 7.5px; }
main input[type="text"].bg_white_input, main textarea.bg_white_input { background: var(--color-base-ivory); }
main textarea.trip_area { min-height: 100px; }
main textarea.message { min-height: 200px; }
main .bg_gray_box { background: #f3f3f3; border-radius: 5px; padding: 10px; font-size: 12px; }
main .bg_gray_box .example_img { margin: 5px 0; text-align: center; }
@media only screen and (min-width: 738px){ main .bg_gray_box .example_img { text-align: left; } }
main .bg_gray_box .example_img img { margin-bottom: 0; width: 300px; }

/*--------------------------------------------------------
■ プルダウン
--------------------------------------------------------*/
/* .form_block を削除して汎用的にしました */
main .pull_down {
	display: block;
	position: relative;
	width: 250px;
	max-width: 100%; /* はみ出し防止 */
}

main .pull_down:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 40px;
	height: 48px;
	background: var(--color-accent-gold);
	pointer-events: none;
	border-radius: 0 3px 3px 0;
	z-index: 1;
}

main .pull_down:after {
	position: absolute;
	top: 0;
	right: 11px;
	height: 48px;
	width: 18px;
	color: #ffffff;
	font-family: 'Font Awesome 6 Pro';
	content: '\f107'; /* FontAwesomeの矢印コード */
	font-size: 28px;
	pointer-events: none;
	z-index: 2;
	line-height: 48px; /* 上下中央配置 */
}

main .pull_down select {
	display: inline-block;
	width: 100%;
	padding: 0px 7.5px;
	border: 1px solid var(--color-gray);
	border-radius: 3px;
	height: 48px;
	background: var(--color-base-ivory);
	color: #000;
	font-size: 15px;
	/* デフォルトの矢印を消す */
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
}
main .pull_down select.white {
	background: var(--color-white);
}

/* フォーカス時に勝手につく枠線を削除し、ゴールドに */
main .pull_down select:focus {
	outline: none;
	border-color: var(--color-accent-gold);
}
main .txt_count { text-align: right; margin-top: 5px; }
main .form_block .blue_table th.day { width: 50px; }
main .form_block .blue_table tr.border_none { border-bottom: none; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 8. Components (Modules/Boxes)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/* ■■■ sub_box (共通設定) ■■■ */

/* --- 右サイドバーの表示制御 --- */
/* PCサイズ未満では右サイドバーの中身を非表示 */
.right_box .sub_box_block { display: none; }
/* PCサイズ(1117px以上)で表示 */
@media only screen and (min-width: 1117px){ 
    .right_box .sub_box_block { display: flex; } 
}

/* --- ブロック全体の基本設定 --- */
.sub_box_block { 
    display: flex; 
    flex-direction: column; /* 基本は縦並び */
    gap: 20px; 
    width: 100%;
}

.sub_box_col { 
    display: flex; 
    flex-direction: column; 
    gap: 20px; 
    width: 100%; 
}


/* ■■■ 下部エリア専用 (.bottom) ■■■ */
/* タブレット以上で初めて「横並び（2列）」にする */
@media only screen and (min-width: 738px){ 
    
    /* .bottom クラスがついている場合のみ横並び */
    .sub_box_block.bottom { 
        flex-direction: row; 
        justify-content: space-between;
        gap: 25px; 
    }
    
    /* 下部エリアのカラム幅 */
    .sub_box_block.bottom .sub_box_col { 
        width: calc((100% - 25px) / 2); 
    }
}


/* ■■■ 【重要】右サイドバーの強制縦並び修正 ■■■ */
/* 画面幅に関係なく、right_boxの中にある時は絶対に縦並びにする */
.right_box .sub_box_block {
    flex-direction: column !important;
}
.right_box .sub_box_col {
    width: 100% !important;
}


/* ■■■ 各ボックスのデザイン（変更なし） ■■■ */
.sub_box { display: flex; flex-direction: column; width: 100%; }

.sub_box .sub_box_title {
    color: #ffffff; font-weight: bold; padding: 12px 10px; background: var(--color-primary-navy); text-align: left;
}
.sub_box .sub_box_content { border: 1px solid var(--color-primary-navy); padding: 10px; }
.sub_box.is_developer .sub_box_title {
    background: var(--color-black);
}
.sub_box.is_developer .sub_box_content { border: 1px solid var(--color-black); padding: 10px;}
@media only screen and (min-width: 738px){ .sub_box .sub_box_content { padding: 10px 15px; } }

.sub_box .sub_box_content ul { margin-left: 0px; list-style-type: none; }
.sub_box p, .sub_box ul, .sub_box ol, .sub_box img, .sub_box div.mswa_ms { margin-bottom: 8px; }
.sub_box ul ul, .sub_box ul ol, .sub_box ol ul, .sub_box ol ol { margin-bottom: 8px; }
.sub_box ul li:first-child { margin-top: 0px; }
.sub_box ul li { padding: 0px; }
@media only screen and (min-width: 738px){
    .sub_box p, .sub_box ul, .sub_box ol, .sub_box img, .sub_box div.mswa_ms { margin-bottom: 10px; }
    .sub_box ul ul, .sub_box ul ol, .sub_box ol ul, .sub_box ol ol { margin-bottom: 10px; }
}
.sub_box ul li a { padding: 8px 0; display: block; color: var(--color-black); }









/* page_link_box */
.page_link_box {
	padding: 30px 20px 17px 20px; overflow: visible; margin-bottom: var(--margin_bottom_s);
	border: 1px solid var(--color-accent-gold); max-width: 1117px; margin-top: 50px;
	margin-right: auto; margin-left: auto; position: relative;
}
div.inner > .page_link_box:first-child{
	margin-top: 0px;
}
@media only screen and (min-width: 738px){ .page_link_box { padding: 45px 30px 22px 30px; margin-bottom: var(--margin_bottom_ml); } }
.page_link_box .corner {
	position: absolute; width: 20px; height: 20px; background: var(--color-pastel-beige); box-sizing: border-box;
}
.page_link_box .top_left { top: -1px; left: -1px; border-bottom: 1px solid var(--color-accent-gold); border-right: 1px solid var(--color-accent-gold); border-bottom-right-radius: 100%; }
.page_link_box .top_right { top: -1px; right: -1px; border-bottom: 1px solid var(--color-accent-gold); border-left: 1px solid var(--color-accent-gold); border-bottom-left-radius: 100%; }
.page_link_box .bottom_left { bottom: -1px; left: -1px; border-top: 1px solid var(--color-accent-gold); border-right: 1px solid var(--color-accent-gold); border-top-right-radius: 100%; }
.page_link_box .bottom_right { bottom: -1px; right: -1px; border-top: 1px solid var(--color-accent-gold); border-left: 1px solid var(--color-accent-gold); border-top-left-radius: 100%; }
.page_link_box .page_link_box_title {
	position: absolute; font-size: 16px; font-weight: bold; color: var(--color-accent-gold);
	text-align: center; background: var(--color-pastel-beige); top: 0; left: 50%;
	transform: translateY(-50%) translateX(-50%); height: 60px; padding: 0px 20px;
	display: flex; justify-content: center; align-items: center; flex-direction: column;
}
@media only screen and (min-width: 738px){ div.page_link_box .page_link_box_title { font-size: 17px; } }
.page_link_box .page_link_box_title_jp, .page_link_box .page_link_box_title_en { display: block; }
.page_link_box .page_link_box_title_en { font-family: 'Cinzel', serif; }
.page_link_box ul, .page_link_box ol, .page_link_box ul a, .page_link_box ol a { font-weight: bold; color: var(--color-black); margin-bottom: 0px; }
.page_link_box ul ul, .page_link_box ul ol, .page_link_box ol ul, .page_link_box ol ol, .page_link_box ul ul a { font-weight: normal; }
.page_link_box a { display: block; padding: 6px 0; }
.page_link_box ol li, .page_link_box ul li { padding: 0; }
.page_link_box ol li ol li:nth-child(1), .page_link_box ol li ul li:nth-child(1) { padding-top: 0; }
.page_link_box > ul > li + li { margin-top: 15px; }

/* border_box */
.border_box {
	position: relative; margin-top: 25px; margin-bottom: var(--margin_bottom_s); padding: 6px;
}
@media only screen and (min-width: 738px){ .border_box { margin-top: 30px; margin-bottom: var(--margin_bottom_ml); } }
.border_box .border_box_inner { width: 100%; height: 100%; padding: 20px 20px 17px 20px; }
@media only screen and (min-width: 738px){ .border_box .border_box_inner { padding: 30px 30px 22px 30px; } }
.border_box div.title {
	position: absolute; font-size: 18px; font-weight: bold; color: var(--color-primary-navy);
	text-align: center; background: var(--color-pastel-beige); top: 0; left: 50%;
	transform: translateY(-50%) translateX(-50%); height: 20px; padding: 0px 20px;
	display: flex; justify-content: center; align-items: center;
}
@media only screen and (min-width: 738px){ .border_box div.title { padding: 0 15px; font-size: 20px; } }
.border_box.navy { border: solid 3px var(--color-primary-navy); }
.border_box.brown { border: solid 3px var(--color-brown-dark); }
.border_box.gold { border: solid 3px var(--color-accent-gold); }
.border_box.navy .border_box_inner { border: solid 1px var(--color-primary-navy); }
.border_box.brown .border_box_inner { border: solid 1px var(--color-brown-dark); }
.border_box.gold .border_box_inner { border: solid 1px var(--color-accent-gold); }
.border_box.navy div.title { color: var(--color-primary-navy); }
.border_box.brown div.title { color: var(--color-brown-dark); }
.border_box.gold div.title { color: var(--color-accent-gold); }
.border_box p, .border_box ul, .border_box ol { margin-bottom: 8px; }
@media only screen and (min-width: 738px){ .border_box p, .border_box ul, .border_box ol { margin-bottom: 10px; } }

/* background_box */
.background_box { overflow: hidden; margin-bottom: var(--margin_bottom_s); padding: 20px 20px 17px 20px; }
@media only screen and (min-width: 738px){ .background_box { padding: 30px 30px 22px 30px; margin-bottom: var(--margin_bottom_ml); } }
.background_box div.title { font-size: 18px; font-weight: bold; margin-bottom: 18px; }
@media only screen and (min-width: 738px){ .background_box div.title { font-size: 20px; margin-bottom: 20px; } }
.background_box.beige { background-color: var(--color-beige); }
.background_box.white { background-color: var(--color-base-ivory); }
.background_box.gold { background-color: var(--color-accent-gold-light); }
.background_box.beige a, .background_box.gold a { color: var(--color-navy); }
.background_box.beige .title { color: var(--color-black); }
.background_box.white .title { color: var(--color-primary-navy); }
.background_box .ol_circle .title { margin-bottom: 10px; }
@media only screen and (min-width: 738px){ .background_box .ol_circle .title { margin-bottom: 15px; } }
.background_box p, .background_box ul, .background_box ol { margin-bottom: 8px; }
@media only screen and (min-width: 738px){ .background_box p, .background_box ul, .background_box ol { margin-bottom: 10px; } }

/* writer_box */
.writer_box {
	margin-top: 50px; margin-bottom: var(--margin_bottom_s); position: relative;
	border: solid 1px var(--color-accent-gold); display: flex; align-items: center;
	padding: 25px 10px 10px 10px; gap: 10px;
}
@media only screen and (min-width: 738px){ .writer_box { margin-bottom: var(--margin_bottom_ml); } }
.writer_box .writer_box_title {
	position: absolute; top: -2.1rem; left: -1px;
	background: var(--color-accent-gold); color: #fff; padding: 3px 10px;
}
.writer_box img { max-width: 80px; margin-bottom: 0px; }
.writer_box .profile_block { display: flex; flex-direction: column; }
.writer_box .profile_block .writer_name { margin-bottom: 5px; }

/* balloon_block */
.balloon_block { display: flex; gap: 10px; align-items: flex-start; margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ .balloon_block { margin-bottom: var(--margin_bottom_ml); } }
.balloon_block .balloon {
	width: calc(100% - 75px); background: var(--color-pastel-blue); border-radius: 10px;
	padding: 7px 10px 0 10px; position: relative; color: #202020;
}
@media only screen and (min-width: 738px){ .balloon_block .balloon { padding: 11px 15px 0 15px; } }
.balloon_block.writer .balloon { background: var(--color-beige); }
.balloon_block .balloon:after {
	content: ""; position: absolute; top: 50%; left: 100%; margin-top: -10px;
	border: 10px solid transparent; border-left: 10px solid var(--color-pastel-blue);
}
.balloon_block.writer .balloon:after {
	content: ""; position: absolute; top: 50%; left: -20px; margin-top: -10px;
	border: 10px solid transparent; border-right: 10px solid var(--color-beige);
}
.balloon_block .balloon p { margin-bottom: 8px; }
.balloon_block .balloon ul { margin-bottom: 8px; margin-top: 5px; }
.balloon_block .icon img { width: 75px; margin-bottom: 0px; }

/* adsense */
div.main_box div.adsense { margin-left: -5px; margin-right: -5px; margin-bottom: var(--margin_bottom_s); }
@media only screen and (min-width: 738px){ div.main_box div.adsense { margin-left: 0px; margin-right: 0px; margin-bottom: var(--margin_bottom_ml); } }

/* First View */
div.first_view { width: 100%; position: relative; }
div.first_view::before {
	content: ""; position: absolute; top: 0; left: 0; width: 35%; aspect-ratio: 470/606;
	background-size: contain; background-repeat: no-repeat; z-index: 1;
	background-image: url(../../img/evt/top/img_first_view_decoration_left.png);
}
div.first_view::after {
	content: ""; position: absolute; top: 0px; right: 0; width: 35%; aspect-ratio: 470/606;
	background-size: contain; background-repeat: no-repeat; z-index: 1;
	background-image: url(../../img/evt/top/img_first_view_decoration_right.png);
}
@media only screen and (min-width: 738px){ div.first_view::before, div.first_view::after { width: 15%; } }
div.first_view .first_view_main_img { width: 100%; }
div.first_view .first_view_txt { width: 130px; position: absolute; top: 5%; right: 2%; z-index: 2; }
@media only screen and (min-width: 738px){ div.first_view .first_view_txt { width: 400px; top: 30%; right: 0%; } }
@media only screen and (min-width: 1117px){ div.first_view .first_view_txt { width: 600px; top: 17%; right: 10%; } }
@media only screen and (min-width: 1440px){ div.first_view .first_view_txt { width: 800px; top: 26%; right: 10%; } }
div.first_view .first_view_news_box {
	position: absolute; bottom: 34%; left: 50%; transform: translateX(-50%);
	background-image: url(../../img/evt/top/img_first_view_old_paper.png);
	background-size: cover; background-position: center; width: 90%; aspect-ratio: 2752/353;
	max-width: 600px; padding: 10px 10px; display: flex; align-items: center; justify-content: center; z-index: 2;
}
@media only screen and (min-width: 738px){ div.first_view .first_view_news_box { width: 60%; bottom: 15%; } }
@media only screen and (min-width: 1117px){ div.first_view .first_view_news_box { width: 60%; bottom: 35%; } }
div.first_view .first_view_news_txt { line-height: 1.6; color: #492d1c; margin-bottom: 0px; }
@media only screen and (min-width: 738px){ div.first_view .first_view_news_txt { font-size: 1.1rem; } }
@media only screen and (min-width: 1117px){ div.first_view .first_view_news_txt { font-size: 1.5rem; } }
div.first_view .first_view_view_more_btn a {
	background: var(--color-accent-gold); color: #fff; font-size: 0.8rem; padding: 5px;
	border-radius: 5px; cursor: pointer;
}
div.first_view .first_view_logo { position: absolute; width: 110px; left: 5px; top: 5px; z-index: 2; }
@media only screen and (min-width: 738px){ div.first_view .first_view_logo { width: 160px; left: 10px; top: 10px; } }
@media only screen and (min-width: 1117px){ div.first_view .first_view_logo { width: 250px; } }
div.first_view .first_view_logo_img { width: 100%; }

/* door_box */
.door_box {
	background: var(--color-base-ivory); margin-top: 92px; position: relative; padding-top: 50px;
	width: calc(100% - 20px); margin-right: auto; margin-left: auto; margin-bottom: 70px; max-width: 1117px;
}
@media only screen and (min-width: 738px){ .door_box { margin-top: 386px; margin-bottom: 250px; } }
@media only screen and (min-width: 1117px){ .door_box { margin-top: 504px; margin-bottom: 250px; } }
.door_box::before {
	position: absolute; top: 1px; content: ""; display: block; width: 100%; aspect-ratio: 1320/730;
	background-image: url(../../img/evt/top/img_bg_door_top.png); background-size: cover;
	background-position: center; z-index: 1; transform: translateY(-100%);
}
.door_box::after {
	position: absolute; bottom: 1px; content: ""; display: block; width: 100%; aspect-ratio: 1320/247;
	background-image: url(../../img/evt/top/img_bg_door_bottom.png); background-size: cover;
	background-position: center; z-index: 1; transform: translateY(100%);
}
.door_box .door_box_content {
	margin-top: -221px; position: relative; z-index: 2; text-align: center; padding: 0px 20px; width: 100%;
}
@media only screen and (min-width: 738px){ .door_box .door_box_content { margin-top: -400px; padding: 0px 40px; } }
@media only screen and (min-width: 1117px){ .door_box .door_box_content { margin-top: -474px; } }
.door_box .door_box_content::before {
	position: absolute; bottom: -100px; left: -80px; content: ""; display: block;
	width: 220px; aspect-ratio: 620/940; background-image: url(../../img/evt/top/img_decoration_rose_left.png);
	background-size: cover; background-position: center; z-index: 1;
}
.door_box .door_box_content::after {
	position: absolute; top: 0px; right: -80px; content: ""; display: block;
	width: 200px; aspect-ratio: 55/94; background-image: url(../../img/evt/top/img_decoration_poppy_right.png);
	background-size: cover; background-position: center; z-index: 1;
}
@media only screen and (min-width: 738px){
	.door_box .door_box_content::before { width: 280px; }
	.door_box .door_box_content::after { width: 250px; }
}
@media only screen and (min-width: 1117px){
	.door_box .door_box_content::before { width: 380px; left: -200px; bottom: -200px; }
	.door_box .door_box_content::after { width: 350px; top: -50px; right: -150px; }
}
.door_box .door_box_title {
	margin-bottom: 25px; display: block; color: var(--color-primary-navy); font-weight: 600; font-size: 1.1rem;
}
@media only screen and (min-width: 738px){ .door_box .door_box_title { font-size: 2rem; margin-bottom: 50px; line-height: 3rem; } }
.door_box .door_box_txt { line-height: 3rem; font-size: 1.1rem; }

/* feature_block */
.feature_block .feature_item {
	display: grid; grid-template-columns: 1fr; position: relative; overflow: hidden;
}
@media (min-width: 738px) {
	.feature_block .feature_item { grid-template-columns: 2fr 3fr; align-items: stretch; }
}
.feature_txt_container, .feature_img_container { position: relative; z-index: 1; }
.feature_block .feature_txt_container {
	display: flex; align-items: center; background: var(--color-primary-navy); padding: 10px; position: relative; z-index: 1;
}
@media (min-width: 738px) { .feature_block .feature_txt_container { max-width: 100%; margin: 0px; } }
.feature_block .yellow .feature_txt_container { background: var(--color-accent-gold); }
.feature_block .feature_txt_container::before {
	content: ""; position: absolute; inset: 0; background-image: url(../../img/evt/top/img_bg_pattern.png);
	background-size: cover; background-repeat: no-repeat; background-position: center;
	opacity: 0.1; pointer-events: none; z-index: 2;
}
.feature_block .yellow .feature_txt_container::before { opacity: 0.2; }
.feature_block .feature_txt_border_outer { border: 3px solid #fff; padding: 6px; width: 100%; height: 100%; }
.feature_block .feature_txt_border_inner {
	border: 1px solid #fff; padding: 30px 40px 40px 40px; width: 100%; height: 100%;
	text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column;
}
.feature_block .feature_num { color: var(--color-accent-gold); font-size: 2rem; }
.feature_block .yellow .feature_num { color: var(--color-accent-gold-light); }
.feature_block .feature_title_small { color: #fff; font-size: 1.1rem; }
.feature_block .feature_title { color: #fff; font-size: 1.8rem; margin-top: 1.5rem; margin-bottom: 2rem; }
.feature_block .feature_txt { color: #fff; }
.feature_block .feature_txt a { color: #fff; text-decoration: underline; }
@media (min-width: 738px) {
	.feature_block .feature_num { font-size: 2.5rem; }
	.feature_block .feature_title_small { font-size: 1.5rem; }
	.feature_block .feature_title { font-size: 2.2rem; }
	.feature_block .feature_txt { font-size: 1.1rem; }
}
.feature_block .feature_img_container { display: flex; }
.feature_block .feature_img { width: 100%; height: 100%; object-fit: cover; }

/* information_block */
.information_block {
    width: calc(100% - 20px);
    max-width: 1117px;
    margin-right: auto;
    margin-left: auto;
    padding: 6px;
    background: var(--color-base-ivory);
    border: 3px solid var(--color-primary-navy);
}

/* information_inner: 内側の二重線枠 */
.information_block .information_inner {
    padding: 12px 12px 9px 12px;
    border: 1px solid var(--color-primary-navy);
}

/* information_post: 各お知らせの行設定 */
.information_block .information_post {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px; /* モバイル時の間隔を少し広めに調整 */
    padding: 12px 8px;
    border-bottom: 1px solid var(--color-gray);
}

.information_block .information_post:last-child {
    border: none;
}

/* information_data: 日付とラベルのセット */
.information_block .information_data {
    display: flex;
    flex-shrink: 0; /* タイトルに押されて潰れるのを防ぐ */
    gap: 8px;
    align-items: center;
}

/* information_date: 日付 */
.information_block .information_date {
    margin-bottom: 0;
    color: var(--color-primary-navy);
    font-weight: 500;
}

/* information_label: お知らせラベル */
.information_block .information_label {
    padding: 2px 6px;
    font-size: 0.8rem;
    color: #fff;
    white-space: nowrap; /* ラベル内の改行を禁止 */
    background: var(--color-primary-navy);
    border-radius: 4px;
}

/* information_title: タイトルテキスト */
.information_block .information_title {
    font-size: 1rem;
    line-height: 1.5;
    word-break: break-all; /* 長い英数字の連続でも枠外にはみ出さないようにする */
}

/* information_link: 擬似要素による行全体のリンク化 */
.information_block .information_link {
    color: var(--color-black);
    text-decoration: none;
}

.information_block .information_link::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

/* --- PC表示の調整（738px以上） --- */
@media (min-width: 738px) {
    .information_block .information_post {
        flex-direction: row;
        gap: 16px; /* 日付ラベルとタイトルの間隔 */
        padding: 16px 10px;
        align-items: flex-start; /* 2行になってもラベルを上端に固定 */
        transition: background-color 0.3s ease;
    }

    .information_block .information_post:hover {
        background: #f8f8f8;
    }
}
/* data_list */
.data_list { margin-right: auto; margin-left: auto; max-width: 1117px; margin-bottom: var(--margin_bottom_s); }
@media (min-width: 738px) { .data_list { margin-bottom: var(--margin_bottom_ml); } }
.data_list.decoration { position: relative; }
.data_list.decoration::before {
	position: absolute; bottom: -100px; left: -65px; content: ""; display: block;
	width: 200px; aspect-ratio: 62/94; background-image: url(../../img/evt/top/img_decoration_rose_left.png);
	background-size: cover; background-position: center; z-index: -1;
}
.data_list.decoration::after {
	position: absolute; top: -200px; right: -50px; content: ""; display: block;
	width: 200px; aspect-ratio: 55/94; background-image: url(../../img/evt/top/img_decoration_poppy_leaf_right.png);
	background-size: cover; background-position: center; z-index: -1;
}
@media (min-width: 738px) {
	.data_list.decoration::before { width: 250px; }
	.data_list.decoration::after { width: 250px; }
}
.data_list .data_group {
	display: flex; flex-direction: column; border-bottom: 1px solid var(--color-gray); padding: 15px 8px; position: relative; z-index: 3;
}
@media (min-width: 738px) {
	.data_list .data_group { flex-direction: row; align-items: baseline; }
}
.data_list .data_term { font-weight: bold; font-size: 1.2rem; margin-bottom: 10px; }
@media (min-width: 738px) { .data_list .data_term { width: 20%; margin-bottom: 0px; } }
.data_list .data_desc { display: inline-block; font-size: 1.0rem; }
.data_list .data_desc a { display: inline-block; color: 1px solid var(--color-black); text-decoration: underline; }
@media (min-width: 738px) { .data_list .data_desc { width: 80%; } }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ evt_card_list (Event Cards)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

.evt_card_list {
	display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){ .evt_card_list { margin-bottom: var(--margin_bottom_ml); } }

/* カードのベーススタイル */
.evt_card_list .evt_card__item {
	position: relative; background: var(--color-base-ivory); border: 1px solid var(--color-gray);
	border-radius: 8px; width: 100%; box-shadow: 0 1px 4px rgba(0,0,0,0.05);
	transition: all 0.3s ease; display: flex; flex-direction: column;
}
@media only screen and (min-width: 738px) { .evt_card_list .evt_card__item { width: calc(50% - 10px); } }

/* ★修正：リンクがある時（アクティブ）のホバー設定 */
.evt_card_list .evt_card__item:has(.card_link):hover {
	box-shadow: 0 8px 20px rgba(0,0,0,0.15); /* 影を濃く大きく */
	transform: translateY(-4px);              /* グイッと持ち上げる */
	border-color: var(--color-accent-gold);
	background-color: #fffcf5;                /* ほんのり色をつけて反応を示す */
	cursor: pointer;
	z-index: 10;
}

/* ★修正：リンクがない時（非活性）の設定 */
.evt_card_list .evt_card__item:not(:has(.card_link)) {
	cursor: default;           /* 指マークにしない */
	background: #f0f0f0;       /* 背景をグレーに */
	border-color: #bbb;        /* 枠線を薄く */
	box-shadow: none;          /* 影を消してフラットに */
	opacity: 0.8;              /* 全体を半透明に */
	filter: grayscale(100%);   /* 色味を消して白黒に */
	transform: none !important;/* 動きを無効化 */
	pointer-events: none;      /* クリック判定自体を無効化 */
}

/* リンク要素（枠全体に広がる） */
.evt_card_list .evt_card__item .card_link {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
}

/* カード内部のレイアウト */
.evt_card_list .evt_card__item .card_head {
	padding: 15px 15px 5px; display: flex; justify-content: space-between; align-items: center;
}
.evt_card_list .evt_card__item .badge_group {
	display: flex; gap: 5px; align-items: center; width: 100%; justify-content: space-between;
}
.evt_card_list .label_badge {
	color: #fff; font-size: 11px; font-weight: bold; padding: 3px 10px;
	border-radius: 4px; display: inline-block; line-height: 1.4; white-space: nowrap;
}

.evt_card_list .label_blue { background-color: var(--color-primary-navy); }
.evt_card_list .label_pink { background-color: var(--color-red); }
.evt_card_list .label_cyan { background-color: #1098ad; }
.evt_card_list .label_green { background-color: var(--color-green); }
.evt_card_list .label_gold { background-color: var(--color-accent-gold); }
.evt_card_list .status_text { font-size: 12px; font-weight: bold; margin-left: auto; }
.evt_card_list .text_green { color: var(--color-green); }
.evt_card_list .text_gray { color: var(--color-gray); }

.evt_card_list .evt_card__item .card_body { padding: 5px 15px; flex-grow: 1; }
.evt_card_list .title_row { display: flex; align-items: center; gap: 12px; margin: 10px 0 15px; }

.evt_card_list .calendar_box {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 108px; height: 52px; background: var(--color-base-ivory); border: 1px solid var(--color-primary-navy);
	border-radius: 6px; flex-shrink: 0; box-shadow: 0 2px 4px rgba(0,0,0,0.05); line-height: 1; overflow: hidden;
}
.evt_card_list .cb_year {
	font-size: 10px; font-weight: bold; color: #fff; background-color: var(--color-primary-navy);
	width: 100%; text-align: center; padding: 3px 0; letter-spacing: 0.1em;
}
.evt_card_list .cb_date {
	font-size: 13px; font-weight: bold; color: var(--color-black);
	padding: 6px 2px 4px; white-space: nowrap; letter-spacing: -0.02em;
}

.evt_card_list .evt_card__item .event_title {
	font-size: 18px;
	font-weight: bold;
	color: var(--color-primary-navy);
	line-height: 1.4;
	border-bottom: none;
	margin: 0;
	padding-top: 4px; 
}
.evt_card_list .capacity_block { margin-bottom: 12px; font-size: 12px; color: var(--color-brown-dark); }
.evt_card_list .capacity_text { display: flex; justify-content: space-between; margin-bottom: 4px; }
.evt_card_list .capacity_text .val strong { font-size: 14px; color: var(--color-black); border-bottom: none; }
.evt_card_list .progress_bar {
	width: 100%; height: 6px; background: var(--color-pastel-beige); border-radius: 3px; overflow: hidden;
}
.evt_card_list .progress_fill { height: 100%; background: var(--color-green); border-radius: 3px; }
.evt_card_list .progress_fill.gray { background: var(--color-gray); }

.evt_card_list .evt_card__item .event_info { list-style: none; margin: 0; padding: 0; font-size: 14px; color: var(--color-brown-dark); }
.evt_card_list .evt_card__item .event_info li { margin-bottom: 6px; display: flex; align-items: center; }
.evt_card_list .evt_card__item .event_info li .icon_wrap {
	display: flex; align-items: center; justify-content: center; width: 24px; flex-shrink: 0; margin-right: 4px;
}
.evt_card_list .evt_card__item .event_info li i { color: var(--color-accent-gold); font-size: 16px; }

.evt_card_list .evt_card__item .card_footer {
	border-top: 1px dashed var(--color-gray); padding: 10px 15px;
	background-color: var(--color-pastel-beige); border-radius: 0 0 8px 8px;
}
.evt_card_list .evt_card__item .meta_row { display: flex; font-size: 12px; margin-bottom: 4px; }
.evt_card_list .evt_card__item .meta_row dt {
	color: var(--color-primary-navy); font-weight: bold; width: 3em; flex-shrink: 0;
}
.evt_card_list .evt_card__item .meta_row dd {
	color: var(--color-black); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.evt_card_list .evt_card__item .meta_row dd i { color: var(--color-accent-gold); font-size: 11px; }
.evt_card_list .evt_card__item .card_footer.center_single { min-height: 56px; display: flex; align-items: center; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 9. Components (Modal Window)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

.modal_window {
	display: none;
	position: fixed; top: 0; left: 0; width: 100%; height: 100vh;
	background-color: rgba(22, 40, 79, 0.6); /* --color-primary-navy の半透明 */
	z-index: 2000; /* Headerより上 */
	opacity: 0; transition: opacity 0.3s ease;
}
.modal_window.show {
	display: flex; justify-content: center; align-items: center;
	opacity: 1;
}

/* Modal Content Box */
.modal_window .content {
	display: flex; flex-direction: column; justify-content: space-between;
	background: var(--color-base-ivory);
	padding: 40px 20px 30px;
	width: calc(100% - 30px); max-width: 500px; min-height: 250px;
	border-radius: 8px; box-shadow: 0 5px 15px rgba(0,0,0,0.2);
	position: relative; margin: 0 15px; gap: 20px;
	transform: translateY(20px); transition: transform 0.3s ease;
}
.modal_window.show .content { transform: translateY(0); }

@media only screen and (min-width: 738px){
	.modal_window .content { padding: 50px 40px 40px; }
}
@media only screen and (min-width: 1117px){
	.modal_window .content { max-width: 680px; }
}

/* Icon Badge (Top Center) */
.modal_window .content .i_circle_main {
	position: absolute; left: 50%; top: -24px; margin-left: -24px;
	width: 48px; height: 48px; border-radius: 50%;
	background: var(--color-base-ivory);
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 -2px 5px rgba(0,0,0,0.05);
}
.modal_window .content .i_circle_sub {
	width: 38px; height: 38px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
}
.modal_window .content .i_circle_sub i {
	font-size: 18px; color: #fff; margin-right: 0;
}

/* Status Colors (Common) */
/* Info: Green */
.modal_window .content .i_circle_sub.info { background: var(--color-green); }
.modal_window .content .title.info::before { background: var(--color-green); }
/* Warning: Gold (Common CSS Accent) */
.modal_window .content .i_circle_sub.warning { background: var(--color-accent-gold); }
.modal_window .content .title.warning::before { background: var(--color-accent-gold); }
/* Error: Red */
.modal_window .content .i_circle_sub.error { background: var(--color-red); }
.modal_window .content .title.error::before { background: var(--color-red); }

/* Title */
.modal_window .content .title {
	font-weight: bold; font-size: 18px; position: relative;
	padding: 4px 0 4px 18px; color: var(--color-primary-navy);
	line-height: 1.4;
}
@media only screen and (min-width: 738px){
	.modal_window .content .title { font-size: 20px; padding-left: 20px; }
}
.modal_window .content .title::before {
	content: ""; position: absolute; top: 0; left: 0;
	border-radius: 3px; width: 6px; height: 100%;
}

/* Body Text */
.modal_window .content p {
	flex-grow: 1; display: flex; align-items: center;
	margin-bottom: 0px; text-align: center; font-size: 15px;
}
@media only screen and (min-width: 738px){
	.modal_window .content p { font-size: 16px; }
}

/* Button Block */
.modal_window .content .modal_btn_block {
	display: flex; gap: 15px; align-items: center; justify-content: center;
	width: 100%; margin-top: auto;
}
@media only screen and (min-width: 738px){
	.modal_window .content .modal_btn_block { gap: 20px; }
}

/* Button Item */
.modal_window .content .modal_btn_block .modal_btn {
	flex: 1 1 0%; cursor: pointer;
}
.modal_window .content .modal_btn_block.one .modal_btn {
	flex: initial; flex-grow: 0; width: 100%; max-width: 240px;
}

/* Button Inner Styling */
.modal_window .content .modal_btn_block .modal_btn_inner {
	display: flex; align-items: center; justify-content: center;
	width: 100%; height: 50px; border-radius: 4px;
	font-weight: bold; font-size: 15px; transition: all 0.3s ease;
	font-family: 'Noto Serif JP', serif;
}
@media only screen and (min-width: 738px){
	.modal_window .content .modal_btn_block .modal_btn_inner { font-size: 16px; }
}

/* Main Button (Navy) */
.modal_window .content .modal_btn_block .modal_btn_inner.main {
	background: var(--color-primary-navy); color: #fff;
	border: 1px solid var(--color-primary-navy);
}
.modal_window .content .modal_btn_block .modal_btn:hover .modal_btn_inner.main {
	background: #fff; color: var(--color-primary-navy);
}

/* Sub Button (White/Navy) */
.modal_window .content .modal_btn_block .modal_btn_inner.sub {
	background: #fff; color: var(--color-primary-navy);
	border: 1px solid var(--color-primary-navy);
}
.modal_window .content .modal_btn_block .modal_btn:hover .modal_btn_inner.sub {
	background: var(--color-pastel-beige);
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ 10. Specific Pages
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/* --------------------------------------------------
   Profile Edit Table (.beige_table extension)
-------------------------------------------------- */

/* 列幅の定義 */
.beige_table col.title { width: 25%; min-width: 120px; }
.beige_table col.value { width: auto; }
.beige_table col.detail { width: 80px; }

@media only screen and (max-width: 737px) {
    .beige_table col.title { width: 30%; min-width: auto; }
}

/* セルの基本設定 */
.beige_table th,
.beige_table td {
    vertical-align: middle;
    font-size: 15px;
}

/* 編集ボタンのセル */
.beige_table td.detail {
    text-align: center;
    padding: 5px;
}

/* 編集リンクボタン */
.beige_table a.edit {
    display: inline-block;
    font-size: 13px;
    color: var(--color-accent-gold);
    border: 1px solid var(--color-accent-gold);
    padding: 4px 12px;
    border-radius: 4px;
    transition: all 0.3s ease;
    cursor: pointer;
    white-space: nowrap;
}
.beige_table a.edit:hover {
    background-color: var(--color-accent-gold);
    color: #fff;
}

/* --------------------------------------------------
   Edit Mode Components
-------------------------------------------------- */

/* 初期状態では編集行を非表示（JSで制御想定） */
tr[id^="edit_"] {
    display: none;
    background-color: #fafafa;
}

/* テーブル内の入力フォーム調整 */
.beige_table input[type="text"],
.beige_table input[type="email"],
.beige_table input[type="password"] {
    margin: 5px 0;
    box-sizing: border-box;
}

/* ★追加: 大きな下マージン（建物名など） */
.beige_table input[type="text"].margin_large {
    margin-bottom: 20px;
}

/* ★追加: 都道府県セレクトボックスの調整 */
.beige_table .address_select {
    width: 100%;
    max-width: 200px; /* 小さすぎない幅に固定 */
    margin-bottom: 10px; /* 下に余白 */
    display: inline-block;
}

/* 名前・生年月日の横並びレイアウト */
.beige_table .flex {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 10px;
}

.beige_table .flex div {
    display: flex;
    flex-direction: column;
    font-size: 12px;
    color: #666;
    font-weight: bold;
}

.beige_table .flex .name { flex: 1; min-width: 120px; }
.beige_table .flex .birthyear { width: 80px; }
.beige_table .flex .birthmonth { width: 60px; }
.beige_table .flex .birthday { width: 60px; }

/* 住所入力エリア */
.beige_table .zip_1 { width: 80px !important; display: inline-block; }
.beige_table .zip_2 { width: 100px !important; display: inline-block; }
.beige_table .zip_hyphen { margin: 0 5px; }

/* 注釈テキスト */
.beige_table .note {
    font-size: 12px;
    color: #999;
    display: block;
    margin-bottom: 10px;
}
.beige_table .private {
    font-size: 12px;
    color: #999;
    display: block;
    margin-bottom: 10px;
}
.beige_table .public {
    font-size: 13px;
    color: var(--color-red);
    line-height: 1.6;
    display: block;
    margin: 10px 0;
    background: #fff0f0;
    padding: 10px;
    border-radius: 4px;
}

/* --------------------------------------------------
   Action Buttons
-------------------------------------------------- */
.save_button,
.cancel_button,
.delete_button {
    appearance: none;
    border: none;
    font-size: 14px;
    font-weight: bold;
    padding: 8px 20px;
    border-radius: 4px;
    cursor: pointer;
    transition: opacity 0.3s;
    margin-right: 10px;
    margin-bottom: 5px;
}
.save_button:hover,
.cancel_button:hover,
.delete_button:hover { opacity: 0.8; }

.save_button {
    background-color: var(--color-primary-navy);
    color: #fff;
}
.cancel_button {
    background-color: #e0e0e0;
    color: #333;
}
.delete_button {
    background-color: #fff;
    color: var(--color-red);
    border: 1px solid var(--color-red);
}

/* --------------------------------------------------
   Account Delete Section
-------------------------------------------------- */
/* ★追加: 削除テーブル全体の外枠色を調整 */
.delete_table,
.delete_table th,
.delete_table td {
    border-color: #eecaca; /* ピンク系の薄いボーダー */
}

/* ヘッダーの赤背景 */
.beige_table th.red {
    background-color: var(--color-pastel-red);
    color: var(--color-red);
}

/* 入力欄の赤枠 */
input[type="password"].red {
    border-color: var(--color-red);
    background-color: #fffafb;
}

/* 削除実行ボタン（赤背景） */
.save_button.red {
    background-color: var(--color-red);
    color: #fff;
    width: 100%;
    max-width: 300px;
}
.cancel_button.red {
    background-color: #fff;
    border: 1px solid #ccc;
}

/* --------------------------------------------------
   Credit Card Stripe Box
-------------------------------------------------- */
.card_element_outer_box {
    border: 1px solid var(--color-gray);
    padding: 15px;
    border-radius: 4px;
    background: #fdfdfd;
    margin-bottom: 15px;
    min-height: 40px;
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■ Payment Summary (支払い金額表示)
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/* --- 外枠エリア --- */
.payment_summary_area {
	margin-top: 30px;
	max-width: 100%;
	margin-bottom: var(--margin_bottom_s);
}
@media only screen and (min-width: 738px){
	.payment_summary_area {
		margin-bottom: var(--margin_bottom_ml);
	}
}

/* --- ボックス本体 --- */
.payment_summary_area .payment_box {
	background-color: var(--color-base-ivory);
	border: 1px solid var(--color-gray);
	border-radius: 6px;
	padding: 20px;
}
@media only screen and (min-width: 738px){
	.payment_summary_area .payment_box {
		padding: 30px;
	}
}

/* --- 行レイアウト --- */
.payment_summary_area .payment_row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
	font-size: 15px;
	line-height: 1.4;
	color: var(--color-black);
}

/* --- 個別の金額 --- */
.payment_summary_area .item_price {
	font-family: "Helvetica Neue", Arial, sans-serif;
	font-weight: 500;
	white-space: nowrap;
	margin-left: 10px;
}

/* --- 割引注釈（修正：緑色に変更） --- */
.payment_summary_area .discount_note {
	font-size: 13px;
	color: var(--color-green); /* 変数の緑(#3c763d)を使用 */
	font-weight: bold;
	margin-top: -8px;
	margin-bottom: 15px;
	padding-left: 1em;
	text-indent: -1em;
	text-align: right;
}

/* --- 点線 --- */
.payment_summary_area .payment_divider {
	border-bottom: 1px dashed var(--color-gray);
	margin: 15px 0;
}

/* --- 合計エリア --- */
.payment_summary_area .payment_total {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: bold;
	color: var(--color-primary-navy);
}

.payment_summary_area .total_label {
	font-size: 16px;
}

.payment_summary_area .total_price {
	font-size: 22px;
	font-family: "Helvetica Neue", Arial, sans-serif;
}

@media only screen and (min-width: 738px){
	.payment_summary_area .total_label { font-size: 18px; }
	.payment_summary_area .total_price { font-size: 26px; }
}