@charset "utf-8";

:where(#mainvisual, #main) {
	--font-yugothic: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Yu Gothic", "游ゴシック", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Arial, 'BIZ UDPGothic', Meiryo, メイリオ, Osaka, sans-serif;
}
:where(#mainvisual, #main, #mainvisual *, #main *) {
	font-style: normal;
	letter-spacing: 0;
	line-height: 1;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
}
:where(#mainvisual :is(h1, h2, h3, h4, h5, h6, p, dl, dd, figure), #main :is(h1, h2, h3, h4, h5, h6, p, dl, dd, figure)) {
	margin: 0;
}
:where(#mainvisual :is(ul, ol), #main :is(ul, ol)) {
	list-style: none;
	padding: 0;
	margin: 0;
}
:where(#mainvisual picture, #main picture) {
	display: block;
}
:where(#mainvisual img, #main img) {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
:where(#mainvisual button, #main button) {
	text-align: left;
	padding: 0;
	margin: 0;
	border: none;
	background: none;
}

/* トップページ */
.tpl_top_index #mymainback {
	display: block;
	width: auto;
	padding: 0;
	margin: 0;
}

/* 非表示 */
.tpl_top_index #footstep_wrap {
	display: none !important;
}

/* メインビジュアル
============================================================ */
#top_photo_wrap {
	position: relative;
}
#top_photo {
	position: relative;
	overflow: hidden;
}
#top_photo::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 80px;
	background: url(/img/top/wave.png) no-repeat center bottom / auto 100%;
}
@media screen and (min-width: 2000px) {
	#top_photo::after {
		background-size: 100% 100%;
	}
}
.photo_box {
	display: block;
	width: auto;
	height: 500px;
}
.photo_box img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}
#top_photo_control {
	position: absolute;
	right: calc(50% - var(--content-width) / 2);
	bottom: calc(80px + 20px);
	z-index: 2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 20px;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: var(--content-width);
}
#top_photo_pagination {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px;
}
#top_photo_pagination span.swiper-pagination-bullet {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 3px solid #fff;
	border-radius: 100%;
	background: #fff;
	margin: 0;
	opacity: 1;
}
#top_photo_pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #225faa;
}
#top_photop_controlBtn {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	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;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 10px;
}
#top_photop_controlBtn button {
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 100%;
	background: #fff;
	background-repeat: no-repeat;
	background-position: center;
}
#top_photop_controlBtn button.slide_control_prev {
	background-image: url(/img/top/icon_prev.png);
}
#top_photop_controlBtn button.slide_control_next {
	background-image: url(/img/top/icon_next.png);
}
#top_photop_controlBtn button.slide_control_stop {
	background-image: url(/img/top/icon_stop.png);
}
#top_photop_controlBtn button.slide_control_play {
	background-image: url(/img/top/icon_play.png);
}
#top_photop_controlBtn button.slide_control_stop.is-active,
#top_photop_controlBtn button.slide_control_play.is-active {
	display: none;
}

/* メイン
============================================================ */

