@charset "UTF-8";
/*================================================
 *  一般・共通設定
 ================================================*/
html {
	width:100%;
	margin:0 auto;
	font-size: calc(1em * .625);
	color:#3f3339;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}
body {
	color: #3f3339;
	line-height:1.5;
	width: 100%;
	margin:0;
	padding:0;
}
section {
	width:100%;
	margin:0 auto;
	padding:0;
}
ul, ol {
	list-style:none
}
a {
	color:#00a0e9;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	opacity: 0.7;
}
em {font-weight:bold;}

@media screen and (max-width:768px) {
	body {
		box-sizing:border-box;
		width:100%;
	}
}


/*================================================
 *  ヘッダー
 ================================================*/
header{
	display:block;
	width:100%;
	max-width: 187rem;
	margin:0 auto;
	padding:0;
	overflow: hidden;
}
header .logo{
	position:relative;
	z-index:40;
	float:left;
	width:19%;
	max-width:30rem;
	padding: 2rem 0 0 2%;
	margin:0;
}
header ul {
	position:relative;
	z-index:50;
	float:right;
	width:77%;
	padding:0;
	margin:0;
	text-align:right;
}
header ul li{
	display:inline-block;
	padding: 0;
	margin:0 auto;
	font-size:1.8rem;
	text-align:center;
	min-width:13.5%;
	line-height: 8rem;
}
header ul li.contact{
	background:#008601;
	color:#FFF;
	padding-left: .5rem;
	padding-right: .5rem;
	min-width: 9%;
}
header ul li a{
	color: #3f3339;
	display:block;
}
header ul li.contact a{
	color: #FFF;
}
header ul li a:hover{
	text-decoration: none;
	opacity: 1;
}
header ul li p{
	border-bottom:4px solid #FFF;
	font-weight:500;
	padding: 0 20%;
	margin: .8rem 0;
}
header ul li.contact p{
	border-bottom:4px solid #008601;
	padding: 0;

}
header ul li p:hover{
	border-bottom:4px solid #83BB00;
	text-decoration: none;
}
header ul li.contact p:hover{
	border-bottom:4px solid #FFF;
	text-decoration: none;
}
#toggle{ display: none; }

@media screen and (max-width:1200px) {
	header ul li{
		min-width:13%;
	}
	header ul li.contact{
		min-width:18%;
	}
	header ul li p{
		padding:0 5%;
	}
	header ul li.contact p{
		padding:0 3%;
	}
}

@media screen and (max-width:860px) {
	header ul li{
		font-size:1.6rem;
		min-width:13%;
	}
}

@media screen and (max-width:768px) {
	header .logo{
		width:70%;
		padding-top: 1rem;
	}
	#menu{
		display: none;
	}
	#toggle{
		display:block;
		position:absolute;
		width:5%;
		top:2.5%;
		right:4%;
		z-index:50;
	}
	#toggle a img{
		width:100%;
	}
	header ul {
		z-index:60;
		position:absolute;
		display:block;
		width:100%;
		padding:0;
		margin:0;
		top: 12%;
		left:0;
		text-align:left;
	}
	header ul li{
		display:block;
		padding: 0;
		margin:0 auto;
		font-size:1.8rem;
		text-align:left;
		background:#cccccc;
		border-bottom:1px solid #FFF;
	}
	header ul li.contact{
		padding: 0;
	}
	header ul li p{
		font-weight:500;
		padding:0 1.5rem;
		border-bottom:none;
		margin: 0;
	}
	header ul li.contact p{
		padding:0 1.5rem;
		border-bottom:none;
	}
	header ul li p a{
		display:block;
	}
	header ul li a:hover{
		background-color: #008601;
		color: #fff;
	}
	header ul li.contact p:hover{
		background-color: #cccccc;
		color: #008601;
	}
	header ul li p:hover{
		border-bottom:none;
		text-decoration: none;
	}
	header ul li.contact p:hover{
		border-bottom:none;
		text-decoration: none;
	}
}

@media screen and (max-width:640px) {
	#toggle{
		width:6%;
	}
	header ul {
		top:9%;
	}
}

@media screen and (max-width:540px) {
	#toggle{
		width:7%;
	}
	header ul {
		top:8.5%;
	}
}

