@charset "UTF-8";

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

 テンプレートギャラリー用

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

/* //////////////////////////////////////////////////////////////// common */

.downloadList li {
	vertical-align:bottom
	}

.downloadList li.title{
	 width:162px;
	 margin-right:3px !important;
	 float:left;
}

.downloadList li.title .top{
		padding:0 11px 10px;
		background:none;
	}
	
	.downloadList li.title .top p.thum{
		height:100px;
		width:140px;
		}
		
	.downloadList li.title .bottom{
		padding-top:10px;
		background:none;
	}
	
	.downloadList li.title .bottom p{
		height:9px;
		width:140px;
	}
	
	.downloadList li.title .bottom p.txtSmall{
		height:auto;
	}
	
	.downloadList li.title p.add{
		margin-top:36px;
		padding:0 5px 6px;
		height:19px;
		background:url(img/bg_home_title_bottom.gif) no-repeat bottom center;
	}
	

/*タイトル背景*/
.downloadList li.new .downloadBox{
	background:url(img/title01.gif) no-repeat center top;
	background-color:#fff3c8;
	position:relative;
}

.downloadList li.ranking .downloadBox{
	background:url(img/title02.gif) no-repeat center top;
	background-color:#fff3c8;
	position:relative;
}

.downloadList li.template .downloadBox{
	background:url(img/title03.gif) no-repeat center top;
	background-color:#fff3c8;
	position:relative;
}

.downloadList  p.updata {
	position:absolute;
	top:175px;
	left:45px;
}


/*ランキング*/
.downloadList li p.rankingImg{
	position:absolute;
}

/*検索結果*/
.searchResult{
	margin:15px 10px 10px 10px;
}

.searchResult a.wring{
	background:url(img/wring.gif) no-repeat left center;
	padding-left:10px;
}

.searchResult span{
	font-size:167%;
	font-weight:bold;
	color:#ff9c00;
}

body#home div.listInfo p{
	width:300px;
	margin-left:0;
}

body#home div.listInfo img {
	vertical-align:top !important;
	margin-top:2px;
	
}

body#home div.listInfo ul{
	margin-right:10px;
}


/*ダウンロードリスト*/

.downloadList{
	width:660px;
	margin-right:-3px;
	margin-bottom:10px;
}
.downloadList li{
	 width:162px;
	 margin-right:3px;
	
	 margin-bottom:10px;
	 float:left;
}

* html .downloadList li{
	 margin-right:0px !important;
}
/*
	.downloadList li.lastSet{
		margin-right:0 !important;
	}
*/
	.downloadList li .top{
		padding:0 11px 10px;
		background:url(../../../common/css/img/bg_download_top.gif) no-repeat center top;
		/background:url(../../../common/css/img/bg_download_top.gif) no-repeat 0px top;
	}
	
	.downloadList li .top p{
		padding-top:10px;
		width:140px;
		margin:0 auto;
	}
	
		p.thum{
			height: 100px !important;
			width:140px;
			text-align:center;
		}
		
		
		
		.downloadList li .top p.thum a{
			border:1px solid #fff;
			height: 100px;
			width:140px;
			display:table-cell;
			vertical-align:middle;
			
		}
		
		* html .downloadList li .top p.thum a{
			display:inline;
			zoom:1;
		}
		
		*:first-child+html .downloadList li .top p.thum a{
			display:inline;
			zoom:1;
		}
		
		.downloadList li .top p.thum a:hover{
			border:1px solid #ff9c00;
		}
		
	.downloadList li .bottom{
		padding-top:10px;
		background:url(../../../common/css/img/bg_dotted01.gif) repeat-x top left;
	}
	
	.downloadList li .bottom p,
	.downloadList li p.show{
		width:150px;
		margin:0 auto;
	}
	.downloadList li p.show{
		height: 19px;
	}
	.downloadList li p.show img {
		vertical-align: top;
	}

	
	.downloadList li .bottom p.txtSmall{
		margin:0 auto;
		padding-top:5px;
		padding-bottom:5px;
	}
	
	/** html .downloadList li .bottom{
		margin-bottom:-10px;
	}*/
	
	.downloadList li p.add{
		padding:10px 2px 2px;
		background:url(../../../common/css/img/bg_download_bottom.gif) no-repeat bottom center;
	}
	
	.downloadList li .bottom p.add{
		width:auto;
		margin:0 0 0 0;
	}
	
	.downloadList li .bottom p.txtSmall{
		line-height:1.4 !important;
	}

/*ダウンロード角丸*/
.downloadBox{
	background:url(../../../common/css/img/bg_download_middle.gif) repeat-y top left;

}

.gBg{
	background:#f1f1f1;
	text-align:center;
	margin-top:20px;
}