/* レイアウト
---------------------------------------- */
.ly_top_section > [class^="top_"] {
	max-width: var(--content-width);
	margin-inline: auto;
}
.ly_top_section > .top_ttl {
	margin-bottom: 50px;
}
.ly_top_section.ly_top_section__search {
	position: static;
	inset: auto;
	color: inherit;
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
	max-height: none;
	background: none;
	padding: 0 0 60px;
	border: none;
	margin: 0;
}
.is_active_search .ly_top_section.ly_top_section__search {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 100vh;
	height: 100dvh;
	padding: 0;
	overflow: auto;
	-ms-scroll-chaining: none;
	    overscroll-behavior: none;
	background: #c7e0ff;
}
.ly_top_section.ly_top_section__info {
	padding-top: 0;
	padding-bottom: 60px;
}
.ly_top_section.ly_top_section__info:not(:has([class^="top_"])) {
	display: none;
}
.ly_top_section.ly_top_section__site {
	padding-top: 60px;
	padding-bottom: calc(60px + 30px);
	background-image: url(/img/top/water.png), url(/img/top/bg_section_site.png);
	background-position: center bottom, center top 50px;
	background-repeat: no-repeat;
	background-color: #e1efff;
	-webkit-mask-image: url(/img/top/mask.png), -webkit-gradient(linear, left top, left bottom, from(#e1efff), to(#e1efff));
	-webkit-mask-image: url(/img/top/mask.png), linear-gradient(#e1efff, #e1efff);
	        mask-image: url(/img/top/mask.png), -webkit-gradient(linear, left top, left bottom, from(#e1efff), to(#e1efff));
	        mask-image: url(/img/top/mask.png), linear-gradient(#e1efff, #e1efff);
	-webkit-mask-position: center top, center 50px;
	        mask-position: center top, center 50px;
	-webkit-mask-size: 2000px 50px, 100% calc(100% - 50px);
	        mask-size: 2000px 50px, 100% calc(100% - 50px);
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
}
.ly_top_section.ly_top_section__menu {
	padding-top: 30px;
	padding-bottom: 60px;
	background: url(/img/top/bg_section_search.png) no-repeat center top 130px #c7e0ff;
}
.ly_top_section.ly_top_section__news {
	padding-top: 60px;
}
.ly_top_section.ly_top_section__news > .top_event {
	margin-top: 20px;
}
.ly_top_section.ly_top_section__news:not(:has(.count_down_box)) {
	display: none;
}
.ly_top_section.ly_top_section__about {
	padding-top: 60px;
	padding-bottom: 60px;
	background: url(/img/top/bg_section_about.png) no-repeat right calc(50% + 670px / 2 + 165px) top 60px #e1efff;
}
.ly_top_section.ly_top_section__about > .top_about {
	margin-top: 40px;
}
.ly_top_section.ly_top_section__add {
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #fff;
}

/* 共通見出し
---------------------------------------- */
.top_ttl {
	font-family: var(--font-yugothic);
	font-size: 3rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: .2em;
	text-indent: .2em;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center top;
}
.top_ttl.top_ttl__site {
	padding-top: calc(61px + 20px);
	background-image: url(/img/top/img_ttl_site.png);
}
.top_ttl.top_ttl__search {
	padding-top: calc(48px + 20px);
	background-image: url(/img/top/img_ttl_search.png);
}
.top_ttl.top_ttl__news {
	padding-top: calc(48px + 20px);
	background-image: url(/img/top/img_ttl_news.png);
}
.top_ttl.top_ttl__about {
	padding-top: calc(49px + 20px);
	background-image: url(/img/top/img_ttl_about.png);
}

/* 共通ボタン
---------------------------------------- */
a.top_btn,
a.top_btn2 {
	text-decoration: none;
	font-size: 1.4rem;
	line-height: 2rem;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 14px;
	max-width: 100%;
	min-height: 5rem;
	padding: 0 14px 0 28px;
	border: 1px solid;
	border-radius: 25px;
}
a.top_btn::after,
a.top_btn2::after {
	content: "";
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 5px 8px;
	margin: 0 0 0 auto;
}
a.top_btn {
	width: 21rem;
	color: #fff;
	border-color: #225faa;
	background-color: #225faa;
}
a.top_btn.top_btn__l {
	width: 22rem;
}
a.top_btn2 {
	width: 11rem;
	color: inherit;
	border-color: #cee4fd;
	background-color: #fff;
}
a.top_btn::after {
	background-image: url(/img/common/arrow_blue.png);
	background-color: #fff;
}
a.top_btn2::after {
	background-image: url(/img/common/arrow_white.png);
	background-color: #225faa;
}

/* 検索
---------------------------------------- */
.top_search_btn,
.top_search_btn2,
.top_search .s_menuUnit {
	display: none;
}
.is_active_search .top_search {
	padding-top: 12px;
	padding-bottom: 100px;
}
.is_active_search .top_search_btn {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	margin: 0 0 80px;
}
.is_active_search .top_search_unit > * + * {
	margin-top: 60px;
}
.is_active_search .top_search_btn2 {
	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;
	margin: 60px 0 0;
}
.is_active_search .top_search .s_menuUnit {
	display: block;
}

/* 重要なお知らせ
---------------------------------------- */
.top_important_container {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 15px auto;
	grid-template-columns: 1fr auto;
	gap: 15px;
	padding: 29px 29px 24px;
	border: 1px solid #cc0000;
	border-radius: 20px;
	background: #fff;
}
.top_important_ttl {
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1 / 2;
	-ms-grid-row: 1;
	-ms-grid-row-span: 1;
	grid-row: 1 / 2;
	color: #cc0000;
	font-size: 2rem;
	font-weight: bold;
	line-height: 3rem;
	letter-spacing: .1em;
	padding: 0 0 0 calc(30px + 13px);
	background: url(/img/top/icon_important.png) no-repeat top left / 30px 30px;
}
.top_important_list {
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1 / 3;
	-ms-grid-row: 2;
	-ms-grid-row-span: 1;
	grid-row: 2 / 3;
	padding: 0 0 0 calc(30px + 13px);
}
.top_important_list li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-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: 40px;
}
.top_important_list li + li {
	margin-top: 8px;
}
.top_important_list li span[class^="article_"] {
	display: block;
}
.top_important_list li span.article_date {
	width: 17.2rem;
	font-size: 1.6rem;
	line-height: 2.8rem;
}
.top_important_list li span.article_title {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	font-size: 1.8rem;
	line-height: 2.8rem;
}
.top_important_list li span.article_title a {
	color: inherit;
}
.top_important_link {
	-ms-grid-column: 2;
	-ms-grid-column-span: 1;
	grid-column: 2 / 3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 1;
	grid-row: 1 / 2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 15px;
}
.top_important_link span[class^="link_"] a {
	color: inherit;
	text-decoration: none;
	font-size: 1.4rem;
	line-height: 2rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 10px;
}
.top_important_link span[class^="link_"] a::after {
	content: "";
	-ms-flex-negative: 0;
	    flex-shrink: 0; 
	display: inline-block;
	width: 24px;
	height: 24px;
	border-radius: 100%;
	background: url(/img/common/arrow_white.png) no-repeat center / 5px 8px #cc0000;
	margin: 0 0 0 auto;
}

/* おすすめサイト
---------------------------------------- */
.top_site_list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 40px 80px;
}
.top_site_i {
	width: calc(100% / 2 - 80px / 2);
}
.top_site_box {
	display: block;
	overflow: hidden;
}

/* メニュー
---------------------------------------- */

/* 新着情報
---------------------------------------- */
.ly_top_section.ly_top_section__nwrap {
	padding-top: 60px;
    padding-bottom: 60px;
    background: url(/img/top/bg_section_news.png) no-repeat left calc(50% + 845px / 2 - 120px) top 57px #fff;
}
ul.top_news_list {
	margin: -5px 0;
}
ul.top_news_list li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-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;
	padding: 0 30px;
}
ul.top_news_list li + li {
	margin-top: 15px;
	border-top: 1px solid #d6d6d6;
	padding-top: 15px;
}
ul.top_news_list li span[class^="article_"] {
	display: block;
}
ul.top_news_list li span.article_date {
	font-size: 1.6rem;
	line-height: 2.8rem;
	width: calc(10em + 20px + 40px);
}
ul.top_news_list li span.article_date img.top_icon_new {
	width: auto;
	height: 20px;
	margin: calc((2.8rem - 20px) / 2) 0;
	margin-left: 20px;
}
ul.top_news_list li span.article_title {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	font-size: 1.6rem;
	line-height: 2.8rem;
}
ul.top_news_list li span.article_title a {
	color: inherit;
}
.top_news_link {
	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;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 15px;
	margin: 60px 0 0;
}

/* イベント・カウントダウン
---------------------------------------- */
.top_event_ttl {
	font-size: 2.2rem;
	font-weight: bold;
	letter-spacing: .05em;
	line-height: 1;
	padding: 19px 0 10px calc(81px + 10px);
	min-height: 51px;
	background: url(/img/top/img_ttl_event.png) no-repeat bottom left / 81px 51px;
	margin: 0 0 10px;
}
.count_down_box_wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px;
}
.count_down_box {
	width: calc(100% / 2 - 20px / 2);
	padding: 19px 16px 19px 19px;
	border: 1px solid #225faa;
	border-radius: 20px;
	background: rgb(255 255 255 / .5);
}
.count_down_box2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-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;
}
.count_img {
	display: block;
	width: 180px;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
}
.count_img2 {
	display: block;
	aspect-ratio: 180 / 135;
	border-radius: 10px;
	overflow: hidden;
}
.count_img2 img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
}
.count_txt {
	width: calc(100% - 20px - 180px);
}
.count_txt:only-child {
	width: 100%;
}
.count_title {
	display: block;
}
.count_title a {
	color: inherit;
}
.count_title,
.count_title a {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 2.8rem;
	letter-spacing: .05em;
}
.count_comment {
	font-size: 1.4rem;
	line-height: 2.2rem;
	letter-spacing: .01em;
	display: block;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	min-height: 4.4rem;
	overflow: hidden;
	margin: 10px 0 0;
}
.count_day {
	color: #cc0000;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;
	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;
	min-height: 4.2rem;
	width: 18rem;
	max-width: 100%;
	border-radius: 5px;
	background: #fcf8e8;
	margin: 10px 0 0 auto;
}
.count_day span {
	margin: 0 .25em;
}
.top_event_link {
	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;
	margin: 40px 0 0;
}

