@charset "Shift_JIS";

/*_______________________________________________________

	Before-After Blog Setting CSS
	written by Toyohiro Sugita
	ST CREATIVE INC.
	info@stcd.jp
	Last updated on 2007.05.19
	 
________________________________________________________*/

ul, dl, dt, dd {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/*-----------------------------------------------
ビフォーアフターブログ設定
-----------------------------------------------*/

#beforeafter h4 {
	clear: both;
	text-align: left;
	width: 770px;
	height: 54px;
	margin-top: 15px;
	margin-right: auto;
	margin-left: auto;
	padding: 0px;
	background: url(../../before_after/image/title.gif) no-repeat 0 0px;
	text-indent: -9999px;
}

#beforeafter #select_ctgr {
	text-align: left;
	width: 760px;
	margin-top: 15px;
	margin-right: auto;
	margin-left: auto;
	padding: 5px;
	background-color: #F0F0F0;
	border-top: solid 1px #CCCCCC;
	border-right: solid 1px #CCCCCC;
	border-bottom: solid 1px #CCCCCC;
	border-left: solid 1px #CCCCCC;
}

#beforeafter .select_ctgr_title {
	text-align: left;
	width: 180px;
	margin-top: 3px;
	padding-bottom: 3px;
	border-bottom: dotted 1px #666666;
}

#beforeafter .pulldown {
	width: 180px;
	margin-top: 3px;
	padding-bottom: 3px;
}

#beforeafter #contents-nav {
	clear: both;
	text-align: center;
	margin: 10px 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}

/*-----------------------------------------------
サブエリア
-----------------------------------------------*/

body#beforeafter #main-left {
	float: left;
	width: 575px;
	margin-left: 80px;
	_margin-left: 40px;
	margin-bottom: 15px;
	padding: 0px;
	vertical-align: top;
}

body#beforeafter #main-right {
	float: right;
	width: 180px;
	margin-right: 80px;
	_margin-right: 40px;
	margin-bottom: 15px;
	padding: 0px;
	text-align: left;
	vertical-align: top;
}

/*-----------------------------------------------
ページトップ
-----------------------------------------------*/

#page-top {
	clear: both;
	width: 538px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	font-weight: normal;
	font-size: 12px;
	line-height: 120%;
}

.page-top-link a {
	float: right;
	margin: 10px 0px;
	padding-left: 12px;
	background: url(../../shared/image/page_top.gif) no-repeat 0 3px;
}


/*-----------------------------------------------
メインパーツ
-----------------------------------------------*/

#beforeafter .new_title {
	clear: both;
	text-align: left;
	width: 575px;
	height: 25px;
	margin-top: 15px;
	padding: 0px;
	background: url(../../before_after/image/new.gif) no-repeat 0 0px;
	text-indent: -9999px;
}

#beforeafter .detail_title {
	clear: both;
	text-align: left;
	width: 575px;
	height: 25px;
	margin-top: 15px;
	padding: 0px;
	background: url(../../before_after/image/title_detail.gif) no-repeat 0 0px;
	text-indent: -9999px;
}

#beforeafter .pagenavi {
	clear: both;
	width: 570px;
	margin-top: 15px;
	padding: 10px 0px;
	text-align: center;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}

/*-----------------------------------------------
メインパーツ
-----------------------------------------------*/

#beforeafter .old_results {
	clear: both;
	width: 560px;
	margin: 10px 0px;
	text-align: center;
	padding: 5px;
	border: dotted 1px #cccccc;
	background-color: #F0F0F0;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}

#beforeafter .old_results a {
	float: center;
	margin: 10px 0px;
	padding-left: 12px;
	background: url(../../shared/image/arrow.gif) no-repeat 0 3px;
}

#beforeafter #entry-subject {
	clear: both;
	width: 570px;
	margin-top: 15px;
	border-left: 5px solid #DE9A2A;
	text-align: left;
	padding-bottom: 3px;
	border-bottom: dotted 1px #CCCCCC;
}

