body {
	width:100%;
	margin: 0px;		/* ページ全体のmargin */
	padding: 0px;		/* ページ全体のpadding */
	font-size: 18px;		/* フォントサイズを初期値(16px)の80％分に指定（12.8px相当の大きさ） */
	font-family:'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	background-image: url("img/bg.gif"); /* 画像のファイル名を入れる */
	background-attachment: fixed;
	text-align: center;	/* 下記のautoに未対応用のセンタリング */
	line-height:1.6;	/* 本文記事の行間 */
	position:relative;
}


.highlight {

 	background: yellow;

}
a:link {
	color:#0000FF;
	text-decoration:underline;
}
a:hover {
	color:#cc0000;
	text-decoration:underline;
}
a:active {
	color:#FF0000;
	text-decoration:underline;
}
a:visited {
	color:#990099;
	text-decoration:underline;
}
.alignleft {
	float: left;
	margin: 0px 15px 0 0; /* 右に 15px の余白 */
}
.alignright {
	float: right;
	margin: 0px 0 0 15px; /* 左に 15px の余白 */
}
.center {
	display:block;
	margin:0 auto;
}
.clear {
	clear: both;
}
td, th {
	padding: 0px 10px 0px 10px;
}
.ad {
	margin-top:20px;
	margin-left:20px;    /* 左の余白 */
	margin-right:20px;
	margin-bottom: 20px;
	font-size :16px;
}
.kiro {
	background-color:#ffff66;
}
.usuao {
	background-color:#87CEFA;
}
/*色を指定します*/
.mizu {
	color: #0080c0;
}
.pink {
	color: #ff99ab;
}
.ao {
	color: #002255;
}
.tya {
	color: #bd000e
}
.gray {
	color: #3d3737
}
.aka {
	color: #db0000;
}
.akapink {
	color: #e70049;
}
.green {
	color: #369B50;
}
.aomidori {
	color: #2ebab7;
}
.enji {
	color: #9c2662;
}
.ora {
	color: #ff9900;
}
.siro {
	color:#ffffff;
}
.kuro {
	color: #000000;
}
.ruri {
	color: #2A5CAA;
}
.ppoint {
	color:#dboooo
}
.hosyo {
	font-size: 10px;
}
/*文字を太くします*/
.b {
	font-weight: bold;
}
/*下線を引きます*/
.u {
	text-decoration: underline;
}
/*文字のフォントを指定します*/
.big {
	font-size: 22px;
}
.big1 {
	font-size: 24px;
}
.big2 {
	font-size: 20px;
}
.big14 {
	font-size: 14px;
}
.big18 {
	font-size: 18px;
}
.big20 {
	font-size: 20px;
}
.big23 {
	font-size: 23px;
}
.big16 {
	font-size: 16px;
}
.s10 {
	font-size: 10px;
}
.small {
	font-size: 14px;
	line-height: 110%;
}
/*文字を装飾します*/
.line {
	background: #ffff7d;
	line-height:150%;
	height:100%;
	padding-top: 5px;
}
/*ＦＦ*/
html>body .line {
	padding: 0;
}
/*IE7.0*/
*:first-child+html .line {
	padding: 0;
}
/*文字列を右に指定します*/
.gotoh2 {
	margin: 10px 10px 1px 10px;
	padding-top:0px;
	text-align: right;
	font-size: 16px;
	font-weight: bold;
}
.golist {
	margin: 1px 30px 1px 10px;
	padding-top:0px;
	text-align: right;
	font-size: 18px;
	font-weight: bold;
}
/*大文字*/
.goto {
	margin: 1px 10px 1px 10px;
	padding-top:0px;
	text-align: right;
	font-size: 18px;
	font-weight: bold;
}
.box {
	float: left;
}
.boxContainer {
	overflow: hidden;
}
/* clearfix */
.boxContainer:before, .boxContainer:after {
	content: "";
	display: table;
}
.boxContainer:after {
	clear: both;
}
/* For IE 6/7 (trigger hasLayout) */
.boxContainer {
	zoom: 1;
}


