@charset "utf-8";

div.hidearea {
  color: #EEEEEE;
}

div#page_gallery ul {
  margin: 10px 0 20px 0;
}
div#page_gallery ul li {
  display: inline;
}
div#page_gallery ul li img {
  margin: 0 2px 10px 0;
}

div#mokuji h3 {
	display: none;
}

div#mokuji ul li {
	display: inline;
	list-style: none;
	margin-right: 10px;
}

div#textmenu {
width: 95%;
margin: 0;
padding: 20px;
}

p.hidari { clear:both; }

table.claps tr th {
	padding: 0;
	border: 0;
	text-align: center;
}
table.claps tr td {
	padding: 0;
	border: 0;
} 


.list7 {
	font-size: 1.5em;
        color: #669;
}
 

.note {
  position: relative;
  background-color: #eee;
  padding: 1.5em;
    display: inline-block;
padding-top: 25px;
border-radius:10px;
	border: 1px dashed #ddd;
}
.note h5 {
  position: absolute;
  top: -1em;
  background-color: rgba(100,100,100,0.4);
  padding: 0.25em 2em;
  color: #fff;
  transform: rotate(-4deg);
}

.note dt{
font-weight:bold;
}


.about p {
     padding-left: 3em;
     padding-right: 3em;
} 
.about dl {
     padding-left: 3em;
     padding-right: 3em;
} 
.about h5 {
	position: relative;
	padding: .75em 1em .75em 1.5em;
	border: 1px dashed #ccc;
}
.about h5::after {
	position: absolute;
	top: .5em;
	left: .5em;
	content: '';
	width: 6px;
	height: -webkit-calc(100% - 1em);
	height: calc(100% - 1em);
	background-color: #ff3366;
	border-radius: 4px;
}


.main h6 {
	position: relative;
	padding: .5em .75em;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 10px;
}
.main h6::before,
.main h6::after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	height: 0;
	width: 0;
	border: 10px solid transparent;
}
.main h6::before {
	border-top: 15px solid #ccc;
}
.main h6::after {
	margin-top: -2px;
	border-top: 15px solid #fff;
}