/* リンク
---------------------------------------- */
.top_link_list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px 42px;
}
.top_link_list li {
	width: calc(100% / 3 - 42px * 2 / 3);
}
.top_link_list li a {
	color: inherit;
	text-decoration: none;
	font-size: 1.8rem;
	line-height: calc(20 / 18);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 20px;
	height: 100%;
	min-height: 80px;
	padding: 20px 20px 20px 30px;
	border-radius: 20px;
	background: #fff;
}
.top_link_list li a::after {
	content: "";
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 100%;
	background: url(/img/common/arrow_white.png) no-repeat center / 5px 8px #225faa;
	margin: 0 0 0 auto;
}

/* 揖斐川町について
---------------------------------------- */
.top_about {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px 42px;
}
.top_about_box {
	width: calc(100% / 3 - 42px * 2 / 3);
	padding: 30px 20px;
	border-radius: 20px;
	background: #fff;
}
.top_about_ttl {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: .1em;
	text-indent: .1em;
	text-align: center;
	margin: 0 0 30px;
}

/* 時計 */
.top_tokei_img {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background: #333;
}
#tokei_time {
	position: absolute;
	top: 14px;
	left: 13px;
	z-index: 1;
	color: #fff;
	font-size: 2.6rem;
	font-weight: bold;
	text-shadow: 0 0 10px rgb(0 0 0 / .48);
}
#tokei_photo {
	position: relative;
	aspect-ratio: 292 / 196;
}
#tokei_photo .clock-image {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	opacity: 0;
	-webkit-transition: opacity 1.0s ease-in-out;
	transition: opacity 1.0s ease-in-out;
}
#tokei_photo .clock-image.active {
	opacity: 1;
}
.top_tokei_txt {
	font-size: 1.4rem;
	line-height: 2.4rem;
	letter-spacing: .02em;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	margin: 15px auto 0;
}
.top_tokei_link {
	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;
	margin: 23px 0 0;
}

