@charset "utf-8";
/* CSS Document */
/* -------------------------------------------------------------------------

トップページ

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

/* グローバルナビ（トップページ用多階層）
-------------------------------------------*/
ul.toppage-globalNav {	
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 780px;
	}	
ul.toppage-globalNav {	
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
	}
	
ul.toppage-globalNav li {
	width: 110px;
	font-size: 75%;
	text-align: center;
    display: flex;
	position:relative;
	}
ul.toppage-globalNav li a {
	width: 110px;
	padding: 2px 0;
	color: #211100;
	font-weight: normal;
	text-decoration: none;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	background-color: #dacebb;
	position:relative;
	z-index: 300;
	}
ul.toppage-globalNav li a:hover {
	color: #fff;
	background-color: #726250;
	}


/**　ドロップダウン部分  **/
ul.toppage-globalNav li ul li {
	width: 160px;
	font-size: 100%;
}

ul.toppage-globalNav li ul.secondMenu li a{
	display:block;
	background-color: #726250;
	color: #fff;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
ul.toppage-globalNav li ul.secondMenu li a:hover{
	background-color: #48331b;
}

ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li a,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu ul li a {
	display:block;
	background-color: #48331b;
	color: #fff;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li a:hover,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu ul li a:hover{
	background-color: #48331b;
	color: #f6b37f;
}

ul.toppage-globalNav li ul.secondMenu{
	top:0;
	left: 0;
	position:absolute;
	z-index: 300;
	visibility: hidden;
	opacity: 0;
/*	transition: .2s ease-out; */
	width:0;
	height:0;
}
ul.toppage-globalNav li:hover ul.secondMenu{
	visibility: visible;
	opacity: 1;
	width:inherit;
	height:inherit;
	top: 100%;
	point:cursor;
}

ul.toppage-globalNav li ul.secondMenu li a,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li a,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu ul li a{
	padding: 4px 16px 4px 8px;
	font-size: 100%;
	text-align: left;
	width: 160px;
}

ul.toppage-globalNav li ul.secondMenu li.thirdMenu,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu{
	position:relative;
}

ul.toppage-globalNav li ul.secondMenu li.thirdMenu > a:after,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu > a:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 6px;
	height: 6px;
	margin: -4px 0 0 0;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
ul.toppage-globalNav li:last-child ul.secondMenu li.thirdMenu > a:after,
ul.toppage-globalNav li:last-child ul.secondMenu li.thirdMenu ul li.fourthMenu > a:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 6px;
	height: 6px;
	margin: -4px 0 0 0;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(225deg);
	transform: rotate(225deg);
}

ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu ul{
	visibility: hidden;
	opacity:0;
	position:absolute;
	top:0;
	left: 160px;
}
ul.toppage-globalNav li:last-child ul.secondMenu li.thirdMenu ul,
ul.toppage-globalNav li:last-child ul.secondMenu li.thirdMenu ul li.fourthMenu ul{
	visibility: hidden;
	opacity:0;
	position:absolute;
	top:0;
	left: -160px;

}

ul.toppage-globalNav li ul.secondMenu li.thirdMenu:hover ul,
ul.toppage-globalNav li ul.secondMenu li.thirdMenu ul li.fourthMenu:hover ul{
	point:cursor;
	visibility: visible;
	opacity: 1;	
}

/*---------------------------------------------------------------------------*/
/*　コンテンツの内容枠　*/
#toppage-main-contents {
	display: block;
	position: relative;
	margin: 1em auto 3em;
	padding: 0;
	width: 980px;
/*	overflow: hidden; */
}
#toppage-main-contents:before, #page-main-contents:after {
	content: "."; 
	display: block;
	height: 0;
	overflow: hidden;
}
#toppage-main-contents:after {
	clear: both;
}

/*　内容包括　*/
.toppage-container {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	width: 988px;
}
.toppage-container li a {
	text-decoration: none;
	color: #111111;
}
.toppage-container li a:hover {
	text-decoration: none;
	color: #d03b00;
	}
	
/* 記事がない、もしくは文字のみの場合*/	
.contents-txt {
	display: block;
	margin: 0;
	padding: 8px 8px;
	overflow: auto;
	height: 128px;
	font-size: 75%;
	background-color: #fcf5ea;
	}

/*　記事一覧へ */
.all-list { display: none;}

