*{
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
	font-size: 100%;
	list-style: none;
}
html{
	font-size: 62.5%;
	-webkit-font-smoothing: antialiased;
}
body{
	font-size: 2rem;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	line-height: 2;
	line-break: strict;
	overflow-wrap: break-word;
	word-wrap: break-word;
	position: relative;
}
body::after{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background: url(./images/body-bg2.jpg) no-repeat center;
	background-size: cover;
	z-index: -1;
}
.shadow{
	box-shadow:0 0 20px rgba(0,0,0,0.2);
	width: 100%;
	max-width: 800px;
	margin: auto;
	background-color: #fff;
	overflow: hidden;
}
amp-img,img{display:block;width:100%;height:auto;}
a{text-decoration:none;}
strong{background:linear-gradient(transparent 40%, #ffff66 0%);}
em{color:#dd3a5f;font-style:normal;font-weight:bold;}

.formbox {  
    padding: 0 0 3%;
    margin: 0;
    font-weight: bold;
    text-align: center;background: url(./images/form_bg.png?1120)  center;
}

.cta{
	padding: 10px 0;
	bottom: 11%;

}
.cta span{
	display: block;
	width: 95%;
	margin: 30px auto 20px;
}
.cta a{
	width: 92%;
	margin: auto;
}
.cta2{
	padding-bottom: 150px;
}
.formbox p{text-align: center;font-size: 2rem;line-height: 1.8; font-weight: 400;}
.btn{
	display: block;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.btn::after{
	content: "";
	display: block;
	width: 30px;
	height: 100%;
	position: absolute;
	top: -180px;
	left: 0;
	background-color: #fff;
	opacity: 0;
	transform: rotate(45deg);
	animation: reflect 2s ease-in-out infinite;
}
@keyframes reflect{
	0%{transform:scale(0)rotate(45deg);opacity:0;}
	80%{transform:scale(0)rotate(45deg);opacity:0.5;}
	81%{transform:scale(4)rotate(45deg);opacity:1;}
	100%{transform:scale(50)rotate(45deg);opacity:0;}
}

.btn:hover{
	cursor: pointer;
	opacity: 0.8;
}


.con_txt {
    margin: 3% 30px;
    padding: 0;
}
.con_txt p {
	font-size: 25px;
}
.hdr{
	width: 100%;
	background: #b80a50;
	color: #fff;
	font-size: 120%;
	line-height: 1.4;
	text-align: center;
	padding: 30px 4%;
	margin-bottom: 50px;
	position: relative;
}
.hdr::after{
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: solid 20px transparent;
	border-top: solid 20px #b80a50;
	position: absolute;
	bottom: -39px;
	left: 50%;
	transform: translate(-50%, 0);
	z-index: 1;
}
.hdr span{
	display: block;
	font-size: 140%;
	color: #ffedc3;
}
.hdr-gold{
	background: #856700;
	background: linear-gradient(90deg, rgba(133, 103, 0, 1) 0%, rgba(196, 168, 77, 1) 50%, rgba(133, 103, 0, 1) 100%);
	font-family: serif;
}
.hdr-gold::after{
	border-top-color: #C4A84D;
}
.form{padding: 3%;}

.form .btn{
	width: 92%;
	left: 4%;
	top: 21.5%;
}
.form p {
    text-align: center;
    margin: 1% auto 1%;
    font-size: 1.8rem;
    line-height: 1.8;
}
.koe{
	padding: 40px 5% 10px;
	background: url(./images/voice_bg.jpg) repeat-y center top;
	background-size: 100% auto;
}
.koe h2{
	width: 92%;
	margin: 0 auto 30px;
}
.koe section{
	margin-bottom: 40px;
}
.koe section:last-child{
	margin-bottom: 0;
}
.koe h3{
	width: 100%;
	margin: auto;
	z-index: 1;
}
.koe div{
	background: #fff;
	padding: 2em 0;
}



input{
	display: none;
}
label{
	display: block;
	position: relative;
	height: 8em;
	overflow: hidden;
	margin-top: -1em;
	transition: 0.2s;
}
input:checked + label{
	height: auto;
	margin-top: 0;
}
label::before{
	content: "";
	display: block;
	width: 100%;
	height: 80px;
	position: absolute;
	left: 0;
	bottom: 0;
	background: linear-gradient(0deg, rgba(255,255,255,1) 10%, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%);
}
label::after{
	content: "続きを読む";
	display: block;
	width: 7em;
	padding: 1em;
	color: #fff;
	background: #4872fc;
	text-align: center;
	line-height: 1;
	font-weight: bold;
	border-radius: 5px;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 0);
}
input:checked + label::before{
	display: none;
}
input:checked + label::after{
	position: static;
	content: "閉じる";
	transform: translate(0, 0);
	margin: 1em auto 0;
	background: #666;
}
label:hover{
	cursor: pointer;
}



.tokucho{
	background: url(./images/bg-pink.jpg) repeat-y center top;
	background-size: 100% auto;
	padding-bottom: 80px;
}
.tokucho section{
	width: 92%;
	margin: 40px auto 0;
	background: #fff;
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
}
.tokucho h3{
	width: 90%;
	margin: auto;
}
.tokucho div{
	padding: 2em;
}



.note{
	background-image:
		linear-gradient(90deg, transparent 0%, transparent 50%, #fff 50%, #fff 100%),
		linear-gradient(180deg, #ccc 1px, transparent 1px);
	background-size: 8px 100%,100% 2em;
	line-height: 2em;
	padding-bottom: 1px;
}
.note > *{
	line-height: 1;
}



.merit{
	padding-bottom: 70px;
	background: url(./images/bg-violet2.jpg) repeat-y;
	background-size: 100% auto;
}



.tokuten{
	padding: 60px 4%;
	background:
		url(./images/ribbon-left-top.png),url(./images/ribbon-right-btm.png),url(./images/bg-yellow.jpg);
	background-repeat: no-repeat,no-repeat,repeat-y;
	background-size: 140px 140px,140px 140px,100% auto;
	background-position: left top,right bottom,center;
}
.tokuten h2{
	width: 96%;
	margin: 0 auto 40px;
}
.tokuten figure{
	border: solid 1px #fff;
	margin-bottom: 30px;
}
.tokuten-gentei{
	background: url(./images/bg-gold2.jpg) repeat-y;
	background-size: 100% auto;
}



.step{
	margin: 5% 0 0 ;
	padding: 0px 0 30px;
	background: url(./images/bg-violet2.jpg) repeat-y;
	background-size: 100% auto;
}
.step h2{
	width: 85%;
    margin: 0 auto 5%;
}
.step figure{
	position: relative;

}
.step .btn{
	width: 92%;
	left: 4%;
	top: 21.5%;
}
.step p {
    text-align: center;
    margin: 1% auto 1%;
    font-size: 1.8rem;
    line-height: 1.8;
}



.prof{
	padding-bottom: 40px;
	background: url(./images/prof_bg.jpg) repeat-y;
	background-size: 100% auto;
	position: relative;
}
.prof::before{
	content: "";
	display: block;
	width: 120%;
	height: 120px;
	background:  url(./images/crown.png) no-repeat center;
	background-size: contain;
	position: absolute;
	top: -17px;
	left: -10%;
}
.prof h3{
	padding-top: 40px;
}
.prof div{
	background: #fff;
	width: 88%;
	margin: auto;
	padding-bottom: 2em;
}
.prof div figure{
	margin-bottom: 2em;
}
.prof .photo{
	display: block;
	border: solid 2px #fff;
	box-shadow: 0 20px 20px rgba(0,0,0,0.1);
	margin: 2em 5% 3em;
}
.prof .note{
	width: 90%;
	margin: auto;
}



.recommend{
	background: url(./images/bg-blue.jpg) repeat-y;
	background-size: 100% auto;
	padding: 80px 0;
}
.recommend figure{
	width: 94%;
	margin: auto;
}



footer{
	padding: 40px 2% 220px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	font-size: 75%;    background: #e8d4b6;
}
footer a{
	color: #333;
	transition: 0.2s;
}
footer a:first-child::after{
	content: "|";
	display: inline-block;
	margin: 0 10px;
}
footer a:nth-child(-n+2)::after {
    content: "|";
    display: inline-block;
    margin: 0 10px;
}
footer a:hover{
	opacity: 0.5;
}



.btn-fixed{
	width: 100%;
	max-width: 600px;
	position: fixed;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 100;
}
.btn.btn-fixed{
	animation: 0;
}
.trigger{
	height: 1000px;
	position: absolute;
	top: 0;
	z-index: -100;
}



@media only screen and (max-width: 767px){
.con_txt p {font-size: 17px;}
.con_txt { margin: 3% 20px;}
body{font-size: 1.8rem;}
body::after{background: 0;}
strong{background:linear-gradient(transparent 50%, #ffff66 0%);}

.cta span{
	width: 100%;
	margin: 15px auto ;
}
.cta a{
	width: 94%;
}
.cta2{
	padding-bottom: 90px;
}
.cta { bottom: 12%;}

.formbox p{font-size: 1.3rem;margin:0 auto ;}
.form p {font-size: 1.3rem;}
.form .btn {
    width: 100%;
    left: 0%;
    top: 21.5%;
}
.prof div {
    width: 90%;
}
@keyframes click{
	30%{top:0;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
	35%{top:2px;box-shadow: 0 0 0 rgba(0,0,0,0.8);}
	40%{top:0;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
	45%{top:2px;box-shadow: 0 0 0 rgba(0,0,0,0.8);}
	50%{top:0;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
}



.hdr{
	font-size: 120%;
	padding: 20px 4%;
	margin-bottom: 25px;
}
.hdr::after{
	border: solid 15px transparent;
	border-top: solid 15px #dd5171;
	bottom: -29px;
}
.hdr span{
	font-size: 80%;
}
.hdr-gold::after{
	border-top-color: #C4A84D;
}



.koe{
	padding: 0 auto;
}
.koe h2{
	margin: 0 auto 20px;
}
.koe section{
	margin-bottom: 30px;padding: 0 4% 0;
}
.koe div{
	padding: 1.5em 1em;
}



label::after{
	padding: 0.8em;
}


.step p {
    text-align: center;
    margin: 1% auto 1%;
    font-size: 1.6rem;
    line-height: 1.8;
}
.tokucho{
	padding-bottom: 40px;
}
.tokucho section{
	margin: 20px auto 0;
}
.tokucho div{
	padding: 1em;
}



.merit{
	padding-bottom: 30px;
}



.tokuten{
	padding: 30px 4%;
	background-size: 80px 80px,80px 80px,100% auto;
}
.tokuten h2{
	margin: 0 auto 20px;
}
.tokuten figure{
	margin-bottom: 10px;
}
.tokuten-gentei{
	background: url(./images/bg-gold2.jpg) repeat-y;
	background-size: 100% auto;
}



.step{

}
.step h2{
	margin-bottom: 30px;
}
@keyframes click2{
	30%{top:21.5%;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
	35%{top:calc(21.5% + 2px);box-shadow: 0 0 0 rgba(0,0,0,0.8);}
	40%{top:21.5%;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
	45%{top:calc(21.5% + 2px);box-shadow: 0 0 0 rgba(0,0,0,0.8);}
	50%{top:21.5%;box-shadow: 0 2px 0 rgba(0,0,0,0.8);}
}


.prof h3 {
    padding-top: 0px;
}
.prof{
	padding-bottom: 40px;
}
.prof::before{
	height: 70px;
}
.prof h2{
	margin-bottom: 20px;
}
.prof div figure{
	margin-bottom: 1em;
}
.prof .photo{
	margin: 1em 5% 2em;
}



.recommend{
	padding: 40px 0;
}



footer{
	padding: 30px 2% 120px;
}



.btn-fixed{
	width: 94%;
	bottom: 15px;
}
.trigger{
	height: 600px;
}



}/* SP */



@media only screen and (min-width: 768px){
.sp{display:none;}
}
@media only screen and (max-width: 767px){
.pc{display:none;}
}