@charset "UTF-8";

:root {
	--bg: #fff;
	--ink: #0f172a;
	/*	--ink-weak: #334155;*/
	--ink-weak: #003366;
	--brand: #0ea5e9;
	--brand-ink: #0b74a5;
	--accent: #22c55e;
	--warn: #eab308;
	--danger: #ef4444;
	--muted: #f1f5f9;
	--border: #e2e8f0;
	--shadow: 0 10px 25px rgba(0, 0, 0, .08);
	--radius: 1.2rem;
	--radius-lg: 2rem;
	--max: 1400px;
	--max2: 1600px;
	--space: clamp(16px, 2.2vw, 24px);
	/* ヘッダー・フッター等 */
	--dark-blue: #223088;
	--dark-blue2: #00afcc;
	/* 明るい青 */
	--light-blue: #8299e0;
	/* 山吹色 */
	--tamabuki: #f7d75d;
	/* 薄い黄色 */
	--ususi-yellow: #f8f5e5;
}

*,
*::before,
*::after {
	box-sizing: border-box
}

html,
body {
	height: 100%
}

body {
	margin: 0;
	font-family: "Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
	color: var(--ink);
	font-size: 1.2em;
	background: var(--ususi-yellow);
	line-height: 1.7;
	word-break: break-all;
}

@media (max-width:900px) {
body {
	font-size: 1em;
}
}



img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom
}

a {
	color: var(--brand);
	text-decoration: underline;
	text-underline-offset: 2px transition: 0.5s;
	/* マウスカーソルを載せるとき */
}

a:hover {
	transition: 0.5s;
}



a.button {
	display: inline-block;
	text-decoration: none
}

.container {
	width: 100%;
	max-width: var(--max);
	margin-inline: auto;
	padding-inline: var(--space)
}

#main {
	min-height: 100vh;
	height: auto;
}




.grid {
	display: grid;
	gap: var(--space)
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0
}

img .center {
	display: block;
}

.center {
	text-align: center;
}


/* ヘッダー */
header.site-header {
	position: fixed;
	width: 100vw;
	/*	position: sticky;*/
	top: 0;
	z-index: 50;
/*	background: #003366;
	background: var(--dark-blue);*/
	background: #0e56a2;
	backdrop-filter: saturate(180%) blur(12px);
/*	border-bottom: 1px solid var(--border);*/
}

.header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 64px;
}

.logo {
	display: flex;
	align-items: center;
	gap: 10px;
	font-weight: 900;
	letter-spacing: .02em;
	display:none;
}

.logo img {
	width: 100px;
	height: 36px;
	border-radius: 10px;
}

nav.primary-nav {
	display: flex;
	gap: 16px;
	display: none;
}

nav.primary-nav a {
	/*	color: var(--ink-weak);*/
	color: #fff;
	text-decoration: none;
	padding: 10px 12px;
	border-radius: 999px
}

nav.primary-nav a:hover {
	background: var(--muted);
	color: var(--ink)
}

/* モバイルメニュー */
.menu-toggle {
	display: none;
	border: 1px solid var(--border);
	background: #fff;
	border-radius: 12px;
	padding: 8px 12px
}

@media (max-width:900px) {
	nav.primary-nav {
		display: none;
	}

	.menu-toggle {
		display: inline-flex
	}

	.mobile-drawer {
		position: fixed;
		inset: 0 0 auto 0;
		top: 64px;
		background: #fff;
		border-top: 1px solid var(--border);
		display: none
	}

	.mobile-drawer.open {
		display: block
	}

	.mobile-drawer a {
		display: block;
		padding: 16px;
		border-bottom: 1px solid var(--border);
		text-decoration: none;
		color: var(--ink)
	}
}

/* ---------------------------
 * ヒーロー
 * --------------------------- */

.hero {
  position: relative;
  width: 100%;
  /* 高さは画像比率に合わせるか固定する */
  /* 例: 16:9 比率にする場合 */
  aspect-ratio: 16/9; /* ブラウザ対応があれば便利 */
  overflow: hidden;
}


@media (max-width:900px) {
.hero {
  aspect-ratio: 4/3; /* ブラウザ対応があれば便利 */
}
}



/* 背景となる画像を幅いっぱいに拡げる */
.hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;       /* 横幅いっぱい、縦切り取りあり */
  object-position: top;    /* ←ここを追加：画像の上側を優先表示 */
  display: block;
}

