/*!
Theme Name: rishiri
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: rishiri
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

rishiri is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
 html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
	font-size: 16px;
}

.header-top{
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1440px;
	margin: auto;
}
/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

.site-content{
	max-width: 1180px;
  	margin: auto;
}


/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
	padding-bottom: 10px;
	font-size: 26px;
	background-image: repeating-linear-gradient(90deg, #b4a983 0, #b4a983 2px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 4px);
	background-size: 4px 4px;
	background-repeat: repeat-x;
	background-position: center bottom;
}

h2{
	/*
	padding: 15px 10px 15px 65px;
	background: url('/wp-content/themes/rishiri/images/konbu-icon.png') no-repeat left center;
	background-color: rgba(0, 0, 0, 0);
	background-position-x: left;
	background-position-y: center;
	background-size: auto;
	background-size: 30px 30px;
	background-color: #31A3F4;
	background-position: 20px center;
	font-size: 18px;
	font-weight: 800;
	*/
	cursor: pointer;
    background-color: #f1f1f1;
    padding: 10px;
    border: 1px solid #ccc;
    margin: 5px 0;
	font-size: 1.5rem;
}	


h3 {
	color: #505050;/*文字色*/
	padding: 0.5em;/*文字周りの余白*/
	display: block;/*おまじない*/
	line-height: 1.3;/*行高*/
	background: #dbebf8;/*背景色*/
	border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
	font-size: 20px;
}

h3:before {
	content: '●';
	color: white;
	margin-right: 8px;
}

/* Groupingcontent
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

.search-icon-container {
	display: none; /* デフォルトで非表示 */
  }
  
  
  @media (max-width: 900px) {
	.fa-search{
		font-size: 25px;
	}

	.search-icon-container {
		display: block;
		position: absolute;
		top: 55px;
		right: 110px;
		z-index: 1001;
	}
	
	.search-form {
	  display: none;
	  position: absolute;
	  top: 235px;
	  right: 0;
	  width: 100%;
	  background-color: #fff;
	  padding: 10px;
	  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
	  z-index: 1000;
	}
	
	.search-form.active {
	  display: block;
	}
	
	.menu-toggle {
	  position: absolute;
	  top: -10px;
	  right: 0;
	  z-index: 1000;
	  background-color: transparent;
	  border: none;
	  color: #fff;
	  font-size: 120px;
	  padding: 15px;
	}
	
	button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
	  border-color: #ccc #bbb #aaa;
	}
  }
  

  




/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: "BIZ UDPGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.6;
	color: #333333;
	word-break: normal;
	word-wrap: break-word;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
	appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
 [type="search"] {
	-webkit-appearance: textfield;
	appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: dnp-shuei-mincho-pr6n, sans-serif,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  	font-weight: 400 !important;
	font-size: 18px;
	line-height: 1.6;
	letter-spacing: 0.1em;
  	position: unset;
	overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}



p {
	margin-bottom: 1.5em;
	margin-left: 14px;
	line-height: inherit;
	position: relative;
  font-size: 18px;
  margin-left: 35px;
}

.specific-paragraph {
  text-indent: 1em;
  margin-left: 10px;
}


dfn,
cite,
em,
i {
	font-style: italic;
	font-family: "Times New Roman", Georgia, serif;
	font-weight: 400 !important;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
    background-color: transparent;
}


.top-bgcolor{
	background: #415881;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 1em 1.5em 2.5em;
}

ul {
	list-style: none;
	line-height: inherit;
}

ol {
	list-style: decimal;
	line-height: inherit;
}

li > ul,
li > ol {
	margin-bottom: 10px;
	margin-top: 10px;
}

dt {
	font-weight: 700;
}

dd {
	position: relative;
  	margin: auto;
	text-align: center;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	float: left;
	margin: 0 15px 15px 0;
	width: 10%;
}
figure img {
	max-width: 100%;
}

table {
	max-width: 100%;
	text-align: left;
	color: #111;
	padding: 1em;
  	font-size: 16px;
	font-weight: 600;
}

.tenki tabel{

	font-size: 16px;

}

/* TOPページ上部3カラム */
.container-top {
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	padding-top: 430px; /* 上部の余白を padding で設定 */
}
.content-wrapper {
	display: flex;
	width: 100%;
}
.left-side {
	width: 30%;
	display: flex;
	flex-direction: column;
}
.right-side {
	width: 70%;
}
.left-column, .right-column, .center-column {
	padding: 20px;
	box-sizing: border-box;
}
.left-column {
	/*background-color: #f0f0f0;*/
	text-align: center;
}
.right-column {
	/*background-color: #e0e0e0;*/
}
.center-column {
	/*background-color: #d0d0d0;*/
	height: 100%;
}
img {
	max-width: 100%;
	height: auto;
}
@media (max-width: 960px) {
	.left-side, .right-side {
		width: 50%;
	}
}
@media (max-width: 764px) {
	.content-wrapper {
		flex-direction: column;
	}
	.left-side, .right-side {
		width: 100%;
	}
}

	/* 人口統計の更新部分 */
	.population-map {
		position: relative;
		width: 100％;
		height: 300px; /* 高さは適宜調整してください */
		background-size: cover;
		background-position: center;
		display: flex;
		flex-direction: column;
		justify-content: space-around; /* 均等にスペースを分ける */
		align-items: center; /* 中央揃え */
		color: white;
		background-color: darkgreen;
		padding: 20px;
	}


	.box {
		margin-bottom: 15px;
		width: 100%;
	}

  .oshirase{
	background-color: white;
	border-color: #bbb;
	border-style: dashed;
	padding-top: 15px;
	padding-bottom: 20px;
	max-width: 100%;
  	margin: auto;
  }

  .oshirase-top{
  margin-bottom: 45px;
  margin: auto;
  color: white;
  font-size: 14px;
  }

  .oshirase ul{
	margin: 0 1em 1.5em 0em;
  }

  .oshirase li{
	margin-bottom: 10px;
  }

  .oshirase-top a{
	margin-left: 10px;
	color: white;
	}

  @media (max-width: 900px) {
	.oshirase-top{
		padding-top: 0px;;
		}
}

.update-title {
    font-size: 24px; /* タイトルのフォントサイズ */
}

.statistics {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%; /* 全幅 */
}

.statistics > div {
    display: flex;
    justify-content: space-evenly;
    width: 100%; /* 行の幅を親要素に合わせる */
}

.data-point img {
    width: 20px; /* 画像のサイズ、適宜調整可能 */
    margin-right: 2px; /* 画像とテキストの間隔 */
}

.number {
    font-size: 20px; /* 数値のフォントサイズ */
}



.table_design01 {
	border-collapse: collapse;
	width: 100%;
	max-width: 100%;
	border-style: hidden;
	margin-bottom: 10px;
  }
  .table_design01 th, .table_design01 td {
	border: 2px solid #fff;
	background-color: #e6f1f6;
	padding: 1em;
  }
  .table_design01 th {
	background-color: #4d9bc1;
	color: #fff;
	font-weight: bold;
	text-align: left;
	width: 35%;
	min-width: 4em;
  }


  .table_design02 {
    border-spacing: 0;
  }
  .table_design02 th, .table_design02 td {
	border-bottom: 2px solid #000;
    padding: 10px;
  }
  


  .table_design04 {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
  }
  .table_design04 tr {
    border: 1px solid #ddd;
  }
  .table_design04 td {
    padding: 10px;
    border: 1px solid #ddd;
  }
  .table_design04 td:first-child {
    background-color: #4a90e2;
    color: white;
    font-weight: bold;
    width: 30%;
  }
  
  .table_design07 tr {
	background-color: transparent;
  }



  .table_design05 {
	border-collapse: collapse;
	width: 100%;
	max-width: 980px;
  }
  
  .table_design05 thead {
	display: none;
  }
  
  .table_design05 tbody tr {
	display: flex;
	flex-wrap: wrap;
	border: 2px solid #d2e8f1;
	margin-bottom: 1em;
  }
  
  .table_design05 th, .table_design05 td {
	padding: 1em;
	border: none;
  }
  
  .table_design05 tbody th {
	width: 20%;
	background: #4d9bc1;
	color: #fff;
	font-weight: bold;
	text-align: center;
  }
  
  .table_design05 td {
	width: 80%;
	text-align: left;
  }
  
  .table_design05 td::before {
	content: attr(data-label);
	color: #4d9bc1;
	font-weight: bold;
	display: block;
	margin-bottom: 0.5em;
  }
  
  @media screen and (max-width: 767px) {
	.table_design05 tbody th,
	.table_design05 td {
	  width: 100%;
	}
	
	.table_design05 td {
	  border-top: 1px solid #e6f1f6;
	}
  }	



  .table_design06 {
	border-collapse: collapse;
	table-layout: fixed;
	width: 600px;
	min-width: 600px;
	font-weight: bold;
	text-align: left;
	}
	.table_design06 thead th {
	padding: 1em .8em;
	border-right: 2px solid #fff;
	}
	.table_design06 thead th:not(:first-child) {
	background: #4d9bc1;
	color: #fff;
	font-size: 16px;
	border-radius: 15px 15px 0 0;
	padding: 0.5em;
	}
	.table_design06 thead th span {
	font-size: .8rem;
	}
	.table_design06 tbody {
	border: 2px solid #d2e8f1;
	}
	.table_design06 tbody tr {
	background-color: #e6f1f6;
	}
	.table_design06 tbody tr:nth-child(odd) {
	background-color: #fff;
	}
	.table_design06 td {
	border-left: 2px solid #d2e8f1;
	color: #4d9bc1;
	padding: 1em;
	}
	.table_design06 td:first-child {
	width: 120px;
	}
	.table_design06 td:last-child {
	width: 480px;
	}
	





  .table_design07 {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	max-width: 600px;
	text-align: center;
	margin: auto;
  }
  
  .table_design07 th,
  .table_design07 td {
	border: 2px solid #d2e8f1;
	padding: 1em;
	text-align: right;
  }
  
  .table_design07 thead th {
	background-color: #4d9bc1;
	color: #fff;
	border: 2px solid #4d9bc1;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
  }
  
  .table_design07 thead th:last-of-type {
	border-right: 2px solid #4d9bc1;
  }
  
  .table_design07 tbody th {
	color: #4d9bc1;
	font-weight: bold;
	text-align: left;
  }
  
  .table_design07 tr:nth-child(5),
  .table_design07 tr:nth-child(6),
  .table_design07 tr:nth-child(7),
  .table_design07 tr:nth-child(11),
  .table_design07 tr:nth-child(12),
  .table_design07 tr:nth-child(13),
  .table_design07 tr:nth-child(15),
  .table_design07 tr:nth-child(16),
  .table_design07 tr:nth-child(17) {
	background-color: #f0f0f0;
  }
  
  .table_design07 tr {
	background-color: transparent;
  }



.table_design08 {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	max-width: 100%;
	text-align: center;
  }
  .table_design08 th, .table_design08 td {
	border: 2px solid #d2e8f1;
	padding: 1em;
  }
  .table_design08 thead th {
	background-color: #4d9bc1;
	color: #fff;
	border: 2px solid #4d9bc1;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
  }
  .table_design08 thead th:last-of-type {
	border-right: 2px solid #4d9bc1;
  }
  .table_design08 tbody th {
	color: #4d9bc1;
	font-weight: bold;
	text-align: center;
  }


  .table_design12 {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	min-width: 890px;
	font-weight: bold;
	text-align: center;
  }
  .table_design12 thead th {
	padding: 1em .8em;
	border-right: 2px solid#fff;
  }
  .table_design12 thead th:not(:first-child) {
	background: #4d9bc1;
	color: #fff;
	font-size: 16px;
	border-radius: 15px 15px 0 0;
	padding: 0.5em;
  }
  .table_design12 thead th span {
	font-size: .8rem;
  }

  .table_design12 tbody {
	border: 2px solid #d2e8f1;
  }
  .table_design12 tbody tr {
	background-color: #e6f1f6;
  }
  .table_design12 tbody tr:nth-child(odd) {
	background-color: #fff;
  }
  .table_design12 td {
	border-left: 2px solid #d2e8f1;
  }
  .table_design12 td {
	color: #4d9bc1;
	padding: 1em;
  }


  .table_design13 {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
	max-width: 980px;;
    font-weight: bold;
    text-align: center;
}
.table_design13 thead th {
    padding: 1em .8em;
    border-right: 2px solid #fff;
}
.table_design13 thead th:not(:first-child) {
    background: #4d9bc1;
    color: #fff;
    font-size: 16px;
    border-radius: 15px 15px 0 0;
    padding: 0.5em;
}
.table_design13 thead th span {
    font-size: .8rem;
}

.table_design13 tbody {
    border: 2px solid #d2e8f1;
}
.table_design13 tbody tr {
    background-color: #e6f1f6;
}
.table_design13 tbody tr:nth-child(odd) {
    background-color: #fff;
}
.table_design13 td {
    border-left: 2px solid #d2e8f1;
    padding: 1em;
    text-align: left;
}

