@charset "UTF-8";

/********************************************************************************
 * 共通設定(マージン、パディング、フォント等に関する設定)
 ********************************************************************************/
/***********************************************************
 * 全般的な設定
 ***********************************************************/
* {
	-webkit-box-sizing:	border-box;
	-moz-box-sizing:	border-box;
	box-sizing:			border-box;
}
*::before,
*::after {
	-webkit-box-sizing:	border-box;
	-moz-box-sizing:	border-box;
	box-sizing:			border-box;
}
/***********************************************************
 * コンテナ
 ***********************************************************/
.container {
	margin-right:		auto;
	margin-left:		auto;
	padding-top:		15px;
	padding-left:		15px;
	padding-right:		15px;
}

/***********************************************************
 * マージン
 ***********************************************************/
/***** 下 *****/
.mg-bottom-05 {
	margin-bottom:		5px !important;
}
.mg-bottom-10 {
	margin-bottom:		10px !important;
}
.mg-bottom-20 {
	margin-bottom:		20px !important;
}
.mg-bottom-30 {
	margin-bottom:		30px !important;
}
.mg-bottom-40 {
	margin-bottom:		40px !important;
}
.mg-bottom-50 {
	margin-bottom:		50px !important;
}
.mg-bottom-60 {
	margin-bottom:		60px !important;
}

/***********************************************************
 * パディング
 ***********************************************************/
/***** 上 *****/
.pad-top-10 {
	padding-top:		10px !important;
}
.pad-top-20 {
	padding-top:		20px !important;
}
.pad-top-30 {
	padding-top:		30px !important;
}
.pad-top-40 {
	padding-top:		40px !important;
}
.pad-top-50 {
	padding-top:		50px !important;
}
.pad-top-60 {
	padding-top:		60px !important;
}
.pad-top-70 {
	padding-top:		70px !important;
}

/***** 左 *****/
.pad-left-10 {
	padding-left:		10px !important;
}
.pad-left-20 {
	padding-left:		20px !important;
}
.pad-left-30 {
	padding-left:		30px !important;
}
.pad-left-40 {
	padding-left:		40px !important;
}
.pad-left-50 {
	padding-left:		50px !important;
}
.pad-left-60 {
	padding-left:		60px !important;
}
.pad-left-70 {
	padding-left:		70px !important;
}

/***** 右 *****/
.pad-right-10 {
	padding-right:		10px !important;
}
.pad-right-20 {
	padding-right:		20px !important;
}
.pad-right-30 {
	padding-right:		30px !important;
}
.pad-right-40 {
	padding-right:		40px !important;
}
.pad-right-50 {
	padding-right:		50px !important;
}
.pad-right-60 {
	padding-right:		60px !important;
}
.pad-right-70 {
	padding-right:		70px !important;
}

/***** 下 *****/
.pad-bottom-10 {
	padding-bottom:		10px !important;
}
.pad-bottom-20 {
	padding-bottom:		20px !important;
}
.pad-bottom-30 {
	padding-bottom:		30px !important;
}
.pad-bottom-40 {
	padding-bottom:		40px !important;
}
.pad-bottom-50 {
	padding-bottom:		50px !important;
}
.pad-bottom-60 {
	padding-bottom:		60px !important;
}
.pad-bottom-70 {
	padding-bottom:		70px !important;
}

/***********************************************************
 * フォント
 ***********************************************************/
/***** カラー *****/
.fo-white {
	color:				#fff !important;
}
.fo-grey {
	color:				#666 !important;
}
.fo-red {
	color:				#de574a !important;
}
.fo-blue {
	color:				#0b25d3 !important;
}
.fo-green {
	color:				#34ac8a !important;
}

/***** サイズ *****/
.fo-16 {
	font-size:			16px !important;
}
.fo-18 {
	font-size:			18px !important;
}
.fo-20 {
	font-size:			20px !important;
}
.fo-24 {
	font-size:			24px !important;
}
.fo-28 {
	font-size:			28px !important;
}

/***** タイプ *****/
.fo-bold {
	font-weight:		bold;
}
/***********************************************************
 * 背景
 ***********************************************************/
/***** カラー *****/
.base-gray {
	background:			#f3f3f3 !important;
}

/***********************************************************
 * 文字位置
 ***********************************************************/
/***** 水平方向 *****/
.text-center {
	text-align:			center !important;
}
.text-right {
	text-align:			right !important;
}
.text-left {
	text-align:			left !important;
}
.text-lc {
	text-align:			left !important;
}
.text-rc {
	text-align:			right !important;
}
.text-cl {
	text-align:			center !important;
}
.text-rl {
	text-align:			right !important;
}

