@charset "utf-8";
/* **************************************************

CSS Information
File Name : base.css
Style Info: サイト共通のスタイル指定
Date: 2014-11-24
Update: 2015-03-24

************************************************** */
/* --------------------------------------------------
	Basic Setting
-------------------------------------------------- */
html {
	font-size: 62.5%; /* font-size: 10px相当*/
}

body {
	background-color: #fff;
	color: #333;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	line-height: 1.5;
	text-align: center;
	overflow: scroll-y; /* for Firefox */
	-webkit-text-size-adjust: 100%; /* for SmartPhone */
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

/*	Link Settings
-------------------------------------------------- */
a {
	color: #004da0;
	text-decoration: underline;
}

a:link {
	
}

a:visited {
	
}

a:focus {
	
}

a:hover {
	color: #7d9bfa;
	text-decoration: underline !important;
}

a:active {
	
}

/*	汎用Class
-------------------------------------------------- */
/* Clearfix */
.cf {
}

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

.inner {
	max-width: 1000px;
	margin: 0 auto;
}

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

.section,
.block {
}

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

.imgL,
.fl,
.alignleft {
	float: left;
}

.imgR,
.fr,
.alignright {
	float: right;
}

.al {
	text-align: left !important;
}

.ac {
	text-align: center !important;
}

.ar {
	text-align: right !important;
}

.btn {
	margin-bottom: 0 !important;
	text-align: center;
}

.red{
	color:#ed0000;
}

.blue{
	color:#5f7be0;
}

.green{
	color:#19af76;
}

.gray{
	color:#999999;
}

.error_msg{
	border:solid 1px #ed0000;
	padding:0px 15px;
	color:#ed0000;
}


/*---------------------------------------------------
	#page - ページコンテナ
-------------------------------------------------- */
#page {
	text-align: left;
}

/*---------------------------------------------------
	#top - トップ
-------------------------------------------------- */
#top {
	padding: 5px 0;
	background-color: #333;
}

#top:after {
	content: "";
	display: block;
	clear: both;
}

#top #tagline {
	float: left;
	width: 40%; /* 500px/1000px */
	padding-top: 5px;
	color: #fff;
	font-size: 1.2em;
}


/*	#utilityBlock - ユーティリティナビ
-------------------------------------------------- */
#top #utilityBlock {
	float: right;
	width: 70%; /* 500px/1000px */
}

	/*	#fontNavi - フォントナビゲーション
	-------------------------------------------------- */
	#top #utilityBlock #fontNavi {
		float: right;
		width: 20%; /* 100px/600px */
		margin-left: 2.5%;
	}
	
	#top #utilityBlock #fontNavi li {
		display: inline-block;
		width: 30%; /* 30px/100px */
		height: 28px;
		margin-left: 5%; /* 5px/100px */
		font-size: 1.5em;
		font-weight: bold;
		line-height: 28px;
		text-align: center;
	}
	
	#top #utilityBlock #fontNavi li:first-child {
		margin-left: 0;
	}
	
	#top #utilityBlock #fontNavi li a {
		display: block;
		background-color: #666;
		border-radius: 3px;
		color: #fff;
		text-decoration: none;
	}

	#top #utilityBlock #fontNavi li a:hover {
		background-color: #5a7de3;
	}
	
	#top #utilityBlock #fontNavi li .textresizer-active {
		background-color: #5a7de3;
	}
	
	.fontSmall {
		font-size: 100%;
	}
	
	.fontMedium {
		font-size: 110%;
	}

	.fontLarge {
		font-size: 120%;
	}
	
	/*	#topNavi - トップナビゲーション
	-------------------------------------------------- */
	#top #utilityBlock #topNavi {
		padding-top: 5px;
		color: #fff;
		font-size: 1.2em;
		text-align: right;
		overflow: hidden;
	}
	
	#top #utilityBlock #topNavi a {
		color: #fff;
		text-decoration: none;
	}

/*----------------------------------------------------
	#header - ヘッダー
----------------------------------------------------*/
#header {
	position: relative;
	height: 100px;
	padding: 10px 0;
}

