@charset "UTF-8";

body{
  background-color : #ffffff;
    box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
  color : #666666;
  margin : 0px;
  padding : 5px 0px 0px 0px;
  text-align : center;
  font-family : "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , serif;
  font-weight : lighter;
  }
  
p{
  margin : 0px;
  padding : 0px;

  }

a{
  text-decoration:none;
  color:#696969;
}
a:hover {
  text-decoration:none;
  color:#d2691e;
}
  
#head{
  background-color : #ffffff;
  margin-left:auto;
  margin-right:auto;
  padding-top : 0px;
  width : 800px;
  height : 150px;
  text-align : center;
  }
  
#headcont{
  margin : 0px;
  padding : 0px 0px 0px 0px;
  width : 200px;
  height : 150px;
  float : left;
  }
  
#headcont img{
  margin : 40px 0px 0px 0px;
  float : left; 
  height : 45%;
  }
  
#menu{
  float : right;
  margin : 0px;
  padding : 0px;
  position : relative;
  overflow : hidden;
  width : 600px;
  font-size : 105%;
  text-align : center;
  }
  
#menu ul{
  position : relative;
  float : left;
  left : 50%;
  margin : 0px;
  padding : 0px;
  text-align : center;
}

#menu li{
  position : relative;
  right : 50%;
  margin : 0px;
  padding : 0px;
  background-position:bottom;
  width : 120px;
  height :150px;
  text-align : center;
  float: left;
  list-style-type: none;
  font-size : 80%;
  }
  
#menu li a{
  height : 150px;
  padding : 65px 0px 0px 0px;
  text-align : center;
  text-decoration:none;
  background-color : #ffffff;
  color:#808080;
  display:block;
    transition: 0.5s;
  }
  
#menu li a:hover {
  height : 150px;
  padding : 65px 0px 0px 0px;
  text-decoration:none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  }
  
#menu_top{
  float : right;
  background-color : #ffffff;
  margin : 0px;
  padding : 0px;
  position : relative;
  overflow : hidden;
  width : 600px;
  font-size : 105%;
  text-align : center;
  }
  
#menu_top ul{
  position : relative;
  float : left;
  left : 50%;
  margin : 0px;
  padding : 0px;
  text-align : center;
}

#menu_top li{
  position : relative;
  right : 50%;
  margin : 0px;
  padding : 0px;
  background-position:bottom;
  width : 120px;
  height :150px;
  text-align : center;
  float: left;
  list-style-type: none;
  font-size : 80%;

  }
  
#menu_top li a{
  height : 150px;
  padding : 65px 0 0px 0;
  text-align : center;
  text-decoration:none;
  background-color : #ffffff;
  color:#808080;
  display:block;
  transition: 0.5s;
  }
  
#menu_top li a:hover {
  height : 150px;
  padding : 65px 0 0 0;
  text-decoration:none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  }
  
#visit {
  height : 150px;
  padding : 65px 0px 0px 0px;
  text-decoration:none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  }
  
#menu p{
  font-size : 50%;
}  

#menu_top p{
  font-size : 50%;
} 

#menu_t{
  display : none;
  }

#ashi{
  font-size : 90%;
  margin : 10px 0px 10px 0px;
  text-align : left;
  text-decoration:none;
}
#ashi a{
  font-size : 90%;
  margin : 20px 0px 10px 0px;
  text-align : left;
  text-decoration:none;
  color:#696969;
}
#ashi a:hover {
  font-size : 90%;
  margin : 20px 0px 10px 0px;
  text-align : left;
  text-decoration:none;
  color:#d2691e;
}

#cbody{
  background-color : #ffffff;
  margin-left:auto;
  margin-right:auto;
  margin-top : 0px;
  padding : 3px 0px 0px 0px;
  width : 100%;
  text-align : center;
      clear : both;
  border-top: 3px solid #d2691e;

  }
  
#cont{
  width : 800px	;
  margin-left:auto;
  margin-right:auto;
  padding : 0px 0 0px 0px;
    text-align : left;
    clear : both;
    background-color : #ffffff;
}