/*　コンテンツ　*/
.toppage-contents-list,
.toppage-contents-menu,
.toppage-contents-image {
	position: relative;
	display: block;
	margin: 0 7px 10px 0;
	padding: 0;
	overflow: hidden;
	width: 240px;
	background-color: #fcf5ea;
	border: #D0D0D0 1px solid;
	}

/*　コンテンツタイトル　*/
.toppage-contents-list h2,
.toppage-contents-menu h2,
.toppage-contents-image h2 {
	display: block;
	margin: 0;
	padding: 2px 0 2px;
	min-height: 2em;
	font-size: 100%;
	background-color: #835b3b;
	color: #fff;
	text-align: center;
	}
.toppage-contents-list h2.ic,
.toppage-contents-menu h2.ic,
.toppage-contents-image h2.ic {
	padding: 2px 32px 2px;
	}
.toppage-contents-list h2 span,
.toppage-contents-menu h2 span,
.toppage-contents-image h2 span {
	font-size: 75%;
	border: #fff 1px solid;
	border-radius: 16px;
	margin-left: 8px;
	padding: 0 4px;
}
.toppage-contents-list h2 a,
.toppage-contents-menu h2 a,
.toppage-contents-image h2 a {
	text-decoration: none;
	color: #ffffff;
}
.toppage-contents-list .ic-link,
.toppage-contents-menu .ic-link,
.toppage-contents-image .ic-link {
	display: block;
	position: absolute;
	top:0;
	right:0;
	}
.toppage-contents-list .ic-link a:hover img,
.toppage-contents-menu .ic-link a:hover img,
.toppage-contents-image .ic-link a:hover img {
	opacity:1;
	}
.toppage-contents-list .ic-rss,
.toppage-contents-menu .ic-rss,
.toppage-contents-image .ic-rss {
	display: block;
	position: absolute;
	top: 4px;
	left: 4px;
	}

/*　コンテンツ（リスト形式）　*/
.toppage-contents-list ul {
	display: block;
	margin: 0;
	padding: 0;
	overflow: auto;
	height: 128px;
	list-style-type: none;
	background-color: #fcf5ea;
	}
.toppage-contents-list ul li {
	margin: 0;
	padding: 0;
	font-size: 75%;
	line-height: 1.2;
	border-bottom: #D0D0D0 1px solid;
	}
.toppage-contents-list ul li a {
	display: block;
	padding: 8px 8px;
	}
.toppage-contents-list ul li.nolink {
	display: block;
	padding: 8px 8px;
	}
	
	
/*　コンテンツ（メニュー形式）　*/
.toppage-contents-menu ul {
	display: block;
	margin: 0;
	padding: 0;
	overflow: auto;
	height: 128px;
	list-style-type: none;
	background-color: #fcf5ea;
	}
.toppage-contents-menu ul li {
	margin: 0;
	padding: 0;
	font-size: 100%;
	border-bottom: #D0D0D0 1px solid;
	}
.toppage-contents-menu ul li a {
	display: block;
	padding: 8px 8px;
	}
.toppage-contents-menu ul li.nolink {
	display: block;
	padding: 8px 8px;
	}

/*　コンテンツ（画像形式）　*/
.toppage-contents-image .img-icon {
	display: block;
	margin: 0;
	padding: 4px 0 0;
	height: 128px;
	background-color: #D9BC9F;
	text-align: center;
	}
.toppage-contents-image .img-icon-nobg {
	display: block;
	margin: 0;
	padding: 4px 0 0;
	height: 128px;
	background: #ffffff;
	text-align: center;
	}
	
.toppage-contents-image .img-icon img,
.toppage-contents-image .img-icon-nobg img{
	margin: 0;
	padding: 0;
	width: auto;
	height: auto;
	max-height: 120px;
	}

.accmenu { display: block }


/* ドロワーメニュー
-------------------------------------------*/
.toppage-menu-btn1,
.toppage-menu-btn2,
.toppage-menu-btn3,
.toppage-menu-btn4,

