@charset "utf-8";

img {
	vertical-align: bottom;
}

.floating {
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.floating_wrap {
	border-radius: 10px;
}

.article_date:before {
	content: '（';
}
.article_date:after{
	content: '）';
}

/* 全体 */
#container {
	min-width: 0;
}

/* ヘッダ */
#he_left {
	height: 175px;
	background: url(/img/top/bg_logo.png) no-repeat;
}
#he_left #logo a {
	height: 175px;
	padding: 25px 0 0 20px;
}
#he_right {
	padding: 20px 0 10px;
}

/* スライドショー */
.photo_caption {
	display: none;
}

#top_graphic {
	width: 100%;
	overflow: hidden;
	position: relative;
}
#top_graphic:before {
	/* content: ''; */
	display: block;
	width: 135px;
	height: 51px;
	/* background: url(/img/top/text_slide-sub.png) no-repeat; */
	position: absolute;
	bottom: 11px;
	right: calc(50% - 491px);
	z-index: 1;
}
#top_graphic > img {
	position: absolute;
	top: 93px;
	left: calc(50% - 396px);
	z-index: 1;
}

#top_photo {
	position: relative;
}

#mp_control_box {
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	position: relative;
}
#mp_control_box > button {
	margin: 0;
	padding: 0;
	background: rgba(12,103,227,0.8);
	border: none;
	border-radius: 100%;
	cursor: pointer;
	transition:background-color .2s;
	position: absolute;
	top: -220px;
}
#mp_control_box > button:hover {
	background-color: #0c67e3;
}
button#mp_control_prev {
	left: 10px;
}
button#mp_control_next {
	right: 10px;
}
button#mp_control_pause, button#mp_control_play {
	right: 60px;
}

/* メイン */
#mymainback {
	display: block;
	width: 100%;
	max-width: none;
}
.top_contents {
	clear: both;
	width: 100%;
	padding: 50px 0;
	overflow: hidden;
}
.top_contents h2 {
	font-size: 1.8rem;
}
.top_contents_inner {
	width: 98%;
	max-width: 1024px;
	margin: 0 auto;
}
#contents1 {
	background: url(/img/top/bg_wave.png) no-repeat center bottom #d7f6fc;
	padding-bottom: 20px;
}
#contents2 {
	padding-top: 10px;
}
#contents3 {
	background-color: #b3e7f2;
}
#contents3 > div {
	display: grid;
	grid-template-columns: 628px 1fr ;
	grid-template-rows:auto auto ;
	gap: 15px 30px;
	justify-content: stretch;
}
#top_photonews { grid-area: 1 / 2 / 2 / 3; }
#top_tab_wrap {
	grid-area: 1 / 1 / 3 / 2;
	flex-grow: 1;
}
#top_calendar { grid-area: 2 / 2 / 3 / 3; }
#contents4 {
	background: url(/img/top/bg_circle.png) no-repeat center center #67d0e5;
}
#contents5 {
	background-color: #d5e7e7;
}
#contents7 {
	background-color: #d2eefc;
}
#contents7 > div {
	position: relative;
}
#contents7 > div:before {
	content: url(/img/top/bg_illust-left.gif);
	position: absolute;
	left: -616px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#contents7 > div:after {
	content: url(/img/top/bg_illust-right.gif);
	position: absolute;
	right: -616px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

/* 防災・防犯・安全リアルタイム情報 */
#main_box_emergency {
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
	position: relative;
}
#main_box_emergency h2 {
	width: 160px;
	margin: 0;
	padding: 0 10px;
	color: #c00;
	line-height: 1.3;
}
.list_top_emer {
	width: calc(100% - 180px - 100px);
	padding-right: 100px;
	padding-bottom: 2rem;
	position: relative;
}
#main_box_emergency ul {
	margin: 0 0 0 40px;
	list-style: none;
}
#main_box_emergency ul li {
	width: 100%;
	margin: 4px 0;
	position: relative;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#main_box_emergency ul li > span.emer_title {
	display: block;
	width: 100%;
	overflow: hidden;
	cursor: pointer;
	position: relative;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 5px 25px 5px 5px;
}
#main_box_emergency .list_top_emer span.mail_content,
#main_box_emergency .list_top_emer span.emer_date {
	display: inline-block;
	vertical-align: middle;
}
#main_box_emergency .list_top_emer span.emer_date {
	position: relative;
	padding: 0 1em;
}
#main_box_emergency .list_top_emer span.mail_content {
	color: #c00;
	text-decoration: underline;
	height: 1.5em;
	overflow: hidden;
	width: 95%;
}
#main_box_emergency .list_top_emer .emer_mail_open span.mail_content,
#main_box_emergency .list_top_emer .emer_mail_open span.emer_date {
	display: inline;
	width: auto;
}