/* スマホでの表示最適化 */
@media (max-width: 764px) {
    .table_design13 {
		border-collapse: collapse;
		max-width:100% ;
		font-weight: bold;
		text-align: center;
    font-size: 12px;
	}
	
	.table_design13 thead th {
		display: none; /* ヘッダーを非表示に */
	}
	
	.table_design13 tbody, .table_design13 tr {
		width: 100%;
		display: block;
	}
	
	.table_design13 td {
		display: block;
		width: 100%;
		padding: 0.5em; /* パディングを調整 */
		text-align: left; /* テキストを左寄せに変更 */
		border-bottom: 1px solid #d2e8f1; /* 下にボーダーを追加 */
	}
	
	.table_design13 td:before {
		content: attr(data-label); /* data-label属性の内容を前置テキストとして使用 */
		float: left;
		font-weight: bold;
		color: #4d9bc1;
		padding-right: 10px; /* ラベルとデータの間に余白を設定 */
	}
	
	.table_design13 tbody tr {
		background-color: #e6f1f6;
		border-bottom: 2px solid #d2e8f1;
	}
	
	.table_design13 tbody tr:nth-child(odd) {
		background-color: #fff;
	}
	
}

.table_design14 {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}
.table_design14 tr {
  border: 1px solid #ddd;
}

.table_design14 th {
  padding: 20px;
  width: 150px;
}

.table_design14 td {
  padding: 20px;
  background-color: white;
}
.table_design14 td:first-child {
  background-color: #4a90e2;
  color: white;
  width: 30%;
}

.table_design14{
  font-size: 18px;
  font-weight: 400;
}

.table_design14 h4{
  font-weight: 400!important;
}


.nobikko ul{
  list-style: disc;
  line-height: inherit;
  margin: 0;
}

.table_design_aigo {
  border-collapse: collapse;
  width: 100%;
  max-width: 900px;
  font-weight: bold;
  margin: auto;
  text-align: left;
  border: 2px solid #d2e8f1;
}

.table_design_aigo thead th {
  background: #4d9bc1;
  color: #fff;
  font-size: 16px;
  padding: 0.8em;
  border: 2px solid #d2e8f1;
  text-align: center;
}

.table_design_aigo tbody tr {
  background-color: #e6f1f6;
}

.table_design_aigo tbody tr:nth-child(odd) {
  background-color: #fff;
}

.table_design_aigo td {
  border: 2px solid #d2e8f1;
  padding: 1em;
  text-align: left;
}

.table_design_aigo td:first-child {
  width: 130px;
}

@media screen and (max-width: 600px) {
  .table_design_aigo,
  .table_design_aigo tbody {
      display: block;
      width: 100%;
  }

  .table_design_aigo thead {
      display: none;
  }

  .table_design_aigo tbody tr {
      display: block;
      margin-bottom: 1em;
      border: 2px solid #d2e8f1;
  }

  .table_design_aigo td {
      display: block;
      text-align: left;
      padding: 0.5em;
      border: none;
  }

  .table_design_aigo td:first-child {
      background: #4d9bc1;
      color: #fff;
      width: 100%;
      font-weight: bold;
      text-align: center;
  }

  .table_design_aigo tr:nth-child(odd) td:not(:first-child) {
      background-color: #fff;
  }

  .table_design_aigo tr:nth-child(even) td:not(:first-child) {
      background-color: #e6f1f6;
  }
}
			

/* Links
--------------------------------------------- */
a {
	color: #303333;
}

a:visited {
	color: #3a243a;
}

a:hover,
a:focus,
a:active {
	color: #303333;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
    line-height: 1;
    font-size: 14px;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 2px;
	padding: 1px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

.line-height-center {
    height: 100px;
    line-height: 100px;
}
/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */

.icon img {
    background-color: transparent; /* 背景を透過 */
}

.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;	
}

.site-main{
	margin: auto;
  max-width: 1280px;
}

.main-display{
	margin: 150px 20px;
}

.page-display{
	margin: 150px auto 0;
	max-width: 890px;
}

@media (max-width: 890px) {
	.page-display{
		margin: 10px 20px;
	}
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}


.topno1{
	padding-top: 100px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(/wp-content/themes/rishiri/images/aceess_bg.png);
	padding-bottom: 100px;
	background-color: aliceblue;
}


.topno1 img{
	margin: auto;
	text-align: center;
	padding: 0;
}

.topno2 {
	position: relative;
	background-position: bottom;
	color: black;
	transition: background-color 0.3s ease;
	padding-top: 50px;
	padding-left: 20px;
  	padding-right: 20px;
  }


.topno2 .flex-container{
	margin: auto;
	max-width: 780px;
	text-align: left;
}


.topno1 h2,.topno2 h2,.flex-item3 h2,.w800 h2, .oshirase-top h2,.oshirase h2,.navigation h2,.navi-area h2 {
	display: block;
	text-align: center;
	font-family: trajan-pro-3, serif;
	font-size: 45px;
	font-weight: 400;
	letter-spacing: .05em;
	padding: 0px;
	border: none;
	border-left: 0px;
	background: none;
	margin-top: -10px;
	margin-bottom: 0px;	
}


.flex-item3 h2{
	margin-top: -20px;
}

.break-img img{
	display: block; /* 画像がブロックレベル要素として表示されるように設定 */
    width: 100vw;   /* 画像の幅をビューポートの100%に設定 */
    object-fit: contain;
}

.img-center{
	margin: auto;
	text-align: center;
}

.w800 h2 {
	color:rgb(0, 0, 0);
}

.topno1 h4,.topno2 h4,.flex-item3 h4, .w800 h4,.oshirase h4,.navigation h4,.navi-area h4{
	font-size: 20px;
	font-family: dnp-shuei-mincho-pr6n, sans-serif;
	font-weight: 600;
	font-style: normal;
	text-align: center;
	letter-spacing: 0.1em;
	position: unset;
	margin-top: -10px;
}

.w800 h4 {
	color:rgb(0, 0, 0);
}



.topno1 p, .w800 p {
	max-width: 960px;
	margin: auto;
}

@media (max-width: 960px) {
	.topno1{
		max-width: 100%;
		margin-right: auto;
		margin-left: auto;
	}

	.topno1 h2,.flex-item3 h2{
		text-align: center;
		font-family: trajan-pro-3, serif;
		font-size: 30px;
		font-weight: 400;
		letter-spacing: .05em;
	}
h2{font-size: 0.8em;}
p{font-size: 14px;}
.flex-container{flex-direction:column;}



.flex-item{margin: 0 1em 1em;}
	
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 15px;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}





.background-slider {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 650px;
	z-index: -1;
	overflow: hidden;
  }
  
  .background-slider .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 650px;
	opacity: 0;
	transition: opacity 1s linear;
  }
  
  .background-slider .slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(1);
	transition: transform 7s linear;
  }
  
  .background-slider .slide.active {
	opacity: 1;
	z-index: 1;
  }
  
  .background-slider .slide.active img {
	transform: translate(-50%, -50%) scale(1.1);
  }
  

  section{
	width: 100%;
	max-width: 980px;
	padding-top: 20px;
	margin: 0px auto 0;
	text-align: center;
	z-index: 100;
	position: relative;

	}

section img{
	width: 94%;
	border-radius: 15px;
	max-height: 200px;
	object-fit: cover;
}		

section p{text-align: left;}


section2{
	width: 100%;
	text-align: center;
	}

	
	
/*dlタグの設定  */
.flex-container{
display: flex;
justify-content: space-around;
}

.flex-item{
  padding: 1em;
  flex-basis: 33.3%;
}

.flex-item2 a img{
  border: 2px #999 solid; 
}

.flex-item2{
  flex-basis: 48%;
    margin: 5px;
  text-align: center;
  }

  @media (max-width: 960px) {
    .flex-item2 {
      flex: 1 1 100%; /* 画面幅が768px以下の場合は1カラムに */
      margin: auto;
    }
    }
  
    .flex-item3 {
    flex: 1 1 48%; /* 各アイテムの幅を48%に設定 */
    box-sizing: border-box;
    padding: 10px; /* カラム間のスペースを調整 */
    margin: 10px 0; /* 上下のスペースを追加 */
    }
  @media (max-width: 960px) {
    .flex-item3 {
      flex: 1 1 48%; /* スマホでも2カラムに設定 */
      margin: 10px 0; /* 上下のスペースを追加 */
    }
    }
	
.flex-container-sightseeing {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  }

.flex-sightseeing{
  flex-basis: 30%;
  margin: auto;
  text-align: center;
  }

@media (max-width: 960px) {
  .flex-sightseeing {
    flex: 1 1 100%; /* 画面幅が768px以下の場合は1カラムに */
    margin: auto;
  }
  }
            

	.flex-item dt{
		margin-bottom: 10px;
		font-size: 18px;
		font-weight: bold;
		z-index: 99;
		position: relative;
	}

	.flex-item3 dt{
		margin-bottom: 10px;
		font-size: 1.2em;
		font-weight: bold;
		}	
  

   /* すべてのページのデフォルトスタイル */ 
  .site-header {
	position: relative;
	justify-content: space-between;
	align-items: center;
	padding: 10px 20px;
	z-index: 1;
	max-height: 163px;
  }

  body:not(.home) .site-header {
	background-image: url(/wp-content/themes/rishiri/images/bg-header.png);
	max-height: 225px;
}

body:not(.home) .menu-container {
	position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  font-weight: bolder;
  width: 100%;
  max-width: 1180px;
  margin: 65px auto 0;
}

@media (max-width: 960px) { /* 768px以下のデバイスで適用されます */
    body:not(.home) .menu-container {
        display: none; /* スマホの場合はmenu-containerを非表示にする */
    }
}

body:not(.home) .menu-container p{
	display: none;
}

  body.home .site-header {
	background-image: none;
	
  }

  

/* TOPページ専用のスタイル */
body.home  
body.front-page  {
	position: relative;
	justify-content: space-between;
	align-items: center;
	padding: 10px 20px;
	z-index: 1;
	
}


.site-branding {
	display: flex;
	align-items: center;
	max-width: 280px;
  }
  
  .site-branding .logoimg img{
	margin-right: auto;
  	max-width: 300px;
  }
  
  
  .controls {
	text-align: right;
  }
  
  .search-form {
	margin-top: 10px;
  }


.search-form .search-field {
	width: 150px;
	padding: 5px;
	font-size: 12px;
  }
  
  .search-form .search-submit {
	padding: 5px 10px;
	font-size: 12px;
  }
  
  #google_translate_element {
	margin-top: 10px;
  }
  


  

  /* すべてのページのデフォルトスタイル */
#content {
    margin-top: 0px;
}

.header-top {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 32px;
  }

.site-branding {
margin-right: auto;
}  

.menu-container {
	z-index: 2;
	display: flex;
	justify-content: space-between;
	font-weight: bolder;
	width: 100%;
	max-width: 1180px;;
	margin: 498px auto 0;
  }

  .menu-container p{
	margin-top: -5px;
	line-height: inherit;
	position: relative;
	color: white;
	text-align: center;
	margin-left: 0;
  }


  .menu-container a{
	color: #0d0d0d;
	text-decoration: none;
	font-size: 14px;
  }
  
  .menu-item {
	flex: 0 0 auto;
	text-align: center;
	max-width: 190px;
  }
  
  .menu-item:last-child {
	margin-right: 0;
  }
  
  .menu-item img {
	margin-top: -60px;
	width: 220px;
  }
  
  .menu-item span {
	display: block;
	margin-top: 5px;
	font-size: 12px;
	white-space: nowrap;
  }

  @media (max-width: 900px) { /* 768px以下のデバイスで適用されます */
    .menu-container {
        display: none; /* スマホの場合はmenu-containerを非表示にする */
    }
}



.menu-toggle {
	position: absolute;
	top: 0px;
	right: 0;
	z-index: 1000;
	background-color: transparent;
	border: none;
		border-top-color: currentcolor;
		border-right-color: currentcolor;
		border-bottom-color: currentcolor;
		border-left-color: currentcolor;
	color: #fff;
	font-size: 70px;
	padding: 30px;
}