/* 上に重ねる画像（中央寄せの例） */
.hero-overlay {
  position: absolute;
  left: 50%;
  top: 25%;
  transform: translate(-50%, -50%);
  max-width: 80%;        /* 必要に応じて調整 */
  height: auto;
  z-index: 2;
  pointer-events: none;  /* クリック等を下に通したい場合 */
}

.hero-overlay2 {
  position: absolute;
  left: 0;
  bottom: 30px;
  transform: translate(0, 0 );
  max-width: 30%;        /* 必要に応じて調整 */
  height: auto;
  z-index: 2;
  pointer-events: none;  /* クリック等を下に通したい場合 */
}
.hero-overlay3 {
  position: absolute;
  right: 0;
  bottom: 0;
  transform: translate(0, 0 );
  max-width: 30%;        /* 必要に応じて調整 */
  height: auto;
  z-index: 2;
  pointer-events: none;  /* クリック等を下に通したい場合 */
}
.hero-overlay4 {
  position: absolute;
/*  bottom: 0;*/
  top: 82%;

    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
  max-width: 60%;        /* 必要に応じて調整 */
  height: auto;
  z-index: 3;
  pointer-events: none;  /* クリック等を下に通したい場合 */
}

@media (max-width:900px) {

.hero-overlay{
  top: 15%;
}
.hero-overlay2 {
	max-width:40%;
  bottom: 20%;
}

.hero-overlay3 {
	max-width:35%;

  bottom: 20%;
}
}




.hero-text {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	text-align:center;
	bottom: 0;
	font-size:1.4em;
	font-weight:700;
	background:#fff;
	z-index: 3;

}


.badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid var(--border);
	padding: 6px 12px;
	/*	border-radius: 999px;*/
	border-radius: 1em;
	font-size: .9rem
}

.hero h1 {
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.2;
	margin: 12px 0 8px;
	padding: 0.2em;
	color: #003366;
	background: rgba(255, 255, 255, 0.7);
}

.hero p.lead {
	font-size: clamp(16px, 2.4vw, 20px);
	color: var(--ink-weak);
	background: rgba(255, 255, 255, 0.7);
	padding: 0.2em;
}

.cta {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 18px
}

.font-large {
	font-size: 130%;
}
@media (max-width:900px) {
.font-large {
	font-size: 110%;
}
}

.font-small {
	font-size: 90%;
}

.font-red {
	color: red;
}
.font-80{
	font-size:80%;
}
.font-120{
	font-size:120%;
}

.font-w700{
	font-weight:700;
}
.font-w200{
	font-weight:200;
}
.button {
	padding: 14px 18px;
	border-radius: 14px;
	border: 1px solid transparent;
	box-shadow: var(--shadow)
}

.button.primary {
	/*	background: var(--brand);
	background: var(--ink-weak);*/
	background: var(--dark-blue);
	font-size:2.0em;



	color: #fff;
}

.button.primary:hover {
	background: var(--brand-ink);
}

.button.outline {
/*	background: #fff;*/
	background: var(--dark-blue2);
/*	border-color: var(--border);*/
	border-color: var(--dark-blue2);
/*	color: var(--ink);*/
	color: #fff;
/*	font-size:2.0em;*/
}

.button.outline:hover {
	opacity: 0.7;
}

.w48 {
	width: 48%;
	text-align: center;
}

.hero-visual {
	border-radius: var(--radius-lg);
	overflow: hidden;
	border: 1px solid var(--border);
	background: #fff;
}

/* セクション */
section {
	/*	padding-block: clamp(40px, 6vw, 72px);*/
	padding-block: clamp(72px, 6vw, 72px);
}

section .section-title {
/*	font-size: clamp(22px, 3vw, 48px);*/
	font-size: clamp(30px, 3vw, 48px);
	margin: 0 0 8px;
	color: var(--dark-blue);
}

section .section-lead {
	color: var(--ink-weak);
	margin: 0 0 24px
}

/* カード */
.cards {
	grid-template-columns: repeat(3, 1fr)
}
/* カード */
.cards2{
	  display: grid;
  grid:2fr, 1fr;
  grid-auto-flow: column;
}

@media (max-width:900px) {
	.cards2 {
		grid-auto-flow: row;
	}
}



