@charset "utf-8";
/* CSS Document */
/* 固定フッタスタイル
-------------------------------------------------- */
html {
	position: relative;
	height: 100%;
}
body {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
/*.footer {
	width: 100%;
	background-color: #f5f5f5;
	font-size: 0.875rem;
}*/
a {
  color: #f05a28;
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  color: rgba(240,90,40,0.7);
  text-decoration:none  ;
}

a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([tabindex]):focus {
  outline: 0;
}
/* ページのカスタムCSS
-------------------------------------------------- */
/*.site-header{
    display: flex;
    position: absolute;
    justify-content: space-between;
    width: 100%;
}
.site-header.fixed{
    position: fixed;
    top: 0;
}*/




/* indexのmainトップ位置 */
@media (min-width:992px) {
	body > #content {
	padding: 15px 15px 10px;
	flex: 1 1 auto;
}
}
@media (max-width:991px) {
	body > #content {
		position: relative;
		top:60px;
		margin-bottom: 40px;
	padding: 15px 15px 10px;
	flex: 1 1 auto;
	}
}
.footer > .container {
	padding-right: 15px;
	padding-left: 15px;
}

.main {
	margin-top: -30px;
}
/*背景色*/
.base_bg {
	background-color: #F8F6EF;
}

.bland_out{
		position: relative;
	}	
.bland_in{
  position: absolute;
  top: 50%;

  transform: translateY(-50%);
  -webkit- transform: translateY(-50%);
}
.contact_btn_in{
  position: absolute;
  top: 50%;
  right:0%;
  transform: translateY(-50%) translateX(-0%);
  -webkit- transform: translateY(-50%) translateX(-0
	  0%);
}	
/* トップロゴ画像サイズ */
@media (min-width:1201px) {
	img.toplogo {
		width:371px;
		height: auto;
	}
}
@media (max-width:1200px) {
	img.toplogo {
		width: 250px;
		height: auto;
	}
}
.bs-navbar {
	min-height: 4rem;
	background-color:#fff;
	z-index: 1030;
	border-bottom: solid 2px #f05a28;
}
/* 検索フォーム */
.navbar-brand {
	position: relative;
	z-index: 1040;
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar {
	clear: both;overflow: hidden;position: relative;z-index: 1111;
	background: #d67900 url(../images/bg_menu.jpg) repeat-x center center;	/*背景色、背景画像の読み込み。※古いブラウザ用。*/
	background: #d67900 url(../images/bg_menu.jpg) repeat-x center center / 120px;	/*背景色、背景画像の読み込み。*/
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.4);	/*ボックスの影。右に、下に、広げる幅、0,0,0は黒の事で0.4は色が40%ついた状態の事。*/
}
/*メニュー１個あたりの設定*/
#menubar li {
	list-style: none;
	float: left;	/*左に回り込み*/
	width: 16.6%;	/*メニュー幅（100÷6個=16.6%）*/
}
#menubar li a {
	display:  block;text-decoration: none;
	line-height: 1.6;	/*行間*/
	color: #fff;		/*文字色*/
	font-size: 13px;	/*文字サイズ*/
	text-align: center;
	height: 90px;		/*高さ。下のmargin(10+10=20)とpadding-top(10)の数字を合計して「100」になるようにする。*/
	margin: 10px 0;		/*上下、左右に空けるメニューの外のスペース。この部分はマウスオン時に反応しない(色がかわらない)部分になります。*/
	padding-top: 40px;	/*メニュー内の上に空ける余白。上下のバランスをここで調整して下さい。*/
	padding-left: 10px;	/*メニュー内の左側に空ける余白。アイコンとのバランスを調整します。*/
	padding-right: 10px;	/*メニュー内の左側に空ける余白。アイコンとのバランスを調整します。*/
	border-radius: 5px;	/*角丸のサイズ。マウスオン時に角が丸くなる設定です。*/
}

/*「施設のご案内」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の一番上(0)を基準に読み込む。サイズは50px。*/
#menubar li.office {
	background: url(../images/mark_menu.png) no-repeat 50% -15px / 50px;
}
/*「イベント」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-100px)を基準に読み込む。サイズは50px。*/
#menubar li.gender {
	background: url(../images/mark_menu.png) no-repeat 50% -113px / 50px;
}
/*「お買い物」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-200px)を基準に読み込む。サイズは50px。*/
#menubar li.disabilities {
	background: url(../images/mark_menu.png) no-repeat 50% -207px / 50px;
}
/*「周辺マップ」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-300px)を基準に読み込む。サイズは50px。*/
#menubar li.cultural {
	background: url(../images/mark_menu.png) no-repeat 50% -311px / 50px;
}
/*「お問い合わせ」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-400px)を基準に読み込む。サイズは50px。*/
#menubar li.sexual {
	background: url(../images/mark_menu.png) no-repeat 50% -411px / 50px;
}

