/* INITIALIZE ********************************************************* */
body,div,ul,ol,li,dl,dt,dd,form,th,td,h1,h2,h3,h4,h5,p,figure{ font-size:inherit;margin:0;padding:0;font-weight:normal;outline:0; }
body{-webkit-text-size-adjust:none;}
*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}
table{ border-collapse:collapse;border-spacing:0; }
th{ text-align:left; }
ul,ol{ list-style-type:none; }
img,a img{ border:0;vertical-align:top; }
nav,figure{margin:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0; }


/* FONT COSTORMIZE **************************************************** */
body{
	font-family:"游ゴシック",YuGothic,"メイリオ",Meiryo,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","ＭＳ Ｐゴシック",sans-serif;
	font-size:14px;color:#333;line-break:strict;
}
.f10px{ font-size:10px;line-height:1.4em; }
.f12px{ font-size:12px; }
.f14px{ font-size:14px; }
.f16px{ font-size:16px; }
.f18px{ font-size:18px; }
.f20px{ font-size:20px; }
.font01{ color:#90D; }
.font02{ color:#C00; }
.font03{ color:#603; }
.font-normal{ font-weight:normal; }
.font-small{ font-size:0.9em; }

/* link */
a{ color:#777;}
a:hover{ color:#09C; }

/* LAYOUT ************************* */
body{
	background:#FFF;
}
#header-navi{
	background:#646464;
}
#main{
	max-width:800px;
	margin:10px auto 20px;
	line-height:1.7;
}
@media screen and (max-width:768px){
	padding:0 30px;
}
#footer{
	clear:both;
	background:#EEE;
}
#header-navi-inner,
#header-logo,
#footer-navi,
#footer-inner{
	max-width:900px;
	margin:0 auto;
}

/* clear fix */
.contents:after,
.clr:after{content:' ';display:block;clear:both;}


/* HEADER ************************* */
#header-navi{
	border-bottom:solid 1px #CCC;
	text-align:center;
	font-size:12px;
	box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3);
	font-family:Arial,sans-serif;
	line-height:0;
}
#header-navi a{
	display:inline-block;
	padding:25px 0;
	width:23%;
	max-width:150px;
	border-right:solid 1px #999;
	text-align:center;
	text-decoration:none;
	color:#EEE;
}
#header-navi a:first-child{ border-left:solid 1px #999; }
#header-logo{
	border-bottom:solid 1px #999;
	text-align:center;
}
#header-logo:after{
	content:"";
	display:block;
	height:1px;
	margin-bottom:2px;
	border-bottom:solid 3px #999;
}
#header-logo img{
	width:60%;
	max-width:250px;
	margin:5% 0 4%;
}

/* FOOTER ************************* */
@media screen and (min-width:801px){
	#footer-navi{
		margin:5px auto;
		font-size:12px;
	}
	#footer-navi a{
		display:inline-block;
		padding:0 10px;
		border-right:solid 1px #CCC;
		text-decoration:none;
	}
	#footer-navi a:first-child{ margin-left:10px; border-left:solid 1px #CCC; }
}
@media screen and (max-width:800px){
	#footer-navi a{
		position:relative;
		display:block;
		padding:15px 10px;
		text-decoration:none;
		font-family:Arial,sans-serif;
	}
	#footer-navi a:not(first-child){ border-top:solid 1px #DDD; }
	#footer-navi a:after{
		content:"▲";
		position:absolute;
		top:10px;
		right:10px;
		transform:rotate(90deg) scale(1,0.7);
		-webkit-transform:rotate(90deg) scale(1,0.7);
		color:#CCC;
	}
}
#footer-inner{
	padding:20px 10px;
	line-height:1.5;
}
.footer-corp{
	margin:0 0 5px;
}
.footer-corp span{
	display:block;
	font-size:18px;
	line-height:1;
}
.footer-copyright{
	text-align:right;
}

/* MAIN ************************* */

/* baseset */
.baseblock{
	padding:0 15px;
}
.baseblock p{
	margin-bottom:20px;
}
.title01{
	margin:20px 0 -20px;
	text-align:center;
	font-size:18px;
	font-weight:bold;
}
.title02{
	margin:40px -15px 20px;
	padding:5px 8px;
	background:#999;
	font-size:16px;
	color:#FFF;
}
.title03{
	margin:10px -5px;
	padding:2px 0 0 5px;
	border-left:solid 8px #BBB;
	font-weight:bold;
}
@media screen and (min-width:600px){
	.baseblock{ padding:0 30px;}
	.title02{ margin-left:-30px; margin-right:-30px; }
	.title03{ margin-left:-20px; margin-right:-20px; }

}

/* text, btn */
.text-style01{
	font-size:16px;
	font-weight:bold;
}

