@charset 'utf-8';

/* --------------------------------------------------------------------------------
	Reset
-------------------------------------------------------------------------------- */
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
}
h1,h2,h3,h4,h5,h6,
input,
textarea{
	font-weight:normal;
	font-size:1em;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
	display:block;
}
ol,ul{
	list-style:none;
}
blockquote,q{
	quotes:none;
}
blockquote:before,blockquote:after,
q:before,q:after{
	content:'';
	content:none;
}
a{
	overflow:hidden;
	outline:none;
	text-decoration:none;
	color:#000;
}
a:hover,
a:active{
	text-decoration:underline;
	color:#3483e7;
}
input[type="text"]:focus{
	outline:0;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}
img{
	max-width:100%;
	height:auto;
	border:none;
	-ms-interpolation-mode:bicubic;
	vertical-align:text-bottom;
}

/* --------------------------------------------------------------------------------
	タグ
-------------------------------------------------------------------------------- */
body{
	line-height:1.5;
	font-family:"ヒラギノ丸ゴ Pro W4", "Hiragino maru Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO","Verdana","Osaka",sans-serif;
	-webkit-text-size-adjust:100%;
}
	
/* --------------------------------------------------------------------------------
	共通クラス
-------------------------------------------------------------------------------- */
.clear{
	clear:both;
}
br.clear{
	display:block;
	margin:0;
	padding:0;
	clear:both;
	height:0;
	border:none;
	visibility:hidden;
	font-size:0;
}
.clearfix:after{
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}
.clearfix{
	min-height:1%;
}
* html .clearfix{
	height:1%;
	/*\*//*/
	height:auto;
	overflow:hidden;
	/**/
}

ul.ul{
	list-style:disc;
	padding:0 0 0 1.2em;
}
ol.ol{
	list-style:decimal;
	padding:0 0 0 1.2em;
}

@media screen and (min-width: 850px){
	body{
		font-size:1.2em;
	}
}
@media screen and (min-width: 1000px){
	body{
		font-size:1.3em;
	}
}



/* --------------------------------------------------------------------------------
	共通：footer
-------------------------------------------------------------------------------- */
#footer{
}

/********** Facebook **********/
#footer .btn-facebook{
	max-width:1080px;
	margin:0 auto;
	padding:0 4%;
}
#footer .btn-facebook a{
	display:block;
	float:right;
	line-height:1.2;
	margin:0 0 18px;
}

/********** ページトップへ戻る **********/
#footer .btn-pagetop{
	max-width:1080px;
	margin:0 auto;
	padding:0 4%;
}
#footer .btn-pagetop a{
	display:block;
	float:right;
	line-height:1.2;
	height:1.2em;
	margin:0 0 2.8%;
	padding:0 0 0 25px;
	font-size:14px;
	background:url(../images/common/pc/icon-pagetop-arr.png) no-repeat 0 50%;
}
	
/********** 内側 **********/
#footer .footer-inner{
	padding:5% 0 0;
	color:#fff;
	background:#004082;
}

/********** リンク **********/
#footer .footer-inner a{
	text-decoration:none;
	color:#fff;
}

/********** メニュー **********/
#footer .footer-inner .f-nav{
	padding:0 0 2%;
}
#footer .footer-inner .f-nav ul{
	display:table;
	margin:0 auto 5%;
}
#footer .footer-inner .f-nav ul li{
	display:table-cell;
	border-left:solid 1px #fff;
	width:110px;
}
#footer .footer-inner .f-nav ul li a{
	display:block;
	margin:0 0.5em;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
	font-size:1.3em;
	color:#fff;
	white-space:nowrap;
}
#footer .footer-inner .f-nav ul li.list-end{
	border-right:solid 1px #fff;
}
#footer .footer-inner .f-nav a span{
	font-size:50%;
}
#footer .footer-inner ul li.list-end a{
	border:none;
}

