@charset "utf-8";

/* .contents { margin: 0 auto; } */

.iframe-wrap {
  text-align: center;
  width: 66.12%;
  padding-bottom: 37.19%;
  height: 0px;
  position: relative;
  margin: 30px auto;
}

.iframe-wrap iframe {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.featureItems {
    width: 900px;
    margin: 0 auto;
    padding: 20px 0;
}
.featureItems .featureImg {
    width: 300px;
    margin: 20px auto;
}
.featureItems .featureImgL {
    width: 600px;
    margin: 20px auto;
}

.featureItem {
	width: 500px;
    margin: 20px auto;
}
.featureItemL {
	width: 840px;
    margin: 20px auto;
}
.featureItem .title {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 16px;
	font-weight: bold;
}
.featureItemL .title {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 16px;
	font-weight: bold;
}
.featureItem .description {
    margin-bottom: 16px;
}
.featureItemL .description {
    margin-bottom: 16px;
}
.featureItem .description a {
	text-decoration: underline;
}
.featureItemL .description a {
	text-decoration: underline;
}

.featureItemL .description ul li {
  list-style-type: disc;
}

.featureItemL .description img {
  width: 18px;
  vertical-align: middle;
  margin: 0 4px;
}

.guide {
    width: 900px;
    margin: 0 auto;
    /* border-top: solid 1px #ccc; */
    padding: 20px;
}
.guideItems {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width: 900px;
    margin-bottom: 40px;
}
.guideItems .title {
    font-size: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
	font-weight: bold;
}
.guideItems .txt { margin-bottom: 20px; }
.guideItems .txt a { text-decoration: underline; }
.guideItems .txt img {
    width: 18px;
    vertical-align: middle;
    margin: 0 4px;
}
.guideItems .note {
	margin-bottom: 20px;
	font-size: 14px;
}
.guideItems .img-sp {
    width: 240px;
    margin: 0 auto;
    margin-top: 10px;
				margin-bottom: 30px;
    border: 1px solid #ccc;
}
_:-ms-lang(x)::-ms-backdrop, .guideItems .img-sp {
    border: none;
}
.guideItems .img-cd {
    width: 360px;
    height: 270px;
    margin: 0 auto;
    margin-top: 10px;
				margin-bottom: 30px;
}
_:-ms-lang(x)::-ms-backdrop, .guideItems .img-cd {
    border: none;
}
.guideItems .img-gif {
    width: 300px;
    margin: 0 auto;
    margin-top: auto;
}
_:-ms-lang(x)::-ms-backdrop, .guideItems .img-gif {
    border: none;
}

.figImg {
    width: 200px;
    padding: 20px 40px;
}
.figItems {width: 640px;}
.figItems .txt:first-child {padding: 80px 30px 30px 0;}
.figItems .txt {padding: 30px 30px 30px 0;}
.figItems .txt a {text-decoration: underline;}
.linkBtn2 {margin-top: 30px;}
.linkBtn2 a {color: #fff;}


@media only screen and (min-width:641px) and (max-width:999px) {
    .titleImg {
        width: 300px;
        padding: 0;
        margin: 0 auto;
    }
    .keyImg {
        width: 600px;
        padding: 0;
        margin: 0 auto;
    }
    .pageSubTitle {
        width: 100%;
	}
    .featureItems { width: 80%; }
    .featureItem, .featureItemL {
        width: 80%;
        margin: 0 auto;
    }
    .featureItems .featureImg {
        width: 100%;
        text-align: center;
        margin: 20px auto;
    }
    .featureItems .featureImgL {
        width: 100%;
        text-align: center;
        margin: 20px auto;
    }
    .featureItems .featureImg img {width: 240px;}
    .featureItems .featureImgL img {width: 480px;}

	.guide { width: 80%; }
	.guideItems {
		margin: 0 auto 40px;
	}

    .figImg {
        width: 100%;
        text-align: center;
							 padding: 60px 0 0 0;
    }
    .figImg img {width: 240px;}
    .figItems {
        width: 80%;
        margin: 0 auto;
    }
				.figItems .txt:first-child {padding: 30px;}
    .figItems .txt {padding: 30px;}

}

@media only screen and (max-width: 640px) {
    .featureItems { width: 80%; }
    .titleImg {
        width: 60vw;
        padding: 0;
        margin: 0 auto;
    }
    .keyImg {
        width: 90vw;
        padding: 0;
        margin: 0 auto;
    }
    .pageSubTitle {
        width: 100%;
        font-size: 6.4vw;
        margin: 5vw 0;
        padding-top: 4vw;
    }

    .featureItems {
        width: 80vw;
        padding: 4vw 0;
    }
    .featureItems .featureImg {
        width: 80vw;
        text-align: center;
        margin: 20px auto;
    }
    .featureItems .featureImg img {width: 50vw;}
    .featureItem, .featureItemL {width: 80vw;}
    .featureItem .title {
        font-size: 5.5vw;
		/* text-align: center; */
    }
    .featureItemL .title {
        font-size: 5.5vw;
		/* text-align: center; */
    }
    .featureItemL .description img {
      width: 4vw;
      vertical-align: middle;
      margin: 0 1vw;
    }
			.figItems .txt:first-child {padding: 3vw 6vw;}
			.figItems .txt {padding: 3vw 6vw;}

    .guide {
        width: 80%;
        margin: 0 auto;
        padding: 4vw;
    }
    .guideItems {
        width: 100%;
        margin: 0 auto 6vw;
    }
    .guideItems .title {
        font-size: 4.8vw;
        margin-bottom: 4vw;
    }
    .guideItems .txt { margin-bottom: 4vw; }
    .guideItems .img-sp {
        width: calc(100vw*360/640);
    }
	.guideItems .img-cd {
        width: calc(100vw*480/640);
        height: calc(100vw*360/640);
    }

    .figImg {
        width: 100%;
        text-align: center;
        padding: 10vw 0vw 0vw 0vw;
    }
    .figImg img {width: 60vw;}
    .figItems .txt {padding: 3vw 6vw;}
    .linkBtn2 {margin-top: 4vw;}
    .iframe-wrap {
      width: 100%;
      padding-bottom: 56.25%;
    }
}