p.title {
	position: relative;
	padding-bottom: .1em;
font-size: 140%;
	font-weight: bold;
  padding-left: 1em;
}
p.title::before,
p.title::after {
	position: absolute;
	bottom: -4px;
	left: 0;
	content: '';
	height: 4px;
}
p.title::before {
	z-index: 2;
	width: 15%;
	background-color: #444;
}
p.title::after {
	width: 100%;
	background: -webkit-repeating-linear-gradient(45deg, #fff, #fff 2px, #aaa 2px, #aaa 4px);
	background: repeating-linear-gradient(45deg, #fff, #fff 2px, #aaa 2px, #aaa 4px);
}


.text_list {
  margin:0 auto;
  padding:20px;
}

.text_list ul {
  padding-left:0;
  margin-left:40px;
}

.text_list li:first-child {
  border-top:1px dotted #ccc;
}

.text_list li {
  list-style-type : none;
  padding:5px 10px;
  border-bottom:1px dotted #ccc;

}

.new:after {
content: url(http://oujyusansan.hozue.com/freo/files/medias/new.gif);
}

.rat {
color: #ff60a0;
}

/* ▼リスト全体の装飾 */
ul.simplemenu {
   margin: 40px;           /* 外側の余白を消す */
   padding: 0px;          /* 内側の余白を消す */
   list-style-type: none; /* リストの先頭記号を消す */
}

/* ▼各リスト項目の装飾 */
ul.simplemenu li {
   display: inline-block;      /* 横方向に並べる指定 */
   margin: 10px 0.25em 0.25em 0px; /* 外側の余白の調整 */
   padding: 0px;                  /* 内側の余白を消す */
}

/* ▼各リスト項目内のリンクの装飾 */
ul.simplemenu li a {
   padding: 0.2em 0px 0.2em 0.8em;      /* 内側の余白を調整 */
   border-left: 1px solid #cccccc; /* 枠線の指定 */
text-decoration: underline;

}

#honbun { width:  80%;
margin-left: auto;
margin-right: auto;
font-size: 120%;
line-height: 150%; 
}


/********* HTML再定義 ***********************************************/

body {
	padding: 10px;
	background-color: #888888;
background-image: url("http://hozue.com/oujyusansan/freo/files/medias/kabe03.jpg");
	color: #656565;
}

a:link {color:#9370DB;} /*未訪問のリンクの色*/
a:visited {color:#550055;} /*訪問済みのリンクの色*/
a:hover {color:#666; background:#d7efd7;} /*カーソルが乗っているリンクの色*/
a:active {color:#ffff00;} /*クリック中のリンクの色*/


h2, h3, h4, h5, h6 {
	font-size: 120%;
}
h2 {
	position: relative;
	padding: 0 .5em .5em 2em;
	border-bottom: 1px solid #ccc;
	font-weight: bold;
margin: 60px 10px 0 0;
font-size: 1.5em;
clear:left;
}

h2::before,
h2::after {
	position: absolute;
	content: '';
	border-radius: 100%
}
h2::before {
	top: .2em;
	left: .2em;
	z-index: 2;
	width: 18px;
	height: 18px;
	background: rgba(150, 150, 150, .5);
}
h2::after {
	top: .7em;
	left: .7em;
	width: 13px;
	height: 13px;
	background: rgba(210, 210, 210, .5);
}

/********* 全体 *****************************************************/

div#container {
	width: 760px;
	margin: 0 auto;
	padding: 20px;
	border-bottom: 5px solid #666666;
border-right: 2px solid #666666;
border-left: 1px solid #666666;
	background-color: #FFFFFF;
border-radius:15px;
  min-height: 700px;
  height: auto !important;
  height: 100px;

}

/********* ヘッダー *************************************************/

div#header {
float: left;
margin-top: 5px;
margin-left: 15px;
margin-right: 20px;
}
div#header h1 {
	line-height: 1.0;
	margin:  0 0 15px 0;
}
div#header h1 a:link, div#header h1 a:visited {
	color: #222222;
	text-decoration: none;
}
div#header h1 a:active, div#header h1 a:hover {
	color: #666;
	text-decoration: none;
}

/********* フッター *************************************************/

div#footer {
	clear: both;
 text-align: right; 
font-size: smaller;
}
div#footer address {
	padding-top: 10px;
	border-top: 1px solid #999999;
}

div#footer address a{
text-decoration: none;
}

/********* メニュー *************************************************/

div#menu {
	background-color: #99cc00;
  width:850px;
  padding:0;
  margin: 25px 0 0 0;
  list-style-type: none;
}

div#menu h2 {
	display: none;
}


#menu li {
  width:12%;
  float:left;
  padding:0;
  margin: 0 0 30px 0;
  text-align:center;
  list-style-type: none;
}

#menu li a {
  width:auto;
  color:#fff;
  font-size:12px;
  font-weight:bold;
text-shadow:0 -1px 0px #333,0 1px 0px #555;
  padding:10px 0;
  text-decoration:none;
  display:block;
  background:#666;
 background-image: -moz-linear-gradient(top, #888 0%, #777 50%, #666 50%, #777 100%);
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #888), color-stop(0.50, #777), color-stop(0.50, #666), color-stop(1, #777));
border-left:1px solid #444;
box-shadow: 1px 0px 0px rgba(225,225,225,0.3) inset,
             -1px 0px 0px rgba(225,225,225,0.3) inset,
              0px 1px 1px rgba(0,0,0,0.1) inset,
              0px -1px 1px rgba(0,0,0,0.3) inset,
              0px 1px 3px #666;

}

#menu li a:hover {
  background:#555;
 background-image: -moz-linear-gradient(top, #555 0%, #444 50%, #333 50%, #444 100%);
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #555), color-stop(0.50, #444), color-stop(0.50, #333), color-stop(1, #444));
  box-shadow: 1px 0px 0px rgba(225,225,225,0) inset,
             -1px 0px 0px rgba(225,225,225,0) inset,
              0px 1px 1px rgba(0,0,0,0.1) inset,
              0px -1px 1px rgba(0,0,0,0.3) inset,
              0px 1px 3px #666;
}

#menu li:first-child a{
  border-radius:5px 0 0 5px;
  border-left:0;
  box-shadow:-1px 0px 0px rgba(225,225,225,0.3) inset,
              0px 1px 1px rgba(0,0,0,0.1) inset,
              0px -1px 1px rgba(0,0,0,0.3) inset,
              0px 1px 3px #666;
}

