﻿@charset "utf-8";
/* リセットCSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
	/* font-size: 62.5%;*/

}

/* general */
html{
	height:100%;
	margin:0px auto;
	padding: 0px;	 	
}

body{
	margin: 0px auto;
	padding: 0px;
	font-family: 'Roboto', 'verdana','Noto Sans JP', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	color: #000;
	background-color: #f5f8ef;
	letter-spacing: 0.1em;
	height: 100%;
	background: url(img/bg0.png);	
}

#container {  
    height: auto !important;  
    height: 100%; 
	min-height: 100%;  
    position: relative;
	margin:0px;
	padding:0px;
}  

table.tbl_outer {  
    margin: 0px auto;
	padding: 0px;
	width: 100%;
	border: 0px;
	border-collapse: collapse;		 
}

table.tbl_outer tr td.td_footer{  
    height: 170px;	 
}

img{
	border:0px;
}

a:focus{ outline:none;}

a {color: #000; text-decoration: underline;}
a:hover {color: #FC6847; text-decoration: underline;}

div#n404{
	text-align:center;
}

/***** ヘッダー部共通 *****/

div#head{
	margin:0 auto;
	padding:0;
	width:900px;
	height: 70px;
}
div.logo a{
	margin: 8px 0 0px 0;
	width: 300px;
	height: 50px;
	float:left;
}
div.catch h1{
	font-size: 0.8em;
	line-height: 1.2em;
	font-weight: normal;	
	margin-top: 10px;
	padding: 5px 0px 0px 15px;
	width: 470px;
	color: #333;
	float: left;
	/*height: 10px;	*/
}
.header_right{
	padding: 14px 0 0 0px;
	width: 90px;
	float: right;
	font-size: 80%;
}
.header_right a{
	color: #000;
	text-decoration: none;
}

div.h_place{
	float:left;
	width:128px;
	padding:13px 0 0 50px;
}

div.gNav{
	width:900px;	
	padding: 0px;
	margin:0px auto; 
	position:relative;
	top:0px;
	left:0;
	clear:both;
	height:30px;
	z-index:1;

	/* レスポンシブ対応のためmax-widthを使用 
	max-width: 895px;
	width: 100%;*/

	/* 0には単位不要。marginをまとめて記述 */
	/* padding-top: 10px;
	margin: 0 0 0 auto;
	position: relative;
	padding-right:20px;
	right:0;	

	/* heightの代わりにpaddingやline-heightで高さを確保する方が柔軟 */
	/*min-height: 0px; */
	/* もしくは line-height: 35px; */

	/* 直前にfloat要素がなければ不要 */
	/*clear: both; 
	backdrop-filter: blur(10px);*/

}
div.gNav a {
  text-decoration: none;color:#050505;
}
div.gNav a:hover{
  border-bottom: 4px solid #ff6a45;
  display: inline-block;
  padding-bottom: 2px;
}
div.gNavT {
	position: relative;
	top:0px;
  	display: flex;
  	justify-content: flex-end;
  

}
.gNavMenu{
	padding:0 10px 0 8px;
	
}
/***** 各ページ共通 *****/

div#wrapper{
 	clear:both;
	margin:0 auto;
	padding:0px 0 0 0;
	width:900px;
	position:relative;
	z-index:2;
}

div#wrapper div#pankuzu{
	width:100%;
	float:left;
	position:relative;
}

div#wrapper div#sidebar{
	width:210px;
	float:left;
	border: dotted 1px #CCC;
	margin: 15px 25px 0 5px;
	font-size:0.75em;
	position:relative;
	background: #0F9457;
	flex-shrink: 0; /* ← これを追加（縮まないようにする） */
}

div#wrapper div#content{
	width: 655px;
	float: left;
	position: relative;
	padding: 0 0 0 0;
	line-height: 1.5em;
	font-size: 1.0em;		    

}

/***** トップメイン画像 、ニュース*****/
div#wrapper div#content div.main_inner{
	padding: 0px 15px;
	font-size: 100%;
}
	