#main_box_emergency .list_top_emer .emer_mail_open span.mail_content {
	height: auto;
	color: inherit;
	text-decoration: none;
}
#main_box_emergency ul li > span.emer_title:before {
	content: url(/img/top/icon_bousai.png);
	position: absolute;
	right: 0;
	top: 8px;
	width: 20px;
	height: 20px;
	z-index: 1;
}
#main_box_emergency ul li span.emer_date:before {
	content: '（';
	background: #fff;
	position: absolute;
	left: 0;
}
#main_box_emergency ul li span.emer_date:after {
	content: '）';
	background: #fff;
	position: absolute;
	right: 0;
}
/*
#main_box_emergency ul li:before {
	content: url(/img/top/icon_bousai.png);
	position: absolute;
	right: 0;
	top: 0;
	width: 20px;
	height: 20px;
	z-index: 1;
}
#main_box_emergency ul li > span.emer_title.emer_mail_open {
	height: auto;
	color: inherit;
	text-decoration: none;
}
#main_box_emergency ul li > span.emer_date {
	display: block;
	width: 16em;
	max-width: 40%;
	padding: 0 1em;
	white-space: nowrap;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
}
html[style*="font-size"] #main_box_emergency ul li > span.emer_date {
	white-space: normal;
}
*/
#main_box_emergency .link_box {
	width: 80px;
	text-align: right;
	position: absolute;
	right: 0;
	bottom: 0;
}
#main_box_emergency .link_box span button {
	display: block;
	width: 100%;
	margin: 0;
	padding: 4px 0;
	background-color: #c00;
	color: #fff;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

/* 重要なお知らせ */
#top_important {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	-webkit-box-align: center;
	align-items: center;
	margin-top: 20px;
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
	position: relative;
}
#top_important h2 {
	width: 160px;
	margin: 0;
	padding: 0 10px;
	color: #c00;
}
#top_important_list {
	width: calc(100% - 180px - 80px);
}
#top_important_list ul {
	margin: 0 0 0 40px;
	list-style: none;
}
#top_important_list ul li {
	margin: 4px 0;
}
#top_important_list a {
	color: #c00;
}
#top_important_list a:hover {
	color: inherit;
}
#top_important .link_box {
	width: 80px;
	text-align: right;
}
#top_important .link_box span a {
	display: block;
	width: 100%;
	margin: 5px 0;
	padding: 4px 0;
	background-color: #c00;
	color: #fff;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	cursor: pointer;
}

.important_links {
	width: 100%;
	margin: 10px 0;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}
.important_links > a {
	display: block;
	width: 24%;
	padding: 10px 0;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
}
.important_links > a:nth-child(1),
.important_links > a:nth-child(2) {
	background-color: #c00;
	color: #fff;
}
.important_links > a:nth-child(3),
.important_links > a:nth-child(4) {
	background-color: #f5Ba32;
	color: inherit;
}

/* 検索 */
#top_kensaku {
	display: -webkit-box;
	display: flex;
	padding: 20px;
	background: url(/img/top/bg_search.png) no-repeat center bottom;
	background-color: #0c67e3;
	color: #fff;
	border-radius: 10px 10px 0 0;
}
.top_kensaku_inner {
	width: 50%;
	display: -webkit-box;
	display: flex;
}
.top_kensaku_inner h2 {
	margin: 0 10px;
	white-space: nowrap;
}
#top_search_keyword {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#cse-search-box {
	max-width: 280px;
}
#tmp_query {
	width: calc(100% - 80px) !important;
}
#submit {
	width: 80px;
}
#cse_filetype {
	width: 100%;
}

/* 注目ワード */
#search_trend_word {
	width: 50%;
	display: -webkit-box;
	display: flex;
}
#search_trend_word h2 {
	min-width: 5em;
	margin: 0 30px 0 0;
}
#search_trend_word p {
	margin: 0;
	font-size: 1.5rem;
}
#search_trend_word p a {
	margin-right: 1em;
	text-decoration: underline;
	cursor: pointer;
}