@media (max-width: 900px) {
    .header-top {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .site-branding, .mobile-controls {
        width: 80%;
        text-align: left;
		margin-right: auto;
    
    }

    /* モバイル用ハンバーガーメニューを右上に固定 */
.mobile-menu-toggle {
  position: absolute; /* ロゴと重ならないように絶対位置で固定 */
  right: 20px; /* 右側に配置 */
  top: 20px; /* 上部に配置 */
  z-index: 100; /* ロゴの上に表示されるようにする */
}

/* ハンバーガーメニューのボタンスタイル */
.mobile-menu-toggle .menu-toggle {
  background-color: transparent;
  border: none;
  font-size: 55px;
  cursor: pointer;
}

/* ハンバーガーメニューのボタン */
.mobile-menu-toggle .menu-toggle {
  background-color: transparent;
  border: none;
  font-size: 55px; /* ハンバーガーメニューの三本線を55ピクセルに */
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 「MENU」テキストのスタイル */
.mobile-menu-toggle .menu-text {
  font-size: 16px; /* 「MENU」のフォントサイズを16ピクセルに */
  margin-bottom: 5px; /* 「MENU」とハンバーガーアイコンの間に少し余白を追加 */
  color: #ffffff; /* テキストの色を調整 */
  font-weight: bold; /* 太字で強調 */
}

    .menu-toggle {
        display: block; /* ハンバーガーメニューを表示 */
    }

}


.contentpage{
	width: 100%; /* Sets the maximum width of the div */
	margin: 0 auto; /* Centers the div horizontally and removes vertical margin */
}

.in-style{
	max-width: 980px; /* Sets the maximum width of the div */
	margin: 0 auto; /* Centers the div horizontally and removes vertical margin */
	padding: 20px; 
}

/* コンテナのスタイル設定 */
.container-topup {
	display: flex;
	width: 100%;
	background-color: steelblue;
	width: 100vw;
position: relative;
left: 50%;
transform: translateX(-50%);

}

.container-toppage{
	display: flex;
	margin: 60px auto;
	max-width: 980px;
}

/* Aカラムのスタイル設定 */
.column-a {
    flex: 4; /* 3部分の面積を占める */
}

/* Bカラムのスタイル設定 */
.column-b {
    flex: 1; /* 1部分の面積を占める */
}

/* スマートフォン表示時のスタイル */
@media (max-width: 900px) {
	.contentpage{

		padding-top: 0px;
	}

    .container-topup {
        flex-direction: column; /* カラムを縦方向に変更 */
    }
}



.container {
	overflow: auto;
	scroll-snap-type: y mandatory;
  }


.column-a {
    flex: 3;  /* Takes up 3/4 of the space */
    display: flex;
    flex-direction: column;
	padding-right: 75px;
}

.column-b {
    flex: 1;  /* Takes up 1/4 of the space */
}

.image-row {
    display: flex; /* Aligns the images horizontally */
    width: 100%;
}

.image-row-a {
    display: flex; /* Aligns the images horizontally */
    width: 100%;
	margin-top: -45px;
}

.image-row-c {
    display: flex; /* Aligns the images horizontally */
    width: 100%;
	margin-top: 70px;
}

.image-column {
    flex: 1;  /* Distributes space equally among images */
    padding: 5px; /* Optional padding around images */
}

.image-column img {
    width: 100%;  /* Makes the image responsive */
    height: auto; /* Maintains the aspect ratio */
}

@media (max-width: 900px) {
    .container {
        flex-direction: column;
    }

    .column-a, .column-b {
        width: 100%; /* Ensures both columns stack vertically and take full width */
		padding-right: 0px;
    }

    .image-row {
        flex-direction: column; /* Stack images vertically on smaller screens */
    }

	.image-row {
        flex-direction:	row; /* Stack images vertically on smaller screens */
    }
}



.tenki h2{
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	border-left: 0px;
	color: whitesmoke;
	background-color: unset;
}

.tenki {
	font-size: 16px;
	max-width: 800px;
	margin: auto;
	border-radius: 20px;
}

.tenki table{
	max-width: 400px;
	margin: auto;
}

.tenki th, .tenki td {
	width: 120px;
}

.image-column {
    position: relative; /* ポジションの基準点を設定 */
    text-align: center; /* テキストをセンタリング */
}

.text-overlay {
	position: absolute;
	top: 140px;
	left: 0;
	right: 0;
	margin: auto;
	color: #4d9bc1;
  	padding: 1em;
  
}

.mobile-menu {
	display: none;
  }


  .mobile-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	background-color: #402bfc;
	padding: 10px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  
  .mobile-menu.active {
	display: block;
  }
  
  .mobile-menu ul {
	list-style: none;
	padding: 25px;
	margin: 0;
  }
  
  .mobile-menu li {
	margin-bottom: 50px;
  }
  
  .mobile-menu a {
	display: block;
	text-decoration: none;
	color: #333;
  }

  /* モバイルデバイス用のスタイル */
@media (max-width: 900px) {

	.text-overlay {

		top: 70px;	  
	}


    .mobile-menu {
        background: #f9f9f9; /* メニューの背景色 */
        position: absolute; /* 絶対位置 */
        width: 100%; /* 幅を画面全体に */
        left: 0;
        top: 170px; /* ヘッダーの下に表示 */
        display: none; /* 初期状態では非表示 */
        flex-direction: column; /* 項目を縦に並べる */
    }

    .mobile-menu.active {
        display: flex; /* アクティブ時は表示 */
    }

    .menu-item {
        text-align: left; /* メニュー項目を中央揃え */
        padding: 12px; /* パディングの追加 */
        border-bottom: 1px solid #ccc; /* 下線を追加 */
		max-width: 100%;
    }

    .menu-item:last-child {
        border-bottom: none; /* 最後の項目の下線を削除 */
    }
}


  
.hinan_name{
	font-size: 26px;
}

.fire_title {
	color: white !important;
}

.fire_title a {
	color: white !important;
}

.fire_title a:visited {
	color: white !important;
}




  .smenu ul {
	margin-bottom: 20px;
	margin-left: -25px;
	list-style-type: none;
  }
  
  .smenu ul li.list {
	background-image: url(/wp-content/themes/rishiri/images/mark.png);
	margin-top: 12px;
  }

  .smenu ul li {
	margin-bottom: 5px;
	padding-left: 25px;
	background: url(/wp-content/themes/rishiri/images/mark.png) no-repeat 5px 5px;
	  background-image: url("/wp-content/themes/rishiri/images/mark.png");
  }

  .lastup{
	text-align: right;
	font-size: 14px;
  }


  html, body {
	height: 100%;
	margin: 0;
  }
  
  body {
	background-color: rgb(248, 247, 242);
	background-position-x: 0%;
	background-position-y: 0%;
	background-repeat: repeat;
	background-attachment: scroll;
	background-size: auto;
	background-origin: padding-box;
	background-clip: border-box;
  }
  
 
/* フッター全体のスタイル */

#custom-footer {
  color: #000;
  padding: 0px 0;
  position: relative;
  overflow: hidden;
  margin-top: -150px;
}

.footer-background {
  background-image: url('/wp-content/themes/rishiri/images/footer_bg.jpg'); /* 背景画像のパスを指定 */
  background-size: cover;
  background-position: center;
  position: relative;
  padding: 80px;
  margin-top: 180px;
}

.footer-content {
  display: flex;
  justify-content: space-between;
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.footer-column {
  width: 45%;
}

.footer-column h2 {
  font-size: 1.2em;
  margin-bottom: 10px;
  background-color: green;
  text-align: center;
  color: #f9f9f9;
}

.footer-column p {
  line-height: 1.6;
  font-weight: 800;
}

.footer-common {
  text-align: center;
  margin-top: 20px;
  font-weight: 600;
}

.footer-menu {
  text-align: center;
  margin-top: 20px;
}

.footer-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-menu ul li {
  display: inline;
  margin: 0 10px;
  font-weight: 800;
  font-weight: 800;
}

.footer-menu ul li a {
  color: #000;
  text-decoration: none;
  font-size: 0.9em;
}

.footer-menu ul li a:hover {
  text-decoration: underline;
}

.footer-menu-notop{
  margin: auto;
}

.footer-menu-notop ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-menu-notop ul li {
  display: inline;
  margin: 0 10px;
  font-weight: 800;
  font-weight: 800;
}


/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
  .footer-content {
      flex-direction: column;
      text-align: center;
  }

  .footer-column {
      width: 100%;
      margin-bottom: 20px;
  }

  .footer-menu ul li {
      display: block;
      margin: 10px 0;
  }
}




/* ナビゲーションエリア全体 */
.navi-area {
    max-width: 1440px;
    margin: 0 auto; /* 中央寄せ */
    padding: 20px;
    background-color: aliceblue;
    text-align: center; /* タイトルを中央寄せ */
}

.navi-area h2, 
.navi-area h4 {
    text-align: center;
}

/* 左カラム・右カラム */
.navi-area-left,
.navi-area-right {
    display: inline-block; /* 横並びにする */
    width: 49%; /* 2カラム */
    vertical-align: top;
    margin-bottom: 20px;
}



/* バナー */
.navi-banner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* 中央寄せ */
    gap: 20px; /* バナー間の余白 */
}

.navi-banner .banner-item {
    flex: 1 0 calc(33.33% - 20px); /* 3カラム */
    text-align: center;
}

/* PC表示時のスタイル */
@media (min-width: 980px) {
    .navi-area-left .icon,
    .navi-area-right .icon {
        width: calc(33.33% - 20px); /* 3カラム */
    }
}

/* スマホ表示時のスタイル */
@media (max-width: 979px) {
    .navi-area-left,
    .navi-area-right {
        width: 100%; /* 1カラム */
    }

    .navi-banner .banner-item {
        flex: 1 0 calc(50% - 20px); /* 2カラム */
    }
}




.kensho {
	margin-top: 20px;
	margin-left: 50px;
}

.kensho ul {
	list-style: none; /* 標準のリストマーカーを無効化 */
	counter-reset: custom-counter; /* カスタムカウンターをリセット */
	padding-left: 0; /* デフォルトのパディングを削除 */
  }
  
  .kensho  li {
	counter-increment: custom-counter; /* カウンターをインクリメント（ここでは使用しないが、例えば数字を増やす場合に利用） */
	position: relative; /* ::before に relative 位置を適用 */
  }
  
  .kensho li::before {
	content: '一、'; /* リスト項目の前に置く内容 */
	position: absolute; /* 絶対位置指定 */
	left: -40px;
  }



.town-banner{
	display: flex;
	flex-wrap:wrap;
	list-style: none;
	margin: 0 0 1.5em -3em;
}
.town-banner ul{
	list-style: none;
	margin: 0 0 1.5em -3em;
}
.town-banner li {
	width: calc(100%/4);/*←画像を横に4つ並べる場合*/
	padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
	box-sizing:border-box;
}
.town-banner li img {
	max-width: 100%;
	height: auto;
	border-radius: 80px;
	margin-bottom: 5px;
	padding: 0 20px 0 20px;
}

@media (max-width: 763px) {
	.town-banner li {
		width: calc(100%/2);/*←画像を横に4つ並べる場合*/
		padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
		box-sizing:border-box;
	}
}




.organization {
	display: flex;
	justify-content: space-between;
  }
  
  .division {
	flex: 1;
  }
  
  .division:last-child {
	margin-right: 0;
  }
  
  .organization p {
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 10px;
	margin-left: 105px;
  }
  
  .organization h4 {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
	position: relative;
	padding-left: 15px;
  }
  
  .organization　h4::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 12px;
	height: 12px;
	border-left: 2px solid black;
	border-bottom: 2px solid black;
  }
  
  .organization  ul {
	list-style-type: none;
	padding-left: 90px;
	position: relative;
	margin-bottom: 10px;
  }
  
  .organization ul::before {
	content: "";
	position: absolute;
	top: 0;
	left: 75px;
	width: 2px;
	height: 100%;
	background-color: black;
  }
  
  .organization ul:last-child::before {
	height: 50%;
  }
  
  .organization ul li {
	position: relative;
	margin-bottom: 5px;
	margin-left: 25px;
  }
  
  .organization ul li::before {
	content: "";
  position: absolute;
  top: 50%;
  left: -65px;
  transform: translateY(-50%);
  height: 2px;
  background-color: black;
  }
  
  .organization ul ul {
	margin-left: 20px;
	margin-bottom: 0;
  }
  
  .organization ul ul::before {
	content: "";
	position: absolute;
	top: 0;
	left: -15px;
	width: 2px;
	height: 100%;
	background-color: black;
  }
  
  .organization ul ul li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -15px;
	transform: translateY(-50%);
	width: 10px;
	height: 2px;
	background-color: black;
  }

  .museum-announcements-container {
    padding: 20px;
    background-color: #f9f9f9; /* 軽い背景色 */
}

.museum-announcement {
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc; /* 各お知らせを区切る線 */
}

.museum-announcement h5 {
	font-size: 16px;
	
    color: #333; /* タイトルの色 */
}

.museum-announcement div {
    padding: 10px 0;
}

.museum-announcements-container .post-date {
    color: #666;  /* 色 */
    font-size: 0.8rem;  /* フォントサイズ */
    margin-top: -10px;  /* タイトルとの間隔を調整 */
    margin-bottom: 10px;  /* 本文との間隔を調整 */
}




/* 博物館用グラフィカルなボタンスタイル */
.toggle-button {
    background-color: #0073aa;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    margin: 10px 0;
    display: inline-block;
}

.toggle-button:hover {
    background-color: #005177;
}

/* 年ごとのタイトルと内容のスタイル */
.year-title, .early-year-title {
    cursor: pointer;
    color: #0073aa;
    font-size: 18px;
    margin: 10px 0;
}

.year-title:hover, .early-year-title:hover {
    color: #005177;
}

.year-content, .early-year-content {
    margin-top: 10px;
    display: none;
}

/* トグル表示用のスタイル */
.active {
    display: block !important;
}




.museum-info {
    border: 1px solid gray; /* グレーの枠線 */
    padding: 15px; /* 内部の余白 */
    background-color: #f0f0f0; /* 背景色を灰色に設定 */
    font-family: Arial, sans-serif; /* フォントスタイル */
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	max-width: 600px;
}

.museum-info h2 {
    background-color: gray; /* 背景色を暗い灰色に設定 */
    color: white; /* 文字色を白に設定 */
    padding: 10px; /* 内部の余白 */
    font-weight: bold; /* 太文字 */
    margin-top: 0; /* 上のマージンをなくす */
	border-left: 0px;
	background: gray;
	font-size: 20px;

}

.museum-info p {
    margin: 10px 12px; /* 上下のマージン */
    line-height: 1.6; /* 行間 */
}

.museum-info .department strong {
    font-weight: bold; /* 部署名を太文字に */
}