/***** 垂直方向 *****/
.text-top {
	vertical-align:		top !important;
}
.text-bottom {
	vertical-align:		bottom !important;
}

@media only screen and (max-width:800px){
	.text-lc {
		text-align:		center !important;
	}
	.text-rc {
		text-align:		center !important;
	}
	.text-cl {
		text-align:		left !important;
	}
	.text-rl {
		text-align:		left !important;
	}
}

/***********************************************************
 * カラム(列)設定
 ***********************************************************/
.col_wrap {
	margin-left:		-15px;
	margin-right:		-15px;
}
.cols-1, .coll-1,
.cols-2, .coll-2,
.cols-3, .coll-3,
.cols-4, .coll-4,
.cols-5, .coll-5,
.cols-6, .coll-6,
.cols-7, .coll-7,
.cols-8, .coll-8,
.cols-9, .coll-9,
.cols-10, .coll-10,
.cols-11, .coll-11,
.cols-12, .coll-12 {
	position:			relative;
	min-height:			1px;
	padding-left:		15px;
	padding-right:		15px;
}
.cols-1,
.cols-2,
.cols-3,
.cols-4,
.cols-5,
.cols-6,
.cols-7,
.cols-8,
.cols-9,
.cols-10,
.cols-11,
.cols-12 {
	float:				left;
}
.cols-12 {
	width:				100%;
}
.cols-11 {
	width:				91.66666667%;
}
.cols-10 {
	width:				83.33333333%;
}
.cols-9 {
	width:				75%;
}
.cols-8 {
	width:				66.66666667%;
}
.cols-7 {
	width:				58.33333333%;
}
.cols-6 {
	width:				50%;
}
.cols-5 {
	width:				41.66666667%;
}
.cols-4 {
	width:				33.33333333%;
}
.cols-3 {
	width:				25%;
}
.cols-2 {
	width:				16.66666667%;
}
.cols-1 {
	width:				8.33333333%;
}
.cols-pull-12 {
	right:				100%;
}
.cols-pull-11 {
	right:				91.66666667%;
}
.cols-pull-10 {
	right:				83.33333333%;
}
.cols-pull-9 {
	right:				75%;
}
.cols-pull-8 {
	right:				66.66666667%;
}
.cols-pull-7 {
	right:				58.33333333%;
}
.cols-pull-6 {
	right:				50%;
}
.cols-pull-5 {
	right:				41.66666667%;
}
.cols-pull-4 {
	right:				33.33333333%;
}
.cols-pull-3 {
	right:				25%;
}
.cols-pull-2 {
	right:				16.66666667%;
}
.cols-pull-1 {
	right:				8.33333333%;
}
.cols-pull-0 {
	right:				auto;
}
.cols-push-12 {
	left:				100%;
}
.cols-push-11 {
	left:				91.66666667%;
}
.cols-push-10 {
	left:				83.33333333%;
}
.cols-push-9 {
	left:				75%;
}
.cols-push-8 {
	left:				66.66666667%;
}
.cols-push-7 {
	left:				58.33333333%;
}
.cols-push-6 {
	left:				50%;
}
.cols-push-5 {
	left:				41.66666667%;
}
.cols-push-4 {
	left:				33.33333333%;
}
.cols-push-3 {
	left:				25%;
}
.cols-push-2 {
	left:				16.66666667%;
}
.cols-push-1 {
	left:				8.33333333%;
}
.cols-push-0 {
	left:				auto;
}
.cols-offset-12 {
	margin-left:		100%;
}
.cols-offset-11 {
	margin-left:		91.66666667%;
}
.cols-offset-10 {
	margin-left:		83.33333333%;
}
.cols-offset-9 {
	margin-left:		75%;
}
.cols-offset-8 {
	margin-left:		66.66666667%;
}
.cols-offset-7 {
	margin-left:		58.33333333%;
}
.cols-offset-6 {
	margin-left:		50%;
}
.cols-offset-5 {
	margin-left:		41.66666667%;
}
.cols-offset-4 {
	margin-left:		33.33333333%;
}
.cols-offset-3 {
	margin-left:		25%;
}
.cols-offset-2 {
	margin-left:		16.66666667%;
}
.cols-offset-1 {
	margin-left:		8.33333333%;
}
.cols-offset-0 {
	margin-left:		0%;
}

/***********************************************************
 * 疑似要素
 ***********************************************************/
.clearfix::before,
.clearfix::after,
.container::before,
.container::after,
.col_wrap::before,
.col_wrap::after,
.pager::before,
.pager::after {
	content:			" ";
	display:			table;
}
.clearfix::after,
.container::after,
.col_wrap::after,
.pager::after  {
	clear:				both;
}