/* 広報 */
.top_koho_book {
	max-width: 185px;
	margin: 0 auto;
}
.top_koho_book + .top_koho_book {
	margin-top: 10px;
}
.top_koho_cover {
	display: block;
	aspect-ratio: 185 / 261;
}
.top_koho_cover img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	   object-fit: contain;
	margin: 0 auto;
}
.top_koho_link {
	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;
	margin: 20px 0 0;
}

/* 町の取り組み */
#top_pr_list {
	max-width: 292px;
	margin: 0 auto;
}
.top_pr_box {
	display: block;
	aspect-ratio: 292 / 120;
}
.top_pr_box img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	   object-fit: contain;
	margin: 0 auto;
}
#top_pr_control {
	margin: 20px 0 0;
}
#top_pr_pagination {
	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;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 26px;
}
#top_pr_pagination span.swiper-pagination-bullet {
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 2px solid #fff;
	border-radius: 100%;
	background: #c9c9c9;
	margin: 0;
	opacity: 1;
}
#top_pr_pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #225faa;
}
#top_pr_controlBtn {
	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;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 20px;
	margin: 17px 0 0;
}
#top_pr_controlBtn button {
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 100%;
	background: #daebff;
	background-repeat: no-repeat;
	background-position: center;
}
#top_pr_controlBtn button.slide_control_prev {
	background-image: url(/img/top/icon_prev2.png);
}
#top_pr_controlBtn button.slide_control_next {
	background-image: url(/img/top/icon_next2.png);
}
#top_pr_controlBtn button.slide_control_stop {
	background-image: url(/img/top/icon_stop2.png);
}
#top_pr_controlBtn button.slide_control_play {
	background-image: url(/img/top/icon_play2.png);
}
#top_pr_controlBtn button.slide_control_stop.is-active,
#top_pr_controlBtn button.slide_control_play.is-active {
	display: none;
}