.museum-info .phone a {
    color: black; /* リンクの色を黒に設定 */
    text-decoration: none; /* リンクの下線をなくす */
}

.museum-info .phone a:hover {
    text-decoration: underline; /* ホバー時に下線を表示 */
}


.side-img {
	display: flex;
	justify-content: center;
	align-items: center;
  }
  p.side-txt {
	display: inline-block;
	width: 400px;
	margin-left: 15px;
  }


  .item-container {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.item-image img {
    width: 180px; /* 画像のサイズ調整 */
	max-width: 180px;
    height: auto;
    margin-right: 10px;
}

.item-description {
    flex-grow: 1;
}

.item-description h2 {
    font-size: 20px;
    margin-bottom: 10px;
}

.item-description h4 {
    margin: 0 auto 10px;
}

.item-description ul {
    list-style: none; /* 通常のリストスタイルを解除 */
    padding: 0;
	margin: 0 0 1.5em 1em;
}

.item-description li {
    margin-bottom: 5px;
	text-align: left;
}


/* TOPページ用のスタイル */
body.home .entry-header,
body.home .breadcrumb {
  display: none;
}
body.home .page-display{
	max-width: 100%;
}


body.home.breadcrumb{display: none;}
  
  /* その他のページ用のスタイル */
body.page {
	margin: auto auto -33px auto;
	font-weight: 400 !important;
	font-family: "BIZ UDPGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  }



  .tab1 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab1__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab1__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #005885;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }

  .tab1__link a{
    color: #fff;
  }
  .tab1__link.on {
    background-color: #f8f8f8;
  }
  .tab1-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab1-body__item.on {
    display: block;
  }



  .tab2 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab2__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab2__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #76b5d6;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab2__link a{
    color: #fff;
  }
  .tab2__link.on {
    background-color: #ffffff;
  }
  .tab2-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab2-body__item.on {
    display: block;
  }



  .tab3 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab3__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab3__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #4da044;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab3__link a{
    color: #fff;
  }
  .tab3__link.on {
    background-color: #ffffff;
  }
  .tab3-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab3-body__item.on {
    display: block;
  }



  .tab4 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab4__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab4__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #bac636;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab4__link a{
    color: #fff;
  }
  .tab4__link.on {
    background-color: #ffffff;
  }
  .tab4-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab4-body__item.on {
    display: block;
  }





  .tab5 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab5__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab5__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #e5bd18;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab5__link a{
    color: #fff;
  }
  .tab5__link.on {
    background-color: #ffffff;
  }
  .tab5-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab5-body__item.on {
    display: block;
  }



  .tab6 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab6__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab6__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #e38929;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab6__link a{
    color: #fff;
  }
  .tab6__link.on {
    background-color: #ffffff;
  }
  .tab6-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab6-body__item.on {
    display: block;
  }



  .tab7 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab7__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab7__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #cd231d;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab7__link a{
    color: #fff;
  }
  .tab7__link.on {
    background-color: #ffffff;
  }
  .tab7-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab7-body__item.on {
    display: block;
  }




  .tab8 {
    display: flex;
    flex-direction: row;
    text-align: center;
    background-color: #fff !important;
    margin: 0 !important;
  }
  .tab8__item {
    flex: 1;
    flex-basis: 120px;
  }
  .tab8__link {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #85225f;
    cursor: pointer;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  .tab8__link a{
    color: #fff;
  }
  .tab8__link.on {
    background-color: #ffffff;
  }
  .tab8-body__item {
    margin: 30px 15px;
    display: none;
    text-align: center;
  }
  .tab8-body__item.on {
    display: block;
  }

  .w800-100vw{
	width: 100%;
	background-color: oldlace;
	margin-top: -50px;
	padding-top: 100px;
  }

  .w800{
	max-width: 960px;
	margin:  auto;

  }

  .furusato{
	margin: auto;
  }

  .furusato img{
	width: 430px;

	  }

@media (max-width: 960px) {
	.furusato img{
		width: 100%;
	  
}
}



.rishiri-vaccination {
	font-family: 'Helvetica Neue', Arial, sans-serif;
	line-height: 1.6;
	color: #333;
	margin: 0 auto;
	padding-top: 20px;
	margin-top: -10px;
	padding-left: 20px;
}
.rishiri-vaccination h2 {
	background-color: #e6f2ff;
	color: #0056b3;
	padding: 10px;
	margin-bottom: -20px;
	border-radius: 5px;
	font-size: 18px;
}
.rishiri-vaccination h3 {
	margin-top: 30px;
	margin-bottom: 10px;
}
.rishiri-vaccination .health-child-flex {
	display: flex;
	flex-wrap: wrap;
	border: 1px solid #ddd;
	margin-bottom: 10px;
}
.rishiri-vaccination .health-child-archive1 {
	flex: 1 0 40px;
	background-color: #f0f0f0;
	padding: 10px;
	font-weight: bold;
}
.rishiri-vaccination .health-child-archive2 {
	flex: 2 1 400px;
	padding: 10px;
}
@media screen and (max-width: 600px) {
	.rishiri-vaccination .health-child-archive1,
	.rishiri-vaccination .health-child-archive2 {
		flex: 1 1 100%;
	}
}




.marg20{
	margin: auto;
	padding: 20px;
} 

  .max-360{
	max-width: 360px;
	}

	.max-360 img{
		max-width: 360px;
		padding-right: 10px;
	}

  @media (max-width: 763px) {
	.tab1 {
		display: none;
	}

	.max-360 img{
		padding-right: 0px;
	}


	.in-style{
		max-width: 100%;
	padding: 0%;}

	body.home #content, 
	body.front-page #content {
		margin-top: 160px;
	  }
}


.postrule ul{
	margin: 0 0 1.5em 0em;
}

.img-center{
	margin: auto;
  text-align: center;
  padding-top: 80px;
  display: block;
}

.gym h2{
	margin-top:50px;
}

.gym p{
  margin: top 10px;
  margin-left: 15px;
  margin-bottom: -10px;
}

.ski-info{
	text-align:center;
	color:red;
	font-size:18px;
	font-weight:bold;
}

/* flex-schedul */
.flex-schedule {
	list-style: none;
	margin: 0 auto 0 0;
	box-sizing: border-box;
  }
  
  .flex-schedule li {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: flex-start;
	position: relative;
  
  }
  
  .flex-schedule .area {
	padding: 10px;
	display: block;
	width: 100%;
	border-left: 6px solid #ff0093;
  }
  
  .flex-schedule li .time {
	display: inline-flex;
	justify-content: flex-end;
	flex-basis: 5em;
	max-width: 5em;
	margin-right: 1em;
	margin-top: 30px;
  }
  
  .flex-schedule .sch_box {
	position: relative;
	min-height: 1em;
	padding: 1em;
	background: #ffd9e0;
	border-radius: 6px;
  }
  
  .flex-schedule .sch_box::before {
	content: "";
	position: absolute;
	left: -23px;
	top: 20px;
	background: #ff0093;
	width: 20px;
	height: 20px;
	border-radius: 10px;
  }
  
  .flex-schedule .sch_title {
	font-weight: 700;
  }
  
  .flex-schedule .sch_tx {
	font-size: 14px;
	font-weight: 400 !important;
  }

  .excluded-facilities {
    border: 1px solid #ccc; /* 灰色の枠線 */
    background-color: #f5f5f5; /* うっすら灰色の背景 */
    padding: 15px; /* 内部の余白 */
    margin: 20px 0; /* 外側の余白 */
}

.excluded-facilities p {
    margin: 0 0 10px; /* 段落の下の余白 */
}

.excluded-facilities ul {
    list-style-type: none; /* リストマーカーを無効化 */
    padding: 0; /* リストのパディングをゼロに */
}

.excluded-facilities li {
    margin-bottom: 5px; /* リスト項目の下の余白 */
}



/* style.cssに追加 */

.flex-item-tohkei {
    text-align: center;
	margin-top: 20px;
}

.stats-container {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    text-align: center;
    margin: auto;
}

.stat {
    display: flex;
    align-items: center;
    gap: 5px; /* アイコンとテキスト間のスペース */
}

.stat img {
    width: 24px; /* アイコンのサイズ調整 */
    height: auto;
}

.achievement {
    margin-top: 20px; /* 交通事故死ゼロのセクションの上部マージン */
}

#accidentFree {
    display: flex;
    align-items: center;
	font-size: 20px;
}

.achievement {
	font-size: 24px;
  background-color: #e24329;
  color: #fff;
  border-radius: 8px;
  margin-top: 20px;
  width: 360px;
  margin: auto;
  text-align: center !important;
}


/* お知らせ部分カスタムカテゴリスタイル */
/* カスタムカテゴリスタイル */
.category-announcement {
    background-color: #dc3545; /* 赤色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-event {
    background-color: #007bff; /* 青色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-general-affairs {
    background-color: #28a745; /* 緑色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-recruit {
    background-color: #ffc107; /* 黄色 */
    color: #000000;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-education {
    background-color: #17a2b8; /* 水色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-agriculture {
    background-color: #6f42c1; /* 紫色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-rishiriinfo {
    background-color: #e83e8c; /* ピンク色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-rearing {
    background-color: #fd7e14; /* オレンジ色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-bid {
    background-color: #343a40; /* 灰色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-5 {
    background-color: #20c997; /* 薄緑色 */
    color: #ffffff;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}

.category-default {
    background-color: #8bef00; /* デフォルトの灰色 */
    color: #000000;
    padding: 5px 10px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 10px;
}




a img {
	transition: filter 0.3s ease;
  }
  
  a img:hover {
	filter: brightness(50%);
  }






  .flex-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
  }
  

  

  .rishiri-live{
	position: relative;
  }
  
  .rishiri-live dt {
	font-weight: bold;
	color: white;
	margin-top: 24px;
	margin-bottom: -12px;
	text-align: center;
  }

  

  .rishiri-live dd {
	margin: 0;
  }
  
  .rishiri-live img {
	max-width: 100%;
	height: auto;
  }


  .header-naviarea{
	background-color: rgba(255, 255, 255, 0.5);
	color: #fff;
	margin: 160px auto;
	padding: 30px;
	max-width: 320px;
  }

  @media (max-width: 900px) {
	.header-naviarea{
		margin: 0px auto;
    }
  }	

  .header-naviarea h3{
	color: #fff;
	margin: auto;
	padding: 0.5em;
  display: block;
  line-height: 1.3;
  background: none;
  border-radius: 25px 0px 0px 25px;
  }

  .header-naviarea h3::before {
	content: none;

  }

  .header-naviarea p{
	color: #fff;
	margin: auto;
  }

  .slider {
	width: 100%;
	overflow: hidden;
	position: relative;
  }
  
  .slider-wrapper {
	display: flex;
	transition: transform 0.5s ease;
  }
  



  ul.shadow_hover {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
  }
  ul.shadow_hover li {
	flex: 0 0 31%;
	margin: 5px;
	background-color: #0d59b6;
	color: white;
	text-align: center;
	padding: 0px;
	border-radius: 10px;
	width: 240px;
	transition: box-shadow 0.5s;
  }

  ul.shadow_hover_access {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
  }
  ul.shadow_hover_access li {
	flex: 0 0 31%;
	margin: 5px;
	background-color: #ffffff;
	color: white;
	text-align: center;
	padding: 0px;
	border-radius: 10px;
	transition: box-shadow 0.5s;
  }
  @media (max-width: 960px) {
	ul.shadow_hover li {
	  flex: 2 1 48%;
	}
  }
  @media (max-width: 480px) {
	ul.shadow_hover li {
	  flex: 2 0 45%;
	}
  }
  ul.shadow_hover li a {
	color: white;
	text-decoration: none;
	display: block;
  }
  ul.shadow_hover li:hover {
	box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.25);
  }
  .icon {
	width: 50px;
	height: 50px;
	margin-bottom: 10px;
  }


.access-container{
	margin: auto;
}

.gaiyoimg{
	margin-bottom: 40px;
}

.machihana img {
	padding: 20px;
}

.machihana p {
	text-align: center;
	font-weight: 800;
}

.machiyurai p {
	text-align: left;
	font-weight: 600;
}

.shimajiman li{
	margin-top: 20px;
}

.museum ul{
	margin: 20px 1em 1.5em 0em;
}

.museum li{
	margin-top: 20px;
}

.access-section{
	max-width: 980px;
  margin: auto;
  text-align: center;
}





/*追加要望対応*/  
  .menu-item {
	position: relative;
	flex: 1;
	text-align: center;
	margin: -45px 5px; /* アイコン間のスペースを調整 */
  }
  

  .submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #fff;
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    z-index: 1;
    width: 600px;
    text-align: left;
    padding: 10px;
}

.submenu a:hover {
    background-color: #f1f1f1;
}

.menu-item:hover .submenu,
.menu-item:focus-within .submenu {
    display: block;
	overflow:hidden; 
}

.menu-item img{
	transition:1s all;
   }

.menu-item img:hover{
transform:scale(1.2,1.2);
transition:1s all;
}