#topl{
  width : 70%;
  margin : 20px 0 20px 0 ;
  padding : 0px 0px 0px 0px;
  float : left;
  }
  
#top_c{
  padding : 20px 0px 20px 0px;
  }
  

@-webkit-keyframes top_img {
	0% {
		-webkit-opacity:0;
		opacity:0;}

	30% {
		-webkit-opacity:1;
		opacity:1;}
	60%{
		-webkit-opacity:1;
		opacity:1;}
	80% {
		-webkit-opacity:0;
		opacity:0;}
	100%{
		-webkit-opacity:0;
		opacity:0;}
	}
#top_img{
  animation: top_img 20s infinite;
  -webkit-animation: top_img 20s infinite;
  }
  
.item_center{
  display : flex;
  flex-wrap:wrap;
  justify-content:space-around;
}

.herf_2{
  width : 40%;
  list-style : none;
  margin :0px 0px;
  border : 0px solid;
}
.center{
  text-align : center;
}
.herf_4{
  width : 20%;
  list-style : none;
  margin :0px 0px;
  border : 0px solid;
}

.h4_tit{
  text-align: center;
  position: relative;
  color: #d2691e;
  font-size : 1.5em;
}

.h4_tit:before,.h4_tit:after{
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 20%;
  height: 2px;
  background-color: black;
}
.h4_tit:before{
  left:0;
}
.h4_tit:after{
  right:0;
}

.btn{
  text-align : center;
  max-width: 220px;
    margin: 1em auto;
}

.btn a{
  padding :10px 3em 10px 3em;
  border: 2px solid #d2691e;
  border-radius:30px;
  cursor: pointer;
  transition: .2s;
}
.btn a:hover {
  background: #d2691e;
  color : #fffacd;
}

.btn a::after {
  content: "　▶︎";
}


  
#ani_b{
  background-image : url(../image/top.jpeg);
  background-position : center; 
  background-repeat: no-repeat;
  }

  
#aic{
    width : 30%;
    text-align : right;
    margin : 50px 0px 0px 0px;
      float : right;
  }
#bana{
    width : 100%;
    clear : both;
    text-align : center;
    padding : 45px 0px 10px 0px ;
}
#bana img{
    margin : 5px 5px 5px 5px;
}
  
#topr{
  width : 200px;
  margin : 0px 0 0px 0 ;
  padding : 0px 0 0px 0px;
        float : right;
	  text-align : center;
  }
  

#cont h1{
  width : 95%;
  margin : 20px 0 10px 10px;
  padding : 5px 6px 5px 15px;
  color :#696969;
  font-size : 1.5em;
  border-bottom: 5px solid #d2691e;
  text-align : left;
}



#cont h2{
  width : 95%;
  margin : 20px 0 20px 10px;
  padding : 5px 0 5px 15px;
  color :#696969;
  font-size : 120%;
  background-color :#f0f8ff;
  background : url(../image/h2-back.png) repeat-x;
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  border-left: 5px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  text-align : left;
  clear : both;
}

#cont h3{
  width : 90%;
  font-size : 110%;
    margin : 0px 0px 0px 10px;
    padding : 0px 0px 0px 15px;	
	  border-left: 5px solid #d2691e;
}
#cont h3 a{
  color:#696969;
}

#cont h4{
  font-size : 100%;
    margin : 10px 0px 10px 10px;
    padding : 0px 0px 0px 15px;
}

#cont h5{
  width : 95%;
  font-size : 100%;
    margin : 10px 0px 0px 10px;
    padding : 5px 4px 5px 10px;
    border-top: 1px dotted #d2691e;
    border-left : 1px dotted  #d2691e;
    border-right : 1px dotted  #d2691e;
    background-color : #fff5ee;
}


#cont ul{
  padding : 0;
  }
  
#cont p{
  margin : 0px 0 0px 10px;
  padding : 0px 18px 0px 20px;
  }
  
#tpix{
  margin : 0 0 0 10px;
  padding : 0;
    list-style-type: none;
  }
