.txtEx {
	text-indent: 120%;
	white-space: nowrap;
	overflow: hidden;
}
.PC {display: inherit;}
.SP {display: none;}

:root {
	--font-default: YuGothic, "Yu Gothic Medium", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "sans-serif";
	--font-Mincho:  "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

}

html {
	font-size: 62.5%; /*1rem = 10px*/
	font-size: 1.33vw; /*defaultFontsize / maxWidth * 100*/
	/*max-width: 750px;*/ /*maxWidth*/
	margin: 0 auto;
}
  /*deviceWidth 750px 以上の時 全体のフォントサイズ 10px に固定*/
  @media screen and (min-width: 750px) {
    html {
      font-size: 10px; /*defaultFontsize*/
    }
  }
body {
	font-family: var(--font-default);
	width: 100%;
	margin: 0 auto;
	/*overflow-x: hidden;*/
	height: 200vh;
}
html > body img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
picture {
	display: inline-block;
	vertical-align: bottom;
}
a[class] {
	transition: opacity 0.12s;
}
	a[class]:hover {
		opacity: 0.8;
	}

/*--------------------
No1*/

/*--No2*/

/*No3*/


header {
	background: #fff;
}
header .wrap {
	display: flex;
		align-items: center;
		justify-content: space-between;
	max-width: 750px;
	width: 100%;
	margin: 0 auto;
	padding: 1.8rem 1.4rem 1.8rem 2rem;
}
header .logo {
	width: 34.1rem;
	max-width: 341px;
}
header .tel {
	width: 22.5rem;
	max-width: 225px;
}
header .contact {
	width: 6.4rem;
	max-width: 64px;
}


.img {
	position: relative;
	display: flex;
		justify-content: center;
	width: 100%;
	overflow: hidden;
}
.img > h1 img,
.img > img {
	width: 200rem;
	max-width: 2000px;
	margin: 0 auto;
}
.btnarea {
}
.box {
	position: absolute;
		left: 50%;
		transform: translateX(-50%);
	width: 75rem;
}
.box .w100 {
	width: 100%;
}

.buy {
	text-align: center;
}
.buy .box {
		bottom: 4rem;
}
.buy .btn {
	display: inline-block;
	width: 100%;
	max-width: 60rem;
}

.conc {}
.conc .txt {
	padding-top: 2rem;
	color: #1a1a1a;
	font-size: 2.4rem;
	text-align: center;
	line-height: 1.93;
}
.conc .txt strong {
	color: #5e896f;
	font-size: 3.4rem;
	font-weight: bold;
}
.conc .txt .mark {
	display: inline-block;
	margin: 1rem 0 2rem 0;
	padding: 0 3rem;
	color: #fff;
	font-size: 4.4rem;
	font-weight: bold;
	line-height: 1.4;
	letter-spacing: 0.08em;
	background: #bccec2;
	box-shadow: 0.6rem 0.6rem 0.6rem rgba(0,0,0,0.16)
}
.conc .txt.t02 {
	margin-top: 50rem;
}

.silk01 {}
.silk01 .txt {
	text-align: center;
}
.silk01 .txt h2 {
	margin-bottom: 1rem;
	color: #5e896f;
	font-size: 4.6rem;
	font-weight: bold;
}
.silk01 .txt p {
	color: #333;
	font-size: 3rem;
	font-weight: bold;
}
.silk01 .txt.t02 {
	margin-top: 58rem;
}
.silk01 .txt.t02 p {
	margin-bottom: 2rem;
	font-size: 2.4rem;
	font-weight: normal;
	line-height: 1.9;
}
.silk01 .txt.t02 h2 {
	font-size: 3.2rem;
	letter-spacing: 0.08em;
}

.need {}
.need .txt {
	margin-top: 18rem;
	padding: 0 6.6rem;
	color: #fff;
}
.need .txt p {
	margin-bottom: 1rem;
	font-size: 2.8rem;
	line-height: 1.72;
}
.need .txt h2 {
	font-size: 3.8rem;
	font-weight: bold;
	letter-spacing: 0.08em;
	line-height: 1.56;
}
.need .boxbtn {
    bottom: 72rem;
    text-align: center;
}
.need .btn {
    display: inline-block;
    width: 100%;
    max-width: 60rem;
}

