@charset "utf-8";


/*slide.cssの読み込み*/
@import url(slide.css);

@import "https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css";
/*PC・タブレット・スマホ共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
body {
	margin: 0px;
	padding: 0px;
	color: #333;	/*全体の文字色*/
	font-family: "メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	font-size: 16px;	/*文字サイズ*/
	line-height: 2;		/*行間*/
	background: #125ABE;	/*背景色*/
	-webkit-text-size-adjust: none;
}
h1,h2,h3,h4,h5,p,ul,ol,li,form,figure,form,select,input,textarea {margin: 0px;padding: 0px;font-size: 100%;}
ul {list-style-type: none;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}
iframe {width: 100%;}
video,audio {max-width: 100%;}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #333;		/*リンクテキストの色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
	color: #779eec;			/*マウスオン時の文字色*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}



/*containerの設定（footer以外の、ホームページを囲むブロック）
下の「1450px以下の設定」にあるbody.is-fixed #menubarのmarginの数字と合わせておく。
---------------------------------------------------------------------------*/
#container {
	width: 94%;
	background-color: #fff;
	max-width: 1400px;
	margin: 40px auto 0 auto;
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	position: relative;
	margin: 0 auto;
	height: 120px;	/*ヘッダーの高さ*/
}
/*ロゴ画像*/
header #logo {
	width: 350px;		/*ロゴ画像の幅*/
	position: absolute;
	left: 2%;		/*ヘッダーブロックの左からの配置指定*/
	top:20px;	/*ヘッダーブロックの下からの配置指定*/
}
/*ADD_TELブロック*/
header address {
	font-style: normal;
	position: absolute;
	right: 2%;		/*ヘッダーブロックの右からの配置指定*/
	top: 30px;	/*ヘッダーブロックの下からの配置指定*/
	text-align: center;	/*内容をセンタリング*/
	line-height: 1.5;	/*行間を少し狭く*/
}



/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロックの設定*/
#menubar {
	width: 90%;
	margin: 0;
	padding: 0 5%;
	position: relative;
	height: 110px;
	border-bottom: 1px solid #125ABE;
	
}
/*メニュー１個あたりの設定*/
#menubar li {
	float: left;	/*左に回り込み*/
	width: 16.66%;	/*メニュー幅（100÷6個=16.66%）　もし４個にするなら100÷4=25%になる。*/
	line-height: 2.2em;	/*行間を少しだけ狭く*/
	font-size: 15px;
}
#menubar li a {
	text-decoration: none;display: block;
	text-align: center;
	height: 60px;		/*高さ*/
	padding-top: 15px;	/*上に追加する余白*/
	color: #666;		/*文字色*/
	
}
#menubar li a:hover{
	color: #125ABE;
}

/*飾り*/
#menubar li span {
	display: block;
}
#menubar li span img{
	width: 50px;
}
#menubar li span :hover{
	-webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
}
/*マウスオン時と、現在表示中(current)のメニューの設定*/
#menubar li a:hover, #menubar li.current a {
	background: #fff;	/*背景色*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}

/*ドロップダウンメニューの親メニュー*/
#menubar a.cursor-default {
	cursor: default;	/*マウスオーバー時に通常のカーソルになるように*/
	color: #999;		/*文字色*/
}

/*ドロップダウンメニュー用
----------------------------------------------------------------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar ul.ddmenu {
	position:absolute;
	height: auto;
	width: 13.6%;	/*ブロックの幅*/
	border-radius: 10px;	/*角丸のサイズ*/
	padding: 20px 0;			/*ブロック内の余白*/
	font-size: 14px;		/*文字サイズ*/
	text-align: left;		/*文字を左よせ*/
	box-shadow: 2px 2px 8px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、広げる幅、0,0,0は黒の事。0.2は20%透明度。*/
	z-index: 100;
	margin:  25px 1.5% 0 1.5%;
	background: #9BC8F9;
}