ul {
	padding: 2px;	/* サイドバーリンクの余白の幅 四方全て */
	margin: 0px;
}
li {
	margin:0px;
	list-style-type:none;
	list-style-position:outside;
}
img {
	border: none;	/* 画像の枠 */
}
a img {
	border: none;	/* 画像リンクの枠 */
}
.w3c {
	text-align: center;	/* W3Cのバナーの位置 */
}



.row {
	overflow:hidden;
}
p {
	margin:0.1em 0;
}

img {
	max-width:100%;
	height:auto;
}
.mgb20 {
	margin-bottom:20px;
}
.mgb40 {
	margin-bottom:40px;
}
.linegreen {
	background:url(img/22.png) repeat-x;
	height:3px;
	border:none;
}
.lineblue {
	background:url(img/lain.png) repeat-x;
	height:3px;
	border:none;
}

.midashi {
	border-bottom:dashed 2px #e5e5e5;
	margin-bottom:10px;
}

.midashi:before {
	content:url(img/6.gif);
	position: relative;
	top: 20px;
	left:0;
}

.b_gray {
	border:solid 1px #ccc;
	border-radius:5px;
	padding:10px;
}

.b_green {
	border:solid 4px #228B22;
	border-radius:5px;
	padding: 12px;
}
	

/* ページの中身 */
#main {
	margin-right: auto;
	margin-left: auto;
	text-align: left;	/* 中身を左側表示に戻す */
	width:980px;		/* ページの幅 */
	background: #ffffff;	/* ページの背景色 */
	border-left: 1px solid #DCDCDC;
	border-right: 1px solid #DCDCDC;
	box-shadow:0 0 5px 5px rgba(0, 0, 0, 0.2);
	overflow:hidden;
}
/* ヘッダー */
#head {
	width:100%;		/* ヘッダーの幅 *//*background: url("img/heda.png") no-repeat;
	background-size:100% 100%;*/
}
/* 左サイド（本文） */
#left {
	width: 690px;	/* 左サイドの幅 */
	float: left;	/* 左サイドの配置位置 */
	margin:0 20px 0 0;
}
/* サイトタイトル */
h1 {
	font-size: 70%;		/* bodyフォントサイズ(約12.8px)の180% (23px相当) */
	color: #333333;			/* 大見出しの文字の色 */
	padding: 0px 10px 0px 0px;	/* 大見出しの余白 上・右・下・左の順 */
	margin: 0px;
	text-align:right;
	background-color:#228B22;
}
.title {
	border-bottom:5px solid #228B22;
	background: url(titleimg.jpg) no-repeat center;
	background-size: contain;
	padding-top:25.5%;
}