#beforeafter .entry-date {
	margin-left: 5px;
	padding: 2px 0px 2px 17px;
	background: url(../../before_after/image/icon_date.gif) no-repeat 0 2px;
	font-weight: normal;
	font-size: 10px;
	line-height: 150%;
}

#beforeafter .entry-title {
	clear: both;
	width: 570px;
	margin-left: 5px;
	padding: 0px;
	font-weight: normal;
	font-size: 18px;
	line-height: 150%;
}

#beforeafter .entry-left {
	clear: both;
	float: left;
	width: 200px;
	margin-top: 10px;
	margin-bottom: 5px;
}

.entry-left .pic-before-title {
	width: 198px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 3px 0px;
	text-align: center;
	font-weight: normal;
	font-size: 14px;
	line-height: 150%;
	background-color: #F0F0F0;
	border: solid 1px #C0C0C0;
}

.entry-left .pic-before {
	margin-top: 5px;
	padding: 4px;
	border-top: solid 1px #C0C0C0;
	border-right: solid 1px #C0C0C0;
	border-bottom: solid 1px #C0C0C0;
	border-left: solid 1px #C0C0C0;
	background-color: #FFFFFF;
}

#beforeafter .entry-right {
	float: right;
	width: 365px;
	margin-top: 10px;
	margin-bottom: 5px;
	text-align: left;
	background: url(../../before_after/image/bg_after.gif) no-repeat 0 0;
}

.entry-right .pic-after-title {
	width: 328px;
	margin: 0px 0px 0px 35px;
	padding: 2px 0px 2px 0px;
	text-align: center;
	font-weight: normal;
	font-size: 16px;
	line-height: 140%;
	color: #FF3300;
	background-color: #F4F3E3;
	border: solid 1px #C0C0C0;
}

.entry-right .pic-after-space {
	margin: 5px 0px 0px 35px;
	text-align: center;
}

.entry-right .pic-after {
	padding: 4px;
	border-top: solid 1px #C0C0C0;
	border-right: solid 1px #C0C0C0;
	border-bottom: solid 1px #C0C0C0;
	border-left: solid 1px #C0C0C0;
	background-color: #FFFFFF;
}

#entry-footer {
	clear: both;
	width: 575px;
	margin-top: 5px;
	margin-bottom: 25px;
	padding-top: 5px;
	padding-bottom: 20px;
	border-bottom: dotted 1px #C0C0C0;
}


.attention {
	clear: both;
	padding-top: 5px;
	font-weight: normal;
	font-size: 10px;
	line-height: 140%;
	text-align: center;
}

.reform-detail a {
	background: url(../../before_after/image/detail.gif) no-repeat 0 0px;
	display: block;
	width: 575px;
	height: 40px;
	padding: 0px;
	text-indent: -9999px;
	text-decoration: none;
}

.reform-detail a:hover {
	background-position: 0px -40px;
}

.comment-number {
	margin-top: 5px;
	background-image: url(../../before_after/image/icon_comment.gif) no-repeat 0 0;
	padding: 0px 0px 0px 15px;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
	text-align: left;
}

#beforeafter .paginate {
	clear: both;
	width: 570px;
	margin-top: 15px;
	padding: 10px 0px;
	text-align: center;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}
/*-----------------------------------------------
サイド ランキング
-----------------------------------------------*/

#main-right p.flow {
	clear: both;
	width: 180px;
	margin-top: 15px;
	margin-bottom: 5px;
	padding: 0;
	text-align: left;
}

/*-----------------------------------------------
サイド ランキング
-----------------------------------------------*/

#sub-newentry {
	clear: both;
	width: 180px;
	margin-top: 15px;
	margin-bottom: 5px;
	padding: 0;
	text-align: left;
}

#sub-newentry .body01 {
	background-image: url(../../before_after/image/new_title.gif);
	background-position: left top;
	background-repeat: no-repeat;
	width: 180px;
	height: 38px;
	padding: 0px;
	text-indent: -9999px;
	overflow: hidden;
}