.toppage-menu-btn6,
.toppage-menu-btn7,
.toppage-menu-btn8,
.toppage-menu-btn9,
.toppage-menu-btn10,
.toppage-menu-btn11,
.toppage-menu-btn12 {
    background: url(../img/menu-pc-close.png) no-repeat right 0;
    display: block;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 200;
}
.peke1,
.peke2,
.peke3,
.peke4,
.peke5,
.peke6,
.peke7,
.peke8,
.peke9,
.peke10,
.peke11,
.peke12 {
    background: url(../img/menu-pc-open.png) no-repeat right 0;
}
.toppage-menu-drawer1,
.toppage-menu-drawer2,
.toppage-menu-drawer3,
.toppage-menu-drawer4,
.toppage-menu-drawer5,
.toppage-menu-drawer6,
.toppage-menu-drawer7,
.toppage-menu-drawer8,
.toppage-menu-drawer9,
.toppage-menu-drawer10,
.toppage-menu-drawer11,
.toppage-menu-drawer12 {
    display: none;
	background: rgba(82,47,7,0.8);
    position: absolute;
/*  top: 0; */
    right:0;
    width: 90%;
	height: 128px;
	overflow: auto;	
    padding: 0;
    z-index: 100;
}

ul#toppage-menu1,
ul#toppage-menu2,
ul#toppage-menu3,
ul#toppage-menu4,
ul#toppage-menu5,
ul#toppage-menu6,
ul#toppage-menu7,
ul#toppage-menu8,
ul#toppage-menu9,
ul#toppage-menu10,
ul#toppage-menu11,
ul#toppage-menu12 {
	margin: 0;
	padding: 0;
	overflow: auto;
	list-style-type: none;
	height: auto;
	background: none;
	}
ul#toppage-menu1 li,
ul#toppage-menu2 li,
ul#toppage-menu3 li,
ul#toppage-menu4 li,
ul#toppage-menu5 li,
ul#toppage-menu6 li,
ul#toppage-menu7 li,
ul#toppage-menu8 li,
ul#toppage-menu9 li,
ul#toppage-menu10 li,
ul#toppage-menu11 li,
ul#toppage-menu12 li {
	display: block;
	margin: 0;
	padding: 0;
	font-size: 88%;
	line-height: 1.2;
	border-bottom: none;
	}
#toppage-menu1 li a,
#toppage-menu2 li a,
#toppage-menu3 li a,
#toppage-menu4 li a,
#toppage-menu5 li a,
#toppage-menu6 li a,
#toppage-menu7 li a,
#toppage-menu8 li a,
#toppage-menu9 li a,
#toppage-menu10 li a,
#toppage-menu11 li a,
#toppage-menu12 li a {
	color: #fff;
    display: block;
	padding: 8px 16px 8px 8px;
	text-decoration: none;
    background: url(../img/arrow-toppage-menu.png) no-repeat right 50%;
	}
#toppage-menu1 li a:hover,
#toppage-menu2 li a:hover,
#toppage-menu3 li a:hover,
#toppage-menu4 li a:hover,
#toppage-menu5 li a:hover,
#toppage-menu6 li a:hover,
#toppage-menu7 li a:hover,
#toppage-menu8 li a:hover,
#toppage-menu9 li a:hover,
#toppage-menu10 li a:hover,
#toppage-menu11 li a:hover,
#toppage-menu12 li a:hover {
    display: block;
	text-decoration: none;
	background-color: #361F05;
	}



/*　スライドバナー
-------------------------------------------*/
/*　内容包括（スライドバナー）　*/
.toppage-container-slide {
  display: block;
}


/*　その他・バナー広告
-------------------------------------------*/
/*　内容包括（その他・バナー）　*/
.toppage-container-sub {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	width: 988px;
}
.toppage-container-sub li a,
.toppage-container-sub p a {
	text-decoration: none;
	color: #111111;
}
.toppage-container-sub li a:hover,
.toppage-container-sub p a:hover {
	text-decoration: none;
	color: #d03b00;
	}
.toppage-container-sub p {
	display: block;
	padding: 8px 8px;
	font-size: 75%;
	}
	
/*　注意書き　*/
.toppage-container-sub p.attention {
	padding: 0;
	font-size: 75%;
	text-align: center;
}

/*　有料広告募集　*/
.toppage-container-sub p.linktext {
	font-size: 88%;
	padding: 0;
	padding-right: 1em;
	text-align: right;
}
.toppage-container-sub p.linktext a {
	text-decoration: underline;
}
.toppage-container-sub p.linktext a:hover {
	text-decoration: none;
}


/*　その他コンテンツ　*/
.toppage-contents-sub {
	position: relative;
	display: block;
	margin: 0 7px 10px 0;
	padding: 0;
	overflow: hidden;
	width: 240px;
	background-color: #fcf5ea;
	border: #D0D0D0 1px solid;
	}