#menubar li.childcare {
	background: url(../images/mark_menu.png) no-repeat 50% -511px / 50px;
}


/*装飾文字（英語表記）の設定*/
#menubar li a span {
	text-shadow: none;display: block;
	font-size: 12px;		/*文字サイズ*/
	letter-spacing: 0.1em;	/*文字間隔を少し広くする設定*/
	padding-left: 3px;		/*左に少しだけ余白を作る。*/
	opacity: 0.6;			/*60%だけ色がついた状態。*/
}
/*マウスオン時メニューと、現在表示中(current)メニューの設定*/
#menubar li a:hover,#menubar li.current a {
	background: rgba(0,0,0,0.15);	/*0,0,0は黒の事で、0.15は15%だけ色がついた状態の事。*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}

/*fixmenu設定（メニューが画面上部に到達した際のスタイル）
---------------------------------------------------------------------------*/
/*上部固定メニュー用fixmenu設定*/
body.is-fixed-menu #menubar.nav-fix-pos {
	position: fixed;width: 100%;top: 0px;
}
body.is-fixed-menu .contents:first-of-type {
	margin-top: 100px;	/*メニューブロックの高さを指定する。背景画像も高さ100pxなので通常はこのままで。*/
}
/*※以下の２ブロックのスタイルの「中身」は、上の２ブロックのスタイルと単純に合わせておいて下さい。fixmenuスクリプトを２つ使う為に必要な設定になります。*/
body.is-fixed #menubar.nav-fix-pos {
	position: fixed;width: 100%;top: 0px;
}
body.is-fixed .contents:first-of-type {
	margin-top: 100px;
}
@media (min-width:1201px) {
	.navbar-brand {
		width:430px;
		height: auto;
	}
}
@media (max-width:767px) {
	.navbar-brand {
		width:280px;
		height: auto;
	}
}
.navbar-nav.float-lg-right .btn {
	position: relative;
	z-index: 1040;
	padding: .25rem 1.25rem;
	transition: transform .3s;
}

.navbar .navbar-collapse {
	position: relative;
	overflow: hidden !important;
}
.navbar .navbar-collapse .float-right > li:last-child {
	padding-left: 22px;
}

.navbar .nav-collapse {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding-right: 120px;
	padding-left: 20px;
	width: 100%;
}
.navbar .nav-collapse {
	background-color: #563d7c;
}
.navbar .nav-collapse .form-inline {
	border-width: 0;
	box-shadow: none;
}

.navbar-nav.float-lg-right .btn:not(.collapsed) {
	background-color: rgb(92, 184, 92);
	border-color: rgb(204, 204, 204);
	color: rgb(255, 255, 255);
}

.navbar .nav-collapse {
	height: auto !important;
	transition: transform 0.3s;
	transform: translate(0px,-50px);
}
.navbar .nav-collapse.show {
	transform: translate(0px,0px);
}
.navbar .nav-collapse.show.slide-down + ul.navbar-nav.my-lg-1 li.nav-item {
	visibility: hidden;
}
/*「施設のご案内」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の一番上(0)を基準に読み込む。サイズは50px。*/
li.office {
	background: url(../images/mark_menu.png) no-repeat 50% -15px / 50px;
}
/*「イベント」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-100px)を基準に読み込む。サイズは50px。*/
li.gender {
	background: url(../images/mark_menu.png) no-repeat 50% -113px / 50px;
}
/*「お買い物」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-200px)を基準に読み込む。サイズは50px。*/
li.disabilities {
	background: url(../images/mark_menu.png) no-repeat 50% -207px / 50px;
}
/*「周辺マップ」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-300px)を基準に読み込む。サイズは50px。*/
li.cultural {
	background: url(../images/mark_menu.png) no-repeat 50% -311px / 50px;
}
/*「お問い合わせ」メニューの設定
アイコンの読み込み。左から15pxの場所に配置。背景画像の上から100px(-400px)を基準に読み込む。サイズは50px。*/
li.sexual {
	background: url(../images/mark_menu.png) no-repeat 50% -411px / 50px;
}
li.sexual a {
	letter-spacing: -0.2em;
}
li.childcare {
	background: url(../images/mark_menu.png) no-repeat 50% -511px / 50px;
}
@media (max-width: 991px) {
	.navbar .navbar-collapse .float-lg-right > li:last-child {
		padding-left: 15px;
		padding-right: 15px;
	} 
	
	.navbar .nav-collapse {
		margin: 0.5rem auto;
		padding: 0;
	}
	.navbar .nav-collapse .form-inline {
		margin: 0;
	}
	.nav-collapse>li {
		float: none;
	}
	
	.navbar .nav-collapse {
		transform: translate(-100%,0px);
	}
	.navbar .nav-collapse.show {
		transform: translate(0px,0px);
	}
	
	.navbar .nav-collapse.slide-down {
		transform: translate(0px,-100%);
	}
	.navbar .nav-collapse.show.slide-down {
		transform: translate(0px,16.5rem);
	}
	
	
}
/* 左サイドメニュー・右サイドバー */
@media (min-width:768px) {
	@supports ((position: -webkit-sticky) or (position: sticky)) {
		#sidebar,#sidemenu {
			position: -webkit-sticky;
			position: sticky;
			top:7.5rem;
			z-index:1000;
			max-height: calc(200vh - 4rem);
			max-width: 320px;
			overflow-y: auto;
		}
	}
}
/* 左サイドメニュー・右サイドバー */
@media (max-width:767px) {
	#sidebar,#sidemenu {
			position: relative;
			top:0rem;
			z-index:1000;
			overflow-y: auto;
		}
	}