.main_inner h2{
	border: none;
	font-size: 1.6em;
	line-height: 1.5;
	color: #1c0506;
	font-family: "Lora", 'Noto Serif JP',"游明朝体", "Yu Mincho", YuMincho, "ＭＳ Ｐ明朝", serif !important;
	margin: 20px 0;
	background: none;
	padding: 0 0 0 10px;
	border-left: #6ccf9e 5px solid;
}
.main_inner h3{
	font-size: 1.3em;
	line-height: 1.6;
	color: #1c0506;
	margin: 20px 0;
	padding: 0 0 0 10px;
	font-weight: normal;
}
.main_inner h4{
	border: none;
	font-size: 1.95em;
	line-height: 1.9;
	color: #FF5722;
	font-family: "Ryumin ExtraBold KL", "游明朝体", "Yu Mincho", YuMincho, "ＭＳ Ｐ明朝", serif !important;
	margin: 20px 0 0 -15px;
	background: none;
	padding: 0 0 0 10px;
}
.main_inner h5{
	font-size: 1.3em;
	line-height: 1.9;
	color: #1c0506;
	padding: 0px 0 0 10px;
	font-weight: normal;
}
.main_inner h6{
	font-size: 1.28em;
	line-height: 1.5;
	color: #1c0506;
	padding: 0px 0 0 10px;
	font-weight: normal;
}
.main_inner p{
	padding-left: 10px;
	margin-bottom: 30px;
}
.li_check {
    margin-left: 30px;
	list-style-image: url(img/check-box-outline.png);
}
.li_sface {
    margin-left: 70px;
    padding-left: 100px;
	list-style-image: url(img/smiling-face-64.png);
	vertical-align: top;
}
.toukei{
	border: solid 1px #DDD;
	padding: 10px;
	background :#FFF;
	margin: 0 20px 0 70px;
}
	
.toukei_inner{
	float: left;
	margin-left: 20px;
    height: 2em;
    line-height: 2em;
	
}
.footnote{
	font-size: 80%;
	line-height: 1.5em;
	margin-top: 10px;
}
.graph {
    position: relative; /* IE is dumb */
    width: 200px;
    border: 1px solid #207870;
    padding: 2px;
    margin-bottom: 3px;
    float:left;
}

.graph .bar {
    display: block;
    position: relative;
    background: #409890;
    text-align: center;
    color: #f0ffff;
    height: 2em;
    line-height: 2em;
    font-size: 70%;
}
.graph .bar span {
	position: absolute; left: 1em; 
}

div#top_main{
	height:504px;
	width:100%;
	position:relative;
	margin:0px auto;
	background:url(img/bg1.png);
}

div#top_main div.top_main_in{
	width: 900px;
	/* height: 330px; */
	margin: 0px auto;
	/* background: url(img/gifani.gif); */
}

div#top_main div.top_main_in div.t1{
	width:900px;
	/* height:320px; */
	float:left;
	position: relative;
}



div#top_main div.top_main_in div.t2 span.t2_1{
	float: left;
	width: 205px;
	height: 35px;
	padding: 10px 0 5px 55px;	
	vertical-align: middle;
	color: #000;
	background:url(img/messages.png) no-repeat;
	font-size: 1.1em;
}

div#top_main div.top_main_in div.t2 ul.news{
	padding: 0px;
	margin: 0px 10px 0px 0px;	
	clear: both;
	height: 280px;
	width: 265px;	
	overflow: scroll;
	overflow-x: hidden;
}

div#top_main div.top_main_in div.t2 ul.news li{
	list-style: none;
	line-height: 1.3em;
}

div#top_main div.top_main_in div.t2 ul.news li p.day{
	color: #1ec88c;
	padding: 3px 0px 0px 0px;
	margin: 0px;
	letter-spacing: 0em;	
}

div#top_main div.top_main_in div.t2 ul.news li h4.con{
	color: #000;
	font-weight: normal;
	font-size: 0.9em;
	padding: 0px 0 0px 18px;
	margin: 2px 0px 3px 0px;
	width: 220px;
}

/***** フッター*****/
div#footer{
	/*background:url(img/footer.png) repeat-x;	background-color: #ffab9675;
*/
	background-color: #fcb09d75;
	position:absolute;
	bottom:0px;
	left:0px;	
	height:100px;
	width:100%;
	color:#000;	

}

div#footer div.f1{
	text-align: center;
	padding: 25px 0px 0px 0px;
	margin: 0px;
	line-height: 1.2em;
	position: relative;
	height: 76px;
	width: 100%;
}

.f2{
	position: absolute;
	right: 20px;
	bottom: 20px;
	width: 50px;
	/*height: 58px;*/
	z-index: 1;
}

div#footer a{
	color:#666;	
	text-decoration:none;	
}

