﻿body{
	font-size: 0.8em;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	line-height: 180%;
	background: #CCFFFF;
}

header{
	width: 100%;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
	padding: 10px 0;
        background: #0099FF;
}

#header{
        width: 970px;
        margin: auto;
        padding: 10px 0;
}

h1{
	font-family: 'Raleway', "Arial Black";
	color: #FFF;
	font-size: 200%;
	font-weight: normal;
        float:left;
}

#search{
        float:right;
}

input{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#wrap{
	width: 970px;
	margin: 0px auto;
	padding: 20px 0;
}

nav{
	width: 170px;
        float:left;
}

nav li{
	border-bottom: 1px #CCC dotted;
	font-size: 95%;
}

.hl{
	font-size: 120%;
	margin-bottom: 6px;
	color:#324A7C;
}

.recent{
	padding-left: 20px;
        background: url(../img/recent.png) center left no-repeat;
}

.archive{
	padding-left: 20px;
        background: url(../img/archive.png) center left no-repeat;
}

.link{
	padding-left: 20px;
        background: url(../img/link.png) center left no-repeat;
}

#content{
	width: 500px;
        float: left;
}

aside{
	width: 260px;
        float: right;
        background: #FFF;
        border: 1px #CCC solid;
        padding: 9px;
        border-radius: 6px;

}

aside img{
	margin-bottom: 16px;
}

article{
	width: 470px;
	border: 1px #CCC solid;
	background: #FFF;
	padding: 14px;
	border-radius: 6px;
	margin-bottom: 16px;
}

section{
	margin-bottom: 16px;
}

.ttl{
	font-size: 130%;
}

.date{
	text-align: right;
}

.name{
	text-align: right;
}

#footer{
        width: 970px;
        margin: auto;
}


#footer ul{
	text-align: center;
}

#footer li{
	display: inline;
	padding: 0 10px;
}

footer{
	clear:both;
	padding: 10px 0 30px;

}

footer p{
	text-align: center;
	padding: 10px;
}

section:after {
  content: "";
  clear: both;
  display: block;
}

#wrap:after {
  content: "";
  clear: both;
  display: block;
}
#header:after {
  content: "";
  clear: both;
  display: block;
}

a{
	color: #333;
        text-decoration: none; 
}

a:hover{
	text-decoration: underline;
}

a:hover{
        color: #33ff00;
}