@media screen and (max-width:480px) {
	#toggle{
		width:7%;
	}
	header ul {
		top:7.5%;
	}
}
@media screen and (max-width:380px) {
	#toggle{
		width:7%;
	}
	header ul {
		top:6.5%;
	}
}


/*================================================
 * パンくず
 ================================================*/
#breadcrumb {
	position:relative;
	width: 98%;
	max-width:136rem;
	margin:0 auto;
	padding:0;
}
#breadcrumb ul {
	width: 100%;
	margin-top:25px;
	margin-bottom:55px;
	margin:0 auto;
	padding:0;
}
#breadcrumb ul li{
	display:inline-block;
	margin:0;
	padding:0;
	font-size: 1.6rem;
}
#breadcrumb ul li a{
	color: #009804;
}
#breadcrumb ul li:before{
	content:" > ";
	padding:0 0.5rem;
}
#breadcrumb ul li:first-child:before{
	content: none;
}

@media screen and (max-width:320px) {
	#breadcrumb ul {
		display:none;
	}
}

/*================================================
 * TOPへ
 ================================================*/
#gotoTop{
	width:80%;
	margin:0 auto;
}
#gotoTop .pc{
	display:block;
}
#gotoTop .sp{
	display:none;
}
#gotoTop .inner{
	text-align:right;
}
#gotoTop .inner p{
	display:inline-block;
	text-align:center;
	padding:2rem 5rem;
	font-size:1.8rem;
}
#gotoTop p a{
	color:#3f3339;
	font-weight:600;
}

@media screen and (max-width:768px) {
	#gotoTop{
		width:96%;
		margin:0 auto;
	}
	#gotoTop .pc{
		display:none;
	}
	#gotoTop .sp{
		display:block;
	}
	#gotoTop .inner p{
		padding:0 1rem 2rem 0;
	}
}

/*================================================
 * お問い合わせ
 ================================================*/
#contact{
	width:100%;
	margin:0 auto 5rem auto;
}
#contact h1{
	text-align:center;
	font-size:4rem;
	font-weight:600;
}
#contact .read{
	text-align:center;
	font-size:1.8rem;
	font-weight:500;
	padding:2rem 0;
}
#contact .contactInner{
	width:80%;
	margin:0 auto;
	padding:0;
	text-align:center;
}
#contact .contactBox{
	display:inline-block;
	width:46%;
	margin:0 .5%;
	padding:2% 1%;
	background-color:#DDDDDD;
}
#contact .contactBox .innerTxt{
	display:inline-block;
	width:55%;
	vertical-align:middle;
	margin:0;
	padding:0;
}
#contact .contactBox .info{
	display:inline-block;
	width:45%;
	vertical-align:middle;
}
#contact .contactBox .info .tel{
	color:#009804;
	font-size:1.93548387vw;
	font-weight:600;
	margin:0;
	padding:0;
}
#contact .contactBox .info .web{
	padding:2rem 0;
}
#contact .contactBox .info a{
	font-size:1.129032258vw;
	font-weight:600;
	color:#009804;
	border:3px solid #009804;
	background-color:#fff;
	padding:1rem 2rem;
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px;
}
#contact .contactBox .info a:hover{
	color:#FFF;
	background-color:#009804;
	text-decoration: none;
}
#contact .contactBox dl {
	margin:0;
	padding:0;
}
#contact .contactBox dl dt{
	display:inline-block;
	width:23%;
	max-width:8.7rem;
	margin:0;
	padding:0;
}
#contact .contactBox dl dd{
	display:inline-block;
	width:70%;
	padding:0 0 0 2%;
	font-size:1.4rem;
	text-align:left;
	margin:0;
}
#contact .contactBox dl dd h1{
	font-size:1.29032258vw;
	text-align:left;
	margin:0;
	padding:0;
}

@media screen and (max-width:1400px) {
	#contact .contactInner{
		width:100%;
		margin:0 auto;
	}
	#contact .contactBox .info .tel{
		font-size:2.8125vw;
	}
	#contact .contactBox .info a{
		font-size:1.640625vw;
	}
	#contact .contactBox dl dd h1{
		font-size:1.875vw;
	}
}

@media screen and (max-width:1130px) {
	#contact .contactBox{
		display:block;
		width:80%;
		margin:1% auto;
	}
	#contact .contactBox .info .tel{
		font-size:3.185840707vw;
	}
	#contact .contactBox .info a{
		font-size:1.858407079vw;
	}
}

