@charset "utf-8";

/*
//-----------------------------------
//body部分（共通）
//-----------------------------------
*/
body {
margin: 0px;
padding: 0px;
font-size: 80%;
line-height:130%;
font-family: ＭＳ Ｐゴシック, Osaka, ヒラギノ角ゴ Pro W3;
}

* {
margin: 0px;
padding: 0px;
}

img {
border:0;
}


.iepngfix {
   behavior:expression(IEPNGFIX.fix(this));
}

/*
//====================================
//Honda-自動CSSを強制的に上書き
//====================================
*/
div#contents {
width:900px !important;
}



/*
//====================================
//uaContents部分
//====================================
コンテンツ大枠
*/


#uaContents {
width:860px;
margin:0 auto;
padding:10px 20px;
background:url(../image/share/care_bg.gif) repeat-y;
color:#8E6758;/*茶色文字*/
}



/*
//-----------------------------------
//共通部分
//-----------------------------------
*/


/*ページトップへン*/
p.footPageTop{
text-align:right;
}


/*見出し（■・・）*/
#uaContents h2{
font-size:small;
height:22px;
padding:5px 0 0 20px;
}

#uaContents h2 span{
color:#fff;
}

#uaContents h3 {
position:relative;
}
/*タイトル（画像）のサブタイトル*/
#uaContents h3 span{
display:block;
margin:0;
padding:0;
font-size:small;
font-weight:normal;
}

/*クイックメニュ*/
.quickDiv1 {
	position:absolute;
	width:77px;
	height:24px;
	z-index:1;
	left: 392px;
	top: 1px;
}


/*見出し（画像-こんなあなたに・・）*/
#uaContents h4{
padding:3px 20px;
margin-bottom:15px;
}

/*見出し（●・・）*/
#uaContents h5{
font-size:small;
height:22px;
padding:5px 0 0 20px;
margin:15px 0 15px 0;
}


#uaContents dd,
#uaContents p{
margin-bottom:20px;
}


/*囲み部分*/
#uaContents dl{
width:285px;
}

#uaContents dt{
text-align:center;
padding:0.5em;
font-weight:bold;
margin-bottom:5px;
}

#uaContents dd{
}



/*
//====================================
//各アイテム大枠(商品ごとのくくり)
//====================================
*/

div.itemWrapp{
/*width:860px;*/
margin-bottom:60px;
}


/*
//-----------------------------------
//各ヘッダ部
//-----------------------------------
*/

.itemHeader{
width:680px;
margin:0 0 0 20px;
}

.itemHeader p{
margin-top:10px;
}

.itemHeader img.rightCar{
}


/*
//-----------------------------------
//各見出しと文言、写真のセット
//-----------------------------------
*/

.columnSet{
}

.columnSet p{
margin:0 20px;
}

.columnSet dl{
margin:0 0 0 20px;
}


/*見出し下、テーブル部*/
.itemTbl{
width:700px;
}

/*columnSetを2段入れ子用テーブル*/
.nidanTbl .columnSet{
width:340px;
}


/*-----------------------------------
//さらに細かい組用パーツ
-----------------------------------*/


/*仕上がりイメージ*/
.siagariTbl{
background-color:#f1f3f1;
}

#uaContents .siagariTbl p{
color:#fff;
margin-bottom:5px;
}

.siagariTbl .imgArea{
text-align:center;
padding:10px 5px;
}


/*画像の間の矢印セル*/
span.allowSpan{
display:block;
margin:0;
padding:0;
width:33px;
height:33px;
}

/*Befor&After*/
span.beforeAfter{
display:block;
margin:0 20px;
padding:0;
width:85px;
height:18px;
}


/*画像で組んだテーブルなど*/
table.imgTbl{
margin-left:20px;
}