/* お役立ちメニュー */
#top_oyaku {
	margin-top: -1px;
	padding: 0 20px 20px;
	background-color: #0a52b6;
	color: #fff;
	border-radius: 0 0 10px 10px;
}
#top_oyaku h2 {
	margin: 0 20px 5px;
}
#top_oyaku ul {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	list-style: none;
}
#top_oyaku ul li {
	width: 140px;
	margin: 10px;
	background:-webkit-gradient(linear,center top,center bottom,color-stop(49.9%,#ffffff),color-stop(50.1%,#f5f5f5));
	background:-webkit-linear-gradient(top,#ffffff 49.9%,#f5f5f5 50.1%);
	background:linear-gradient(to bottom,#ffffff 49.9%,#f5f5f5 50.1%);
	background-color: #fff;
	color: #333;
	border: 2px solid #fff;
	border-radius: 8px;
	transition: border-color .2s;
}
#top_oyaku ul li:hover {
	font-weight: bold;
	border-color: #f5ba32;
}
#top_oyaku ul li a {
	display: block;
	padding: 65px 1px 1px;
	background-repeat: no-repeat;
	background-position: center top 10px;
	color: inherit;
	font-size: 1.4rem;
	text-align: center;
	text-decoration: none;
}
#top_oyaku ul li:nth-child(1) a { background-image: url(/img/top/icon_oyakudachi001.png); }
#top_oyaku ul li:nth-child(2) a { background-image: url(/img/top/icon_oyakudachi002.png); }
#top_oyaku ul li:nth-child(3) a { background-image: url(/img/top/icon_oyakudachi003.png); }
#top_oyaku ul li:nth-child(4) a { background-image: url(/img/top/icon_oyakudachi004.png); }
#top_oyaku ul li:nth-child(5) a { background-image: url(/img/top/icon_oyakudachi005.png); }
#top_oyaku ul li:nth-child(6) a { background-image: url(/img/top/icon_oyakudachi006.png); }

/* 暮らしのメニュー */
#top_kurashi {
	margin-top: 30px;
	padding: 20px;
	background-color: #67d0e5;
	border-radius: 10px;
}
#top_kurashi h2 {
	margin: 0 20px 5px;
}
#top_kurashi ul {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	list-style: none;
}
#top_kurashi ul li {
	width: 140px;
	margin: 10px;
	background:-webkit-gradient(linear,center top,center bottom,color-stop(49.9%,#ffffff),color-stop(50.1%,#f5f5f5));
	background:-webkit-linear-gradient(top,#ffffff 49.9%,#f5f5f5 50.1%);
	background:linear-gradient(to bottom,#ffffff 49.9%,#f5f5f5 50.1%);
	background-color: #fff;
	color: #333;
	border: 2px solid #fff;
	border-radius: 8px;
	transition: border-color .2s;
}
#top_kurashi ul li:hover {
	font-weight: bold;
	border-color: #f5ba32;
}
#top_kurashi ul li a {
	display: block;
	padding: 65px 1px 1px;
	background-repeat: no-repeat;
	background-position: center top 10px;
	color: inherit;
	font-size: 1.4rem;
	text-align: center;
	text-decoration: none;
}
#top_kurashi ul li:nth-child(1) a { background-image: url(/img/top/icon_kurashi01.png); }
#top_kurashi ul li:nth-child(2) a { background-image: url(/img/top/icon_kurashi02.png); }
#top_kurashi ul li:nth-child(3) a { background-image: url(/img/top/icon_kurashi03.png); }
#top_kurashi ul li:nth-child(4) a { background-image: url(/img/top/icon_kurashi04.png); }
#top_kurashi ul li:nth-child(5) a { background-image: url(/img/top/icon_kurashi05.png); }
#top_kurashi ul li:nth-child(6) a { background-image: url(/img/top/icon_kurashi06.png); }
#top_kurashi ul li:nth-child(7) a { background-image: url(/img/top/icon_kurashi07.png); }
#top_kurashi ul li:nth-child(8) a { background-image: url(/img/top/icon_kurashi08.png); }
#top_kurashi ul li:nth-child(9) a { background-image: url(/img/top/icon_kurashi09.png); }
#top_kurashi ul li:nth-child(10) a { background-image: url(/img/top/icon_kurashi10.png); }
#top_kurashi ul li:nth-child(11) a { background-image: url(/img/top/icon_kurashi11.png); }
#top_kurashi ul li:nth-child(12) a { background-image: url(/img/top/icon_kurashi12.png); }

/* フォトニュース */
#top_photonews {
	padding: 20px;
	background-color: #fdf8e6;
	border-radius: 10px;
	position: relative;
}
#top_photonews h2 {
	margin: 0;
	width: 107px;
	height: 153px;
	background: url(/img/top/bg_photonews.png) no-repeat;
	line-height: 1.2;
	text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff;
	position: absolute;
	top: 20px;
	left: 20px;
}
#lettering {
}
.lettering_box {
	width: 100%;
}
.lettering_box > div {
	text-align: right;
}
.lettering_box_img {
	padding-left: 107px;
	text-align: right;
}
.lettering_box_img img {
	max-height: 200px;
	object-fit: contain;
}
.lettering_box_text {
}
.lettering_box_text .article_date {
	text-align: right;
}
.lettering_box_text .article_title {
	text-align: center;
}
#lettering .link_box {
	text-align: center;
}
#lettering .link_box span {
	display: block;
	margin-top: 5px;
}
#lettering .link_box span a {
	display: inline-block;
	padding: 5px 30px;
	background-color: #0c67e3;
	color: #fff;
	font-size: 1.5rem;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
}

