@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
.article h1 {
  font-size: 22px;
	padding: 0.7rem 0;
	border-bottom: 6px double #32bcfc;
}
.widget h2,
.article h2 {
  font-size: 18px;
  padding: 0.7rem 1.2rem;
  border-left: 6px double #32bcfc;
	
  background-color: transparent;
}

.article h3 {
	font-size: 16px;
  padding: 0.7rem 1.2rem;
	border: none;
	border-bottom: 2px dotted #32bcfc;
  background-color: transparent;
}

/* Yomikata Map Core */
.ymi-wrap {
	margin-bottom: 40px;
}

.ymi-entry-content {
	margin-top: 1em;
}

.ymi-wrap a {
	text-decoration: none;
	text-underline-offset: 0.16em;
}

.ymi-wrap a:hover,
.ymi-wrap a:focus {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/* 本文中の案内リンクを色だけに依存せず識別できるようにする */
.ymi-front-page-content p a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.16em;
}

.ymi-front-page-content p a:hover,
.ymi-front-page-content p a:focus {
	text-decoration-thickness: 2px;
}

/* LINEのブランド色は白文字とのコントラストが不足するため濃色化する */
.article-footer .sns-share .line-button {
	border-color: #006f22;
	background-color: #006f22;
	color: #fff;
}

.article-footer .sns-share .line-button:hover,
.article-footer .sns-share .line-button:focus {
	border-color: #005719;
	background-color: #005719;
	color: #fff;
}

.ymi-search {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 10px;
	margin: 20px 0;
}

.ymi-search input {
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid #cfd8df;
	border-radius: 6px;
	font-size: 16px;
}

.ymi-search button {
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 6px;
	background: #1f7a68;
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.ymi-404-search label {
	display: block;
	margin-bottom: 8px;
	font-weight: 700;
}

.ymi-404-search > div {
	display: flex;
	gap: 10px;
}

.ymi-404-search input {
	min-width: 0;
	min-height: 44px;
	flex: 1 1 auto;
	padding: 0 12px;
	border: 1px solid #cfd8df;
	border-radius: 6px;
	font-size: 16px;
}

.ymi-404-search button {
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 6px;
	background: #1f7a68;
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.ymi-pref-grid,
.ymi-search-results {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 12px;
}

.ymi-pref-grid,
.ymi-list-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px 24px;
}

.ymi-pref-region-list {
	display: grid;
	gap: 12px;
	margin: 18px 0;
}

.ymi-pref-region-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px 24px;
}

.ymi-card,
.ymi-list-item {
	display: grid;
	gap: 4px;
	padding: 14px;
	color: inherit;
}

.ymi-card:hover,
.ymi-list-item:hover {
	border-color: #1f7a68;
}

.ymi-pref-card,
.ymi-list-item {
	display: inline;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #125f9c;
}

.ymi-pref-card:hover,
.ymi-list-item:hover {
	border-color: transparent;
	color: #0b4b7c;
}

.ymi-table a,
.ymi-breadcrumb a {
	color: #125f9c;
	font-weight: 800;
}

.ymi-table a:hover,
.ymi-table a:focus,
.ymi-breadcrumb a:hover,
.ymi-breadcrumb a:focus {
	color: #0b4b7c;
}

.ymi-card-title {
	font-weight: 800;
}

.ymi-list-item ruby {
	font-weight: 800;
}

.ymi-wrap ruby {
	ruby-position: over;
}

.ymi-wrap rt {
	font-size: 0.62em;
	padding-bottom: 0.6em;
	line-height: 1.35;
}

.ymi-muted,
.ymi-count,
.ymi-list-item small {
	color: #66717d;
	font-size: 13px;
}

.ymi-list-grid {
	gap: 12px 24px;
}

.ymi-table-scroll {
	overflow-x: auto;
	max-width: 900px;
	border: 1px solid #d7dde2;
	border-radius: 8px;
	background: #fff;
}

.ymi-table {
	width: 100%;
	border-collapse: collapse;
}

.ymi-table th,
.ymi-table td {
	padding: 10px 12px;
	border-bottom: 1px solid #edf1f3;
	text-align: left;
	vertical-align: top;
}

.ymi-table th {
	background: #f6f8f7;
	font-size: 13px;
}

.ymi-table th:nth-child(3),
.ymi-table td:nth-child(3) {
	white-space: nowrap;
}

.ymi-panel {
	padding: 16px 0; 
	margin: 12px 0;
}
.ymi-panel p{
	margin-bottom: 0.2em;
}
.ymi-big {
	margin: 0 0 8px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.35;
}

.ymi-wrap .breadcrumb.ymi-breadcrumb {
	margin: 18px 0;
}

.ymi-weather-row {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 20px;
}

.ymi-radar-block {
	margin-top: 18px;
}