#header:after {
	content: "";
	display: block;
	clear: both;
}
	
	/*	#headerBlock - ヘッダーブロック
	----------------------------------------------------*/
	#header #headerBlock {
		float: right;
		width: 310px; /* 310px/1000px */
	}
	
		/*	#headerNavi - ヘッダーナビゲーション
		----------------------------------------------------*/
		#header #headerBlock #headerNavi {
			margin-top: 5px;
		}
		
		#header #headerBlock #headerNavi:after {
			content: "";
			display: block;
			clear: both;
		}
		
		#header #headerBlock #headerNavi li {
			display: inilne;
			float: right;
			width: 150px; /* 150px/310px */
			border-radius: 6px;
		}
		
		#header #headerBlock #headerNavi li a {
			display: block;
			height: 40px;
			line-height: 40px;
			color: #333;
			font-size: 1.2em;
			font-weight: bold;
			text-align: center;
			text-decoration: none;
		}
		
		/*	.contact - お問い合わせ
		----------------------------------------------------*/		
		#header #headerBlock #headerNavi .contact {
			margin-left: 10px; /* 10px/310px */
			background-color: #f00;
		}
		
		#header #headerBlock #headerNavi .contact a {
			color: #fff;
		}
		
		#header #headerBlock #headerNavi .contact a span {
			display: inline-block;
			margin-top: -5px;
			padding-top: 5px;
			padding-left: 35px;
			background: url(../tmpl-img/ico_header_contact01.png) no-repeat left top;
		}
		
		/*	.post - 投稿募集
		----------------------------------------------------*/		
		#header #headerBlock #headerNavi .post {
			background-color: #ffc800;
		}
		
		#header #headerBlock #headerNavi .post a span {
			display: inline-block;
			margin-top: -5px;
			padding-top: 5px;
			padding-left: 36px;
			background: url(../tmpl-img/ico_header_post01.png) no-repeat left top;
		}
		
		/*	#headerForm - 検索フォーム
		----------------------------------------------------*/
		#header #headerBlock #searchForm {
			margin-top: 15px;
		}
		
		#header #headerBlock #searchForm:after {
			content: "";
			display: block;
			clear: both;
		}
		
		#header #headerBlock #searchForm .searchTextForm {
			width: 270px; /* 270px/310px */
			height: 40px;
			background-color: #eee; /* 20170314 */
			border: none;
			line-height: 40px;
			font-size: 1.4em;
			vertical-align: bottom; /* 20170314 */
		}
		
		#header #headerBlock #searchForm .btnSubmit {
			width: 40px;
			height: 40px;
			margin: 0 !important;
			padding: 0 !important;
			background: #333 url(../tmpl-img/ico_search.png) no-repeat center center;
			border: none !important;
			border-radius: 0 !important;
			text-indent: -9999px;
			cursor: pointer;
		}
		
	/*	#headerBanner - ヘッダーバナーエリア
	----------------------------------------------------*/
	#header #headerBanner {
		float: right;
		width: 120px; /* 130px/1000px */
		margin-right: 10px; /* 10px/1000px */
	}
	
	/*	#siteID - サイトID
	-------------------------------------------------- */
	#header #siteID {
		float: left;
		width: 350px; /* 350px/1000px */
	}
	
	#header #siteID:after {
		content: "";
		display: block;
		clear: both;
	}
	
		#header #siteID .description {
			margin-top: 10px;
		}
	
		#header #siteID .description li {
			display: inline;
			margin-right: 6px;
			font-size: 1.4em;
			font-weight: bold;
		}
		
		#header #siteID .description span {
			display: inlne-block;
			margin-right: 5px;
			padding: 3px 5px;
			background-color: #333;
			color: #fff;
			font-size: 0.85714285714em;
			font-weight: normal;
			line-height: 1;
		}		
		
		#header #siteID #logo {
			width: 350px /* 350px/350px */;
			margin-top: 22px;
		}
		
		#header #siteID #logo img {
			width: 260px; /* 260px/350px */
		}
		
		/* 特殊仕様のロゴがある場合  */
		#header #siteID #logo.special img {
			width: 340px; /* 340px/350px */;
		}


/*---------------------------------------------------
	#gNavi - グローバルナビゲーション
-------------------------------------------------- */
#gNavi {
	background-color: #5a7de3;
}

#gNavi ul {
	height: 50px;
}

#gNavi li {
	position: relative;
	float: left;
	font-size: 1.4em;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
}

