@charset "utf-8";
/* CSS Document */







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



/* ふわっと */

.effect-fade {
  opacity: 0;
  transform: translate(0, 30px); /* フェードインで動く高さを指定 */
  transition: all 2000ms; /* フェードインにかかる時間を指定 */
}
.effect-scroll {
  opacity: 1;
  transform: translate(0, 0);
}
	
body {
	background-size: 100% auto;
	background-image: url(img/back-pc.jpg);	
	background-attachment: fixed;
	background-position: center bottom;
}
img {
	max-width: 100%;
}
h2 {
	font-size: 20px;
	color: #FFFFFF;
	background-color: #3C6832;
	width: 280px;
	border-radius: 30px;	
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 4px;
	margin-top: 30px;
}
h3 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 50px;
	font-weight: 500;
	margin-top: 10px;
}
.rapper {
	width: 800px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.logo {
	width: 300px;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
	margin-bottom: 100px;
}
.img01 {
	width: 300px;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
	margin-bottom: 90px;
}
.img-center {
 	display: block;
	margin-left: auto;
	margin-right: auto;
}
.margin-bt-S {
	margin-bottom: 30px;
} 
.catch-text {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 400;
	font-size: 50px;
	color: #FFFFFF;
	text-align: center;
	text-shadow:0px 0px 2px #006835,-1px -1px 2px #006835,1px -1px 2px #006835,-1px 1px 2px #006835;
}
ul.step4 {
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
	justify-content: space-between;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
ul.step4 li {
	list-style-type: none;	
}
.step4-img {
	width: 170px;
}
ul.kanri {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: flex;
	-ms-flex-wrap: wrap;
    flex-wrap: wrap;
	justify-content: space-between;
}
ul.kanri li {
	list-style-type: none;	
}
.kanri-img01 {
	width: 350px;
}
.kanri-img02 {
	width: 420px;
}
.kanri-frame01 {
	background-color: rgba(255,255,255,0.80);
	border-radius: 5px;
	margin-top: 5px;
	font-family: 'Noto Sans JP', sans-serif;
	padding-top: 8px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	margin-bottom: 25px;
}
.pc-none {
	display: none;
}
.confidential {
	position: absolute;
	right: 10%;
	top: 20px;
	z-index: 100;
	width: 200px;
}

/* youtube */


.movie-wrap {
     position: relative;
     padding-bottom: 45%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
	 width: 80%;
	 display: block;
	 margin-left: auto;
	 margin-right: auto;
	 margin-top: 20px;
	 margin-bottom: 20px;
	 border-radius: 5px;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}


	
/* 共通-表 */

dl,
dt,
dd {
  box-sizing: border-box;
}
dl {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 30px;
	background-color: rgba(238,238,238,0.8);
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 15px;
}
dt,
dd {
  padding: 8px 10px 4px 10px;
  border-top: 2px solid #F3F7FB;
}
dt {
  width: 25%;
  float: left;
}
dd {
	background-color: rgba(255,255,255,0.60);
	margin-left: 25%;
	padding-bottom: 10px;
}
dd:after {
  content: '';
  display: block;
  clear: both;
}
.form-botan {
	font-size: 15px;
	background-color: #3C6832;
	color: #FFFFFF;
	padding-top: 7px;
	padding-bottom: 5px;
	border: 0px none #FFFFFF;
	padding-left: 20px;
	padding-right: 20px;
	margin-right: 10px;
	float: right;
	margin-top: 10px;
	margin-bottom: 8px;
	border-radius: 5px;
	}
.form-S {
	width: 30%;
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;
}
.form-M {
	width: 50%;	
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;
}
.form-L {
	width: 70%;	
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;
}
input {
	font-size: 18px;
	}
textarea {
	font-size: 18px;
	}
}























@media all and (max-width:640px){
	
	
	
	
	
/* ふわっと */

.effect-fade {
  opacity: 0;
  transform: translate(0, 30px); /* フェードインで動く高さを指定 */
  transition: all 2000ms; /* フェードインにかかる時間を指定 */
}
.effect-scroll {
  opacity: 1;
  transform: translate(0, 0);
}
	
body {
	background-size: 100% auto;
	background-image: url(img/back-sm.jpg);	
	background-attachment: fixed;
	background-position: center bottom;
}
img {
	max-width: 100%;
}
h2 {
	font-size: 5vw;
	color: #FFFFFF;
	background-color: #3C6832;
	width: 70%;
	border-radius: 30px;	
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 4px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
}
h3 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-size: 5vw;
	font-weight: 500;
	margin-top: 10px;
	text-align: center;
}
.rapper {
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.logo {
	width: 60%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
	margin-bottom: 50px;
}
.img01 {
	width: 45%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 50px;
	margin-bottom: 40px;
}
.img-center {
 	display: block;
	margin-left: auto;
	margin-right: auto;
}
.margin-bt-S {
	margin-bottom: 20px;
} 
.catch-text {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: 400;
	font-size: 5.6vw;
	color: #FFFFFF;
	text-align: center;
	text-shadow:0px 0px 2px #006835,-1px -1px 2px #006835,1px -1px 2px #006835,-1px 1px 2px #006835;
	margin-bottom: 10px;
}
ul.step4 {
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
ul.step4 li {
	list-style-type: none;
}
.step4-img {
	width: 50%;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
ul.kanri {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
ul.kanri li {
	list-style-type: none;	
}
.kanri-img01 {
	width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
.kanri-img02 {
	width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
.kanri-frame01 {
	background-color: rgba(255,255,255,0.80);
	border-radius: 5px;
	margin-top: 5px;
	font-family: 'Noto Sans JP', sans-serif;
	padding-top: 8px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	margin-bottom: 25px;
	width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
.sm-none {
	display: none;
}
.confidential {
	position: fixed;
	top: 20px;
	z-index: 100;
	width: 200px;
	left:50%;
 	margin-left:-100px;
}


/* youtube */


.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
	 margin-top: 20px;
	 margin-bottom: 20px;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}




/* 共通-表 */

dl,
dt,
dd {
  box-sizing: border-box;
}
dl {
	background-color: rgba(238,238,238,0.8);
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 30px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 15px;
	width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
dt,
dd {
  padding: 4px 10px 6px 10px;
  border-top: 2px solid #F3F7FB;
}
dt {
  float: none;
	
}
dd {
  background-color: rgba(255,255,255,0.60);
  margin-left: 0%;
  padding-bottom: 10px;
}
dd:after {
  content: '';
  display: block;
  clear: both;
}


.form-S {
	width: 60%;
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;

}
.form-M {
	width: 70%;
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;
}
.form-L {
	width: 80%;
	border: 1px solid rgba(220,220,220,1.00);
	border-radius: 5px;
}	
.form-botan {
	font-size: 15px;
	background-color: #3C6832;
	color: #FFFFFF;
	padding-top: 5px;
	padding-bottom: 3px;
	border: 0px none #FFFFFF;
	padding-left: 10px;
	padding-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 10px;
	float: right;
	margin-top: 10px;
	margin-bottom: 8px;
	border-radius: 5px;
	}
input {
	font-size: 18px;
	}
textarea {
	font-size: 18px;
	}

}