/*　その他コンテンツタイトル　*/
.toppage-contents-sub h2 {
	display: block;
	margin: 0;
	padding: 2px 0 2px;
	min-height: 2em;
	font-size: 100%;
	background-color: #835b3b;
	color: #fff;
	text-align: center;
	}
/*　その他コンテンツメニュー　*/
.toppage-contents-sub ul {
	display: block;
	margin: 0;
	padding: 0;
	overflow: auto;
	height: 128px;
	list-style-type: none;
	background-color: #fcf5ea;
	}
.toppage-contents-sub ul li {
	margin: 0;
	padding: 0;
	font-size: 100%;
	border-top: #D0D0D0 1px solid;
	}
.toppage-contents-sub ul li a{
	display: block;
	padding: 8px 8px;
	}	
.toppage-container-sub ul li.nolink {
	display: block;
	padding: 8px 8px;
	}

/*　バナー広告　*/
.toppage-contents-banner {
	position: relative;
	display: block;
	margin: 0 0 10px;
	padding: 0;
	overflow: hidden;
	width: 734px;
}
.bannerWrap {
	display: flex;
	flex-flow: row wrap;
	width: 741px;
}
.bannerWrap .top-banner {
	margin: 0 7px 10px 0;
	padding: 0;
	width: 240px;
}
.bannerWrap .comp {/* for SHIRASAGI customize for safety */
	margin: 0 7px 10px 0;
	padding: 0;
	width: 240px;
}
.bannerWrap .ss-image-box-item {/* for SHIRASAGI default */
	margin: 0 7px 10px 0;
	padding: 0;
	width: 240px;
	display: inline-block;
}
.bannerWrap img {/* for SHIRASAGI */
	max-width: 100%;
}
.bannerWrap .bancaption {/* for SHIRASAGI customize */
	display: none;
}

/* 緊急情報
-------------------------------------------*/
#emergency {
	background-color: #fcf5ea;
	border: 3px solid  #c82828;
	margin: 10px auto;
	width: 980px;
}
#emergency h2 {
	background-color: #c82828;
	color: #fff;
	font-size: 1.2em;
	padding: 0.3em;
	text-align: center;
}
#emergency ul {
	list-style-type: none;
}
#emergency ul li {
	border-bottom: #D0D0D0 1px solid;
}
#emergency ul li:last-child {
	border-bottom-width: 0px;
}

#emergency a {
	color: #111111;
	display: block;
	padding: 0.8em 1em 0.6em 1em;
	text-decoration: none;
}
#emergency a:hover {
	color: #d03b00;
	text-decoration: none;
}
/*　タイトルにリンクがない場合の余白　*/
#emergency .no-link {
	padding: 0.8em 1em 0.6em 1em;
}
/*　日付とタイトルを囲み、横並びにするためのdiv　*/
#emergency ul li div.emergency-item {
	display: flex;
}
/*　日付　*/
#emergency ul li .date {
	display: block;
	margin-right: 0.5em;
	width: 10em;
}
/*　タイトル　*/
#emergency ul li .title {
	display: block;
	width: 100%;
}
/*　一覧へのリンク　*/
#emergency .all-list {
	display: block;
	text-align: right;
}


/* 特設バナーエリア（令和６年能登半島地震関連情報用に追加したエリア）
-------------------------------------------*/
#special_bnr,
#special_bnr * {
	box-sizing: border-box;
}
#special_bnr {
	background-color: #fcf5ea;
	border: 1px solid #D0D0D0  ;
	margin: 20px auto 10px;
	width: 980px;
}
#special_bnr h2 {
	background-color: #835b3b;
	color: #fff;
	font-size: 1.2em;
	padding: 0.3em;
	text-align: center;
}
#special_bnr ul {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 10px 20px;
}
#special_bnr ul li {
	background-color: #F2DCCA;
	border: 1px solid #d9bc9f;
	border-radius: 6px;
	margin: 5px 10px;
	text-align: center;
	width: calc(100% / 3 - 20px);
	display: flex;
	align-items: center;
}
#special_bnr ul li:hover {
	opacity: 0.8;
}
#special_bnr ul li a {
	color: #211100;
	display: block;
	padding: 10px 10px 10px 10px;
	text-decoration: none;
	width: 100%;
}