@charset "UTF-8";

/*==================================================

	THE COLOR
	/color/

===================================================*/

/*--------------------------------------------------

	MaimImg
	メインイメージ
	
--------------------------------------------------*/
#MainVisual h1 {
	width: 850px;
	height: 100px;
	margin: 0px auto;
}

/*--------------------------------------------------

	Contents
	メインコンテンツ

--------------------------------------------------*/
#GlobalNavi li#BtnColor a { width:113px; background-position: -511px -40px;}

body.Color #Contents {
	position: relative;
	width: 820px;
	margin: 0px auto;
	padding: 30px 15px 0px;
}

body.Color .ToPageTop a {
	margin: 0px;
	padding: 0px 0px 10px 12px;
}

/*	THE COLOR Index
 =================================================*/
body#ColorTop #Contents {
	padding: 15px 15px 0px;
}

body.Color #TheColorIntro {
	margin: 0px 0px 30px;
}

body.Color #TheColorIntro h3 {
	margin: 0px 0px 20px 5px;
}

body.Color #TheColorIntro p {
	font-size: 1.2em;
	margin-bottom: 20px;
}

body.Color #TheColorIntro span {
	width: 820px;
	display: block;
}

body.Color a.Mark {
	background: url(img/mark_circle.gif) no-repeat 0px 2px;
	padding-left: 12px;
}

body.Color #TheColorList {
	margin-bottom: 0px;
}

body.Color #TheColorList h3 {
	margin-bottom: 20px;
}

body.Color #TheColorList span {
	display: block;
	float: left;
	width: 800px;
	text-align: center;
}

body.Color #TheColorList #ColorLeft {
	float: left;
	width: 660px;
	padding: 0px 10px;
}

body.Color #TheColorList #ColorRight {
	float: right;
	width: 130px;
	padding-right: 10px;
}

body.Color #TheColorList #ColorLeft dl {
	margin-bottom: 15px;
}

body.Color #TheColorList #ColorLeft dt {
	background: url(img/img_bg-color-img.gif) repeat-y right;
	display: block;
	float: left;
	width: 154px;
}

body.Color #TheColorList #ColorLeft dt a {
	display: block;
}

body.Color #TheColorList #ColorLeft dt img {
	display: block;
	width: 150px;
	height: 115px;
}


body.Color #TheColorList #ColorLeft dd {
	float: right;
	width: 496px;
	padding-left: 10px;
}

body.Color #TheColorList #ColorLeft h4 {
	margin-bottom: 5px;
}

body.Color #TheColorList #ColorLeft p {
	margin: 0px 0px 15px 12px;
}

body.Color #TheColorList #ColorLeft em {
	display: block;
	margin-left: 12px;
}

body.Color .ToBackNumber a {
	display: block;
	width: 130px;
	height: 247px;
	background: url(img/btn_back-number.jpg) no-repeat;
}

body.Color .ToBackNumber a:hover {background-position: 0px -247px;}

/*	THE COLOR Detail
 =================================================*/
body.Color #TheColorDetailIntro h3 {
	position: relative;
}

body.Color ul.ToBackList {
	position: absolute;
	top: 0px;
	right: 6px;
	width: 125px;
	height: 15px;
}

body.Color .ToBackList a {
	display: block;
	width: 125px;
	height: 15px;
	background: url(img/btn_back-list.gif) no-repeat;
}

body.Color .ToBackList a:hover {background-position: 0px -15px;}

body.Color #TheColorDetailIntro h4 {
	background: #F1F1F1;
	font-size: 1.1em;
	font-weight: bold;
	padding: 5px 0px 5px 10px;
	margin-bottom: 15px;
}

body.Color #TheColorDetailIntro h4 em {
	color: #5F8005;
	padding-left: 15px;
	font-size: 0.875em;
}

body.Color #TheColorDetailIntro strong {
	display: block;
	color: #CC6600;
	font-size: 1.1em;
	margin-bottom: 15px;
}
	
body.Color #TheColorDetailIntro #MT {
	margin-bottom: 20px;
}

body.Color #TheColorDetailIntro ul#BackList {
	float: right;
	clear: both;
}

