/*
Theme Name: SWELL Child
Template: swell
Description: 遊漁マップ用 SWELL子テーマ（遊漁船検索窓）
Version: 1.0.0
*/

.yugyosen-search {
	max-width: 900px;
	margin: 0 auto 2em;
}

.yugyosen-search__form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75em;
	align-items: center;
	justify-content: center;
	padding: 1em;
	background: #f5f7f8;
	border-radius: 8px;
}

.yugyosen-search__form select {
	padding: 0.5em 0.75em;
	font-size: 1em;
	border: 1px solid #ccc;
	border-radius: 4px;
	min-width: 160px;
}

.yugyosen-search__form button {
	padding: 0.5em 1.5em;
	font-size: 1em;
	background: #1a7fc1;
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.yugyosen-search__form button:hover {
	background: #14639a;
}

.yugyosen-search__results {
	margin-top: 1.5em;
}

.yugyosen-search__count {
	font-weight: bold;
	margin-bottom: 0.75em;
}

.yugyosen-search__list {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	list-style: none;
	margin: 0;
	padding: 0;
}

.yugyosen-search__item {
	display: grid;
	grid-template-columns: 160px 1fr;
	gap: 1em;
	padding: 1em;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
}

.yugyosen-search__thumb {
	display: block;
	grid-row: span 4;
}

.yugyosen-search__thumb img {
	width: 100%;
	height: 120px;
	object-fit: cover;
	display: block;
	border-radius: 4px;
}

.yugyosen-search__name {
	margin: 0;
	font-size: 1.1em;
}

.yugyosen-search__name a {
	color: inherit;
	text-decoration: none;
}

.yugyosen-search__terms {
	margin: 0.25em 0;
	font-size: 0.85em;
	color: #666;
}

.yugyosen-search__excerpt {
	margin: 0.25em 0;
	font-size: 0.9em;
}

.yugyosen-search__fields {
	margin: 0.5em 0 0;
	font-size: 0.85em;
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 0.2em 0.75em;
}

.yugyosen-search__fields dt {
	font-weight: bold;
	color: #555;
}

.yugyosen-search__fields dd {
	margin: 0;
	word-break: break-all;
}

@media (max-width: 480px) {
	.yugyosen-search__item {
		grid-template-columns: 1fr;
	}

	.yugyosen-search__thumb {
		grid-row: auto;
	}
}

/* 個別ページ：本文下のACF情報ブロック */
.yugyosen-boat-info {
	margin-top: 2em;
	padding: 1.5em;
	background: #f5f7f8;
	border-radius: 8px;
}

.yugyosen-boat-info__title {
	margin: 0 0 1em;
	font-size: 1.2em;
}

.yugyosen-boat-info__fields {
	margin: 0;
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 0.5em 1em;
}

.yugyosen-boat-info__fields dt {
	font-weight: bold;
	color: #555;
	white-space: nowrap;
}

.yugyosen-boat-info__fields dd {
	margin: 0;
	word-break: break-all;
}

@media (max-width: 480px) {
	.yugyosen-boat-info__fields {
		grid-template-columns: 1fr;
	}

	.yugyosen-boat-info__fields dt {
		margin-top: 0.5em;
	}
}

/* 船長向け「遊漁ログ」紹介バナー */
.yugyolog-banner {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: 0 0 1.25em;
	padding: 0.5em 0.8em;
	background: linear-gradient(135deg, #4338ca, #4f46e5);
	border-radius: 7px;
	text-decoration: none;
	color: #fff;
	transition: opacity 0.15s ease;
}

.yugyolog-banner:hover {
	opacity: 0.9;
	color: #fff;
}

.yugyolog-banner__badge {
	flex-shrink: 0;
	padding: 0.15em 0.5em;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 999px;
	font-size: 0.68em;
	font-weight: bold;
	white-space: nowrap;
}

.yugyolog-banner__title {
	flex: 1 1 auto;
	min-width: 0;
	font-weight: bold;
	font-size: 0.85em;
	line-height: 1.3;
}

.yugyolog-banner__cta {
	flex-shrink: 0;
	padding: 0.3em 0.7em;
	background: #fff;
	color: #4338ca;
	border-radius: 5px;
	font-size: 0.72em;
	font-weight: bold;
	white-space: nowrap;
}

@media (max-width: 480px) {
	.yugyolog-banner {
		flex-wrap: wrap;
	}

	.yugyolog-banner__cta {
		margin-left: auto;
	}
}

/* 船長向け「HP制作代行」紹介バナー */
.hp-seisaku-banner {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: 0 0 1.25em;
	padding: 0.5em 0.8em;
	background: linear-gradient(135deg, #1e3a5f, #2c5282);
	border-radius: 7px;
	text-decoration: none;
	color: #fff;
	transition: opacity 0.15s ease;
}

.hp-seisaku-banner:hover {
	opacity: 0.9;
	color: #fff;
}

.hp-seisaku-banner__badge {
	flex-shrink: 0;
	padding: 0.15em 0.5em;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 999px;
	font-size: 0.68em;
	font-weight: bold;
	white-space: nowrap;
}

.hp-seisaku-banner__title {
	flex: 1 1 auto;
	min-width: 0;
	font-weight: bold;
	font-size: 0.85em;
	line-height: 1.3;
}

.hp-seisaku-banner__cta {
	flex-shrink: 0;
	padding: 0.3em 0.7em;
	background: #7cb342;
	color: #fff;
	border-radius: 5px;
	font-size: 0.72em;
	font-weight: bold;
	white-space: nowrap;
}

@media (max-width: 480px) {
	.hp-seisaku-banner {
		flex-wrap: wrap;
	}

	.hp-seisaku-banner__cta {
		margin-left: auto;
	}
}

/* LP（post_type=lp）共通：ヘッダー画像（アイキャッチ）の高さを抑えてトリミング表示 */
.single-lp .lp-thumb {
	max-height: 320px;
	overflow: hidden;
}

.single-lp .lp-thumb__img {
	width: 100%;
	height: 320px;
	object-fit: cover;
}

@media (max-width: 480px) {
	.single-lp .lp-thumb,
	.single-lp .lp-thumb__img {
		height: 200px;
		max-height: 200px;
	}
}

/* HP制作代行LP：カード型デザイン */
.hps-card {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 1.75em 2em;
	margin-bottom: 1.5em;
	box-shadow: 0 2px 8px rgba(30, 58, 95, 0.06);
}

.hps-card h3 {
	margin-top: 0;
	color: #1e3a5f;
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.hps-icon {
	font-size: 1.1em;
}

.hps-list {
	margin: 0 0 1em;
	padding-left: 1.2em;
}

.hps-list li {
	margin-bottom: 0.5em;
}

.hps-price-card {
	background: linear-gradient(135deg, #1e3a5f, #2c5282);
	color: #fff;
	border-radius: 12px;
	padding: 2em;
	text-align: center;
	margin-bottom: 1.5em;
}

.hps-price-card__amount {
	font-size: 2.2em;
	font-weight: bold;
	margin: 0.2em 0;
	color: #fff;
}

.hps-price-card__note {
	font-size: 0.9em;
	opacity: 0.85;
}

.hps-price-sub {
	margin-top: 1em;
	padding-top: 1em;
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	font-size: 0.95em;
}

.hps-faq-item {
	border-bottom: 1px solid #e2e8f0;
	padding: 1em 0;
}

.hps-faq-item:last-child {
	border-bottom: none;
}

.hps-faq-q {
	font-weight: bold;
	color: #1e3a5f;
}

.hps-faq-a {
	margin: 0.5em 0 0;
	color: #4a5568;
}

.hps-cta-band {
	background: linear-gradient(135deg, #1e3a5f, #2c5282);
	border-radius: 12px;
	padding: 2.5em 2em;
	text-align: center;
	color: #fff;
	margin-bottom: 1.5em;
}

.hps-cta-band p {
	color: #fff;
	opacity: 0.9;
}

.hps-cta-button {
	display: inline-block;
	margin-top: 1em;
	padding: 0.8em 2em;
	background: #7cb342;
	color: #fff;
	font-weight: bold;
	border-radius: 8px;
	text-decoration: none;
	font-size: 1.05em;
}

.hps-cta-button:hover {
	opacity: 0.9;
	color: #fff;
}

@media (max-width: 480px) {
	.hps-card {
		padding: 1.25em 1.5em;
	}

	.hps-price-card__amount {
		font-size: 1.8em;
	}
}

/* HP制作代行LP：料金プラン（2カード横並び） */
.hps-pricing-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25em;
	margin-bottom: 1.5em;
}

.hps-pricing-grid .hps-price-card {
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
}

.hps-price-card--main {
	background: linear-gradient(135deg, #1e3a5f, #2c5282);
}

.hps-price-card--sub {
	background: #fff;
	color: #1e3a5f;
	border: 2px solid #7cb342;
}

.hps-price-card--sub .hps-price-card__amount {
	color: #1e3a5f;
}

.hps-price-card--sub .hps-price-card__label {
	color: #4a5568;
}

.hps-price-card__label {
	font-size: 0.95em;
	opacity: 0.85;
}

.hps-price-card__badge {
	display: inline-block;
	align-self: center;
	margin-bottom: 0.6em;
	padding: 0.25em 0.9em;
	border-radius: 999px;
	font-size: 0.75em;
	font-weight: bold;
}

.hps-price-card--main .hps-price-card__badge {
	background: #7cb342;
	color: #fff;
}

.hps-price-card--sub .hps-price-card__badge {
	background: #eef5e4;
	color: #4a7a1e;
}

@media (max-width: 600px) {
	.hps-pricing-grid {
		grid-template-columns: 1fr;
	}
}

.hps-pricing-note {
	display: flex;
	align-items: flex-start;
	gap: 0.6em;
	margin: 0 0 1.5em;
	padding: 1.1em 1.3em;
	background: #eef5e4;
	border-left: 5px solid #7cb342;
	border-radius: 8px;
	font-size: 1.05em;
	font-weight: bold;
	color: #2d4a12;
	line-height: 1.7;
}

.hps-pricing-note__icon {
	flex-shrink: 0;
	font-size: 1.3em;
}

@media (max-width: 480px) {
	.hps-pricing-note {
		font-size: 0.95em;
	}
}

/* HP制作代行LP：機能グリッド（3列×2行） */
.hps-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25em;
	margin-bottom: 1.5em;
}

.hps-feature-card {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 1.5em 1.25em;
	text-align: center;
	box-shadow: 0 2px 8px rgba(30, 58, 95, 0.06);
}

.hps-feature-card__img {
	width: 96px;
	height: 96px;
	margin: 0 auto 0.75em;
	display: block;
	object-fit: contain;
}

.hps-feature-card__title {
	margin: 0 0 0.5em;
	font-size: 1.02em;
	font-weight: bold;
	color: #1e3a5f;
}

.hps-feature-card__desc {
	margin: 0;
	font-size: 0.88em;
	color: #4a5568;
	line-height: 1.6;
	text-align: left;
}

@media (max-width: 780px) {
	.hps-feature-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.hps-feature-grid {
		grid-template-columns: 1fr;
	}

	.hps-feature-card__img {
		width: 80px;
		height: 80px;
	}
}