



/*
行間　※終了記号の直前に全角文字があるとコメントとして成立しない
*/


/* ここがCSSのコメント */


@charset "UTF-8";
.webtop{background-color:#E8E8E8;
font-family: 游明朝,"Yu Mincho",Georgia,serif;
background-image: url("GZo/topwall2.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: top 84px center;/*背景画像top位置*/

}

.webpage{background-color:#E8E8E8;
font-family: 游明朝,"Yu Mincho",Georgia,serif;

}



.gnavi {
	box-sizing:border-box;
	height: 24px;
	width:106%;
	margin-left:  -8px;
	background-color: #F7F9FC;
	box-shadow: 0 3px 4px  #000000;
	font-size: 16px;
}

.gnavi__inner {
  width: 90%;
  height: 100%;
}

.gnavi ul {
  height: 100%;
  display: flex;
  margin: 0 -20px;
}
.gnavi li {
list-style-type:none;
flex-grow: 1;
flex-shrink: 1;
  position: relative;
  display: flex;
  }
.gnavi li::after {
  content: "";
  display: block;
  width: 2px;
  height: 20px;
  background-color: #b8b9dc;
  position: absolute;
  right: -1px;
  top: calc((100% - 20px)/2);
}
.gnavi li:last-child::after {
  content: none;
}

.gnavi a {
  display: flex;
flex-grow: 1;
flex-shrink: 1;
  justify-content: center;
  padding: 2px;
}


.gnavi a:hover span {
  color: #0004ff;
  position: relative;
}
.gnavi a:hover span::after {
  content: "";
  position: absolute;
  display: block;
  height: 2px;
  width: 100%;
  bottom: 0;
  background-color: #0004ff;
  border-radius: 5px;
}



.gnavi span {
  display: flex;
  align-items: center;
  word-break: keep-all;
}

li a {
  color: inherit;
  text-decoration: none;
}


.kiyack {
list-style-type: square;
list-style-position: inside ;
margin-left: -18px;
margin-top: -2px;
font-size: 15px;

}




.kiyacall{
margin-left: -18px;

line-height:1.8em;
text-align:start ;
}


.kiyalist{
margin-left: 18px;

margin-top: 32px;
margin-bottom: 16px;
}

.kili{
margin-top: -20px;
margin-bottom: 1px;
}





.headerimg{
float:right;
width: 64px;
margin-left: auto;
}


.header {
text-align: end;


 font-size: 7px;
 margin-bottom: 38px;/*メニューバー縦位置*/
 margin-right: 20px;

  }

.footer {text-align:center;
  margin-right: auto;
   font-size: 14px;
   line-height: 1.4em;

}



 /*floatを解除
.cb{
  clear: both;
}*/


.infosmall {
font-style:normal;
font-size: 14px;
}

.ichi{
text-align:center;
	margin-top: 3em;

}

.ni{text-align:center;
font-size: 14px;
}


.san{text-align:center;
font-size: 16px;
line-height: 1.5em;

}




.hm_inner {
	width: 12em;
	margin-top: 1em;
	font-size: 20px;
	line-height:2.4em;
	list-style: none;
	position:relative;
	
    display:-webkit-box;/*Android4*/
    display:-ms-flexbox;/*IE10*/
    display:-webkit-flex;/*safari(pc,ios8)*/
    display:flex; /*flexコンテナに*/
    
	flex-direction:column;
	margin-left:2em;
	padding:0;
	}

.hm_inner > li {
	border-bottom:dashed 1px #0004ff;
 	}

.hm_inner > li > a{
					display: inline-block;      /* リンクをインラインブロック化して表示 */
					width: 11.5em;                 /* 横幅を11.5文字分にする */
					margin: 0.15em 0.2em 0.2em 0.2em;  /*外側の余白量:左右下上 */
	}





/* 
a.menue{text-decoration:none; 
color:white; 
font-size:90%;
}
nav{}
ul{list-style-type: none;
     height: 100%;
display: flex
  text-align:center;
width:90%;
}
ul,li{;
    background:#090;
    height: 100%;
			}
*/


table{	margin-right : auto;
	margin-left : auto
	}

th{	font-weight:normal;
	}

img{	max-width:100%;
	height:auto
	}	
	

td {border:inset;
}

.table {
	width: 90%;
	font-size: 20px;
	border:outset;
	}

.tables {
	margin-top: 2em;
	width: 90%;
	font-size: 16px;
	border:outset;
	}


.tableold {
	width: 62%;
	font-size: 14px;
	cellpadding:2px;
	border:outset;

	}









span.YYsmall {font-size:80%}


td, th {padding: 8px;}




#Zumen{width:40%;
}

#Syomen{
width:200;

}

#Loca{float:left;
width:200;

}

#Naka{float:left;
width:200;
}


.youtubewidth{
  margin-left: 18px;
  width: 56.25%;
  text-align:center;
  font-size: 16px;
  line-height: 1.5em;
}

#youtube{
  border: none;
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
 }

 #youtube iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none; /*境界線の打ち消し*/
 }

























/*ヘッダーまわりはサイトに合わせて調整してください
header {
  padding:10px;
  background: skyblue;
}
*/



#nav-drawer {
  position: relative;
  right:0px
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 320px;/*最大幅（調整してください）*/
  height: 100%;
  background: #E8E8E8;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}





@media screen and (min-width:480px) {
  #nav-open {
    display:none;
  }
}


@media screen and (max-width:480px){
.gnavimain {
    display:none;
  }
}