.card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	padding: 20px;
	margin-bottom: 10px;
	box-shadow: var(--shadow)
}
/*
@media (max-width:900px) {
.card {
	font-size:80%;
}
}
*/
.card h3 {
	margin: 0 0 8px;
	padding: 5px 10px;
	background: var(--dark-blue);
	color: #fff;
	border-radius: 10px;
	font-size:1.3em;

}

@media (max-width:900px) {
	.cards {
		grid-template-columns: 1fr;
	}
}

/* FAQ アコーディオン */
.faq-item {
	border: 1px solid var(--border);
	border-radius: 16px;
	background: #fff;
	overflow: hidden
}

.faq-q {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px;
	cursor: pointer
}

.faq-q:hover {
	
}

.faq-a {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .25s ease
}

.faq-a>div {
	overflow: hidden
}

.faq-item.open .faq-a {
	grid-template-rows: 1fr
}

/* 注意・規約 */
.note {
/*	background: #f7d75d;*/
/*	background: #fafafa;*/
	background: -webkit-linear-gradient(to right,#ffefd5,#fff);
	background: linear-gradient(to right, #ffefd5, #fff);
/*	border: 1px solid #fde68a;*/
	padding: 16px;
	border-radius: 16px
}

.terms {
	/*	font-size: .95rem;*/
	color: #334155
}


/* ====== フッター ====== */
/* Footer menu*/
.footer-menu-section {
	background: var(--dark-blue);
	padding: 2rem 0;
	/*  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); */
}

/*
.footer-menu-inner {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 20px;
}
*/

.footer-menu-nav {
	display: flex;
	justify-content: center;
}

.footer-menu-list {
	display: flex;
	flex-wrap: wrap;
	/* スマホ対応で折り返し可能に */
	justify-content: center;
	/* メニューを中央寄せ */
	gap: 2rem;
	/* 各メニューの間隔 */
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-menu-list li a {
	display: inline-block;
	/*  transition: transform 0.3s ease, opacity 0.3s ease; */
	text-decoration: none;
	color: #444;
	/*  border-bottom: 1px solid #ddd; */
}

.footer-menu-list li a.activefoot {
	color: #006600;
	/* 文字色（選択中の強調色） */
	font-weight: bold;
	/* 太字に */
	opacity: 1;
	/* hover時の透明感をリセット */
}

.footer-menu-list li a:hover {
	transform: translateY(-3px);
	/* ← 上に3px動く */
	opacity: 0.8;
}


/* Footer menu レスポンシブ*/
@media screen and (max-width: 768px) {
	.footer-menu-section {
		font-size: 95%;
		text-arign: center;
	}
}

/* Footer */
footer {
	background: var(--dark-blue);
	color:#fff;
	padding: 1rem;
	/* 高さにゆとりを持たせる */
}

@media screen and (max-width: 1200px) {
footer {
	padding: 1rem 5px;
}
}




.footer-logo img {
	/*  width: ;*/
	height: auto;
	margin-bottom: 10px;
}

.footer-content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 5px;
/*	padding: 0 20px;*/
	text-align: center;
	margin-bottom: 2rem;
}

.footer-content div{
	margin:0;
	padding:0;
}

.footer-content h3 {
	margin-bottom: 1rem;
	font-size: 1.5rem;
}

.footer-content p {
	line-height: 1.8;
	/*  font-size: 1rem;*/
	color:#fff;
	text-align:left;
	font-size:0.8em;
}

.footer-content p a {
	text-decoration: none;
	color: #444;
}

.footer-content p a:hover {
	text-decoration: underline;
	color: #444;
	opacity: 0.8;
}

.copyright {
	/*  border-top: 1px solid #ddd; */
	padding-top: 1rem;
	font-size: 90%;
	color: #444;
}

@media screen and (max-width: 768px) {
	.footer-content {
		text-align: center;
	}
}

.header-inner span {
	display: none;
}



/* 固定CTA / ページトップ */
.sticky-cta {
	position: fixed;
	left: 16px;
	top: 16px;
	bottom:auto;
/*	bottom: 16px;*/
	display: flex;
	gap: 10px;
	z-index: 60;
	font-size: 1.5em;
}



@media (max-width:900px) {
.sticky-cta {
	left: calc( 100% - 155px );
/*	top: calc( 100% - 125px );*/
	bottom: 57px;
	top:auto;
	width:70px;
	height:70px;

}
}
.to-top {
	position: fixed;
	left:auto;
	right: 16px;
	bottom: 16px;
/*	bottom: 100px;*/
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s;
}

.to-top.show {
	opacity: 1;
	pointer-events: auto;
	font-size:1.0em;
}

/* 小さなユーティリティ */
.muted {
	/*	font-size:2em;*/
	color: var(--ink-weak)
}

.pill {
	display: inline-block;
	background: var(--muted);
	padding: 6px 10px;
	border-radius: 999px;
	border: 1px solid var(--border)
}

.kbd {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	background: #0f172a;
	color: #fff;
	padding: 2px 6px;
	border-radius: 6px;
	font-size: .9em
}



.sticky-cta a{
	border-radius:100%;
	width:150px;
	height:150px;
	line-height:117px;
	font-size:0.8em;
	text-align:center;

}
.sticky-cta a:hover{
	opacity: 0.7;

}
/* ---------------------------
 * 背景写真設定
 * --------------------------- */

/* キャンペーン概要 --- 
#prizesoverview {
	background-image: url(train_ocean-283-1.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
}
*/
#overview{
	background:#fff;
}


/* 応募条件 ------------------ */
#conditions {
/*
	background-image: url(bus_kumano-1.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
*/
	background-color: #edf6fc;
}

