/* お知らせ・Q&A・ポップアップの追加CSS(trust-notice.js 用)。ポップアップの見た目は、現在の popup.php と同じです。 */
#tpNotice {
	display: none;                 /* JSが条件を満たしたときだけ表示 */
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 9999;
	width: 340px;                  /* 強調1行を1行で収めるための幅 */
	box-sizing: border-box;
	padding: 16px 18px 14px;
	background: #fff;
	border: 1px solid #cfe0ee;
	border-top: 4px solid #1a5fa0;
	border-radius: 5px;
	box-shadow: 0 4px 16px rgba(0,0,0,.18);
	font-size: 13px;
	line-height: 1.7;
	color: #333;
	text-align: left;
}
#tpNotice.tpNotice-show {
	display: block;
	animation: tpNoticeIn .4s ease-out;
}
@keyframes tpNoticeIn {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	#tpNotice.tpNotice-show { animation: none; }
}
#tpNotice p { margin: 0 0 8px; }
#tpNotice .tpNotice-head {
	font-size: 15px;
	font-weight: bold;
	color: #1a5fa0;
	padding-right: 20px;           /* ×ボタンとの重なり防止 */
	margin-bottom: 10px;
}
#tpNotice .tpNotice-term {
	font-weight: bold;
	font-size: 14px;
	background: #f5f9fc;
	border: 1px solid #dbe8f2;
	border-radius: 3px;
	padding: 7px 6px;
	text-align: center;
	line-height: 1.6;
	white-space: nowrap;           /* 強調1行は必ず1行で表示 */
}
#tpNotice .tpNotice-body { margin-bottom: 8px; }
#tpNotice .tpNotice-body p { margin: 0 0 6px; }
#tpNotice .tpNotice-body p:last-child { margin-bottom: 0; }
#tpNotice .tpNotice-note {
	font-size: 12px;
	color: #666;
	line-height: 1.6;
}
#tpNotice .tpNotice-more { margin: 10px 0 0; text-align: right; }
#tpNotice .tpNotice-link {
	color: #1a5fa0;
	font-size: 12px;
	text-decoration: underline;
}
#tpNotice .tpNotice-close {
	position: absolute;
	top: 6px;
	right: 8px;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 22px;
	line-height: 1;
	color: #888;
	cursor: pointer;
}
#tpNotice .tpNotice-close:hover { color: #1a5fa0; }

/* スマートフォン：画面下部に横幅いっぱいで表示 */
@media screen and (max-width: 640px) {
	#tpNotice {
		right: 10px;
		left: 10px;
		bottom: 10px;
		width: auto;
	}
}
/* 画面の狭い端末：強調1行が1行に収まるよう文字を少し小さく */
@media screen and (max-width: 374px) {
	#tpNotice { padding-left: 14px; padding-right: 14px; }
	#tpNotice .tpNotice-term { font-size: 13px; }
}

/* お知らせ欄:カテゴリのラベル(日付の隣に並べる。大きさは現在の表示と同じ) */
#tpNews .tpCatBadge {
	display: inline-block;
	font-size: 10px;
	font-weight: bold;
	padding: 2px 8px;
	border-radius: 20px;
	white-space: nowrap;
	margin-left: 6px;
}

/* 読み込み失敗・0件のときのメッセージ */
.tpDataMsg { margin: 8px 0; color: #666; font-size: 13px; }
#tpQaMsg { color: #fff; text-align: center; }

/* 本文の **強調**(赤い太字。現行の赤い文字の代わり。白地で読みやすい濃さの赤) */
.tpEm { color: #d32f2f; font-weight: bold; }
