@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;
}

h4 {
	font-size:100%;
	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_statute.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";
}

.icon-down {
	position: absolute;
	bottom: 5%;
	left: 0;
	right: 0;
	margin: auto;
	width: 80%;
	text-align: center;
}


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

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

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


/*-- Intro  --*/

#Intro {
	clear:both;
	padding:0;
	overflow:hidden;
	width:100vw;
	border-bottom:1px solid #D2F1C2;
	margin-bottom:5em;
}

#Intro .intro-inner {
	display:block;
	max-width:1200px;
	margin: 0 auto 5em auto;
	overflow:hidden;
}

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

#Intro .imgR {
	float:right;
	width:16%;
	text-align:center;
	color:#666;
	font-size:90%;
}

#Intro .com {
	float:left;
	width:78%;
}

#Intro .com p {
	font-size:105%;
}

#Statute {
    clear: both;
    padding: 0;
    overflow: hidden;
/*    width: 100vw;*/
    width: 100%;
    border-bottom: 1px solid #D2F1C2;
    margin-bottom: 5em;
    padding: 0 20px;
}

#Statute .statute-inner {
    display: block;
    max-width: 1200px;
    margin: 0 auto 8em auto;
    overflow: hidden;
}

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

.innerLink {margin-top:-85px;padding-top:85px;}

@media screen and (max-width: 800px) {
#Statute .statute-inner {
    width: 90vw;
    max-width: 800px;
}
}

@media screen and (max-width: 640px) {
#Statute .statute-inner {
   margin: 0 auto 4em auto;
}

	section#Statute h2 {
	font-size:135%;
	line-height:150%;
	margin-bottom:1em;
	}
}

#Statute p.name {text-align:right;}
#Statute dl.statute {margin-bottom:1.5em;}
#Statute dl.statute dt {font-weight:normal;}
#Statute dl.statute dd {margin: 0.3em 0 0.7em 1em;}


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

#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;
	}
	
	#Intro {
	width:100vw;
	margin-bottom:2em;
	}

	#Intro .intro-inner {
	width:90vw;
	max-width:800px;
	margin-bottom:2em;
	}


	#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%;
	}
	
	#Ptitle {
	padding-bottom:0 !important ;
	}
	
	section#Intro h2 {
	font-size:135%;
	line-height:150%;
	margin-bottom:1em;
	}

	#Intro .imgR {
	float:none;
	width:100%;
	}

	#Intro .intro-inner .com {
	float:none;
	width:100%;
	margin-bottom:1em;
	}

	
	.tx-Lf { text-align:left !important; }

}

/* 別表 */
#Statute h3.sub {
    font-size: 125%;
    color: #3D910D;
    line-height: 180%;
    margin-bottom: 1em;
    font-weight: 500;
    text-align: left !important;
    padding-bottom: 5px;
    padding-top: 20px;
}

#Statute ul.appendix li {
    border: 1px solid #E1E1E1;
}

@media screen and (min-width: 801px) {
#Statute ul.appendix {
      display: flex;
      justify-content: space-between;
      margin-bottom:0;
}

#Statute ul.appendix li {
      width: calc(50% - 10px);
}
}
@media screen and (max-width: 800px) {
#Statute ul.appendix li:nth-of-type(1) {
      margin-bottom:20px;
}
#Statute ul.appendix li {
      max-width: 590px;
}
}