/*/////////////////////////////////////////////////////////////////////////////////////////////*/
/* setting */
/*/////////////////////////////////////////////////////////////////////////////////////////////*/



/* body
---------------------------------------------------- */
body {
font-family: -apple-system, BlinkMacSystemFont,"Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
color: #000;
line-height:1.5em;
font-size:100%;
text-align:center;
background:#FFF;
-webkit-text-size-adjust: 100%;
letter-spacing: -0.05em;
}


/*link
---------------------------------------------------- */
A {text-decoration: none; cursor:pointer;} 
A:link { color: #03C; font-weight:bold; } 
A:visited { color: #03C; }
A:active { color: #03C; }
A:hover { color: #03C; text-decoration: underline; }







/*===============================================
共通
===============================================*/

#textsize { float:left; width:60%; text-align:left; margin:5px 0 15px 0; }
#textsize li { display:inline-block; background:#01afec; margin-right:3px;  }
#textsize li a { display:block; padding:2px 6px; color:#000; text-decoration:none; }
#textsize li.title { display:inline-block; background:none; margin-right:3px;  }




.wp {}
/*main { width:774px; margin:0 auto 20px auto; }*/
main { width:999px; margin:0 auto 20px auto; }

.sec01 { text-align:left; margin-bottom:3em; }

.h201 { background:url(../images/bk01.png) top repeat-x; padding:10px; font-size:140%; margin-bottom:20px; }
.h202 { padding: 10px; font-size:140%; margin-bottom:20px; border-bottom:1px dotted #000000 }
.h601 { text-align:center; font-size:140%; font-weight: bold; }
.h602 { margin-bottom:0.5em; font-size:140%; }
.h603 { font-size:140%; font-weight: bold; }
.h604 { font-size:85%; color:#666; text-align:left; font-weight:normal; margin-bottom:5px; }


.h301 { font-size:120%; padding:1em 0; margin:0 0 1em 0; border:1px solid #F36; text-align:center; }
.h301 input { vertical-align:middle; margin-right:0.5em; }
.h303 { color:#532900; font-size:140%; margin-bottom:15px; }


.h401 { color:#A7C93E; font-size:120%; }

.h6btn { text-align:center; background: #e7effc; display: block; padding:15px 0 15px 0;}

.ulform { margin:20px 0; border:1px #CCC solid; }
.ulform li { padding:1em; }
.ulform li:nth-child(2n+1) {background: #fcf3d7; }
.ulform li:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    overflow:hidden;
    font-size:0.1em;
    line-height:0;
}



.nave {
	position: relative;
	float:left;
	line-height:40px;
	width:30%;
    	background: #01afec;
	border:1px solid #FFF;
	text-align:center;
	box-sizing: border-box;
}
 
.nave a {
    display: block;
	color:#FFF;
}

.navetext {
	position: relative;
	float:left;
	line-height:20px;
	width:30%;
	text-align:left;
}

.table01 { width:100%; border: 2px solid #000000 padding:8px;}
.table01 tr { text-align:center; border: 1px solid #dcdcdc; }
.table01 th { vertical-align:middle; padding:10px 8px; border: 1px solid #dcdcdc; text-align:center; background:#01afec;}
.table01 tr td.tbct{ text-align:center; }
.table01 td { text-align:left; vertical-align:middle; padding:10px 8px; }
.table01 tr.tbbl{ background:#e7effc; border: 1px solid #dcdcdc; }



.btn01 { font-size:120%; background:#ff6900; padding:4px 10px; cursor:pointer; margin:1px; }
.btn04 { font-size:140%; background:#01afec; padding:4px 8px; cursor:pointer; margin:1px; }
.btn09 { font-size:120%; background:#01afec; padding:4px 8px; cursor:pointer; margin:1px; }


.btn10 { font-size:100%; background:#ff69b4; padding:4px 8px; cursor:pointer; margin:1px; }
.btn11 { font-size:100%; background:#98fb98; padding:4px 8px; cursor:pointer; margin:1px; }
.btn12 { font-size:100%; background:#ff7103; padding:4px 8px; cursor:pointer; margin:1px; }
.btn13 { font-size:140%; background:#ffffff; padding:4px 8px; cursor:pointer; margin:1px; }
.btn14 { font-size:140%; background:#ffe4e1; padding:4px 8px; cursor:pointer; margin:1px; }
.btn15 { font-size:100%; background:#98fb98; padding:4px 8px; cursor:pointer; margin:1px; }


.item {
    position: relative;
    float:left;
    width:30%;
}

.item02 { 
	background:#FFE4D4; 
	text-align:left;
	margin:10px 0px 10px 0px;;
	padding:10px 10px 10px 10px;
	width:90%;
 }



.p01 { clear:both; text-align:center;  }
.p02 { margin:0.5em 0; }
.p03 { clear:both; text-align:center; margin:3em 0;  }
.p04 { 
	background:#FFE4D4; 
	text-align:left;
	clear:left;
	margin:10px 0px 10px 0px;;
	padding:10px 10px 10px 10px;
	width:90%;
 }

.p05 { text-align:right; padding:0px 15em 0px 0px;  }






.f1 { font-size:smaller; }
.f2 { font-size:100%; }
.f3 { font-size:larger; }


 /* set
---------------------------------------------------- */
.set01 {  }
.set01 li { padding:18px 0; border-bottom:dotted 1px #999; clear:both; }
.set01 li:after {
content: "";
clear: both;
display: block;
}
.set01 h6 { width:20%; float:left; font-size:85%; color:#666; text-align:left; font-weight:normal; }
.set01 h5 { text-align:left; width:80%; float:left;  }


.set02 { margin-bottom:40px; padding-bottom:40px; clear:both; border-bottom:dotted 1px #999; }
.set02:after {
content: "";
clear: both;
display: block;
}

/* article
---------------------------------------------------- */
.art01 { clear:both; text-align:left; }
.art02 { clear:both; margin-bottom:30px; }
.art02:after {
content: "";
clear: both;
display: block;
}
.art03 { clear:both; margin-bottom:30px; padding-top:20px; border-top:dotted 1px #999; }
.art03:after {
content: "";
clear: both;
display: block;
}


/* others
---------------------------------------------------- */
#scrollUp {
    background:url(../images/btn03.png);
    bottom: 10px;
    right: 10px;
    width: 60px;    /* Width of image */
    height: 60px;   /* Height of image */
}




/* photos
---------------------------------------------------- */



/* address
---------------------------------------------------- */






/*===============================================
タブレット用
===============================================*/
@media screen and (min-width: 860px){

.humWP { display:none; }
#humberger { display:none; }

/* layout */

header {min-width:1080px; padding:0px 10px 0 10px; background:#fcf3d7; }
header h1.logo-pc { width:1080px; margin:auto; }
header h1 .logo-pc img:after { content:""; clear: both; display: block;}
header h1.logo-sh { display:none; }
header h5 { width:60px; float:right; margin-right: 30px; margin-top: 50px; }
header h5 img {width:120%;}


.ulform h5 { width:25%; float:left; padding:6px 10px 0 0; }
.ulform div { width:70%; float:right; }
.ulform div.calendar { width:100%; float:none; }
.ulform div.calendar-l { width:60%; float:left; }
.ulform div.calendar-r { width:40%; float:right; }

/*#e7effc →　#FFFFFF*/
footer { min-width:1080px; padding:0px 10px 0 10px; background:#FFFFFF ;}
footer h6 { margin-bottom:20px; }
footer .copyright { font-size:100%; text-align:center; }
footer h1.logo-pc { width:100%;}
footer h1.logo-sh { display:none; }

.btn11 { display:none; }
.btn15 { font-size:100%; background:#98fb98; padding:4px 8px; cursor:pointer; margin:1px; }

.news img {
	margin:0 10px 0 0;
	max-width:90%;
	padding:1px;
	background:white;
	}
}






/*===============================================
スマホ用
===============================================*/
@media screen and (max-width: 859px) {


header { padding-top:10px; background:#fcf3d7; }
header h1.logo-pc { display:none; }
header h1.logo-sh img { width:100%; }
header h5 { width:40px; float:right; }
header h5 img { width:100%; }



main { width: 93%; }



.h201 { padding:10px; font-size:100%; margin-bottom:20px; }
.h202 { padding: 10px; font-size:100%; margin-bottom:20px; border-bottom:1px dotted #000000 }
.btn13 { font-size:90%; background:#ff6900; padding:4px 8px; cursor:pointer; margin:1px; }
.btn14 { font-size:90%; background:#ff6900; padding:4px 8px; cursor:pointer; margin:1px; }


.h501 { width:100%; padding:6px 10px 0 0; text-align:left; }


/*#e7effc →　#FFFFFF*/
footer { padding:0px 10px 0 10px; background:#FFFFFF ; }
footer h6 { margin-bottom:20px; }
footer .copyright { font-size:80%; margin-bottom:10px; text-align:center; }
footer h1.logo-pc { display:none; }
footer h1.logo-sh img { width: 100%;}


/* set
---------------------------------------------------- */
.set01 {  }
.set01 li { padding:16px 0; border-bottom:dotted 1px #999; }
.set01 h6 { width:10em; font-size:85%; color:#666; text-align:left; font-weight:normal; }
.set01 h5 { text-align:left;  }

.news img {
	margin:0 10px 0 0;
	max-width:90%;
	padding:1px;
	background:white;
	}

.table01 { width:100%; }

.btn02 { font-size:70%; background:#ff6900; padding:4px 8px; cursor:pointer; margin:1px; }
.btn04 { font-size:100%; background:#01afec; padding:4px 8px; cursor:pointer; margin:1px; }
.btn09 { display:none; }
.btn11 { font-size:100%; background:#98fb98; padding:4px 8px; cursor:pointer; margin:1px; }
.btn15 { display:none; }


.item {
    position: relative;
    width:80%;
    max-width:100%;
}

.item02 { 
	background:#FFE4D4; 
	text-align:left; 
	margin:20px 0px 10px 0px;;
	padding:1px 5px 1px 5px; 
	width:90%
 }

.p04 { 
	background:#FFE4D4; 
	text-align:left; 
	margin:20px 0px 10px 0px;;
	padding:1px 5px 1px 5px; 
	width:90%
 }



.humWP { background:#99CC00; width:100%; height:40px; position:fixed; top:0; right:0; display:block; }


    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: #99CC00;
    }
    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.2;
        left: -240px;
    }


}