/* トピックス・イベント募集 */
#top_tab_wrap {
	box-sizing: border-box;
	display: -webkit-box;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	flex-direction: column;
	flex-wrap: wrap;
	gap: 0;
	height: 100%;
}
#top_tab_title {
	height: fit-content;
	flex-shrink: 0;
}
#top_tab_title ul {
	margin: 0 0 -1px;
	list-style: none;
	display: table;
	width: 100%;
	table-layout: fixed;
}
#top_tab_title ul li {
	display: table-cell;
}
#top_tab_title ul li button {
	width: 100%;
	margin: 0;
	padding: 8px 0 4px;
	background: #fadc98;
	font-size: 1.8rem;
	font-weight: bold;
	border: none;
	border-radius: 10px 10px 0 0;
	cursor: pointer;
	min-height: 50px;
	position: relative;
	z-index: 1;
}
#top_tab_title ul li:nth-child(n+2) button {
	width: 99%;
	margin-left: 1%;
}
#top_tab_title ul li.tab_on button {
	background-color: #fff;
}
#top_tab_detail {
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 0 0 10px 10px;
	box-sizing: border-box;
	align-self: stretch;
	flex-grow: 1;
}
#top_tab_detail ul {
	margin: 0;
	list-style: none;
}
#top_tab_detail ul li {
	margin: 1.5rem 0;
	padding-left: 18px;
	background: url(/img/top/icon_list.png) no-repeat left 0.4em;
	min-height: 2em;
}
#top_tab_detail .link_box {
	text-align: right;
	align-self: flex-end;
	flex-grow: 1;
	margin-top: auto;
	margin-bottom: auto;
	display: flex;
	align-items: center;
}
#top_tab_detail .link_box span {
	display: inline-block;
	margin-left: 10px;
}
#top_tab_detail .link_box span a {
	display: block;
	padding: 5px 30px;
	background-color: #0c67e3;
	color: #fff;
	font-size: 1.5rem;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
}

.top_tab_detail_box {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	height: 100%;
}

/* 天気 */
#top_weather {
	margin-bottom: 30px;
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
}

/* イベントカレンダー */
#top_calendar {
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
}
#top_calendar h2 {
	width: calc(100% + 60px);
	margin: -20px -30px 15px -30px;
	padding: 10px 12px 6px;
	line-height: 1.2;
	background-color: #f5ba32;
	text-align: center;
	border-radius: 10px 10px 0 0;
	box-sizing: border-box;
}
#top_calendar ul.calendar_index {
	margin: 0;
	list-style: none;
	font-size: 1.5rem;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}
