@charset "utf-8";

/* var() 関数 */
:root {
	/* コンテンツ幅 */
	--content-width: 1080px;
	--sp-content-min-width: 320px;

	/* フォントファミリー */
	--fontfamily-maru: "Zen Maru Gothic", sans-serif;

	/* 赤 */
	--emer-color-red: #d01b3d;
	/* グレー */
	--emer-color-gray: #cccccc;
	/* グレー2（薄） */
	--emer-color-gray2: #e6e6e6;

	/* 背景色 / 文字色 */
	--emer-bg-background: #d01b3d;
	--emer-bg-background2: #fdebef;
	--emer-bg-color: #ffffff;

	/* 基本文字色 */
	--text-color: #333333;

	/* a:link のリンク色 */
	--textlink-link: #1a0dab;
	/* a:visited のリンク色 */
	--textlink-visited: #660099;

	/* 通常版ボタン */
	--emer-btn-background: #333333;
	--emer-btn-border: 1px solid transparent;
	--emer-btn-borderradius: 0;
	--emer-btn-boxshadow: none;
	--emer-btn-color: #ffffff;
	--emer-btn-textdecoration: none;
	/* hover / focus */
	--emer-btn-hover-background: #333333;
	--emer-btn-hover-border: 1px solid transparent;
	--emer-btn-hover-borderradius: 0;
	--emer-btn-hover-boxshadow: none;
	--emer-btn-hover-color: #ffffff;
	--emer-btn-hover-textdecoration: underline;

	/* 余白 */
	--emer-content-margin: 60px;

}
/* var() 関数 ここまで */

/* 全体 */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* 非表示 */
#header .top_search-pc,
#spm_wrap {
	display: none !important;
}
#header2_box #he_right .header_search {
	display: none !important;
}
#infoBtn {
	display: none !important;
}
#footstep_wrap {
	display: none !important;
}
#back_or_pagetop > div#to_page_back {
	display: none !important;
}
#osusume_banner, #kaiyu_banner {
	display: none !important;
}
#author_box p.f_number {
	display: none !important;
}

/* 災害ヘッダ */
#emer_h1_bg {
	background: var(--emer-bg-background);
	color: var(--emer-bg-color, #ffffff);
}
#emer_h1_bg a {
	color: inherit;
}

#emer_h1 {
	width: var(--content-width, 1080px);
	margin: 0px auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}

#emer_h1 .emer_ttl {
	margin: 0 auto;
}
#emer_h1 .emer_ttl h1 {
	display: inline-block;
	background: url("/img/common/icon_emer.png") no-repeat left 54% transparent;
	background-size: 34px auto;
	color: inherit;
	font-size: 3.2rem;
	font-family: var(--fontfamily-maru);
	font-weight: bold;
	line-height: 1.3;
	margin: 0 auto;
	padding: 20px 0px 20px 50px;
}

/* #emer_h1 .emer_txt {
	width: calc(100% - 300px);
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	font-size: 1.3rem;
}
#emer_h1 .emer_txt .btn {
	min-width: 150px;
	margin-left: 10px;
	text-align: right;
}
#emer_h1 .emer_txt .btn a {
	display: inline-block;
	background: var(--emer-btn-background, #333333);
	border: var(--emer-btn-border, 1px solid transparent);
	border-radius: var(--emer-btn-borderradius, 0);
	box-shadow: var(--emer-btn-boxshadow, none);
	color: var(--emer-btn-color, #ffffff);
	text-decoration: var(--emer-btn-textdecoration, none);
	line-height: 1.8rem;
	padding: 10px;
	text-align: center;
	box-sizing: border-box;
}
#emer_h1 .emer_txt .btn a:hover,
#emer_h1 .emer_txt .btn a:focus {
	background: var(--emer-btn-hover-background, #333333);
	border: var(--emer-btn-hover-border, 1px solid transparent);
	border-radius: var(--emer-btn-hover-borderradius, 0);
	box-shadow: var(--emer-btn-hover-boxshadow, none);
	color: var(--emer-btn-hover-color, #ffffff);
	text-decoration: var(--emer-btn-hover-textdecoration, underline);
} */

/* 災害情報 */
#emer_info_wrap {
	background: var(--emer-bg-background);
	color: var(--emer-bg-color, #ffffff);
}

#emer_info {
	width: var(--content-width, 1080px);
	margin: 0px auto;
	padding: var(--emer-content-margin) 0px;
}
#emer_info h2 {
	font-family: var(--fontfamily-maru);
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.3;
	margin: 0px 0px 28px;
	padding: 0px;
}