/* 賞品・抽選 ------------------

#prizes {
	background-image: url(train_ocean-283-2.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
	background-size: cover;
}
*/
#prizes {
/*	background-color: #f7d75d;*/
	background-color: #edf6fc;
}



/* 応募方法 ------------------
#apply {
	background-image: url(bus_nankai.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
}

/* 応募フォーム ------------------*/
#form {
/*
	background-image: url(train_ocean-287.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
*/
	background:#fff;


}

/* お問い合わせ ------------------
#contact {
	background-image: url(bus_kumano-2.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
}
*/
#contact {
	background:#fff;
}


/* よくある質問 ------------------
#faq {
	background-image: url(train_ocean-283-3.jpg);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
}




/* ---------------------------
 * Cardの背景
 * --------------------------- */
.card_air {
	background-image: url(card_air.png);
/*	background-image: url(ticket01.png);*/
	background-repeat: no-repeat;
/*	background-position: bottom right;*/
	background-position: top right;
	/*	background-position: center;*/
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
	height: 100%;
}

.card_train {
	background-image: url(card_train.png);
/*	background-image: url(ticket02.png);*/
	background-repeat: no-repeat;
/*	background-position: bottom right;*/
	background-position: top right;
	/*	background-position: center;*/
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
	height: 100%;
}

.card_bus {
	background-image: url(card_bus.png);
/*	background-image: url(ticket03.png);*/
	background-repeat: no-repeat;
/*	background-position: bottom right;*/
	background-position: top right;
	/*	background-position: center;*/
	background-color: rgba(255, 255, 255, 0.8);
	background-blend-mode: lighten;
	height: 100%;
}


/*
#about{
	background-image:url(IMGP0421x.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.8);
	background-blend-mode:lighten;
}


#how{
	background-image:url(IMGP7800x.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;

}

#eligibility{
	background-image:url(283.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.8);
	background-blend-mode:lighten;

}



#benefits{
	background-image:url(289.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;

}



#schedule{
	background-image:url(bus2.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.8);
	background-blend-mode:lighten;

}

#faq{
	background-image:url(bus3.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;

}



#terms{
	background-image:url(bus4.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.8);
	background-blend-mode:lighten;

}


#contact{
	background-image:url(IMGP0421x.jpg);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;

}
*/

.bg_ab{
	background-image:url(bg_ab.png);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;
}
.bg_c{
	background-image:url(bg_c.png);
	background-position: center;
	background-color:rgba(255,255,255,0.5);
	background-blend-mode:lighten;
}




@keyframes slideInRight {
	0% {
		transform: translateX(100vw);
	}

	100% {
		transform: translateX(0);
	}
}

/* 紺色（応募条件①）*/
.bg_kon,
.bg_pink {
/*	background: #FFF0FE !important;*/
	background: #223088 !important;
}
.bg_kon_usui {
	background: #e3e7ff!important;
}