#menubar ul.ddmenu::before {
	content: "▲";
	font-size: 16px;
	position: absolute;
	top: -18px;
	left: 45%;
	color: #9BC8F9;
}
/*ドロップダウンメニューの出現アニメーション*/
#menubar li:hover ul.ddmenu {
	animation-name: opa1;		/*keyframes.cssで使う@keyframesの指定*/
	animation-fill-mode: both;
	animation-duration: 0.5S;	/*アニメーションを実行する時間。「s」は秒の事。*/
	animation-delay: 0.1s;		/*出現するタイミング（秒後）*/
}
/*メニュー１個あたりの設定*/
#menubar ul.ddmenu li {
    width: 100%;
	float: none;
	display: inline-block;
	padding:0;
}
#menubar ul.ddmenu li a {
	height: auto;
	padding: 10px 20px;	/*メニューテキスト同士の余白*/
	color: #fff;	/*文字色*/
	text-align: left;
}
#menubar ul.ddmenu li a:hover {
	color:#1C5BA0;
}

/*fixmenu。メインメニューが画面上部に到達した際の設定
---------------------------------------------------------------------------*/
/*fixmenuブロック*/
body.is-fixed .nav-fix-pos {
	width: 100%;z-index: 100;position: fixed;top: 0;left: 0;
	background-color: rgba(255,255,255,0.90)
}
/*headerブロック*/
body.is-fixed header {
	margin-bottom: 0px;	/*メインメニューのheight(75)とmargin-bottom(20)を足した数字にする*/
}

/*LOADING----------------------------*/
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color:#125ABE;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
.spinner {
  width: 100px;
  height: 100px;
  margin: 200px auto;
  background-color: #fff;
  border-radius: 100%;
  animation: sk-scaleout 2.0s infinite ease-in-out;
}
/* Loading Animation */
@keyframes sk-scaleout {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1.0);
    opacity: 0;
  }
}
/* Hide Loading Block */
.loaded {
  opacity: 0;
  visibility: hidden;
}

@media screen and (max-width: 900px){   
  .pc { display:block; }
  .tb { display:none; } 
  .sp { display:none; }
}

@media screen and (min-width: 481px){   
  .pc { display:block; }
  .sp { display:none; }
}
@media screen and (max-width: 480px){   
  .pc { display:none; }
  .sp { display:block; }
}

/*コンテンツ（mainとsubブロックを囲むボックス）
---------------------------------------------------------------------------*/
#contents {
	clear: both;
	padding: 40px 0;
}

/*メインコンテンツ
---------------------------------------------------------------------------*/
/*メインコンテンツブロック*/
#main {
	width: auto;		/*ボックス幅*/
}

/*トップコンセプト*/
.top_concept{
	width: 90%;
	margin: 0 auto;
	background-image: url("../images/maria.png");
	background-repeat: no-repeat;
	background-position: right;
	background-size:contain;
	
}
.concept_copy{
	width: 70%;
	padding: 5% 2%;
	font-size: 18px ;
	color: #444;
	line-height: 2.2em;
	text-align: left;
	background-image: url("../images/top_concept_bg.png");
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 80%;
}
.concept_copy p{
	padding-left: 20px;
	padding-bottom: 50px;
}
.concept_copy img{
	width: 90%;
	margin-bottom: 40px;
}
/*トップバナー*/
.top_bnr{
	width: 86%;
	margin: 30px auto;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}
