@charset "utf-8";
:root{
	--top-content-width: 1140px;
}

/* 足あとを非表示 */
#footstep_wrap {
	display: none !important;
}

#container{
	
}
#header{
	display: grid;
}
#header2{
	position: absolute;
	z-index: 100;
	place-self: center;
	background: #fff;
	top: 30px;
	border-radius: 8px;
}
#he_left #logo h1{
	display: grid;
	place-content: center center;
}
.tpl_top #he_left #logo img{
	width: 127px;
}


#header2_box{
	padding: 10px 20px;
	box-sizing: border-box;
	width: var(--top-content-width);
}
dialog#h_search[open] {
	top: 100%;
}


#top_mainphoto_all_wrap_outer {
	width: 100%;
	overflow-x: hidden;
	height: 1050px;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
}

#h_search[open] {
	top: 100%;
}




#top_mainphoto_all_wrap {
	width: 100%;
	position: relative;
	display: grid;
	grid-template-columns: 100% 100%;
}

#top_photo_main_wrap,#top_photo_kanko_wrap {
	position: relative;
	/* height: 1050px; */
	width: 100%;
	top: 0;
	scroll-snap-align: start;
}

#top_photo_main_wrap {
	left: 0;
}

#top_photo_kanko_wrap {
	/* left: 100%; */
}



#top_photo_main,#top_photo_kanko {
	display: grid;
	width: 100%;
	height: 1050px;
	position: relative;
}

.top_photo_content {
	position: absolute;
	z-index: 10;
	display: grid;
	grid-template-columns: 1fr;
	width: min(100%,var(--top-content-width));
	/* margin-inline: auto; */
	/* inset: 0; */
	place-self: start center;
	top: 200px;
}
.top_photo .photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}
:where(#top_photo_main_list,#top_photo_kanko_list) .photo {
	position: relative;
	width: min(100%,2000px);
	height: 1050px;
	margin-inline: auto;
}
#top_photo_main_list .photo a{
	display: block;
	height: 100%;
}
:where(#top_photo_main_list,#top_photo_kanko_list) .photo::after{
	content: '';
	display: block;
	width: 100%;
	height: 87px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(/img/top/top-photo-coverbg.png) no-repeat center bottom;
	background-size: auto 100%;
	pointer-events: none;
}


p.maintext {
	color: #000;
	filter: invert(1);
	font-weight: bold;
	font-size: 5.6rem;
	line-height: 1.72;
	letter-spacing: 0.24em;
	margin: 0;
	padding: 0;
	/* white-space: nowrap; */
	/* align-self: end; */
	position: absolute;
	top: 290px;
}
p.maintext span{
	display: block;
	text-shadow: 0px 0px 1px #fff,0px 0px 3px #fff;
}
p.maintext span.text_sub{
	margin-top: 36px;
	font-size: 1.6rem;
	letter-spacing: 0;
	line-height: 1;
	text-transform: uppercase;
}

.top_photo_content .contentbox{
	width: 480px;
	margin-left: auto;
	margin-right: 30px;
	padding: 40px 30px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	/* backdrop-filter: blur(0px); */
	/* -webkit-backdrop-filter: blur(0px); */
	border: 1px solid rgba(255, 255, 255, 0.43);
	box-sizing: border-box;
}

.top_photo_content .contenbox_links {
	display: grid;
	grid-template-columns: repeat(2,1fr);
	/* grid-template-rows: auto auto auto auto; */
	gap: 14px 12px;
	margin: 0px 0px 14px;
}

a.link_bousai {
	grid-column: span 2;
	background: #f00;
}

.top_photo_content .contenbox_links a:any-link {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr auto;
	justify-content: center;
	gap: 10px;
	text-align: center;
	text-decoration: underline;
	background: #e9f2ee;
	border-radius: 8px;
	padding: 20px;
	text-decoration: none;
	font-weight: bold;
	transition: background-color 0.15s ease,color 0.5s ease;
}

.contenbox_links a img{
	display: block;
	margin-inline: auto;
	height: 52px;
	width: auto;
}
.contenbox_links a:hover img{
	filter: grayscale(1) brightness(10);
}
.contenbox_links a.link_bousai{
	display: block;
	background: #ffeef0;
	color: #c1272d;
}

#top_photo_main .top_photo_content .contenbox_links a:any-link{
	--bgCol: #e9f2ee;
	color: #247853;
	border: 1px solid transparent;
	grid-template-rows: 52px 1fr;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#d3ebe0);
	background-origin: border-box;
	background-clip: padding-box,border-box;
}
#top_photo_main .top_photo_content .contenbox_links a:hover {
	/* background: #1E6043; */
	--bgCol: #1E6043;
	color: #fff;
	text-decoration: underline;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,rgba(255,255,255,0.5),#0a5e39);
}

#top_photo_kanko .top_photo_content .contenbox_links a:any-link{
	--bgCol: #fdfbf8;
	color: #825d27;
	border: 1px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#c9ba97);
	background-origin: border-box;
	background-clip: padding-box,border-box;
}
#top_photo_kanko .top_photo_content .contenbox_links a:hover {
	--bgCol: #825d27;
	/* background: var(--bgCol); */
	color: #fff;
	text-decoration: underline;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,var(--bgCol));
}
#top_photo_main .top_photo_content .contenbox_links a.link_bousai:any-link{
	background: #ffeef0;
	color: #c1272d;
	gap: 0;
	padding-block: 30px;
	grid-template-rows: auto;
}


#count_down_area_2 {
	grid-column: span 2;
	color: #825d27;
}

#count_down_area_2 .count_down_box_wrap {
	width: auto;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

#count_down_area_2 .count_down_box {
	width: auto;
	--bgCol: #fff;
	background: var(--bgCol);
	color: currentColor;
	padding: 30px;
	
	border: 2px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#c9ba97);
	background-origin: border-box;
	background-clip: padding-box,border-box;

	box-sizing: border-box;

}
#count_down_area_2 .count_down_box{padding: 20px;}
/* #top_photo_kanko .top_photo_content .contenbox_links a:any-link */
#count_down_area_2  a:any-link{
	display: block;
	text-align: left;
	padding: 0;
}