body.Color #TheColorDetailIntro ul#BackList li {
	float: left;
	padding-left: 20px;
}

body.Color #TheColorDetailIntro ul#BackList li #Triangle {
	padding: 0px 0px 0px 12px;
	background: url(../common/img/mark_totop.gif) no-repeat left 4px;
}

/*	THE COLOR Detail Comment
 =================================================*/
body.Color .TheColorComment {
	margin-bottom: 15px;
} 

body.Color .TheColorComment .error {
	border: 2px solid #EBEBEB;
	margin: 0px 0px 25px 0px;
	padding: 1px;
}

body.Color .TheColorComment .error p {
	background: #EBEBEB;
	margin: 0px;
	padding: 12px 10px;
	font-weight: bold;
}

body.Color .TheColorComment .error span {
	color: #FF0000;
}

body.Color .TheColorComment #CommentZero {
	padding: 30px 0px;
	font-weight: bold;
	text-align: center;
	border: 1px solid #EBEBEB;
}

body.Color .TheColorComment #comments-open-captcha {
	position: relative;
	background: url(img/bg_review-line.gif) repeat-x 0px 0px;
	padding-top: 20px;
	height: 70px;
}

body.Color .TheColorComment #comments-open-captcha .field #captcha_code {
	position: absolute;
	top: 38px;
	left: 170px;
	magin: 0px;
	padding: 0px;
}

body.Color .TheColorComment #comments-open-captcha .field p {
	position: absolute;
	top: 60px;
	left: 170px;
}

body.Color .TheColorComment h3 {
	margin-bottom: 15px;
}

body.Color .TheColorComment dl {
	background: url(img/bg_person.gif) no-repeat;
	margin-bottom: 20px;
}

body.Color .TheColorComment dl.HostComment {
	background: url(img/bg_person-csdc.gif) no-repeat;
	margin-bottom: 20px;
}


body.Color .TheColorComment dl#ListEnd {
	margin-bottom: 0px;
}

body.Color .TheColorComment dt {
	margin-bottom: 5px;
	padding-left: 19px;
}

body.Color .TheColorComment p {
	font-size: 1em;
}

body.Color .TheColorComment dt span {
	padding: 0px 10px 0px 30px;
}

body.Color .TheColorComment dt a {
	font-size: 0.95em;
}

body.Color .TheColorComment dd {
	width: 798px;
	padding: 10px 10px 0px 10px;
	border: 1px solid #E6E6E6;
}

body.Color .TheColorComment li {
	width: 820px;
	padding: 10px 0px 0px;
	text-align: right;
}
	
body.Color .TheColorComment strong {
	background: url(img/mark_green-circle.gif) no-repeat 0px 4px;
	display: block;
	margin:20px 0px 10px;
	padding-left: 12px;
}

body.Color .TheColorComment p {
	margin-bottom: 12px;
}

body.Color .TheColorComment table {
	width: 820px;
	margin-bottom: 20px;
}

body.Color .TheColorComment table th {
	background: #EBEBEB;
	width: 100px;
	padding: 10px;
	text-align: left;
	line-height: 110%;
	vertical-align: top;
	border-bottom: 1px solid #FFFFFF;
}

body.Color .TheColorComment table th em {
	background: none;
	display: block;
	color: #FF0000;
	margin: 0px;
	padding: 0px;
}

body.Color .TheColorComment table td {
	width: 690px;
	padding: 5px 0px 5px 10px;
}

body.Color .TheColorComment table td p {
	font-size: 0.85em;
	margin-bottom: 0px;
}

body.Color .TheColorComment table td #comment-bake-cookie {
	margin: 0px 0px 0px 30px;
}

*+html body.Color .TheColorComment table td #comment-bake-cookie {
	margin: 0px 0px 0px 56px;
}

* html body.Color .TheColorComment table td #comment-bake-cookie {
	margin: 0px 0px 0px 56px;
}

body.Color .TheColorComment dl#Alert {
	background: url(img/bg_review-line.gif) repeat-x 0px 0px;
	width: 820px;
	padding-top: 15px;
	margin-bottom: 15px;
}

body.Color .TheColorComment dl#Alert dt {
	background: none;
	display: block;
	float: left;
	width: 560px;
	margin: 0px;
	padding: 0px;
}