.point {}
.point .txt {
}
.point .txt h2 {
	color: #333;
	font-size: 4.1rem;
	line-height: 1.36;
}
.point .txt h2 mark {
	color: #5e896f;
	font-size: 4.6rem;
	background: none;
}
.point .txt p {
	margin-top: 1rem;
	padding: 0 6.6rem;
	font-size: 2.4rem;
	line-height: 1.76;
}
.point01 .txt h2 {
	margin-top: 2rem;
	padding-left: 21rem;
}
.point01 .txt p {
	margin-top: 30rem;
}
.point02 .txt {
	padding: 0 2.6rem;
	margin-top: 34rem;
}
.point02 .txt h2 {
	color: #5e896f;
}
.point02 .txt h2 mark {
	display: inline-block;
	margin-bottom: 1rem;
	padding: 0 2rem;
	color: #fff;
	font-size: 4.6rem;
	line-height: 1.4;
	letter-spacing: 0.08em;
	background: #5e896f;
}
.point02 .txt p {
	padding: 0;
	width: 45.4rem;
}
.point03 .txt {
	padding: 0 2.6rem;
	margin-top: 22rem;
}
.point03 .txt h2 {
	color: #fff;
	font-size: 4rem;
}
.point03 .txt h2 span {
	display: inline-block;
	margin-bottom: 1rem;
	text-indent: 1.6rem;
	padding: 0 2rem;
	color: #fff;
	font-size: 3.4rem;
	letter-spacing: 0.08em;
}
.point03 .txt h2 mark {
	display: inline-block;
	margin-bottom: 1rem;
	padding: 0 3rem;
	color: #333;
	font-size: 4.1rem;
	line-height: 2;
	letter-spacing: 0.08em;
	background: #ffffff;
}
.point03 .txt p {
	padding: 0;
	color: #fff;
}
.point03 .txt .drp01 {
	text-shadow: 0 0 0.6rem #0097e2, 0 0 2rem #0097e2
}
.point03 .txt .drp02 {
	text-shadow: 0 0 0.6rem #0097e2, 0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2,
	0 0 2rem #0097e2;
}
.point04 .txt {
	padding: 0 2.6rem;
	margin-top: 35rem;
	text-align: center;
}
.point04 .txt h2 {
	color: #5e896f;
	font-size: 4.1rem;
}
.point04 .txt p {
	padding: 0;
	color: #1a1a1a;
	line-height: 1.76;
}
.point04 .boxbtn {
		bottom: 8rem;
	text-align: center;
}
.point04 .btn {
	display: inline-block;
	width: 100%;
	max-width: 60rem;
}

.howto {}
.howto .txt {
	color: #1a1a1a;
}
.howto .txt p {
	padding: 0 5rem 0 28rem;
	font-size: 2.4rem;
	line-height: 1.6;
}
.howto .txt p.how01 {
	margin-top: 21rem;
	margin-bottom: 13rem;
}
.howto .txt p.how02 {
	margin-bottom: 11rem;
}
.howto .txt p.how03 {
	margin-bottom: 2rem;
}

.voice {}
.voice .txt {
	color: #1a1a1a;
}
.voice .txt p {
	padding: 0 6rem 0 23rem;
	font-size: 2.4rem;
	line-height: 1.6;
}
.voice .txt p.voice01 {
	margin-top: 8rem;
	margin-bottom: 15rem;
}
.voice .txt p.voice02 {
	margin-bottom: 16rem;
}
.voice .txt p.voice03 {
	margin-bottom: 2rem;
}

.detail {}
.detail .txt {
	color: #1a1a1a;
}
.detail .txt h2 {
	margin-bottom: 2rem;
	padding: 0 6rem;
	color: #fff;
	font-size: 2.4rem;
	font-weight: normal;
	line-height: 2;
}
.detail .txt p {
	padding: 0 6rem;
	font-size: 2.4rem;
	line-height: 1.6;
}
.detail .txt p.detail01 {
	margin-bottom: 3rem;
}
.detail .txt p.detail02 {
	margin-bottom: 1rem;
}
.detail .txt p.detail03 {
	margin-bottom: 4rem;
}

.cv {}
.cv .txt {
}
.cv .cvwrap {
	position: relative;
}
.cv .cvwrap .btn {
	position: absolute;
		z-index: 100;
		right: 9rem;
		bottom: 6rem;
	display: inline-block;
	width: 35rem;
}
.cv .cvwrap .btn.short {
		bottom: 5rem;
}



footer {
	background: #fff;
}
footer .wrap {
	width: 100%;
	max-width: 750px;
	margin: 0 auto;
	padding: 3.6rem 0;
}
footer small {
	display: block;
	width: 62.6rem;
	max-width: 626px;
	margin: 0 auto;
}



.fvwrap {
	position: relative;
}
.fvbtnwrap {
	position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	display: flex;
		justify-content: space-between;
	padding: 0 3.1rem;
}
.fvbtn {
	display: block;
	width: 21.6rem;
	height: 12.7rem;
	border-radius: 1rem;
	background: #fff;
	opacity: 0;
}
	.fvbtnwrap .fvbtn:hover {
		opacity: 0.3;
	}

.toTop {
	pointer-events: none;
	position: fixed;
		bottom: 6rem;
		right: 1.8rem;
	display: block;
	width: 8.4rem;
	transition: opacity 0.15s;
	opacity: 0;
}
.toTop img {
	width: 8.4rem;
}
	.toTop.is-active {
		pointer-events: auto;
		opacity: 1;
	}