@charset "utf-8";

/*-----------------------------------------------------	*/
/*	トップページ					*/
/*-----------------------------------------------------	*/

html, body { height: 100%; }

*, *: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;
}


.tx90 { font-size:90%; line-height:120%; }
.tx80 { font-size:80%; line-height:110%; padding-top:0.3em; }
.tx-L { font-size:180%; }
.tx-orange { color:#FF7F00; }
.tx-white { color:#FFF; }
.tx-red { color:#AE1000; }
.tx-blue { color:#00BFFF; }
.tx-navy { color:#33638A; }
.wid50 { width:50%; }

h3 {
	clear:both;
	padding-bottom:0.5em;
	margin: 2em auto  0.5em auto;
	text-align:center !important;
	font-size:120%;
	font-weight:bold;
}

section {
	padding-bottom:80px;
	position:relative !important;
}

/*-- メインビジュアル  --*/

#Visual {
	width:100vw;
	height:25vh;
	max-height:200px;
	/*min-height:device-height;*/
	margin-top:85px;
	padding:0;
	/*color: #fff;*/
}

.mainvis {
	background: url(images/mainvis_contact.jpg) no-repeat;
	background-position: top center;
	background-size: cover;
}

.catch {
	position: absolute;
	top: 30%;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 90%;
	text-align: center;
	font-size:290%;
	font-weight:300;
	line-height:160%;
	text-shadow:rgba(75,45,24,1.0) 1px 1px 6px;
	font-family:"ヒラギノ角ゴ Pro W6";
}

.noborder {
	border-bottom:none !important ;
	margin-bottom:0 !important ;
}

/*-- ページタイトル  --*/

#Ptitle {
	padding-bottom:2em !important ;
	padding-top:1em !important ;
}

#Ptitle h2 {
	font-size:170%;
	line-height:200%;
	text-align:center;
}

/*-- Intro  --*/

#Contact {
	clear:both;
	overflow:hidden;
	padding-bottom: 5em;
	width:100vw;
}

#Contact .contact-inner {
	display:block;
	max-width:1200px;
	margin: 0 auto;
	overflow:hidden;
	padding-top:2em;
}

#Contact .contact-inner p {
	text-align:center;
	padding-bottom:2em;
}

#Contact h2 {
	font-size:170%;
	color:#3D910D;
	line-height:180%;
	margin-bottom:1.5em;
}

/*-- お問い合わせフォーム  --*/

dl.entryform,
dl.entryform-end {
	font-size:100%;
	line-height:160%;
	margin:0 0 1px 0;
	border-top:1px solid #ECFAE4;
	border-right:1px solid #ECFAE4;
	padding:0;
	overflow:hidden;
	_zoom:1;
	background: #ECFAE4;
	display:block;
}

dl.entryform-end {
	border-bottom:1px solid #ECFAE4;
}

dl.entryform dt,
dl.entryform-end dt {
	padding:1em;
	margin:0;
	float:left;
	clear:both;
	width:40%;
	overflow:hidden;
	_zoom:1;
}

dl.entryform dd,
dl.entryform-end dd {
	background:#FFF;
	padding:1em;
	margin:0;
	float:left;
	width:60%;
	line-height:160%;
}

dl.entryform em,
dl.entryform-end em { 
	color:#CC0000;
	font-size:85%;
}

dl.entryform em.bl { 
	color:#888;
	font-size:85%;
}

input.freewrite,
textarea.freewrite {
	height:4em;
	padding:0.5em;
	width:75%;
}

input.freeone {
	height:1.5em;
	padding:0.5em;
	width:75%;
	margin-bottom:0.5em;
}

input.freetel {
	height:1.5em;
	padding:0.5em;
	width:65%;
}

.pad { padding-bottom:5em; !important }

.clear { clear:both; }

.attention {
	color:#CC0000;
	font-size:85%;
	text-align:right;
	padding-bottom:0.2em;
}

.attention-bl {
	font-size:80%;
	padding-top:0.1em;
	text-align:left;
	line-height:130%;
}

.formBtn {
	clear:both;
	margin:2em auto 0 auto;
	text-align:center;
}

.formBtn input.entrybtn,
.formBtn input.resetbtn {
	border-radius:30px;
	-moz-border-radius:30px;
	-webkit-border-radius:30px;
	-o-border-radius:30px;
	padding:0.7em 6em;
	color:#FFF;
	text-decoration:none !important;
	border: 1px solid #64CA2D;
	margin-right:1em;
}

.formBtn input.entrybtn { background:#64CA2D; border:1px solid #64CA2D; }
.formBtn input.resetbtn { background:#999; border:1px solid #999; }


.formBtn input.entrybtn:hover,
.formBtn input.resetbtn:hover {
	opacity:0.6;
}

.contact-box {
	line-height:160%;
	border:1px solid #CEEDF9;
	padding:1.5em;
	margin-top:10px;
	overflow:hidden;
	_zoom:1;
	clear:both;
}


/*-- ドロワーナビ --*/

#page{
	padding-top:0px;
	position: relative;
	z-index: 2;
	left: 0;
	background: #fff;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */

	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}

#drawernav{
	position: fixed;
	top: 0;
	right: -240px;
	width: 240px;
	height: 100%;
	background: #64CA2D;
	color: #fff;
	z-index: 1;
	padding-top: 40px;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000);
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
    }
	