.submenu:hover,
.submenu:focus-within {
    display: block;
}

  .submenu ul {
	list-style: none;
	padding: 0;
	margin: 0;
  }
  
  .submenu li {
	display: inline-block;
	width: 45%; /* 2項目ごとに改行するために45% */
	padding: 10px;
	box-sizing: border-box;
  }
  
  .submenu li a {
	text-decoration: none;
	color: #333;
	display: block;
  }
  
  .submenu li a:hover {
	background-color: #f1f1f1;
  }
  
  .menu-item:hover .submenu {
	display: block;
  }
  

  .submenu.town-intro { border: 2px solid darkblue; }
  .submenu.tourism-events { border: 2px solid lightblue; }
  .submenu.living-procedures { border: 2px solid green; }
  .submenu.childcare-welfare { border: 2px solid yellowgreen; }
  .submenu.education { border: 2px solid darkgoldenrod; }
  .submenu.disaster-weather { border: 2px solid orange; }
  .submenu.town-council { border: 2px solid red; }
  


  /*119番*/

.dialog {
    margin-top: 10px;
}

.dialog p {
    margin: 5px 0;
}

.note, .mobile-note {
    margin-top: 20px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #f9f9f9;
}

.note p, .mobile-note p {
    margin: 5px 0;
}

@media (max-width: 768px) {
    .column-container {
        flex-direction: column;
    }
}


.fire-departure-info {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    border-radius: 8px;
}

.fire-departure-info h2, .fire-departure-info h3 {
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    margin-bottom: 10px;
}

.fire-departure-info ul {
    list-style: none;
    padding: 0;
}

.fire-departure-info li {
    padding: 5px 0;
    border-bottom: 1px solid #eee;
}

.fire-departure-info p {
    margin: 5px 0;
}

.fire-departure-info table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

.fire-departure-info table th, .fire-departure-info table td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}

a.btn_05 {
	display: block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 320px;
	margin: auto;
	padding: 1rem 4rem;
	font-weight: bold;
	border-radius: 0.3rem;
	border-bottom: 7px solid #0686b2;
	background: #27acd9;
	color: #fff;
}
a.btn_05:hover {
	margin-top: 6px;
	border-bottom: 1px solid #0686b2;
	color: #fff;
}

.firecopy{
	color: red;
	font-size: 2rem;
}

.fire h2{
	color: #f9f9f9;
	background: none;
	background-color: #b22606;
}

.fire h3{
	color: #f9f9f9;
	background: none;
	background-color: #b22606;
}

.fire h4{
	margin: 7px;
	font-size: 1.2rem;
}

.fire h5{
	color: crimson;
	font-size: 1.3rem;
	text-align: center;
}

.fire-car{
	display: flex;
   }
.fire-contentA,.fire-contentB{
	width: 50%;
   }

.fire-table {
border-collapse: collapse;
width: 100%;
margin-left: 10px;
color:black;
flex-direction: column;
}
.fire-table th, .fire-table td {
border-bottom: 2px solid #2d2e2e;
padding: 1em;
}
.fire-table th {
border-bottom: 2px solid #2d2e2e;;
font-weight: bold;
text-align: center;
width: 35%;
min-width: 4em;
}   

@media (max-width: 768px) {
    .fire-car {
        flex-direction: column;
        align-items: center;
    }

    .fire-contentA,
    .fire-contentB {
        width: 100%;
        padding: 5px;
    }

    .fire-contentA img {
        max-width: 100%;
        height: auto;
    }
}


.fire-slogan {
    margin: 20px 0;
    text-align: center;
}

.fire-projects {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.fire-project {
    width: calc(25% - 20px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    padding: 10px;
    background-color: #fff;
    text-align: center;
}

.project-thumbnail img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 768px) {
    .fire-project {
        width: calc(50% - 20px);
    }
}

.fire-project-detail {
    max-width: 800px;
    margin: 120px auto;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    overflow: hidden; /* 追加: コンテンツが枠内に収まるようにする */
}

.fire-project-detail h1 {
    text-align: center;
    font-size: 24px;
    margin-bottom: 20px;
}

.project-thumbnail {
    text-align: center;
    margin-bottom: 20px;
}

.project-thumbnail img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto; /* 中央に配置 */
}

.project-content {
    margin-bottom: 20px;
    word-wrap: break-word;
}

.project-content p{
	margin-left: 60px;
}

.project-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 10px 25px;
}

.back-button {
    display: inline-block;
    margin: 20px auto 0; /* 上に余白を追加し、中央に配置 */
    padding: 10px 20px;
    background-color: #0073aa;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
}

.back-button:hover {
    background-color: #005f8a;
}