/* バナー広告
---------------------------------------- */
.top_banner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-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: 25px;
}
.top_banner_head {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 12px;
	min-height: 64px;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
}
.top_banner_ttl {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1;
	letter-spacing: .1em;
}
.top_banner_link {
	font-size: 1.2rem;
}
.top_banner_link a {
	color: inherit;
}
.top_banner_body {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
}
.top_banner_list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 12px;
}
.top_banner_list li {
	max-width: 180px;
}
.top_banner_list li a {
	display: block;
}

/* ==================================================
マウスオーバー
================================================== */
@media (hover: hover) {
	a.top_btn:hover,
	a.top_btn:focus,
	a.top_btn2:hover,
	a.top_btn2:focus,
	.top_important_link span[class^="link_"] a:hover,
	.top_important_link span[class^="link_"] a:focus,
	.top_link_list li a:hover,
	.top_link_list li a:focus {
		text-decoration: underline;
	}
	a.top_btn::after,
	a.top_btn2::after,
	.top_important_link span[class^="link_"] a::after,
	.top_link_list li a::after {
		-webkit-transition: .3s translate;
		transition: .3s translate;
	}
	a.top_btn:hover::after,
	a.top_btn:focus::after,
	a.top_btn2:hover::after,
	a.top_btn2:focus::after,
	.top_important_link span[class^="link_"] a:hover::after,
	.top_important_link span[class^="link_"] a:focus::after,
	.top_link_list li a:hover::after,
	.top_link_list li a:focus::after {
		translate: 5px 0;
	}
}