.top_bnr_item{
	width: 31%;
}
.top_bnr_item2{
	width: 60%;
}
.top_bnr_item img{
	border-radius: 13px;
}
.top_bnr_item2 img{
	border-radius: 13px;
}
.bnr_1{
	border: #55AC94 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}
.bnr_2{
	border: #719039 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}
.bnr_3{
	border: #406AA2 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}
.bnr_3 img{
border-radius: 15px;
	width: 100%;
}

.top_bnr_item:hover {
	-webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
	filter: opacity(0.8);

}
.top_bnr_item2:hover {
	-webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
	filter: opacity(0.8);

}

/*トップnews*/
.news_area{
	width: 100%;
	padding: 0;
	border-top: 1px solid #125ABE;
	margin: 30px 0 0 0;
}
.top_news{
	width: 75%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	padding: 20px 60px;
	background-color: #FAEBDB;
	border-radius: 15px;
	height: auto;
}
.top_news dl{
	width: 100%;
	display: flex;
	flex-direction: row;
}
.top_news dt{
	font-size:15px;
	color: #125ABE;
	line-height: 1.0em;
	

}
.top_news dd{
	font-size:15px;
	color: #666;
	line-height: 1.0em;
	margin-left: 20px;
}
/*おしらせ*/
.top_news_cat1{
	font-size:14px;
	background-color: #fff;
	text-align: center;
	margin: 0 0 0 20px;
	border: 2px solid #F29A37;
	color: #F29A37;
	padding: 0 20px;
	border-radius: 20px;
}
/*おたより*/
.top_news_cat2{
	font-size:14px;
	background-color: #fff;
	text-align: center;
	margin: 0 0 0 20px;
	border: 2px solid rgba(34,153,193,1.00);
	color: rgba(34,153,193,1.00);
	padding: 0 20px;
	border-radius: 20px;
}
/*ブログ*/
.top_news_cat3{
	font-size:14px;
	background-color: #fff;
	text-align: center;
	margin: 0 0 0 20px;
	border: 2px solid #31953C;
	color: #31953C;
	padding: 0 20px;
	border-radius: 20px;
}

.top_news_ttl{
	margin: 30px 0 20px 8%;
	width: 84%;
	
}





/*フッター設定
---------------------------------------------------------------------------*/
/*footerボックス*/
footer {
	clear: both;
	overflow: hidden;
	
	background: #fff;	/*背景色*/
	padding-top: 20px;	/*上に空けるボックス内の余白*/
}





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

.footermenu {
	clear: both;
	overflow: hidden;
	display: flex;
	flex-direction: row;
	justify-content: center;
	padding: 0 0 10px 0;
	border-top: 1px solid #125ABE;	/*上の線の幅、線種、色*/
}
.footermenu_item{
	margin: 0 10px;
}
.footermenu_item img{
	height: 35px;
	margin: 0 10px;
}
/*リンクテキスト*/
.footermenu_item a {
	text-decoration: none;
	color: #666;
}
/*マウスオン時*/
.footermenu_item a:hover {
	color:#125ABE;
}

/*logo add*/
.footer_logo{
	text-align: center;
	color: #0C4BA2;
	font-size: 12px;
	padding: 10px 0;
	background-color: #BEE9F9;
	border-top: 1px solid #125ABE;	/*上の線の幅、線種、色*/
}
.footer_logo span{
	font-size: 16px;
	font-weight: 600;
	padding: 0 10px;
}
.footer_logo img{
	width: 40%;
	margin: 20PX  auto 10px auto;
}





/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #125ABE;	/*背景色*/
	color: #fff;		/*文字色*/
	padding: 10px;		/*ボックス内の余白*/
}

/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
/*アニメーションのキーフレーム設定（変更不要）*/
@keyframes scroll {
0% {opacity: 0;}
100% {opacity: 1;}
}
/*デフォルトでは非表示に*/
body .nav-fix-pos-pagetop a {display: none;}
/*ボタンの設定*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;
	width: 66px;		/*幅*/
	line-height: 66px;	/*高さ*/
	bottom: 80px;		/*下から40pxの場所に配置*/
	right: 5%;			/*右から1%の場所に配置*/
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
	border-radius: 10px;
}
body.is-fixed-pagetop .nav-fix-pos-pagetop img{
	border-radius: 10px;
	box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop img:hover {
	-webkit-transform: translateY(-5px);
	        transform: translateY(-5px);
	filter: opacity(0.8);
}

/*「NEW」アイコン
---------------------------------------------------------------------------*/
.newicon {
	background: #F00;	/*背景色*/
	color: #FFF;		/*文字色*/
	font-size: 50%;		/*文字サイズ*/
	line-height: 1.0;
	padding: 2px 10px;
	border-radius: 5px;
	margin: 0px 5px;
	vertical-align: middle;
}




/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
@keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

/*画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px){
/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	position: relative;
	margin: 0 auto;
	height: 120px;	/*ヘッダーの高さ*/
}
/*ロゴ画像*/
header #logo {
	width: 300px;		/*ロゴ画像の幅*/
	position: absolute;
	left: 2%;		/*ヘッダーブロックの左からの配置指定*/
	top:20px;	/*ヘッダーブロックの下からの配置指定*/
}
/*ADD_TELブロック*/
header address {
	width: 300px;
	font-size: 14px;
	font-style: normal;
	position: absolute;
	right:10%;		/*ヘッダーブロックの右からの配置指定*/
	top: 30px;	/*ヘッダーブロックの下からの配置指定*/
	text-align: center;	/*内容をセンタリング*/
	line-height: 1.5;	/*行間を少し狭く*/
}

