@charset "utf-8";
/* 共通スタイル */

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
/* IE8対策の背景 */
	background: url(../img/header_backimg.png) no-repeat center top;
/* 通常ブラウザの背景 */
	background: url(../img/header_backimg.png) no-repeat center top, url(../img/footer_back.png) no-repeat right bottom fixed;
	background-color: #F1FBE3;
    line-height:1.6;
}

/*ボックスレイアウト*/
#wrapper{
	width:900px;
	margin: 0 auto;
	position:relative;
}

#nav{
	width: 123px;
	position: absolute;
	top: 75px;
	right: -130px;
}

#nav ul{
	list-style-type:none;
}

#nav li{
	line-height:1.6;
	margin: 5px 0;
}

#nav li a{
	display:block;
}

#header{
	margin-bottom:10px;
}

#footer{
	padding:10px 5px;
	text-align:right;
	background:#FFF;
	border-radius: 0 0 5px 5px;
}

#wrapper-inner{
	background:#FFF;
	position:relative;
	border-radius:5px 5px 0 0;
}

#contents{
	width:690px;
	float:right;
	margin-right:10px;
}

#contents3colum{
	width:460px;
	float:right;
	margin-right:240px;
}

#subnav{
	width:180px;
	float:left;
	margin-left:10px;
}

.subnavborder{
	background:#FFE;
	padding:0.5em;
	margin:0.5em 0;
}

#aside{
	width:220px;
	position:absolute;
	top:0px;
	right:10px;
}

/*index用スタイル*/

#album{
	width:146px;
	float:left;
}

#album p{
	padding:7px;
	line-height:0;
}

#album p.link{
	clear:both;
}

#album p.link a{
	padding-left:15px ;
	background:url(../img/arrow-l.png) no-repeat 0 0.3em ;
}

#topcontents{
	width:504px;
	float:right;
	margin-right:240px;
}

#topphoto{
	margin-bottom:10px;
}

#asideindex{
	width: 220px;
	position: absolute;
	top: 370px;
	right: 10px;
}

#likebox{
	margin-top:10px;
}

/* 記事中 */

h2{
	font-size:1.4em;
	font-weight:normal;
	color:#060;
	letter-spacing:0.2em;
	margin: 0.5em 0;
	border-radius:5px;
	background:#EAF3E4;
	padding:5px;
	padding-left:0.5em;
}

h3{
	font-size:1.2em;
	font-weight:normal;
	color:#060;
	letter-spacing:0.1em;
	border:solid 1px #CCC;
	padding:3px;
	padding-left:0.5em;
	box-shadow:1px 1px  2px #CCC;
	margin:1em 0;
	border-radius:5px;
}

h4{
	margin: 1em 0;
	color:#060;
	padding:5px;
	border-left:solid 5px #060;
	font-weight:normal;
}

blockquote{
	border-left:solid 2px #CCC;
	padding:5px;
	margin: 0 1em;
}

ol{
	margin:1em 0 1em  2em;
	line-height:1.6;
}

th{
	padding:5px;
	border:solid 1px #999;
	background:#E6FFE6;
	text-align:left;
	font-weight:normal;
}

td{
	padding:5px;
	border:solid 1px #999;
}

.attention{
	color:#F00;
}

.attention-blue{
	color:#00F;
}

.attention-box{
	color:#F00;
	border:solid 1px #009900;
	padding:5px !important;
	margin:auto 1em  !important; 
}

.small-text{
	font-size:0.7em;
}

#contents p,#contents3colum p,#topcontents p{
	line-height:1.6;
	margin: 1em 0;
	padding: 0 0.3em;
}

.listtitle{
	margin: 0.5em 0;
	border-radius:5px;
	background:#EAF3E4;
	padding:5px;
}

.listtitle p{
	margin:0 !important;
}

.listtitle .title{
	width:4em;
	overflow:hidden;
	float:left;
}

.listtitle .link{
	width:4em;
	overflow: hidden;
	float:right;
	border-radius:0 5px 5px 0;
}

.listtitle .link a{
	display:block;
	padding-left:15px ;
	background:url(../img/arrow-l.png) no-repeat 0 0.3em ;
}

ul.listcontent{
	list-style:none;
	margin:0 0.3em 1em 0.3em ;
}

ul.listcontent li{
	line-height:1.6;
	padding-left:15px;
	background:url(../img/arrow-l.png) no-repeat 0 0.3em ;
	margin:0.5em 0;
}

/*写真アルバム*/

ul.album{
	list-style-type:none;
	
}

ul.album li{
	display:block;
	float:left;
	padding:2px;
	line-height:1.6;
	margin:10px 0;
}

/*タブレット（横）用スタイル*/
@media screen and (max-width: 1024px) {

/*背景*/

  body{
	  background: url(../img/header_backimg.png) no-repeat center top;
	  background-color: #F1FBE3;
  }

  #wrapper{
	  width:900px;
	  margin: 0;
	  position:relative;
  }

}

/*スマートフォン用スタイル*/
@media screen and (max-width: 570px) {

/*背景*/

  body{
	  background: url(../img/header_backimg.png) no-repeat center top;
	  background-color: #FFF;
  }

/* Responsive images and other embedded objects */

  img,object,embed,video,iframe {
	width: auto;
	max-width: 100%;
  }
  
  img,video,iframe {
	height: auto;
  } 

/*ボックスレイアウト*/

#wrapper,#wrapper-inner,#nav,
#contents,#contents3colum,#subnav,#aside,
#album,#topcontents,#asideindex
{
	width:100%;
	margin:0;
	padding:0;
	float:none;
	position:relative;
	top:auto;
	right:auto;
}

#header{
	margin-bottom:0.5eｍ;
}

#footer{
	padding:1em 0.5em;
	text-align:left;
}

#nav,#album{
	margin:20px 0px;
}

#album p{
	float:left;	
}

#nav li a{
	height:42px;
	line-height:42px;
	padding-left:15px ;
	background:url(../img/arrow-l.png) no-repeat 2px 50% ;
	background-color:#EAF3E4;
}

#likebox{
	display:none;
}

}