/*-------------------------------
# contents.css
---------------------------------
# Module
 = ビューアーソフト枠
 = CMSKITリンクアイコン
 = 新着情報リスト
 = カテゴリーメニュー
 = 画像バナーリスト
 = GoogleMap
 = テキストボックス
 = ライフイベント
 = お問い合わせ先
 = アンケート
# アクセシビリティ＞背景色 
-------------------------------*/
/*-------------------------------
# Module
-------------------------------*/
/*= ビューアーソフト枠
p.viewer-info {	border: 1px solid #CBD2D9;	padding: 1em;}*/
/*Adobe Readerダウンロード枠*/
#viewerInfo {border: 1px solid #CBD2D9;	margin: 30px auto;	padding: 15px ;	font-size:87.5%;	line-height: 1.3;	width: 100%;}
#viewerInfo p{ margin-bottom: 0;}
@media print,screen and (min-width:769px) {
 #viewerInfo {display: flex; gap:20px;	margin: 40px auto;	padding: 15px 20px;}
}

/*=ボタンリスト
--------------------------------*/
.btnList{margin: 0 auto 0px;}
.btnList li,.btnList li a{ color: #3E3026; background-color:transparent; border-radius: 10px;}
.btnList li{ background-color: #FFF; color: #3E3026; border: 2px solid #17820B;font-weight: 700; margin:0 0 10px; list-style: none; line-height: 1.5;}
.btnList li::after{content: none;}
.btnList a { display: flex; height: 100%; align-items: center; justify-content: center; padding:15px 10px; text-decoration: none;}
.btnList a:hover{ background-color: #E8F7D2; color: #3E3026; text-decoration: underline;}
@media print,screen and (min-width:769px) {
 .btnList li{margin: 0 0 20px;}
 .btnList a{ padding: 15px 20px;}
 /*.btnList li{white-space: nowrap;}*/
}

/*
= 画像バナーリスト
-------------------------------*/
.ulImg {	margin : 0 auto 30px;	width: 100%; flex-wrap: wrap;}
.ulImg li{	list-style: none;	margin:0 0 10px; text-align: center;}
.ulImg.bnr3 li{width: 48%;}
.ulImg.bnr4 li{width: 48%;}
#content .ulImg li::after{content: none;}
.ulImg li img{ max-width:100%;width: auto; height: auto;}
.ulImg.bnr2 li{	width: 47.863247863%;}
.ulImg.bnr2{gap: 4.273504273%;}
.ulImg.bnr3{gap: 3.448275862%;}
.ulImg.bnr4{gap: 2.564102564%;}
@media print,screen and (min-width:481px) {
/* end min-width: 481px */ }
@media print,screen and (min-width:769px) {
 .ulImg.bnr3 li{width: 31.034482758%;}
 .ulImg.bnr4 li{width: 23.076923076%;}
 #primary .ulImg li{	margin-bottom: 20px;}
/* end min-width: 769px */ }
.ulImg.inverse-black li::after,
.ulImg.inverse-blue li::after{content: none !important;}

/*=角丸枠
--------------------------------*/
.bgBlueBox,.bgGreenBox{ border-radius: 20px; box-shadow: 0 3px 6px rgba(0,0,0,.16); padding-bottom: 30px;}
.bgBlueBox{background-color: #D7F0FB; color:#3E3026;}
.bgBlueBox a{color: #3E3026; background:#D7F0FB;}
.bgGreenBox{ background-color: #E8F7D2; color:#3E3026;}
.bgGreenBox a{color: #3E3026; background:#E8F7D2;}
/*
 = テキストボックス
-------------------------------*/
/*カラーボックス設定*/
.bgWhite,
.bgBlue,
.bgRed,
.bgGray {	width: 100%;	padding:20px;	margin-bottom: 30px; }
/* コメント */
.bgWhite {	background-color: #FFF; color:#3E3026;	border: 1px solid #CBD2D9;}
.bgWhite p:last-child,
.bgRed p:last-child,
.bgGray p:last-child {	margin-bottom: 0 !important;}
/*レッド*/
.bgRed {	background-color: #FFE2E5; color:#3E3026; border: 1px solid #E1A9AE;}
/*グレー */
.bgGray {	background-color: #F5F5F5; color:#3E3026; border: 1px solid #CBD2D9;}


/*  = 新着情報リスト
-------------------------------*/
.whatsnewList{ background: #E8F7D2; color:#3E3026; margin: 0 auto 60px;	padding:30px; border-radius: 20px;}
#content .whatsnewList .z_wlh{font-size: 125%;font-weight: 700; margin: 0 auto 20px; padding: 0;}
.whatsnewList ul{ background-color: #FFF; color:#3E3026; width: 100%; margin: 0;	max-height:180px;	overflow-y: scroll;}
.allList .whatsnewList ul{max-height:none; overflow: auto;	}
.whatsnewList ul::-webkit-scrollbar{ width: 8px;}
.whatsnewList ul::-webkit-scrollbar-track{ background-color: #FFF; color:#3E3026; border-left: 1px solid #CBD2D9;}
.whatsnewList ul::-webkit-scrollbar-thumb{ background-color: #9DCC2D;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; color:#3E3026;}
.whatsnewList li{	border-bottom: 1px dashed #CBD2D9;	display:block;	list-style: none; font-size: 88.888888888% /*16px*/; margin: 0;	padding: 10px;	position: relative;}
.whatsnewList li::before,
#content .whatsnewList li::after{content: none;}
.whatsnewList li a:hover{text-decoration: underline;}
.whatsnewList li > span{ color: #17820B; background-color:transparent; display: block;	width: 100%;}
.whatsnewList li img{	height: 14px;	}
.whatsnewList li.catelist a{	display: block;	padding-left: 10px;}
@media print,screen and (min-width:769px) {
.whatsnewList .z_wlh{font-size: 150%/*24px*/; margin: 0 auto 20px;}
.whatsnewList li span { display: inline-block; width: 140px; margin-left: 5px; margin-right: 15px;}
}

/* = カテゴリーメニュー
---------------------*/
.catBox {margin-bottom: 40px;}
.catBox h2:first-child{margin-top: 0;}
.catBox h2{background: #F5F5F5; color:#3E3026; border:1px solid #CBD2D9; border-radius: 10px; padding: 20px 30px; position: relative;}
.catBox h2::before{content: none;}
.catBox h2 a {display: block; background: #F5F5F5; color:#3E3026; text-decoration: none; padding-right: 40px; position: relative;}
.catBox h2 a:hover { text-decoration: underline;}
.catBox h2 a::after{ content: ""; position: absolute; top:0; right: 0; bottom: 0; margin: auto; width: 12px;	height: 12px;	border-top: 3px solid #17820B;	border-right: 3px solid #17820B;	-webkit-transform: rotate(45deg);	transform: rotate(45deg);}
.catBox li,
.catelist,
.linkList{list-style: none; line-height: 1.5; position: relative; }
.catBox > li,
.catelist > li,
.linkList > li{font-size: 112.5%;}
.catBox li ul{margin-top: 10px;} 
.linkList{margin-bottom: 30px;}

/*= 各課ヘッダー画像
----------------------------------*/
#contentsIMG{text-align: center; margin-bottom: 40px;}
#contentsIMG:empty{display: none;}

/*= 各課お知らせ
----------------------------------*/
.panel.panel-success{ margin-bottom: 60px;}
.panel-heading{border-radius: 10px 10px 0 0; background: #F5F5F5; color:#3E3026; border:1px solid #E4E4E4; border-bottom: 0;  padding: 10px 20px; font-weight: 700; font-size: 112.5%;}
.panel-body{border: 1px solid #E4E4E4; border-radius: 0 0 10px 10px; padding: 20px 20px 0;}
@media print,screen and (min-width:769px) {
 .panel.panel-success{ margin-bottom: 60px;}
}

/*= 各課の業務内容
----------------------------------*/
.kakukatop-gyoumu { margin-bottom: 40px; margin-top:40px; }
.kakukatop-gyoumu h2 {border-radius: 10px 10px 0 0; padding: 15px; margin-bottom: 0; font-size: 125%;}
.kakukatop-gyoumu dl {border: 1px solid #E8F7D2; border-top: none;}
.kakukatop-gyoumu dt,
.kakukatop-gyoumu dd{width: 96%; margin: 0 auto;}
.kakukatop-gyoumu dt { padding-top: 10px;}
.kakukatop-gyoumu dd { border-bottom: 1px solid #E8F7D2; padding:0 0 10px;}
.kakukatop-gyoumu dd:last-child{border: none; margin-bottom: 0;}
@media print,screen and (min-width:769px) {
 .kakukatop-gyoumu { margin-top:60px; }
 .kakukatop-gyoumu h2 {padding: 20px;}
}

/*= お問い合わせ
----------------------------------*/
.box_info_bottom {}
.box{	margin-top: 30px;	background-color: #F5F5F5; color:#3E3026; border: 1px solid #CBD2D9; padding: 20px;}
.box_info_bottom h2{padding: 0; background: 0; margin-bottom: 10px; font-size: 100%;}
.box_info_bottom p:last-child{margin-bottom: 0 !important;}
.box_info_bottom .spBr{display: block;}
@media print,screen and (min-width:769px) {
 .box_info_bottom {	margin-top: 40px;}
 .box_info_bottom .spBr{display: inline-block;}
}

/*= 最終更新日
----------------------------------*/
.alert-day,.alert-day2 { text-align: right; font-size: 87.5%;	padding: 5px; margin-top: 10px;	margin-bottom: 0px;}

/*= ライフイベント
----------------------------------*/
#lifeEvent { gap:1.71%;	position: relative; margin: 0 auto 20px; flex-wrap: wrap; justify-content: flex-start;}
#lifeEvent li{font-size:100%;	list-style: none;	max-width:125px; width: 23.5%; padding: 0;	margin-bottom:20px;	line-height: 1.1; text-align: center; font-weight: 700; letter-spacing: -1px; margin-left: 0;}
#lifeEvent li::after{content: none !important;}
#lifeEvent a{ display: block; }
#lifeEvent a:hover{ text-decoration: none; }
#lifeEvent a img{display: block; border: 1px solid #FFF; border-radius: 62.5px; box-shadow: 2px 2px 5px rgba(0,0,0,.2); margin:0 auto 15px;}

@media print,screen and (min-width:769px) {
 #lifeEvent { justify-content: center;margin-bottom: 50px; flex-wrap: nowrap; }
 .home #lifeEvent{margin-bottom: 80px}
 #lifeEvent li{font-size: 112.5%; width: 10.68376%; letter-spacing: -2px;}
 #lifeEvent a:hover{opacity: .8;}
}

/*---------------------------
# アンケート
---------------------------*/
#surveyBox { width: 100%; margin: 60px auto 0; border: solid 1px #CBD2D9; padding:30px 10px 20px; position: relative;}
#surveyBox .row{width: 100%; justify-content: center; align-items: center; text-align: center;}
/*.oneCol #surveyBox{margin:40px auto;}*/
#formTit{position: absolute; top: -10px; right: 0; left: 0; margin: auto;text-align: center;}
#formTit h2{font-size: 100%; margin-top: 0; margin-bottom: 0 !important; display: inline; background: #FFF; color: #3E3026; padding: 0 10px; }
#surveyBox #txt{margin: 0; padding: 0; font-size: 93.75%; border-bottom: none; color: #3E3026; background-color: transparent; font-weight: 500;}
#surveyBox legend{display: contents;}
#surveyBox input[type="radio"] { opacity: 0; position: absolute; }/*
#surveyBox label input[type="radio"]:nth-child(2){visibility: hidden;}*/
#surveyBox label{ position: relative; display: flex; line-height: 1.5; padding-left: 30px; cursor: pointer;}
#surveyBox label::before,
#surveyBox label::after{content: ""; position: absolute; top: 4px; left: 5px; width: 18px; height: 18px; border-radius: 15px; background: #17820B; }
#surveyBox label::before{border: 2px solid #757575; background: #fff; display: inline-block; }
#surveyBox label::after { background: #17820B; opacity: 0; transition: all .3s; z-index: 1;}
#surveyBox input[type="radio"]:hover ~ label::before,
#surveyBox input[type="radio"]:focus ~ label::before { border: 2px solid #17820B; background: #E8F7D2; color: #3E3026;}
#surveyBox input[type="radio"]:checked ~ label::after { opacity: 1;}
/*submit*/
#surveyBox #submitBtn{ margin: 10px auto 0; display: block; border: solid 1px #9DCC2D; background: #FFF; color: #3E3026; padding: 10px 15px; text-align: center; cursor: pointer; border-radius: 5px; outline: none; justify-content: center; min-width:120px;}
#surveyBox #submitBtn:focus,
#surveyBox #submitBtn:hover{border: solid 1px #17820B; background: #9DCC2D; color: #3E3026;}
/*System*/
#surveyBox #mfp_hidden { overflow: hidden;width: 1px;height: 1px;padding: 0; margin: 0;}
#surveyBox #mfp_warning {color: #036D9C; background-color: transparent;line-height: 1.5; font-size: 87.5%; display: none; margin: 0 auto 10px; text-align: center;}
div#mfp_overlay { position: absolute; display: none; z-index: 10001;}
div#mfp_overlay_inner { background-color: #FFF; color: #3E3026; padding: 15px; margin: 0px auto; border-radius: 5px; width: 640px; max-width: 90%;}
div#mfp_overlay_background { background:rgba(0,0,0,.3); color: #3E3026; position: absolute; display: none; z-index: 10000;}
div#mfp_loading_screen { z-index: 20000; opacity: 0.8; display: none; background:rgba(0,0,0,.3); color: #3E3026; position: absolute;}
div#mfp_loading { z-index: 20001; position: absolute; display: none; width: 40px; height: 40px; background-image: url(../images/mfp_loading.gif);}
.mfp_ok { background-color: rgba(0,255,0,0.1);  color: #3E3026;}
.mfp_ng { background-color: rgba(255,0,0,0.1); color: #3E3026;}
.mfp_err:empty{display: none;}
.mfp_err{display: block; color: #17820B;background-color: transparent; width: 100%; text-align: center;}
@media print, screen and (max-width: 768px) {
 #surveyBox #txt,
 #formBox{ width: 90%; margin: 0 auto; text-align: center; flex-wrap: wrap; }
 #surveyInner { justify-content: center;}
 #content #txt{text-align: center; margin-bottom: 10px; border-bottom: none;}
}
@media print, screen and (min-width: 769px) {
 #formBox{display: flex; align-items: center; justify-content: center; gap:20px; flex-wrap: wrap;}
}

/*---------------------------
# アクセシビリティ＞背景色
---------------------------*/
/*色設定*/
.inverse-blue {
	background-color: #22568f !important;
	color: #FFF !important;
	border-color: #FFF !important;
	/*background-image: none !important;*/
}
.inverse-black {
	background-color: #3E3026 !important;
	color: #FFF !important;
	border-color: #FFF !important;
	/*background-image: none !important;*/
}
.inverse-blue::before,
.inverse-black::before,
.inverse-blue *::before,
.inverse-black *::before,
.inverse-blue *::after,
.inverse-black *::after{content:none !important;}

/*除外*/
.flex-pauseplay *::before,
.reg::before,
.reg::after,
.reg *::before,
.reg *::before,
.reg *::after,
.reg *::after{content:"" !important;}
#siteTitle.inverse-blue *,
#siteTitle.inverse-black *,
#fLogo.inverse-blue *,
#fLogo.inverse-black *,
#pcLink.inverse-blue *,
#pcLink.inverse-black *{background: #FFF !important; color:#3E3026;}