#sidebar ul.nav.nav-pills.flex-column .nav-item .nav-link {
	padding: 0 0.5rem;
}
#sidebar ul {
	padding-left: 0;
}
#sidebar ul li {
	list-style: none;
}
#sidebar ul li ul li{
	margin-left: 1rem !important;
}

#sidemenu ul {
	padding-left: 0;
}
#sidemenu ul li {
	list-style: none;
}
#sidemenu ul li ul li{
	margin-left: 1rem !important;
}
#sidebar,#sidemenu {
	font-size: 0.875rem;
}


/* プレースホルダ画像 */
.bd-placeholder-img {
	font-size: 1.125rem;
	text-anchor: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

@media (min-width:768px) {
	.bd-placeholder-img-lg {
		font-size: 3.5rem;
	}
}

/* 透過用背景画像 */
.bg-transparent-img {
	background-color: #55595c;
	background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 20.5V18H0v-2h20v-2H0v-2h20v-2H0V8h20V6H0V4h20V2H0V0h22v20h2V0h2v20h2V0h2v20h2V0h2v20h2V0h2v20h2v2H20v-1.5zM0 20h2v20H0V20zm4 0h2v20H4V20zm4 0h2v20H8V20zm4 0h2v20h-2V20zm4 0h2v20h-2V20zm4 4h20v2H20v-2zm0 4h20v2H20v-2zm0 4h20v2H20v-2zm0 4h20v2H20v-2z' fill='%23373a3c' fill-rule='evenodd'/%3E%3C/svg%3E");
}

/* 不透明トースト背景画像 */
.bg-toast {
background-color: #007bff;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='%23ffc107' fill-opacity='0.94'%3E%3Cpath fill-rule='evenodd' d='M0 0h40v40H0V0zm40 40h40v40H40V40zm0-40h2l-2 2V0zm0 4l4-4h2l-6 6V4zm0 4l8-8h2L40 10V8zm0 4L52 0h2L40 14v-2zm0 4L56 0h2L40 18v-2zm0 4L60 0h2L40 22v-2zm0 4L64 0h2L40 26v-2zm0 4L68 0h2L40 30v-2zm0 4L72 0h2L40 34v-2zm0 4L76 0h2L40 38v-2zm0 4L80 0v2L42 40h-2zm4 0L80 4v2L46 40h-2zm4 0L80 8v2L50 40h-2zm4 0l28-28v2L54 40h-2zm4 0l24-24v2L58 40h-2zm4 0l20-20v2L62 40h-2zm4 0l16-16v2L66 40h-2zm4 0l12-12v2L70 40h-2zm4 0l8-8v2l-6 6h-2zm4 0l4-4v2l-2 2h-2z'/%3E%3C/g%3E%3C/svg%3E");
}

/* 実例カテゴリーバー */
.nav-scroller .nav {
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	padding-bottom: 1rem;
	margin-top: -1px;
	overflow-x: auto;
	color: rgba(255, 255, 255, .75);
	text-align: center;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}
.nav-scroller {
	position: relative;
	z-index: 2;
	height: 2.75rem;
	overflow-y: hidden;
}

.nav-underline .nav-link {
	padding-top: .75rem;
	padding-bottom: .75rem;
	font-size: .875rem;
	color: var(--secondary);
}

.nav-underline .nav-link:hover {
	color: var(--blue);
}

.nav-underline .active {
	font-weight: 500;
	color: var(--gray-dark);
}

/* ページ移動 */
#page_link a.previous::before {
	display: none;
	font-family: "Font Awesome 5 Solid";
	content: "\f100";
}
#page_link a.previous .svg-inline--fa[data-fa-pseudo-element] {
	float: left;
}
#page_link a.next::after {
	display: none;
	font-family: "Font Awesome 5 Solid";
	content: "\f101";
}
#page_link a.next .svg-inline--fa[data-fa-pseudo-element] {
	float: right;
}