#tpix li{
  margin : 0 0 0 0px;
  padding : 0px 0px 0px 15px;
  width: 100%;
 border-bottom: 0px #c0c0c0 dotted;
   background: url(../image/mark-d.png) no-repeat 0px 2px;
 }
#tpix h3{
  margin : 10px 0 0 20px;
   font : 90% normal;
}
#tpix p{
  margin : 0 0 10px 30px;
  font-size : 80%;
  padding : 0px;
}

#center{
text-align : center;
}

#lefta{
margin:50px;
float:left;
}

#jig-o{
  padding : 0px;
  margin : 0px 0px 20px 0px;
  text-align : center;
    position : relative;
}
#jig{
  margin-left:auto;
  margin-right:auto;
  padding : 0px;
 width:40%;
 border : 1px solid #696969;
 display: inline-block;
}
#jig img{
 width : 95%;
 margin : 5px 0px 0px 0px;
}
#jig p{
  text-align : left;
    padding : 10px 5px;
}
#jig-o h4{
  font-size : 110%;
  color : #ffffff;
  border-bottom : 3px solid #d2691e;
  background-color : #d2691e;
  margin : 0px;
  padding : 5px 0px 5px 0px;
}

#book{
  width : 100%;
  height : 320px;
}

#book_l{
  float : left;
   text-align : center; 
  width : 30%;
}
#book_r{
  float : right;
    width : 70%;
}


.kensyu{
    text-align : center;
    clear : both;
    margin : 50px 0px;
  }
  
#point{
width : 94%;
  font-size:110%;
  color : #555555;
  margin : 0px 0px 0px 10px;
  padding : 10px 12px 10px 10px;
      border-left : 1px dotted  #d2691e;
      border-right : 1px dotted  #d2691e;
  }
.hyou{
 width : 92%;
   margin : 0px 0px 0px 0px;
   padding : 10px 0px 0px 0px;
      border-left : 1px dotted  #d2691e;
      border-right : 1px dotted  #d2691e;
      border-bottom : 1px dotted  #d2691e;
        text-align : justify;
 }

#feel{
  width : 625px
  }
  
#ask ul{
  list-style-type: none;
  margin : 10px 0 0 20px;
}
#ask li{
  margin : 2px 0 0 0;
  }
#ask iframe{
margin : 20px 0 0 20px;
}
#ask a{
  text-decoration : none;
  margin : 10px 0 0 20px;
}

.form_p {
 text-align : left;
  width:50%;
  margin:auto; 
}
.form_p input{
  width:100%;
}
.form_p textarea{
  width:100%;
  height:10em;
}

.form_button{
 margin-top : 20px;
 text-align : center;
}

.form_button button{
 margin-top : 20px;
 margin-bottom : 50px;
 -webkit-appearance: none;
 -moz-appearance: none;
  appearance: none;
  background: #ffffff;
  min-width: 100px;
  cursor: pointer;
  transition: .2s;
  padding :10px 3em 10px 3em;
  border: 2px solid #d2691e;
  border-radius:30px;
}

.form_button button:hover{
  background: #d2691e;
  color : #fffacd;
}
.form_button button:focus{
  outline: none;
  box-shadow: 0 0 0 5px #ffd9ab;
}

#go-top{
 clear : both;
 margin : 10px 20px 5px 0;
 text-align : right;
 }
#go-top a{
  background : url(../image/top.png) no-repeat right;
  padding : 10px 0px 10px 0;
  font-size : 90%;
  color :#696969;
  text-decoration : none;
 }
 #go-top a:hover{
  background : url(../image/top2.png) no-repeat right;
  padding : 10px 0px 10px 0;
  font-size : 90%;
  color :#d2691e;
  text-decoration : none;
 }
 
#title{
  margin : 20px 0px 0px 10px;
}

#ac-img{
width : 595px;
 clear : both;
 margin : 10px 0 0 0px;
 }