.title p {
	font-size: 1.6em;
	font-weight: bold;
}
.title img {

}
/* サイト説明文 */
.kome {
	font-size: 15px;		/* bodyフォントサイズ(約12.8px)の117% (15px相当) */
	color: #333333;			/* サイト説明文の文字の色 */
	line-height:1.3;	/* 本文記事の行間 */
	padding:20px;
	position: absolute;
	bottom: 0;
	width: 69%;
	text-align:center;
}
/* サイト説明文 */
.kome1 {
	font-size: 16px;		/* bodyフォントサイズ(約12.8px)の117% (15px相当) */
	color: #333333;			/* サイト説明文の文字の色 */
	/*padding: 90px 8px 0px 30px;*/	/* サイト説明文の余白 上・右・下・左の順 */
	line-height:1.3;	/* 本文記事の行間 */
}
.ad {
　 margin-top:50px;
	margin-left:30px;    /* 左の余白 */
}
/* パンくずリスト */
#topicPath {
	margin-top: 10px;	/* パンくずリストの上部の余白 */
	margin-left: 15px;
	margin-bottom: 10px;
}
#topicPath li {
	display: inline;
	line-height: 110%;
	list-style-type: none;
}
/* 本文の見出し */
#left h2,#left h3 {
	font-size:100%;
	position: relative;
	color: #555;
	padding: 25px 15px 10px 60px;
	margin: 0 0 20px 0;
	text-shadow:0 2px 2px #fff;
	background: url(tape.png);
	background-size:100% 100%;
}
#left h2:before,#left h3:before {
	content:url(icon_02.gif);
	position:absolute;
	top:-3px;
	left:0;
}
/* 本文の見出し */
#left h3.crown {
	font-size:100%;
	position: relative;
	color: #555;
	padding: 15px 15px 15px 70px;
	margin: 20px 0;
	text-shadow:0 2px 2px #fff;
	background: url(lace.png);
	background-size:100% 100%;
}
#left h3.crown:before {
	content:url(icon_01.png);
	position:absolute;
	top:-12px;
	left:0;
}
h4 {
	color:#FA514C;
	font-size:18px;
	line-height:160%;
	font-weight:normal;
	margin: 0 0 20px 0;
	padding-left:5px;
}
/* 緑の太枠 */
.naka {
	width: 600px;		/* 左サイドの中身の幅 */
}
/* 緑の太枠 */
.naka1 {
	width: 300px;		/* 左サイドの中身の幅 */
	margin-left: 0px;	/* 左の余白 */
	border-width: 4px;	/* 枠線の太さ */
	border-style: solid;	/* 枠線のスタイル */
	border-color: #228B22;	/* 枠線の色 */
	padding: 0px 12px 12px 12px;	/* 本文記事の余白 上・右・下・左の順 */
}
.column_title {
	background: url(img/colamu.png) no-repeat left;
	padding: 23px 0 23px 70px;
}
/* 本文の記事 */
.kiji {
	color: #000000;			/* 本文記事の文字の色 */
	padding:12px;	/* 本文記事の余白 上・右・下・左の順 */
}
.rank1:before {
	content:url(img/no1.jpg);
}
.rank2:before {
	content:url(img/no2.jpg);
}
.rank3:before {
	content:url(img/no3.jpg);
}
.rank4:before {
	content:url(img/no4.jpg);
}
.rank5:before {
	content:url(img/no5.jpg);
}
ul.point li {
	list-style-image:url(img/chek.png);
	list-style-position: inside;
}
/*コメント*/


.comment_title { /*コメントタイトル*/
	padding:10px;
	border-bottom:solid 1px #ff7ca1;
}
.comment_l, .comment_r { /*吹き出し下余白*/
	margin-bottom:20px;
}
.comment_l img { /*キャラ画像余白*/
	float: left;
	margin-left:10px;
}
.comment_r img {
	float: right;
	margin-right:10px;
}
.comment .bal { /*吹き出し枠*/
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 3px solid #ff7ca1;
	position: relative;
	display: inline-block;
	width: auto;
	color: #555;
	background: #fff;
	z-index: 0;
}
.comment_l .bal:before { /*吹き出し左設定*/
	content: "";
	position: absolute;
	top: -8px;
	left: 10%;
	margin-left: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 9px 9px 9px;
	border-color: transparent transparent #fff transparent;
	z-index: 0;
}
.comment_l .bal:after {
	content: "";
	position: absolute;
	top: -12px;
	left: 10%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #ff7ca1 transparent;
	z-index: -1;
}
.comment_r .bal:before { /*吹き出し右設定*/
	content: "";
	position: absolute;
	top: -8px;
	right: 10%;
	margin-left: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 9px 9px 9px;
	border-color: transparent transparent #fff transparent;
	z-index: 0;
}
.comment_r .bal:after {
	content: "";
	position: absolute;
	top: -12px;
	right: 10%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #ff7ca1 transparent;
	z-index: -1;
}
.bal p {
	padding:10px;
}