/* ダウンロードボタン */
.btn-bs {
	font-weight: 500;
	color: #7952b3;
	border-color: #7952b3;
}
.btn-bs:active,.btn-bs:hover {
	color: #fff;
	background-color: #7952b3;
	border-color: #7952b3;
}

/* 見本 */
.report {
	position: relative;
	display: block;
	margin-bottom: 0.75rem;
	background-color: #fff;
	border-radius: 0.25rem;
	border: 1px solid #CCC;
	padding: 1.25rem;
}
.report::after {
	content: "";
	display: table;
	clear: both;
}
.contents .report h4 {
	clear: both;
	margin-bottom: 20px;	/*見出しの下に空けるスペース*/
	padding: 6px 5px;		/*上下、左右への余白*/
	font-size: 1.2rem;		/*文字サイズ*/
	font-weight: bold;
	border-bottom: 2px dotted #f7931e;		/*枠線の幅、線種、色*/
	color: #C96F07;			/*文字色*/
}
.contents .report h5 {
	clear: both;
	font-size: 1rem;		/*文字サイズ*/
	line-height:1.6;
	padding:0 0.5rem 0rem 0.5rem;		/*上下、左右への余白*/
	font-weight: bold;
	color: #d69700;		/*文字色*/
}
.contents .report h6 {
	padding-left: 0.75rem;
	font-size: 1rem;		/*文字サイズ*/
	color: #000;		/*文字色*/
}
.contents .report p {
	padding:0 0.5rem 0.5rem 0.5rem;		/*上下、左右への余白*/
	line-height:1.6;
}
.contents .report ul {
	padding:0rem 2rem;		/*上下、左右への余白*/
	line-height:1.6;
}

/*コンテンツのh3タグ設定*/
.contents h3 {
	clear: both;
	margin-bottom: 20px;	/*見出しの下に空けるスペース*/
	padding: 6px 15px;		/*上下、左右への余白*/
	font-size: 1.2rem;		/*文字サイズ*/
	font-weight: bold;
	border: 1px solid #ccc;		/*枠線の幅、線種、色*/
	border-radius: 5px;		/*角丸のサイズ*/
	background: #fff;		/*背景色*/
	color: #333;			/*文字色*/
}
/*h3タグの１文字目への設定。左側のアクセントラインです。*/
.contents h3::first-letter {
	border-left: 3px solid #f7931e;	/*左の線の幅、線種、色*/
	padding-left: 15px;				/*線と文字列との間に空ける余白*/
}

p.content {
	margin: 1rem 0 0.2rem -0.5rem;
	white-space: normal;
}
.sample .container .content {
	margin-left: -1.5rem;
}
.sample p.content:first-child {
	margin-top: 0;
}

/* （グリッド/列） */
.sample.area .row,.sample.grid .d-flex .p-2,.sample.area .d-flex,.sample.area .d-inline-flex,.sample.area .float,.sample.area .text-nowrap {
	background-color: rgba(86, 61, 124, .15);
	border: 1px solid rgba(86, 61, 124, .2);
}
.sample.grid .row>[class*=col], .sample.grid .modal-body .container-fluid .row>[class*=col-], .sample.grid .float>[class*=float-], .sample .space {
	background-color: rgba(86, 61, 124, .15);
	border: 1px solid rgba(86, 61, 124, .2);
	padding-bottom: 0.75rem;
	padding-top: 0.75rem;
}
.sample.flex .row {
	background-color: rgba(255, 0, 0, 0.1);
	min-height: 10rem;
}
.sample.grid .row + .row {
	margin-top: 1rem;
}
.sample input.form-control + select.form-control {
	margin-top: 0.25rem;
}
/* （モーダル） */
.sample.open-modal .modal {
	bottom: auto;
	display: block;
	left: auto;
	position: relative;
	right: auto;
	top: auto;
	z-index: 1;
}
/* （ポップオーバー） */
.sample .popover {
	position: relative;
	display: block;
	float: left;
	z-index: 1;
	margin: 1.25rem;
	width: 260px;
}
.bs-popover-bottom-docs .arrow,
.bs-popover-top-docs .arrow {
	left:50%
}
.bs-popover-left-docs .arrow,
.bs-popover-right-docs .arrow {
	top:50%
}
.tooltip-demo a{white-space:nowrap}
/* （ツールチップ） */
.sample .tooltip {
	display: inline-block;
	margin: 10px;
	opacity: 1;
	position: relative;
	z-index: 1;
}
.bs-tooltip-bottom-docs .arrow,
.bs-tooltip-top-docs .arrow {
	left:50%
}
.bs-tooltip-left-docs .arrow,
.bs-tooltip-right-docs .arrow {
	top:50%
}
/* 設定例 */
pre.highlightjs {
	position: relative;
}
pre.highlightjs .title {
	line-height: 1.25rem;
	color: #555;
	font-size: 82.5%;
	position: absolute;
	left: 0;
	top: 0;
	margin: 2px 0 0 2px;
	padding: 0 0.5rem;
	z-index: 999;
	border: solid 1px #dee2e6;
	border-width: 0 1px 1px 0;
	border-radius: 0 0 4px 0;
	background: #e8e8e8;
}
pre.highlightjs .title:empty {
	display: none;
}