#p_pic{
float : left;
margin-left : 5%;
margin-bottom : 0px;
}
#gree{
padding : 50px 100px 50px 100px;
  text-align : justify;
}
#gree span{
  text-align:center;
}
#gree_r{
 text-align : right;
}

#cm{
  margin : 0px 25px 20px 30px;
  padding:0px 0px 0px 0px;
  width : 340px;
    background : url(../image/c-back.png) repeat-y top left;
  float : left;
  line-height: 0;
}
#cm p{
  margin:0px 0px 0px 0px;
  padding:0px 20px 0px 20px;
  line-height: 1.5;
  }
#cm2{
  margin : 0px 25px 20px 30px;
  padding:0px 0px 0px 0px;
  width : 340px;
  background : url(../image/c-back.png) repeat-y top left;
  float : right;
  line-height: 0;
}
#cm2 p{
  margin:0px 0px 0px 0px;
  padding:0px 20px 0px 20px;
  line-height: 1.5;
  }
#cl{
    clear : both;
    }
#ken{
	float:right;
	margin:20px 20px 20px 30px;
}

#bottom{
 box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
 clear : both;
 margin :20px 0px 0px 0px;
 padding :20px 0px 10px 0px;
 color : #ffffff;

 background-color : #d2691e;
 background-position : left ;

 margin-left:auto;
 margin-right:auto;
 text-align : center;

 }

 #bottom a{
   font-size : 80%;
  color : #ffffff;
  text-align : center;
  padding : 0 0px 10px 0px;
  }
#bottom a:hover{
  font-size : 80%;
  color : #696969;
  text-align : center;
  padding : 0 0px 10px 0px;
  }
#bottom p{
  font-size : 70%;
 margin : 20px 0 0 0;
 padding : 0 20px 0 0;
 }

@-webkit-keyframes back_t_ani {
	0% {
		-webkit-scale(0,0);
		scale(0,0);}
	100%{
		-webkit-scale(2,2);
		scale(2,2);}
	}

#back_t{
  text-align : right;
  font-size : 200%;
  margin : 0px 10px 10px 0px ;
  position: fixed;
  bottom: 125px;
  right: 40px;
}
#back_t a{
  color : #999999;
}
#back_t a:hover {
  color : #d2691e;
    animation: back_t_ani 10s infinite;
  -webkit-animation: back_t_ani 10s infinite;
}

#bottom_t{
  display : none;
  }

#sitemap{
  margin : 30px 0px 0px 80px;	
}

.kojin{
  font-size:80%;
}

#ryokin{  
  width : 100%;
    text-align : center;
  margin : 0px 0px 0px 0px;  
  padding : 0px;
}

#ryokin ul{
  width : 100%;
  text-align : center;
  list-style-type: none;
  margin : 0px 0px 0px 0px;  
  padding : 0px;
}

#ryokin li{
  width : 30%;
  list-style-type: none;
  position : relative;
  float : left;
  text-align : center;
  margin : 0px 0px 50px 0px;  
  padding : 0px 10px 0px 10px;

}
.ryo_left{
  border-right : 1px solid #808080;
}

#ryokin li span{
  font-size : 200%;
    margin : 0px;  
  padding : 0px;
}

.ryou{
  text-align : justify;
}
 
 
 
 
 
@media screen and ( max-width:480px ){

#head{
  background-color : #ffffff;
  margin-left:auto;
  margin-right:auto;
  margin-bottom : 0px;  
  padding : 0px;
  width : 100%;
  height : 80px;
  text-align : center;
  position: fixed;
  top: 0px;
  right: 0px;
  z-index : 999;
  }
  
#headcont{
  margin-left:auto;
  margin-right:auto;
  margin-bottom : 0px;
  margin-top : 0px;
  padding : 0px;
  width : 100%;
    height : 80px;
  background-color : #ffffff;
  }
  
#headcont img{
  margin : 15px 0px 0px 10px;
  padding : 0px;
  float : left; 
  height : 50px;
  }

#ashi{
  display:none;
  }