#menu li:last-child a{
  border-radius:0 5px 5px 0;
  box-shadow: 1px 0px 0px rgba(225,225,225,0.3) inset,
              0px 1px 1px rgba(0,0,0,0.1) inset,
              0px -1px 1px rgba(0,0,0,0.3) inset,
              0px 1px 3px #666;
}




/********* 内容 *****************************************************/

div#content {
	float: left;
	width: 550px;

}

/********* エントリー ***********************************************/

div#entry h2 {
	display: none;
}
div#entry div.entry {
	width: 550px;
	margin: 15px 0;
	border: 1px solid #999999;
  border-radius:5px;
}
div#entry div.entry h3 {
	margin: 0;
	padding: 10px 10px 0 10px;
}
div#entry div.entry h3 a:link, div#entry div.entry h3 a:visited {
	color: #222222;
	text-decoration: none;
}
div#entry div.entry h3 a:active, div#entry div.entry h3 a:hover {
	color: #777777;
	text-decoration: none;
}
div#entry div.entry div.content {
	margin: 0 10px;
}
div#entry div.entry ul.information {
	margin: 2px 10px 15px 10px;
	padding-top: 2px;
	border-top: 2px dotted #669;
	font-size: 90%;
}
div#entry div.entry ul.information li {
	display: inline;
	margin-right: 5px;
}
div#entry div.entry ul.link {
	margin: 0;
	padding: 10px;
	text-align: right;
}
div#entry div.entry ul.link li {
	display: inline;
	margin-left: 5px;
}

div#entry div#entry_link h3 {
	display: none;
}
div#entry div#entry_link ul.entry_link {
	margin: 0;
}
div#entry div#entry_link ul.entry_link li {
	display: inline;
	list-style: none;
	margin-right: 10px;
}
div#entry div#entry_link ul.entry_link li.home {
	padding-right: 10px;
	padding-left: 10px;
	border-right: 1px solid #999999;
	border-left: 1px solid #999999;
}
div#entry div#entry_link ul.entry_link li.previous:before {
	content: "<< ";
}
div#entry div#entry_link ul.entry_link li.next:after {
	content: " >>";
}

div#entry div.entry ul.information li.migi {
   float:right;
}

div#entry div.entry ul.information li.migimae{
   clear: right
}


/********* ページ移動 ***********************************************/

div#page h2 {
	display: none;
}
div#page ul.order {
	margin: 10px 0;
}
div#page ul.order li {
	display: inline;
	list-style: none;
	margin-right: 10px;
}
div#page ul.direct {
	margin: 10px 0;
	text-align: right;
}
div#page ul.direct li {
	display: inline;
	list-style: none;
	margin-left: 10px;
}

/********* コメント *************************************************/

div#comment div.comment ul.information {
	margin: 15px 0 0 0;
	text-align: right;
}
div#comment div.comment ul.information li {
	display: inline;
	margin-left: 5px;
}

/********* トラックバック *******************************************/

div#trackback div.trackback ul.information {
	margin: 15px 0 0 0;
	text-align: right;
}
div#trackback div.trackback ul.information li {
	display: inline;
	margin-left: 5px;
}

/********* インフォメーション ***************************************/

div#information {
	margin-bottom: 30px;
background-repeat : no-repeat;
background-position: right center;
background-image: url("http://oujyusansan.hozue.com/freo/files/medias/top_hana.jpg")

}
div#information ul.continue {
	margin: 0;
	text-align: right;
}
div#information ul.continue li {
	display: inline;
}





/********* ユーティリティ *******************************************/

div#utility {
	float: left;
	width: 200px;
	margin-left: 10px;
	margin-bottom: 20px;
}
div#utility h2 {
	display: none;
}
div#utility div.utility {
	margin: 10px 0;
	padding-bottom: 10px;
	background-color: #f5f5f5;
  border-radius:5px;
	border-bottom: 1px solid #669;
	border-left: 1px solid #669;
	border-right: 1px solid #669;

}
div#utility div.utility h3 {
  border-radius:5px;
	padding: 5px 0 5px 10px;
	border-left: 6px solid #669;
	border-top: 1px solid #669;
	border-bottom: 1px solid #669;
}
div#utility div.utility div.content {
	margin: 0 10px;
}
div#utility div.utility ul {
	margin-right: 0;
}
div#utility div.utility ul li ul {
	margin-top: 0;
	margin-bottom: 0;
}

