@charset "UTF-8";
/* CSS Document / お知らせ 一覧・詳細 */
/* ページヒーローは header.css の .page_hero に共通化 */

/* 一覧 */
main.news_page {
    padding: 80px 0 80px 0;
}
main.news_page div.inner {
    width: 100%;
    max-width: 1000px;
    padding: 0 20px 0 20px;
    margin: 0 auto 0 auto;
}
main.news_page div.list ul li {
    border-bottom: 1px solid rgba(23, 28, 97, 0.15);
}
main.news_page div.list ul li:first-child {
    border-top: 1px solid rgba(23, 28, 97, 0.15);
}
main.news_page div.list ul li a {
    display: flex;
    align-items: center;
    gap: 30px;
    padding: 24px 8px 24px 8px;
    transition: background-color 0.3s ease;
}
main.news_page div.list ul li a:hover {
    background-color: var(--color-gray);
}
main.news_page div.list ul li a:hover p.title {
    color: var(--color-blue);
}
main.news_page div.list ul li a div.thumb {
    width: 180px;
    flex: 0 0 180px;
    aspect-ratio: 16 / 10;
    background-color: var(--color-gray);
    overflow: hidden;
}
main.news_page div.list ul li a div.thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
main.news_page div.list ul li a div.body {
    flex: 1;
}
main.news_page div.list ul li a div.body p.date {
    font-size: 15px;
    line-height: 1;
    color: var(--color-blue);
    letter-spacing: 0.04em;
}
main.news_page div.list ul li a div.body p.title {
    margin: 12px 0 0 0;
    font-size: 18px;
    line-height: 1.6;
    color: var(--color-navy);
    font-family: 'hiragino_w6';
    transition: color 0.3s ease;
}

/* ページャー */
main.news_page div.pager {
    margin: 60px 0 0 0;
}
main.news_page div.pager ul {
    justify-content: center;
    align-items: center;
    gap: 12px;
}
main.news_page div.pager ul li {
    width: 44px;
    height: 44px;
}
main.news_page div.pager ul li.next {
    width: auto;
}
main.news_page div.pager ul li a,
main.news_page div.pager ul li span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1;
    color: var(--color-navy);
    border: 1px solid var(--color-navy);
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
}
main.news_page div.pager ul li.next a {
    padding: 0 18px;
}
main.news_page div.pager ul li a:hover {
    background-color: var(--color-navy);
    color: var(--color-white);
}
main.news_page div.pager ul li.is-current span {
    background-color: var(--color-navy);
    color: var(--color-white);
}
main.news_page div.pager ul li.dots span {
    border: none;
    background: none;
    color: var(--color-navy);
}

/* 詳細 */
main.news_page.single div.inner {
    max-width: 860px;
}
main.news_page.single article div.head {
    border-bottom: 2px solid var(--color-navy);
    padding: 0 0 20px 0;
}
main.news_page.single article div.head p.date {
    font-size: 15px;
    line-height: 1;
    color: var(--color-blue);
    letter-spacing: 0.04em;
}
main.news_page.single article div.head h1.title {
    margin: 14px 0 0 0;
    font-family: 'hiragino_w7';
    font-size: 28px;
    line-height: 1.5;
    color: var(--color-navy);
}
main.news_page.single article div.eyecatch {
    margin: 40px 0 0 0;
}
main.news_page.single article div.eyecatch img {
    width: 100%;
    height: auto;
}
main.news_page.single article div.entry {
    margin: 40px 0 0 0;
}
main.news_page.single article div.entry > *:first-child {
    margin-top: 0;
}
main.news_page.single article div.entry p {
    font-size: 16px;
    line-height: 2;
}
main.news_page.single article div.entry p + p {
    margin: 24px 0 0 0;
}
main.news_page.single article div.entry h2 {
    margin: 40px 0 20px 0;
    font-family: 'hiragino_w7';
    font-size: 22px;
    line-height: 1.5;
    color: var(--color-navy);
    border-left: 5px solid var(--color-blue);
    padding: 4px 0 4px 16px;
}
main.news_page.single article div.entry h3 {
    margin: 32px 0 14px 0;
    font-family: 'hiragino_w7';
    font-size: 18px;
    line-height: 1.5;
    color: var(--color-navy);
}
main.news_page.single article div.entry img {
    max-width: 100%;
    height: auto;
}
main.news_page.single article div.entry figure.block-image {
    margin: 28px 0 0 0;
}
main.news_page.single article div.entry figure.block-image img {
    width: 100%;
    height: auto;
    display: block;
}
main.news_page.single article div.entry figure.block-image figcaption {
    margin: 8px 0 0 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--color-navy);
    text-align: center;
    font-family: 'hiragino_w4';
}
main.news_page.single article div.entry a {
    color: var(--color-blue);
    text-decoration: underline;
}
main.news_page.single div.back {
    margin: 60px 0 0 0;
    text-align: center;
}
main.news_page.single div.back a {
    display: inline-block;
    padding: 15px 50px;
    border: 2px solid var(--color-navy);
    border-radius: 50px;
    color: var(--color-navy);
    font-family: 'hiragino_w7';
    font-size: 16px;
    line-height: 1;
    transition: background-color 0.3s ease, color 0.3s ease;
}
main.news_page.single div.back a:hover {
    background-color: var(--color-navy);
    color: var(--color-white);
}

@media only screen and (max-width: 1279px) {
	main.news_page {
		padding: 60px 0;
	}
}
@media only screen and (max-width: 767px) {
	main.news_page {
		padding: 40px 0;
	}
	main.news_page div.inner {
		padding: 0 15px;
	}
	main.news_page div.list ul li a {
		gap: 16px;
		padding: 18px 4px;
	}
	main.news_page div.list ul li a div.thumb {
		width: 110px;
		flex: 0 0 110px;
	}
	main.news_page div.list ul li a div.body p.date {
		font-size: 13px;
	}
	main.news_page div.list ul li a div.body p.title {
		margin: 8px 0 0 0;
		font-size: 15px;
	}
	main.news_page div.pager {
		margin: 40px 0 0 0;
	}
	main.news_page div.pager ul li {
		width: 38px;
		height: 38px;
	}
	main.news_page.single article div.head h1.title {
		font-size: 20px;
	}
	main.news_page.single article div.eyecatch {
		margin: 30px 0 0 0;
	}
	main.news_page.single article div.entry {
		margin: 30px 0 0 0;
	}
	main.news_page.single article div.entry p {
		font-size: 14px;
	}
	main.news_page.single article div.entry h2 {
		font-size: 18px;
	}
	main.news_page.single article div.entry h3 {
		font-size: 16px;
	}
	main.news_page.single article div.entry figure.block-image figcaption {
		font-size: 12px;
	}
	main.news_page.single div.back {
		margin: 40px 0 0 0;
	}
	main.news_page.single div.back a {
		padding: 13px 40px;
		font-size: 14px;
	}
}