/********** コピーライト **********/
#footer .copyright{
	padding:0 0 5%;
	text-align:center;
}


/* --------------------------------------------------------------------------------
	PC
-------------------------------------------------------------------------------- */
@media screen and (min-width: 850px){
	
	html{
		font-size:62.5%;
	}
	
	body{
		line-height:1.5;
		font-family:"ヒラギノ丸ゴ Pro W4", "Hiragino maru Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO","Verdana","Osaka",sans-serif;
		-webkit-text-size-adjust:100%;
	}
	
	/********** デバイスごとの表示・非表示 **********/
	.device-sp{
		display:none;
	}
	
	/* --------------------------------------------------------------------------------
		container
	-------------------------------------------------------------------------------- */
	#container{
	}
	
	
	/* --------------------------------------------------------------------------------
		header
	-------------------------------------------------------------------------------- */
	#header{
		
	}
	
	/********** ヘッダー文言 **********/
	#header .h-txt{
		padding:0.2% 0;
		border-bottom:solid 1px #dedede;
	}
	#header h1{
		max-width:1080px;
		margin:0 auto;
		padding:0.35% 5%;
	}
	
	/********** ロゴ＆コンテンツ **********/
	#header .logo-h-contents{
		max-width:1080px;
		margin:0 auto;
		padding:2% 5% 1%;
	}
	
	/********** ロゴ **********/
	#header .logo{
		float:left;
		width:44.75%;
		padding:1.5% 0 0;
	}
	
	/********** コンテンツ **********/
	#header .h-contents{
		float:right;
		width:55%;
	}
	
	/********** お問い合わせ **********/
	#header .h-contents .h-contact-tel{
		float:right;
		padding:0 0 1.3%;
		font-size:120%;
		font-weight:bold;
	}
	#header .h-contents .h-btn-contact{
		float:left;
	}
	#header .h-contents .h-btn-contact span{
		display:block;
		width:8.5em;
		margin:0 1em 0 0;
		padding:4% 0;
		border:solid 2px #67a1f0;
		text-align:center;
		text-decoration:none;
		color:#5196ec;
	}
	#header .h-contents .h-tel{
		float:left;
		text-align:left;
		line-height:1.35;
	}
	
	/********** ナビゲーション **********/
	#header .h-contents .h-nav{
		clear:both;
		text-align:right;
	}
	#header .h-contents .h-nav ul{
		float:right;
		line-height:1.4;
	}
	#header .h-contents .h-nav ul li{
		display:table-cell;
		border-left:dashed 1px #000;
		width:110px;
	}
	#header .h-contents .h-nav a{
		display:block;
		margin:0 0.5em;
		font-weight:bold;
		text-decoration:none;
		text-align:center;
		font-size:1.3em;
		color:#000;
		white-space:nowrap;
	}
	#header .h-contents .h-nav ul li.list-end{
		border-right:dashed 1px #000;
	}
	#header .h-contents .h-nav a:hover,
	#header .h-contents .h-nav a:active{
		color:#3483e7;
	}
	#header .h-contents .h-nav a span{
		font-size:50%;
	}
	@media screen and (min-width: 800px){
		#header .h-contents .h-nav ul{
			font-size:75%;
		}
	}
	@media screen and (min-width: 900px){
		#header .h-contents .h-nav ul{
			font-size:85%;
		}
	}
	@media screen and (min-width: 1000px){
		#header .h-contents .h-nav ul{
			font-size:95%;
		}
	}
	@media screen and (min-width: 1100px){
		#header .h-contents .h-nav ul{
			font-size:105%;
		}
	}
	
	
	/* --------------------------------------------------------------------------------
		wrapper
	-------------------------------------------------------------------------------- */
	#wrapper{
		max-width:1080px;
		margin:0 auto 3%;
		padding:0 4%;
	}
	
	
	/* --------------------------------------------------------------------------------
		sub1
	-------------------------------------------------------------------------------- */
	#sub1{
	}
	
	
	/* --------------------------------------------------------------------------------
		main
	-------------------------------------------------------------------------------- */
	#main{
	}
	
}


