@charset "UTF-8";

/*----------------------------------------
 * 基本設定
 *----------------------------------------*/
body {
	font-size:100%;
	line-height:1.8em;
	margin:0;
}

img{
/*
-webkit-backface-visibility: hidden;
*/
}

/* PC、スマートフォンでの表示・非表示 */
.pc {display:block;}
.mb {display:none;}

/* 白背景 */
.bg_white {background-color:white;}

/* パディング */
.padding5 {padding:5px;}
.padding10 {padding:10px;}
.padding15 {padding:15px;}
.padding20 {padding:20px;}
.padding30 {padding:30px;}

/* 角丸 */
.rad10 {	border-radius:10px;}
.rad15 {	border-radius:15px;}
.rad20 {	border-radius:20px;}
.rad50p { border-radius:50%;}

/* レイアウト幅 */
.all_width {
	width:100%;
	overflow:hidden;
}
.w100p {width:100%}
.w90p {width:90%}
.w80p {width:80%}
.w70p {width:70%}
.w60p {width:60%}
.w50p {width:50%}
.w43p {width:43%}
.w40p {width:40%}
.w33p {width:33%}
.w30p {width:30%}
.w25p {width:25%}
.w20p {width:20%}
.w16p {width:16%}
.w15p {width:15%}
.w13p {width:13%}
.w10p {width:10%}

.div_center {margin-left:auto;margin-right:auto;}

/* 文字サイス 16px基準 */
.f12 { font-size:0.75rem;}
.f14 { font-size:0.875rem;}
.f16 { font-size:1rem;}
.f18 { font-size:1.125rem;}
.f20 { font-size:1.25rem;}
.f22 { font-size:1.375rem;}
.f24 { font-size:1.5rem;}
.f28 { font-size:1.75rem;}
.f30 { font-size:1.88rem;}
.f32 { font-size:2rem;}
.f34 { font-size:2.13rem;}

/* 文字のウェイト */
.fw100 {font-weight:100;}
.fw300 {font-weight:300;}
.fw400 {font-weight:400;}
.fw500 {font-weight:500;}
.fw700 {font-weight:700;}