#mymainback{
	/* width: min(100%, var(--top-content-width)); */
	width: auto;
	margin-inline: auto;
	padding: 0;
}

#main_a{
	display: flex;
	flex-direction: column;
	gap: 100px;
}

#top_important,.top_iza,.top_search_body,#top_news,#top_topics{
	/* width: min(calc(100% - 30px),var(--top-content-width));/ */
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	/* display: grid; */
	/* grid-template-columns: 1fr 850px; */
	/* gap: 40px; */
	box-sizing: border-box;
}

/* 重要なお知らせ */
#top_important {
	margin: 0px 0px 30px;
	color: #c1272d;
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	margin-top: 70px;
}
.top_impprtant_body {
	margin: 0px 0px 20px;
	padding: 30px 40px;
	background: #fdf2f2;
	border: 1px solid currentColor;
	border-radius: 8px;
}
#main_a #top_important h2 {
	margin: 0px 0px 20px;
	padding: 0px;
	color: #cc0000;
	font-size: 2.4rem;
	/* text-align: center; */
}

#top_important ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
#top_important ul li {
	width: 100%;
	display: table;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	margin: 0px 0px 10px;
}
#top_important ul li:last-child {
	margin-bottom: 0px;
}
#top_important ul li > span {
	display: table-cell;
	vertical-align: top;
}
#top_important ul li > span.article_date {
	width: calc(11em + 10px);
}
#top_important ul li a:any-link {
	color: #cc0000;
	text-decoration: none;
}
#top_important ul li a:hover{
	text-decoration: underline;
}

#top_important .link_box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	    flex-wrap: wrap;
	justify-content: flex-end;
	        align-items: flex-start;
	gap: 10px 20px;
	/* padding: 30px 0px 0px; */
}
#top_important .link_box span[class*="link_"] {
	/* width: 260px; */
	/* max-width: 100%; */
}
#top_important .link_box span[class*="link_"] a:any-link {
	display: block;
	/* border: 1px solid transparent; */
	/* border-radius: 0; */
	/* background: #ffffff; */
	color: currentColor;
	font-size: 1.6rem;
	line-height: 1.8rem;
	text-decoration: underline;
	margin: 0px;
	padding: 10px 0px;
	text-align: center;
}
#top_important .link_box span[class*="link_"] a:hover,
#top_important .link_box span[class*="link_"] a:focus {
	text-decoration: none;
}

#top_banner_3_list {
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
}

#top_banner_3_list ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fill,150px);
	gap: 15px;
}
#top_banner_3_list ul :where(a,img){
	display: block;
}

#main_a h2{
	font-size: 3.6rem;
	line-height: 1;
	margin: 0px 0px 50px;
	padding: 0px;
}
#main h2 span{
	display: block;
}
#main_a h2 span.title_sub{
	font-size: 1.4rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0;
	margin-top: 20px;
}


#top_news {
	display: grid;
	grid-template-columns: 1fr 850px;
	gap: 40px;
}
#top_news .section_information{
	margin-top: 0;
}

.top_iza {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 100px;
	border: 1px solid #c1272d;
	padding: 20px 20px;
	box-sizing: border-box;
	border-radius: 8px;
}

#main_a:not(:has(#top_important)) .top_iza{
	margin-top: 100px;
}

#top_important ~ .top_iza{
	/* margin-top: -80px; */
}

#main_a .top_iza h2{
	margin: 0px;
	padding: 0px;
	font-size: 2rem;
	line-height: 1;
	color: #c1272d;
}
.top_iza p{
	margin: 0px;
	padding: 0px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 30px;
	font-size: 1.6rem;
}
.top_iza p a:any-link{
	display: block;
	color: #c1272d;
}

#main nav.top_search_body a:any-link{
	--bgCol:#e9f2ee;
	background: #e9f2ee;

	border: 2px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#d2ebe0);
	background-origin: border-box;
	background-clip: padding-box,border-box;
	font-size: 2rem;
	line-height: 1;
	gap: 20px;
}
#main nav.top_search_body a:any-link:hover{
	/* background: rgba(0,0,0,0.2); */
	/* background: #1E6043; */
	--bgCol: #1E6043;
	color: #fff;
	text-decoration: underline;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,rgba(255,255,255,0.5),#0a5e39);

}

#top_link_area nav.top_search_body li a:any-link {
	--bgCol: #e9f2ee;
	background: var(--bgCol);
	color: var(--baseGreen);

	border: 1px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#d3ebe0);
	background-origin: border-box;
	background-clip: padding-box,border-box;

}
#top_link_area nav.top_search_body li a:any-link:hover{
	/* background: rgba(0,0,0,0.2); */
	--bgCol: #1E6043;
	background: var(--bgCol);
	color: #fff;
	text-decoration: underline;

	border: 1px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,rgba(255,255,255,0.5),#0a5e39);
	background-origin: border-box;
	background-clip: padding-box,border-box;
	/* background-blend-mode:hard-light; */

}



/* トピックス */
#top_topics_wrap {
	background: var(--baseGreenLight);
	padding: 140px 0px;
}
#top_topics{
	display: grid;
	grid-template-columns: 1fr 850px;
	gap: 40px;
}
.lettering_box {
	width: 100%;
	/* display: table; */
	margin: 0px 0px 0px;
	padding: 30px 0px;
	display: grid;
	grid-template-columns: 340px 1fr;
	gap: 40px;
	border-bottom: 1px solid #ccc;
	box-sizing: border-box;
}
.lettering_box:last-child {
	margin-bottom: 0px;
}
.lettering_box > div {
}

.lettering_box > div.lettering_box_text > div {
	/* margin-bottom: 0.5em; */
}
.lettering_box > div.lettering_box_text > div:last-child {
	margin-bottom: 0px;
}

.lettering_box > div.lettering_box_img {
	width: 340px;
	/* padding-right: 20px; */
}
.lettering_box > div.lettering_box_img a{
	display: block;
	height: 100%;
}
.lettering_box > div.lettering_box_img a:focus{
	outline: 2px solid;
}
.lettering_box > div.lettering_box_img div {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 340 / 200;
	/* overflow: hidden; */
	background: #f6f6f6;
}
.lettering_box > div.lettering_box_img div:empty {
	background: url("/img/common/noimage.png") no-repeat center center #f6f6f6;
	background-size: contain;
}
.lettering_box > div.lettering_box_img div img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	   object-fit: contain;
	-o-object-position: center;
	   object-position: center;
	border-radius: 8px;
}
.lettering_box_text{
	display: flex;
	flex-direction: column;
}
.lettering_box .article_title{
	font-weight: bold;
}
.lettering_box_text .article_date{
	/* justify-self: flex-end; */
	margin-top: auto;
	margin-bottom: 0;
	text-align: right;
}