pre.highlightjs .copy-btn {
	line-height: 1.25rem;
	color: #fff;
	font-size: 82.5%;
	position: absolute;
	right: 0;
	top: 0;
	margin: 2px 2px 0.25rem 0;
	padding: 0 0.5rem;
	z-index: 999;
	border: solid 1px #dee2e6;
	border-width: 0 0 1px 1px;
	border-radius: 0 0 0 4px;
	background: #7952b3;
}

pre.highlightjs code {
	white-space: pre;
	word-wrap: break-word;
	border: 2px solid rgba(0, 0, 0, 0.25);
	border-radius: 0.25rem;
	padding: 1.5rem 0.5rem;
}
.col-md-6 pre.highlightjs code {
	white-space: pre-wrap;
}

.tooltip-inner {
  max-width: 100%;
}

/* 設定解説 */
.alert ul li {
	word-wrap:break-word;
	overflow-wrap : break-word;
}
.alert ul:last-child {
	margin-bottom: 0.5rem;
}
.alert ul ul {
	margin-left: -1em;
	margin-bottom: 0!important;
	list-style-type: disc;
}

/* 注意書き */
.callout {
	padding: 1.25rem;
	margin-top: 1.25rem;
	margin-bottom: 1.25rem;
	border: 1px solid #eee;
	border-left-width: .25rem;
	border-radius: .25rem;
}
.callout p:last-child {
	margin-bottom: 0;
}
.callout-info {
	border-left-color: #5bc0de;
}
.callout-info h5 {
	color: #5bc0de;
}
.callout-warning {
	border-left-color: #f0ad4e;
}
.callout-warning h5 {
	color: #f0ad4e;
}
.callout-danger {
	border-left-color: #d9534f;
}
.callout-danger h5 {
	color: #d9534f;
}

/* 見出し */
/*h2[id],h3[id],h4[id] {
	margin-top: -5rem;
	padding-top: 5rem;
}*/

/* コンテナ */
.bd-example-container {
	margin-left: auto;
	margin-right: auto;
	max-width: 25rem;
	min-width: 16rem;
}
.bd-example-container-header {
	background-color: #daeeff;
	border-radius: 0.25rem;
	height: 3rem;
	margin-bottom: 0.5rem;
}
.bd-example-container-sidebar {
	background-color: #80bdff;
	border-radius: 0.25rem;
	float: right;
	height: 8rem;
	width: 6rem;
}
.bd-example-container-body {
	background-color: #957bbe;
	border-radius: 0.25rem;
	height: 8rem;
	margin-right: 6.5rem;
}
.bd-example-container-fluid {
	max-width: none;
}

/* スクロールスパイ */
.scrollspy-example {
	height: 200px;
	overflow: auto;
	position: relative;
}
.scrollspy-example-2 {
	position: relative;
	height: 350px;
	overflow: auto;
}

/* ドロップダウン */
.bd-example-dropdown {
	height: 230px;
}
.bd-example-dropdown > .dropdown > .dropdown-toggle {
	float: left;
}
.bd-example-dropdown > .dropdown > .dropdown-menu {
	clear: left;
	display: block;
	margin-bottom: 0.25rem;
	position: static;
}

#dropdownMouseover.dropdown:hover .dropdown-menu {
	display: block;
}

/* カスタムファイル選択 */
#customFile.custom-file-input ~ .custom-file-label::after {
	content: "参照";
}
.custom-file-input:lang(es) ~ .custom-file-label::after {
	content: "Elegir";
}

