/*
  Skin Name: fine plan02(base:tecurio earth)
  Description: ファインプラン用。白・青・濃紺を基調に整理。
  Skin URI: https://tecurio.com/
  Author: 風塵(ふーじん)
  Author URI: https://tecurio.com/
  Version: 1.2.1
  Priority: 9860000000
  Original: tecurio earth / fine plan02
  Design revision: 2026-10-20
*/

/* 全体：幅とナビの配置はCocoon設定を使用 */
body {
	color: #334155;
	background-color: #f3f4f6;
	font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
body p {
	line-height: 1.9;
}
a {
	color: #12669b;
}
a:hover {
	color: #17324d;
}
a:focus-visible {
	outline: 2px solid #12669b;
	outline-offset: 3px;
}

/* ヘッダー：ロゴとメニューの配置・幅は設定側で管理 */
.header-container {
	background-color: #dceef8;
	border-bottom: 4px solid #0085bf;
	box-shadow: none;
}
.header, .navi {
	background: transparent;
	box-shadow: none;
}
.site-name-text, .tagline {
	color: #17324d;
	text-shadow: none;
}
.navi-in a {
	color: #17324d;
}
.navi-in a:hover,
.navi-in .current-menu-item > a {
	color: #12669b;
	background-color: #c6e2f2;
}
.navi-in .item-description {
	color: #526476;
}
.navi-in ul.sub-menu {
	background-color: #fff;
	border: 1px solid #e2e8f0;
}
.navi-in a[href="https://fineplan.co.jp/contactus/"] {
	color: #fff;
	background-color: #17324d;
	border-radius: 4px;
}
.navi-in a[href="https://fineplan.co.jp/contactus/"]:hover {
	background-color: #12669b;
}
.navi-in a[href="https://fineplan.co.jp/contactus/"] .item-description {
	color: #fff;
}

/* トップメニュー：全画面幅でロゴの縦横比と上下余白を確保 */
.header-container-in.hlt-top-menu {
	padding-top: 12px;
	padding-bottom: 12px;
}
.header-container-in.hlt-top-menu .logo-header {
	max-height: none;
}
.header-container-in.hlt-top-menu .logo-header img {
	max-width: 100%;
	height: auto;
	max-height: none;
}

/* 本文 */
.content {
	margin-top: 32px;
	margin-bottom: 48px;
}
.main {
	background-color: #fff;
	padding: 32px 48px;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}
.article .entry-title {
	color: #17324d;
	background-color: #eef6fb;
	border-left: 6px solid #0085bf;
	padding: 20px 24px;
	margin-bottom: 32px;
	font-size: 2rem;
	line-height: 1.5;
}
.article h2 {
	color: #17324d;
	background: none;
	border: 0;
	padding: 0 0 12px;
	font-size: 1.6rem;
	line-height: 1.6;
	text-indent: 0;
}
.article h2::after {
	content: "";
	display: block;
	width: 48px;
	height: 3px;
	margin-top: 12px;
	background-color: #12669b;
}
.article h3 {
	color: #17324d;
	background: #f1f7fb;
	border: 0;
	border-left: 3px solid #12669b;
	padding: 12px 16px;
	font-size: 1.3rem;
}
.article h4, .article h5, .article h6 {
	color: #17324d;
}
.entry-content li {
	line-height: 1.9;
}
.entry-content .is-style-blank-box-blue {
	color: #334155;
	background-color: #f1f7fb;
	border: 1px solid #d8e7f1;
	border-radius: 4px;
	padding: 20px 24px;
}
.entry-content hr {
	border: 0;
	border-top: 1px solid #e2e8f0;
}

/* 会社概要などの本文テーブル */
.entry-content table {
	width: 100%;
	border-collapse: collapse;
}
.entry-content table th, .entry-content table td {
	padding: 16px;
	border: 1px solid #e2e8f0;
	vertical-align: top;
}
.entry-content table th {
	color: #17324d;
	background-color: #f1f7fb;
}
.entry-content table tr {
	background-color: #fff;
}
.page-id-11 .entry-content td:first-child {
	width: 7em;
	color: #17324d;
	background-color: #f1f7fb;
}

/* トップ：元の画像に近いロゴ・英字・青い説明文 */
.wp-block-columns.fp-service-intro {
	gap: 32px;
	margin: 32px 0 40px;
}
.fp-service-intro > .wp-block-column {
	align-self: center;
}
.fp-service-logo {
	margin: 0;
}
.fp-service-logo img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.fp-service-item {
	margin: 0 0 24px;
}
.fp-service-item:last-child {
	margin-bottom: 0;
}
.fp-service-item .wp-block-heading {
	margin: 0 0 8px;
	padding: 0;
	color: #0085bf;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.15;
	letter-spacing: -0.03em;
	text-shadow: 2px 3px 0 #59636b;
}
.fp-service-item h2::after {
	content: none;
}
.fp-service-item .wp-block-paragraph {
	margin: 0;
	padding-left: 2.5em;
	color: #2878e8;
	font-family: Arial, Meiryo, sans-serif;
	font-size: 1.6rem;
	line-height: 1.7;
}

/* トップの掲載情報：追加したグループだけを対象にする */
.fp-publication {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 24px;
	background-color: #f6f9fc;
	border: 1px solid #e2e8f0;
	border-radius: 4px;
}
.fp-publication .wp-block-image {
	flex: 0 0 100px;
	float: none;
	margin: 0;
}
.fp-publication img {
	display: block;
	width: 100px;
	height: auto;
}
.fp-publication p {
	flex: 1;
	margin: 0;
}

/* お問い合わせページ：追加した連絡先ブロック */
.fp-contact-columns {
	gap: 24px;
	align-items: stretch;
}
.fp-contact-columns > .wp-block-column {
	display: flex;
}
.fp-contact-card {
	flex: 1;
	padding: 24px;
	color: #17324d;
	background-color: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 4px;
}
.fp-contact-card h3 {
	margin: 0 0 20px;
	padding: 0;
	background: none;
	border: 0;
}
.fp-contact-card p {
	margin: 0 0 16px;
}
.fp-contact-card > :last-child {
	margin-bottom: 0;
}
.fp-contact-card a {
	overflow-wrap: anywhere;
}
.fp-contact-number {
	font-size: 1.8rem;
	font-weight: bold;
}
.fp-contact-number a {
	color: #17324d;
	text-decoration: none;
}
.fp-contact-number a:hover {
	color: #12669b;
	text-decoration: underline;
}
.fp-contact-card .wp-block-buttons {
	margin-bottom: 16px;
}
.fp-contact-mail-button .wp-block-button__link {
	padding: 14px 24px;
	color: #fff;
	background-color: #12669b;
	border-radius: 4px;
	font-size: 1rem;
	font-weight: bold;
	text-decoration: none;
}
.fp-contact-mail-button .wp-block-button__link:hover {
	color: #fff;
	background-color: #17324d;
}

/* 共通お問い合わせ欄：新しいHTMLに対応 */
div.telbox {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 32px;
	margin-top: 40px;
	background-color: #eef6fb;
	background-image: linear-gradient(rgba(238, 246, 251, 0.92), rgba(238, 246, 251, 0.92)), url("https://fineplan.co.jp/wp/wp-content/uploads/2022/04/cropped-fineplan-siteicon-2.png");
	background-size: auto, 240px auto;
	background-position: center;
	background-repeat: no-repeat;
	border: 1px solid #d8e7f1;
	border-radius: 4px;
}
.fp-contact-info {
	flex: 1 1 240px;
}
.fp-contact-actions {
	flex: 1 1 300px;
	text-align: center;
}
.telbox p {
	margin: 0;
}
.fp-contact-info strong {
	color: #17324d;
	font-size: 1.15em;
}
.telbox .fp-contact-phone {
	margin-bottom: 16px;
}
.fp-contact-phone a {
	color: #17324d;
	font-size: 1.8rem;
	font-weight: bold;
	text-decoration: none;
}
.fp-contact-phone small {
	color: #526476;
}
a.fp-contact-button {
	display: inline-block;
	padding: 14px 24px;
	color: #fff;
	background-color: #12669b;
	border-radius: 4px;
	font-weight: bold;
	text-decoration: none;
}
a.fp-contact-button:hover {
	color: #fff;
	background-color: #17324d;
}

/* フッターの背景・文字色はCocoon設定を使用 */
.footer {
	background-image: none;
}
.footer a:hover {
	text-decoration: underline;
}
.go-to-top-button,
.mobile-menu-buttons,
.navi-menu-close-button {
	color: #fff;
	background: #12669b;
}
.go-to-top-button:hover {
	color: #fff;
	background-color: #17324d;
}
.mobile-menu-buttons .menu-button-in > span,
.mobile-menu-buttons .menu-button-in > a {
	color: #fff;
	text-shadow: none;
}

/* 小さい画面では余白と文字サイズだけを調整 */
@media screen and (max-width: 834px) {
	.content {
		margin-top: 16px;
		margin-bottom: 32px;
	}
	.main {
		padding: 24px 20px;
	}
	.article .entry-title {
		padding: 16px 18px;
		font-size: 1.6rem;
	}
	.article h2 {
		font-size: 1.35rem;
	}
	.fp-service-item .wp-block-heading {
		font-size: 2.4rem;
	}
	.fp-service-item .wp-block-paragraph {
		padding-left: 1em;
		font-size: 1.2rem;
	}
	.entry-content table th, .entry-content table td {
		padding: 12px;
	}
	div.telbox {
		padding: 24px;
	}
}
@media screen and (max-width: 480px) {
	.main {
		padding: 20px 16px;
	}
	.entry-content .is-style-blank-box-blue {
		padding: 16px;
	}
	.fp-publication {
		gap: 16px;
		padding: 16px;
	}
	.fp-publication .wp-block-image {
		flex-basis: 80px;
	}
	.fp-publication img {
		width: 80px;
	}
	.entry-content table th, .entry-content table td {
		padding: 10px;
		font-size: 0.9em;
	}
	.page-id-11 .entry-content td:first-child {
		width: 5em;
	}
	div.telbox {
		padding: 20px;
	}
	.fp-contact-number {
		font-size: 1.5rem;
	}
	.fp-contact-card {
		padding: 20px;
	}
	.fp-contact-phone a {
		font-size: 1.5rem;
	}
}

/* WordPress標準カラムが縦並びになる幅でロゴを縮小 */
@media screen and (max-width: 781px) {
	.fp-service-logo img {
		max-width: 220px;
	}
}