/* ==================================================
スマートフォン
================================================== */
@media screen and (max-width: 1080px) {

	/* メインビジュアル
	============================================================ */
	#top_photo_wrap {
		position: static;
		padding-bottom: 40px;
	}
	#top_photo::after {
		height: 15vw;
		min-height: 48px;
	}
	.photo_box {
		height: auto;
		aspect-ratio: 375 / 268;
	}
	#top_photo_control {
		position: static;
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
		width: auto;
		max-width: none;
		padding-inline: 20px;
	}
	#top_photo_pagination {
		width: auto;
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
		gap: 24px 26px;
		margin-top: 10px;
	}
	#top_photo_pagination span.swiper-pagination-bullet {
		width: 10px;
		height: 10px;
		border: none;
		background-color: #225faa;
		opacity: .3;
	}
	#top_photo_pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
		opacity: 1;
	}
	#top_photop_controlBtn button {
		border: 1px solid #225faa;
	}

	/* メイン
	============================================================ */

	/* レイアウト
	---------------------------------------- */
	.ly_top_section > [class^="top_"] {
		padding-inline: 20px;
	}
	.ly_top_section.ly_top_section__add > [class^="top_"] {
		padding-inline: 5px;
	}
	.ly_top_section > .top_ttl {
		margin-bottom: 60px;
	}
	.ly_top_section > .top_ttl.top_ttl__site {
		margin-bottom: 40px;
	}
	.ly_top_section.ly_top_section__search {
		position: fixed;
		top: 100%;
		left: 0;
		z-index: 100;
		width: 100%;
		height: 100vh;
		height: 100dvh;
		padding-top: 30px;
		padding-bottom: calc(80px + 56px);
		background-color: #c7e0ff;
		overflow: auto;
		-ms-scroll-chaining: none;
		    overscroll-behavior: none;
		-webkit-transition: .5s translate;
		transition: .5s translate;
	}
	.spm_search_open .ly_top_section.ly_top_section__search {
		translate: 0 -100%;
	}
	.ly_top_section.ly_top_section__site {
		padding-bottom: calc(60px + 15px);
		background-position: center bottom, center top 40px;
		background-size: auto 15px, 335px auto;
		-webkit-mask-position: center top, center 63px;
		        mask-position: center top, center 63px;
		-webkit-mask-size: 1000px 63px, 100% calc(100% - 63px);
		        mask-size: 1000px 63px, 100% calc(100% - 63px);
	}
	.ly_top_section.ly_top_section__menu {
		padding-top: 55px;
		background-position: left bottom -30px;
		background-size: 400px auto;
	}
	.ly_top_section.ly_top_section__nwrap {
		background-position: center top 40px;
		background-size: 315px auto;
	}
	.ly_top_section.ly_top_section__nwrap > .top_event {
		margin-top: 60px;
	}
	.ly_top_section.ly_top_section__about {
		background-position: center top 30px;
		background-size: 315px auto;
	}
	.ly_top_section.ly_top_section__about > .top_about {
		margin-top: 20px;
	}

	/* 共通見出し
	---------------------------------------- */
	.top_ttl {
		font-size: 2.4rem;
	}
	.top_ttl.top_ttl__site {
		padding-top: calc(49px + 18px);
		background-size: auto 49px;
	}
	.top_ttl.top_ttl__search {
		padding-top: calc(39px + 18px);
		background-size: auto 39px;
	}
	.top_ttl.top_ttl__news {
		padding-top: calc(39px + 18px);
		background-size: auto 39px;
	}
	.top_ttl.top_ttl__about {
		padding-top: calc(39px + 18px);
		background-size: auto 39px;
	}

	/* 共通ボタン
	---------------------------------------- */

	/* 検索
	---------------------------------------- */
	.top_search,
	.is_active_search .top_search {
		padding-block: 0;
	}
	.top_search .s_menuUnit,
	.is_active_search .top_search .s_menuUnit {
		display: block;
	}
	.top_search_unit > * + *,
	.is_active_search .top_search_unit > * + * {
		margin-top: 40px;
	}
	.top_search_btn ,
	.top_search_btn2 {
		display: none !important;
	}

	/* 重要なお知らせ
	---------------------------------------- */
	.top_important_container {
		display: block;
		padding: 19px;
		border-radius: 10px;
	}
	.top_important_list {
		padding-left: 0;
		margin-top: 15px;
	}
	.top_important_list li {
		display: block;
	}
	.top_important_list li + li {
		margin-top: 20px;
	}
	.top_important_list li span.article_date {
		width: auto;
		line-height: 2.6rem;
	}
	.top_important_list li span.article_title {
		margin-top: 4px;
	}
	.top_important_link {
		gap: 13px;
		margin-top: 32px;
	}

	/* おすすめサイト
	---------------------------------------- */
	.top_site_list {
		gap: 20px;
	}
	.top_site_i {
		width: auto;
		max-width: 500px;
	}

	/* メニュー
	---------------------------------------- */

	/* 新着情報
	---------------------------------------- */
	ul.top_news_list {
		margin-top: 0;
		margin-bottom: -6px;
	}
	ul.top_news_list li {
		display: block;
		padding-inline: 0;
	}
	ul.top_news_list li + li {
		margin-top: 14px;
		padding-top: 17px;
	}
	ul.top_news_list li span.article_date {
		line-height: 2rem;
		width: auto;
	}
	ul.top_news_list li span.article_date img.top_icon_new {
		margin-block: calc((2rem - 20px) / 2);
	}
	ul.top_news_list li span.article_title {
		margin-top: 7px;
	}
	.top_news_link {
		margin-top: 40px;
	}

	/* イベント・カウントダウン
	---------------------------------------- */
	.top_event_ttl {
		padding: 11px 0 8px calc(65px + 12px);
		min-height: 41px;
		background-size: 65px 41px;
		margin-bottom: 20px;
	}
	.count_down_box {
		width: 100%;
		padding: 19px;
		border-radius: 10px;
		margin-inline: auto;
	}
	.count_down_box2 {
		gap: 15px;
	}
	.count_img {
		width: 100px;
	}
	.count_img2 {
		aspect-ratio: 100 / 75;
		border-radius: 5px;
	}
	.count_txt {
		width: calc(100% - 15px - 100px);
	}
	.count_title,
	.count_title a {
		font-size: 1.6rem;
		line-height: 2rem;
	}
	.count_comment {
		-webkit-line-clamp: 3;
		min-height: auto;
		margin-top: 12px;
	}
	.top_event_link {
		margin-top: 30px;
	}

	/* リンク
	---------------------------------------- */
	.top_link_list {
		display: block;
	}
	.top_link_list li {
		width: auto;
	}
	.top_link_list li + li {
		margin-top: 20px;
	}

	/* 揖斐川町について
	---------------------------------------- */
	.top_about {
		display: block;
	}
	.top_about_box {
		width: auto;
		border-radius: 10px;
	}
	.top_about_box + .top_about_box {
		margin-top: 20px;
	}

	/* 時計 */
	.top_tokei_img {
		max-width: 295px;
		margin-inline: auto;
	}
	#tokei_photo {
		aspect-ratio: 295 / 196;
	}
	.top_tokei_txt {
		margin-top: 20px;
	}
	.top_tokei_link {
		margin-top: 25px;
	}

	/* 広報 */

	/* 町の取り組み */

	/* バナー広告
	---------------------------------------- */
	.top_banner {
		display: block;
	}
	.top_banner_head {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		    -ms-flex-direction: row;
		        flex-direction: row;
		-webkit-box-align: end;
		    -ms-flex-align: end;
		        align-items: flex-end;
		gap: 20px;
		min-height: auto;
	}
	.top_banner_body {
		margin-top: 20px;
	}
	.top_banner_list {
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		gap: 5px;
	}

}
/* ==================================================
スマートフォン ここまで
================================================== */

