@charset "utf-8";

/* ------------------------------------------------------------
   
	filename:	report.css
	created:	090208
	update:		090811
	  
------------------------------------------------------------ */

/* ------------------------------------------------------------ 区切り */
div#mainContents div.article {
	padding-top: 0;
	border: 1px solid #DEDEDE;
	margin-bottom: 20px;
}

div#mainContents div.completion { background-color: #ecf1f3; }

div#mainContents div.underExam { background-color: #fff8e0; }

div#mainContents div.disapprove { background-color: #ededed; }

/*---------------------------------------------------------------- articleHeader*/
div#mainContents div.articleHeader {
	background-color: #F4F4F4;
	border-bottom:1px solid #dedede;
	margin-bottom: 10px;
}

div#mainContents div.completion div.articleHeader,
div#mainContents div.underExam div.articleHeader,
div#mainContents div.disapprove div.articleHeader {
	background-color: #FFF;
	padding: 0;
	border: none;
}

div#mainContents div.completion div.articleHeader div.wrap,
div#mainContents div.underExam div.articleHeader div.wrap,
div#mainContents div.disapprove div.articleHeader div.wrap {
	background-image: url(/SYS/cmn/images/DFS02060_bg_article_header.gif);
	background-repeat: no-repeat;
	background-position: bottom;
}

div#mainContents div.article div.articleHeader p.info {
	border: none;
	margin: 4px 10px 0 8px;
}

* html div#mainContents div.article div.articleHeader p.info { margin-left: 4px; }

body:first-of-type div#mainContents div.article div.articleHeader p.info { letter-spacing: -0.1em;}

div#mainContents p.info span.strong { color: #cc0000; }

div#mainContents div.article div.articleHeader p.commentIcon {
	background-color: #f4f4f4;
	margin: 2px 0 0;
}

* html div#mainContents div.article div.articleHeader p.commentIcon { margin-top: 4px; }
*+html div#mainContents div.article div.articleHeader p.commentIcon img { margin-top: 2px; }

div#mainContents div.completion div.articleHeader p.commentIcon,
div#mainContents div.underExam div.articleHeader p.commentIcon,
div#mainContents div.disapprove div.articleHeader p.commentIcon { background-color: #FFF; }

div#mainContents div.supportArea {
	width: 168px;
	text-align: right;
	margin-right: 8px;
	padding-bottom: 4px;
}

/*For IE6 IE7 \*/
* html div#mainContents div.supportArea {
	margin-right: 4px;
	padding-bottom: 5px;
}

/**/

div#mainContents div.article div.articleHeader div.supportArea p.date {
	float: right;
	margin: 5px 0 0 0;
	font-size: 100%;
	color: #666;
}
body:first-of-type div#mainContents div.article div.articleHeader div.supportArea p.date { letter-spacing: -0.1em;}

div#mainContents div.article div.articleHeader div.supportArea ul.btn {
	float: right;
	margin: 3px 0 0 8px;
}

/*--------------------------------------------- タブ*/
div#mainContents div.article div.articleHeader ul.exam {
	margin: 0;
	padding: 0;
}

/* \*/
* html div#mainContents div.article div.articleHeader ul.exam { margin-right: -4px; }

/**/

div#mainContents div.article div.articleHeader ul.exam li {
	width: 54px;
	padding: 5px 0 7px 0;
	border: none;
	border-right: 1px solid #dedede;
	font-size: 100%;
	line-height: 1.0;
	text-align: center;
	background-color: #FFF;
	background-image: url(/SYS/cmn/images/DFS02060_bg_article_header.gif);
	background-repeat: no-repeat;
	background-position: bottom;
}

div#mainContents div.article div.articleHeader ul.exam li.completion,
div#mainContents div.article div.articleHeader ul.exam li.underExam,
div#mainContents div.article div.articleHeader ul.exam li.disapprove {
	background-image: url(/SYS/cmn/images/DFS02060_bg_tab.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
}