#gNavi li a {
	display: block;
	height: 50px;
	background-color: #5a7de3;
	border-right: 1px solid #7b97e9;
	color: #fff;
	text-decoration: none;
	line-height: 1.4;
}

#gNavi li a:hover {
	background-color: #7d9bfa;
	text-decoration: none !important;
}

#gNavi li a span {
	height: 16px;
	padding: 1px 0;
	padding-left: 20px;	
	line-height: 50px;
}

/* ホーム */
#gNavi .home {
	width: 5%;	/* 50px/1000px */
}

#gNavi .home a {
	background-color: #7d9bfa;
}

#gNavi .home a img {
	padding-top: 17px;
}

/* バックナンバー */
#gNavi .backnumber {
	width: 16%;	/* 160px/1000px */
}

#gNavi .backnumber a span {
	background: url(../tmpl-img/ico_gnavi02.png) no-repeat left center;
}

/* 連載・特集 */
#gNavi .feature {
	width: 12%;	/* 120px/1000px */
}

#gNavi .feature a span {
	background: url(../tmpl-img/ico_gnavi03.png) no-repeat left center;
}

/* コラム */
#gNavi .column {
	width: 11%;	/* 110px/1000px */
}

#gNavi .column a span {
	background: url(../tmpl-img/ico_gnavi04.png) no-repeat left center;
}

/* イベント・セミナー */
#gNavi .event {
	width: 19%;	/* 190px/1000px */
}

#gNavi .event a span {
	background: url(../tmpl-img/ico_gnavi05.png) no-repeat left center;
}

/* 求人情報 */
#gNavi .job {
	width: 12%;	/* 120px/1000px */
}

#gNavi .job a span {
	background: url(../tmpl-img/ico_gnavi06.png) no-repeat left center;
}

/* 皆さんコーナー */
#gNavi .reader {
	width: 16%;	/* 160px/1000px */
}

#gNavi .reader	 a span {
	background: url(../tmpl-img/ico_gnavi07.png) no-repeat left center;
}

/* 書籍 */
#gNavi .book {
	width: 9%;	/* 90px/1000px */
}

#gNavi .book a span {
	background: url(../tmpl-img/ico_gnavi08.png) no-repeat left center;
}

/*　子育て・教育 */
#gNavi .education {
	width: 13%;	/* 90px/1000px */
}
#gNavi .education a span {
	background: url(../tmpl-img/ico_gnavi09.png) no-repeat left center;
}

/* サブメニュー
-------------------------------------------------- */
#gNavi li ul {
	position: absolute;
	top: 40px;
	width: 260px;
	height: 0;
	z-index: 100;
}

#gNavi .feature:hover .featureSubCategory {
	height: auto;
	margin-left: -75px;
	padding-top: 10px;
	background: url(../tmpl-img/bg_gnavi_sub_menu01.png) no-repeat center top;
}

#gNavi .column:hover .columnSubCategory {
	height: auto;
	margin-left: -80px;
	padding-top: 10px;
	background: url(../tmpl-img/bg_gnavi_sub_menu01.png) no-repeat center top;
}

#gNavi li li {
	float: none;
	height: 0;
	padding: 0 10px;
	background: url(../tmpl-img/bg_gnavi_sub_menu02.png) repeat 10px top;
	font-size: 0.85714285714em ;
	font-weight: normal;
	text-align: left;
	visibility: hidden;
	overflow: hidden;
}

#gNavi li li:first-child {
	padding-top: 10px;
}

#gNavi li li:last-child {
	padding-bottom: 10px;
}

#gNavi li:hover li {
	visibility: visible;
	overflow: visible;
	height: auto;
	z-index: 10;
}

#gNavi li li a {
	display: block;
	height: auto;
	padding: 15px 0;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid #666;
	line-height: 1.3;
	
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	transition: .5s;
}

#gNavi li li:first-child a {
	border-top: 1px solid #666;
}

#gNavi li li a:hover {
	background-color: #666;
}

#gNavi li li a span {
	display: block;
	height: auto;
	padding-left: 24px;
	background: url(../tmpl-img/ico_arrow04.png) no-repeat 10px center !important;
	line-height: 1.2;
}