.custom-select {
	-webkit-appearance: none;
	-moz-appearance: none;
}

/* 枠の罫線 */
.border-utils {
	display: inline-block;
	width: 5rem;
	height: 5rem;
	margin: .25rem;
	background-color: #f5f5f5;
}

/* カラー変数 */
.swatch-blue {
	background-color:#007bff;
	color:#fff;
}
.swatch-indigo {
	background-color:#6610f2;
	color:#fff;
}
.swatch-purple {
	background-color:#6f42c1;
	color:#fff;
}
.swatch-pink {
	background-color:#e83e8c;
	color:#fff;
}
.swatch-red {
	background-color:#dc3545;
	color:#fff;
}
.swatch-orange {
	background-color:#fd7e14;
	color:#212529;
}
.swatch-yellow {
	background-color:#ffc107;
	color:#212529;
}
.swatch-green {
	background-color:#28a745;
	color:#fff;
}
.swatch-teal {
	background-color:#20c997;
	color:#fff;
}
.swatch-cyan {
	background-color:#17a2b8;
	color:#fff;
}
.swatch-white {
	border: 1px solid rgba(0,0,0,.1);
	background-color:#fff;
	color:#212529;
}
.swatch-gray {
	background-color:#464a4c;
	color:#fff;
}
.swatch-gray-dark {
	background-color:#292b2c;
	color:#fff;
}
.swatch-black {
	background-color:#000;
	color:#fff;
}
.swatch-primary {
	background-color:#007bff;
	color:#fff;
}
.swatch-secondary {
	background-color:#868e96;
	color:#fff;
}
.swatch-success {
	background-color:#28a745;
	color:#fff;
}
.swatch-info {
	background-color:#17a2b8;
	color:#fff;
}
.swatch-warning {
	background-color:#ffc107;
	color:#212529;
}
.swatch-danger {
	background-color:#dc3545;
	color:#fff;
}
.swatch-light {
	background-color:#f8f9fa;
	color:#212529;
}
.swatch-dark {
	background-color:#343a40;
	color:#fff;
}
.swatch-100 {
	background-color:#f8f9fa;
	color:#212529;
}
.swatch-200 {
	background-color:#e9ecef;
	color:#212529;
}
.swatch-300 {
	background-color:#dee2e6;
	color:#212529;
}
.swatch-400 {
	background-color:#ced4da;
	color:#212529;
}
.swatch-500 {
	background-color:#adb5bd;
	color:#212529;
}
.swatch-600 {
	background-color:#6c757d;
	color:#fff;
}
.swatch-700 {
	background-color:#495057;
	color:#fff;
}
.swatch-800 {
	background-color:#343a40;
	color:#fff;
}
.swatch-900 {
	background-color:#212529;
	color:#fff;
}

/* グリッドSass見本 */
.example-container {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 15px;
	padding-left: 15px;
}

.example-row {
	display: flex;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}

.example-content-main {
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	background-color: rgba(86, 61, 124, 0.15);
	border: 1px solid rgba(86, 61, 124, 0.15);
}
@media (min-width: 576px) {
	.example-content-main {
		flex: 0 0 50%;
		max-width: 50%;
	}
}
@media (min-width: 992px) {
	.example-content-main {
		flex: 0 0 66.66667%;
		max-width: 66.66667%;
	}
}

.example-content-secondary {
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	background-color: rgba(86, 61, 124, 0.15);
	border: 1px solid rgba(86, 61, 124, 0.15);
}
@media (min-width: 576px) {
	.example-content-secondary {
		flex: 0 0 50%;
		max-width: 50%;
	}
}
@media (min-width: 992px) {
	.example-content-secondary {
		flex: 0 0 33.33333%;
		max-width: 33.33333%;
	}
}

/* 背景グラデーション */
.bg-gradient-primary {
	background: #007bff linear-gradient(180deg, #268fff, #007bff) repeat-x !important;
}

.bg-gradient-secondary {
	background: #868e96 linear-gradient(180deg, #989fa6, #868e96) repeat-x !important;
}

.bg-gradient-success {
	background: #28a745 linear-gradient(180deg, #48b461, #28a745) repeat-x !important;
}

.bg-gradient-info {
	background: #17a2b8 linear-gradient(180deg, #3ab0c3, #17a2b8) repeat-x !important;
}

.bg-gradient-warning {
	background: #ffc107 linear-gradient(180deg, #ffca2c, #ffc107) repeat-x !important;
}

.bg-gradient-danger {
	background: #dc3545 linear-gradient(180deg, #e15361, #dc3545) repeat-x !important;
}