.box_left {
	width: 45%;
	border: 1px solid #ccc;
	border-radius:5px;
	float: left;
	margin-right:10px;
	padding: 10px;
}
.m_rank1:before {
	content:url(img/1.jpg);
}
.m_rank2:before {
	content:url(img/2.jpg);
}
.m_rank3:before {
	content:url(img/3.jpg);
}
.go_ranking:before {
	content:url(ya.gif);
}
/* 右サイド（サイドバー） */
#right {
	width: 255px;	/* 右サイドの幅 */
	float:left;
	margin:0;
}
/* 右サイドバーの中身 */
.sidebar {
	font-size: 80%;
	color: #000000;			/* サイドバーの文字の色 */
	background-color: #ffffff;	/* サイドバーの背景色 */
}
/* 右サイドバーの見出し */
.ribbon {
	width: 255px;
	position: absolute;
	text-align: center;
	background: #228B22;
	background: -webkit-gradient(linear, left top, left bottom, from(#228B22), to(#228B22));
	background: -webkit-linear-gradient(top, #228B22, #228B22);
	background: -moz-linear-gradient(top, #228B22, #228B22);
	background: -ms-linear-gradient(top, #228B22, #228B22);
	background: -o-linear-gradient(top, #228B22, #228B22);
	background-image: -ms-linear-gradient(top, #228B22 0%, #228B22 100%);
	-webkit-box-shadow: rgba(000, 000, 000, 0.3) 0 1px 1px;
	-moz-box-shadow: rgba(000, 000, 000, 0.3) 0 1px 1px;
	box-shadow: rgba(000, 000, 000, 0.3) 0 1px 1px;
	font-family: 'Helvetica Neue', Helvetica, sans-serif;
}
.ribbon h2 {
	font-size: 90%;
	color: #ffffff;
	text-shadow: #850404 0 1px 0;
	margin:0px;
	padding: 5px 10px;
}
.ribbon-stitches-top {
	margin-top:2px;
	border-top: 1px dashed rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 0px 2px rgba(255, 255, 255, 0.5);
}
.ribbon-stitches-bottom {
	margin-bottom:2px;
	border-top: 1px dashed rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 2px rgba(255, 255, 255, 0.3);
}
.sidebar ul {
	padding-top:40px;
}
.sidebar li {
	border-bottom:1px dotted #fadde3;
	padding:10px 0;
	list-style:url(y1.gif) inside;
}
.sidebar li:hover {
	background:#eef3f6;
}
/*<div id="pan">*/

#pan {
	text-align :left;
	margin-top :10px;
	font-size :16px;
	color: #000000;
	background-color :#E0FFFF;
	padding-left:5px;    /* 左の余白 */
	padding-top:5px;     /* 上の余白 */
	padding-bottom:5px;  /* 下の余白 */
	dotted-top :solid 1px #333333;
}
.mov a:hover {
	position: relative;
	top:2px;
	left:2px;
	text-decoration: none;
}
/* フッター */
#footer {
	font-size: 70%;		/* bodyフォントサイズ(約12.8px)の117% (15px相当) */
	clear: both;			/* 回り込みの解除 */
	width: 100%;			/* フッターの幅 */
	text-align: center;		/* フッターの配置位置 */
	background-color: #DCDCDC;	/* フッターの背景色 */
	margin-top: 20px;		/* フッター全体の上部余白 */
	padding-top: 15px;		/* フッターの上部余白 */
	padding-bottom: 70px;		/* フッターの下部余白 */
}

 @media all and (max-width:375px) {
 #main, #left, #right {
 width:100%;
}
 img.alignright, img.alignleft {
 float:none;
 display:block;
 text-align:center;
}
 .naka {
 width:100%;
 padding:0;
}

.naka p{
	padding:10px;
}
 .column_title {
 margin-left: 10px;
}

 .box_left {
 width:92.5%;
 margin-right:0;
 margin-bottom:10px;
}

 .go_ranking {
 font-size:20px;
}
 .ribbon {
 width:100%;
}
 .kome {
 font-size: 12px;		/* bodyフォントサイズ(約12.8px)の117% (15px相当) */
 padding:20px 0;
 width: 100%;
}
 #footer {
 padding-bottom:100px;
}
}