/*---------------------------------------------------
	#pcBannerBlock - PC用バナーブロック
-------------------------------------------------- */
#pcBannerBlock {
	width: 90%;
	height: 70px;
	margin: 30px auto 20px;
	background-color: #f5f5f5;
}


/*---------------------------------------------------
	#contents - コンテンツ
-------------------------------------------------- */
#contents {
}

#contents:after {
	content: "";
	display: block;
	clear: both;
}
	
	/*	#main - メイン
	-------------------------------------------------- */
	#main {
		float: left;
		width: 70%
	}
	
	/*	#side - サイド
	-------------------------------------------------- */
	#side {
		float: right;
		width: 27%;
	}
	
	#side ul,
	#side p {
		margin: 20px 0;
	}
	
	#side .sideBannerArea {
		margin-bottom: 20px;
		padding: 20px 7.407407407%; /* 20px/270px */
		border: 1px solid #eee;
		text-align: center;
	}
	
	#side .sideBannerArea ul {
		margin: -10px 0 0;
	}
	
	#side .sideBannerArea li {
		margin-top: 10px;
	}
	
	#side .sideSNSNavi li {
		float: left;
		width: 50%;
		text-align: center;
	}
	
	#side .sideSNSNavi .twitter {
		background-color: #30a3dc;
	}
	
	#side .sideSNSNavi .facebook {
		background-color: #3c5a95;
	}
		
	#side .sideContactNavi li {
		border-bottom: 1px solid #fff;
		font-size: 1.5em;
		font-weight: bold;
	}
	
	#side .sideContactNavi li a {
		display: block;
		padding: 15px 0;
		background-color: #eee;
		color: #333;
		text-decoration: none;
	}
	
	#side .sideContactNavi li a span {
		display: inline-block;
		height: 40px;
		line-height: 40px;
		padding-left: 60px; /* 60px/270px */
	}
	
	#side .sideContactNavi .first span {
		background: url(../tmpl-img/ico_side_contact_navi04.png) no-repeat 15px center;
	}
	
	#side .sideContactNavi .second span {
		background: url(../tmpl-img/ico_side_contact_navi02.png) no-repeat 15px center;
	}
	
	#side .sideContactNavi .third span {
		background: url(../tmpl-img/ico_side_contact_navi03.png) no-repeat 15px center;
	}
	
	#side .sideContactNavi .fourth span {
		background: url(../tmpl-img/ico_side_contact_navi05.png) no-repeat 15px center;
	}
	
	/*	.sideHeadingBlock01 - 見出しブロック
	----------------------------------------------------*/
	#side .sideHeadingBlock01 {
		position: relative;
		margin-bottom: 25px;
		padding: 10px 0 15px;
		background: url(../tmpl-img/bg_side_pickup01.png) no-repeat left bottom;
	}
	
	#side .sideHeadingBlock01:after {
		content: "";
		display: block;
		clear: both;
	}
	
	#side .sideHeadingBlock01 .heading {
		float: left;
		width: 81.481481481%; /* 220px/270px */
		font-size: 1.5em;
		font-weight: bold;
		line-height: 1.3;
	}
	
	#side .sideHeadingBlock01 .heading .eyeCatch {
		float: left;
		width: 40px;
	}
	
	#side .sideHeadingBlock01 .heading span {
		display: block;
		margin-left: 45px;
		padding-top: 8px;
	}
	
	/*	.btnList - 一覧を見る
	----------------------------------------------------*/
	#side .sideHeadingBlock01 .btnList {
		display: inline;
		float: right;
		margin: 0 !important;
		padding-top: 5px;
		font-size: 1.2em;
		text-align: center;
	}
	
	#side .sideHeadingBlock01 .btnList a {
		display: block;
		padding: 3px 8px;
		color: #fff;
		background-color: #333;
		border-radius: 5px;
		text-decoration: none;
	}
	
	#side .sidePickup li {
		padding: 10px 0;
		border-bottom: 1px dotted #ddd;
		font-size: 1.4em;
	}
	
	#side .sidePickup li:first-child {
		padding-top: 0;
	}
	
	#side .sidePickup li .thumb {
		float: left;
	}
	
	#side .sidePickup li .block {
		margin-left: 90px;
	}
	
	#side .sidePickup li .no-image {
		margin-left: 0;
	}
	
	#side .sidePickup li a {
		display: block;
		padding-left: 15px;
		background: url(../tmpl-img/ico_arrow01.png) no-repeat left 5px;
		color: #333;
		text-decoration: none;
	}
	
	#side .twitterBlock {
		width: 100%;
		margin-bottom: 20px;
	}
	
	#side .twitterBlock iframe {
		width: 100% !important;
	}
	