/* 島自慢カレンダー*/
.calendar-list {
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

.calendar-item {
    margin-bottom: 20px;
    padding: 10px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.calendar-item h3 {
    margin-top: 0;
    font-size: 18px;
}

.calendar-item a {
    display: inline-block;
    margin-top: 10px;
    padding: 5px 10px;
    background-color: #0073aa;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
}

.calendar-item a:hover {
    background-color: #005f8a;
}


/*博物館*/

.museum-archive h3{
	background: none;
  margin: 0px;
}


.museum-archive-flex{
  display: flex;
  flex-wrap: wrap;
  border: 2px;
  border-style: groove;
  padding: 20px;
  margin: 20px;
	}

.museum-archive img{
		margin-left:20px;
	}

.museum-archive p{
	margin: 0;
}

.museum-archive1{
	flex: 1 1 160px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
	}
.museum-archive2{
	flex: 1 2 440px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
  margin-top: 0PX;;
}

.museum-archive1 h4{
  margin: 0PX;
}



.museum-shop-flex{
	display: flex;
	}

.museum-archive img{
	max-width: 200px;
}

.museum-archive p{
	font-size: 18px;
	margin: 0;
}

.museum-shop-archive1{
	width: 70%;
	height: 100px;
	display: table;
	font-size: 1rem;
	margin: 9px 20px 100px 20px;
}
	
.museum-shop-archive2{
width: 30%;
height: 100px;
}	

.museum-nature h2{
  margin-top: 20px;
  margin-bottom: 20px;
}

.museum-nature-flex{
	display: flex;
    flex-wrap: wrap; /* 画面幅が狭い場合に折り返しを許可 */
	}

.museum-nature img{
	max-width: 100%;
}

.museum-nature p{
	margin: 0;
}

.museum-nature-archive1{
    flex: 2 1 400px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
}
	
.museum-nature-archive2{
    flex: 1 1 200px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
    padding: 10px;
  }	

.museum-nature-archive2 img{
	width: 100%;

	}	

.museum-nature-archive2 p{
	max-width: 210px;
	margin-left: 35px;
	}	

.bunken-li ul, .bunken-li li{
	list-style: square;
	margin: 0px;
}	

@media screen and (max-width: 768px) {
    .museum-nature-archive1,
    .museum-nature-archive2 {
        flex: 1 1 100%; /* 画面幅が狭い場合はどちらも100%幅に */
    }

}




.museum-research-flex{
	display: flex;
    flex-wrap: wrap; /* 画面幅が狭い場合に折り返しを許可 */
	}

.museum-research img{
	max-width: 200px;
}

.museum-research p{
	font-size: 1rem;
	margin: 0;
}

.museum-research-archive1{
    flex: 2 1 400px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
    margin: 1rem;
}
	
.museum-research-archive2{
    flex: 1 1 200px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
    margin: 1rem;
	}	

.museum-research-archive2 img{
	margin-left: 30px;

	}	

.museum-research-archive2 p{
	font-size: 0.8rem;
	margin: auto;
	text-align: center;
	}		

.ulsquar ul{
	list-style: square;
}

@media (max-width: 768px) {
	.museum-research-archive1{
		width: 100%;
		height: 100px;
		display: table;
		font-size: 1rem;
		margin: 10px 20px 100px 20px;
	}

	.museum-research-archive2{
		width: 100%;
		height: 100px;
		display: table;
		font-size: 1rem;
		margin: 10px 20px 100px 20px;
	}
}


.museum-history-flex {
    display: flex;
    flex-wrap: wrap; /* 画面幅が狭い場合に折り返しを許可 */
}
.museum-history img{
	margin-top: 10px;
	width: 100%;
}

.museum-history-flex h4{
	margin-top:-10px;
	margin-bottom: 5px;
}

.museum-history-flex ul{
	margin-left: -1.5rem;
}

.museum-history p{
	font-size: 1rem;
	margin: 0;
}

.museum-history	ul{
	list-style: square;
}


.museum-history-archive1 {
    flex: 2 1 400px; /* 初期幅400px、2倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
    margin: 1rem;
}

.museum-history-archive2 {
    flex: 1 1 200px; /* 初期幅200px、1倍の比率で伸縮、最小幅は自身のコンテンツ幅 */
    margin: 1rem;
}

.museum-history-archive2 p {
    max-width: 100%; /* 親要素の幅を超えないように */
}

@media screen and (max-width: 768px) {
    .museum-history-archive1,
    .museum-history-archive2 {
        flex: 1 1 100%; /* 画面幅が狭い場合はどちらも100%幅に */
    }

}




em {
	font-family: 'Hiragino Kaku Gothic ProN';
	font-style: italic;
	font-family: "Times New Roman", Georgia, serif;
	font-weight: 600;
	}	


/*避難所*/	
.blame {
	max-width: 920px;
	margin: auto;
}
.blame table{
	width: 100%;
	border-collapse:separate;
	border-spacing: 0;
  }
  
.blame  table th:first-child{
	border-radius: 5px 0 0 0;
  }
  
.blame  table th:last-child{
	border-radius: 0 5px 0 0;
	border-right: 1px solid #3c6690;
  }
  
.blame  table th{
	text-align: center;
	color:white;
	background: linear-gradient(#829ebc,#225588);
	border-left: 1px solid #3c6690;
	border-top: 1px solid #3c6690;
	border-bottom: 1px solid #3c6690;
	box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
	width: 25%;
	padding: 10px 0;
  }
  
.blame table td{
	text-align: center;
	border-left: 1px solid #a8b7c5;
	border-bottom: 1px solid #a8b7c5;
	border-top:none;
	box-shadow: 0px -3px 5px 1px #eee inset;
	width: 25%;
	padding: 10px 0;
  }
  
.blame table td:last-child{
	border-right: 1px solid #a8b7c5;
  }
  
.blame  table tr:last-child td:first-child {
	border-radius: 0 0 0 5px;
  }
  
.blame table tr:last-child td:last-child {
	border-radius: 0 0 5px 0;
  }







/*議会*/


.gikai {
	max-width: 100%;
	margin: auto;
}

.gikai-h2 {
	background: none;
	padding: 0;
	font-size: 26px;
	text-align: justify;
	text-justify: inter-ideograph;
	margin-bottom: -20px;
  }
  
  .gikai-h2:after {
	content: "";
	display: inline-block;
	width: 100%;
  }
  
  .gikai-h2 span {
	display: inline;
  }

.gikai h2::before{
	content: none;
}

.gikai-li p{
  margin-left: 30px;
  margin-bottom: 0px;
  margin-top: 0px;
}

.gikai-li {
  list-style-type: none;
  padding-left: 0;
}
.gikai-li li {
  margin-bottom: 1em;
}
.gikai-li li strong {
  display: block;
  margin-bottom: -15px;
}
.gikai-li li strong::before {
  content: "◇";
  margin-right: 0.5em;
  text-align: center;
}

.gikai-inline{
  margin: 20px;
}

.gikai-sub-li{
    margin-top: -15px;
    margin-left: 60px;
    list-style-type: disc;
}

.gikai-sub-li2{
  margin-top: -25px;
  margin-left: 60px;
  margin-bottom: 10px;
  list-style-type: disc;
}

.gikai-sub-li3{
  margin-top: -25px;
  margin-left: 60px;
  margin-bottom: 20px;
  list-style-type: none;
}

.gikai-li-p{
  margin-top: -15px;
}

.backblue{
	color: white;
	background-color: #21759b;
	padding: 10px;
	margin: 20px 0 -20px 20px ;
}

.gikai table{
	width: 100%;
	border-collapse:separate;
	border-spacing: 0;
  }
  
.gikai  table th:first-child{
	border-radius: 5px 0 0 0;
  }
  
.gikai  table th:last-child{
	border-radius: 0 5px 0 0;
	border-right: 1px solid #3c6690;
  }
  
.gikai  table th{
	text-align: center;
	color:white;
	background: linear-gradient(#829ebc,#225588);
	border-left: 1px solid #3c6690;
	border-top: 1px solid #3c6690;
	border-bottom: 1px solid #3c6690;
	box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
	width: 25%;
	padding: 10px 0;
  }
  
.gikai table td{
	text-align: center;
	border-left: 1px solid #a8b7c5;
	border-bottom: 1px solid #a8b7c5;
	border-top:none;
	box-shadow: 0px -3px 5px 1px #eee inset;
	width: 25%;
	padding: 10px 0;
  }
  
.gikai table td:last-child{
	border-right: 1px solid #a8b7c5;
  }
  
.gikai  table tr:last-child td:first-child {
	border-radius: 0 0 0 5px;
  }
  
.gikai table tr:last-child td:last-child {
	border-radius: 0 0 5px 0;
  }

.gikai h4{
	margin-left: 30px;
} 

.gikai h5{
	margin-left: 30px;
	margin-bottom: 0px;
} 

.gikai img{
	margin: 0;
	width: 100%;
}

.container-gikai {
	display: flex;
	flex-wrap: wrap;
  }
  
  .flexgikai {
	padding: 0.2em;
	flex-basis: 50%;
  }
  

/*防災*/
.bousai-top h2{
	padding: 20px;
	background-color: black;
	color: red;
	font-size: 26px;;
	background-image: none;
}

.bousai-top h2::before{
	content: none;
}



/*公営住宅*/
.public-housing-page {
	font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
	line-height: 1.6;
	color: #333;
	background-color: #f5f5f5;
	margin: 0;
	padding: 20px;
  }
  
  .public-housing-container {
	max-width: 1000px;
	margin: 0 auto;
	background-color: #ffffff;
	padding: 30px;
	border-radius: 8px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  }
  
  .public-housing-date {
	text-align: right;
	font-style: italic;
	font-family: "Times New Roman", Georgia, serif;
	color: #666;
	margin-bottom: 20px;
  }
  
  .public-housing-heading {
	color: #1a5f7a;
	border-bottom: 2px solid #1a5f7a;
	padding-bottom: 10px;
	margin-top: 30px;
  }
  
  .public-housing-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin-bottom: 30px;
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
  }
  
  .public-housing-table th,
  .public-housing-table td {
	border: 1px solid #e0e0e0;
	padding: 12px 15px;
	text-align: left;
  }
  
  .public-housing-table th {
	background-color: #e6f3ff;
	font-weight: bold;
	text-transform: uppercase;
  text-align: center;
  }
  
  .public-housing-table th:nth-child(1),
  .public-housing-table td:nth-child(1) {
	width: 18%;
  }
  
  .public-housing-table th:nth-child(2),
  .public-housing-table td:nth-child(2) {
	width: 35%;
  }
  
  .public-housing-table th:nth-child(3),
  .public-housing-table td:nth-child(3) {
	width: 22%;
  }
  
  .public-housing-table th:nth-child(4),
  .public-housing-table td:nth-child(4) {
	width: 26%;
  }
  
  .public-housing-table tr:nth-child(even) {
	background-color: #f9f9f9;
  }
  
  .public-housing-table tr:hover {
	background-color: #f0f8ff;
  }
  
  .public-housing-emphasis {
	color: #1a5f7a;
	font-weight: bold;
	border-bottom: 2px dotted #1a5f7a;
	display: inline-block;
	margin-bottom: 10px;
  }
  
  .public-housing-hr {
	border: 0;
	height: 1px;
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
	margin: 20px 0;
  }
  
  @media (max-width: 768px) {
	.public-housing-table,
	.public-housing-table thead,
	.public-housing-table tbody,
	.public-housing-table th,
	.public-housing-table td,
	.public-housing-table tr {
	  display: block;
	  width: 100% !important;
	}
  
	.public-housing-table thead tr {
	  position: absolute;
	  top: -9999px;
	  left: -9999px;
	}
  
	.public-housing-table tr {
	  margin-bottom: 20px;
	  border: 1px solid #ccc;
	  border-radius: 5px;
	  overflow: hidden;
	}
  
	.public-housing-table td {
	  border: none;
	  border-bottom: 1px solid #eee;
	  position: relative;
	  padding-left: 50%;
	}
  
	.public-housing-table td:last-child {
	  border-bottom: none;
	}
  
	.public-housing-table td:before {
	  content: attr(data-label);
	  position: absolute;
	  top: 6px;
	  left: 6px;
	  width: 45%;
	  padding-right: 10px;
	  white-space: nowrap;
	  font-weight: bold;
	}
  }

/*町長の部屋*/
.policy-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.policy-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.policy-icon {
    margin-right: 10px;
}
@media (max-width: 768px) {
    .policy-container {
        display: block;
    }
}


.welfare-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
  font-family: 'Helvetica Neue', Arial, sans-serif;
}
.welfare-content {
  display: flex;
  align-items: flex-start;
  margin-bottom: 30px;
}
.welfare-image {
  flex: 0 0 200px;
  margin-right: 20px;
}
.welfare-image img {
  max-width: 100%;
  height: auto;
}
.welfare-text {
  flex: 1;
}
.welfare-point {
  margin-bottom: 20px;
}
.welfare-point::before {
  content: "●";
  color: #F4A460;
  margin-right: 10px;
}
.welfare-title {
  font-size: 24px;
  color: #4A4A4A;
  margin-bottom: 20px;
}
@media (max-width: 600px) {
  .welfare-content {
      flex-direction: column;
  }
  .welfare-image {
      margin-right: 0;
      margin-bottom: 20px;
      width: 100%;
  }
}


.koseki-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 20px;
  }
  
  .koseki-table th, .koseki-table td {
	border: 1px solid black;
	padding: 10px;
  }
  
  .koseki-table th {
	width: 30%;
	text-align: left;
	font-weight: 400 !important;
  }
  
  .koseki-text {
	color: rgb(54, 54, 54);
  }
  
  .koseki-text ul{
	list-style: disc;
	margin: 0px;
  }

  .koseki-text li{
	margin: 0 0 15px 0;
  }



.koseki-text h3 {
	margin: 10px 0 5px;
	font-size: 1em;
	font-weight: 400 !important;
  }
  
  .koseki-text h3::before {
	content: "■ ";
  }

.shakai-fukushi{
	display: flex;
}

.shakai-fukushi-left{
	width: 70%;
}

.shakai-fukushi-right{
	width: 30%;
}






.fukushi-icon-text {
    display: flex;
    align-items: center;
	margin-left: 20px;
}

.fukushi-icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.fukushi-text {
    font-size: 18px;
	font-weight: 800;
	margin-bottom: -15px;
}

.fukushi-ttl{
	font-weight: 800;
  margin-bottom: 0px !important;
	margin-bottom: -15px;
}

.fukushi-inside{
	font-weight: 800;
  margin-left: 20px;
	margin-bottom: -15px;
}



.fukushi-table table{
	width: 100%;
}

.fukushi-table table, .fukushi-table th, .fukushi-table td {
	border: 1px solid black;
	border-collapse: collapse;
	padding: 20px;
  }

  .back-green{
	background-color: #28a745;
  }

  .back-lightgreen{
	background-color: #9ecea9;
  }

  .flow-chart {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-box {
    background-color: #c8e6c9;
    border: 2px solid #4caf50;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 20px;
    width: 80%;
    position: relative;
}

.step-box p {
    margin: 0;
    font-weight: bold;
}

.arrow {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #4caf50;
    margin-bottom: 20px;
}

.note {
    background-color: #fff;
    border: 1px solid #4caf50;
    border-radius: 5px;
    padding: 10px;
    margin-top: 10px;
    font-size: 0.9em;
}

.orange-box {
    background-color: #ffefa1;
    border: 2px solid #ffc403;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 20px;
    width: 80%;
    position: relative;
	margin: 0px auto 20px;
}

.fire-project h3{
	background-color: #a62424;
}
/* 高齢者介護住宅 */
/* 高齢者介護住宅 */
.fee-table, .fee-table-wide {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
  font-size: 14px;
}

.fee-table th, .fee-table td,
.fee-table-wide th, .fee-table-wide td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: left;
}

.fee-table th, .fee-table-wide th {
  background-color: #f2f2f2;
  font-weight: bold;
}

.fee-table .highlight {
  background-color: #ffe6e6;
}

.mobile-only {
  display: none;
}

/* PC表示時のカラム幅調整 */
@media screen and (min-width: 769px) {
  .fee-table-wide col.col-description { width: 40%; }
  .fee-table-wide col.col-fee { width: 20%; }
}

@media screen and (max-width: 768px) {
  .fee-table, .fee-table-wide {
    font-size: 13px;
  }
  
  .fee-table th, .fee-table td,
  .fee-table-wide th, .fee-table-wide td {
    padding: 8px 4px;
  }
}


@media screen and (max-width: 600px) {
  .desktop-only {
    display: none;
  }
  
  .mobile-only {
    display: block;
  }
  
  .fee-table, .fee-table-wide {
    border: none;
    font-size: 12px;
  }
  
  .fee-table thead, .fee-table-wide thead {
    display: none;
  }
  
  .fee-table tr, .fee-table-wide tr {
    margin-bottom: 20px;
    display: block;
    border: 1px solid #ddd;
    background-color: #fff;
  }
  
  .fee-table tr:nth-child(even), .fee-table-wide tr:nth-child(even) {
    background-color: #f8f8f8;
  }
  
  .fee-table td, .fee-table-wide td {
    display: block;
    text-align: left;
    border-bottom: 1px dotted #ddd;
    position: relative;
    padding: 10px;
    padding-left: 50%;
    min-height: 30px;
    word-break: break-word;
  }
  
  .fee-table td:last-child, .fee-table-wide td:last-child {
    border-bottom: none;
  }
  
  .fee-table td::before, .fee-table-wide td::before {
    content: attr(data-label);
    position: absolute;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: normal;
    font-weight: bold;
    text-align: left;
  }
  
  .fee-table-section {
    margin-top: 30px;
    margin-bottom: 15px;
    font-size: 16px;
    color: #333;
    border-bottom: 2px solid #333;
    padding-bottom: 5px;
  }
  
  .fee-table-subsection {
    background-color: #e6e6e6;
    padding: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 480px) {
  .fee-table, .fee-table-wide {
    font-size: 11px;
  }
  
  .fee-table td, .fee-table-wide td {
    padding: 6px 2px 6px 45%;
  }
  
  .fee-table td::before, .fee-table-wide td::before {
    width: 40%;
    font-size: 10px;
  }
}

.town-subtitle{
  font-size: 16px;
  font-weight: 800;
  margin-left: 16px;
}

.town-subtitle-inside{
  font-size: 16px;
  font-weight: 800;
  margin-left: 45px;
}

.town-subtitle-inside ul{
  font-size: 16px;
  font-weight: 800;
  margin-left: 65px;
  margin-top: -24px;
}

.town-text{
	font-size: 18px;
	font-weight: 300;
	margin-left: 25px;
}


.certificate-table {
  width: 100%;
  max-width: 820px;
  margin: 20px auto;
  border-collapse: collapse;
  font-size: 16px;
}

.certificate-table th,
.certificate-table td {
  border: 1px solid black;
  padding: 10px;
  text-align: left;
}

.certificate-table thead th {
  background-color: #f2f2f2;
  text-align: center;
  font-size: 1.2em;
  padding: 15px;
}

.certificate-table tbody th {
  background-color: #f2f2f2;
  font-weight: bold;
}

.certificate-table td:nth-child(1) {
  width: 35%;
}

.certificate-table td:nth-child(2) {
  width: 20%;
}

.certificate-table td:nth-child(3) {
  width: 45%;
}

.li-circle {
  padding-left: 20px;
  margin: 0;
}

.li-circle-dot {
  padding-left: 20px;
  margin: 0;
}


.li-circle-inside {
  padding-left: 120px;
  padding-top:0px;
  margin: 0;
}


.li-circle li {
  margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
  .certificate-table {
    font-size: 14px;
  }
  
  .certificate-table th,
  .certificate-table td {
    padding: 8px;
  }
}

@media screen and (max-width: 480px) {
  .certificate-table {
    font-size: 12px;
  }
  
  .certificate-table thead {
    display: none;
  }
  
  .certificate-table tbody th {
    display: block;
    width: 100%;
    text-align: center;
  }
  
  .certificate-table tr {
    display: block;
    margin-bottom: 10px;
    border: 1px solid #ddd;
  }
  
  .certificate-table td {
    display: block;
    text-align: right;
    border: none;
    position: relative;
    padding-left: 50%;
    width: 100% !important;
  }
  
  .certificate-table td:before {
    content: attr(data-label);
    position: absolute;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    text-align: left;
    font-weight: bold;
  }
}
  

  /* 子育て用のスタイル */
.kosodate h2{
	
	font-weight: 800;
	margin-bottom: 0px;
}

.kosodate ol{
	
	font-weight: 800;
	margin-left: 0px;
}

.kosodate-table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 20px; 
  }
  
  .kosodate-table th, .kosodate-table td {
	border: 1px solid #ccc; 
	padding: 10px; 
	text-align: left;
  }
  
  .kosodate-table th {
	background-color: #f2f2f2; 
  }
  
  /* 偶数行の背景色を変更 */
  .kosodate-table tr:nth-child(even) {
	background-color: #f9f9f9;
  }


          .rishiri-support-center {
            font-family: 'Helvetica Neue', Arial, sans-serif;
            line-height: 1.6;
            color: #333;
            max-width: 960px;
            margin: 0 auto;
            padding: 20px;
            background-color: #f9f9f9;
        }
        .rishiri-support-center h2 {
            background-color: #3a6ea5;
            color: white;
            padding: 15px;
            border-radius: 5px;
            margin-bottom: 20px;
        }

        .rishiri-support-center .info-block {
            background-color: #ffffff;
            border: 1px solid #e0e0e0;
            padding: 20px;
            margin-bottom: 20px;
            border-radius: 5px;
        }
        .rishiri-support-center .contact-info {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 10px 20px;
            background-color: #e6f2ff;
            padding: 20px 20px 0px 20px;
            border-radius: 5px;
            margin-bottom: 20px;
            border: 1px solid #3a6ea5; /* 枠線を追加 */
        }
        .rishiri-support-center .contact-label {
            font-weight: bold;
            color: #3a6ea5;
        }
        .rishiri-support-center .highlight {
            background-color: #fff9e6;
            border-left: 5px solid #ffd700;
            padding: 15px;
            margin: 20px 0;
        }
        .rishiri-support-center .service-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 20px;
            margin-top: 20px;
        }
        .rishiri-support-center .service-item {
            background-color: #ffffff;
            border: 1px solid #e0e0e0;
            border-radius: 5px;
            padding: 20px;
        }
        .rishiri-support-center .service-item h4 {
            color: #3a6ea5;
            margin-top: 0;
            border-bottom: 2px solid #e0e0e0;
            padding-bottom: 10px;
            margin-bottom: 15px;
        }
		.rishiri-support-center p {
			margin-left: 0px!important;
			margin-bottom:0px;
		}
        .rishiri-support-center ul {
            padding-left: 0; /* 左パディングを0に設定 */
            margin-bottom: 0;
            list-style-type: none; /* リストスタイルを無効化 */
        }
        .rishiri-support-center li {
            margin-bottom: 5px;
            text-indent: -1em; /* 1文字分左にインデント */
        }
        .rishiri-support-center li:before {
            content: "・"; /* 中黒を追加 */
            padding-right: 0.5em; /* 中黒と文字の間隔 */
        }
        @media (max-width: 600px) {
            .rishiri-support-center .contact-info {
                grid-template-columns: 1fr;
            }
            .rishiri-support-center .service-grid {
                grid-template-columns: 1fr;
            }
        }



		.event-calendar {
            font-family: 'Helvetica Neue', Arial, sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
        }
        .event-row {
            display: flex;
            margin-bottom: 10px;
        }
        .event-month {
            flex: 0 0 100px;
            font-weight: bold;
            padding: 10px;
            background-color: #f0f0f0;
            border-radius: 5px 0 0 5px;
        }
        .event-content {
            flex: 1;
            padding: 10px;
            border-radius: 0 5px 5px 0;
        }
        .spring { background-color: #ffebee; }
        .summer { background-color: #e3f2fd; }
        .autumn { background-color: #fff3e0; }
        .winter { background-color: #f5f5f5; }
        
        @media (max-width: 600px) {
            .event-row {
                flex-direction: column;
                margin-bottom: 15px;
            }
            .event-month {
                border-radius: 5px 5px 0 0;
            }
            .event-content {
                border-radius: 0 0 5px 5px;
            }
        }


		/* 町民課 特産品*/
    .local-specialty-86745 {
      font-family: 'Helvetica Neue', Arial, sans-serif;
      line-height: 1.6;
      color: #333;
      background-color: #f9f9f9;
      padding: 30px 0;
  }
  
  .local-specialty-86745 .container {
      max-width: 1000px;
      margin: 20px auto;
      background-color: #ffffff;
      border: none;
      border-radius: 10px;
      padding: 30px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  }
  
  .local-specialty-86745 .content {
      display: flex;
      align-items: flex-start;
      gap: 30px;
  }
  
  .local-specialty-86745 .images {
      flex: 0 0 300px;
  }
  
  .local-specialty-86745 .images img {
      max-width: 100%;
      height: auto;
      border-radius: 8px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }
  
  .local-specialty-86745 .info {
      flex: 1;
  }
  
  .local-specialty-86745 .name {
      color: #1a5f7a !important;
      font-size: 28px !important;
      margin: 0 0 15px 0 !important;
      font-weight: bold !important;
      line-height: 1.2 !important;
      border-bottom: 2px solid #1a5f7a;
      padding-bottom: 10px;
  }
  
  .local-specialty-86745 .description {
      margin-bottom: 20px;
      font-size: 16px;
      line-height: 1.6;
  }
  
  .local-specialty-86745 .seller {
      font-size: 16px;
      color: #555;
      background-color: #f0f8ff;
      padding: 15px;
      border-radius: 8px;
  }
  
  @media (max-width: 768px) {
      .local-specialty-86745 .content {
          flex-direction: column;
      }
      .local-specialty-86745 .images {
          margin-bottom: 20px;
      }
  }




/* 町民課税金 */        
		.chomin-zeikin-table {
            width: 100%;
            border-collapse: collapse;
            font-family: Arial, sans-serif;
        }
        .chomin-zeikin-table th,
        .chomin-zeikin-table td {
            padding: 10px;
            border: 1px solid #ccc;
            text-align: center;
        }
        .chomin-zeikin-table th {
            background-color: #f0f0f0;
            font-weight: bold;
        }
        .chomin-zeikin-table .period {
            font-weight: bold;
            background-color: #e9ecef;
        }
        @media (max-width: 600px) {
            .chomin-zeikin-table th,
            .chomin-zeikin-table td {
                padding: 5px;
                font-size: 12px;
            }
        }


		.chomin-zeikin-page {
            font-family: Arial, sans-serif;
            line-height: 1.6;
            color: #333;
        }

        .chomin-zeikin-page ul {
            list-style-type: none;
            padding-left: 35px;
            margin-top: 20px;
        }

        .chomin-zeikin-page li {
            position: relative;
            margin-bottom: 10px;
        }


        .chomin-zeikin-page .qa-section {
            margin-top: 20px;
        }

        .chomin-zeikin-page .qa-item {
            margin-bottom: 20px;
            border: 1px solid #e0e0e0;
            border-radius: 5px;
            padding: 15px;
        }

        .chomin-zeikin-page .qa-question {
            font-weight: bold;
            color: #4a90e2;
            margin-bottom: 10px;
        }

        .chomin-zeikin-page .qa-question::before {
        }

        .chomin-zeikin-page .qa-answer {
            margin-left: 20px;
        }

        .chomin-zeikin-page .qa-answer::before {
            content: 'A. ';
            font-weight: bold;
            color: #2ecc71;
        }


/* 教科書全体のスタイル */
.textbook-notice {
    font-family: 'Hiragino Kaku Gothic ProN', 'メイリオ', sans-serif;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
    line-height: 1.6;
}

/* 見出しのスタイル */
.textbook-notice h1 {
    color: #333;
    border-bottom: 2px solid #4a4a4a;
    padding-bottom: 10px;
    font-size: 24px;
    margin-bottom: 20px;
}

.textbook-notice h2 {
    color: #2c3e50;
    margin-top: 30px;
    border-left: 5px solid #3498db;
    padding-left: 10px;
    font-size: 20px;
}

/* 段落のスタイル */
.textbook-notice p {
    margin-bottom: 15px;
	margin-left: 0px;
}

/* テーブルのスタイル */
.textbook-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    margin-bottom: 30px;
}

.textbook-table th, 
.textbook-table td {
    border: 1px solid #bdc3c7;
    padding: 12px;
    text-align: left;
}

.textbook-table th {
    background-color: #ecf0f1;
    font-weight: bold;
    color: #2c3e50;
}

.textbook-table tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* レスポンシブデザイン */
@media (max-width: 600px) {
    .textbook-notice {
        padding: 10px;
    }
    
    .textbook-table th, 
    .textbook-table td {
        padding: 8px;
        font-size: 14px;
    }
}

/* industry.css */

body.industry-page {
    font-family: 'Noto Sans JP', sans-serif;
    color: #2a2a2a;
    background-color: #f5f5f5;
    line-height: 1.8;
}

.header-industry {
    background-color: #1a3d2f;
    color: #ffffff;
    padding: 30px 0;
    text-align: center;
}

.header-industry h1 {
    font-size: 2.5em;
    margin: 0;
}

.header-industry p {
    font-size: 1.2em;
    margin-top: 10px;
}

.section-industry {
    padding: 40px;
    background-color: #ffffff;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.section-industry h2 {
    color: #1a3d2f;
    font-size: 2em;
    margin-bottom: 20px;
}

.image-placeholder {
    background-color: #e0e0e0;
    width: 100%;
    height: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0;
    border-radius: 8px;
}

.image-placeholder img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 8px;
}

.highlight-industry {
    background-color: #f7f9f8;
    padding: 20px;
    border-left: 8px solid #1a3d2f;
    margin: 30px 0;
    border-radius: 8px;
}

.sub-section-industry {
    margin: 30px 0;
}

.sub-section-industry h3 {
    margin-bottom: 15px;
    color: #016347;
}

.footer-industry {
    background-color: #1a3d2f;
    color: white;
    text-align: center;
    padding: 20px;
    margin-top: 40px;
    border-radius: 8px;
}

/* industry.css */

body.industry-page {
    font-family: 'Noto Sans JP', sans-serif;
    color: #2a2a2a;
    background-color: #f5f5f5;
    line-height: 1.8;
}

.header-industry {
    background-color: #1a3d2f;
    color: #ffffff;
    padding: 30px 0;
    text-align: center;
}

.header-industry h1 {
    font-size: 2.5em;
    margin: 0;
}

.header-industry p {
    font-size: 1.2em;
    margin-top: 10px;
}

.section-industry {
    padding: 40px;
    background-color: #ffffff;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.section-industry h2 {
    color: #1a3d2f;
    font-size: 2em;
    margin-bottom: 20px;
}

.image-placeholder {
    background-color: #e0e0e0;
    width: 100%;
    height: 250px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0;
    border-radius: 8px;
}

.image-placeholder img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 8px;
}

.highlight-industry {
    background-color: #f7f9f8;
    padding: 20px;
    border-left: 8px solid #1a3d2f;
    margin: 30px 0;
    border-radius: 8px;
}

.sub-section-industry {
    margin: 30px 0;
}

.sub-section-industry h3 {
    margin-bottom: 15px;
    color: #016347;
}

.footer-industry {
    background-color: #1a3d2f;
    color: white;
    text-align: center;
    padding: 20px;
    margin-top: 40px;
    border-radius: 8px;
}


.uni-industry-page {
  font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  line-height: 1.6;
  color: #333;
  background-color: #f5f5f5;
  margin: 0;
  padding: 0;
}

.uni-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
}