a.btn01{
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0 20px;
	background:#75A2D5;
	background:linear-gradient(#85ADDB,#75A2D5,#6598D1);
	background:-webkit-linear-gradient(#85ADDB,#75A2D5,#6598D1);
	border-radius:6px;
	box-shadow:2px 2px 2px 0px rgba(0,0,0,0.25);
	text-decoration:none;
	color:#FFF;
}

/* unit */
.dl01{
	margin:10px 0 20px;
	border-bottom:solid 1px #CCC;
	background:#EEE;
	border-left:solid 1px #CCC;
	border-right:solid 1px #CCC;
}
.dl01 dt{
	float:left;
	width:100px;
	padding:5px;
	border-top:solid 1px #CCC;
}
.dl01 dd{
	margin-left:100px;
	padding:7px 5px 4px;
	border-top:solid 1px #CCC;
	background:#FFF;
}

.pagetop{
	clear:both;
	padding:50px 10px 0;

	text-align:right;
}
.pagetop a{
	text-decoration:none;
}

/* position */
.float-left{ float:left; }
.float-right{ float:right; }

/* PAGE OPTION STYLE ************************************************** */

/*** INDEX        ***/
p.index-lead{
	max-width:500px;
	margin:30px auto 20px;
}
.index-lead-img{
	text-align:center;
}
.index-lead-img img{
	width:48%;
	margin:1%;
}
.index-contact{
	text-align:right;
	line-height:2;
}
@media screen and (min-width:768px){
	.index-lead-img img{ width:30%; }
}
.index-message{
	position:relative;
	min-height:250px;
	margin:20px -15px;
	padding:20px 20px 0;
	border-top:solid 1px #CCC;
	border-bottom:solid 1px #CCC;
}
.index-message > p{
	margin:0 0 10px;
	line-height:2;
}
.index-message-staff img{
	width:120px;
	margin-bottom:10px;
}
.index-message-staff{
	text-align:center;
	font-size:12px;
}
.index-message-staff span{
	font-size:14px;
	font-weight:bold;
}
.index-message-staff01,
.index-message-staff02{
	display:inline-block;
	width:120px;
	margin:20px 3%;
}
@media screen and (min-width:768px){
	.index-message{ margin-left:-30px; margin-right:-30px; }
	.index-message-staff{ position:absolute; top:0; right:4%; width:250px; }
	.index-message-staff01,
	.index-message-staff02{ clear:both; display:block; width:100%; overflow:hidden; }
	.index-message-staff01{ margin:15px 0 -30px -20px; text-align:left; }
	.index-message-staff02{ margin:0; text-align:right; }
	.index-message-staff p{ display:inline-block; padding:50px 10px 0; }
	.index-message-staff01 img{ float:left; }
	.index-message-staff02 img{ float:right; }
}
.index-fb{
	float:left;
	width:175px;
	margin:0 0 0 10px;
}
.index-fb img{ width:100%; }
.index-bn{
	float:right;
	text-align:right;
	width:40%;
	max-width:200px;
}
.index-bn img{ width:50%; }

/*** CONCEPT      ***/
.concept-img{
	width:100%;
	max-width:460px;
	margin:0 auto 20px;
	text-align:center;
}
.concept-img img{ width:40%; max-width:192px; margin:0px 5px; }
@media screen and (min-width:600px){
	.concept-text{ width:68%; }
	.concept-img{ width:28%; }
	.concept-img img{ width:100%; margin:10px 0; }
	.concept-left{ float:left; }
	.concept-right{ float:right; }
}

/*** CONTACT      ***/
.contact-tel p{
	margin:0 0 10px;
}
.contact-tel span{
	padding-right:10px;
	font-size:16px;
}
.contact-tel b{
	font-size:20px;
}
.contact-tel i{
	display:inline-block;
	font-style:normal;
}
@media screen and (min-width:768px){
	.contact-tel{ height:70px; background:url(../images/mark-tel.png) no-repeat; }
	.contact-tel .btn01{ display:none; }
	.contact-tel p{ margin:10px 0 5px 80px; }
}

.contact-staff{
	clear:both;
	margin:5% 0;
	padding:3%;
	border:solid 1px #CCC;
	overflow:hidden;
}
.contact-staff dl{
	margin:0 0 20px;
}
.contact-staff dt{
	margin:0 0 8px;
	padding:0 0 5px;
	border-bottom:dotted 1px #999;
}
.contact-staff dt span{
	font-size:16px;
	font-weight:bold;
}
.contact-staff figure{
	text-align:right;
}
.contact-staff figure img{
	width:100%;
	max-width:150px;
	border:solid 1px #CCC;
}
@media screen and (min-width:600px){
	.contact-staff dl{ width:70%; max-width:520px; margin:0; }
	.contact-staff figure{ width:25%; max-width:190px; }
	.contact-staff figure img{ max-width:190px; }
	.contact-staff-left{ float:left; }
	.contact-staff-right{ float:right; }
}

.contact-map{
	width:100%;
	height:400px;
	margin:10px 0;
	border:0;
}

/*** VOICE      ***/
.voice-box{
	margin:20px 0;
	padding:0 3%;
	border:solid 1px #CCC;
}
.voice-box h3{
	margin:0 0 5px;
	padding:15px 0 10px;
	border-bottom:dotted 1px #999;
	font-size:16px;
	font-weight:bold;
}
p.voice-date{
	margin:0 0 2%;
	text-align:right;
	color:#666;
}
.voice-pagenation{
	text-align:center;
}
.voice-pagenation .pagenation-hit{
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0 15px;
	font-weight:bold;
}
.voice-pagenation .pagenation-off{
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0 12px;
	border:solid 1px #CCC;
	border-radius:6px;
	color:#CCC;
}
.voice-pagenation a{
	display:inline-block;
	height:40px;
	line-height:40px;
	padding:0 12px;
	background:#75A2D5;
	background:linear-gradient(#85ADDB,#75A2D5,#6598D1);
	background:-webkit-linear-gradient(#85ADDB,#75A2D5,#6598D1);
	border-radius:6px;
	box-shadow:2px 2px 2px 0px rgba(0,0,0,0.25);
	text-decoration:none;
	color:#FFF;
}
@media screen and (min-width:600px){
	.voice-text{ margin-left:10%; }
}