/*
	#side .fb-like-box,
	#side .fb-like-box span,
	#side .fb-like-box iframe[style]{
		width: 100%!important;
	}
*/


/*---------------------------------------------------
	#facebookBlock - フェイスブックページブロック（2015.05.14追記）
-------------------------------------------------- */
#facebookBlock {
	float: left;
	width: 70%;
	margin-top: 20px;
	text-align: center;
}

/*---------------------------------------------------
	#pageTop - ページトップ
-------------------------------------------------- */
#pageTop {
	margin-top: 50px;
}

#pageTop a {
	display: block;
	padding: 12px 0;
	background-color: #333;
	text-align: center;
}

#pageTop a:hover {
	background-color: #5a7de3;
}

/*----------------------------------------------------
	#fadePageTop - ページトップ（フェードイン）
----------------------------------------------------*/
#fadePageTop {
	position: fixed;
	right: 20px;
	bottom: 20px;
}

#fadePageTop a {
	display: block;
}

/* --------------------------------------------------
	#footer - フッター
-------------------------------------------------- */
#footer {
	padding: 30px 10px;
	background-color: #eee;
}

#footer:after {
	content: "";
	display: block;
	clear: both;
}

/*	.footerBlock - フッターブロック（社名・住所・TEL等）
-------------------------------------------------- */
#footer .footerBlock {
	float: left;
}

#footer .footerBlock dl {
	font-size: 1.4em;
}

#footer dt {
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

#footer dt img {
	width: 200px;
}

#footer dd span {
	margin-right: 10px;
}

#footer dd address {
	margin-bottom: 5px;
}

/*	.footerNavi - フッターナビ
-------------------------------------------------- */
#footer .footerNavi {
	float: right;
}

#footer .footerNavi ul {
	float: left;
	margin-left: 20px;
	font-size: 1.3em;
}

#footer .footerNavi li ul {
	float: none;
	margin-top: 5px;
	margin-left: 10px;
	font-size: 1em;
}

#footer .footerNavi ul:first-child {
	margin-left: 0;
}

#footer .footerNavi li {
	margin-bottom: 5px;
}

#footer .footerNavi li a {
	padding-left: 14px;
	background: url(../tmpl-img/ico_arrow02.png) no-repeat left center;
	color: #333;
	text-decoration: none;
}

#footer .footerNavi li li a{
	background: url(../tmpl-img/ico_arrow03.png) no-repeat left center;
}

/* --------------------------------------------------
	#copyright - コピーライト
-------------------------------------------------- */
#copyright {
	padding: 8px 0;
	background-color: #333;
	color: #fff;
	text-align: center;
}

#copyright .small {
	font-size: 1.2em;
}



/* --------------------------------------------------
	Responsive Settings
-------------------------------------------------- */
/*	01 - PC Large
-------------------------------------------------- */
@media screen and (min-width:821px) {

	/*	#smpNavi - スマートフォン用ナビゲーション
	-------------------------------------------------- */
	#smpNavi {
		display: none;
	}

}



/*	02 - PC Small
-------------------------------------------------- */
@media screen and (min-width:821px) and (max-width: 999px) {
	
	/*	#header - ヘッダー
	-------------------------------------------------- */
	#header {
		padding: 10px;
	}

	/*	#contents - コンテンツ
	-------------------------------------------------- */
	#contents {
		padding: 0 10px;
	}

}