/* 新着情報（一覧 / RSS） */
:where(.section_information_list,#top_topics) div.link_box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	justify-content: flex-end;
	gap: 20px;
	margin-top: 45px;
}

#top_topics div.link_box span {
	/* display: inline-block; */
	/* vertical-align: top; */
	/* width: 260px; */
	/* max-width: 100%; */
	display: block;
	
}

#top_topics div.link_box span a:any-link {
	display: block;
	border: 1px solid transparent;
	border-radius: 0;
	background: var(--baseGreen);
	color: #fff;
	border-radius: 100vmax;
	font-size: var(--fontsize-main-small, 1.5rem);
	line-height: 1;
	text-decoration: none;
	margin: 0px;
	padding: 18px 40px;
	text-align: center;
	letter-spacing: 0.1em;
	font-weight: bold;
	transition: background-color 0.15s ease;
}
#top_topics div.link_box span a:hover,
#top_topics div.link_box span a:focus {
	text-decoration: underline;
	background-color: var(--baseGreenDark);
}


/* トピックス（サムネイルなし） */
#lettering + .topics_no_image_list {
	margin-top: 30px;
}

/* ミニカレンダー */
#top_calendar_detail {
	width: 100%;
}
#top_calendar_detail ul {
	margin: 0px 0px 20px;
	padding: 0px;
	list-style: none;
	width: 100%;
	display: table;
}
#top_calendar_detail ul li {
	display: table-cell;
	vertical-align: middle;
}
#top_calendar_detail ul li.calendar_index_last {
	width: 4em;
	text-align: left;
}
#top_calendar_detail ul li.calendar_index_next {
	width: 4em;
	text-align: right;
}
#top_calendar_detail ul li.calendar_index_now {
	text-align: center;
}

table#top_calendar_table {
	width: 100%;
	border: 1px solid;
	border-collapse: collapse;
}
table#top_calendar_table th {
	border: 1px solid;
	font-weight: normal;
	text-align: center;
	padding: 10px 0px;
	font-size: 80%;
}
table#top_calendar_table td {
	border: 1px solid;
	text-align: center;
	padding: 10px 0px;
}
table#top_calendar_table td a {
	display: block;
}

.cal_sun {
	color: #990000;
	background-color: #ffdde6;
}
.cal_mon,.cal_tue,.cal_wed,.cal_thu,.cal_fri {
	background-color: #f5f5f5;
}
.cal_sat {
	color: #000099;
	background-color: #ccddff;
}
.cal_hol {
	background-color: #ffdde6;
}
.cal_today {
	background-color: #ffff80;
}


#top_event_today {
	margin-top: 30px;
}




#top_link_area{
	background: var(--baseGreen);
	color: #fff;
	display: flex;
	flex-direction: column;
	gap: 120px;
	padding: 120px 0px 0px;
}
/* カウントダウンが無い時は間隔を詰める */
#top_topics_wrap + #top_link_area {
	margin-top: -100px;
}


/* キーワード検索 */
.top_search_lifestage_wrap,
.top_search_wrap {
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	box-sizing: border-box;
}
.top_search_wrap .header_search{
	background: #e9f2ee;
	color: #333;
}
.top_search_wrap h2{
	text-align: center;
}


#cse-search-box2 .search_ttl{
}
#tmp_query2{
}
#submit2:hover{
}

#cse_filetype2 {
}
#cse_filetype2 fieldset {
}
#cse_filetype2 fieldset legend {
}
#cse_filetype2 fieldset span {
	/* font-size: 1.4rem; */
	/* display: inline-block; */
	/* vertical-align: middle; */
}
#cse_filetype2 fieldset span input {
	/* margin: 3px 4px 5px 5px; */
	/* vertical-align: middle; */
}

/* ページID検索 */

#open_page_id_submit2:hover{
	/* text-decoration: underline; */
}

#open_page_id_message2 {
	/* margin-top: 5px; */
	/* text-align: right; */
	/* font-size: 1.4rem; */
}
#open_page_id_message2:empty {
	/* display: none; */
}


.top_search_wrap .h_search_type{
	/* padding: 30px; */
}
.top_search_wrap .h_search_type ul{
	/* margin: 0; */
	/* padding: 0; */
	/* list-style: none; */
	/* display: flex; */
	/* flex-wrap: wrap; */
	/* gap: 20px; */
}
.top_search_wrap .h_search_type ul li{
	/* display: block; */
	/* flex: 1; */
	/* text-align: center; */
	/* padding: 10px; */
	/* background: #fff; */
	/* border-radius: 100vmax; */
}
.top_search_wrap .h_search_type ul li a:any-link{
	/* color: currentColor; */
	/* text-decoration: none; */
}
.top_search_wrap .h_search_type ul li a:hover{
	text-decoration: underline;
}


/* さがすメニュー */
.top_search_menu_list {
	margin: 40px 0px 0px;
}
.top_search_menu_list ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	gap: 20px;
}
.top_search_menu_list ul li {
	width: 100%;
}
.top_search_menu_list ul li a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 100%;
	height: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid transparent;
	background: #e6e6e6;
	color: #333333;
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.8rem;
	text-decoration: none;
	text-align: center;
	padding: 20px 10px;
}
.top_search_menu_list ul li a:hover,
.top_search_menu_list ul li a:focus {
	text-decoration: underline;
}

/* リンク */
.top_linklist {
	margin: 40px 0px 0px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	gap: 20px;
}