div#mainContents div.article div.articleHeader ul.exam li.completion { background-color: #ecf1f3; }

div#mainContents div.article div.articleHeader ul.exam li.underExam { background-color: #fff8e0; }

div#mainContents div.article div.articleHeader ul.exam li.disapprove { background-color: #ededed; }

/*-------------------------------------------------------------- 記事 */
div#mainContents div.article div.columnPmA,
div#mainContents div.article div.columnPmB { float: left; }

div#mainContents div.article div.columnPmA { width: 180px; }

div#mainContents div.article div.columnPmB {
	margin-left: 0;
	width: 708px;
}

div#mainContents div.article div.columnPmB.photoOn { width: 528px; }

div#mainContents div.article h2,
div#mainContents div.article p,
div#mainContents div.article ul { margin: 0 0 10px 10px; }

div#mainContents div.article h1,
div#mainContents div.article h2 {
	padding-left: 20px;
	background-image: url(/SYS/cmn/images/common/bg_h2_report.gif);
	background-repeat: no-repeat;
	background-position: 0 2px;
	font-size: 140%;
	clear: none;
	line-height: 1.5;
}

div#mainContents div.article p.shopInfo {
	font-weight: bold;
	border-bottom: 1px dotted #cfcfcf;
}

div#mainContents div.article ul.shopInfo li {
	display: inline;
	font-size: 100%;
}

div#mainContents div.article div.reportArea {
	background-color: #f3f3f3;
	margin: 0 10px 10px;
	padding: 7px 0;
}

div#mainContents div.article div.columnPmB div.reportArea { margin-right: 0; }

div#mainContents div.article div.reportArea p,
div#mainContents div.article div.reportArea ul li {
	font-size: 100%;
	background-position: -5px 0;
}

div#mainContents div.article div.reportArea ul { margin-bottom: 0; }

div#mainContents div.completion div.reportArea { background-color: #dce7ec; }

div#mainContents div.underExam div.reportArea { background-color: #f3ecd5; }

div#mainContents div.disapprove div.reportArea { background-color: #e0e0e0; }

/* ------------------------------------------------------------ レポート詳細 */
div#mainContents.reportDetail div.appearance {
	width: 718px;
	background-color: #F4F4F4;
	border: 1px solid #DEDEDE;
	border-bottom: none;
}

div#mainContents.reportDetail div.completion { background-color: #FFF; }

div#mainContents.reportDetail div.appearance p {
	float: left;
	margin-top: 5px;
	margin-bottom: 5px;
}

* html div#mainContents.reportDetail div.appearance p { margin-left: 5px; }

div#mainContents.reportDetail div.appearance p.info { margin-top: 5px; }

div#mainContents.reportDetail div.appearance p.date {
	float: right;
	margin: 5px 10px 4px 0;
	font-size: 100%;
	color: #666666;
}

* html div#mainContents.reportDetail div.appearance p.date { margin-right: 5px; }

div#mainContents.reportDetail div.appearance ul {
	float: right;
	clear: none;
	margin-top: 5px;
}

div#mainContents.reportDetail div.appearance ul.btn { margin: 5px 3px 4px 0; }

div#mainContents.reportDetail div.appearance div.supportArea {
	float: right;
	width: 168px;
	margin-right: 0;
}

div#mainContents.reportDetail div.appearance div.supportArea p.date {
	margin-top: 8px;
	margin-bottom: 4px;
}

div#mainContents.reportDetail div.article table { width: 680px; }

* html div#mainContents.reportDetail div.article table.report { width: 678px; }

div#mainContents.reportDetail div.article p,
div#mainContents.reportDetail div.article ul,
div#mainContents.reportDetail div.article table {
	margin-left: 20px;
	margin-right: 20px;
}

div#mainContents.reportDetail div.article table ul {
	margin-left: 0;
	margin-right: 0;
}

