@charset "UTF-8";

/* 640px */
@media only screen and (max-width:640px) {



#menuBtn {z-index: 1001; display: block; width: 50px; height: 50px; background: #008977; position: fixed; right: 10px; bottom: 40px;}
	#menu-icon {
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  width: 30px;
	  height: 2px;
	  margin: -1px 0 0 -15px;
	  background: #FFFFFF;
	  transition: .2s;
	}
	#menu-icon:before, 
	#menu-icon:after {
	  display: block;
	  content: "";
	  position: absolute;
	  top: 50%;
	  left: 0;
	  width: 30px;
	  height: 2px;
	  background: #FFFFFF;
	  transition: .3s;
	}
	#menu-icon:before {
	  margin-top: -12px;
	}
	#menu-icon:after {
	  margin-top: 10px;
	}
	#menuBtn:hover #menu-icon:before {
	  margin-top: -14px;
	}
	#menuBtn:hover #menu-icon:after {
	  margin-top: 12px;
	}
	#menuBtn #menu-icon.close {
	  background: transparent;
	}
	#menuBtn #menu-icon.close:before, 
	#menuBtn #menu-icon.close:after {
	  margin-top: 0;
	}
	#menuBtn #menu-icon.close:before {
	  transform: rotate(-45deg);
	  -webkit-transform: rotate(-45deg);
	}
	#menuBtn #menu-icon.close:after {
	  transform: rotate(-135deg);
	  -webkit-transform: rotate(-135deg);
	}

	.spbr {display: inline;}
	.pcsp {display: none;}
	.btn.btnL {width: 100%; font-size: 18px; line-height: 38px; height: 38px;}
	.btn.btnL:after {width: 8px; height: 8px; margin-top: -6px;}
	img {max-width: 100%; height: auto;}
	header {position: relative;}
	header .header .content {padding: 5px 0;}
	header .header .content h1 {height: auto; line-height: 1.4em; padding-left: 78px; padding-top: 5px; padding-bottom: 5px; background-position: 10px 50%; background-size: 50px;}
	header .btn { position: fixed; width: 100%; bottom:0; left:0; border-radius: 4px 4px 0px 0px; padding:0; text-align: center; z-index: 100; }
	header nav {transition: 0.4s ease-in-out; position: fixed; left:-100%; top:0; width: 100%; height: 100vh; z-index: 1000; }
	header nav.open {left:0;}
	header nav .navi {display: block;}
	header nav .navi li {border-bottom: 1px solid #fff;}
	header nav .navi li.sp {display: block;}
	header nav .navi li a {padding: 10px 20px; font-size: 16px;}
	main { margin-top: 0px;}
	.content { box-sizing: border-box; }
	#wrap .content { padding:60px 15px;}
	#wrap .content h1 {margin-bottom: 20px; font-size: 24px;}
	#wrap .content p:last-child {margin-bottom: 0px;}

	#wrap #sec00 {background-position:100% 50%;}
	#wrap #sec00 .content {padding: 40px 15px;}
	#wrap #sec00 .content h1 {text-align: center;}
	#wrap #sec00 .content h1 .maintitle {margin-right: 0px; margin-bottom: 10px;}
	#wrap #sec00 .content h1 .subtitle {max-width: 40%;}
	#wrap #sec00 .content p {font-size: 18px;}
	#wrap #sec00 .content dl {font-size: 14px;}
	#wrap #sec00 .content dl dt {width: 25%; padding: 0;}
	#wrap #sec00 .content dl dd {padding-left: 26%; padding: 0; margin-bottom: 5px;}

	#wrap .content .whiteboxlist {display: block;}
	#wrap .content .whiteboxlist li { width: 100%; text-align: left; box-sizing: border-box; padding: 10px; margin-bottom: 15px; }
	#wrap .content .whiteboxlist li br {display: none;}

	/*#wrap .content .h2textbox { padding-left: 18px; }*/
	#wrap .content .h2textbox h2 { font-size: 20px; letter-spacing: 0px; line-height: 1.4em; }
	/*#wrap .content .h2textbox h2:before {width: 14px; height: 14px; top: 6px;}*/
	#wrap .content .h2textbox p {font-size: 1em;}
	#wrap .content .h2textbox h3 {font-size: 1em; margin-bottom: 6px;}

	#wrap .content .left ,
	#wrap .content .right {float: none; width: 100%;}
	#wrap .content .right h2 ,
	#wrap .content .right h3 {text-align: center;}
	#wrap .content .left {text-align: center; margin-top: 15px;}

	#wrap .content .textbox {margin-top: 20px; margin-bottom: auto;}
	#wrap .content .infolist dt {width: 100%; float: none;}
	#wrap .content .infolist dd {padding: 10px 0; text-align: center; font-size: 16px;}
	#wrap .content .infolist .text-s {font-size: 12px;}
	#wrap .content .infolist .caution {text-align: left; font-size: 11px; line-height: 1.3em;}
	#wrap .content .infolist dd b {display: block;}

	footer .content {padding: 40px 15px; }
	footer .content .left {float: none; display: block;}
	footer .content .right {float: none; display: block; width: 100%; text-align: center;}
	footer .content .right h2 {font-size: 16px;}
	footer .content .right .font_min {font-size: 30px;}
	footer .copy {margin-top: 30px;}
	footer .content .right .font_min img {height: 26px;}

}/* 640px */