.ymi-copy-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.ymi-floor-links {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 8px 12px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.ymi-floor-links a,
.ymi-floor-links strong {
	display: block;
	padding: 8px 10px;
	border-radius: 6px;
}

.ymi-floor-links a {
	border: 1px solid #d7dde2;
	background: #fff;
	color: #125f9c;
	font-weight: 700;
}

.ymi-floor-links a:hover,
.ymi-floor-links a:focus {
	border-color: #1f7a68;
	color: #0b4b7c;
}

.ymi-floor-links strong {
	border: 1px solid #b9d8cf;
	background: #eef7f4;
	color: #0f493e;
}

.ymi-copy-button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 1px solid #b9d8cf;
	border-radius: 6px;
	background: #fff;
	color: #155f51;
	cursor: pointer;
}

.ymi-copy-button:hover,
.ymi-copy-button:focus {
	border-color: #1f7a68;
	color: #0f493e;
}

.ymi-copy-button:focus {
	outline: 2px solid rgba(31, 122, 104, 0.22);
	outline-offset: 2px;
}

.ymi-copy-button.is-copied {
	background: #eef7f4;
	border-color: #1f7a68;
}

.ymi-copy-button::after {
	position: absolute;
	bottom: calc(100% + 6px);
	left: 50%;
	z-index: 2;
	padding: 4px 7px;
	border-radius: 4px;
	background: rgba(36, 49, 61, 0.92);
	color: #fff;
	content: attr(data-tooltip);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	opacity: 0;
	pointer-events: none;
	transform: translateX(-50%) translateY(2px);
	transition: opacity 0.15s ease, transform 0.15s ease;
	white-space: nowrap;
}

.ymi-copy-button:hover::after,
.ymi-copy-button:focus::after {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
}

.ymi-copy-button svg {
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ymi-copy-button .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

.ymi-map-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}

.ymi-map-links a {
	font-size:16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid #b9d8cf;
	border-radius: 6px;
	background: linear-gradient(#ffffff, #eef7f4);
	box-shadow: 0 1px 2px rgba(36, 49, 61, 0.08);
	color: #155f51;
	font-weight: 700;
	line-height: 1;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.ymi-map-links a:hover,
.ymi-map-links a:focus {
	border-color: #1f7a68;
	box-shadow: 0 3px 8px rgba(36, 49, 61, 0.14);
	color: #0f493e;
	transform: translateY(-1px);
}

.ymi-map-links a:focus {
	outline: 2px solid rgba(31, 122, 104, 0.22);
	outline-offset: 2px;
}

.ymi-map-links-break {
	flex-basis: 100%;
	height: 0;
}

.ymi-map-embed,
.ymi-radar-embed {
	position: relative;
	overflow: hidden;
	width: 100%;
	max-width: 800px;
	border: 1px solid #d7dde2;
	border-radius: 8px;
	background: #f6f8f7;
}

.ymi-map-embed {
	aspect-ratio: 13 / 8;
}

.ymi-radar-embed {
	aspect-ratio: 13 / 9;
}

	.ymi-map-embed iframe,
	.ymi-radar-embed iframe {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		border: 0;
	}

	.ymi-nearby-section {
		margin-top: 12px;
	}

	.ymi-loading {
		align-items: center;
		display: inline-flex;
		gap: 8px;
	}

	.ymi-loading-spinner {
		animation: ymi-loading-spin 0.8s linear infinite;
		border: 2px solid #d0d7de;
		border-top-color: #39706b;
		border-radius: 50%;
		display: inline-block;
		flex: 0 0 auto;
		height: 14px;
		width: 14px;
	}

	@keyframes ymi-loading-spin {
		to {
			transform: rotate(360deg);
		}
	}

	.ymi-nearby-list {
		display: grid;
		gap: 8px;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.ymi-nearby-list li {
		display: grid;
		gap: 2px;
	}

	.ymi-nearby-name {
		font-weight: 700;
	}

	.ymi-nearby-map-link {
		width: fit-content;
		font-size: 14px;
	}

	.ymi-nearby-credit {
		font-size: 14px;
		margin: 8px 0 0;
		text-align: right;
	}
	.ymi-info-table.ymi-land-price-table{
		font-size: 0.85em;
	}
	.ymi-land-price-change-up {
		color: #c62828;
	}

	.ymi-land-price-change-down {
		color: #1565c0;
	}

	.ymi-land-price-number {
		font-size: 1.2em;
		font-weight: bold;
	}

	.ymi-land-price-small {
		font-size: 0.92em;
	}

	@media (max-width: 720px) {
	.ymi-search {
		grid-template-columns: 1fr;
	}

	.ymi-search button {
		width: 100%;
	}

	.ymi-404-search > div {
		flex-direction: column;
	}

	.ymi-404-search button {
		width: 100%;
	}

	.ymi-map-links a {
		flex: 1 1 100%;
		min-height: 42px;
	}
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
	/* 画面右端のコピーボタンでもツールチップをビューポート内に収める。 */
	.ymi-copy-button::after {
		right: 0;
		left: auto;
		transform: translateY(2px);
	}

	.ymi-copy-button:hover::after,
	.ymi-copy-button:focus::after {
		transform: translateY(0);
	}
}