.gBg input,
.gBg a{
	margin:10px 0;
}


/*テンプレートを探す*/
.searchBox{
	background:url(../../../common/css/img/bg_download_sr_bottom.gif) no-repeat bottom left;
	padding-bottom:20px;
}

	.searchBox .jqtransform{
		background:url(../../../common/css/img/bg_download_sr_middle.gif) repeat-y center left;
		padding:0 20px;
	}
	
	.searchBox ul.calum-3{
		width:195px;
		float:left;
	
	}
	
	.searchBox ul.calum-3 li label{
		display:inline;
	}
	
	.searchBox ul.calum-3 li{
		margin-bottom:1em;
	}
	
		
	.searchBox h6{
		background:url(../../../common/css/img/bg_dotted01.gif) repeat-x bottom left;
		padding-bottom:5px;
		margin-bottom:10px;
	}

.searchBoxS{
}	

	.searchBoxS input{
	 margin-left:10px;
	 margin-top:0 !important;
	 float:left;

	}
	
.terms {
	 margin: 0px 0px 15px 10px;
}
	
	
table.terms th {
 	font-weight: bold;
	white-space: nowrap;
	vertical-align:top;
	padding-right:10px;
}	
	
	
	

/* //////////////////////////////////////////////////////////////// guide01 / 02 / 03 */

ul#stepNavi{
	background:url(img/bg_step_navi.gif) no-repeat top left;
	margin-left:20px;
	margin-top:20px;
}

	ul#stepNavi li{
		float:left;
		padding-right:3px;
	}

h4.sTtl{
	background:url(../../../common/css/img/bg_dotted03.gif) repeat-x bottom left;
	padding:0 0 10px 20px;
	margin-top:30px;
}


div.stepBox{
	position:relative;
	border:2px solid #e4e4e4;
	padding:30px 30px 40px;
	width:554px;
	margin:35px auto 0;
	/* Do rounding (native in Firefox and Safari) */
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}

		div.stepBox h5{
			position:absolute;
			top:-15px;
			left:10px;
		}
		
		div.stepBox h6{
			margin-top:20px;
			 margin-bottom:15px;
		}
		
		body#home div.stepBox .line01{
			background:url(../../../common/css/img/bg_dotted01.gif) repeat-x top left;
			padding-top:20px;
			margin-top:20px;
		}

div.stepCap{
	margin:5px 0 0 0;
}

	div.stepCap .fr{
		width:265px;
		margin-top:5px;
	}
	
		div.stepCap .fr p{
			margin-bottom:7px;
		}


/*guide02のはじめ*/
div.stepImg{
	margin:5px 0 0 0;
	background:url(../../../common/css/img/bg_dotted01.gif) repeat-x bottom left;
	padding:0 0 20px 0;
}

	div.stepImg .fl{
	width:265px;
	}
	div.stepImg .fr{
		width:265px;
	}


div.bgGrayBox{
	background-color:#f1f1f1;
	padding:0 20px;
}

	div.bgGrayBox div.stepCap{
		margin:0;
		background:url(../../../common/css/img/bg_dotted01.gif) repeat-x bottom left;
		padding-top:20px;
		padding-bottom:20px;
	}
		
		div.bgGrayBox div.stepCap p.fl{
			text-align:center;
			width:245px;
		}
		
		div.bgGrayBox div.stepCap .fr{
			width:245px;
			margin-top:0;
		}
		
			div.bgGrayBox div.stepCap .fr p{
				margin-bottom:3px;
			}

/*次へ／前へ*/

div#btnArea{
	background-color:#f1f1f1;
	margin-top:30px;
	padding:10px 20px;
}


/*guide03のみ
div#guide03.*/

/*メインコンテンツ内の入れ子角丸*/
.cornerStepCapBox{
	margin-top:10px;
	padding: 10px 20px;
	background-color: #fff;
	border:1px solid #cccccc;
	/* Do rounding (native in Firefox and Safari) */
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.cornerStepCapSmallBox{
	margin-top:10px;
	padding: 10px;
	width:255px;
	margin-left:-10px;
	background-color: #fff;
	border:1px solid #cccccc;
	/* Do rounding (native in Firefox and Safari) */
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}


.cornerStepCapBox dl.calum-3{
	width:160px;
	float:left;
	margin-top:10px;
	margin-right:15px;
}

	.cornerStepCapBox dl.calum-3 span{
		display:block;
		font-size:100%;
	}
	.cornerStepCapBox dl.calum-3 dt{
		margin-bottom:10px;
		line-height:1.2;
	}
	
	.cornerStepCapBox dl.calum-3 dd{
		margin-bottom:0;
	}