/* ------------------------------------------------------------
ap.css -- 2008年版アクションプランナー --
------------------------------------------------------------ */


/* 共通クラス
------------------------------------------------------------ */

/* -- ボックス ------ */
#contents .box {
	margin: 0 0 20px 0;
	padding: 0;
	width: 100%;
}
#contents .boxL {
	margin: 0 0 20px 0;
	padding: 0 0 10px 0;
	width: 100%;
}

/* これ以降Mac IE 5のみに適用される \*//*/
#contents .box {
	margin: 0 0 20px 0;
	padding: 0;
	width: 400px;
}
#contents .boxL {
	margin: 0 0 20px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #CCCCCC;
	width: 400px;
}
/* これ以降Mac IE 5以外にも適用される */


/* -- テキスト ------ */
#contents .txtRed {
	color: #FF3333;
}
#contents .txtRedBig {
	font-size: 150%;
	color: #FF3333;
}


#contents .btLink01 {
	margin: 0;
	padding: 0 17px 0 0;
	background: transparent url(/shared/images/sidenavi/bt_yazirusi.gif) right center no-repeat;
}



/* 共通ID
------------------------------------------------------------ */

/* -- コンテンツ枠 ------ */
#contents {
	margin: 10px auto 20px auto;
	padding: 0 auto;
	text-align: center;
}

/* これ以降Mac IE 5のみに適用される \*//*/
#contents {
	margin: 10px 0 30px 0;
	padding: 0;
	text-align: center;
	width: 100%;
}
/* これ以降Mac IE 5以外にも適用される */

#contents p {
	margin: 0;
	padding: 0 0 10px 0;
	font-size: 80%;
	line-height: 140%;
	color: #333333;
}
#contents h1 {	
	margin: 0;
	padding: 0 0 10px 0;
}

#contents h2{
	color: #333333;
	margin: 0 0 10px 0;
	padding: 5px;
}

#contents h3 {
	font-size: 14px;
	font-weight: bold;
	color: #333333;
	margin: 0 0 10px 0;
	padding: 5px;
	border: 1px solid #CCCCCC;
	background-image: url(images/h3_bg.gif);
	background-repeat: repeat-x;
}

#contents img {
	margin: 0;
	padding: 0;
	border: none;
}
#contents strong {
	color: #FF3333;
}

#main {
	margin: 0 auto;
	padding: 0;
	width: 560px;
	text-align: left;
}

div.circle{
	font-size: 12px;
	font-weight: bold;
	margin: 0px 0px 12px;
	padding: 2px 0px 2px 16px;
	border-top: 1px dotted #589536;
	border-bottom: 1px dotted #589536;
	background-color: #CBDEB4;
	background-image: url('images/square.gif');
	background-repeat: no-repeat;
	background-position: left center;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#main {
	margin-left: 0;
	margin-top: 0;
	margin-left: 0;
	margin-bottom: 0;
	padding-left: 0;
	padding-top: 0;
	padding-left: 0;
	padding-bottom: 0;
	width: 560px;
	text-align: left;
}
/* これ以降Mac IE 5以外にも適用される */

#main01 {
	margin: 0;
	padding: 0;
	width: 560px;
}
#main02 {
	margin: 15px 0 0 0;
	padding: 0;
	width: 560px;
	clear: both;
}
#snavi {
	margin: 0;
	padding: 0;
	width: 150px;
	float: right;
}

#2008inq {
	margin: 0;
	padding: 10px;
	width: 540px;
	border: 1px solid #CCCCCC;
}

/* -- ヘッダー ------ */
#main #header {
	margin: 10px 0;
	padding: 0;
	width: 560px;
}
#main #header img {
	margin: 0;
	padding: 0;
	border: none;
}

/* -- サブナビ ------ */
#snavi img {
	margin: 0;
	padding: 0;
	border: none;
	vertical-align: bottom;
}

#snavi #snaviMenu {
	margin: 0 0 10px 0;
	padding: 0;
}
#snavi #snaviMenu p {
	margin: 0;
	padding: 0;
}
#snavi #snaviMenu ul {
	margin: 0;
	padding: 0;
	background: #F9ECED;
	width: 150px;
}
#snavi #snaviMenu li {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 70%;
	background-color: #F9ECED;
	border-bottom: solid 1px #C73A3E;
}
#snavi #snaviMenu li a {
	margin: 0;
	padding: 7px 0 5px 18px;
	color: #333333;
	display: block;
	width: 132px;
	-width: 150px;
	background-color: #F9ECED;
	text-decoration: none;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#snavi #snaviMenu li a {
	margin: 0;
	padding: 7px 0 5px 18px;
	color: #333333;
	display: block;
	width: 150px;
	background-color: #F9ECED;
	text-decoration: none;
}
/* これ以降Mac IE 5以外にも適用される */