#menu{
  display : block;
  clear : both;
  background-color : #ffffff;
  margin : 0px 0px 0px 0px;
  padding : 0px;
  position : relative;
  overflow : hidden;
  width : 100%;
  font-size : 105%;
  position: fixed;
  top: 80px;
  right: 0px;
  z-index : 997;
  border-bottom : 20px solid #ffffff;
  }
  
#menu ul{
  margin : 0px 0px 0px 0px;
  padding : 0px 0px 0px 0px;
    width : 100%;
}

#menu li{
  position : relative;
  margin : 0px;
  padding : 0px 0px 15px 0px;
  width : 20%;
  height : 60px;
  text-align : center;
  float: left;
  list-style-type: none;
  font-size : 80%;
  }
  
#menu li a{
  height : 100%;
  padding : 10px 0 10px 0;
  text-align : center;
  text-decoration:none;
  background-color : #ffffff;
  color:#808080;
  display:block;
  box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;

  }
#menu li a:hover {
  height : 100%;
  padding : 10px 0 10px 0;
  text-decoration:none;
  background-image : none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
  }

#menu_t{
  display : block;
  clear : both;
  background-color : #ffffff;
  margin : 80px 0px 0px 0px;
  padding : 0px;
  width : 100%;
  font-size : 105%;
  text-align : center;
  position: relative;
  z-index : 998;
  }
  
#menu_t ul{
  margin : 0px;
  padding : 0px;
  width : 100%;
}

#menu_t li{
  position : relative;
  margin : 0px 0px 0px 0px;
  padding : 0px 0px 0px 0px;
  width : 50%;
  text-align : center;
  float: left;
  list-style-type: none;
  font-size : 80%;
  }
  
#menu_t li a{
  height : 80px;
  padding : 30px 0 0px 0;
  text-align : center;
  text-decoration:none;
  background-color : #ffffff;
  color:#808080;
  display:block;
  box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
  }
  
#menu_t li a:hover {
  height : 80px;
  padding : 30px 0 0 0;
  text-decoration:none;
  background-image : none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
  }
#visit {
  height : 100%;
  padding : 10px 0 10px 0;
  text-decoration:none;
  background-image : url(../image/menu4.png);
  color:#fffacd;
  display:block;
  box-shadow: 0 5px 4px -2px rgba(0,0,0,0.3) inset;
  }
  
#menu_t p{
  font-size : 120%;
} 

#menu_top{
 display :none;
}

#sma{
  font-size : 220%;
}
#sma_n{
 display :none;
}

#cbody{
  clear : both;
  background-color : #ffffff;
  margin-left:auto;
  margin-right:auto;
  margin-top : 150px;
  width : 100%;
  text-align : center;
  }
  
#cont{
  width : 100%;
  margin : 0px 0px 0px 0px;
  padding : 0px 0px 0px 0px;
    text-align : left;
    clear : both;
    background-color : #ffffff;

}
#cbody h1{
  width : 90%;
  margin : 20px 0 10px 0px;
  padding : 5 0 5 20px;
      margin-left:auto;
  margin-right:auto;
  color :#696969;
  font-size : 120%;
  background-position　：right;
  background-color :#ffffff;
  border-top: 0px solid #191970;
  border-bottom: 5px solid #d2691e;
  border-left: 0px solid #d2691e;
  border-right: 0px solid #191970;
  text-align : left;
  clear : both;
}
#cont h2{
  width : 90%;
  margin : 20px 0px 20px 0px;
  padding : 2px 0px 2px 10px;
    margin-left:auto;
  margin-right:auto;
  color :#696969;
  font-size : 110%;
  background-color :#f0f8ff;
  background : url(../image/h2-back.png) repeat-x;
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  border-left: 5px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  text-align : left;
}

#cont h3{
  width : 90%;
  font-size : 100%;
  margin : 0px 0px 0px 0px;
  padding : 0px 0px 0px 10px;	
      margin-left:auto;
  margin-right:auto;
  border-bottom: 1px dotted #d2691e;
}