.bg-gradient-light {
	background: #f8f9fa linear-gradient(180deg, #f9fafb, #f8f9fa) repeat-x !important;
}

.bg-gradient-dark {
	background: #343a40 linear-gradient(180deg, #52585d, #343a40) repeat-x !important;
}


.btn-contact {
  color: #fff;
  background-color: #f7931e;
  border-color: #f7931e;
}

.btn-contact:hover {
  color: #fff;
  background-color: #D37D00;
  border-color: #C07200;
}
/*
.btn-contact:focus, .btn-contact.focus {
  box-shadow: 0 0 0 0.2rem rgba(211,125,0,0.5);
}
*/
.btn-contact.disabled, .btn-contact:disabled {
  color: #fff;
  background-color: #D37D00;
  border-color: #C07200;
}

.btn-contact:not(:disabled):not(.disabled):active, .btn-contact:not(:disabled):not(.disabled).active,
.show > .btn-contact.dropdown-toggle {
  color: #fff;
  background-color: #D37D00;
  border-color: #C07200;
}
/*
.btn-contact:not(:disabled):not(.disabled):active:focus, .btn-contact:not(:disabled):not(.disabled).active:focus,
.show > .btn-contact.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(211,125,0,0.5);
}*/
/* メインのtop位置調整 */
@media (min-width:992px) {
	.chousei {
		margin-top: 0rem;
	}
}
@media (max-width:991px) {
	.chousei {
		margin-top: 2.5rem;
}
}


/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	font-size: 12px;	/*文字サイズ*/
	padding:10px 0px;
	color: #fff;	/*文字色*/
	background: #111;	/*背景色*/
}
/*リンクテキスト*/
footer a {
	color: #b8b8b8;	/*文字色*/
	text-decoration: none;
}
/*リンクのマウスオン時*/
footer a:hover {
	color: #fff;
}
footer .pr {display: block;}

/*フッターメニュー
---------------------------------------------------------------------------*/

/* フッターの表示領域 */



ul.footer_submenu {
	list-style-type: none;
	padding-left: 0;
	text-align: center;
}
 
ul.footer_submenu li {
	display: inline-block;
	padding: 5px 40px;
	font-weight: bold;
}
ul.footer_submenu li a {
	font-size: 15px;
	color: #ffffff;
}
ul.footer_submenu li a:hover{
color: #d67900;
}


/*ボックス全体*/
.footermenu {
	text-align: left;
	font-size:14px;
	line-height:2em;
	overflow: hidden;
	padding: 0px 3% 10px 3%;	/*上下、左右のボックス内の余白*/
	/*background: url(../images/logo_footer.png) no-repeat right center / 20%;*/	/*背景画像の読み込み。右側、上下中央に配置。画像はブロック幅の20%で読み込む。*/
	color: #fff;		/*文字色*/
}
.footermenu a{color: #fff;}
.footermenu a:hover{
		color:#F99273;
	}
.home footer .footermenu.inner {
}

/*１行分の設定*/
.footermenu ul {
	float: left;	/*左に回り込み*/
	width: 100%;		/*幅*/
	padding-right:1%;
	padding-left: 3%;
	list-style: none;
	list-style-position: inside;
}
/*「class="title"」をつけた場合の設定*/
.footermenu li.title {
	display: inline-block;
	font-size: 15px;
	font-weight: bold;	/*太字にする*/
}
.footermenu li.child {
	font-size: 14px;
	padding-left:8px;
}
.child::before{
		padding-right:5px;
  content: "\f105";
  font-family: FontAwesome;
}
.footermenu li.child2 {
	font-size: 14px;
	padding-left:8px;
}
.child2::before{
		padding-right:4px;
  content: "\f107";
  font-family: FontAwesome;
}
.footermenu li.grandchild {
	font-size: 12px;
	padding-left: 12px;
	line-height:1.5em;
	
}

/*さいとまっぷ*/
.sitemap {
	text-align: left;
	font-size:14px;
	line-height:2em;
	overflow: hidden;
	padding: 0px 3% 10px 3%;	/*上下、左右のボックス内の余白*/
	/*background: url(../images/logo_footer.png) no-repeat right center / 20%;*/	/*背景画像の読み込み。右側、上下中央に配置。画像はブロック幅の20%で読み込む。*/
}



/*１行分の設定*/
.sitemap ul {
	float: left;	/*左に回り込み*/
	width: 100%;		/*幅*/
	padding-right:1%;
	padding-left: 3%;
	list-style: none;
	list-style-position: inside;
}
/*「class="title"」をつけた場合の設定*/
.sitemap li.title {
	display: inline-block;
	font-size: 15px;
	font-weight: bold;	/*太字にする*/
}
.sitemap li.child {
	font-size: 14px;
	padding-left:8px;
}
.child::before{
		padding-right:5px;
  content: "\f105";
  font-family: FontAwesome;
	color: #f05a28;
}
.sitemap li.child2 {
	font-size: 14px;
	padding-left:8px;
}
.child2::before{
		padding-right:4px;
  content: "\f107";
  font-family: FontAwesome;
	color: #f05a28;
}
.sitemap li.grandchild {
	font-size: 12px;
	padding-left: 12px;
	line-height:1.5em;
	
}
.grandchild::before{
		padding-right:8px;
  content: "\f105";
  font-family: FontAwesome;
color: #f05a28;
}

/* ここまで　さいとまっぷ*/



.subfoot{
		letter-spacing: 0.1em;
	padding: 12px 0px;
	}	
	.subfoot a{
		color:#fff;
	}
.subfoot a:hover{
		color:#F99273;
	}
.bg-subfoot {
	position: relative;
  background-color: #4D4D4D !important;
}
/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
/*ブロック全体の設定*/
#new dl {
	padding: 0px 20px;	/*上下、左右へのボックス内の余白*/
	margin-bottom: 20px;
}
/*日付設定*/
#new dt {
	float: left;	/*左に回り込み*/
	width: 9em;		/*幅*/
	letter-spacing: 0.1em;
	color: #d69700;	/*文字色*/
}
#new{
	color:rgba(80,80,80,1);
	font-size:16px;
}
#new a{text-decoration:none;}
#new a:hover{color:rgba(80,80,80,0.5);text-decoration:none;}
.time
 {
	float: left;	/*左に回り込み*/
	width: 9em;		/*幅*/
	letter-spacing: 0.1em;
	color: #f7931e;	/*文字色*/
	 font-weight: normal;
	 padding-left: 1.5em;
}
li.dotline {
	border-bottom: 1px dotted #CCCCCC;
	clear:both;
	list-style:none;
	padding-bottom:0px;
}	

