@charset "utf-8";

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

サブ助

-------------------------------------------------------------------------------- */
/********** 画像 **********/
body.page-template-pagesub-suke-php #main .img-sub-suke {
	padding: 0 0 50px;
}

/********** デザインテンプレート例 **********/
body.page-template-pagesub-suke-php #main h1 {
	margin: 0 0 30px;
	padding: 5px;
	text-align: center;
	font-size: 30px;
	color: #fff;
	background: #305496;
}
body.page-template-pagesub-suke-php #main .design-template-list {
	padding: 0 30px;
}
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-wrapper {
	display: flex;
	justify-content: space-between;
	
	width: 100%;
}
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box {
	width: 45%;
}
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box ul li {
	display: flex;
}

/**********
左右の数を増やしたり減らしたりする際は、左右にボックスを配置 & 交互をに色をつけていますので、
白が続いたり・グレーが続かないように適宜変更してください。
※スマートフォン側も確認！
nth-of-type(odd)→奇数
nth-of-type(even)→偶数
**********/
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box:nth-of-type(1) ul li:nth-of-type(odd) {
	background: #d9d9d9;
}
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box:nth-of-type(2) ul li:nth-of-type(odd) {
	background: #d9d9d9;
}

/* カテゴリー */
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box ul li .sub-suke-cat {
	width: 70%;
	padding: 15px 5px;
	font-weight: bold;
	
	box-sizing: border-box;
}

/* プラン名 */
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box ul li .plan-name {
	width: 50%;
	padding: 0 5px;
	
	box-sizing: border-box;
}
body.page-template-pagesub-suke-php #main .design-template-list .design-template-list-box ul li .plan-name a {
	display: block;
	padding: 15px 0;
	text-decoration: underline;
	color: #000;
}