#snavi #snaviMenu li#m01 a { background: transparent url(images/snavi_01.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m02 a { background: transparent url(images/snavi_02.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m03 a { background: transparent url(images/snavi_03.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m04 a { background: transparent url(images/snavi_04.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m05 a { background: transparent url(images/snavi_05.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m06 a { background: transparent url(images/snavi_06.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m07 a { background: transparent url(images/snavi_07.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m08 a { background: transparent url(images/snavi_08.gif) 2px center no-repeat; }
#snavi #snaviMenu li#m09 a { background: transparent url(images/snavi_09.gif) 2px center no-repeat; }

#snavi #snaviMenu li#m01on a { background: #D77375 url(images/snavi_01.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m02on a { background: #D77375 url(images/snavi_02.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m03on a { background: #D77375 url(images/snavi_03.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m04on a { background: #D77375 url(images/snavi_04.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m05on a { background: #D77375 url(images/snavi_05.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m06on a { background: #D77375 url(images/snavi_06.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m07on a { background: #D77375 url(images/snavi_07.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m08on a { background: #D77375 url(images/snavi_08.gif) 2px center no-repeat; color: #FFFFFF; }
#snavi #snaviMenu li#m09on a { background: #D77375 url(images/snavi_09.gif) 2px center no-repeat; color: #FFFFFF; }

#snavi #snaviMenu li#m01 a:hover,
#snavi #snaviMenu li#m02 a:hover,
#snavi #snaviMenu li#m03 a:hover,
#snavi #snaviMenu li#m04 a:hover,
#snavi #snaviMenu li#m05 a:hover,
#snavi #snaviMenu li#m06 a:hover,
#snavi #snaviMenu li#m07 a:hover,
#snavi #snaviMenu li#m08 a:hover,
#snavi #snaviMenu li#m09 a:hover {
	color: #FFFFFF;
	background-color: #D77375;
}




/* インデックス
------------------------------------------------------------ */
#topImage {
	margin: 0;
	padding: 0;
}
#topImage h1 {
	margin: 0;
	padding: 0;
}
#topImage p {
	margin: 0;
	padding: 0;
}
#topMenuL {
}
#topMenuR {
}

/* -- 詳細ボタン ------ */


/* アクションプランナーとは
------------------------------------------------------------ */
#contents .aboutPho {
	margin: 0 10px 10px 0;
	padding: 0;
	float: left;
}



/* 購入する
------------------------------------------------------------ */
#contents .orderItem {
	margin: 0 0 10px 0;
	padding: 0;
}
#contents .orderItem .phoR{
	margin: 0 0 10px 0;
	padding: 0;
	float: right;
}
#contents .orderItem .allColor {
	margin: 0;
	padding: 0 17px 0 0;
	background: transparent url(/shared/images/sidenavi/bt_yazirusi.gif) right center no-repeat;
}
#contents .orderForm {
	margin: 0;
	padding: 0 0 20px 0;
	text-align: center;
}
#contents .orderForm form {
	margin: 0 auto;
	padding: 0;
	vertical-align: middle;
}
#contents .orderForm .bt {
	margin: 0;
	padding: 0;
	border: 0;
}

#contents .orderBox {
	margin: 0 0 20px 0;
	padding: 10px;
	font-size: 85%;
}

#contents .att h3 {
	font-size: 90%;
}

.colorcp {
	font-size: 12px;
	line-height: 20px;
	font-weight: bold;
	color: #3e569a;
}

/* Q&A
------------------------------------------------------------ */
#contents #qa .q {
	background: transparent url(qa/images/AP_q.gif) 5px 0 no-repeat;
	padding-top:1px;
	padding-left:23px;
	font-weight:bold;
	font-size:80%;
	color:#CC3300;
	margin-bottom:8px;
}

#contents #qa .a {
	background: transparent url(qa/images/AP_a.gif) 4px 0 no-repeat;
	padding-left:23px;
	font-size:80%;
	line-height: 150%;
	color: #333333;
	border-bottom:#CCCCCC solid 1px;
	border-right:#CCCCCC solid 1px;
	padding-bottom:10px;
	padding-right:15px;
	margin-bottom:25px;
}

#contents #qa dl {
	margin: 0;
	padding: 0;
}
#contents #qa dt{
	margin: 0;
	padding: 0;
}
#contents #qa dd {
	margin: 0;
	padding: 0;
}

#contents #qa .yajirushi {
	margin: 0;
	padding: 0 17px 0 0;
	background: transparent url(/shared/images/sidenavi/bt_yazirusi.gif) right center no-repeat;
}


