@charset "UTF-8";

/* ▼1024px以上の場合に適用
--------------------------------------------------------------------- */
@media only screen and (min-width: 1024px) {

	#Sp_Navi {
		display: none;
	}

	#Sp_Cover {
		display: none;
	}

	#Sp_Logo {
		display: none;
	}

}

/* ▼1024px以下の場合に適用
---------------------------------------------------------------------- */
@media only screen and (max-width: 1023px) {

	header {
		display: none;
	}

	#Cover {
		display: none;
	}

	#Sp_Cover {
		width: 100%;
	}

	#Sp_Logo {
	width: 100px;
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 1000000;
	}

}

/* ▼800px以上の場合に適用
--------------------------------------------------------------------- */
@media only screen and (min-width: 801px) {

	.Sp_Cont {
		display: none;
	}

}

/* ▼800px以下の場合に適用（Kindle以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 800px) {

	body {
		font-size: 12px;
	}

	header {
		display: none;
	}

	#Cover {
		display: none;
	}

	#back-top a {
		display: none;
	}

	#Sitepath {
		display: none;
	}

	.Sp_None {
		display: none;
	}

	p {
		margin-top:4px;
	}

	/*---見だし---*/
	.Tit01 {
		font-size: 16px;
		color: #00a18f;
		text-align: center;
		width: 100%;
		padding: 4px 0px 2px 0px;
		background: #a3d6ce;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	.Tit01_fz48 {
		font-size: 14px;
		color: #00a18f;
		text-align: center;
		line-height: 1.2em;
		width: 100%;
		padding: 6px 0px;
		background: #a3d6ce;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	/*---高さ調整用---*/
	.Tit01_mt20 {
		margin-top: 16px;
		font-size: 16px;
		color: #00a18f;
		text-align: center;
		width: 100%;
		padding: 4px 0px 2px 0px;
		background: #a3d6ce;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	.Tit01_fz48_mt20 {
		margin-top: 16px;
		font-size: 14px;
		color: #00a18f;
		text-align: center;
		line-height: 1.2em;
		width: 100%;
		padding: 6px 0px;
		background: #a3d6ce;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	.Atten {
		width: 100%;
		height: 21px;
		font-size:16px;
		color: #e60012;
		background: url(../img/ico_atten.png) no-repeat left bottom / 20px 20px;
		padding:0px 0px 0px 24px;
		margin: 0 auto;
	}

	.Atten_02 {
		width: 100%;
		height: 21px;
		font-size:16px;
		color: #e60012;
		background: url(../img/ico_atten.png) no-repeat left bottom / 20px 20px;
		padding:0px 0px 0px 24px;
		margin: 0 auto;
	}

	.Atten_03 {
		width: 100%;
		height: 21px;
		font-size:20px;
		color: #e60012;
		/*background: url(../img/ico_atten.png) no-repeat left bottom / 20px 20px;
		padding:0px 0px 0px 24px;*/
		margin: 0 auto;
	}

	.Arrow {
		height: 18px;
		font-size:12px;
		background: url(../img/ico_arrow.png) no-repeat left center / 16px 16px;
		padding:0px 0px 0px 20px;
		text-decoration: underline;
	}

	.Arrow_02 a {
		height: 18px;
		font-size:12px;
		color: #d71518;
		background: url(../img/ico_arrow.png) no-repeat left center / 16px 16px;
		padding:2px 0px 0px 20px;
		text-decoration: underline;
	}

	.Arrow_02 a:hover {
		height: 18px;
		font-size:12px;
		color: #d71518;
		background: url(../img/ico_arrow.png) no-repeat left center / 16px 16px;
		padding:2px 0px 0px 20px;
		text-decoration: none;
	}

	/*---背景色---*/
	.Bg_White {
		background: #fff;
		padding:20px 0;
	}

	.Bg_White_02 {
		background: #fff;
		padding:10px 0 20px;
	}

	.Bg_Blue {
		background: #a3d6ce;
		padding:0px 0 10px;
	}

	.Img_Bg_White {
		background-color: #fff;
		padding: 6px;
	}

	/*---お知らせ---*/
	.Topic {
		width: 100%;
		margin:0 auto;
		padding:10px 5px;
		width: 100%;
		border-bottom:1px dotted #000;
		font-size: 12px;
	}

	.Topic_Link {
		width: 100%;
		margin:0 auto;
		padding:10px 5px;
		width: 100%;
		border-bottom:1px dotted #000;
	}

	/*---アイコン（カテゴリー別）---*/
	.Category_icon_01 {
		font-size:10px;
		text-align: center;
		background: #ec6f6f;
		color: #fff;
		padding: 1px 4px 0;
		margin-right:4px;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
	}

	.Category_icon_02 {
		font-size:10px;
		text-align: center;
		background: #49bfe0;
		color: #fff;
		padding: 1px 4px 0;
		margin-right:4px;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
	}

	.Category_icon_03 {
		font-size:10px;
		text-align: center;
		background: #6dbd58;
		color: #fff;
		padding: 1px 4px 0;
		margin-right:4px;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
	}

	.Category_icon_04 {
		font-size:10px;
		text-align: center;
		background: #f3b45d;
		color: #fff;
		padding: 1px 4px 0;
		margin-right:4px;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
	}

	.Category_icon_05 {
		font-size:10px;
		text-align: center;
		background: #b278d4;
		color: #fff;
		padding: 1px 4px 0;
		margin-right:4px;
		border-radius: 8px;
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
	}

	/*---SNS---*/
	.Sns {
		width: 36px;
	}

	/*---ボックス hover---*/
	.Box_hover {
		width: 100%;
		margin: 0px;
		padding: 6px;
		background-color: #FFF;
		border-radius: 5px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-transition: all .3s;
		transition: all 0.5s;
	}

	/*---ボタン（白色）---*/
	.button_white {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 30px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #fff;
		background-color: #fff;
		color: #000;
		line-height: 30px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

	/*---ボタン（白色2）---*/
	.button_white_02 {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 30px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #fff;
		background-color: #fff;
		color: #ca353b;
		line-height: 30px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

	/*---ボタン（赤）---*/
	.button_red {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 22px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #ca353b;
		background-color: #ca353b;
		color: #FFF;
		line-height: 22px;
		overflow: hidden;
		font-size: 10px;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	/*---ボタン（黄色）---*/
	.button_yellow {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 22px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #ffd800;
		background-color: #ffd800;
		color: #FFF;
		line-height: 22px;
		overflow: hidden;
		font-size: 10px;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	/*---ボタン（オレンジ）---*/
	.button_orange {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 22px;
		text-align: center;
		text-decoration: none;
		background-color: #FFF;
		border: 1px solid #ff9900;
		color: #ff9900;
		line-height: 22px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 30px;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
	}

	/*---ボタン（BeE申込み）---*/
	.button_bee a {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 22px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #c1435b;
		background-color: #c1435b;
		color: #FFF;
		line-height: 22px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
	}

	/*---ボタン（Brume申込み）---*/
	.button_brume a {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 22px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #3678da;
		background-color: #3678da;
		color: #FFF;
		line-height: 22px;
		overflow: hidden;
		font-size: 12px;
		margin-top:4px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
	}

	/*---ボタン（お問い合わせ）---*/
	.button_contact {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 30px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #fff;
		background-color: #1853B5;
		color: #fff;
		line-height: 30px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

	/*---ボタン（災害情報）---*/
	.button_disaster {
		display: inline-block;
		position: relative;
		z-index: 2;
		width: 100%;
		height: 30px;
		text-align: center;
		text-decoration: none;
		border: 1px solid #fff;
		background-color: #E2041B;
		color: #fff;
		line-height: 30px;
		overflow: hidden;
		font-size: 12px;
		border-radius: 6px;
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
	}

	/*---Footer---*/
	footer {
		padding: 10px 0px 20px 0px;
	}

	#Foooter_Logo {
		width: 140px;
		display: block;
		margin:0 auto;
	}

	/* ハンバーガーメニュー */
	.mean-container .mean-bar {
		font-size: 16px;
	}

	/* !Border -------------------------------------------------------------- */
	.bcGray { border: 1px solid #ccc; background: #fff;}
	.bcRed { border: 1px solid #ca353b; background: #fff;}

	/* !Fonts -------------------------------------------------------------- */
	.fz18 { font-size: 12px;}
	.fz20 { font-size: 12px;}
	.fz24 { font-size: 12px;}
	.fz36 { font-size: 14px;}
	.fz52 { font-size: 16px;}

	/* !Margin
	---------------------------------------------------------------------- */
	.mb10 { margin-bottom:10px !important;}
	.mt10 { margin-top:10px !important;}
	.mt20 { margin-top:10px !important;}
	.mt30 { margin-top:10px !important;}
	.mt40 { margin-top:20px !important;}
	.mt50 { margin-top:20px !important;}
	.mt60 { margin-top:20px !important;}
	.mt80 { margin-top:20px !important;}
	.sp_mt-16 { margin-top:-16px !important;}

	/* !padding ------------------------------------------------------------------ */
	.plr4 { padding: 1px 4px 0 4px !important;}
	.p10 { padding:10px !important;}
	.p40 { padding:20px !important;}
	.pb40 { padding-bottom:20px !important;}
	.pb80 { padding-bottom:20px !important;}
	.ptb80 { padding:20px 0 40px !important;}
	.pt40b80 { padding:20px 0 40px !important;}

	/* !Width ------------------------------------------------------------------- */
	.w30per { width: 100% !important;}
	.w50per { width: 100% !important;}
	.w65per { width: 100% !important;}
	.w70per { width: 100% !important;}
	.w80per { width: 100% !important;}
	.w94per { width: 100% !important;}

/* !Inline Align ------------------------------------------------------------ */
	.taC_Sp { text-align: left !important;}

}

/* ▼768px以下の場合に適用（iPad portrait以下）
---------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {

	.ptb80 { padding:20px 0 !important;}

}