#emer_info_txt {
	background: #ffffff;
	color: #333333;
	padding: 35px 50px 40px;
}
#emer_info_txt .updated {
	margin-bottom: 0.3em;
	font-weight: bold;
}

/* メイン */
#mymainback {
	width: auto !important;
	padding: 0 !important;
}
#main_a .content_back {
	background: var(--emer-bg-background2);
	padding: 100px 0;
}
#main_a .content_wrap,
#main_a .footer_message_wrap {
	width: var(--content-width);
	margin: 0 auto;
}
#main_a .content_wrap {
	display: grid;
	gap: 60px;
}

/* 重要なお知らせ *//* 防災メール連携（JavaScript） */
#top_important h2,
#main_box_emergency h2 {
	margin: 0;
	padding: 20px 30px;
	border-radius: 20px 20px 0 0;
	background: var(--emer-bg-background);
	color: var(--emer-bg-color, #ffffff);
	font-size: 3.2rem;
	font-family: var(--fontfamily-maru);
	line-height: 1.3;
	text-align: center;
}
.top_important_list,
.list_top_emer {
	border-radius: 0 0 20px 20px;
	background: var(--emer-bg-color);
	padding: 40px 50px;
}
#top_important ul,
#main_box_emergency ul {
	margin: 0px 0px 32px;
	list-style: none;
	display: grid;
	gap: 20px;
	padding: 0;
}
#top_important ul li,
#main_box_emergency ul li {
	width: 100%;
	display: flex;
	box-sizing: border-box;
	align-items: flex-start;
}
#top_important ul li > span,
#main_box_emergency ul li > span {
	vertical-align: top;
}
#top_important ul li > span.article_date {
	width: 15em;
    flex-shrink: 0;
}
#main_box_emergency ul li > span.emer_date {
	width: 18em;
}
#top_important ul li > span.article_date::before,
#main_box_emergency ul li > span.emer_date::before {
	content: "";
	display: inline-block;
	width: 0.9em;
	height: 0.9em;
	margin-right: 1em;
	border-radius: 50%;
	background-color: var(--emer-color-red);
}
#main_box_emergency ul li > span.emer_title {
	flex: 1;
}
#main_box_emergency ul li > span.emer_title > span {
	display: block;
	height: 1.5em;
	max-height: 1.5em;
	overflow: hidden;
	text-decoration: underline;
	cursor: pointer;
	color: var(--textlink-link);
}
#main_box_emergency ul li.emer_title_open > span.emer_title > span {
	height: auto;
	text-decoration: none;
	max-height: none;
}

#top_important .link_box,
#main_box_emergency .btn_emer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 16px;
}
#top_important .link_box span[class*="link_"] a,
#main_box_emergency .btn_emer #emer_mail_open_all {
	display: block;
	border: 2px solid var(--emer-color-red);
	border-radius: 30px;
	background: var(--emer-bg-color);
	color: var(--emer-color-red);
	font-size: 1.4rem;
	line-height: 1.4rem;
	font-weight: bold;
	text-decoration: none;
	padding: 10px 20px;
	text-align: center;
	width: 14em;
	max-width: 100%;
}
#top_important .link_box span[class*="link_"] a:hover,
#top_important .link_box span[class*="link_"] a:focus,
#main_box_emergency .btn_emer #emer_mail_open_all:hover,
#main_box_emergency .btn_emer #emer_mail_open_all:focus {
	text-decoration: underline;
}

/* リンク */
.emer_link {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
}

.emer_link_box {
	border-radius: 20px;
	background: var(--emer-bg-color);
}
.emer_link_box h2 {
border-radius: 20px 20px 0 0;
	background: var(--emer-bg-background);
	color: var(--emer-bg-color);
	font-size: 2.3rem;
	font-family: var(--fontfamily-maru);
	line-height: 1.6;
	text-align: center;
	margin: 0px;
	padding: 10px 20px;
}
.emer_link_box ul {
	margin: 0px;
	padding: 30px;
	list-style: none;
	display: grid;
	gap: 20px;
}
.emer_link_box ul li {
	padding-left: 1.2em;
	text-indent: -1.2em;
}
.emer_link_box ul li a {
	color: var(--text-color);
}
.emer_link_box ul li a::before {
	content: "";
	display: inline-block;
	width: 0.7em;
	height: 0.7em;
	margin-right: 0.5em;
	border-radius: 50%;
	background-color: #b6b6b6;
}
.emer_link_box ul li a[target="_blank"]::after {
    content: "";
    display: inline-block;
	width: 16px;
	height: 14px;
	background: url("/img/common/icon_link_ex.png") no-repeat center;
	background-size: 16px auto;
    margin: 0 0 0 5px;
}