.uni-header {
  color: white;
  text-align: center;
  padding: 40px 20px;
}

.uni-header h1 {
  margin: 0;
  font-size: 2.5em;
}

.uni-header p {
  margin: 10px 0 0;
  font-size: 1.2em;
}

.uni-section {
  background-color: white;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  margin-bottom: 30px;
  padding: 30px;
}

.uni-section h2 {
  color: #1a5f7a;
  border-bottom: 2px solid #1a5f7a;
  padding-bottom: 10px;
  margin-top: 0;
  text-align: left;
}

.uni-section h3 {
  color: #333;
  font-size: 1.2em;
  margin: 1em 35px 0.5em;
  text-align: left;
  padding: 0;
  background: none;
}

.uni-section h3::before {
  content: none;
}

.uni-highlight {
  background-color: #f0f8ff;
  border-radius: 8px;
  padding: 20px;
  margin: 20px 0;
}

.uni-highlight h3 {
  color: #1a5f7a;
  margin-top: 0;
  text-align: left;
}

.uni-image-container {
  margin: 20px 0;
  text-align: center;
}

.uni-image-container img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.uni-footer {
  background-color: #1a5f7a;
  color: white;
  text-align: center;
  padding: 20px;
  margin-top: 30px;
}

@media (max-width: 768px) {
  .uni-header h1 {
      font-size: 2em;
  }
  .uni-header p {
      font-size: 1em;
  }
  .uni-section {
      padding: 20px;
  }
}

.hero {
  background-image: url('/wp-content/uploads/2024/08/hero1200-400.png');
  background-size: cover;
  background-position: center;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  text-align: center;
  border-radius: 10px;
  margin-bottom: 30px;
}
.hero h1 {
  font-size: 3em;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
  background-color: rgba(0,0,0,0.5);
  padding: 20px;
  border-radius: 10px;
}
.ambassadors {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 40px;
}
.ambassador {
  background-color: white;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}
.ambassador:hover {
  transform: translateY(-5px);
}
.ambassador img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}
.ambassador-info {
  padding: 20px;
}
.ambassador-info h3 {
  margin-top: 0;
  color: #1e90ff;
}
.ambassador-info p {
  margin-bottom: 10px;
}
.term {
  font-size: 0.9em;
  color: #666;
}


.term {
  font-size: 0.9em;
  color: #666;
}
.cta {
  background-color: #1e90ff;
  color: white;
  padding: 15px 30px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  margin: 40px 0;
  cursor: pointer;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}
.cta:hover {
  background-color: #1c7ed6;
}



.kenko-hoken{
  font-size: 18px;
  margin-left: 100px;
}

.kenko-hoken p{
  margin-bottom: 0px!important;
  font-size: 18px;
}

.kenko-hoken h4{
  margin-bottom: 0px!important;
}

.kenko-hoken h5{
 margin-left: 30px;
 margin-bottom: -10px!important;
}

.kenko-hoken ul{
  list-style: auto;
}

.kenko-hoken,.appearance,.opendata ul{
  margin-left: 14px;
  list-style-type: decimal;
}

.opendata li{
  list-style: disc;
}

.nobikko-room li{
  list-style: disc;
  margin-left: -40px;
}

.genkids-container {
  background-color: #ff5f5f;
  background-size: cover;
  background-position: center;
  color: white;
  padding: 20px;
  font-family: Arial, sans-serif;
  line-height: 1.6;
  max-width: 600px;
  margin: 0 auto;
}
.genkids-container h2 {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
  background-color: #ff5f5f;
}
.genkids-container ul {
  list-style-type: none;
  padding-left: 0;
}
.genkids-container li {
  margin-bottom: 10px;
}