/* ==================================================
背景色変更
================================================== */
.color_change {
	img.top_icon_new {
		background-color: transparent !important;
		-webkit-filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) !important;
		        filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff) !important;
	}
	.hoge {
		background-color: transparent !important;
		-webkit-filter: brightness(0) invert(1);
		        filter: brightness(0) invert(1);
	}
	#top_photo_control,
	#top_photo_pagination,
	#top_photop_controlBtn,
	.top_important_ttl,
	.top_ttl,
	.top_event_ttl,
	.top_about_ttl,
	.top_banner_ttl {
		background-color: transparent !important;
	}
	#top_photo::after,
	.top_important_link span[class^="link_"] a::after,
	a.top_btn::after,
	a.top_btn2::after,
	.top_link_list li a::after {
		display: none !important;
	}
	.ly_top_section {
		background-image: none !important;
	}
	.hoge {
		background-color: currentcolor !important;
	}
	#top_photop_controlBtn button,
	#top_pr_controlBtn button {
		background-color: #fff !important;
	}
	.top_link_list li a {
		border: 1px solid;
	}
	.hoge {
		border-radius: 100% !important;
	}
	.hoge {
		border-top: none !important;
	}
	.top_about_box {
		outline: 1px solid;
		outline-offset: -1px;
	}
}
.color_black {
	span.swiper-pagination-bullet {
		border-color: #fff !important;
		background-color: #fff !important;
	}
	span.swiper-pagination-bullet.swiper-pagination-bullet-active {
		background-color: #333 !important;
	}
}
.color_blue {
	span.swiper-pagination-bullet {
		border-color: #fff !important;
		background-color: #fff !important;
	}
	span.swiper-pagination-bullet.swiper-pagination-bullet-active {
		background-color: #00a !important;
	}
}