body {
background-color:#fff;		/* 入力エリアの色指定　*/
margin:0px;            		/* 入力エリアの上部のスペース　*/
width:800px;					/* 本文の幅　*/
padding:0;

    color: #333;
	font-size: 16px;				
    font-family:
    	Verdana, Arial,
    	'ヒラギノ角ゴ ProN W3',
    	'Hiragino Kaku Gothic Pro',
    	Osaka,
    	'ＭＳ Ｐゴシック',
    	sans-serif;
}



#header {
padding:0px 0px 0px 20px;		/* 空白＝　文章エリアの上端から１行目までのスペース　*/
height:10px;				/* ヘッダーのスペース*/

}





#pagehead{
padding:10px 0px 0px 20px;		/* 空白＝　文章エリアの上端から１行目までのスペース　*/
}


.globalNavi{
border: solid #cccccc;
border-width:1px 0 0 0;
}

.globalNavi ul{
margin: 0;
/*空白　　上　　右　  下　　左　　*/
padding: 2px 0px 2px 0px; /* ナビの罫線の上下に隙間を設ける　*/
}

.globalNavi ul:after{
content: "";
clear: both;
display: block;
}

.globalNavi ul li{
list-style: none;
width: 155px;
float: left;
border-left: solid 1px #cccccc; /* ナビの左側の罫線　*/
border-right: solid 1px #cccccc;/* ナビの右側の罫線　*/

padding: 0 0px;

box-sizing: border-box;
text-align: center;
}

.globalNavi ul li a{
color: inherit;
text-decoration: none;
font-weight: bold;
font-size:12px; 
display: block;
background-color: #f5deb3; /*ページのナビの色　　*/
padding: 0px 0px 2px 0px; /* ナビの罫線の上下に隙間を設ける　*/
border-bottom: solid 1px #cccccc;/* ナビの下側の罫線　*/
}

.globalNavi ul li a:hover{ 
background-color: #ffa500; /*選択したページのナビの色　　*/
padding: 0px 0px 2px 0px; /* ナビの罫線の上下に隙間を設ける　*/
border-bottom: solid 1px #cccccc;/* ナビの下側の罫線　*/
}

.globalNavi ul li.current a{ 
background-color:#ffffff !important;  /*現在のページのナビの色　　*/
padding: 0px 0px 2px 0px; /* ナビの罫線の上下に隙間を設ける　*/
border-bottom: none;
}




.btn-square {
 position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #ff0000;/*色*/
  border-radius: 4px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
  border: solid 2px #d27d00;/*線色*/
}


.btn-square2 {
 position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #339966;/*色*/
  border-radius: 4px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
  border: solid 2px #d27d00;/*線色*/
}

.btn-square3 {
 position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #33cccc;/*色*/
  border-radius: 4px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
  border: solid 2px #d27d00;/*線色*/
}



.btn-square:hover {
  /*カーソルを合わせた時
    background: #669933;
    color: #000;
*/
}



.btn-square2:hover {
  /*カーソルを合わせた時
    background: #ccffcc;
    color: #000;
*/
}



.btn-square3:hover {
  /*カーソルを合わせた時
    background: #ccffcc;
    color: #000;
*/
}




.btn-square:active {
  /*押したとき*/
    background: #ffffff;
    color: #ff0000;

}

.btn-square2:active {
  /*押したとき*/
    background: #ffffff;
    color: #ff0000;


}

.btn-square3:active {
  /*押したとき*/
    background: #ffffff;
    color: #ff0000;


}


markgreen{
 background : linear-gradient(transparent 60%, #00ff00 65%);  /* 緑のラインマーカーを付ける  */
}


markred{
 background : linear-gradient(transparent 90%, #ff0000 0%);  /* 緑のラインマーカーを付ける  */
}





#main {
width:800px;					/* 本文の幅　*/
float:left;						/* 左寄せ　*/
}





.content {
/*空白　　上　　右　  下　　左　　*/
padding:20px 0px 0px 50px;		/* 空白＝　文章エリアの上端から１行目までのスペース　*/
font-size:16px;					/* 各項目の文章記述のフォント　*/
line-height:100%;				/* 文章の行間隔　*/
}




/* 文章のプロパティ設定 */
a{
font-weight:normal;				/* 文章の文字の太さ＝標準*/
line-height: 220%;				/* 文章部分の　行間隔 　元は　170　*/
/*text-decoration: none;		/* リンク部分のアンダーライン表示をなくする　*/
} 

p{
font-weight:normal;				/* 文章の文字の太さ＝標準*/
line-height: 220%;				/* 文章の行間隔　*/
/*text-decoration: none;		/* リンク部分のアンダーライン表示をなくする　*/
} 




#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #ef3f98;
  opacity: 0.6;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}









#footer {
color:#666;	
font-size:12px;
height:110px;
clear:left;
text-align:left;
}
.copy {
padding:20px 0 0 0;
}
blockquote{
border:1px solid #ccc;
padding:5px;
margin:10px;
}
@media screen and (max-device-width: 480px) {
#outer {width:100%;}
#header {width:100%;clear:both;height:70px;}
h1 {padding:34px 0 0 34px;}
#main {width:100%;clear:both;}
.content {clear:both;font-size:120%;padding:0 10px;}
#right {width:100%;clear:both;}
#footer {width:100%;clear:both;}
img {zoom:80%;}
}