/*	03 - for Smart Phone, Tablet
-------------------------------------------------- */
@media screen and (min-width:320px) and (max-width:820px) {

	/* --------------------------------------------------
		#smpNavi - スマートフォン用ナビゲーション
	-------------------------------------------------- */
	#smpNavi {
		position: fixed;
		width: 220px;
		height: 100%;
		background-color: #333;
		text-align: left;
		overflow-y: scroll;
		z-index: 9999;
	}
	
	#smpNavi h3 {
		padding: 12px 0 12px 15px;
		background-color: #1c1c1c;
		color: #fff;
		font-size: 2em;
		font-weight: bold;
	}
	
	#smpNavi li {
		border-bottom: 1px solid #222;
		color: #999;
		font-size: 1.5em;
		font-weight: bold;
		line-height: 1.3;
	}
	
	#smpNavi li a {
		display: block;
		padding: 12px 15px;
		background-color: #333;
		color: #fff;
		text-decoration: none !important;
		
		-webkit-transition: all .2s ease-in;
		-moz-transition: all .2s ease-in;
		transition: all .2s ease-in;
	}
	
	#smpNavi li a:hover {
		padding-left: 20px;
		background-color: #444;
	}
	
	#smpNavi .bnrSmpNavi {
		width: 200px;
		margin: 30px auto 20px;
	}
	
	#smpNavi .twitter {
		width: 200px;
		margin: 0 auto 5px;
		background-color: #30a3dc;
		text-align: center;
	}
	
	#smpNavi .facebook {
		width: 200px;
		margin: 0 auto 20px;
		background-color: #3c5a95;
		text-align: center;
	}
	
	#smpNavi {
		right: -220px;
	}
	 
	#smpNavi.smpNaviOpen {
		right: 0px;
	}
	
	.smpNaviPush {
		position: relative;
		left: 0;
		overflow-x: hidden;
	}
	
	.smpNaviPushLeft {
		left: -220px;
		position: fixed;
		width: 100%;
	}
	
	.smpNaviPushLeft #top {
		left: -220px;
	}
	 
	#smpNavi,
	.smpNaviPush,
	.smpNaviPushLeft #top {
		-webkit-transition: all .3s ease;
		-moz-transition: all .3s ease;
		transition: all .3s ease;
	}
	
	/*---------------------------------------------------
		#top - トップ
	-------------------------------------------------- */
	#top {
		padding: 5px;
	}
	
		#top #tagline {
			display: block;
			float: none;
			width: 100%;
		}
		
		#top #utilityBlock {
			display: none;
		}
	
	/*----------------------------------------------------
		#header - ヘッダー
	----------------------------------------------------*/
	#header {
		height: auto;
		margin-bottom: 35px;
		padding: 0;
	}
		
		/*	#headerBlock - ヘッダーブロック
		----------------------------------------------------*/
		#header #headerBlock {
			float: none;
			width: 100%;
			margin: 0 auto;
		}
		
			/*	#headerNavi - ヘッダーナビゲーション
			----------------------------------------------------*/
			#header #headerBlock #headerNavi {
				display: none;
			}
			
			/*	#headerForm - 検索フォーム
			----------------------------------------------------*/
			#header #headerBlock #searchForm {
				width: auto;
				margin: 0;
				padding: 10px;
				background-color: #eee;
			}
			
			#header #headerBlock #searchForm .searchTextForm {
				width: 85%; /* 680px/800px */
				background-color: #fff;
			}
			
			#header #headerBlock #searchForm #btnSubmit {
				width: 15%; /* 120px/800px */
			}
				
		/*	#headerBanner - ヘッダーバナーエリア
		----------------------------------------------------*/
		#header #headerBanner {
			display: none;
		}
		
		/*	#siteID - サイトID
		-------------------------------------------------- */
		#header #siteID {
			position: relative;
			float: none;
			width: 100%;
			margin: 0 auto;
			padding-top: 10px;
		}
		
			#header #siteID .description {
				text-align: center;
			}
			
			#header #siteID #logo {
				width: 100%;
				margin-top: 15px;
				text-align: center;
			}
			
			#header #siteID #logo img {
				width: 300px;
			}

	
		/*	.btnSmpNavi - スマートフォン用メニューボタン
		-------------------------------------------------- */
		#header .btnSmpNavi {
			position: absolute;
			top: 20px;
			right: 20px;
			width: 50px;
			border-radius: 5px;
			background-color: #5a7de3;
		}
		
		#header .btnSmpNavi a {
			position: relative;
			display: block;
			width: 26px;
			height: 22px;
			padding: 14px 12px;
			cursor: pointer;
		}
		
		#header .btnSmpNavi span {
			display: block;
			width: 26px;
			height: 4px;
			background-color: #fff;
			margin: 0 0 5px 0;
			transition: all .5s;
		}
		
		#header .btnSmpNavi .third {
			margin-bottom: 0;
		}
		
		/* クリック時のアニメーション */
		.activated #header .btnSmpNavi .first {
			-webkit-transform: translate(0,9px) rotate(405deg);
			-moz-transform: translate(0,9px) rotate(405deg);
			transform: translate(0,9px) rotate(405deg);
		}
		
		.activated #header .btnSmpNavi .second {
			-webkit-transform: translate(0,0) rotate(-405deg);
			-moz-transform: translate(0,0) rotate(-405deg);
			transform: translate(0,0) rotate(-405deg);
		}
		
		.activated #header .btnSmpNavi .third {
			-webkit-transform: translate(0,-9px) rotate(405deg);
			-moz-transform: translate(0,-9px) rotate(405deg);
			transform: translate(0,-9px) rotate(405deg);
		}	
		
	/*---------------------------------------------------
		#gNavi - グローバルナビゲーション
	-------------------------------------------------- */
	#gNavi {
		display: none;
	}
	
	/*---------------------------------------------------
		#contents - コンテンツ
	-------------------------------------------------- */	
	#contents {
		padding: 0 10px;
	}

	#main {
		float: none;
		width: 100%;
	}
	
	#side {
		float: none;
		width: 100%;
	}
	
	#side .sidePCBanner,
	#side .sidePickup {
		display: none
	}
	
	#side .sideBannerArea {
		display: none;
	}
	
	/*---------------------------------------------------
		#facebookBlock - フェイスブックページブロック（2015.05.14追記）
	-------------------------------------------------- */
	#facebookBlock {
		float: none;
		width: 100%;
		margin-top: 0;
	}
		
	/*---------------------------------------------------
		#footer - フッター
	-------------------------------------------------- */	
	#footer {
		padding: 20px;
	}
	
	#footer .footerBlock {
		float: none;
	}
	
	#footer .footerNavi {
		display: none;
	}
	
}