.fukushi-service {
  max-width: 800px;
  margin: 0 auto;
  font-family: Arial, sans-serif;
  color: black;
}
.fukushi-service ul {
  list-style-type: none;
  padding: 0;
  margin: -15px 0px 0px 30px;
}
.fukushi-service li {
  line-height: 1.5;
  margin-bottom: 10px;
  list-style: disc;
}
.fukushi-service .apply-section {
  display: grid;
  grid-template-columns: 1fr 8fr;
  gap: 20px;
  align-items: start;
}
.fukushi-service .apply-method p {
  margin: 0 0 5px 0;
}
.fukushi-service .demo {
  color: white;
  text-decoration: underline;
}
.apply-method{
  margin-top: -35px;
}

@media (max-width: 768px) {
  .apply-method{
    margin-top: 0px;
  }

}


/* 防災モーダルスタイル　*/
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.5);
}

.modal-content {
  background-color: #fff;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
  max-width: 700px;
}

.close-modal {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close-modal:hover,
.close-modal:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.year-content {
  display: none;
}


/* 暮らしのスタイル*/
.lifestyle h2{
  margin-top: 60px;
  background-color: lightblue;
}

.lifestyle-toph2 h2{
  margin-top: 0px;
}

.lifestyle ul{
  margin-bottom: 10px;
}

.lifestyle li{
  list-style: disc;
  margin-left: -35px;
  margin-bottom: 0px;
}

.lifestyle .li-circle {
  list-style-type: none !important;
  padding-left: 70px !important;
  margin-left: 0 !important;
}

.li-circle-start {
  margin-top: 15px;
}



.lifestyle .li-circle > li {
  position: relative !important;
  padding-left: 1.5em !important;
  margin-bottom: 10px !important;
  list-style-type: none !important;
}

.lifestyle .li-circle > li::before {
  content: "●" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  color: #000 !important;
}


        .campsite-info {
            font-family: 'Arial', sans-serif;
            max-width: 800px;
            margin: 0 auto;
            padding: 20px;
            background-color: #f5f5f5;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
        }
        .campsite-info h2 {
            color: #2c3e50;
            border-bottom: 2px solid #3498db;
            padding-bottom: 10px;
            margin-bottom: 20px;
        }
        .campsite-info-table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0 10px;
        }
        .campsite-info-table tr {
            background-color: #fff;
        }
        .campsite-info-table th, .campsite-info-table td {
            padding: 15px;
            text-align: left;
            vertical-align: top;
        }
        .campsite-info-table th {
            width: 30%;
            color: #34495e;
            font-weight: bold;
            background-color: #ecf0f1;
            border-radius: 5px 0 0 5px;
        }
        .campsite-info-table td {
            width: 70%;
            color: #7f8c8d;
            border-radius: 0 5px 5px 0;
        }
        .campsite-info-table i {
            color: #3498db;
            margin-right: 10px;
        }
        @media (max-width: 600px) {
            .campsite-info-table, .campsite-info-table tbody, .campsite-info-table tr, .campsite-info-table th, .campsite-info-table td {
                display: block;
                width: 100%;
            }
            .campsite-info-table th {
                border-radius: 5px 5px 0 0;
            }
            .campsite-info-table td {
                border-radius: 0 0 5px 5px;
                margin-bottom: 10px;
            }
        }


/* キャンプ場 */
.campsite-info {
  font-family: 'Arial', sans-serif;
  max-width: 100%;
  margin: 0 auto;
  padding: 20px;
  background-color: #f5f5f5;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.campsite-info h2 {
  color: #2c3e50;
  border-bottom: 2px solid #3498db;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.campsite-info-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.campsite-info-table tr {
  background-color: #fff;
}
.campsite-info-table th, .campsite-info-table td {
  padding: 15px;
  text-align: left;
  vertical-align: top;
}
.campsite-info-table th {
  width: 30%;
  color: #34495e;
  font-weight: bold;
  background-color: #ecf0f1;
  border-radius: 5px 0 0 5px;
}
.campsite-info-table td {
  width: 70%;
  color: #7f8c8d;
  border-radius: 0 5px 5px 0;
}
.campsite-info-table i {
  color: #3498db;
  margin-right: 10px;
}
@media (max-width: 600px) {
  .campsite-info-table, .campsite-info-table tbody, .campsite-info-table tr, .campsite-info-table th, .campsite-info-table td {
      display: block;
      width: 100%;
  }
  .campsite-info-table th {
      border-radius: 5px 5px 0 0;
  }
  .campsite-info-table td {
      border-radius: 0 0 5px 5px;
      margin-bottom: 10px;
  }
}        

/* ボタンの基本スタイル */
.year-toggle {
  background-color: #4CAF50; /* 明るいグリーン */
  color: white; /* 文字色を白に */
  padding: 10px 20px;
  border: none;
  border-radius: 5px; /* 角を丸める */
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.3s ease, transform 0.3s ease; /* ホバー時のエフェクトを追加 */
}

/* ボタンのホバースタイル */
.year-toggle:hover {
  background-color: #45a049; /* 少し濃いグリーンに */
  transform: scale(1.05); /* 少し拡大 */
}

/* ボタンのアクティブスタイル */
.year-toggle:active {
  background-color: #3e8e41; /* さらに濃いグリーンに */
  transform: scale(0.95); /* 少し縮小 */
}


/* 協力隊モーダルのスタイル説明文のスタイル */
.page-description p {
  font-size: 1.1em;
  line-height: 1.6;
  margin-bottom: 15px;
}

/* 強調テキストのスタイル */
.page-description strong {
  font-weight: bold;
  color: #333;
}

/* リンクのスタイル */
.page-description a {
  color: #0066cc;
  text-decoration: underline;
}

.page-description a:hover {
  color: #004999;
}

/* 開閉メニューのスタイル */
.accordion-content {
  display: none;
  padding: 10px;
  border: 1px solid #ddd;
  border-top: none;
  background-color: #f9f9f9;
}

.accordion-title {
  cursor: pointer;
  padding: 10px;
  background-color: #0066cc;
  color: white;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 5px;
}

.accordion-title:hover {
  background-color: #004999;
}

.contact-form {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  background-color: #f9f9f9;
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
}

/* 各フィールドのスタイル */
.contact-form label {
  display: block;
  margin-bottom: 8px;
  font-weight: bold;
  color: #333;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea {
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-sizing: border-box;
  font-size: 16px;
  background-color: #fff;
}

.contact-form textarea {
  min-height: 150px;
}

/* 送信ボタンのスタイル */
.contact-form input[type="submit"] {
  width: 100%;
  padding: 12px;
  background-color: #0066cc;
  border: none;
  border-radius: 5px;
  color: white;
  font-size: 18px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.contact-form input[type="submit"]:hover {
  background-color: #004999;
}


/* 広報利尻 */
.rishiri-accordion-content {
  display: none;
  padding: 10px;
  border-top: 1px solid #ddd;
}

.rishiri-accordion-toggle {
  cursor: pointer;
  padding: 10px;
  background-color: #f0f0f0;
  border: 1px solid #ddd;
  margin: 0;
}

.rishiri-accordion-toggle.active {
  background-color: #d0d0d0;
}


.numbered-list {
  list-style-type: none;
  padding-left: 0;
  counter-reset: item;
  margin-top: -25px;
  margin-bottom: -10px;
}
.numbered-list li {
  counter-increment: item;
  position: relative;
  padding-left: 2.5em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.numbered-list li::before {
  content: "（" counter(item) "）";
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
}

.machizukuri li {
  list-style-type: disc;
  margin-left: -20px;
  text-indent: 0px;
}

.machizukuri-shidai{
  margin-left: 65px;
  margin-top: -55px;
}

.kokikoresha ul{
  margin: 0px;
}

.kokikoresha p{
  margin-top: 0px;
}

.koresha-tel h2{
  text-align: center;
  background-color: #225588;
  color: white;
  border-style: none;
}

.koresha-tel{
  text-align: center;
  background-color: #225588;
  color: white;
  padding: 20px;
}

.koresha-tel a{
  text-align: center;
  background-color: #225588;
  color: white;
}

.koresha-dscription {
  background-color: gray;
  color: white;
  padding: 10px;
  width: 100%;
}

.koresha-dscription a{
  background-color: gray;
  color: white;
  padding: 10px;
  width: 100%;
  margin-top: -20px;
  margin-bottom: 20px;
}

.hr-margin{
  margin-top: 60px;
  margin-bottom: 60px;
}

.space-margin{
  margin-top: 60px;
}

.museum-topics h5{
  margin: 0px;
}


/*ContactForm7カスタマイズ*/
table.CF7_table{
	width:100%;
	margin:0 auto;
	border: 3px solid #e5e5e5;
}

table.CF7_table tr{
	border-top: 1px solid #e5e5e5;
}

.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
	display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
	border: 1px solid #d8d8d8;
}

.CF7_table ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.CF7_req{
	font-size:.9em;
	padding: 5px;
	background: #f79034;/*オレンジ*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/*「任意」文字*/
.CF7_unreq{
	font-size:.9em;
	padding: 5px;
	background: #bdbdbd;/*グレー*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/* タイトル列 */
@media screen and (min-width: 768px){
	.CF7_table th{
	width:30%;/*横幅*/
	background-color:#ebedf5;/*ブルーグレー*/
	}
}

/* レスポンシブ */
@media screen and (max-width: 768px){
	table.CF7_table{
	width:95%;
	}
	.CF7_table tr, .CF7_table td, .CF7_table th{
	display: block;
	width: 100%;
	line-height:2.5em;
	}
	.CF7_table th{
	background-color:#ebedf5;
	}
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
	background-color:#f79034;/* オレンジ*/
	border:0;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	margin:0 auto;
}

.CF7_btn{
	text-align:center;
	margin-top:20px;
}

.wpcf7-spinner{
	width:0;
	margin:0;
}


/* reservation-form-specific CSS */
.reservation-form-container {
  max-width: 100%;
  background-color: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  margin: 0 auto;
}

.reservation-form-section {
  margin-bottom: 20px;
}

.reservation-form-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}

.reservation-form-table th, 
.reservation-form-table td {
  border: 1px solid #000;
  padding: 8px;
  text-align: center;
}

.reservation-form-table th {
  background-color: #f2f2f2;
}

.reservation-form-submit-section {
  margin-bottom: 20px;
}

.reservation-form-confirmation {
  margin-top: 20px;
  padding: 15px;
  background-color: #f9f9f9;
  border-left: 4px solid #4CAF50;
}

.reservation-form-confirmation p {
  margin-bottom: 10px;
}

button, [type="submit"] {
  width: 100%;
  padding: 10px;
  background-color: #4CAF50;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
}

button:hover, [type="submit"]:hover {
  background-color: #45a049;
}

.reservation-form-gray-background {
  background-color: #d3d3d3;
}

.reservation-form-blue-background {
  background-color: #e0f7fa;
}

.reservation-form-pink-background {
  background-color: #f8bbd0;
}




/* 年度コンテナ */
.year-container {
    margin: 15px 0;
}

.year-toggle {
    background-color: #307d51;
    border: none;
    border-left: 5px solid ##307d51;
    padding: 15px 20px;
    cursor: pointer;
    width: 100%;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
}

.year-toggle:hover {
    background-color: #57ae7d;
}

.year-toggle:after {
    content: '▼';
    font-size: 12px;
    color: fff;
}

.year-content {
    display: none;
    padding: 20px;
    background-color: #fff;
    border-top: 1px solid #eee;
}

.year-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* イベント情報 */
.event-date {
    color: #1a3d2f;
    font-size: 12px;
}

.event-title {
    font-size: 15px;
    margin-bottom: -20px;
}


.doclink {
    margin-bottom: 25px;
    font-size: 15px;
}

/* ファイルサイズ */
.file-size {
    background-color: #f0f0f0;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.85em;
    color: #666;
    margin-left: 8px;
    white-space: nowrap;
}

/* レスポンシブ */
@media (max-width: 480px) {
    .year-toggle {
        padding: 10px;
        font-size: 13px;
    }

    .year-content {
        padding: 10px 5px;
    }


    .file-size {
        font-size: 0.75em;
        padding: 1px 4px;
    }
}

/* ============================================
   博物館ページ専用スタイル調整
   ============================================ */

/* リスト要素のフォントサイズを見出しより小さく */
li {
	font-size: 16px;
}

/* 入れ子リストも同様に */
li li {
	font-size: 15px;
}

/* 本文段落のフォントサイズ調整 */
.entry-content p,
.page-content p {
	font-size: 16px;
}

/* h4見出しのサイズ確保 */
h4 {
	font-size: 18px;
}

/* スマホ向けフォントサイズ調整 */
@media (max-width: 768px) {
	h2 {
		font-size: 1.3rem; /* 約21px */
	}
	
	h3 {
		font-size: 18px;
	}
	
	h4 {
		font-size: 16px;
	}
	
	li {
		font-size: 14px;
	}
	
	li li {
		font-size: 13px;
	}
	
	.entry-content p,
	.page-content p {
		font-size: 14px;
	}
}

/* 引用文献リスト用スタイル（ぶら下げインデント・行間詰め） */
.references p {
	margin-bottom: 0.3em;
	padding-left: 20px;
	text-indent: -20px;
}

.references {
	margin-top: 1em;
}

/* 引用文献用ぶら下げインデント（行間詰め） */
p.ref {
	margin-bottom: 0.3em;
	padding-left: 20px;
	text-indent: -20px;
}