/* メッセージ */
.footer_message_wrap {
	padding: 100px 0;
}
.emer_footer_message p {
	margin: 0px;
	color: var(--emer-color-red);
	font-size: 3.2rem;
	font-weight: bold;
	font-family: var(--fontfamily-maru);
}
.emer_footer_message p span {
	display: inline-block;
	vertical-align: top;
}

/* 通常トップへのリンク */
.emer_footer_link {
	margin-top: 25px;
}
.emer_footer_link > div.emer_footer_link_btn a {
	display: inline-block;
	background: var(--emer-btn-background, #333333);
	border: var(--emer-btn-border, 1px solid transparent);
	box-sizing: border-box;
	box-shadow: var(--emer-btn-boxshadow, none);
	border-radius: 30px;
	color: var(--emer-btn-color, #ffffff);
	padding: 10px 20px;
	margin-top: 25px;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
}
.emer_footer_link > div.emer_footer_link_btn a:hover,
.emer_footer_link > div.emer_footer_link_btn a:focus {
	background: var(--emer-btn-hover-background, #333333);
	border: var(--emer-btn-hover-border, 1px solid transparent);
	box-shadow: var(--emer-btn-hover-boxshadow, none);
	color: var(--emer-btn-hover-color, #ffffff);
	text-decoration: var(--emer-btn-hover-textdecoration, underline);
}

/* フッタ */
#author_info {
	background: var(--emer-bg-background);
	color: var(--emer-bg-color, #ffffff);
	padding: 100px 0 50px;
}
#author_info_wrap {
	width: var(--content-width);
	margin: 0 auto;
}
#author_info ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#author_info a {
	color: inherit;
	text-decoration: none;
}
#author_info_content {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 100px;
	margin-bottom: 80px;
}
#author_box p,
#counter_box p {
	font-size: 1.3rem;
	line-height: 1.5;
	margin: 0;
}
#author_box p.f_author,
#counter_box p.f_counter-title {
	font-size: 3.2rem;
	font-family: var(--fontfamily-maru);
	font-weight: bold;
	margin: 0 0 20px;
}
#counter_box ul.f_button-list {
	margin-top: 20px !important;
	display: flex;
	gap: 16px;
}
#counter_box ul.f_button-list li {
	border-radius: 30px;
	border: 2px solid #fff;
	width: 230px;
}
#counter_box ul.f_button-list a {
	display: block;
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	padding: 10px 20px;
}
#counter_box ul.f_button-list a::before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url("/img/common/icon_overtime_emer.png") no-repeat center center;
	background-size: 20px;
	margin-right: 5px;
	vertical-align: middle;
}
#counter_box ul.f_button-list a.button_extension::before {
	background: url("/img/common/icon_extension_emer.png") no-repeat center center;
	background-size: 20px;
}
#author_info_wrap .footer_navi {
	margin: 0 0 13px;
}
#author_info_wrap .footer_navi ul {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
}
#author_info_wrap .footer_navi li {
	margin: 0 20px 0 0;
}
#author_info_wrap .footer_navi li a {
	padding: 0 20px 0 0;
	color: #fff;
	font-size: 1.3rem;
	border-right: 1px solid #fff;
}
#author_info_wrap .footer_navi li:last-child a {
	border-right: none;
	padding-right: 0;
}