#top_calendar ul.calendar_index li.calendar_index_now a {
	color: inherit;
	font-weight: bold;
	text-decoration: none;
}
#top_calendar_detail table {
	width: 100%;
	font-size: 1.2rem;
	text-align: center;
	border-collapse: collapse;
}
#top_calendar_detail table th {
	padding: 4px 0;
	font-weight: normal;
	background-color: transparent;
	border: 2px solid #fff !important;
	border-collapse: collapse;
}
#top_calendar_detail table td {
	padding: 0;
	border: 2px solid #fff !important;
	border-collapse: collapse;
}
#top_calendar_detail table td a {
	display: block;
	padding: 4px 0;
}
#top_calendar_detail table *.cal_sun {
	background-color: #ffdbdb;
	color: #c00;
}
#top_calendar_detail table *.cal_sat {
	background-color: #beeeee;
	color: #0d59b7;
}
#top_event_today_title {
	margin: 15px 0 5px;
	font-weight: bold;
	text-align: center;
}
#top_event_today ul {
	margin: 0;
	list-style: none;
}
#top_event_today ul li,
#top_event_today p.no_data {
	margin: 4px 0 0;
	padding-left: 18px;
	position: relative;
}
#top_event_today ul li:before,
#top_event_today p.no_data:before {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #666;
	border-right: 2px solid #666;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transform-origin: center center;
	transform-origin: center center;
	position: absolute;
	left: 0;
	top: 0.5em;
}

/* ツイッター・広報・動画 */
#contents4 {
	padding-bottom: 35px;
}
#contents4 > div {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}
#contents4 > div > div {
	width: 320px;
	box-sizing: border-box;
	margin: 0 auto 15px;
}

#top_sns .sns_bn {
	display: block;
	padding: 0;
	margin: 0 0 15px;
}
#top_sns .sns_bn:last-child {
	margin-bottom: 0;
}

#top_koho {
	padding: 20px 30px;
	background-color: #0c67e3;
	color: #fff;
	border-radius: 10px;
}
#top_koho h2 {
	margin: 0;
	text-align: center;
}
#top_koho p {
	margin: 20px 0 0;
	text-align: center;
}

#top_movie {
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
}
#top_movie h2 {
	margin: 0 0 10px;
	text-align: center;
}
.movie_box {
	width: 100%;
	height: 0;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 56.25%;
	overflow: hidden;
	position: relative;
}
.movie_box iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.movie_title {
	margin: 2px 0 15px;
	font-size: 1.4rem;
}
#top_movie > a {
	display: block;
	max-width: 240px;
	margin: 0 auto;
	padding: 5px 30px;
	background-color: #0c67e3;
	color: #fff;
	font-size: 1.5rem;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	position: relative;
}
#top_movie > a:before {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transform-origin: center center;
	transform-origin: center center;
	position: absolute;
	right: 15px;
	top: calc(0.6em + 5px);
}

/* アンバサダー */
#top_ambassador {
	width: 100%;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	align-items: center;
}
#top_ambassador h2 {
	margin: 0;
}
.top_ambassador_detail {
	width: 580px;
	min-height: 150px;
	background: url(/img/top/ambassador.jpg) no-repeat right top;
	text-align: right;
	position: relative;
}
.top_ambassador_detail img {
	position: absolute;
	right: 0;
	top: 20px;
}
.top_ambassador_detail a {
	display: block;
	padding: 8px 35px;
	background-color: #0c67e3;
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	position: absolute;
	right: 0;
	bottom: 0;
}
.top_ambassador_detail a:before {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transform-origin: center center;
	transform-origin: center center;
	position: absolute;
	right: 15px;
	top: calc(0.6em + 8px);
}

/* 人口と世帯数 */
#top_population {
	display: -webkit-box;
	display: flex;
}
#top_population > div {
	width: 25%;
	text-align: center;
}
#top_population h3 {
	width: 5em;
	margin: 0 auto;
	background:-webkit-gradient(linear,left center,right center,color-stop(0%,#fc8c47),color-stop(100%,#ffcc34));
	background:-webkit-linear-gradient(left,#fc8c47 0%,#ffcc34 100%);
	background:linear-gradient(to right,#fc8c47 0%,#ffcc34 100%);
	font-size: 1.5rem;
	border-radius: 5px;
}
#top_population p {
	margin: 20px 0 0;
	padding-top: 58px;
	font-size: 1.3rem;
	font-weight: bold;
	line-height: 1.3;
	background-repeat: no-repeat;
	background-position: center top;
}
#top_population p strong {
	display: block;
	font-size: 2.4rem;
}
#top_population > div:nth-of-type(1) p {
	background-image: url(/img/top/icon_ppl.png);
}
#top_population > div:nth-of-type(2) p {
	background-image: url(/img/top/icon_ppl-male.png);
}
#top_population > div:nth-of-type(3) p {
	background-image: url(/img/top/icon_ppl-female.png);
}
#top_population > div:nth-of-type(4) p {
	background-image: url(/img/top/icon_ppl-setai.png);
}
.ppl_dat {
	margin-top: 20px;
	font-size: 1.4rem;
	text-align: right;
}