/* 水色（応募条件②）*/
.bg_mizu {
/*	background: #F0FFFE !important;*/
	background: #00afcc !important;
}
.bg_mizu_usui {
/*	background: #F0FFFE !important;*/
	background: #d4f9ff !important;
}




/* 淡い黄（応募条件③）*/
.bg_yellow {
/*	background: #FFFFF0 !important;*/
	background: #f7d75d !important;
	color:#333!important;
}
.bg_yellow_usui {
/*	background: #FFFFF0 !important;*/
	background: #fff8db !important;
}



/* 淡い緑 */
.bg_green {
	background: #B8FF7D !important;
}


.btn {
	display: inline-block;
	background: #0ea5e9;
	color: #fff;
	border: 1px solid #0ea5e9;
	padding: 5px 15px;
	border-radius: 10px;
	text-decoration: none;
}



.btn:hover {
	display: inline-block;
	background: #fff;
	color: #0ea5e9;
	padding: 5px 15px;
	border-radius: 10px;
	text-decoration: none;
}

.link-wrap {
	display: none;
	margin-top: 0.5rem;
}

.link-wrap.show {
	display: block;
}

a.disabled {
	pointer-events: none;
	/* クリック無効 */
	opacity: 0.5;
	cursor: default;
}

input[type=checkbox] {
	transform: scale(2);
	margin-left: 36px;
}

/* 応募フォーム ボタン */
#oubo{}


.form_btn{}

.form_btn li{
        list-style:none;
	margin:2em 0 2em -2em;
}

.form_btn a{
	display:block;
	background:#fff;
	padding:0.8em;
	border:3px solid #fff;
	border-radius:10px;
	text-decoration:none;
	font-size:1.2em;
	font-weight:700;
	color:#fff;
}
.form_btn a:hover{
/*
	background:#0ea5e9!important;
	color:#fff;
*/
	opacity: 0.6;



}



/* ---------------------------
 * テキストリンク
 * --------------------------- */