/* ==================================================
スマートフォン
================================================== */
@media screen and (max-width: 1080px) {

	/* var() 関数 */
	:root {
		/* 余白 */
		--emer-content-margin: 20px;
		/* コンテンツの左右余白 */
		--content-margin-side: 15px;
	}
	/* var() 関数 ここまで */

	/* 災害ヘッダ */
    #header2_box {
        padding-bottom: 13px!important;
    }
	#emer_h1 {
		display: block;
		width: auto;
		margin: 0px var(--mymainback-margin-side, 15px);
	}
	#emer_h1 .emer_ttl {
		width: auto;
		text-align: center;
	}
	#emer_h1 .emer_ttl h1 {
		font-size: 1.6rem;
		background-size: 21px auto;
		padding: 16px 0px 16px 28px;
	}
	/* #emer_h1 .emer_txt {
		display: block;
		width: auto;
		font-size: var(--fontsize-main-small, 1.3rem);
	}
	#emer_h1 .emer_txt .btn {
		min-width: auto;
		text-align: center;
		margin: 10px 0px;
	}
	#emer_h1 .emer_txt .btn a {
		display: block;
	} */

	/* 災害情報 */
	#emer_info_wrap {
		padding: 40px 15px;
	}
	#emer_info {
		width: 100%;
		/* min-width: var(--sp-content-min-width); */
		/* margin: 0 var(--content-margin-side, 15px); */
		padding: 0;
	}
	#emer_info_ttl h2 {
		font-size: 2rem;
		margin-bottom: 16px;
	}
	#emer_info_txt {
		padding: 16px;
	}

	/* メイン */
	#mymainback {
		margin: 0;
	}
	#main_a .content_back {
		padding: 60px 15px;
	}
	#main_a .content_wrap,
	#main_a .footer_message_wrap {
		gap: 40px;
		width: 100%;
		/* min-width: var(--sp-content-min-width); */
		/* margin: 0 var(--content-margin-side, 15px); */
	}

	/* 重要なお知らせ *//* 防災メール連携（JavaScript） */
	/* #top_important {
		margin: 0px 0px var(--emer-content-margin, 20px);
	} */
	#top_important h2,
	#main_box_emergency h2 {
		font-size: 2rem;
		padding: 12px 20px;
	}
	.top_important_list,
	.list_top_emer {
		padding: 16px;
	}
	#top_important ul,
	#main_box_emergency ul {
		margin: 0px 0px 10px;
		gap: 10px;
	}
	#top_important ul li,
	#main_box_emergency ul li {
		width: auto;
		flex-direction: column;
	}
	#top_important ul li > span,
	#main_box_emergency ul li > span {
		display: block;
	}
	#top_important ul li > span.article_date {
		width: auto;
	}
	#top_important ul li > span.article_date::before,
	#main_box_emergency ul li > span.emer_date::before {
		width: 0.7em;
		height: 0.7em;
		margin-right: 0.5em;
	}
	#top_important .link_box span[class*="link_"] a,
	#main_box_emergency .btn_emer #emer_mail_open_all {
		font-size: 1.2rem;
		padding: 7px 20px;
		width: 8em;
	}
	#main_box_emergency .btn_emer #emer_mail_open_all {
		width: 11em;
	}
	#top_important .link_box span.link_box__sp-hidden {
		display: none !important;
	}

	/* 防災メール連携（JavaScript） */
    #main_box_emergency ul li > span.emer_date {
		width: auto;
	}
	/* #main_box_emergency .box_top_emer {
		margin: 0px 0px var(--emer-content-margin, 20px);
	}
	#main_box_emergency h2 {
		font-size: 2rem;
		padding: 15px 20px;
	}

	#main_box_emergency ul li {
		display: block;
		width: auto;
		padding: 15px 20px;
	}
	#main_box_emergency ul li > span {
		display: block;
	}

	#main_box_emergency .btn_emer {
		text-align: center;
		padding: 30px 20px;
	}
	#main_box_emergency .btn_emer #emer_mail_open_all {
		font-size: 1.3rem;
	} */

	/* リンク */
	/* 1080-601pxは2カラム */
	.emer_link {
		grid-template-columns: repeat(2, 1fr);
	}
	.emer_link_box h2 {
		font-size: 2rem;
		padding: 12px 20px;
	}
	.emer_link_box ul {
		padding: 16px;
		gap: 10px;
	}

	/* メッセージ */
	#main_a .footer_message_wrap {
		padding: 60px 15px;
	}
	.emer_footer_message p {
		font-size: 2rem;
	}

	/* 通常トップへのリンク */
	.emer_footer_link {
		margin-top: 16px;
		font-size: 1.4rem;
	}
	.emer_footer_link > div {
		display: block;
	}
	.emer_footer_link > div.emer_footer_link_btn a {
		margin-top: 16px;
	}
	/* フッタ */
	#author_info {
		padding: 60px 15px 40px;
	}
	#author_info_wrap {
		width: 100%;
	}
	#author_info_content {
		grid-template-columns: repeat(1, 1fr);
		gap: 40px;
		margin-bottom: 60px;
	}
	#author_box p.f_author,
	#counter_box p.f_counter-title {
		font-size: 2rem;
		margin: 0 0 16px;
	}
	#author_box p.f_detail {
		margin-top: 16px;
	}
	#counter_box ul.f_button-list {
		margin-top: 16px;
		flex-direction: column;
	}
    #author_info_wrap .footer_navi li a {
        font-size: 1.1rem;
    }

    /* 文字拡大時 */
    .font_size_changed #counter_box ul.f_button-list li {
        width: 100%;
    }
}
/* ==================================================
スマートフォン ここまで
================================================== */

@media screen and (max-width: 600px) {
	/* リンク */
	/* 600-1pxは1カラム */
	.emer_link {
		grid-template-columns: repeat(1, 1fr);
	}
}