/*メインメニュー
---------------------------------------------------------------------------*/

/*スマホ用メニューブロック*/
#menubar-s {
	overflow: scroll;
	z-index: 1;
	position: absolute;
	top: 160px;			/*上からの配置場所指定*/
	left: 0px;			/*左からの配置場所指定*/
	width: 40%;		/*幅*/
	padding: 40px 4% 40px 50% ;
	margin: 0 3%;
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
	display: flex;
	flex-direction: column;
	background-color: rgba(165,226,249,0.90);
	background-image:url("../images/menu-s_bg.png");
	background-repeat: no-repeat;
	background-size: 36%;
}
/*メニュー１個あたりの設定*/
.menubar-s_item{
	padding: 6px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 16px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: #fff;
	border-radius: 20px;
	margin: 10px 0;
	
}
.menubar-s_item a{
		text-decoration: none;
	}
.menubar-s_item2{
	padding: 6px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 15px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: rgba(255,255,255,0.7);
	border-radius: 20px;
	margin: 8px 0 8px 50px;
	
}
.menubar-s_item2 a{
		text-decoration: none;
	}
#menubar-s img{
		height: 30px;
		margin: 0 10px;
	vertical-align:top;
	}	
.menu-other{
		width: 32%;
		position: absolute;
		padding: 30px;
		bottom:50px;
		left:50px;
		background-color: rgba(255,255,255,0.4);
		display: flex;
		flex-direction: column;
	border-radius: 20px;
	}
.menu-other_item{
	padding: 4px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 14px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: rgba(255,255,255,0.7);
	border-radius: 20px;
	margin: 8px 0 8px 0;
		
	}
	.menu-other img{
		height: 25px;
		margin: 0 10px;
	vertical-align:top;
	}

/*PC用メニューを非表示にする*/
#menubar {display: none;}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;position: absolute;
    z-index: 2;
	top: 70px;	/*上からの配置場所指定*/
	right: 5%;	/*右からの配置場所指定*/
	
}
/*アイコン共通設定*/
#menubar_hdr.close{
	width: 50px;		/*幅*/
	height: 50px;		/*高さ*/
	
}

#menubar_hdr.open {
	width: 50px;		/*幅*/
	height: 50px;		/*高さ*/
	
}
/*三本バーアイコン*/
#menubar_hdr.close {
	background: url(../images/icon_menu.png) no-repeat center top/50px;	/*背景色、アイコンの読み込み、上半分(top)を表示、幅50px*/
}
/*閉じるアイコン*/
#menubar_hdr.open {
	background: url(../images/icon_menu.png) no-repeat center bottom/50px;	/*背景色、アイコンの読み込み、上半分(bottom)を表示、幅50px*/
}


/*トップコンセプト*/
.top_concept{
	width: 90%;
	margin: 0 auto;
	background-image: url("../images/maria2.png");
	background-repeat: no-repeat;
	background-position: right;
	background-size:60%;
	padding: 50px 0
}
.concept_copy{
	width: 80%;
	padding: 5% 2% 10%;
	font-size: 16px ;
	color: #444;
	line-height: 2.2em;
	text-align: left;
	background-image: url("../images/top_concept_bg.png");
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 80%;
}
.concept_copy p{
	padding-left: 20px;
	padding-bottom: 50px;
}
.concept_copy img{
	width: 90%;
	margin-bottom: 40px;
}
	
/**/
	
.top_news{
	width: 76%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	padding: 10px 5%;
	background-color: #FAEBDB;
	border-radius: 15px;
	height: auto;
}
/*フッター設定
---------------------------------------------------------------------------*/
/*footerボックス*/
footer {
	clear: both;
	overflow: hidden;
	background: #fff;	/*背景色*/
	padding-top: 20px;	/*上に空けるボックス内の余白*/
}





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