a.text {
	color: #0ea5e9;
	text-decoration: none;
	padding-bottom: 3px;
	background-image: linear-gradient(#0ea5e9, #0ea5e9);
	background-repeat: no-repeat;
	background-size: 0% 1px;             /* 初期はゼロ幅 */
	background-position: 100% 100%;      /* 右端から */
	transition: background-size 0.3s ease;
}

a.text:hover {
	background-size: 100% 1px;           /* 全幅まで広がる */
	background-position: 0% 100%;        /* 左まで伸びる */
}







.bnr_list{}

.bnr_list{
	margin:0;
	padding:0;

}


.bnr_list li{
	display: inline-block;
	list-style:none;
	margin: 5px 2px;
/*	overflow: hidden;
	cursor: pointer;
*/
}

.bnr_list li a img {
/*  transition: all 0.3s*/;
}

.bnr_list a img:hover{
/*	transform: scale(1.2);*/
	opacity:0.7;
	transition:0.3s;
}







@media screen and (max-width: 768px) {
.bnr_list li{
	width: calc( 50% - 7px );

}
.bnr_list li img{
	width:100%;
}
}

/* ---------------------------
 * 賞品・抽選
 * --------------------------- */
.wrap {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.item {
	padding: 5px;
	width: 43%;
	/*background-color: #fff;*/
}
.item2 {
	padding: 5px;
	width: 56%;
	/*background-color: #fff;*/
}
@media not all and (min-width: 768px) {
	.wrap {
		justify-content:center;
	}
	.item2 {
		width: 100%;
	}
	.item {
		width: 74%;
	}
	.item:not(:last-child) {
		margin-bottom: 30px;
	}
}


/* ---------------------------
 * キャンペーン概要
 * --------------------------- */
.camp-content {
/*	margin-left: 1rem;	/*左に１文字分のスペース*/
/*	margin-right: 1rem;	/*右に１文字分のスペース*/
	margin-left: 0;
	margin-right: 0;


}

.camp-content dt {
/*	color:#f7d75d;*/
}


.camp-content dd {
/*	padding-top: 1rem;*/
	color:#223088;
	font-size:1.2em;
	margin-left:0;
}
/*画面幅700px以上の追加指定*/
@media screen and (min-width:700px) {
	/*ブロック全体*/
	.camp-content {
		display: grid;	/*gridを使う指定*/
		grid-template-columns: auto 1fr;	/*横並びの指定。日付とアイコン部分の幅は自動で、内容が入るブロックは残り幅一杯とる。*/
		align-items: end; /* ← 下揃えにするポイント */

	}
	/* dtを縦中央に、ddを下揃えに */
	.camp-content dt {
		align-self: center; /* ← 縦中央揃え */
	}

	.camp-content dd {
		align-self: end; /* ← 下揃え */
		font-size:1.5em;
		margin-left:0.5em;
	}

}


/* ---------------------------
 * 応募条件
 * --------------------------- */
.oubo_1_main{
	display: flex;
}
.oubo_1_sub{
	width: calc(100% / 2);
}


@media (width <= 800px) {
	.oubo_1_main{
		display:block;
	}
	.oubo_1_sub{
		width: 100%;
	}
}

/* ---------------------------
 * 応募方法
 * --------------------------- */
/* コンテナ */
.steps {
	margin-top:3em;
	display: flex;
	gap: 0; /* ← gapを消す（重ねるため） */
	flex-wrap: wrap; /* ← wrapを無効にする（1行に並べる） */
	justify-content: flex-start;
	position: relative;
	overflow: visible;
}

/* 各ステップブロック */
.step-wrap {
	position: relative;
	flex: 0 0 calc( 100% / 3 ); /* ← 固定幅のほうが重ねやすい */
/*  min-width: 240px;*/
	min-width: 280px;
	display: flex;
	justify-content: center;
	transition: transform 0.3s ease, z-index 0.3s ease;
}

/* カード同士を重ねる */
.step-wrap:not(:first-child) {
/*  margin-left: -60px; /* ← 数値を大きくすると重なり度が増す */
	margin-left: -30px; /* ← 数値を大きくすると重なり度が増す */
}

/* ホバーで手前に出す 
.step-wrap:hover {
	transform: translateY(-5px);
	z-index: 10;
}
*/
/* バッジは外側に独立配置 */
.badge {
	position: absolute;
	top: -44px;
	left: 50%;
	transform: translateX(-50%);
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #173a83;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	box-shadow: 0 4px 8px rgba(15,40,70,0.2);
	font-size: 24px;
	z-index: 2;
}

/* 六角形パネル本体 */
.step {
	padding: 60px 50px 36px;
/*	clip-path: polygon(0 0, 86% 0, 100% 50%, 86% 100%, 0 100%, 12% 50%);*/
	clip-path: polygon(0 0, 90% 0, 100% 50%, 90% 100%, 0 100%, 10% 50%);
	border-radius: 8px;
	background: #ddeff1;
	box-shadow: 0 4px 10px rgba(0,0,0,0.05);
	width: 100%;
	text-align: left;
}





/* 背景色交互 */
.step-wrap:nth-child(2) .step { background: #b8e0e2; }
.step-wrap:nth-child(3) .step { background: #92d1d6; }

/* テキスト */
.step h4 {
	margin: 8px 0 18px 0;
	font-size: 20px;
	line-height: 1.6;
	font-weight: 700;
}
.step p {
	margin: 10px;
	font-size: 18px;
	line-height: 1.6;
	color: #234;
}
@media (max-width: 850px) {
	.step-wrap {
		flex: 0 0 calc( 100% / 2 ); /* ← 固定幅のほうが重ねやすい */
	}
}
/* モバイル対応 */
@media (max-width: 850px) {
	.steps {
		flex-direction: column;
		gap: 35px;
	}
	.step-wrap {
		flex: 1 1 100%;
		margin-left: 0;
	}
	.step-wrap:first-child {
		margin-left: -2em;
	}
	.badge {
		top: -26px;
		left: 24px;
		transform: none;
		width: 80px;
		height: 80px;
		font-size: 17px;
	}
	.step {
		padding-top: 70px;
		margin-left:20px;
		padding-left:3.5em;
		clip-path: polygon(0 0, 95% 0, 100% 50%, 95% 100%, 0 100%, 5% 50%);

	}
	.step h4 {
		margin: 8px 0 18px 0;
		font-size: 16px;
		line-height: 1.6;
		font-weight: 700;
	}
	.step p {
		margin: 10px;
		font-size: 16px;
		line-height: 1.6;
		color: #234;
	}
}