.top_linklist_box {
	width: 100%;
	border: 2px solid;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.top_linklist_box h2 {
	background: #333333;
	color: #ffffff;
	font-size: 1.8rem;
	margin: 0px;
	padding: 15px 20px;
}
.top_linklist_box ul {
	margin: 0px;
	padding: 20px 20px 20px 40px;
}
.top_linklist_box ul li {
	margin-bottom: 10px;
}
.top_linklist_box ul li:last-child {
	margin-bottom: 0px;
}

.chousei{
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	box-sizing: border-box;
}
.chousei h2{
	text-align: center;
}
.chousei_box{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.chousei_box_link{
	display: grid;
	grid-template-columns: repeat(2,1fr);
	grid-template-columns: repeat(2,1fr);
	gap: 10px;
}
.chousei_box_link a.cbox_mayor{
	grid-column: span 2;
}
#top_link_area .chousei_box_link a:any-link{
	--bgCol: var(--baseGreenLight);
	background: var(--baseGreenLight);
	color: var(--baseGreen);
	display: grid;
	place-content: center center;
	text-decoration: none;
	border-radius: 8px;
	text-align: center;
	gap: 15px;
	font-size: 2rem;

	border: 1px solid transparent;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,#fff,#d3ebe0);
	background-origin: border-box;
	background-clip: padding-box,border-box;

}
#top_link_area .chousei_box_link a:any-link:hover{
	--bgCol: #1E6043;
	text-decoration: underline;
	color: #fff;
	background: #1E6043;
	background-image: 
		linear-gradient(var(--bgCol), var(--bgCol)),
		linear-gradient(to bottom,rgba(255,255,255,0.5),#0a5e39);
	background-origin: border-box;
	background-clip: padding-box,border-box;
	
}
#top_link_area .chousei_box_link a img{
	display: block;
	margin-inline: auto;
}
#top_link_area .chousei_box_link a:hover img{
	filter: grayscale(1) brightness(10);
}
/* 広報まつしま */
.koho_wrap{
	background: var(--baseGreenLight);
	color: #333;
	border-radius: 8px;
	padding: 20px;
	line-height: 1;
}
.koho_wrap a:any-link{
	color: var(--baseGreen);
}
.koho_detail {
	display: grid;
	grid-template-columns: 1fr 247px;
	gap: 30px;
}

.koho_side {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.koho_side .koho_side_title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	justify-content: center;
}
.koho_side_link{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	margin-top: 20px;
	gap: 10px;
}
.koho_side_link a:any-link{
	display: block;
}
.koho_newest{
	margin-bottom: 10px;
}
.koho_side a{
	text-decoration: underline;
}
.koho_side a:hover{
	text-decoration: none;
}
img.koho_title {
	/* margin-top: 25px; */
	width: 180px;
	height: auto;
}

span.koho_title_text {
	font-size: 1.6rem;
	font-weight: bold;
}
.koho_cover :where(a,img){
	display: block;
}
.koho_cover img{
	width: 100%;
	height: auto;
}

#top_link_area .koho_wrap a.koho_newest:any-link {
	display: block;
	padding: 20px 20px;
	background: var(--baseGreen);
	color: #fff;
	border-radius: 100vmax;
	text-decoration: none;
	align-self: stretch;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 20px;
	transition: background-color 0.15s ease;
}
#top_link_area .koho_wrap a.koho_newest:hover{
	text-decoration: underline;
	background-color: var(--baseGreenDark);
}

#top_banner_5_list .swiper-control-wrap {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-end;
	gap: 10px;
	align-items: center;
	margin-top: 25px;
}

#top_banner_5_list .swiper-controll-button button {
	display: block;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: none;
	background-color: rgba(255,255,255,0.5);
	background-repeat: no-repeat;
	background-position: center center;
	color: #000;
}
#top_banner_5_list .swiper-controll-button button.is-active{
	display: none;
}
#top_banner_5_list .swiper-button-pause{
	background-image: url(/img/top/icon-pause.png);
}
#top_banner_5_list .swiper-controll-button .swiper-button-play{
	/* display: none; */
	background-image: url(/img/top/icon-play.png);
}
#top_banner_5_list .swiper-pagination{
	position: static;
	/* text-align: right; */
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
}
#top_banner_5_list .swiper-pagination .swiper-pagination-bullet{
	width: 24px;
	height: 24px;
	position: relative;
	background: transparent;
}
#top_banner_5_list .swiper-pagination .swiper-pagination-bullet::before{
			content: '';
			display: block;
			width: 12px;
			height: 12px;
			background: #fff;
			color: #000;
			border-radius: 50%;
			position: absolute;
			place-self: center center;
			inset: 0;
}

/* 関連リンク */
.top_kanrenlink{
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	box-sizing: border-box;
	position: relative;
	z-index: 10;
}
.top_kanrenlink::after{
	content: '';
	display: block;
	width: 160px;
	height: 113px;
	background: url(/img/top/bg-kumo.png);
	position: absolute;
	right: 200px;
	bottom: -200px;
}
.top_kanrenlink h2{
	text-align: center;
}
#top_banner_5_list .swiper-slide{
	display: grid;
	place-content: center center;
}
#top_banner_5_list .swiper-slide :where(a,img){
	display: block;
}
#top_banner_5_list img{
	max-width: 100%;
	height: auto;
}

.top_about_matsushima_wrap{
	/* width: min(100%,var(--top-content-width)); */
	/* margin-inline: auto; */
	display: flex;
	flex-direction: column;
	gap: 120px;
	padding-top: 345px;
	padding-bottom: 200px;
	background: var(--baseGreenDark);
	position: relative;
	overflow-x: hidden;
}
.top_about_matsushima_wrap::before{
	content: '';
	display: block;
	width: 110%;
	height: 100px;
	position: absolute;
	background: var(--baseGreen);
	top: -50px;
	left: 50%;
	transform: translateX(-50%);
	clip-path: ellipse(50% 50%)
}
.top_about_matsushima_wrap p{
	margin: 0;
}
.top_about_box{
	width: min(100%,var(--top-content-width));
	margin-inline: auto;
	display: grid;
	gap: 80px;
}
.top_about_box p{
	font-size: 1.8rem;
	line-height: 2;
	text-align: justify;
	letter-spacing: 0.175em;
}
.top_about_box img{
	display: block;
	border-radius: 8px;
	max-width: 100%;
	height: auto;
}
.top_about_box a.linkbox{
	display: block;
	background: #81702a;
	width: fit-content;
	margin-top: 50px;
	padding: 20px 40px;
	line-height: 1;
	border-radius: 100vmax;
	box-shadow:
		0px -1px 0px 0px rgba(0,0,0,.5) inset,
		0px  1px 0px 0px rgba(255,255,255,0.5) inset;
	text-decoration: none;
	color: #fff;
	font-weight: bold;
	transition: background-color 0.15s ease;
}
#top_link_area .top_about_box a.linkbox:hover{
	text-decoration: underline;
	background-color: #63551a;
}
.top_about_matsushima1,
.top_about_matsushima3{
	grid-template-columns: 1fr 620px;
}
.top_about_matsushima2,
.top_about_matsushima4{
	grid-template-columns: 620px 1fr;
}