.footermenu {
	display: none;
	
}
.footermenu_item{
	margin: 0 10px;
}
.footermenu_item img{
	height: 35px;
	margin: 0 10px;
}
/*リンクテキスト*/
.footermenu_item a {
	text-decoration: none;
	color: #666;
}
/*マウスオン時*/
.footermenu_item a:hover {
	color:#125ABE;
}

/*logo add*/
.footer_logo{
	text-align: center;
	color: #0C4BA2;
	font-size: 12px;
	padding: 10px 0;
	background-color: #BEE9F9;
	border-top: 1px solid #125ABE;	/*上の線の幅、線種、色*/
}
.footer_logo span{
	font-size: 16px;
	font-weight: 600;
	padding: 0 10px;
}
.footer_logo img{
	width: 40%;
	margin: 20PX  auto 10px auto;
}

body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;
	width: 66px;		/*幅*/
	line-height: 66px;	/*高さ*/
	bottom: 130px;		/*下から40pxの場所に配置*/
	right: 5%;			/*右から1%の場所に配置*/
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
	border-radius: 10px;
}



/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #125ABE;	/*背景色*/
	color: #fff;		/*文字色*/
	padding: 10px;		/*ボックス内の余白*/
}
	
}

/*画面を横向きにした場合の高さが500px以下の場合の設定。
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (orientation: landscape) and (max-height:500px){

}



/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){

#container {
	width: 100%;
	background-color: #fff;
	margin: 20px 0 0 0;
	padding: 0;
}

/*ヘッダーブロック*/
header {
	position: relative;
	margin: 0 auto;
	height: 170px;	/*ヘッダーの高さ*/
}
/*ロゴ画像*/
header #logo {
	width: 70%;		/*ロゴ画像の幅*/
	position: relative;
	margin: 0 0 0 10px;
	
}
/*ADD_TELブロック*/
header address {
	clear: both;
	width: 70%;
	font-size: 13px;
	font-style: normal;
	position: relative;
	text-align: center;	/*内容をセンタリング*/
	line-height: 1.5;	/*行間を少し狭く*/
	margin: 10px auto;
}

/*メインメニュー
---------------------------------------------------------------------------*/

/*スマホ用メニューブロック*/
#menubar-s {
	overflow:scroll;
	z-index: 1;
	position: absolute;
	top: 100px;			/*上からの配置場所指定*/
	left: 0px;			/*左からの配置場所指定*/
	width: 70%;		/*幅*/
	padding: 20px 25% 100px 5%;
	margin: 0;
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
	display: flex;
	flex-direction: column;
	background-color: rgba(165,226,249,0.90);
	background-image:none;
	
}
/*メニュー１個あたりの設定*/
.menubar-s_item{
	padding: 6px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 14px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: #fff;
	border-radius: 20px;
	margin: 5px 0;
	
}
.menubar-s_item a{
		text-decoration: none;
	}
.menubar-s_item2{
	padding: 4px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 13px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: rgba(255,255,255,0.9);
	border-radius: 20px;
	margin: 4px 0 4px 50px;
	
}
.menubar-s_item2 a{
		text-decoration: none;
	}
#menubar-s img{
		height: 30px;
		margin: 0 10px;
	vertical-align:top;
	}	
.menu-other{
		width: 80%;
		position: relative;
		padding: 5px 15px;
		bottom:0;
		left:0;
		background-color: rgba(255,255,255,0.0);
		display: flex;
		flex-direction: column;
	border-radius: 20px;
	margin: 5px 0 5px 15%;
	}
.menu-other_item{
	padding: 4px 20px 2px;	/*上下、左右へのメニュー内の余白*/
	font-size: 12px;		/*文字サイズ*/
	line-height: 2.2em;
	color: #666	;	/*文字色*/
	background-color: rgba(255,255,255,0.7);
	border-radius: 20px;
	margin: 5px 0;
		
	}
	.menu-other img{
		height: 25px;
		margin: 0 10px;
	vertical-align:top;
	}

/*PC用メニューを非表示にする*/
#menubar {display: none;}
	
/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: absolute;
    z-index: 2;
	top: 40px;	/*上からの配置場所指定*/
	right:20px;
}