#sub-newentry .body02 {
	background-image: url(../../before_after/image/side_bg.gif);
	background-position: left top;
	padding-top: 3px;
	padding-right: 5px;
	padding-left: 10px;
	color: #333;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}

#sub-newentry li {
	margin: 0px;
	padding: 3px 0 3px 13px;
	background: url(../../shared/image/arrow.gif) no-repeat 0 6px;
}

#sub-newentry .body03 {
	background-image: url(../../before_after/image/new_bottom.gif);
	background-position: left top;
	background-repeat: no-repeat;
	width: 180px;
	height: 5px;
	margin: 0px;
	padding: 0px;
}

/*-----------------------------------------------
サイド コメント
-----------------------------------------------*/

#sub-comment {
	clear: both;
	width: 180px;
	margin-top: 15px;
	margin-bottom: 5px;
	padding: 0;
	text-align: left;
}

#sub-comment .body01 {
	background-image: url(../../before_after/image/comment_title.gif);
	background-position: left top;
	background-repeat: no-repeat;
	width: 180px;
	height: 38px;
	padding: 0px;
	text-indent: -9999px;
	overflow: hidden;
}

#sub-comment .body02 {
	background-image: url(../../before_after/image/side_bg.gif);
	background-position: left top;
	padding-top: 3px;
	padding-right: 5px;
	padding-left: 10px;
	color: #333;
	font-weight: normal;
	font-size: 12px;
	line-height: 150%;
}

#sub-comment li {
	margin: 0px;
	padding: 3px 0 3px 13px;
	background: url(../../shared/image/arrow.gif) no-repeat 0 6px;
}

#sub-comment .body03 {
	background-image: url(../../before_after/image/ranking_bottom.gif);
	background-position: left top;
	background-repeat: no-repeat;
	width: 180px;
	height: 5px;
	margin: 0px;
	padding: 0px;
}

/*-----------------------------------------------
共通お問い合わせ
-----------------------------------------------*/

#beforeafter #main-left #information {
	clear: both;
	margin: 10px 0;
	padding-top: 10px;
}

#beforeafter #main-left #information ul {
	position: relative;
	height: 67px;
}

#beforeafter #main-left #information ul li {
	float: left;
}

#beforeafter #main-left #information ul li#free_mail,
#beforeafter #main-left #information ul li#free_report {
	position: absolute;
	width: 280px;
	height: 67px;
	text-indent: -9999px;
}

#beforeafter #main-left #information ul li#free_mail a,
#beforeafter #main-left #information ul li#free_report a {
	display: block;
	height: 67px;
}

#beforeafter #main-left #information ul li#free_mail {
	left: 0px;
}

#beforeafter #main-left #information ul li#free_report {
	right: 0px;
}

#beforeafter #main-left #information ul li#free_mail,
#beforeafter #main-left #information ul li#free_mail a {
	background: url(../../shared/image/contact02.jpg) no-repeat 0 0;
}

#beforeafter #main-left #information ul li#free_report,
#beforeafter #main-left #information ul li#free_report a {
	background: url(../../shared/image/report02.jpg) no-repeat 0 0;
}

#beforeafter #main-left #information ul li#free_mail a:hover,
#beforeafter #main-left #information ul li#free_report a:hover {
	background-position: 0px -67px;
}

/*-----------------------------------------------
ページトップ
-----------------------------------------------*/

#beforeafter #page-top {
	clear: both;
	width: 575px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
	font-weight: normal;
	font-size: 12px;
	line-height: 120%;
}

#beforeafter .page-top-link a {
	float: right;
	margin: 10px 0px;
	padding-left: 12px;
	background: url(../../shared/image/page_top.gif) no-repeat 0 3px;
}

/*-----------------------------------------------
リフォーム詳細データ
-----------------------------------------------*/

#reform-data {
	clear: both;
	width: 575px;
	margin-top: 20px;
	text-align: left;
}

.reform_data_table {
	clear: both;
	margin-top: 5px;
	background-color: #CCCCCC;
}