/*	04 - for Smart Phone
-------------------------------------------------- */
@media screen and (min-width:320px) and (max-width:480px) {
	
	/*	#header - ヘッダー
	-------------------------------------------------- */
	#header {
		margin-bottom: 20px;
	}
		
		#header #siteID #logo img {
			width: 230px;
			margin-right: 15px;
			vertical-align: bottom;
		}
		
		/* 特殊仕様のロゴがある場合  */
		#header #siteID #logo.special img {
			width: 250px;
			margin-top: 5px;
			margin-right: 40px;
		}
		
	/*	.btnSmpNavi - スマートフォン用メニューボタン
	-------------------------------------------------- */
	#header .btnSmpNavi {
		top: 56px;
		right: 5px;
		width: 40px;
	}
	
	#header .btnSmpNavi a {
		width: 20px;
		height: 19px;
		padding: 10px 10px;
		cursor: pointer;
	}
	
	#header .btnSmpNavi span {
		display: block;
		width: 20px;
		height: 3px;
		margin: 0 0 5px 0;
	}
	
	/* クリック時のアニメーション */
	.activated #header .btnSmpNavi .first {
		-webkit-transform: translate(0,8px) rotate(405deg);
		-moz-transform: translate(0,8px) rotate(405deg);
		transform: translate(0,8px) rotate(405deg);
	}
	
	.activated #header .btnSmpNavi .second {
		-webkit-transform: translate(0,0) rotate(-405deg);
		-moz-transform: translate(0,0) rotate(-405deg);
		transform: translate(0,0) rotate(-405deg);
	}
	
	.activated #header .btnSmpNavi .third {
		-webkit-transform: translate(0,-8px) rotate(405deg);
		-moz-transform: translate(0,-8px) rotate(405deg);
		transform: translate(0,-8px) rotate(405deg);
	}
	
	/*---------------------------------------------------
		#footer - フッター
	-------------------------------------------------- */
	#footer dd span {
		display: block;
		margin-right: 0;
	}
	
	#footer dd .fax {
		margin-left: 3.1em;
	}
	
}



/* --------------------------------------------------
	Print Settings
-------------------------------------------------- */
@media print {

	#smpNavi {
		display: none;
	}
	
}