@charset "UTF-8";

/* hafuri map css*/

@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium");
}

body {
text-align:left;
color: #333333;
font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
margin: 10px 10px 10px 10px;
padding: 0px;
background:#ffff00;
  -webkit-text-size-adjust:  100%;
}
 
 /* for link*/

a:link{color:blue;text-decoration:none;}
a:visited{color:blue;text-decoration:none;}
a:hover{color:red;text-decoration:none;}
a:active{color:red;text-decoration:none;}

.navi a:link{color:lightgrey;text-decoration:none;}
.navi a:visited{color:lightgrey;text-decoration:none;}
.navi a:hover{color:black;text-decoration:none;}
.navi a:active{color:black;text-decoration:none;}

.navib a:link{color:blue;text-decoration:none;}
.navib a:visited{color:blue;text-decoration:none;}
.navib a:hover{color:red;text-decoration:none;}
.navib a:active{color:red;text-decoration:none;}

p.navi{
font-size: 75%;
font-weight: normal;
line-height: 150%;
margin-bottom: 30px;
}

p.navib{
font-size: 65%;
font-weight: normal;
line-height: 165%;
margin-left: 15px;
}

h1{
font-size: 88%;
font-weight: normal;
line-height: 100%
}
h2{
font-size: 88%;
font-weight: normal;
line-height: 100%
}
h3{
font-size: 85%;
font-weight: normal;
line-height: 150%
}
p{
font-size: 88%;
font-weight: normal;
line-height: 175%
}
.cat{
font-size: 85%;
font-weight: normal;
line-height: 150%
}
.cap{
font-size: 80%;
font-weight: normal;
line-height: 130%
}
.rub{
color: #008000;
font-size: 80%;
font-weight: normal;
line-height: 130%
}
.kana{
color: #800080;
font-size: 80%;
font-weight: normal;
line-height: 130%
}
p.cite{
font-size: 80%;
font-weight: normal;
font-style: italic;
line-height: 150%
}

/* for font color*/

.blue_span{
    color:blue;
}
.red_span{
    color:red;
}
.green_span{
    color:green;
}
.grey_span{
    color:grey;
}
.lightgrey_span{
    color:grey;
}
.navy_span{
    color:navy;
}
.purple_span{
    color:purple;
}
.orangered_span{
    color:orangered;
}
.brown_span{
    color:brown;
}

/* for layout*/

#container {
width:100%;
overflow: hidden;
min-width: 560px;
max-width: 860px;
text-align:left;
margin:0 left;
background:#ffffff;
padding:0px;
}
#header {
width:auto;
text-align:auto;
background:#ffffff;
padding:auto;
}
#main {
float:right;
margin-left:260px;
margin-right: 30px;
display:inline;
background:#ffffff;
padding:10px;
text-align: justify;
text-justify: inter-ideograph;
}
#left {
float:left;
width:240px;
height:740px;
margin-right:-830px;
background:#ffffff;
padding:10px;
}
#right {
float:left;
width:10px;
margin-left:0px;
background:#ffffff;
padding:10px;
}
#footer{
width:auto;
text-align:left;
background:#ffffff;
padding:auto;
clear:both;
}
#c-both { clear:both; }

 /* for pagetop*/
 
#page-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    font-size: 100%;
}
#page-top a {
    display: block;
    background: none;
    border: 2px solid #999;
    color: #999;
    width: 40px;
    padding: 7px 0;
    text-align: center;
    text-decoration: none;
    border-radius: 40px;
}
#page-top a:hover {
    background: none;
    border: 2px solid #333;
    color: #333;
    text-decoration: none;
}