/* --------------------------------------------------------------------------------
	スマートフォン
-------------------------------------------------------------------------------- */
@media screen and (max-width: 849px){
	/* --------------------------------------------------------------------------------
		タグ
	-------------------------------------------------------------------------------- */
	html{
		font-size:62.5%;
	}
	body{
		line-height:1.5;
		font-family:"ヒラギノ丸ゴ Pro W4", "Hiragino maru Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO","Verdana","Osaka",sans-serif;
		font-size:0.75em;
		-webkit-text-size-adjust:100%;
	}
	
	@media screen and (min-width: 1px) and (max-width: 399px){
		body{
			font-size:0.75em;
		}
	}
	@media screen and (min-width: 400px) and (max-width: 599px){
		body{
			font-size:0.9em;
		}
	}
	@media screen and (min-width: 600px) and (max-width: 699px){
		body{
			font-size:1.15em;
		}
	}
	@media screen and (min-width: 700px) and (max-width: 849px){
		body{
			font-size:1.2em;
		}
	}
	
	/********** デバイスごとの表示・非表示 **********/
	.device-pc{
		display:none;
	}
	
	/* --------------------------------------------------------------------------------
		container
	-------------------------------------------------------------------------------- */
	#container{
	}
	
	/* --------------------------------------------------------------------------------
		header
	-------------------------------------------------------------------------------- */
	#header{
		padding:0 0 3%;
	}
	
	/********** 内側 **********/
	#header .header-inner{
		padding:0 3%;
	}
	
	/********** ヘッダー文言 **********/
	#header .h-txt{
		float:left;
		width:80%;
		padding:2.5% 0;
		font-size:0.9em;
	}
	
	/********** ロゴ **********/
	#header .logo{
		float:left;
		width:70%;
		padding:2% 0 0;
	}
	
	/********** ヘッダーメニューボタン **********/
	#header .btn-menu{
		float:right;
		width:18%;
		padding:2.5% 0 0;
	}
	
	/********** ナビゲーション **********/
	#header .h-nav{
		clear:both;
		width:100%;
		position:absolute;
		z-index:100;
	}
	#header .h-nav ul{
		border-top:solid 0.15rem #b5b5b5;
	}
	#header .h-nav ul li{
	}
	#header .h-nav a{
		display:block;
		padding:0.8em 2em 0.8em 3em;
		line-height:1.2;
		border-bottom:solid 0.15rem #b5b5b5;
		font-weight:bold;
		text-decoration:none;
		font-size:2.3em;
		color:#000;
		background:#fff url(../images/common/sp/icon-arr1.png) no-repeat 1.2em 50%;
		background-size:1em auto;
	}
	#header .h-nav a:hover,
	#header .h-nav a:active{
		color:#3483e7;
	}
	#header .h-nav a span{
		font-size:70%;
		font-weight:normal;
	}
	
	/********** 電話バナー **********/
	#header .bnr-tel{
		padding:3% 8% 0;
	}
	
	/* --------------------------------------------------------------------------------
		wrapper
	-------------------------------------------------------------------------------- */
	#wrapper{
		padding:0 0 4%;
	}
	
	/* --------------------------------------------------------------------------------
		sub1
	-------------------------------------------------------------------------------- */
	#sub1{
	}
	
	/* --------------------------------------------------------------------------------
		main
	-------------------------------------------------------------------------------- */
	#main{
	}
	
	/* --------------------------------------------------------------------------------
		footer
	-------------------------------------------------------------------------------- */
	#footer{
	}
	
	/********** Facebook **********/
	#footer .btn-facebook{
		padding:0 4% 5% 75%;
	}
	#footer .btn-facebook a{
		display:block;
		float:right;
		line-height:1.2;
	}
	
}