/*コンテンツ（mainとsubブロックを囲むボックス）
---------------------------------------------------------------------------*/
#contents {
	clear: both;
	padding: 40px 0;
}

/*メインコンテンツ
---------------------------------------------------------------------------*/
/*メインコンテンツブロック*/
#main {
	width: auto;		/*ボックス幅*/
}

/*トップコンセプト*/
.top_concept{
	width: 90%;
	margin: 0 auto;
	background-image: url("../images/maria.png");
	background-repeat: no-repeat;
	background-position:top center;
	background-size: 90%;
}
.concept_copy{
	width: 90%;
	padding:320px 5% 0 5%;
	font-size: 14px ;
	color: #444;
	line-height: 2.0em;
	text-align: left;
	background-image: url("../images/top_concept_bg.png");
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 100%;
}
.concept_copy p{
	padding-left: 0;
	padding-bottom: 40px;
}
.concept_copy img{
	width: 100%;
    
}
/*トップバナー*/
.top_bnr{
	width: 70%;
	margin: 10px auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.top_bnr_item{
	width: 100%;
	margin: 10px auto
}
.top_bnr_item img{
	border-radius: 13px;
}
.top_bnr_item2{
	width: 100%;
	margin: 10px auto
}
.top_bnr_item2 img{
	border-radius: 13px;
}
.bnr_1{
	border: #55AC94 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}
.bnr_2{
	border: #719039 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}
.bnr_3{
	border: #406AA2 2px solid;
	border-radius: 15px;
	box-shadow: 2px 3px 6px rgba(0,0,0,0.2);
}

.top_bnr_item:hover {
	-webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
	filter: opacity(0.8);

}

/*トップnews*/
.news_area{
	width: 100%;
	padding: 0;
	border-top: 1px solid #125ABE;
	margin: 20px 0 0 0;
}
.top_news{
	width: 80%;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	padding: 10px 5%;
	background-color: #FAEBDB;
	border-radius: 15px;
	height: auto;
}
.top_news dl{
	width: 100%;
	display: flex;
	flex-direction: column;
}
.top_news dt{
	width: 100%;
	font-size:14px;
	color: #125ABE;
	line-height: 1.0em;
}
.top_news dd{
	width: 100%;
	font-size:13px;
	color: #666;
	line-height: 1.4em;
	margin: 15px 0 0 0;
}
/*おしらせ*/
.top_news_cat1{
	font-size:12px;
	background-color: #fff;
	text-align: center;
	margin: 0 0 5px 20px;
	border: 2px solid rgba(34,153,193,1.00);
	color: rgba(34,153,193,1.00);
	padding: 0 20px;
	border-radius: 20px;
}
/*おたより*/
.top_news_cat2{
	font-size:12px;
	background-color: #fff;
	text-align: center;
	margin: 0 0 5px 20px;
	border: 2px solid #F29A37;
	color: #F29A37;
	padding: 0 20px;
	border-radius: 20px;
}

.top_news_ttl{
	margin: 30px 0 20px 8%;
	width: 84%;
	
}






/*フッター設定
---------------------------------------------------------------------------*/
/*footerボックス*/
footer {
	clear: both;
	overflow: hidden;
	background: #fff;	/*背景色*/
	padding-top: 20px;	/*上に空けるボックス内の余白*/
}



/*logo add*/
.footer_logo{
	text-align: center;
	color: #0C4BA2;
	font-size: 13px;
	line-height: 1.6em;
	padding: 10px 0;
	background-color: #BEE9F9;
	border-top: 1px solid #125ABE;	/*上の線の幅、線種、色*/
}
.footer_logo span{
	font-size: 16px;
	font-weight: 600;
	padding: 0 10px;
}
.footer_logo img{
	width: 90%;
	margin: 20PX  auto 10px auto;
}


/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	font-size: 11px;
	clear: both;
	text-align: center;
	background: #125ABE;	/*背景色*/
	color: #fff;		/*文字色*/
	padding: 10px;		/*ボックス内の余白*/
}
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 100;position: fixed;
	width: 66px;		/*幅*/
	line-height: 66px;	/*高さ*/
	bottom: 180px;		/*下から40pxの場所に配置*/
	right: 5%;			/*右から1%の場所に配置*/
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
	border-radius: 10px;
}
}