/* バナー */
#top_banner_right ul {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	margin: 0;
	list-style: none;
}
#top_banner_right ul li, #top_banner_right ul li img {
	border-radius: 10px;
}

/* 事業PR */
#top_banner_left {
	margin-top: 40px;
}
#top_banner_left ul {
	width: calc(100% + 20px);
	margin: 0;
	list-style: none;
}
#top_banner_left ul:not([class]) {
	width: 100%;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}
#pr_control_box {
	height: 40px;
	margin: 10px 10px 0;
	position: relative;
}
#pr_control_box > button {
	margin: 0;
	padding: 0;
	background: rgba(12,103,227,0.8);
	border: none;
	border-radius: 100%;
	cursor: pointer;
	transition:background-color .2s;
	position: absolute;
}
#pr_control_box > button:hover {
	background-color: #0c67e3;
}
button#pr_control_prev {
	left: 0;
}
button#pr_control_next {
	right: 0;
}
button#pr_control_pause, button#pr_control_play {
	right: 50px;
}

/* リンクリスト */
#top_linklist {
	display: -webkit-box;
	display: flex;
	margin-top: 40px;
	padding: 20px;
	background-color: #fbfdff;
	border-radius: 10px;
	box-sizing: border-box;
}
#top_linklist > div {
	width: 24%;
	padding-left: 1%;
}
#top_linklist h2 {
	margin: 0;
	padding-left: 22px;
	background: url(/img/top/icon_list-ttl.png) no-repeat left center;
}
#top_linklist ul {
	margin: 0;
	list-style: none;
	font-size: 1.5rem;
}
#top_linklist ul li {
	margin: 4px 0;
	padding-left: 18px;
	background: url(/img/top/icon_list.png) no-repeat left 0.4em;
}

/* バナー広告欄 */
#top_koukoku {
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 50px 0;
	display: -webkit-box;
	display: flex;
}
.top_koukoku_ttl {
	width: calc(100% - 920px);
	padding-right: 20px;
}
.top_koukoku_ttl > h2 {
	margin: 20px 0;
	font-size: 1.6rem;
}
.top_koukoku_ttl > p {
	font-size: 1rem;
	line-height: 1.2;
}
.top_koukoku_bnr {
	width: 900px;
}
#top_koukoku ul {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}
#top_koukoku ul li {
	margin: 0 0 10px 10px;
}

#back_or_pagetop > div {
	z-index: 1;
}