/* ヘッダ */
div#mainContents.reportDetail div.article h1,
div#mainContents.reportDetail div.article h2 {
	padding: 8px 9px 7px 30px;
	margin: 0 0 15px 0;
	background-position: 5px 9px;
	border-bottom: 1px solid #E3E4E6;
}

div#mainContents.reportDetail div.completion h2 { background-color: #ecf1f3; }

div#mainContents.reportDetail div.underExam h2 { background-color: #fff8e0; }

div#mainContents.reportDetail div.disapprove h2 { background-color: #ededed; }

div#mainContents.reportDetail div.completion div.articleHeader,
div#mainContents.reportDetail div.underExam div.articleHeader,
div#mainContents.reportDetail div.disapprove div.articleHeader { margin-bottom: 0; }

div#mainContents.reportDetail div.article div.articleHeader h1,
div#mainContents.reportDetail div.article div.articleHeader h2 {
	margin: 0;
	border: 1px solid #FFF;
}

div#mainContents.reportDetail div.article div.articleHeader h1 span.date {
	padding-left: 10px;
	font-size: 85%;
}

div#mainContents.reportDetail div.article div.articleHeader p.date {
	margin: 2px 0 0 0;
	float: right;
}

div#mainContents.reportDetail div.completion,
div#mainContents.reportDetail div.underExam,
div#mainContents.reportDetail div.disapprove { background-color: #FFF; }

/* 本文 */
div#mainContents.reportDetail div.article div.columnPmA { width: 192px; }
div#mainContents.reportDetail div.article div.columnPmB { width: 700px; }
div#mainContents.reportDetail div.article div.columnPmB.photoOn { width: 508px; }

div#mainContents.reportDetail div.article div.columnPmA p { margin-right: 0; }

/* コメント 66.cssに同様の記述あり */
div#mainContents.reportDetail div.comment h3 {
	background-image: url(/SYS/cmn/images/common/bg_h3_balloon.gif);
	background-position: -1px -1px;
	margin-top: 0;
	margin-left: 10px;
	padding-left: 17px;
}

/* アクションエリア */
/* このおすすめレポートを読んでお店に行きたくなりましたか？ */
div#mainContents div.action p,
div#mainContents div.action ul { margin: 0 10px 0 10px; }

div#mainContents div.action div div { margin: 0;}

div#mainContents div.action p { font-size: 100%; }

div#mainContents div.action span.headCount { color: #C00; }

div#mainContents div.action div.contextBtn { margin-bottom: 10px; }

div#mainContents div.action div.contextBtn p {
	font-size: 120%;
	font-weight: bold;
}

div#mainContents div.action div.contextBtn p.message {
	clear: both;
	float: none;
	font-weight: normal;
}

* html div#mainContents div.action div.contextBtn p { margin-left: 5px; }
* html div#mainContents div.action div.contextBtn p.message { margin-left: 10px; }

div#mainContents div.action p.thanks {
	font-size: 120%;
	font-weight: bold;
	color: #CC0000;
}

div#mainContents div.action div.addBtn ul.btn { padding: 0; }

div#mainContents div.addBtn ul.btn { padding: 10px; }

/* ------------------------------------------------------------ クリアフィックス */
div#mainContents.reportDetail div.appearance:after,
div#mainContents div.article div.articleHeader div.wrap:after {
	display: block;
	clear: both;
	height: 0;
	content: "";
}

div#mainContents.reportDetail div.appearance,
div#mainContents div.article div.articleHeader div.wrap { display: inline-table; }

/* Hides from IE-mac */
* html div#mainContents.reportDetail div.appearance,
* html div#mainContents div.article div.articleHeader div.wrap { height: 1%; }

div#mainContents.reportDetail div.appearance,
div#mainContents div.article div.articleHeader div.wrap {
	display: block;
	zoom: 1;
}
/* EOF */
