/* CSS Document */

/* 共通 ------------------------------------------------------------------- */
/* html,body　※テンプレートのcssに関わるので変更しないこと */
html { background:#EEE;}
body { background:#FFF; margin:0 auto; padding:0; text-align:center; font-size:80%; line-height:135%;}


img { vertical-align:top; border:none;}

ul,li { list-style:none; margin:0; padding:0;}

p { margin:0 auto; padding:0 15px 1em 20px;}

em{ color:#C00; font-style:normal;}
sup { vertical-align:top; font-weight:normal; color:#555;}

a:link { color:#000;}
a:visited { color:#306;}
a:hover { color:#F60;}

table caption { text-align:left; padding-bottom:3px;} 
form { margin:0 auto; padding:0;}

hr {
	margin:0 auto; padding:0;
	border: 1px solid #FFF;
	height: 1px;
}

/* 文字装飾・レイアウト */
.fs{ margin:0; padding:0; font-size:85%;}
.fl { font-size:120%;}
.fRed { color: #FF0000;}
.floatL { float:left;}
.floatR { float:right;}
.clear { clear:both;}

#head,#topHead,#menu,#menuBottom,.content { width:800px; text-align:left; margin:0 auto;}

.clear { clear: both;}


/* ヘッダー --------------------------- */
#head h1 { float:right; width:500px; margin:10px 0 0 0; text-align:right; font-size:12px;}
#head #logo { float:left; width:295px;}

/* TOPヘッダー */
#topHead { clear:both;}
#topHead h2 {
	clear:both;
	height:37px;
	color:#D7D7D7; font-size:95%; font-weight:normal; line-height:120%; text-align:left;
	margin:0 auto; padding:6px 8px 0 157px;
	background:url(../parts/head_h2.gif) no-repeat 0 0;}

#topMenuR {
	float:right; width:628px; height:358px;
	background:url(../parts/head_img01.jpg) no-repeat 0 0;}
	
#topMenuR p#websLogo {
	width:628px; height:157px;
	margin:0 auto; padding:0;
	text-indent:-9999px;
	background:url(../parts/head_img02.jpg) no-repeat 0 0;}


/* フッター --------------------------- */
#pagetop { width:800px; margin:10px auto; text-align:right; font-size:80%;}
.pagetop { margin:10px auto; text-align:right; font-size:80%;}
#foot { width:800px; margin:0 auto; padding:10px; text-align:center; border-top:1px solid #C00; font-size:95%;}
#foot a { border-right:1px solid #000; margin:5px auto; padding:0 7px;}
#foot a.noBd { border:none; padding-right:3px;}
#foot a.small { font-size:90%; border:none; padding:0 3px;}

#copy { margin-top:10px; padding:20px 0 5px 0; font-size:11px; background:#EEE;}


/* コンテンツ ------------------------------------------------------------- */
.content { margin:0 auto;}


/* 検索 */
#search { float:left; margin:12px auto 20px auto; width:300px;}
#search form { margin:0 auto; padding:0;}
#search input.wide { width:150px; padding:1px; margin:0 0 0 5px; color:#333;}
#search span { float:left; font-size:12px; padding:2px 5px 0 20px; background:url(../parts/ico_search.gif) no-repeat 3px 0;}


/* メイン --------------------------- */
#topMain,#main { clear:both;}
#mainBottom { margin-top:10px;}

#main h2 { padding: 0px; margin: 0px;}
#main h3 { clear:both; margin:0 auto 1em auto; padding:6px 20px; font-size:120%;
	background:url(../parts/h3_bg.gif) no-repeat 0 0;}
#main h4 {
	margin:0 0 10px 0; padding:0 0 3px 12px;
	font-size:110%;
	border-bottom:dashed 1px #CCC;
	background:url(../parts/law_h3.gif) no-repeat 0 1px;}

#title { width:392px; height:50px; margin:0; padding:0; float:left;}

/* TOP・デザインリンク */
#topDesign { height:95px; margin:25px auto 15px auto; background:url(../parts/top_bt_design.jpg) no-repeat 0 0;}
#topDesign h3 { float:left; margin:0; padding:0; width:380px; height:95px; text-indent:-9999px; background:none;}
#topDesign p { padding:20px 0 0 390px;}
#topDesign a:link,#topDesign a:visited { text-decoration:none;}
#topDesign a:hover { text-decoration:underline;}


/* TOP・お知らせ */
#info { margin-top:5px;}
#info .banner { float:left;}
#info .infoTitle { float:right; width:400px;}
#info dl { margin:0 auto; padding:0;}
#info dt { margin:0; padding:0 0 0 10px; color:#A40606; background:url(../parts/info_icon.gif) no-repeat 0 3px;}
#info dd { margin:0 0 5px 0; padding:5px 0; border-bottom:1px dotted #CCC;}
#info .clear { height:15px;}


/* TOP・PR */
#pr { clear:both; padding:20px 0;}
#pr dt { clear:both; float:left; width:365px; margin:0 auto; padding:0;}
#pr dd { margin:0 auto 20px auto; padding:2px 0 0 0; font-weight:bold;}
#pr blockquote { margin:0; padding-top:10px; color:#555; font-size:10px; text-align:right;}


/* TOP・料金概要 */
#topBlog { float:left; width:390px;}
#topHp { float:right; width:390px;}
#topBlog h3,#topHp h3 { margin:0 auto; padding:0;}
#topBlog p,#topHp p { padding-top:15px; padding-right:30px; background:url(../parts/top_bl_bg.gif) repeat-y 0 0;}


/* 料金・機能 */
#plan { clear:both; padding-top:15px;}
#plan table em { margin:0; padding:0;}

#plan table { width:100%; margin:0 auto 10px auto; padding:0; border:0; border-collapse:collapse;}
#plan table.table50 { margin:0 auto 50px auto; padding:0;}

#plan table th,#plan table td { border:1px solid #CCC;}

#plan table thead th { margin:0; padding:2px; border:none;}
#plan table thead th.blog,
#plan table thead th.hp { color:#FFF; text-align:center;}
#plan table thead th.blog a,
#plan table thead th.hp a { color:#FFF;}
#plan table thead th.blog { background:#FFF url(../parts/tb_bg01.gif) repeat;}
#plan table thead th.hp { background:#FFF url(../parts/tb_bg02.gif) repeat;}

#plan table tbody th {
	margin:0; padding:2px 2px 2px 10px;
	color:#FFF; font-weight:normal; text-align:left;
	border:#999; background:#5E5E5E;}

#plan table tbody td {
	width:250px; text-align:center;
	margin:0; padding:2px 2px 2px 10px;
	background:#F3F9E3;}
#plan table tbody.td500 td { width:512px; background:#F3F3F3;}
#plan table tbody td.hp { background:#FFEBE8;}


/* ブログ作成プラン  --------------------------*/

#blog { clear:both; padding-top:5px;}
#blog h3 { margin-top:10px; color:#FFF; background:url(../parts/h3_blog.jpg) no-repeat 0 0;}


.txtR { float: right; margin-left: 10px; width: 430px;}
.txtR02 { float: right; margin-left: 10px; width: 500px; clear: right;}
.txtR03 { margin-left: 10px; width: 285px; float: right;}
.txtR04 { float: right; margin-left: 10px; width: 450px;}


.txtR p,.txtR02 p,.txtR04 p { padding: 0 10px 1em 10px;}

.txtR03 p { padding: 0 10px 1em 5px;}

#blog h4.iconA {
	font-weight: bold;
	background: url(../parts/blog_A01.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 0 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#blog h4.iconB {
	font-weight: bold;
	background: url(../parts/blog_B01.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 0 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#blog h4.iconC {
	font-weight: bold;
	background: url(../parts/blog_C01.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 0 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}


#blog dl { margin:0 auto; padding:0;}
#blog dt { margin:0px; color:#333333; font-weight: bold; padding: 0 0 0 10px;}
#blog dd {margin: 0 0 10px 15px;}

#blog blockquote { margin:0; padding-top:10px; color:#555; font-size:10px; text-align:right;}

#blog img { margin:0; padding:0 0 10px 0;}

#blog h4.s_iconA {
	font-weight: bold;
	background: url(../parts/simple_A.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	line-height: 190%;
	color: #CC0000;
	height: 27px;
	margin: 0 0 10px 0;
	padding: 0 0 0 30px;
}

#blog h4.s_iconB {
	font-weight: bold;
	background: url(../parts/simple_B.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	line-height: 190%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
}

#blog h4.s_iconC {
	font-weight: bold;
	background: url(../parts/simple_C.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#blog h4.s_iconD {
	font-weight: bold;
	background: url(../parts/simple_D.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#blog h4.s_iconE {
	font-weight: bold;
	background: url(../parts/simple_E.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#blog h4.s_iconF {
	font-weight: bold;
	background: url(../parts/simple_F.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

/* ブログ型hpプラン  --------------------------*/
#hp { clear:both; padding-top:5px;}
#main #hp h3 { margin-top:10px; color:#FFF; background:url(../parts/h3_hp.jpg) no-repeat 0 0;}

.txtR { float: right; margin-left: 10px; width: 430px;}
.txtR02 { float: right; margin-left: 10px; width: 500px; clear: right;}
.txtR05 { margin-left: 10px; width: 310px; float: right;}
.txtR04 { float: right; margin-left: 10px; width: 450px;}

#hp dl { margin:0 auto; padding:0;}
#hp dt { margin:0px; color:#333333; font-weight: bold; padding: 0 0 0 10px;}
#hp dd {margin: 0 0 10px 15px;}

#hp img { margin:0; padding:0 0 10px 0;}

#hp hr.line {
	margin:0;
	border: 1px dotted #999999;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 30px;
	padding-left: 0;
}

#hp blockquote { margin:0; padding-top:10px; color:#555; font-size:10px; text-align:right;}

#hp h4.hp_iconA {
	font-weight: bold;
	background: url(../parts/hp_A.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	line-height: 190%;
	height: 27px;
	margin: 0 0 10px 0;
	padding: 0 0 0 30px;
}

#hp h4.hp_iconB {
	font-weight: bold;
	background: url(../parts/hp_B.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	line-height: 190%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
}

#hp h4.hp_iconC {
	font-weight: bold;
	background: url(../parts/hp_C.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#hp h4.hp_iconD {
	font-weight: bold;
	background: url(../parts/hp_D.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#hp h4.hp_iconE {
	font-weight: bold;
	background: url(../parts/hp_E.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#hp h4.hp_iconF {
	font-weight: bold;
	background: url(../parts/hp_F.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

#hp h4.hp_iconG {
	font-weight: bold;
	background: url(../parts/hp_G.gif) no-repeat;
	border-bottom:dashed 1px #CCC;
	font-size:110%;
	height: 27px;
	margin: 10px 0 10px 0;
	padding: 0 0 0 30px;
	line-height: 190%;
}

/* お客様の声 */
#case { clear:both; padding-top:15px; padding-bottom:50px;}
#case img.floatL { padding: 0 20px 0 10px;}
#case dl { margin-right:10px;}
#case dt {
	margin-left:450px;
	padding-left:15px;
	font-weight:bold;
	border-bottom:1px dotted #CCC;
	background: url(../parts/tb_bg02.gif) no-repeat 0 3px;
}
#case dd { margin-left:465px; padding:5px 0 5px;}
#case p {
	margin-left:450px;
	padding:3px;
	text-align:center;
	background:#EEE; border:1px dotted #CCC;
}



/* よくある質問  --------------------------*/
#faqWrap { clear:both; float:left; margin-top:20px; background:url(../parts/faq_bg.gif) repeat-y 0 0;}
#faqWrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}

#faqMenu { width:200px; float:left;}

#faqMenu ul { margin:5px 0 0 0; padding-left:5px;}
#faqMenu li { padding:0 0 10px 17px; background:url(../parts/faq_icon.gif) no-repeat 0 3px;}

#faq { width:600px; float:right;}
	
#faq h3{ background:url(../parts/faq_h3.gif) no-repeat;}

.que { margin:0; padding:3px 0 7px 40px;
	font-size:14px; line-height:140%;
	background:url(../parts/faq_q.gif) no-repeat 0 0px;}

.ans { margin:0 20px 0 38px; padding:3px;
	background:#FFECD9 url(../parts/faq_a.gif) no-repeat left top;}
.ans p { margin:0; padding:1px 5px 0 23px;}

.close a { width:100px; margin:0 0 0 433px; padding:3px 0;
	text-indent:-9999px; display:block;
	background:url(../parts/faq_close.gif) no-repeat right bottom;}
	

/* サポート  --------------------------*/

#supportWrap { clear:both; float:left; margin-top:20px; background:url(../parts/faq_bg.gif) repeat-y 0 0;}
#supportWrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}

#supportMenu {
	width:180px;
	float:left;
	padding-right: 20px;
}
#supportMenu h3{ font-size:12px; background:url(../parts/support_menuh3.gif) no-repeat 0 3px; padding:6px 0 6px 20px; margin:0;}
#supportMenu ul { margin:5px 0 8px 0; padding-left:5px;}
#supportMenu li { padding:0 0 4px 14px; background:url(../parts/support_icon.gif) no-repeat 4px 4px;}
#supportMenu h3 a { text-decoration: none;}

#support .supportTitle {
	border-bottom: 2px solid #BD0000;
	margin: 0px 0px 10px 0px;
	font-size: 16px;
	font-weight: bold;
	background: url(../parts/support_title%20.jpg) no-repeat left center;
	padding: 3px 3px 3px 14px;
}

#support { width:600px; float:right;}
	
#support h3{ background:url(../parts/support_h3.gif) no-repeat; margin:15px 0 15px 0; color: #FFFFFF;}
#support h3 a { text-decoration: none; color: #FFFFFF;}
#support h4{
	font-size: 14px;
	color: #0099FF;
	margin: 15px 0 0 0;
	border: none;
	padding: 2px 0 3px 15px;
	background: url(../parts/support_h4.gif) no-repeat bottom;
}
#support ul { margin: 25px 0 8px 0; padding-left:5px;}
#support li { padding: 0 0 5px 5px;}

#support .supportTop ul { margin:10px 0 15px 0; padding-left:5px;}
#support .supportTop li { background: url(../parts/support_icon.gif) no-repeat 5px 4px; padding: 0 0 5px 17px;}

#support .pointBox{ border: 2px solid #99CCCC; padding: 5px; width: 560px; margin:0 auto 10px auto ;}

#support .next{
	padding: 10px;
	background-color: #D9D9D9;
	height: 20px;
	margin: 15px 0 0 0;
}


/* 特定商取引法の表示 --------------------------*/

#law,#privacy { clear:both; padding-top:15px;}

#law h3,#privacy h3 { background:#666; color:#FFF; padding:2px 8px;}

#law table { width:100%; margin:5px auto 20px auto; padding:0; border-collapse:collapse;}

#law table p { margin:0; padding:0 0 5px 0;} 

#law table th{ width:32%; padding:3px 2px 2px 8px; font-weight:normal; background:#EEE; border:1px #999 solid;}	
#law table td { border:1px #999 solid; padding:3px 2px 2px 8px;}

#law table thead th { margin:0; padding:2px; border:none; background:#FFF;}
#law table thead th.blog,
#law table thead th.hp { text-align:center; border:1px #999 solid; color:#FFF; font-weight:bold;}
#law table thead th.blog { background:#FFF url(../parts/tb_bg01.gif) repeat;}
#law table thead th.hp { background:#FFF url(../parts/tb_bg02.gif) repeat;}

#law table.cost tbody th{ width:15%; padding-left:10px;} 	
#law table tbody td.blog { background:#F3F9E3;}	
#law table thead td.hp { background:#FFEBE8;}

/* 個人情報保護方針 --------------------------*/
	
#privacy ul{ list-style:none; padding:0 10px 10px 20px;}
#privacy ul li{ padding:0 0 5px 20px; background:url(../parts/faq_icon.gif) no-repeat 0 1px;}


/* 利用規約 */

#rule h3 { background:#666; color:#FFF; padding:2px 8px;}

#rule h4 {
	border-bottom:dashed 1px #CCC;
	margin:0 0 10px 0;
	font-size:110%; font-weight: normal;
	padding:0 0 3px 12px;
	background:url(../parts/law_h3.gif) no-repeat 0 1px;
}

#rule a:link,#rule a:visited { color:#009;}
#rule a:hover { color:#F60;}
.number, .numberClear { margin: 0 auto; padding: 0; list-style-type: decimal;}

.number dt, .numberClear dt {
	color: #333333; list-style-type: none; background: url(../parts/rule_icon.gif) no-repeat 0 0;
	font-weight: bold; margin: 15px 0 0 0; padding: 0 3px 0 10px;
}

.number dd { margin: 0; text-indent: -18px; padding: 5px 0 0 30px;}
.numberClear dd { margin: 0; padding: 5px 0px 0px 12px; text-indent: 12px;}


.number p { margin: 0; padding: 2px 0 0 18px;}
.numberClear p { margin: 0; padding: 2px 0 0 8px;}
.numberClear dd p { padding: 2px 0 0 28px; text-indent:-10px;}

#rule table em { margin:0; padding:0;}
#rule table { width:100%; padding:0; border:1px solid #999999; border-collapse:collapse; margin: 0 auto 5px auto;}

#rule table caption { margin:0; padding:0; text-align: left;}

#rule table thead th {
	margin:0;
	padding:2px;
	text-align: center;
	font-weight: normal;
	color: #FFF;
	border:1px solid #999;
	background-color: #999;
}

#rule table tbody th {
	margin:0;
	padding:2px 4px 2px 10px;
	color:#000;
	font-weight:normal;
	text-align:left;
	border:#999;
	background: #CCC;
	border:1px solid #999;

}

#rule table tbody td {
	width:280px;
	text-align:left;
	margin:0px;
	padding: 2px 5px 2px 10px;
	border-top: 1px solid #999;
	border-right: 1px dashed #999;
	border-bottom: 1px solid #999;
	vertical-align: top;
}

#rule ul { list-style:none; margin:0; padding:0;}
#rule li { list-style:disc outside; margin-left: 15px;}




/* デザインテンプレート ---------------------------------------------------------- */

/* カテゴリー選択 */
#select { text-align:center; padding-top:10px;}
#select h3 { margin:0; padding:10px 0 0 0; background:none;}
#main #select h4 { background:url(none); margin:0; padding-left:0; border-bottom:none;}

#category {
    margin:20px auto 1em auto;
	width:800px; height:56px;
	text-align:left;
	background:url(../parts/categ_select.gif) no-repeat;}
#category span { width:250px; height:30px; display:block; text-indent:-9999px;}
#category .left { float:left; width:270px; height:56px; padding-left:110px;}
#category .right { float:right; width:260px; height:56px; padding-left:95px;}




/* テンプレート一覧,
   カテゴリー一覧,
   おすすめ ---------------- */

/* 枠 */
#tempAll,
#tempCate,
#tempRec {
	float:left;
	height:auto;
	margin:10px 0 20px 0; 
	text-align:left;
	border:1px solid #CCCCCC;
	background:url(../parts/template_bg_all.gif) repeat;
	}
	