/* タブレット */
@media screen and (max-width : 1023px) {

	img {
		max-width: 100%;
		height: auto !important;
		vertical-align: top;
	}

	/* ヘッダ */
	#he_left {
		width: 180px;
		height: 101px;
		background-image: url(/img/common/bg_logo.png);
		background-size: 100%;
	}
	#he_left #logo a {
		height: 101px;
		padding: 8px 20px 0 20px;
	}
	#he_right {
		min-height: 70px;
	}

	/* スライド */
	#top_graphic:before {
		width: 100px;
		height: 38px;
		background-size: 100%;
		bottom: 11px;
		right: 21px;
	}
	#top_graphic > img {
		width: 60vw;
		position: absolute;
		top: 20px;
		left: 50px;
	}
	#mp_control_box {
		position: static;
	}
	#mp_control_box > button {
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}

	/* メイン */
	.top_contents {
		padding: 30px 0;
	}

	#contents3 > div {
		display: block;
	}
	#contents3 > div > div {
		width: auto !important;
	}
	#contents3 #lettering {
		display: flex;
		flex-wrap: wrap;
		justify-content: end;
		position: relative;
	}
	#contents3 .lettering_box {
		display: flex;
	}
	#contents3 #lettering .link_box {
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.lettering_box_text .article_title {
		text-align: left;
	}
	#top_tab_detail ul li {
		min-height: auto;
	}
	#contents4 > div {
		flex-wrap: wrap;
	}
	#contents4 > div > div#top_twitter,
	#contents4 > div > div#top_koho {
		width: 49%;
	}
	#contents4 > div > div#top_movie {
		width: 100%;
		margin-top: 15px;
	}
	.top_movie_inner {
		display: inline-block;
		width: 46%;
		margin: 0 2%;
		vertical-align: top;
	}

	/* 防災・防犯・安全リアルタイム情報 */
	#main_box_emergency {
		padding: 20px 10px;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-direction: column;
	}
	#main_box_emergency h2 {
		width: 100%;
		box-sizing: border-box;
	}
	.list_top_emer {
		width: 100%;
		padding: 0;
	}
	#main_box_emergency ul {
		margin: 10px 0 0 10px;
	}
	#main_box_emergency .link_box {
		width: 100%;
		text-align: right;
		position: static;
	}
	#main_box_emergency .link_box span {
		display: inline-block;
	}
	#main_box_emergency .link_box span button {
		min-width: 80px;
	}

	/* 重要なお知らせ */
	#top_important {
		padding: 20px 10px;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-direction: column;
	}
	#top_important_ttl {
		width: 100%;
	}
	#top_important h2 {
		width: auto;
	}
	#top_important_list {
		width: 100%;
	}
	#top_important_list ul {
		margin: 10px 0 0 10px;
	}
	#top_important .link_box {
		width: 100%;
		text-align: right;
	}
	#top_important .link_box span {
		display: inline-block;
	}
	#top_important .link_box span a {
		min-width: 80px;
	}

	/* 検索 */
	#top_kensaku {
		padding: 20px 0 30px;
	}
	.top_kensaku_inner {
		display: block;
	}
	#top_search_keyword {
		display: block;
	}

	/* 注目ワード */
	#search_trend_word {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-direction: column;
	}
	#search_trend_word h2 {
		margin: 0;
	}

	/* お役立ちメニュー */
	#top_oyaku {
		padding: 0 10px 20px;
	}
	#top_oyaku h2 {
		margin: 0 0 5px 5px;
	}
	#top_oyaku ul li {
		width: calc((99.9% / 6) - 14px);
		margin: 5px;
	}
	#top_oyaku ul li a {
		font-size: 1.2rem;
	}

	/* 暮らしのメニュー */
	#top_kurashi {
		padding: 20px 10px;
	}
	#top_kurashi h2 {
		margin: 0 0 5px 5px;
	}
	#top_kurashi ul li {
		width: calc((99.9% / 6) - 14px);
		margin: 5px;
	}
	#top_kurashi ul li a {
		font-size: 1.2rem;
	}

	/* トピックス・イベント募集 */
	#top_tab_wrap {
		margin-top: 20px;
	}

	/* 天気 */
	#top_weather {
		margin: 20px 0;
	}

	/* カレンダー */
	#top_calendar {
		margin-top: 20px;
		display: -webkit-box;
		display: flex;
		flex-wrap: wrap;
		-webkit-box-pack: justify;
		justify-content: space-between;
	}
	#top_calendar_detail, #top_event_today {
		width: 47%;
	}

	/* アンバサダー */
	#top_ambassador h2 {
		width: 35%;
	}
	.top_ambassador_detail {
		width: 65%;
		background-size: contain;
	}
	.top_ambassador_detail img {
		width: 65%;
		top: 15%;
	}

	/* バナー集 */
	#top_banner_right ul li {
		width: 32%;
		margin: 0 0.5%;
	}
	#top_banner_left ul {
		width: 100%;
	}
	#top_banner_left ul li {
		margin: 0 0.5%;
	}

	/* リンクリスト */
	#top_linklist {
		flex-wrap: wrap;
	}
	#top_linklist > div {
		width: 46%;
		padding: 10px 2%;
	}

	/* バナー広告欄 */
	#top_koukoku {
		display: block;
		width: 98%;
		padding: 20px 0;
	}
	.top_koukoku_ttl {
		width: auto;
		margin: 20px 0;
	}
	.top_koukoku_ttl > * {
		display: inline-block;
	}
	.top_koukoku_ttl > h2 {
		margin: 0 10px;
	}
	.top_koukoku_bnr {
		width: 96%;
		padding: 0 2%;
	}

}
/* タブレット ここまで */