#drawernav ul{
	list-style: none;
	padding: 0;
}

#drawernav ul li.subcat {
	padding-left:1.5em;
	font-size:90%;
}

#drawernav ul li.ttl,
#drawernav ul li a{
	color: #fff;
	display: block;
	padding: 10px 20px;
	text-decoration: none;
	border-top:1px dotted #FFF;
}

#drawernav ul li a:hover,
#drawernav ul li.inquiry a:hover{
	color: #FFF;
	background: #FB7E3C;
}

#drawernav ul li.inquiry a{
	color: #FA6B1F;
	display: block;
	padding: 10px 15px;
	text-decoration: none;
	border-bottom:1px dotted #FFF;
	background:#FCE4CB;
		}

#drawernav h4{
	padding: 0 15px; 
}

#humberger{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 3;
	width: 45px;
	padding: 17px 10px 10px;
	cursor: pointer;
}

.icon-bar{
	height: 2px;
	background: #333;
	display: block;
	margin-bottom: 6px;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
    -o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */

	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}

.fixed-content{
	right: inherit;
	width: 100%;
	z-index: 2;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */

	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}

#overlay{
	z-index:-1;
	opacity: 0;
	background: #000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */

	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}	


/*-----------------------------------------------------	*/
/*	for - 800px					*/
/*-----------------------------------------------------	*/

@media screen and (min-width: 801px) {

	.SP,
	#header { display:none; }	
	
}


@media screen and (max-width: 800px) {
	
	.col {
		float: none;
		width: auto;
		margin: 0 auto;
	}
	
	.PC,
	header#Defhead,
	div#Navmenu {
		display:none;
		visibility:hidden;
	}
	
	#Visual {
	margin-top:0;
	}

	.catch {
		font-size:240%;
		top: 20%;
		width:95%;
	}
	
	#Contact .contact-inner {
	width:90vw;
	max-width:800px;
	}
	
	dl.entryform,
	dl.entryform-end {
	border-left:1px solid #ECFAE4;
	}
	 
	dl.entryform dt,
	dl.entryform-end dt,
	dl.entryform dd,
	dl.entryform-end dd {
	float:none;
	font-size:90%;
	width:auto;
	padding:1em;
	}

	dl.entryform dd,
	dl.entryform-end dd {
	line-height:200%;
	}
	
	.formBtn input.entrybtn,
	.formBtn input.resetbtn {
	margin-bottom:0.5em;
	}
	
	#page{
		padding-top: 50px;
	}
	


}

@media(max-width: 800px) {

	/*-- ドロワーナビ開放時 --*/
	
    body.drawer-opened #page{
        left: -240px;
        box-shadow: 1px 0 2px #000;
        -webkit-box-shadow: 1px 0 2px #000;
    }
    body.drawer-opened .fixed-content{
        left: -240px;
    }
    body.drawer-opened #drawernav{
        right: 0;
    }
    body.drawer-opened #humberger .icon-bar{
        background: #fff;
    }
    body.drawer-opened #humberger :nth-child(1){
        transform:translate(0,8px) rotate(45deg);
        -webkit-transform:translate(0,8px) rotate(45deg);
    }
    body.drawer-opened #humberger :nth-child(2){
        transform:translate(-20px ,0);
        -webkit-transform:translate(-20px ,0);
        opacity:0;
    }
    body.drawer-opened #humberger :nth-child(3){
        transform:translate(0,-8px) rotate(-45deg);
        -webkit-transform:translate(0,-8px) rotate(-45deg);
    }
    body.drawer-opened #overlay{
        z-index: 3;
        opacity: 0.3;
        left: -240px;
    }
	
	section#Inq input { width:50% !important; }
	section#Inq input.widno { width:30% !important; }

}

@media screen and (min-width: 641px) {

	.SPP { display:none; }	
}


@media screen and (max-width: 640px) {
	
	.PCC,
	.comment02.SP {
		display:none;
		visibility:hidden;
	}

	section {
		padding-bottom:1em;
	}
	
	.catch {
		font-size:150%;
		top: 20%;
	}
	
	.icon-down {
		width: 10%;
	}
	
	dl.entryform dt,
	dl.entryform-end dt,
	dl.entryform dd,
	dl.entryform-end dd {
	float:none;
	font-size:90%;
	width:auto;
	padding:1em;
	}

	dl.entryform dd,
	dl.entryform-end dd {
	line-height:200%;
	}

	input.freewrite,
	input.freeone {
	width:85%;
	}

	input.freetel {
	width:55%;
	}
	
	.btn-submit input,
	.btn-submit a img {
	text-align:center !important;
	display:block;
	width:100%;
	}
	
	.contact-box {
	font-size:90%;
	}
	
	textarea ,
	input[type="text"],
	input[type="tel"],
	input[type="email"] {
	font-size:16px;
	}

	.spbr {
	display:block;
	}

	input.freewrite, 
	textarea.freewrite {
	width:85%;
	}
	
	.formBtn input.entrybtn,
	.formBtn input.resetbtn {
	padding:0.7em 2em;
	}

	#Contact {
	padding-bottom:1em;
	}

	#Contact .contact-inner {
	padding-top:0;
	}

	#Contact .contact-inner p {
	text-align:left;
	}

	
}