/*表組みテーブル*/
.chartTable { margin: 20px 0 12px;}
.chartTable table {
	border-collapse: collapse;
}
.chartTable td,.chartTable th{
    padding: 5px;
    text-align: center;
    border: 1px #40b6e6 solid;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
.tableHead {
	float: left;
}

.tableBody {
	float: left;
	width: 711px;
	overflow-x: scroll;
	overflow-y: hidden;
}
.chartTable table {
	table-layout: fixed;
}
.tableBody table {
	width: 850px;
}
.chartTable table th {
	width: 127px;
	color: #006cb6;
}
.chartTable table td {
	width: 212px;
}
.chartTable table td span {
    display: block;
	font-size: x-small;
	line-height: 1.2em;	
    margin-top: 5px;
}
.chartTable table td:first-child {
	border-left: none;
}
.heightLine01 { 
	position: relative;
	height: 40px;
}
.heightLine02 { height: 95px;}
.heightLine03 { height: 16px;}
.heightLine04 { height: 34px;}
.heightLine05 { height: 16px;}
.heightLine06 { height: 34px;}
.heightLine07 { height: 50px;}
td.heightLine08 { font-size: 95%;}
.heightLine08 { height: 16px;}
.chartTable td.heightLine01,.chartTable th.heightLine01 { padding: 0;}
.chartTable th.heightLine09 { height: 196px; padding: 0;}
.chartTable td.heightLine09 { padding: 0;}
.icoNew {
	position: absolute;
	top: 7px;
	right: 6px;
}

/*
::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
    height: 7px;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.5);
    box-shadow: 0 0 1px rgba(255,255,255,.5);
}
*/

table.hyouTbl01{
margin-top:20px;
border-collapse:collapse;
}

table.hyouTbl01 span{
font-size:x-small;
line-height:1.2em;
display:block;
margin-top:5px;
}

table.hyouTbl01 td{
padding:5px;
text-align:center;
border:1px #40b6e6 solid;
}

table.hyouTbl01 td.firstLine{
color:#006cb6;
font-weight:bold;
}



/*Memoテーブル*/
table.memoTbl{
margin-left:20px;
}

#uaContents table.memoTbl h5{
background:none;
height:auto;
padding:5px 10px;
margin:0 0 0 0;
}
#uaContents table.memoTbl p{
margin:10px;
}

table.memoTbl img{
float:right;
margin:10px;
}

/*
//====================================
//汎用セレクタ
//====================================
*/

#uaContents .caption{
font-size:x-small;
line-height:1.3em;
}
#uaContents .mt0{
margin-top:0;
}
#uaContents .mt20{
margin-top:20px;
}
#uaContents .mb0{
margin-bottom:0;
}
#uaContents .mb20{
margin-bottom:20px;
}

#uaContents .kyoutyouColor{
color:#f00;
}
/*
//====================================
//★★★キーカラー01（bodyのIDで切り替える）★★★
//====================================
*/

/*左側色ベタ*/
#careColor01 #uaContents td.sellLeft{background:#9fcff0;}

/*見出し（■・・）*/
#careColor01 #uaContents h2{color:#006cb6;background:url(../bodycoat/image/midashi02.gif) no-repeat;}

/*タイトル（画像）のサブタイトル*/
#careColor01 #uaContents h3 span{color:#009edd;}

/*見出し（画像-こんなあなたに・・）*/
#careColor01 #uaContents h4{background:#009edd;}

/*見出し（●・・）*/
#careColor01 #uaContents h5{background:#dbf1fa;color:#006cb6;border-bottom:1px #009edd solid;}
#careColor01 #uaContents h5 span{color:#009edd;}/*●頭*/

/*囲み部分*/
#careColor01 #uaContents dt{color:#006cb6;border:1px #009edd solid;}

/*画像の間の矢印セル*/
#careColor01 #uaContents span.allowSpan{background-color:#009edd;}

/*Befor&After*/
#careColor01 #uaContents span.beforeAfter{background-color:#009edd;}

/*仕上がりイメージ*/
#careColor01 #uaContents .siagariTbl .headTd{background-color:#3fb5e5;}

/*Memoテーブル*/
#careColor01 #uaContents table.memoTbl{border:1px #009edd solid;}