#tempCate,
#tempRec {
	width:710px; padding:10px 0 25px 54px;
	}
	
#tempAll { width:729px; padding:10px 0 25px 35px;}
#tempCate { background: url(../parts/template_bg_cate.gif) repeat;}
#tempRec { background: url(../parts/template_bg_rec.gif) repeat;}

/* ナビ */
.tempNavi { clear:both; width:710px;}
.tempNavi .prv { float:left;}
.tempNavi .nxt { float:right;}

/* リスト */
#tempAll ul,
#tempCate ul,
#tempRec ul { clear:both;}

#tempAll li,
#tempCate li,
#tempRec li {
	float:left;
	width:200px; height:250px;
	margin:10px 29px 0 0; padding:0;
	background:url(../parts/icon_template.gif) no-repeat left top;}
#tempAll li { width:128px; height:150px; margin:10px 13px 0 0; padding:0;}
#select .tempHp li { height:290px;}
#select .tempHpall li { height:175px;}

/* 見出し */
#tempAll h4,
#tempCate h4,
#tempRec h4 {
	height:20px;
	margin:0 40px 10px -7px; padding:13px 0 0 30px;
	text-align:left; color:#000;
	border-bottom:1px dotted #CCC;
	background:url(../parts/h4_icon_all.gif) no-repeat;}
