@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 {
	width:					100%;
	margin-right:			auto;
	margin-left:			auto;
	padding:				15px;
}

/*******************************************************************************
 * 余白設定
 *******************************************************************************/
/*********************************************************************
 * Padding設定(内側の余白)
 *********************************************************************/
.pd-top-05 {
	padding-top:			5px !important;
}

/*******************************************************************************
 * 余白設定
 *******************************************************************************/
/*********************************************************************
 * 上
 *********************************************************************/
.mg-top-05 {
	margin-top:				5px !important;
}
.mg-top-10 {
	margin-top:				10px !important;
}
.mg-top-15 {
	margin-top:				15px !important;
}
.mg-top-20 {
	margin-top:				20px !important;
}
.mg-top-25 {
	margin-top:				25px !important;
}
.mg-top-30 {
	margin-top:				30px !important;
}
.mg-top-35 {
	margin-top:				35px !important;
}
.mg-top-40 {
	margin-top:				40px !important;
}
.mg-top-45 {
	margin-top:				45px !important;
}
.mg-top-50 {
	margin-top:				50px !important;
}
.mg-top-60 {
	margin-top:				60px !important;
}
.mg-top-70 {
	margin-top:				70px !important;
}
.mg-top-80 {
	margin-top:				80px !important;
}
.mg-top-90 {
	margin-top:				90px !important;
}
.mg-top-100 {
	margin-top:				100px !important;
}
.mg-top-200 {
	margin-top:				200px !important;
}
/*********************************************************************
 * 下
 *********************************************************************/
.mg-bottom-05 {
	margin-bottom:			5px !important;
}
.mg-bottom-10 {
	margin-bottom:			10px !important;
}
.mg-bottom-15 {
	margin-bottom:			15px !important;
}
.mg-bottom-20 {
	margin-bottom:			20px !important;
}
.mg-bottom-25 {
	margin-bottom:			25px !important;
}
.mg-bottom-30 {
	margin-bottom:			30px !important;
}
.mg-bottom-35 {
	margin-bottom:			35px !important;
}
.mg-bottom-40 {
	margin-bottom:			40px !important;
}
.mg-bottom-45 {
	margin-bottom:			45px !important;
}
.mg-bottom-50 {
	margin-bottom:			50px !important;
}
.mg-bottom-60 {
	margin-bottom:			60px !important;
}
.mg-bottom-70 {
	margin-bottom:			70px !important;
}
.mg-bottom-80 {
	margin-bottom:			80px !important;
}
.mg-bottom-90 {
	margin-bottom:			90px !important;
}
.mg-bottom-100 {
	margin-bottom:			100px !important;
}
/*********************************************************************
 * 右
 *********************************************************************/
.mg-right-05 {
	margin-right:			5px !important;
}
.mg-right-10 {
	margin-right:			10px !important;
}
.mg-right-15 {
	margin-right:			15px !important;
}
.mg-right-20 {
	margin-right:			20px !important;
}
.mg-right-25 {
	margin-right:			25px !important;
}
.mg-right-30 {
	margin-right:			30px !important;
}
/*********************************************************************
 * 左
 *********************************************************************/
.mg-left-05 {
	margin-left:			5px !important;
}
.mg-left-10 {
	margin-left:			10px !important;
}
.mg-left-15 {
	margin-left:			15px !important;
}
.mg-left-20 {
	margin-left:			20px !important;
}
.mg-left-25 {
	margin-left:			25px !important;
}
.mg-left-30 {
	margin-left:			30px !important;
}

@media only screen and (max-width: 800px){
}

/*******************************************************************************
 * フォント設定
 *******************************************************************************/
/*********************************************************************
 * カラー
 *********************************************************************/
.fo-white {
	color:				#ffffff !important;
}
.fo-black {
	color:				#000000 !important;
}
.fo-red {
	color:				#ea4f64 !important;
}
.fo-orange {
	color:				#e8881b !important;
}
.fo-blue {
	color:				#505bed !important;
}
.fo-green {
	color:				#2cba00 !important;
}

/*********************************************************************
 * サイズ
 *********************************************************************/
