@charset "UTF-8";
/*============================
  information.css
  お知らせ一覧ページ専用スタイル
============================*/

/* sttl_01 アイコン非表示・左パディングをリセット */
.information .sttl_01::before {
	display: none;
}

.information .sttl_01 {
	padding-left: 0;
	margin-bottom: 30px;
}


@media screen and (max-width: 768px) {
	.information .sttl_01 {
		margin-bottom: 15px;
	}
}


/* ----------------------------------------
   ページヘッダー
---------------------------------------- */
.info_header {
	text-align: center;
	padding-bottom: 50px;
	margin-bottom: 60px;
	border-bottom: 1px solid #E0D4C5;
}

.info_header_en {
	font-family: "EB Garamond", "Garamond", serif;
	font-size: 14px;
	color: #9B8466;
	letter-spacing: 0.35em;
	margin-bottom: 8px;
}

.info_header_ttl {
	font-size: 34px;
	font-weight: 600;
	color: #817061;
	line-height: 1.3;
	margin-bottom: 20px;
}

.info_header_lead {
	font-size: 15px;
	line-height: 1.9;
	color: #555;
}

@media screen and (max-width: 768px) {
	.info_header {
		text-align: left;
		padding-bottom: 30px;
		margin-bottom: 40px;
	}
	.info_header_en { font-size: 12px; }
	.info_header_ttl { font-size: 24px; }
	.info_header_lead { font-size: 13px; }
}


/* ----------------------------------------
   セクション共通（layout.css の main section を上書き）
---------------------------------------- */
.information section.info_section {
	max-width: 100%;
	width: 100%;
	margin: 0 0 90px;
}

@media screen and (max-width: 768px) {
	.information section.info_section {
		margin-bottom: 60px;
	}
}


/* ----------------------------------------
   リスト
---------------------------------------- */
.info_list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.info_list_item {
	border-bottom: 1px solid #C9B294;
	position: relative;
}

/* リンクの有無（a / div）にかかわらず同じレイアウトを適用 */
.information .info_list_link {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 0 12px;
	padding: 22px 60px 22px 28px;
	transition: background-color 0.2s;
}

a.info_list_link:hover {
	background-color: rgba(251, 249, 245, 0.7);
}

/* 行全体はリンクなし。本文内の個別リンクは操作可能にする */
.information .info_list_link.link_none,
.information .info_list_link.info_list_static {
	padding: 22px 28px;
	cursor: default;
	pointer-events: auto;
}

@media screen and (max-width: 768px) {
	.information .info_list_link {
		padding: 15px 38px 15px 10px;
		gap: 8px 10px;
	}
	.information .info_list_link.link_none,
	.information .info_list_link.info_list_static {
		padding: 15px 10px;
	}
}

/* 日付 */
.info_date {
	font-size: 14px;
	color: #555;
	white-space: nowrap;
	flex-shrink: 0;
	padding-top: 3px;
	min-width: 6.5em;
}

@media screen and (max-width: 768px) {
	.info_date {
		font-size: 12px;
		min-width: auto;
	}
}

/* タグ */
.info_tag {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 82px;
	padding: 4px 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.05em;
	color: #fff;
	flex-shrink: 0;
	white-space: nowrap;
	line-height: 1.4;
}

@media screen and (max-width: 768px) {
	.info_tag {
		width: 68px;
		font-size: 10px;
		padding: 3px 0;
	}
}

.info_tag--info     { background-color: #B9986D; }
.info_tag--sub      { background-color: #8B7D6B; }
.info_tag--tv       { background-color: #817061; }
.info_tag--paper    { background-color: #948572; }
.info_tag--magazine { background-color: #7B8B7A; }

/* 本文テキスト */
.info_txt {
	font-size: 15px;
	line-height: 1.75;
	color: #333;
	flex: 1;
	min-width: 0;
}

.information .info_related_links {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin-top: 7px;
}

.information a.info_related_link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	max-width: 100%;
	color: #817061;
	text-decoration: none;
	overflow-wrap: anywhere;
	pointer-events: auto;
}

.information a.info_related_link::after {
	content: "";
	flex: 0 0 22px;
	width: 22px;
	height: 14px;
	background: url("../image/top/arrow_brown.svg") center / contain no-repeat;
}

.information a.info_related_link:hover {
	text-decoration: none;
}

@media screen and (max-width: 768px) {
	.info_txt {
		font-size: 13px;
		flex: none;
		width: 100%;
	}
}

/* 矢印 */
.info_arrow {
	position: absolute;
	top: 50%;
	right: 22px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	transition: right 0.2s;
}

a.info_list_link:hover .info_arrow {
	right: 16px;
}

@media screen and (max-width: 768px) {
	.info_arrow { right: 10px; }
	.info_arrow img { width: 17px; height: auto; }
	a.info_list_link:hover .info_arrow { right: 6px; }
}


/* ----------------------------------------
   メディアカテゴリ小見出し
---------------------------------------- */
.info_media_ttl {
	font-size: 16px;
	font-weight: 600;
	color: #817061;
	padding: 0 0 8px 14px;
	margin: 40px 0 0;
	border-left: 3px solid #B9986D;
	letter-spacing: 0.08em;
}

.info_media_ttl:first-of-type {
	margin-top: 0;
}

.info_list + .info_media_ttl {
	margin-top: 40px;
}

@media screen and (max-width: 768px) {
	.info_media_ttl {
		font-size: 14px;
		margin-top: 30px;
	}
	.info_list + .info_media_ttl {
		margin-top: 30px;
	}
}


/* ----------------------------------------
   空情報ボックス
---------------------------------------- */
.info_empty_box {
	padding: 38px 5%;
	background: rgba(251, 249, 246, 0.7);
	border: 1px solid rgba(155, 132, 102, 0.35);
	text-align: center;
}

.info_empty_box > p:first-child {
	font-size: 15px;
	color: #666;
}

.info_empty_note {
	margin-top: 12px;
	font-size: 14px;
	color: #888;
}

.info_empty_note a {
	color: #8D735C;
	text-decoration: underline;
}

.info_empty_note a:hover {
	text-decoration: none;
	color: #6D5544;
}

@media screen and (max-width: 768px) {
	.info_empty_box {
		text-align: left;
		padding: 24px 5%;
	}
	.info_empty_box > p:first-child { font-size: 13px; }
	.info_empty_note { font-size: 12px; }
}


/* ----------------------------------------
   メディア詳細ボタン
---------------------------------------- */
.info_more_btn {
	margin-top: 32px;
}

@media screen and (max-width: 768px) {
	.info_more_btn { margin-top: 22px; }
}