:where(.top_about_matsushima2,
.top_about_matsushima4) .top_about_inner:first-child{
	order: 1;
}
#main_a .top_about_matsushima1 h2 .title_main{
	font-size: 5.6rem;
	line-height: 2;
	letter-spacing: 0.2em;
	margin-top: -0.5em;
}
#main_a .top_about_box h3{
	display: block;
	border-bottom: 3px solid;
	width: fit-content;
	font-size:  4.2rem;
	line-height: 1;
	padding-bottom: 20px;
	margin: 0px 0px 40px;
}

.top_about_matsushima2{
	margin-top: 70px;
}
.top_about_matsushima2 .top_about_inner:nth-child(2) {
	position: relative;
}
.top_about_matsushima2 .top_about_inner:nth-child(2)::before{
	content: '';
	display: block;
	width: 141px;
	height: 85px;
	background: url(/img/top/bg-matsu.png);
	position: absolute;
	z-index: 1;
	z-index: 0;
	top: -60px;
	left: -60px;
}
.top_about_matsushima2 .top_about_inner:nth-child(2) img{
	position: relative;
	z-index: 2;
}
.top_about_matsushima4 .top_about_inner:nth-child(1){
	position: relative;
}
.top_about_matsushima4 .top_about_inner:nth-child(1)::before{
	content: '';
	display: block;
	width: 121px;
	height: 124px;
	background: url(/img/top/bg-torii.png) no-repeat center center;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 10;
}

/* 人口・世帯数 */
.top_jinkou {
	margin: 40px 0px 0px;
}
.top_jinkou h2 {
	margin: 0px 0px 20px;
	padding: 0px;
	font-size: 2rem;
}

.top_jinkou_list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 10px 20px;
}
.top_jinkou_list dl {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	margin: 0px;
	padding: 0px;
}
.top_jinkou_list dl dt {
	display: inline-block;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
}
.top_jinkou_list dl dd {
	display: inline-block;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
}

/* 時計 */
.top_tokei {
	margin: 40px 0px 0px;
}
.top_tokei h2 {
	margin: 0px 0px 20px;
	padding: 0px;
	font-size: 2rem;
}

.top_tokei_img {
	width: 320px;
	height: 240px;
	position: relative;
}

#tokei_photo {
	width: 320px;
	height: 240px;
	position: relative;
	overflow: hidden;
}
#tokei_photo .clock-image{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	object-fit: contain;
	opacity: 0;
	transition: opacity 1.0s ease-in-out;

}
#tokei_photo .clock-image.active{
	opacity: 1;
}

#tokei_time {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 1;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1;
	text-shadow: 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff,
		0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff,
		0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff, 0px 0px 3px #ffffff;
}

/* カウントダウン */
#count_down_area_1 h2{
	text-align: center;
}
.count_down_box_wrap {
	margin: 40px 0px 0px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	justify-content: center;
	        align-items: stretch;
	gap: 15px;
	width: min(calc(100% - 30px),var(--top-content-width));
	margin-inline: auto;
}
.count_down_box {
	width: min(100%,370px);
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	background: var(--baseGreenLight);
	padding: 20px;
	border-radius: 8px;
	color: var(--baseGreen);
}
.count_down_box a:any-link{
	color: currentcolor;
}

.count_down_box2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	height: 100%;
}
.count_down_box2 > span {
	display: inline-block;
	vertical-align: top;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: grid;
	grid-template-columns: 1fr;
	height: 100%;
}

.count_down_box2 > span.count_img {
	width: 200px;
}
.count_down_box2 > span.count_img > span {
	display: block;
}
.count_down_box2 > span.count_img > span img {
	width: 100%;
	height: auto;
	vertical-align: top;
}

.count_down_box2 > span.count_txt {
	width: calc(100% - 220px);
}
.count_down_box2 > span.count_txt:only-child {
	width: 100%;
}
.count_down_box2 > span.count_txt > span {
	display: block;
}
.count_down_box2 > span.count_txt > span.count_title{
	font-size: 1.8rem;
}
.count_down_box2 > span.count_txt > span.count_comment {
	margin-top: 10px;
	font-size: 1.4rem;
}
.count_down_box2 > span.count_txt > span.count_day {
	margin-top: 10px;
	/* color: #cc0000; */
	text-align: right;
	/* margin-top: auto; */
	/* margin-bottom: 0; */
	justify-self: flex-end;
	align-self: flex-end;
}
.count_down_box2 > span.count_txt > span.count_day span {
	font-size: 4.2rem;
	font-weight: bold;
	line-height: 1;
	margin-left: 0.2em;
	margin-right: 0.25em;
}

/* バナー広告 */
ul.banner_list {
	margin: 0px;
	padding: 0px;
	list-style: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 20px;
}
ul.banner_list li {
	width: calc(25% - 15px);
}
ul.banner_list li img {
	width: 100%;
	height: auto;
	vertical-align: top;
}


/* 行政・観光切り替え */
.top_photo_switch_wrap {
	/* background: #f00; */
	position: absolute;
	top: 320px;
	z-index: 100;
	writing-mode: vertical-rl;
	line-height: 1;
	font-size: 2rem;
	font-weight: bold;
	/* padding: 20px; */
}
.top_photo_switch_wrap a:any-link{
	display: grid;
	place-content: center center;
	color: currentcolor;
	text-decoration: none;
	min-height: 380px;
	padding: 20px;
	box-sizing: border-box;
	position: relative;
}
.top_photo_switch_wrap a:any-link::before{
	content: '';
	width: 100%;
	height: 1px;
	background: rgba(0,0,0,0.25);
	position: absolute;
	bottom: 60px;
	left: 0;
}
.top_photo_switch_wrap a span{
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: center;
}
#top_photo_main_wrap .top_photo_switch_wrap{
	right: 0;
	background: #81702a;
	color: #fff;
	border-radius: 10px 0 0 10px;
}
#top_photo_main_wrap .top_photo_switch_wrap a span::before{
	content: '';
	display: block;
	width: 41px;
	height: 27px;
	background: url(/img/top/icon-tab-to-kanko.png);
}