body.Color .TheColorComment dl#Alert dd {
	float: right;
	width: 235px;
	padding: 15px 0px 0px 0px;
	border: none;
}

body.Color .TheColorComment em {
	display: block;
	padding-top: 20px;
}

body.Color .TheColorComment dl#Captcha {
	margin-bottom: 10px;
}

body.Color .TheColorComment dl#Captcha dt {
	background: none;
	float: left;
	width: 150px;
	margin: 0px;
	padding: 0px 20px 0px 0px;
}

body.Color .TheColorComment dl#Captcha dd {
	width: 450px;
	padding: 8px 0px;
	border: none;
}

/*	THE COLOR Comment Message(Error+complete)
 =================================================*/
 body.Color .ColorMessage {
 	margin-bottom: 30px;
}
 
body.Color .ColorMessage h2 {
	margin-bottom: 20px;
}

body.Color .ColorMessage .BorderGray {
	width: 814px;
	padding: 1px;
	border: 2px solid #EBEBEB;
}

body.Color .ColorMessage .BorderGray p {
	width: 810px;
	padding: 1px 1px 30px 1px;
	text-align: center;
	border: 1px solid #EBEBEB;
}

body.Color .ColorMessage .BorderGray strong {
	background: #EBEBEB;
	display: block;
	width: 810px;
	padding: 5px 0px;
	text-align: center;
}

body.Color .ColorMessage .BorderGray span {
	display: block;
	margin: 25px 0px;
	text-align: center;
}

body.Color .ColorMessage .BorderGray em {
	display: block;
	color: #CC0000;
	padding: 5px 0px;
	font-weight: bold;
	text-align: center;
}

body.Color .ColorMessage .BorderGray a {
	margin: 100px 30px 0px 0px;
}

/*	THE COLOR Track Back
 =================================================*/
body.Color #TheColorTrackBack h3 {
	margin-bottom: 15px;
}

body.Color #TheColorTrackBack #TrackBackUrl {
	float: right;
	width:266px;
	border: 1px solid #EBEBEB;
	padding: 1px;
} 

body.Color #TheColorTrackBack #TrackBackUrl p {
	background: #EBEBEB;
	border-top: 5px solid #B5B5B5;
	width: 246px;
	padding: 20px 10px;
}

body.Color #TheColorTrackBack #TrackBackUrl p strong {
	background: url(img/mark_circle-bg-gray.gif) no-repeat 0px 3px;
	display: block;
	padding-left: 12px;
}

body.Color #TheColorTrackBack dl {
	background: url(img/img_bg-dotted.gif) repeat-x bottom;
	float: left;
	width: 530px;
	margin-bottom: 13px;
	padding-bottom: 13px;
}

body.Color #TheColorTrackBack dt {
	margin-left: 15px;
}

body.Color #TheColorTrackBack dt em {
	font-size: 0.9em;
	padding-left: 15px;
}

body.Color #TheColorTrackBack dd a {
	padding-left: 15px;
}

body.Color #TheColorTrackBack #TrackbackZero {
	font-size: 1em;
	font-weight: bold;
	padding-top: 20px;
}

/* フロート解除 */
body.Color #TheColorList #ColorLeft dl:after,
body.Color #TheColorList #ColorRight:after,
body.Color .TheColorComment:after,
body.Color .TheColorComment dl#Alert:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}

body.Color #TheColorList #ColorLeft dl,
body.Color #TheColorList #ColorRight,
body.Color .TheColorComment,
body.Color .TheColorComment dl#Alert {
	display: inline-block;
}

/* Hides from IE-mac ￥*/
*html body.Color #TheColorList #ColorLeft dl,
*html body.Color #TheColorList #ColorRight,
*html body.Color .TheColorComment,
*html body.Color .TheColorComment dl#Alert {
	height: 1%;
}

body.Color #TheColorList #ColorLeft dl,
body.Color #TheColorList #ColorRight,
body.Color .TheColorComment,
body.Color .TheColorComment dl#Alert,
body.Color .TheColorComment #comments-open-captcha {
	display: block;
}

/* End hides from IE-mac ￥*/