#footer a:hover{
	color:#000;
	text-decoration:none;	
}

p.date {
	float:left;
	clear:both;
	font-size: 0.75em;
	font-weight:bold;
	padding: 0px;
	margin:0px;
	color:#ee794d;
}

.entry{
	width:665px;
	margin:0 0 20px 35px;	
}

* html .entry{ 
	width:665px;
	margin:0 0 20px 15px;
}

.sorry {
	font-size: 11px;
	font-style: italic;
	margin: 8px 0px 0px 0px;
	padding: 10px 10px 10px 10px;
	border: 1px dashed #ccc;
	background:#ffffff;
	width:98%;
}

/*****サイドメニューバナー　*****/
.side_banner{
	margin: 0;
	padding: 0px 10px 15px 15px;
	font-size: 110%;
    color: white;
	/*background: #007965;*/
	background: #0F9457;
	position: relative;
	left: 0px;


}

.side_banner a:hover {
position: relative;
top: 1px;
left: 1px;
text-decoration: none;
}

/*****パンクズ　*****/
ul.breadcrumbs { 
	margin: 0px;  
	/*font-size:0.8em;*/
	padding:0 0 20px 0px;
	clear:both;
	border-bottom:0px dashed #81826b;
	width:900px;
	height:10px; 
}  

ul.breadcrumbs li {  
	list-style: none; 
	float:left;  
	margin: 0px;  
	padding: 3px;	  
} 

ul.breadcrumbs li a{  
	color:#666;	  
}

ul.breadcrumbs li a:hover{  
	color:#000;	  
}

input.link{
	clear:both;
	margin:0px 0 10px;
	position:relative;
	float:right;
}
	
.messages{
	 vertical-align: middle;

}

.tbl{
	 border-collapse: collapse;
	table-layout: fixed;

	 }
.tbl_th{
	padding: 8px; 
	border-bottom: 1px solid #999;
	width: 95px;
}
.tbl_th2{
	padding: 8px; 
	border-bottom: 1px solid #999;
	width: 350px;
}
.tbl_th3{
	padding: 8px; 
	border-bottom: 1px solid #999;
	width: 145px;
	font-size: 1.1em;
}
.tbl_td{
	padding:0px 8px 2px 8px;
}
.tbl_td2{
	padding:8px;
	border-bottom:1px solid #999;
	
	

}
.tbl_td_test{
		width: 510px;
	padding:8px;
	border-bottom:1px solid #999;

}
.faq1{
color: #e35f62;
}

.faq2{
	color: #01cbdb;
}

.faq3{
	border-radius: 15px;
	-webkit-border-radius: 6px; /* Safari,Google Chrome用 */
	-moz-border-radius: 6px; /* Firefox用 */ 
	background: #FFF;
	padding: 10px;
	margin-bottom: 10px;
	border: solid 5px #EFEFEF;
}
.kakomi{
	border-radius: 15px;
	-webkit-border-radius: 6px; /* Safari,Google Chrome用 */
	-moz-border-radius: 6px; /* Firefox用 */ 
	background: #e0f5ea;
	padding: 10px 5px 10px 15px;
	margin-top: 15px;
	border: solid 5px #a6e3c3;
	font-size: 1.1em;
}
.copyright{
	padding:10px 0 0 0px;
}
.recommendation{
	font-family:  "Ryumin ExtraBold KL", "游明朝体", "Yu Mincho", YuMincho, "ＭＳ Ｐ明朝", serif;
	padding: 10px;
	font-size: 1.25em;
	line-height: 1.5;
	font-weight: bold;
}
.square1{
	color: #89E08C;
}
.square2{
	color: #E089DD;
}
.diam{
	color: #89AAE0;
}
.main_inner_r{
margin-left: 70px;
}

.font_s{
	font-size: 70%;
}
.effect2
{
  position: relative;
  background:url(img/ricepaper2.png);
  padding: 15px;

}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.effect2:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
.mark_g{
	color: #4CAF50;
}
.f404{
	font-size: 2em;
	color: #bbb;
}
.movie_blk {
    width: 620px;
    height: 300px;
    position: relative;
}
.movie_blk video {
    width: 620px;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}
.movie_blk p {
    font-size: 20px;
    padding: 0px;
    border-radius: 8px;
    background-color: rgba(255,255,255,0.7);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%,-50%);
}
.spacer{padding-top:3px;}
