body{

  margin:10;
  padding:0;
  background:#bbdbe5;
 
}

#outline { ←これがサイトの内容が入るボックス
width:950px;
 text-align:left;

 line-height: 1.6em;
 margin: 0px auto;
 word-spacing: 0.5em;
 background:#f5e2b8;
padding:0;
 }

header{
  margin:0;
  padding:0;
  width:950;
  height:170px;
  background:#fff;
  background-image:url(image/1.jpg);
  background-position:right;
  background-repeat:no-repeat;
  font-weight:bold;   
  font-size:18px;
  font-family:'Yu Mincho', meiryo ,sans-serif;
  text-align:center;
  color:#40361f;



}

header p{
  margin:0;
  padding-right:50%;
  padding-top:70px;  
  padding-right:50%;  
  position:relative;

}

header p:before{
  content:"京都のお寺・神社巡り";
  color:#dfd7c3;
  font-weight:normal;
  font-size:30px;
  font-family:'SimSun', meiryo ,sans-serif;
  position:absolute;
  top:40px;
  left:130px;
  font-weight:bolder;
}

#menu{
  width:200px;
  height:700px;
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  font-size:14px;
  float:left;
  top:10px;
position:-webkit-sticky;
position:sticky;


  margin:5px 5px;
}
#main{
  margin:40px 0;

}


#main_contents{
  background-color:#ffffff;
  margin:5px 10px 5px 0px;
  padding:5px;
  width:700px;
   font-size:16px;
  float:right;

}

footer{
  clear:both;
  background:#372F2D;
  margin:auto;
  font-family:Arial,sans-serif;
  font-size:14px;
  color:#ffffff;
  text-align:center;
  line-height:45px;
}

h1{
  font-size:24px;
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, Helvetica, Arial, sans-serif;
  text-align:center;
}

h2{
  font-size:18px;
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, Helvetica, Arial, sans-serif;
  border-left:solid #FF9999 7px;
  padding:5px;

}

p{

 font-size:15px; 
 color:#463a1c;
}

p.text{
  font-size:16px;
  font-family: 'Hiragino Kaku Gothic ProN', Meiryo, Helvetica, Arial, sans-serif;
  color:#463a1c;
  line-height:1.5em;
}


#menu ul{
  list-style-type:none;
  margin:0;
  padding:0;
}
 #menu ul{
  background:#fff;
  padding:10px;
}




#menu li{
  width:100%;
  line-height:2em;
  border-bottom: 1px solid #ebe4da;
}

#menu a{
  display:block;
}

#menu a{
  display:block;
  text-decoration:none;
  color:#463a1c;
  padding:6px 5px 20px;
  position:relative;
}


#menu a:after{
  content:"HOME";
  font-family: 'Mv Boli', cursive;
  font-size:0.8em;
  color: #cbbe9c;
  position:absolute;
  bottom:0;
  left:5px;
}


#menu li:nth-child(2) a:after{
  content:"home";
}
#menu li:nth-child(3) a:after{
  content:"arasiyam";
}
#menu li:nth-child(4) a:after{
  content:"nisikiitiba";
}
#menu li:nth-child(5) a:after{
  content:"byoudouinhououdou-";
}
#menu li:nth-child(6) a:after{
  content:"tujiri";
}
#menu li:nth-child(7) a:after{
  content:"nanzenji";
}
#menu li:nth-child(8) a:after{
  content:"kawadokoryouri";
}
#menu li:nth-child(9) a:after{
  content:"fusimiinaritaisya";
}
#menu li:nth-child(10) a:after{
  content:"kiyomizudera";
}
#menu li:nth-child(11) a:after{
  content:"kinkakuji";
}

#menu li:nth-child(12) a:after{
  content:"sanjyuusangendou";
}






#menu li:first-child{
  background-color: rgba(243,241,233,0.5);
}
#menu li:last-child{
  border-bottom:none;
}

#menu a:hover{
  background-color: rgba(243,241,233,0.5);
}
#menu a:active{
  background-color: #FF9999;
}


a {
  -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    transition: 0.3s;
}
#page {
  width:950px;
  margin: 0 auto;
}
#main:after{
  content:"";
  clear:both;
  display:block;
}

 
div.text-right{
  float:right;
  width:540px;
}

div.text-img:after{
  content:"";
  clear:both;
  display:block;
}

.dashed_line {
font-size:20px;
  border-top: dashed 2px #f5e2b8;
  border-bottom: dashed 2px #f5e2b8;
  padding: 10p 
 

}