/*
//====================================
//★★★キーカラー02（bodyのIDで切り替える）★★★キイロ
//====================================
*/

/*左側色ベタ*/
#careColor02 #uaContents td.sellLeft{background:#fcd88c;}

/*見出し（■・・）*/
#careColor02 #uaContents h2{color:#f87300;background:url(../feet/image/midashi02.gif) no-repeat;}

/*見出し（画像-こんなあなたに・・）*/
#careColor02 #uaContents h4{background:#f9b219;}

/*見出し（●・・）*/
#careColor02 #uaContents h5{background:#fdefcf;color:#f87300;border-bottom:1px #f9b219 solid;}
#careColor02 #uaContents h5 span{color:#f9b219;}/*●頭*/

/*囲み部分*/
#careColor02 #uaContents dt{color:#f87300;border:1px #f9b219 solid;}

/*画像の間の矢印セル*/
#careColor02 #uaContents span.allowSpan{background-color:#f9b219;}

/*Befor&After*/
#careColor02 #uaContents span.beforeAfter{background-color:#f9b219;}

/*仕上がりイメージ*/
#careColor02 #uaContents .siagariTbl .headTd{background-color:#fbc54f;}

/*Memoテーブル*/
#careColor02 #uaContents table.memoTbl{border:1px #f9b219 solid;}



/*
//====================================
//★★★キーカラー03（bodyのIDで切り替える）★★★グリーン
//====================================
*/

/*左側色ベタ*/
#careColor03 #uaContents td.sellLeft{background:#bfdca2;}

/*見出し（■・・）*/
#careColor03 #uaContents h2{color:#5bb012;background:url(../interior/image/midashi02.gif) no-repeat;}

/*タイトル（画像）のサブタイトル*/
h3 span{color:#5bb012;}

/*見出し（画像-こんなあなたに・・）*/
#careColor03 #uaContents h4{background:#5bb012;}

/*見出し（●・・）*/
#careColor03 #uaContents h5{background:#e9f5e1;color:#5bb012;border-bottom:1px #5bb012 solid;}
#careColor03 #uaContents h5 span{color:#5bb012;}/*●頭*/

/*囲み部分*/
#careColor03 #uaContents dt{color:#5bb012;border:1px #5bb012 solid;}

/*画像の間の矢印セル*/
#careColor03 #uaContents span.allowSpan{background-color:#5bb012;}

/*Befor&After*/
#careColor03 #uaContents span.beforeAfter{background-color:#5bb012;}

/*仕上がりイメージ*/
#careColor03 #uaContents .siagariTbl .headTd{background-color:#7fc14e;}

/*Memoテーブル*/
#careColor03 #uaContents table.memoTbl{border:1px #5bb012 solid;}



/*
//====================================
//★★★キーカラー04（bodyのIDで切り替える）★★★ムラサキ
//====================================
*/

/*左側色ベタ*/
#careColor04 #uaContents td.sellLeft{background:#e1c9e0;}

/*見出し（■・・）*/
#careColor04 #uaContents h2{color:#983385;background:url(../view/image/midashi02.gif) no-repeat;}

/*見出し（画像-こんなあなたに・・）*/
#careColor04 #uaContents h4{background:#af61a2;}

/*見出し（●・・）*/
#careColor04 #uaContents h5{background:#f5ebf3;color:#983385;border-bottom:1px #af61a2 solid;}
#careColor04 #uaContents h5 span{color:#ad5e9e;}/*●頭*/

/*囲み部分*/
#careColor04 #uaContents dt{color:#983385;border:1px #af61a2 solid;}

/*画像の間の矢印セル*/
#careColor04 #uaContents span.allowSpan{background-color:#af61a2;}

/*Befor&After*/
#careColor04 #uaContents span.beforeAfter{background-color:#af61a2;}

/*仕上がりイメージ*/
#careColor04 #uaContents .siagariTbl .headTd{background-color:#c186b8;}

/*Memoテーブル*/
#careColor04 #uaContents table.memoTbl{border:1px #af61a2 solid;}