/* 文字色 */
.col_black {color:black;}
.col_white {color:white;}
.col_gray {color:#808080;}

/* 左寄せ、右寄せ、センタリング */
.align_left {text-align:left;}
.align_center {text-align:center;}
.align_right {text-align:right;}

.valign_middle { vertical-align:middle;}

/* 行の高さ */
.lh10{line-height:1em;}
.lh15{line-height:1.5em;}
.lh16{line-height:1.6em;}
.lh17{line-height:1.7em;}
.lh18{line-height:1.8em;}
.lh19{line-height:1.9em;}
.lh20{line-height:2.0em;}

/* コンテンツの幅（各コンテンツで指定） */
.outer_width {
/*（例）
	width:1000px;
	margin:0 auto;
*/
}

.std_width {
/*（例）
	width:960px;
	margin:0 auto;
*/
}

.std_harf_width {
/*（例）
	width:480px;
*/
}

/* 上マージン */
.std_margin_top0 { margin-top:0px;}
.std_margin_top_large { margin-top:100px;}
.std_margin_top { margin-top:80px;}
.std_margin_top2 { margin-top:40px;}
.std_margin_top3 { margin-top:20px;}
.std_margin_top4 { margin-top:10px;}

/* 下マージン */
.std_margin_bottom0 { margin-bottom:0px;}
.std_margin_bottom { margin-bottom:80px;}
.std_margin_bottom2 { margin-bottom:40px;}
.std_margin_bottom3 { margin-bottom:20px;}
.std_margin_bottom4 { margin-bottom:10px;}

/* 上パッディング */
.str_padding_top0 { padding-top:0;}
.std_padding_top_large { padding-top:100px;}
.std_padding_top { padding-top:80px;}
.std_padding_top2 { padding-top:40px;}
.std_padding_top3 { padding-top:20px;}
.std_padding_top4 { padding-top:10px;}

/* 下パディング */
.std_padding_bottom0 { padding-bottom:0;}
.std_padding_bottom { padding-bottom:80px;}
.std_padding_bottom2 { padding-bottom:40px;}
.std_padding_bottom3 { padding-bottom:20px;}
.std_padding_bottom4 { padding-bottom:10px;}

/* 左マージン */
.std_margin_left_1 {margin-left:1em;}
.std_margin_left_2 {margin-left:2em;}
.std_margin_left_3 {margin-left:3em;}

/* インデント */
.std_indent_1 {	margin-left:1em;text-indent:-1em;}
.std_indent_1_5 {	text-indent:-1.5em;	margin-left:1.5em;}
.std_indent_2 {	margin-left:2em;text-indent:-2em;}
.std_indent_3 {	margin-left:3em;text-indent:-3em;}

/* 2カラム */
.std_column2 {
	margin-left:auto;
	margin-right:auto;
}

.std_column2:after {
	content:"";
	display:block;
	clear:both;
}

.std_column2 .left{
	float:left;
	width:50%;
}

.std_column2 .right{
	float:right;
	width:50%;
}

.col2_2_98 .left {width:2%;}
.col2_2_98 .right {width:98%;}

.col2_46_46 .left {width:46%;}
.col2_46_46 .right {width:46%;}

.col2_48_48 .left {width:48%;}
.col2_48_48 .right {width:48%;}

.col2_49_49 .left {width:49%;}
.col2_49_49 .right {width:49%;}

.col2_50_50 .left {width:50%;}
.col2_50_50 .right {width:50%;}

.col2_16_80 .left {width:16%;}
.col2_16_80 .right {width:80%;}

.col2_25_74 .left {width:25%;}
.col2_25_74 .right {width:74%;}

.col2_26_70 .left {width:26%;}
.col2_26_70 .right {width:70%;}

.col2_26_72 .left {width:26%;}
.col2_26_72 .right {width:72%;}

.col2_30_66 .left {width:30%;}
.col2_30_66 .right {width:66%;}

.col2_36_60 .left {width:36%;}
.col2_36_60 .right {width:60%;}

.col2_40_56 .left {width:40%;}
.col2_40_56 .right {width:56%;}

.col2_42_54 .left {width:42%;}
.col2_42_54 .right {width:54%;}

.col2_50_46 .left {width:50%;}
.col2_50_46 .right {width:46%;}

.col2_54_42 .left {width:54%;}
.col2_54_42 .right {width:42%;}

.col2_56_40 .left {width:56%;}
.col2_56_40 .right {width:40%;}

.col2_60_36 .left {width:60%;}
.col2_60_36 .right {width:36%;}

.col2_70_26 .left {width:70%;}
.col2_70_26 .right {width:26%;}

.col2_72_27 .left {width:72%;}
.col2_72_27 .right {width:27%;}

.col2_75_22 .left {width:75%;}
.col2_75_22 .right {width:22%;}

.col2_80_16 .left {width:80%;}
.col2_80_16 .right {width:16%;}

/* 3カラム */
.std_column3{
}

.std_column3:after {
	content:"";
	clear:both;
	display:block;
}

.std_column3 .column {
	width:32%;
	margin-right:1.5%;
	float:left;
}

/* 4カラム */
.std_column4 {
}

.std_column4:after {
	content:"";
	clear:both;
	display:block;
}

.std_column4 .column {
	width:24%;
	margin-right:1%;
	float:left;
}

/* 5カラム */
.std_column5 {
}

.std_column5:after {
	content:"";
	clear:both;
	display:block;
}

.std_column5 .column {
	width:19%;
	margin-right:1%;
	float:left;
}

/* 右端カラムのマージンをなくす */
.std_column3 .column:nth-child(3),
.std_column4 .column:nth-child(4),
.std_column5 .column:nth-child(5) {
	margin-right:0;
}

/* カラムの中のPはマージン0 */
.std_column1 p,
.std_column2 p,
.std_column3 p,
.std_column4 p,
.std_column5 p {
	margin:0;
}

/* 主に画像のサイズ調整 */
.std_w100_hauto { width:100%;height:auto;}
.std_w100_hauto.block { display:block;}
.std_w50_hauto { width:50%;height:auto;}
.std_image_border {border:1px solid #ccc;}

/* 背景画像を領域内に表示 */
.std_box {
	text-indent:110%;
	overflow:hidden;
	display:block;
	white-space:nowrap;
	width:100%;
	height:100%;
}

/* テキストを表示領域外に配置 */
.std_text_bg {
	text-indent:-100%;
	overflow:hidden;
	background-size:cover;
}

/* 画像を背景にしてposition:absoluteで使う場合 */
.ab_image {
	position:absolute;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:left top;
	text-indent:100%;
	overflow:hidden;
	white-space:nowrap;
}

/* ページの先頭へ */
.totop {
	position: fixed;
	width: 80px;
	height: 80px;
	bottom: -200px;
	right: 50px;
	z-index: 100;
}

/* clearfix */
.clearfix{ overflow:hidden /* DW対策 */ }
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */



@media screen and (max-width: 900px) {

	/* 共通 */

	body {
		font-size:0.85em;
	}
	
	.pc {
		display:none;
	}

	.mb {
		display:block;
	}

	/* SNSボタンエリア */
	body div.sns-area {
		width:325px;
		height:90px;
		border:1px solid #ccc;
		border-bottom:none;
		text-align:center;
		position:fixed;
		z-index:1000;
		top:auto;
		bottom:0 !important;
		left:50%;
		margin-left:-160px;
		padding:2px;
		background-color:white;
	}

	body div.sns-area a img{
		width:50px;
		height:50px;
	}
	
	div.sns-area a {
		display:block;
		float:left;
		margin:0 2px;
	}
	
/*----------------------------------------
 * 共通
 *----------------------------------------*/

.outer_width {
	width:100%;
}

.std_width {
	width:95%;
}

.std_harf_width {
	width:100%;
}

.padding5 {padding:5px;}
.padding10 {padding:5px;}
.padding15 {padding:10px;}
.padding20 {padding:10px;}
.padding30 {padding:10px;}

.rad10 {	border-radius:5px;}
.rad15 {	border-radius:5px;}
.rad20 {	border-radius:10px;}
.rad50p { border-radius:50%;}

.f12 { font-size:0.75rem;}
.f14 { font-size:0.875rem;}
.f16 { font-size:1rem;}
.f20 { font-size:1.1rem;}
.f22 { font-size:1.1rem;}
.f24 { font-size:1.1rem;}
.f28 { font-size:1.2rem;}
.f30 { font-size:1.3rem;}
.f32 { font-size:1.3rem;}
.f34 { font-size:1.3rem;}

.w10p {width:10%; margin-left:auto;margin-right:auto;}
.w20p {width:20%; margin-left:auto;margin-right:auto;}
.w25p {width:25%; margin-left:auto;margin-right:auto;}
.w30p {width:30%; margin-left:auto;margin-right:auto;}
.w40p {width:40%; margin-left:auto;margin-right:auto;}
.w33p {width:33%; margin-left:auto;margin-right:auto;}
/*
.w50p {width:70%; margin-left:auto;margin-right:auto;}
*/
.w50p {width:50%; margin-left:auto;margin-right:auto;}
.w60p {width:90%; margin-left:auto;margin-right:auto;}
.w70p {width:90%; margin-left:auto;margin-right:auto;}
.w80p {width:90%; margin-left:auto;margin-right:auto;}
.w90p {width:90%; margin-left:auto;margin-right:auto;}

.mb_w30p { width:30%;}
.mb_w40p { width:40%;}
.mb_w50p { width:50%;}
.mb_w60p { width:60%;}
.mb_w70p { width:70%;}
.mb_w80p { width:80%;}
.mb_w90p { width:90%;}

.mb_div_center {display:block;margin-left:auto;margin-right:auto;}

.no_top_margin { margin-top:0;}
.std_margin_top0 { margin-top:0px;}
.std_margin_top_large { margin-top:50px;}
.std_margin_top { margin-top:40px;}
.std_margin_top2 { margin-top:20px;}
.std_margin_top3 { margin-top:10px;}
.std_margin_top4 { margin-top:5px;}

.std_margin_bottom0 { margin-bottom:0px;}
.std_margin_bottom { margin-bottom:40px;}
.std_margin_bottom2 { margin-bottom:20px;}
.std_margin_bottom3 { margin-bottom:10px;}
.std_margin_bottom4 { margin-bottom:5px;}

.std_padding_top_large { padding-top:50px;}
.std_padding_top { padding-top:40px;}
.std_padding_top2 { padding-top:20px;}
.std_padding_top3 { padding-top:10px;}
.std_padding_top4 { padding-top:5px;}

.std_padding_bottom { padding-bottom:40px;}
.std_padding_bottom2 { padding-bottom:20px;}
.std_padding_bottom3 { padding-bottom:10px;}
.std_padding_bottom4 { padding-bottom:15x;}

.std_column2 .left,
.std_column2 .right {
	width:100%;
	float:none;
	margin-bottom:15px;
}

.std_column2.mb_break {
}

.std_column2.mb_break .left,
.std_column2.mb_break .right {
	width:100%;
	float:none;
	margin-bottom:15px;
}

.std_column2.mb_no_break .left {
	float:left;
}

.std_column2.mb_no_break .right {
	float:right;
}

.std_column2.mb_no_break.col2_66_30 .left { width:66%;}
.std_column2.mb_no_break.col2_66_30 .right { width:30%;}

.std_column2.mb_no_break.col2_48_48 .left { width:48%;}
.std_column2.mb_no_break.col2_48_48 .right { width:48%;}

.std_column2.mb_no_break.col2_49_49 .left { width:49%;}
.std_column2.mb_no_break.col2_49_49 .right { width:49%;}

.std_column2.mb_no_break.col2_50_50 .left { width:50%;}
.std_column2.mb_no_break.col2_50_50 .right { width:50%;}

.std_column2.mb_no_break.col2_36_60 .left { width:36%;}
.std_column2.mb_no_break.col2_36_60 .right { width:60%;}

.std_column2.mb_no_break.col2_30_66 .left { width:30%;}
.std_column2.mb_no_break.col2_30_66 .right { width:66%;}

.std_column2.mb_no_break.col2_26_70 .left { width:26%;}
.std_column2.mb_no_break.col2_26_70 .right { width:70%;}

.std_column2.mb_no_break.col2_16_80 .left { width:16%;}
.std_column2.mb_no_break.col2_16_80 .right { width:80%;}

.std_column3 {}

.std_column3 .column {
	width:100%;
	float:none;
	margin-bottom:10px;
}

.std_column3.mb_no_break .column {
	width:31.6%;
	margin-right:2.5%;
	float:left;
}

.std_column4 {}

.std_column4 .column {
	width:100%;
	float:none;
	margin-bottom:10px;
}

.std_column4.mb_2col .column {
	width:48%;
	float:left;
	margin-right:4%;
	margin-bottom:10px;
}

.std_column4.mb_2col .column:nth-child(2n) {
	margin-right:0;
}

.std_column4.mb_2col .column:nth-child(2n+1) {
	clear:left;
}

.std_column3.mb_no_break .column:nth-child(3),
.std_column4.mb_no_break .column:nth-child(4),
.std_column5.mb_no_break .column:nth-child(5) {
	margin-right:0;
}

}