#tempAll h4 { margin:0 25px 10px -5px; padding:13px 0 0 30px;}
#tempCate h4 { background: url(../parts/h4_icon_cate.gif) no-repeat;}
#tempRec h4 { background: url(../parts/h4_icon_rec.gif) no-repeat;}

#tempAll em,
#tempCate em,
#tempRec em { color:#000; padding-left:10px;}

#tempAll img,
#tempCate img,
#tempRec img { margin-top:3px; border:1px solid #CCC;}

#tempAll img.goCheck,
#tempCate img.goCheck,
#tempRec img.goCheck { margin:10px auto 0 30px; border:none;}

/* テンプレート確認 ---------------- */
.tempCheck01,
.tempCheck02 { clear:both; float:left; width:784px; padding:7px; text-align:left; background:#EEE; border:1px solid #CCC;}
.tempCheck01:after,
.tempCheck02:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}

.tempCheck01{ margin-top:15px;}
.tempCheck01 h4 { margin:0; padding:0 0 12px 0;}
.tempCheck01 .example { width:160px; margin:0 0 0 600px; line-height:200%; text-indent:-1.5em; color:#C00;}
.tempCheck01 .example a { color:#C00;}
.tempCheck01 span { line-height:100%; font-size:95%;}

.inputTitle { float:left; width:580px; margin-top:3px; padding-left:20px;}
.inputTitle span { clear:both; float:left; width:100px; margin:5px 5px auto auto; padding:3px 5px 2px 5px;
	color:#FFF; font-weight:bold; text-align:right; background:#444;}
.inputTitle input { width:420px; margin-top:2px;}

.changeCate,
.changeSub,
.changeColor { float:left; padding:10px 10px 0 0;}
.changeCate { clear:left; padding:10px 10px 10px 135px;}
.changeBt { float:right; width:185px; padding:20px 0 0 0;}
.changeBt img { margin-top:-5px;}
.changeBt em { font-size:11px;}

.tempCheck02 { clear:both;}
.tempCheck02 h4 { float:left; margin:0; padding:0;}
.tempCheck02 h5 { float:left; font-size:135%; margin:0; padding:4px 0 0 15px;}
.tempCheck02 p { float:right; padding:4px 10px 0 0;}
.tempCheck02 input { float:right;}

.tempBottom01 { clear:both; height:20px; background:url(../parts/check_flow01.gif) no-repeat 0 0;}
.tempBottom02 { clear:both; height:30px; text-align:right; background:url(../parts/check_flow02.gif) no-repeat 0 0;}
.tempBottom02 p { padding:5px 0 0 0;}
.tempBottom03 { clear:both; height:120px;}
.tempBottom03 img { float:left; padding-top:10px;}
.tempBottom03 p { float:right; padding-top:10px;}



/* 導入までの流れ・選ばれる理由・メール見積り依頼  --------------------------*/

#flow,#strong,#mail { clear:both; padding-top:15px;}

#flowL{ float:left; width:390px; margin:15px 0 25px 0; padding-right:8px; border-right:1px dashed #CCC;}

#flowR{ width:390px; margin-top:15px; float:right;}

#flowL h3,#flowR h3{ clear:both; background: url(none); margin: 0 0 5px 0; padding:0;}
/* #flowL h3,#flowR h3{ clear:both; background-image: url(../parts/h3_flow.gif); margin-bottom: 10px;}*/

#flowL h4,#flowR h4{
	clear:both;
	margin: 0px;
	padding:3px 0 13px 32px;
	color:#333; line-height:22px;
	border: none;
	background-image: none;
}

#flowL .customer,#flowR .customer{
	clear:both;
	height: 170px;
	margin-bottom: 10px;
	background: url(../parts/h4_flowC.jpg) no-repeat left top;
}

.websS,.websL,.websD,.websDend,.customerD,.customerEnd { clear:both; height: 105px; margin-bottom: 10px;}

.websS{	background: url(../parts/h4_flowW_s.jpg) no-repeat left top;}

.websL{	height: 280px; background: url(../parts/h4_flowW_L.jpg) no-repeat left top;}

.websD{	height: 130px; background: url(../parts/h4_flowW_d.jpg) no-repeat left top;}

.websDend{
	margin-bottom: 30px;
	padding-bottom: 25px;
	height: 250px;
	border-bottom: 1px dashed #CCC;
	background: url(../parts/h4_flowW_d_end.gif) no-repeat left top;
}
.websDend p { padding-bottom:0;}

.customerD{	height: 300px; background: url(../parts/h4_flowC_d.jpg) no-repeat left top;}
.customerEnd{ height: 200px; background: url(../parts/h4_flowC_end.gif) no-repeat left top;}

.customer img,.customerEnd img{ float: left; margin-left: 45px; margin-right: 8px; border: 1px solid #CCCCCC;}

.customer p{ padding-left: 10px;}

#flowR p{ padding:0 0 10px 50px; text-indent: -10px;}

.bgG{
	display: block;
	width: 310px;
	margin: 5px auto 5px 50px;
	padding: 5px;
	border: 1px solid #FFDE5B;
	background: url(../parts/flow_bgW.gif) repeat;
}
.bgG li{
	margin-bottom: 2px;
	padding-left: 15px; padding-top: 2px;
	line-height:110%;
	background: url(../parts/faq_icon.gif) no-repeat left 3px;
}

.bgR{
	display: block;
	width: 310px;
	margin: 2px auto 5px 0px;
	padding: 5px;
	text-indent :0;
	border: 1px solid #FF8E8E;
	background: url(../parts/flow_bgC.gif) repeat;
}

#mail ol,#mail li { list-style-type: decimal;}
#mail li { padding-bottom:10px;}


/* サイトマップ  --------------------------*/

#sitemap { clear:both; padding-top:15px;}

.sitemapBox { float:left; width:380px; margin-right:10px;}
#sitemap ul,#sitemap li{ padding:0; margin:0; list-style:none;}
#sitemap ul{ margin:0 15px; padding-bottom:15px;}
#sitemap li{ padding:5px 0 6px 0; background:url(../parts/li_sitemap.gif) 0 0 repeat-y; text-indent:22px;}
#sitemap li.end{ background:url(../parts/li_sitemap_end.gif) 0 0 repeat-y;}

#sitemap ul.sub { padding:1px 0 0 0;margin:0;font-weight: normal;}
#sitemap ul.sub li{ padding:3px 0 3px 0; background:url(../parts/li_sitemap_sub.gif) 0 0 repeat-y; text-indent:0; padding-left:45px;}
#sitemap ul.sub li.end{ padding-bottom:8px; background:url(../parts/li_sitemap_sub_end.gif) 0 0 repeat-y;}



/* ブログ型HP・デザインテンプレート ---------------------------------------------------------- */

/* ブログ型HP・カテゴリー選択 */

#categoryHp {
    margin:20px auto 1em auto;
	width:800px; height:56px;
	text-align:left;
	background:url(../parts/hp_select.gif) no-repeat;}
#categoryHp span { width:250px; height:30px; display:block; text-indent:-9999px;}
#categoryHp .left { float:left; width:270px; height:56px; padding-left:110px;}
#categoryHp .right { float:right; width:260px; height:56px; padding-left:95px;}



/* ブログ型HP・テンプレート確認 ---------------- */

.tempBottomHp01 { clear:both; height:20px; background:url(../parts/hp_flow01.gif) no-repeat 0 0;}
.tempBottomHp02 { clear:both; height:30px; text-align:right; background:url(../parts/hp_flow02.gif) no-repeat 0 0;}



/* ブログ型HP
	テンプレート一覧,
   カテゴリー一覧,
   おすすめ ---------------- */
   
.changeCateHp { float:left; padding:20px 20px 0px 10px;}

.changeSubHp,
.changeColorHp { float:left; padding:5px 20px 0 0;}

.changeBtHp { float:right; width:185px; padding: 20px 0 0px 0;}
.changeBtHp img { margin-top:-5px;}