#top_photo_kanko_wrap .top_photo_switch_wrap{
	left: 0;
	background: #267855;
	color: #fff;
	border-radius: 0 10px 10px 0;
}
#top_photo_kanko_wrap .top_photo_switch_wrap a span::before{
	content: '';
	display: block;
	width: 31px;
	height: 36px;
	background: url(/img/top/icon-tab-to-gyousei.png);
}

:where(#top_photo_main_wrap,#top_photo_kanko_wrap) .top_photo_switch_wrap a:any-link::after{
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	background: #fff;
	bottom: 20px;
	left: calc(50% - 10px);
}

#top_photo_main_wrap .top_photo_switch_wrap a:any-link::after{
	clip-path: polygon(84% 45%, 67% 27%, 73% 21%, 100% 50%, 73% 79%, 67% 73%, 84% 55%, 0% 55%, 0% 45%);
}
#top_photo_kanko_wrap .top_photo_switch_wrap a:any-link::after{
	clip-path: polygon(16% 45%, 33% 27%, 27% 21%, 0% 50%, 27% 79%, 33% 73%, 16% 55%, 100% 55%, 100% 45%);
}
@media screen and (min-width: 1080px){
	.top_photo_switch_wrap_sp{
		display: none;
	}
}

/* ==================================================
スマートフォン
================================================== */
@media screen and (max-width: 1080px) {

	#header2_box{
		width: auto;
		padding: 0;
	}
	#h_support_popup[open],
	#h_lang_popup[open]{
		right: -30px;
		top: calc(100% + 20px);
	}
	#support_menu_box{
		position: static;
	}
	#support_menu_box::before{
		left: auto;
		right: 40px;
	}
	#h_lang_popup[open]::before{
		right: 90px;
	}

	#top_mainphoto_all_wrap_outer {
		height: auto;
		/* overflow: visible; */
	}

	#top_mainphoto_all_wrap {}

	#top_photo_main_wrap, #top_photo_kanko_wrap {
		/* height: auto; */
	}

	#top_photo_main, #top_photo_kanko {
	height: auto;
}
	.top_photo_switch_wrap{
		display: none;
	}

	.top_photo_content {
		grid-template-columns: 1fr;
		padding-inline: 15px;
		/* padding-inline: 40px; */
		box-sizing: border-box;
		width: 100%;
		position: relative;
		z-index: 10;
		top: 0;
		padding-top: 200px;
		gap: 50px;
	}

	p.maintext {
		font-size: 2.8rem;
		position: static;
	}

	.top_photo_content .contentbox{
		width: auto;
		margin: 0;
		box-shadow: none;
		padding: 0;
	}

	.top_photo_switch_wrap_sp{
		/* margin-top: 50px; */
		display: grid;
		grid-template-columns: repeat(2,1fr);
		background: #eeeeee;
		border-radius: 10px;
	}
	.top_photo_switch_wrap_sp :where(a.top_photo_sw, span.top_photo_current){
		display: block;
		text-align: center ;
		padding: 20px 0px;
		font-size: 1.4rem;
		line-height: 1;
		font-weight: bold;
		border-radius: 10px;
	}
	.top_photo_switch_wrap_sp a:any-link{
		text-decoration: none;
		color: currentColor;
	}

	:where(#top_photo_main,#top_photo_kanko) .top_photo_switch_wrap_sp span.top_photo_current{
		position: relative;
	}
	:where(#top_photo_main,#top_photo_kanko) .top_photo_switch_wrap_sp span.top_photo_current::after{
			content: '';
			display: block;
			width: 12px;
			height: 10px;
			clip-path: polygon(0% 0%,100% 0%,50% 100%);
			position: absolute;
			/* place-self: center center; */
			/* inset: 0; */
			top: calc(100% - 1px);
			bottom:  auto;
			left: calc(50% - 6px);
		}
	#top_photo_main .top_photo_switch_wrap_sp span.top_photo_current{
		background: var(--baseGreen);
		color: #fff;
		position: relative;
	}
	#top_photo_main .top_photo_switch_wrap_sp span.top_photo_current::after{
		background: var(--baseGreen);
		color: #fff;
	}
	#top_photo_main .top_photo_content .contenbox_links a.link_bousai:any-link{
		grid-column: 1 / -1;
	}

	#top_photo_kanko .top_photo_switch_wrap_sp span.top_photo_current{
		background: #81702a;
		color: #fff;
		
	}
	#top_photo_kanko .top_photo_switch_wrap_sp span.top_photo_current::after{
		background: #81702a;
		color: #fff;
	}
	
	#top_photo_main .top_photo_content .contenbox_links{
		grid-template-columns: repeat(auto-fill,100px);
		justify-content: center;
	}
	#top_photo_main .top_photo_content .contenbox_links a:any-link{
		font-size: 1.2rem;
	}


	:where(#top_photo_main_list,#top_photo_kanko_list) .photo{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 410px;
	}

	#header2 {
		width: calc(100% - 30px);
	}

	#mymainback{
		width: 100vw;
		margin-bottom: 0;
	}

	/* 重要なお知らせ */
	#top_important {
		padding: 30px 20px;
		box-sizing: border-box;
		margin-top: 0;
		margin-bottom: 0;
		padding-bottom: 0;
	}
	#main_a #top_important h2{
		text-align: left;
	}
	#top_important h2 {
		font-size: 2rem;
	}

	#top_important ul li {
		width: auto;
		display: block;
	}
	#top_important ul li > span {
		display: block;
	}
	#top_important ul li > span.article_date {
		width: auto;
	}

	#top_important .link_box span[class*="link_"] a {
		font-size: 1.3rem;
	}

	/* 防災メール連携（JavaScript） */
	#main_box_emergency .box_top_emer {
		padding: 30px 20px;
	}
	#main_box_emergency h2 {
		font-size: 2rem;
	}

	#main_box_emergency ul li {
		width: auto;
		display: block;
	}
	#main_box_emergency ul li > span {
		display: block;
	}
	#main_box_emergency ul li > span.emer_date {
		width: auto;
	}

	#main_box_emergency .btn_emer #emer_mail_open_all {
		font-size: 1.3rem;
	}

	#main_a{
		gap: 50px;
	}

	.top_iza{
		/* display: block; */
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		gap: 30px;
		width: calc(100% - 30px);
	}
	#main_a .top_iza h2{
		text-align: left;
	}
	.top_iza p{
		gap: 20px;
	}
	@media screen and (orientation:portrait){
		.top_iza p{
			/* display: block; */
			flex-direction: column;
			gap: 10px;
		}
	}
	#top_banner_3_list{
		width: calc(100% - 30px);
	}
	#top_banner_3_list ul{
		grid-template-columns: repeat(auto-fill,100px);
		gap: 10px;
		justify-content: center;
	}
	#top_banner_3_list ul img{
		width: 100%;
		height: auto;
	}

	#top_news{
		grid-template-columns: auto;
		padding-inline: 15px;
	}
	#top_news .section_information{
		margin: 0px;
	}
	
	#main nav.top_search_body a:any-link{
		font-size: 1.2rem;
	}
	
	/* タブ */
	#top_tab_title ul {
		gap: 5px;
	}
	#top_tab_title ul li button,
	#top_tab_title ul li.tab_on button {
		font-size: 1.4rem;
		padding: 15px 10px;
	}

	#top_tab_detail {
		padding: 30px 20px;
	}
	#top_tab_detail .acc_title + input[id*="acc_ttl_label"] + * {
		display: block;
	}

	#top_topics_wrap{
		padding-top: 60px;
		padding-inline: 15px;
		box-sizing: border-box;
		padding-bottom: 80px;
	}
		
	#main_a h2{
		text-align: center;
		margin: 0;
		/* margin-bottom: 40px; */
	}
	#main_a h2 .title_main{
		font-size: 2rem;
	}
	#main_a h2 .title_sub{
		font-size: 1.4rem;
	}
	#top_topics{
		grid-template-columns: auto;
		gap: 10px;
	}

	@media (max-width: 670px){
		:where(.section_information_list,#top_topics) div.link_box{
			display: grid;
			grid-template-columns: 1fr;
			grid-template-rows: auto auto;
			grid-template-columns: 1fr;
			gap: 10px;
		}
	}

	/* タブを開閉式に変更 */
	#top_tab_title {
		display: none;
	}

	#top_tab_detail {
		padding: 0px;
		border-bottom: none;
	}

	.top_tab_detail_box {
		display: block !important;
	}
	.top_tab_detail_box:nth-child(n+2) {
		margin-top: 10px;
	}
	.top_tab_detail_box h2.acc_title {
		width: auto;
		height: auto;
		clip: auto;
		overflow: visible;
		margin: 0px;
		padding: 15px 20px;
		font-size: 1.8rem;
		font-weight: bold;
		line-height: 1.4;
		background: #e6e6e6;
		color: #333333;
	}
	.top_tab_detail_box h2.acc_title label[for*="acc_ttl_label"],
	.top_tab_detail_box h2.acc_title.accordion .accordion_icon {
		margin: -15px -20px; /* h2 の padding の値をマイナスにして指定する */
		padding: 15px 20px;  /* h2 の padding と同じ値を指定する */
		padding-right: 40px;
		background-position: right 20px top 50%;
	}

	.top_tab_detail_box2 {
		padding: 20px;
	}

	#top_tab_detail .acc_title + input[id*="acc_ttl_label"] + * {
		display: none;
	}
	#top_tab_detail .acc_title + input[id*="acc_ttl_label"]:checked + * {
		display: block;
	}

	/* 新着情報（件数） */
	.release_day {
		font-size: 1.3rem;
	}

	/* 新着情報（リスト） */
	.top_tab_detail_list ul li {
		width: auto;
		display: block;
		position: relative;
	}
	.top_tab_detail_list ul li > span {
		display: block;
	}
	.top_tab_detail_list ul li > span.article_date {
		width: auto;
	}

	/* 新着情報（一覧・RSS） */
	.top_tab_detail_box .link_box span[class*="link_"] a {
		font-size: 1.3rem;
	}

	/* トピックス */
	.lettering_box{
		grid-template-columns: auto;
	}
	.lettering_box > div.lettering_box_img {
		/* width: 120px; */
		margin-inline: auto;
	}
	.lettering_box_text .article_date{
		text-align: left;
	}

	/* さがすメニュー */
	#search {
		scroll-margin-top: 50px;
		padding-inline: 15px;
	}
	
	#top_link_area{
		gap: 60px;
		padding: 50px 0px 0px;
		box-sizing: border-box;
	}
	#top_topics_wrap + #top_link_area{
		box-sizing: border-box;
	}
	.top_search_wrap{
		/* padding-inline: 15px; */
	}
	#main_a .top_search_wrap h2{
		text-align: center;
		margin-bottom: 40px;
	}
	.top_search_menu_list ul {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		gap: 15px;
	}
	.top_search_menu_list ul li {
		width: 100%;
	}
	.top_search_menu_list ul li a {
		font-size: 1.6rem;
	}
	.top_search_wrap .header_search{
		display: block;
		position: static;
		max-height: none;
		padding: 30px 10px;
		overscroll-behavior: auto;
		border-radius: 4px;
	}
	#top_search_page_id2{
		margin: 0;
		margin-top: 25px;
		padding-top: 25px;
	}

	#search_trend_word2{
		padding: 30px 0px;
	}

	.top_search_wrap .h_search_type{
		padding: 0px 0px;
		padding-block: 30px;
	}
	.top_search_wrap .h_search_type ul{
		flex-direction: column;
	}
	@media (orientation: landscape){
		.top_search_wrap .h_search_type ul{
			display: grid;
			grid-template-columns: repeat(2,1fr);
		}
	}
	.h_search_type ul li{
		padding-block: 12px;
	}

	.chousei_box{
		grid-template-columns: auto;
		grid-template-rows: auto auto;
	}
	.chousei_box_link{
		grid-template-columns: repeat(3,1fr);
		grid-template-rows: auto;
	}
	#top_link_area .chousei_box_link a:any-link{
		font-size: 1.2rem;
		padding: 20px 0px;
		gap: 10px;
	}

	.chousei{
		padding-inline: 15px;
	}
	#main .chousei h2{
		text-align: center;
		margin-bottom: 40px;
	}
	.chousei_box_link a.cbox_mayor{
		grid-column: auto;
	}
	#top_link_area .chousei_box_link a img{
		width: auto;
		height: 30px;
	}
	.chousei_box_link a:last-child{
		grid-column:auto;
	}
	.koho_wrap{
		
	}
	.koho_detail{
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto;
	}
	.koho_side{
		display: contents;
	}
	#top_link_area .koho_wrap a.koho_newest:any-link{
		margin-block: 0;
	}
	span.koho_title_text{
		font-size: 1.2rem;
	}
	img.koho_title{
		max-width: 100%;
	}
	
	.koho_side_link{
		order: 3;
		grid-column: span 2;
		margin-top: 0;
		gap: 20px;
	}

	.top_about_matsushima_wrap{
		gap: 100px;
		padding-inline: 15px;
		padding-top: 140px;
	}
	.top_about_matsushima1, .top_about_matsushima3{
		/* display: block; */
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		gap: 50px;
	}
	.top_about_matsushima3 .top_about_inner:nth-child(1){
		order: 1;
	}
	.top_about_matsushima3 .top_about_inner:nth-child(2){
		order: 0;
	}
	.top_about_matsushima2, .top_about_matsushima4{
		/* display: block; */
		grid-template-columns: auto;
		grid-template-rows: auto auto;
		gap: 60px;
		margin-top: 0;
	}
	.top_about_matsushima2 .top_about_inner:nth-child(2)::before{
		width: 70px;
		height: 43px;
		background-size: contain;
		left: -20px;
		top: -30px;
	}
	.top_about_matsushima4 .top_about_inner:nth-child(1)::before{
		bottom: auto;
		top: -40px;
		right: 0;
		width: 60px;
		height: 62px;
		background-size: contain;
	}
	
	#main_a .top_about_matsushima1 h2 .title_main{
		font-size: 3rem;
	}
	#main_a .top_about_box h3{
		margin-inline: auto;
		font-size: 2.8rem;
		padding-bottom: 10px;
	}
	.top_about_box a.linkbox{
		margin-inline: auto;
		margin-top: 30px;
	}
	
	/* リンク */
	.top_linklist {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		gap: 15px;
	}
	.top_linklist_box {
		width: 100%;
	}

	.top_linklist_box h2 label[for*="acc_ttl_label"],
	.top_linklist_box h2.acc_title.accordion .accordion_icon {
		margin: -15px -20px; /* h2 の padding の値をマイナスにして指定する */
		padding: 15px 20px;  /* h2 の padding と同じ値を指定する */
		padding-right: 40px;
		background-position: right 20px top 50%;
		background-image: url("/img/sp/acc_open_white.png");
	}
	.top_linklist_box h2.acc_open label[for*="acc_ttl_label"],
	.top_linklist_box h2.acc_title.accordion.acc_open .accordion_icon {
		background-image: url("/img/sp/acc_close_white.png");
	}

	/* カウントダウン */
	.count_down_box_wrap {
		gap: 10px;
	}
	@media (orientation: landscape){
		.count_down_box_wrap{
			display: grid;
			grid-template-columns: repeat(2,1fr);
		}
	}
	.count_down_box {
		width: auto;
		width: 100%;
	}
	.count_down_box:nth-child(n+2) {
		/* margin-top: 15px; */
	}

	.count_down_box2 > span.count_img {
		width: 120px;
	}
	.count_down_box2 > span.count_txt {
		width: calc(100% - 140px);
	}

	/* バナー広告 */
	ul.banner_list {
		gap: 10px;
	}
	ul.banner_list li {
		width: calc(50% - 5px);
		max-width: 200px;
	}

	.top_kanrenlink{
		padding-inline: 15px;
	}
	#main .top_kanrenlink h2{
		text-align: center;
		margin-bottom: 50px;
	}
	.top_kanrenlink::after{
		right: 40px;
		bottom: -100px;
		width: 80px;
		height: 57px;
		background-size: contain;
	}

}
/* ==================================================
スマートフォン ここまで
================================================== */