.fo-8 {
	font-size:			8px !important;
}
.fo-9 {
	font-size:			9px !important;
}
.fo-10 {
	font-size:			10px !important;
}
.fo-12 {
	font-size:			12px !important;
}
.fo-14 {
	font-size:			14px !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-36 {
	font-size:			36px !important;
}
.fo-48 {
	font-size:			48px !important;
}
@media only screen and (max-width: 800px) {
	.fo-24 {
		font-size:		20px !important;
	}
	.fo-36 {
		font-size:		26px !important;
	}
	.fo-48 {
		font-size:		26px !important;
	}
}
/*********************************************************************
 * フォントファミリー
 *********************************************************************/
.font-type-01 {
	 font-family:		"メイリオ", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
	 font-weight:		bold;
}
/*********************************************************************
 * 文字装飾
 *********************************************************************/
.fo-bold {
	font-weight:		bold;
}
/* 下線 */
.fo-uline {
	border-bottom:		solid 1px #000000;
}
.fo-uline-dash {
	border-bottom:		dash 1px #000000;
}
.fo-uline-dot {
	border-bottom:		dotted 1px #000000;
}
.fo-uline-double {
	border-bottom:		double 1px #000000;
}
.fo-uline-white {
	border-bottom:		solid 1px #ffffff;
}
/* 水色蛍光ペン風 */
.fo-maker-sky {
	background:			linear-gradient( transparent 50%, #a8eaff 50% );
}
/* 黄色蛍光ペン風 */
.fo-maker-sky {
	background:			linear-gradient( transparent 50%, yellow 50% );
}

/*******************************************************************************
 * 枠線
 *******************************************************************************/
.frame-border-black {
	border:		solid 1pt #e0e0e0 !important;
}

/*******************************************************************************
 * 背景カラー
 *******************************************************************************/
/***** 白, 黒, グレー系 *****/
.base-white {
	background:			#fff !important;
}
.base-gray {
	background:			#f3f3f3 !important;
}

/***** 赤系 *****/
.base-red {
	background:			#ed697c !important;
}
.base-akane {
	background:			#b7282e !important;
	color:				#fff;
}
.base-sakura {
	background:			#fdeff2 !important;
	color:				#ed697c;
}
.base-sakura2 {
	background:			#fccad5 !important;
}

/***** 青系 *****/
.base-blue {
	background:			#15bbde !important;
}
.base-sky {
	background:			rgba(21, 187, 222, .1) !important;
	color:				#15bbde !important;
}
.base-sky-bk {
	background:			rgba(21, 187, 222, .1) !important;
	color:				#000000 !important;
}
.base-sky2 {
	background:			#15bbde !important;
	color:				#fff !important;
}
.base-navy {
	background:			#1c305c !important;
	color:				#fff !important;
}

/***** 黄色系 *****/
.base-yellow {
	background:			#decd15 !important;
}
.base-yellow2 {
	background:			#fef263 !important;
	color:				#f08300 !important;
}
.base-orange {
	background:			rgba( 234, 155, 28 ) !important;
}
.base-orange2 {
	background:			rgba( 234, 155, 28, .2 ) !important;
	color:				rgba( 234, 155, 28 ) !important;
}
.base-tonoko {
	background:			#f4dda5 !important;
}
.base-tankou {
	background:			#f8e58c !important;
}

/***** 緑系 *****/
.base-green {
	background:			#2cba00 !important;
}
.base-lightgreen {
	background:			rgba(42, 194, 120, .2) !important;
    color:				#2cba00 !important;
}
.base-darkgreen {
	background:			#00885a !important;
	color:				#ffffff !important;
}
.base-wakana {
	background:			#d8e698 !important;
}
.base-moegi {
	background:			#aacf53 !important;
}
.base-btn-green {
	background:			#2ac278 !important;
}

/*******************************************************************************
 * テキスト装飾
 *******************************************************************************/
/*********************************************************************
 * 下線
 *********************************************************************/
.underline-red {
	text-decoration:				underline;
	text-decoration-color:			#1f2c5b;
}
.underline-yellow {
	background:			rgba( 0, 0, 0, 0 ) linear-gradient( transparent 60%, #d9cd0d 0% ) repeat scroll 0 0;
}
.underline-pink {
	background:			rgba( 0, 0, 0, 0 ) linear-gradient( transparent 60%, #f49890 0% ) repeat scroll 0 0;
}
.underline-sky {
	background:			rgba( 0, 0, 0, 0 ) linear-gradient( transparent 60%, #c2e3ee 0% ) repeat scroll 0 0;
}
.underline-white {
	text-decoration:				underline !important;
	text-decoration-color:			#fff !important;
}

/*********************************************************************
 * リンク
 *********************************************************************/
a.underline {
	text-decoration:	underline;
}
a.underline:hover {
	text-decoration:	none;
}

/*******************************************************************************
 * テキスト位置
 *******************************************************************************/
/*********************************************************************
 * 表示位置
 *********************************************************************/
.text-center {
	text-align:			center !important;
}
.text-right {
	text-align:			right !important;
}
.text-left {
	text-align:			left !important;
}
.text-top {
	vertical-align:		top !important;
}
.text-middle {
	vertical-align:		middle !important;
}
.text-lc {
	text-align:			left;
}
.text-rc {
	text-align:			right;
}
@media only screen and (max-width: 800px) {
	.text-lc {
		text-align:		center;
	}
	.text-rc {
		text-align:		center;
	}
}

/*******************************************************************************
 * 表示／ポジション設定
 *******************************************************************************/
.pos-rel {
	position:			relative !important;
}
/*消去*/
@media (max-width:	800px) {
	.no-disp-s {
		display:		none !important;
	}
}
@media (min-width:	801px) {
	.no-disp-l {
		display:		none !important;
	}
}

.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;
}

/*******************************************************************************
 * 非表示設定
 *******************************************************************************/
/* 横幅が一定以下の場合のみ非表示 */
@media (max-width: 800px) {
	.no-disp-s {
    	display:		none !important;
	}
}

/* 横幅が一定以上の場合のみ非表示 */
@media (min-width: 801px) {
	.no-disp-l {
    	display:		none !important;
	}
}

/*******************************************************************************
 * 横幅設定
 *******************************************************************************/
/*********************************************************************
 * ピクセル指定
 *********************************************************************/
.width-20{
	width:				20px !important;
}
.width-30{
	width:				30px !important;
}
.width-40{
	width:				40px !important;
}
.width-60{
	width:				60px !important;
}
.width-80{
	width:				80px !important;
}
.width-100{
	width:				100px !important;
}
.width-120{
	width:				120px !important;
}
.width-140{
	width:				140px !important;
}
.width-160{
	width:				160px !important;
}
.width-180{
	width:				180px !important;
}
.width-200{
	width:				200px !important;
}
.width-220{
	width:				220px !important;
}
.width-240{
	width:				240px !important;
}
.width-260{
	width:				260px !important;
}
.width-280{
	width:				280px !important;
}
.width-300{
	width:				300px !important;
}
.width-320{
	width:				320px !important;
}
.width-340{
	width:				340px !important;
}
.width-360{
	width:				360px !important;
}
.width-380{
	width:				380px !important;
}
.width-400{
	width:				400px !important;
}
.width-500{
	width:				500px !important;
}
.width-600{
	width:				600px !important;
}
.width-650{
	width:				650px !important;
}
.width-700{
	width:				700px !important;
}

/*********************************************************************
 * パーセント指定
 *********************************************************************/
.width-10per{
	width:				10% !important;
}
.width-12per{
	width:				12% !important;
}
.width-13per{
	width:				13% !important;
}
.width-15per{
	width:				15% !important;
}
.width-20per{
	width:				20% !important;
}
.width-25per{
	width:				25% !important;
}
.width-30per{
	width:				30% !important;
}
.width-35per{
	width:				35% !important;
}
.width-36per{
	width:				36.5% !important;
}
.width-40per{
	width:				40% !important;
}
.width-45per{
	width:				45% !important;
}
.width-50per{
	width:				50% !important;
}
.width-55per{
	width:				55% !important;
}
.width-60per{
	width:				60% !important;
}
.width-65per{
	width:				65% !important;
}
.width-70per{
	width:				70% !important;
}
.width-72per{
	width:				73% !important;
}
.width-75per{
	width:				75% !important;
}
.width-80per{
	width:				80% !important;
}
.width-85per{
	width:				85% !important;
}
.width-90per{
	width:				90% !important;
}
.width-95per{
	width:				95% !important;
}
.width-100per{
	width:				100% !important;
}

@media (max-width: 800px) {
	.width-10per{
		width:			100% !important;
	}
	.width-20per{
		width:			100% !important;
	}
	.width-30per{
		width:			100% !important;
	}
	.width-40per{
		width:			100% !important;
	}
	.width-50per{
		width:			100% !important;
	}
	.width-60per{
		width:			100% !important;
	}
	.width-70per{
		width:			100% !important;
	}
	.width-80per{
		width:			100% !important;
	}
	.width-90per{
		width:			100% !important;
	}
}

/*********************************************************************
 * 位置
 *********************************************************************/
.pos-basic{
	position:			relative;
}

.pos-right{
	position:			absolute;
	right:				10px;
}