.likesi {
	list-style-type: none;
}

div#utility div.utility form {
	margin: 0;
}
div#utility div.utility form dl {
	margin: 0;
}
div#utility div.utility form dl dt {
	display: none;
}
div#utility div.utility form dl dd {
	margin: 0;
}
div#utility div.utility form dl dd input {
	width: 170px;
}
div#utility div.utility form p {
	margin: 0 0 10px 0;
}

div#utility div.utility table.calender {
	margin: 0;
	border: 0px solid #000000;
}
div#utility div.utility table.calender tr th, table.calender tr td {
	padding: 5px;
	border: 0px solid #000000;
	background-color: #EEEEEE;
	font-weight: normal;
	text-align: center;
}
div#utility div.utility table.calender tr td span.day {
	color: #222222;
}
div#utility div.utility table.calender tr td span.satday {
	color: #2222CC;
}
div#utility div.utility table.calender tr td span.sunday {
	color: #CC2222;
}
div#utility div.utility ul.calender {
	margin: 10px 0;
}
div#utility div.utility ul.calender li {
	display: inline;
	list-style: none;
	margin-right: 10px;
}

div#utility div.utility ul.gallery {
	margin: 0;
	padding: 0;
}
div#utility div.utility ul.gallery li {
	list-style: none;
}
div#utility div.utility ul.gallery li img {
	max-width: 180px;
	max-height: 130px;
	margin-bottom: 5px;
}

/********* ギャラリー ***********************************************/

div#gallery {
	overflow: hidden;
}
div#gallery div.gallery {
	float: left;
	margin-right: 12px;
	margin-bottom: 20px;
}
div#gallery div.gallery p.picture {
	overflow: hidden;
	width: 140px;
	height: 100px;
	margin: 0;
}
div#gallery div.gallery p.picture a {
	color: #FFFFFF;
	text-decoration: none;
}
div#gallery div.gallery p.picture a img {
	min-width: 140px;
	min-height: 100px;
}
div#gallery div.gallery p.picture a span.empty {
	display: block;
	line-height: 100px;
	width: 140px;
	height: 100px;
	background-color: #AAAAAA;
	text-align: center;
}
div#gallery div.gallery p.comment {
	overflow: hidden;
	width: 140px;
	margin: 3px 0 0;
	font-size: 80%;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

div#gallery ul {
	margin: 10px 0 20px 0;
}
div#gallery ul li {
	display: inline;
}
div#gallery ul li img {
	margin: 0 2px 10px 0;
}

/********* 個別指定 *************************************************/

div#page_link h3 {
	display: none;
}

div#page_link ul.page_link {
	margin: 0 0 20px 0;
}
div#page_link ul.page_link li {
	display: inline;
	list-style: none;
	margin-right: 10px;
}
div#page_link ul.page_link li.home {
	padding-right: 10px;
	padding-left: 10px;
	border-right: 1px solid #999999;
	border-left: 1px solid #999999;
}
div#page_link ul.page_link li.previous:before {
	content: "<< ";
}
div#page_link ul.page_link li.next:after {
	content: " >>";
}

ul.link {
	margin: 0;
	padding: 10px;
	text-align: right;

}
ul.link li {
	display: inline;
	margin-left: 5px;

}

/********* レスポンシブ *********************************************/

@media (max-width: 480px) {
	body {
		padding: 5px;
	}
	form textarea {
		width: 95%;
	}
	img {
		max-width : 100%;
		height: auto;
	}
	div#container {
		width: 90%;
		padding: 15px;
	}
	div#content {
		float: none;
		width: 100%;
	}
	div#entry div.entry {
		width: 100%;
		border-right: 0;
		border-left: 0;
	}
	div#utility {
		float: none;
		width: 100%;
		margin: 0;
	}
}

/********* IE6用設定 ************************************************/

* html body {
	text-align: center;
}
* html div#container {
	width: 800px;
	text-align: left;
}
* html pre {
	width: 100%;
}
* html table tr th, * html table tr td {
	font-size: 80%;
}