/* 背景色変更 */
.color_change .top_photo_content .contenbox_links a img,
.color_change .top_search_body .nav_icon img,
.color_change .chousei_box_link img{
	filter: grayscale(1) brightness(10);
}

.color_change #h_lang_popup[open]::before,
.color_change dialog#h_search[open]::before,
.color_change #support_menu_box::before{
	display: none;
}
.color_change :where(#top_photo_main_list,#top_photo_kanko_list) .photo::after{
	display: none;
}
.color_change #top_photo_kanko .top_photo_content .contenbox_links a,
.color_change #top_photo_main .top_photo_content .contenbox_links a:any-link{
	background: transparent;
}
.color_change #main nav.top_search_body a:any-link, .color_change #top_link_area nav.top_search_body li a:any-link:hover{
	background: transparent;
}
.color_change :where(#search_trend_word,#search_trend_word2) p a:hover{
	text-decoration: underline !important;
}
.color_change #top_link_area .chousei_box_link a:any-link{
	background: transparent;
}
.color_change .top_about_matsushima_wrap::before{
	display: none;
}

/* 文字サイズ変更 */
.font_size_limit_max :is(#top_mainphoto_all_wrap_outer,##top_photo_main, #top_photo_kanko){
	height: auto;
}
.font_size_limit_max .top_photo_content {
	display: block;
}

.font_size_limit_max .top_photo_content .contentbox {
	position: static;
	width: auto;
}

.font_size_limit_max p.maintext {
	position: static;
}

.font_size_limit_max p.maintext span br {
	display: none;
}

.font_size_limit_max .top_photo_content .contenbox_links {
	grid-template-columns: repeat(auto-fill,200px);
}