@media screen and (max-width:768px) {
	#contact{
		margin:0 auto 3rem auto;
	}
	#contact .contactBox{
		display:block;
		width:100%;
		margin:2.5% auto;
		padding:2% 0;
	}
	#contact .contactBox .innerTxt{
		display:block;
		width:96%;
		margin:0 auto;
	}
	#contact .contactBox .info{
		display:block;
		width:96%;
		text-align:center;
		margin:0 auto;
	}
	#contact .contactBox .info .tel{
		font-size:9.375vw;
	}
	#contact .contactBox .info a{
		font-size:5.208333333vw;
		padding:1rem 2rem;
	}
	#contact .contactBox dl dd h1{
		font-size:5.625vw;
	}
}

@media screen and (max-width:320px) {
	#contact h1 {
		font-size:9.375vw;
	}
	#contact .contactBox dl dt{
		width:16%;
	}
	#contact .contactBox dl dd{
		width:80%;
	}
	#contact .contactBox .info .tel{
		font-size:9.375vw;
	}
	#contact .contactBox dl dd h1{
		font-size:5.625vw;
	}
	#contact .contactBox dl dd {
		font-size:3.75vw;
	}
}


/*================================================
 * フッター
 ================================================*/
footer{
	width:100%;
	background-color:#E7F1CC;
	margin:0;
	padding:0;
}
footer .footerInner{
	width:77%;
	margin:0 auto;
	padding:6rem 0;
}
footer h1{
	width:20%;
	max-width:30rem;
	margin:0;
	padding:0;
}
footer .pageList{
	margin-left:11%;
	padding:5rem 0 0 0;
}
footer ul{
	width:16%;
	display:inline-block;
	vertical-align:top;
	margin:0;
	padding:0;
}
footer ul li{
	font-size:1.5rem;
	line-height:3rem;
	font-weight:500;
	margin:0;
	padding:0;
}
footer ul li a{
	color:#3f3339;
	margin:0;
	padding:0;
}
footer ul li a span{
	font-weight:600;
	margin:0;
	padding:0;
}
#copyright{
	position:relative;
	width:80%;
	margin:3rem auto 0 auto;
	padding:0 0 0 0;
	font-size:1.2rem;
	text-align:center;
}
#copyright .txt{
	position:relative;
	margin:0;
	padding:0;
}
#copyright .pageLink{
	position:absolute;
	top:0;
	left:0;
	font-size:1.5rem;
	z-index:10;
	margin:0;
	padding:0;
}
#copyright .pageLink a{
	color:#3f3339;
}
#copyright .txt .pc{
	display:block;
}
#copyright .txt .sp{
	display:none;
}

@media screen and (max-width:1400px) {
	footer .footerInner{
		width:97%;
	}
	#copyright{
		width:97%;
	}
}
@media screen and (max-width:1130px) {
	footer .pageList{
		width:98%;
		margin:0 auto;
	}
	footer ul li{
		font-size:1.327433628vw;
		line-height:3rem;
	}
	#copyright{
		font-size:1.1rem;
	}
	#copyright .pageLink{
		font-size:1.4rem;
	}
}
@media screen and (max-width:768px) {
	footer h1{
		width:80%;
		margin:0 auto;
		max-width:30rem;
	}
	footer .footerInner{
		padding:3rem 0 0 0;
	}
	footer .pageList{
		width:96%;
		margin:0 auto;
		padding:5rem 0 0 0;
	}
	footer ul{
		width:48%;
		display:inline-block;
		vertical-align:top;
		margin-bottom:2rem;
	}
	footer ul li{
		font-size:1.5rem;
		line-height:3rem;
	}
	footer ul li a span{
		font-weight:700;
	}
	#copyright{
		position:relative;
		width:94%;
		margin:0 auto;
		padding:2rem 0 2rem 0;
		font-size:1.2rem;
		text-align:center;
	}
	#copyright .txt{
		position:relative;
		padding:1rem 0;
	}
	#copyright .pageLink{
		text-align:left;
		position:relative;
		top:0;
		left:0;
		font-size:1.5rem;
	}
	#copyright .txt .pc{
		display:none;
	}
	#copyright .txt .sp{
		display:block;
	}
}