/* スペック
------------------------------------------------------------ */
#contents .spec {
	margin: 0 0 20px 0;
	padding: 0;
}
#contents .spec h3 {
	font-size: 90%;
}
#contents .spec ul {
	margin: 0 30px 0 30px;
	padding: 0;
}
#contents .spec li {
	margin: 0;
	padding: 0;
	font-size: 80%;
	line-height: 140%;
}
#contents .spec .pho {
	margin: 0 0 0 25px;
	padding: 0;
}


/* 2008版ここが新しい
------------------------------------------------------------ */
#contents .newPoint {
	clear: both;
	width: 560px;
	margin: 0;
	padding: 0;
	background: transparent url(new/images/new_circle_back.gif) 0 0 no-repeat;
}
#contents .newPoint h4 {
	margin: 0;
	padding: 0;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#contents .newPoint h4 {
	background-color: transparent;
}
/* これ以降Mac IE 5以外にも適用される */
#contents .newPoint img {
	border: none;
	vertical-align: bottom;
	line-height: 0px;
	font-size: 0px;
}
#contents .newPoint p {
	margin: 15px 0 0 0;
	padding: 0 0 0 1px;
	font-size: 75%;
	line-height: 150%;
}
#contents .newPoint .bun1 {
	width: 132px;
	float: left;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#contents .newPoint .bun1 {
	width: 132px;
	float: left;
	background-color: transparent;
}
/* これ以降Mac IE 5以外にも適用される */

#contents .newPoint .newPho1 {
	margin: 0;
	padding: 0;
	float: right;
	width: 264px;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#contents .newPoint .newPho1 {
	margin: 0;
	padding: 0;
	float: right;
	width: 264px;
	background-color: transparent;
}
/* これ以降Mac IE 5以外にも適用される */

#contents .newPoint .bun2 {
	width: 240px;
	float: left;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#contents .newPoint .bun2 {
	width: 220px;
	float: left;
	background-color: transparent;
}
/* これ以降Mac IE 5以外にも適用される */

#contents .newPoint .newPho2 {
	margin: 0;
	padding: 0;
	float: right;
	width: 136px;
}
/* これ以降Mac IE 5のみに適用される \*//*/
#contents .newPoint .newPho2 {
	float: right;
	width: 136px;
	background-color: transparent;
}
/* これ以降Mac IE 5以外にも適用される */


/* 全26色
------------------------------------------------------------ */
#contents #newColor {
	margin: 0;
	padding: 0;
}
#contents #newColor h3 {
	margin: 5px 0 15px 0;
	padding: 0;
}

#contents .colorBox {
	margin: 0 0 40px 0;
	padding: 0;
}
#contents .colorBox h3 {
	margin: 0;
	padding: 0;
}
#contents .colorBox p {
	margin: 0;
	padding: 0;
}
#contents .colorBox p.setu {
	margin: 10px 0 0 0;
	padding: 0;
}

#contents .colorHikaku {
	margin: 0;
	padding: 0;
}
#contents .colorHikaku table {
	margin: 0;
	padding: 0;
}
#contents .colorHikaku table td {
	margin: 0;
	padding: 7px;
}

#contents .colorSpec {
	margin: 0;
	padding: 0;
}
#contents .colorSpec table {
	margin: 0 0 0 15px;
	padding: 0;
}
#contents .colorSpec table td {
	margin: 0;
	padding: 7px;
	font-size: 80%;
	border-bottom: 1px dotted #CCCCCC;
}

.colorkw {
	font-size: 12px;
	line-height: 20px;
	font-weight: bold;
	color: #666666;
}

/* 上手な使い方
------------------------------------------------------------ */
#contents .useOmake {
	margin: 0;
	padding: 0 10px 0 10px;
	background: url(use/images/use_omake_002.gif) 0 0 repeat-y;
	font-size: 80%;
	line-height: 135%;
}
#contents .useOmake strong {
	color: #333333;
}

/* アクションプランナー取扱店一覧
------------------------------------------------------------ */
.apth {
	font-size: 12px;
	font-weight: bold;
	background-color: #d3d9ee;
}

.areacol {
	font-size: 12px;
	font-weight: bold;
}

.aptdcol1 {
	font-size: 12px;
	background-color: #ffffff;
}

.aptdcol2 {
	font-size: 10px;
	background-color: #efefef;
}

.linktxt {
	color: #cc0000;
}

.toptxt {
	font-size: 12px;
	margin:10px 0;
}

/* ------------------------------------------------------------
float対策
------------------------------------------------------------ */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*//*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.daytxt { font-size: 12px; font-weight: bold; color: #334287; }
.topitxt { font-size: 12px; color: #000000; }
.topitxts { font-size: 10px; color: #000000; }
.topitxt a:link { color : #CC0000; }
.topitxt a:hover { color: #fe6600; }

/* what's New
------------------------------------------------------------ */

.wnt {
	font-size: 12px;
	font-weight: bold;
	color: #fe6600;
}