.reform_data_table td {
	padding: 5px 6px 5px 6px;
	text-align: left;
	font-weight: normal;
	font-size: 12px;
	line-height: 160%;
	vertical-align: top;
}

#page-back {
	width: 575px;
	margin-top: 20px;
	text-align: center;
}

#page-back .back-btn a {
	background: url(../../before_after/image/back_btn.gif) no-repeat 0 0px;
	display: block;
	width: 200px;
	height: 40px;
	padding: 0px;
	text-indent: -9999px;
	text-decoration: none;
}

#page-back .back-btn a:hover {
	background-position: 0px -40px;
}

/*-----------------------------------------------
カテゴリーアーカイブ部分
-----------------------------------------------*/

#archive-title {
	clear: both;
	text-align: center;
	margin: 10px 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 14px;
	line-height: 140%;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
}

#more {
	clear: both;
	text-align: center;
	margin: 0px;
	padding-top: 0px;
}

/*-----------------------------------------------
#entry-footer02 {
	clear: both;
	width: 575px;
	margin-top: 5px;
	margin-bottom: 25px;
	padding-top: 5px;
	border-top: dotted 1px #C0C0C0;
	text-align: left;
}
-----------------------------------------------*/

#entry-footer02 {
	display: block;
	position: absolute;
	top: -500px;
	left: -500px;
	font-size: 1px;
	line-height: 100%;
}

/*-----------------------------------------------
コメント部分
-----------------------------------------------*/

#comment-area {
	clear: both;
	width: 575px;
	margin-top: 20px;
	padding-top: 25px;
	background: url(../../before_after/image/bg_comment.gif) no-repeat 0 0px;
}

#comment-area .comment-btn {
	margin-left: 278px;
	_margin-left: 258px;
}

#comment-area .comment-btn a {
	background: url(../../before_after/image/submit_comment.gif) no-repeat 0 0px;
	display: block;
	width: 268px;
	height: 35px;
	padding: 0px;
	text-indent: -9999px;
	text-decoration: none;
}

#comment-area .comment-btn a:hover {
	background-position: 0px -35px;
}

#comment-area .column {
	width: 518px;
	margin: 15px auto 0px;
	padding-bottom: 10px;
	border-bottom: dotted 1px #666666;
	font-size: 12px;
	text-align: left;
}

#comment-area .column p {
	padding: 8px 0px 8px 0px;
	margin: 0px;
	font-size: 12px;
	line-height: 180%;
}

#comment-area .column .comment-title-bg {
	width: 518px;
	padding: 5px 0px;
	font-size: 12px;
	text-align: left;
	background-color: #f4f3dc;
}

#comment-area .column span.comment-title {
	padding-right: 0px;
	padding-left: 25px;
	background: url(../../before_after/image/icon_comment02.gif) no-repeat 7px 0px;
	float: left;
}

#comment-area .column span.author {
	padding-right: 10px;
	padding-left: 25px;
	float: right;
}

#comment-area .column span.date {
	display: block;
	color: #DE9A2A;
	text-align: right;
}

/*-----------------------------------------------
トラックバック部分
-----------------------------------------------*/

#trackback {
	margin-top: 20px;
	width: 575px;
	text-align: left;
	font-weight: normal;
	font-size: 11px;
	line-height: 140%;
}

#trackback textarea {
	margin: 10px 0px 10px 0px;
	width: 550px;
	background-color: #f4f3dc;
	font-weight: normal;
	font-size: 12px;
	line-height: 140%;
}

/*-----------------------------------------------
コメント小ウィンドウ部分
-----------------------------------------------*/

body#comment {
	text-align: center;
}

#container02 {
	width: 400px;
	padding: 0px 15px;
	text-align: left;
	background: #FFF;
}

body#comment h1 {
	clear: both;
	width: 400px;
	font-weight: normal;
	font-size: 15px;
	line-height: 130%;
	text-align: left;
	padding: 2px 0px 2px 6px;
	border-left: solid 4px #FF3300;
	background-color: #F4F3E3;
	color: #FF3300;
}