.mini-image01{
	background:url(../images/ph02_sm.jpg)

}

#sidebar ul li{
	padding: 10px 0px;
}
.table_about_officce{
	border: 1px #ccc solid;
}
.table_about_officce td{
	padding: 0.5rem;
		
}
.table_about_officce th{
	padding: 0.5rem;
	color: #fff;
	background: #f7931e;
	text-align: center;
}
.table_01{
	border: 1px #fff solid;
}
.table_01 td{
	padding: 1rem;
	background: #fdf5e6;
}
.table_01 th{
	padding: 0.5rem;
	color: #fff;
	background: #f7931e;
	text-align: center;
}
.table_02{
	border: 2px #f7931e solid;
	width: 100%;
}
.table_02 td{
	padding: 1rem;
	background: #fdf5e6;
	border-bottom:solid 1px #f7931e;
}
.table_02 th{
	padding: 0.5rem;
	color: #fff;
	background: #f7931e;
	text-align: center;
	border-bottom:solid 1px #fff;
}


/*//5カラム定義*/
.col-15,.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}
.col-lg-15 {
    width: 20%;
    flex: 0 0 20%;
    float: left;
}
@media (max-width:991px) {
	.col-lg-15 {
    width: 20%;
    flex: 0 0 100%;
    float: left;
}
	
}

/*@media (min-width: map-get($grid-breakpoints, sm)) {
    .col-lg-15 {
        flex: 0 0 100%;
        float: left;
    }
}
@media (min-width: map-get($grid-breakpoints,md)) {
    .col-lg-15 {
        width: 100%;
        flex: 0 0 20%;
        float: left;
    }
    .col-md-offset-15 {
        margin-left: 4.3333333%;
    }
}
@media (min-width: map-get($grid-breakpoints, lg)) {
    .col-lg-15 {
        width: 20%;
        flex: 0 0 20%;
        float: left;
    }
}
*/
.toilet_table th,td{vertical-align: top;	
}


ol.toiletmap {
  counter-reset: li; 
  list-style: none; 
	list-style-position: outside;
	/* この要素はflexコンテナとなり、子要素は自動的にflexアイテムとなる */
  display: flex;

  /* 横並びに表示する */
  flex-direction: row;

  /* 画面幅に収まらない場合は折り返す */
  flex-wrap: wrap;
	
}

.toiletmap li {
  line-height: 1.5;
	margin-bottom: 1.5rem;	

}

ol.toiletmap > li::before {
  margin-right: 1rem;
  content:counter(li) "";
  counter-increment: li;
  font-weight: bold;
}
.toiletmap li a::after {
	content:"　";
	margin-right:0rem;}