#cont h4{
  width : 90%;
  font-size : 100%;
    margin : 10px 0px 10px 0px;
    padding : 0px 0px 0px 15px;
        margin-left:auto;
  margin-right:auto;
}

#cont h5{
  width : 90%;
  font-size : 100%;
  margin : 10px 0px 0px 0px;
  padding : 5px 0px 5px 5px;
  margin-left:auto;
  margin-right:auto;
  border-top: 0px dotted #d2691e;
  border-left : 0px dotted  #d2691e;
  border-right : 0px dotted  #d2691e;
  background-color : #fff5ee;
}
#cont h6{
  width : 92%;
  font-size : 100%;
      margin : 0px 0px 0px 0px;
    padding : 10px 0px 10px 5px;
        margin-left:auto;
  margin-right:auto;
  border : none;
  }
 
#topl{
  width : 100%;
  margin : 10px 0px 20px 0px ;
  padding : 0px 0 0px 0px;
  }
#tpix{
  margin : 0px 10px 0px 10px;
  padding : 0px;
    list-style-type: none;
  }
#tpix li{
  margin : 0px;
  padding : 0px 10px 5px 10px;
 border-bottom: 0px #c0c0c0 dotted;
 }
#tpix h3{
  margin : 10px 0px 0px 0px;
   font : 90% normal;
}
#tpix p{
  margin : 5px 15px 10px 10px;
  font-size : 80%;
  padding : 0px;
}


#ken{
  width:80%;
  float:none;
display: block;
 margin-left: auto;
 margin-right: auto;
}
#no{
  clear:both;
}

#top_img{
  display: none ;
}
#title{
  display: none ;
}
#p_pic{
  display: none ;
}
#aic{
  width : 100%;
  text-align : center;
  clear : both;
}

#jig-o{
  padding : 0px;
  margin : 0px 0px 20px 0px;
  text-align : center;
}
#jig{
  margin:0px 0px 10px 0px;
  padding : 0px;
 width:80%;
 border : none;
}
#jig img{
 width : 95%;
 margin : 5px 0px 0px 0px;
}

#book_l{
  clear : both;
   text-align : center; 
  width : 100%;
}
#book_r{
  clear : both;
    width : 100%;
    margin : 30px 0px 10px 0px; 
}

@-webkit-keyframes back_t_ani {
	0% {
		-webkit-scale(0,0);
		scale(0,0);}
	100%{
		-webkit-scale(2,2);
		scale(2,2);}
	}

#back_t{
  text-align : right;
  font-size : 200%;
  margin : 0px 0px 10px 0px ;
  position: fixed;
  bottom: 80px;
  right: 10px;
}
#back_t a{
  color : #999999;
}
#back_t a:hover {
  color : #d2691e;
    animation: back_t_ani 10s infinite;
  -webkit-animation: back_t_ani 10s infinite;
}

#bana{
    width : 100%;
    clear : both;
    text-align : center;
    padding : 45px 0px 10px 0px ;
}
#bana img{
    margin : 5px 5px 5px 5px;
}
#gree{
padding : 20px 10px;
}
#gree span{
text-align:left;
}

.kensyu{
    text-align : center;
    clear : both;
}


#bottom_m{
  display : none;
  }
#bottom{
  display : block;
  margin : 0px 0px 0px 0px;
  clear : both;
  padding :5px 0px 20px 0px;
  color : #ffffff;
  background-color : #d2691e;
  font-size : 100%;
  }
  
#ryokin{  
  width : 100%;
  text-align : center;
  margin : 0px 0px 0px 0px;  
  padding : 0px 20px 0px 20px;
}

#ryokin ul{
  width : 100%;
  text-align : center;
  list-style-type: none;
  margin : 0px 0px 0px 0px;  
  padding : 0px;
}

#ryokin li{
  width : 100%;
  list-style-type: none;
  text-align : center;
  margin : 0px 0px 40px 0px;  
  padding : 0px 0px 20px 0px;
}
.ryo_left{
  border-right : none;
  border-bottom : 1px solid #808080;
}
  
  }