@charset "euc-jp";
/* CSS Document */
/*-----------------------------
 reset
-------------------------------*/
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p,
img, small, strong, sub, sup,b, i,dl, dt, dd, ol, ul, li,
 form, label,table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,hgroup, menu, nav, section,
time, mark, audio, video {
margin:0;	padding:0;border:0;outline:0;font-size:100%;
vertical-align:baseline;background:transparent;line-height:1.7;
}
th{font-style:normal;font-weight:normal;}
ul li{list-style:none; }
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%;}
body {line-height:1;font-family: "Helvetica Neue", Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;}
nav ul {list-style:none;}
table {border-collapse:collapse;border-spacing:0;}
input, select {vertical-align:middle;}
article, aside, figure, footer, header,hgroup, nav, section { display:block; }
img{vertical-align:bottom;width:100%;display: block;}
/*-----------------------------
 common
-------------------------------*/
.wrap{
	width: 640px;
	margin: 0 auto;
}

@media screen and ( max-width:640px){
.wrap{
	max-width: 1000px;
	width: auto;
}
}
.overlaid{
	position: relative;
}
.btn{
	position: absolute;
	animation: purupuru 1.25s ease -.8s infinite alternate;
}

.btn_moi{
	right: 3.5%;
	width: 49%;
	bottom: 18%;
	border-radius: 45%;
	overflow: hidden;
}

.btn_moi_y{
	right: 3.5%;
	width: 49%;
	bottom: 16.5%;
	border-radius: 45%;
	overflow: hidden;
}


.btn_01{
	margin: 0 auto 5%;
	width: 90.4%;
	animation: purupuru 1.25s ease -.725s infinite alternate;
}

.btn_01_y{
	margin: 0 auto 1%;
	width: 90.4%;
	animation: purupuru 1.25s ease -.725s infinite alternate;
}


.btn_02{
	margin: 5% auto;
	width: 90.4%;
	animation: purupuru 1.25s ease -.725s infinite alternate;
}

.btn_03{
	margin: 3% auto 0;
	width: 90.4%;
	animation: purupuru 1.25s ease -.725s infinite alternate;
	overflow: hidden;
}

.btn_04{
	margin: 0 auto 1%;
	width: 90.4%;
	animation: purupuru 1.25s ease -.725s infinite alternate;
	overflow: hidden;
}


.btn__layer{
	overflow: hidden;
	position: relative;
	display: block;
}
.btn__layer::before {
	content: "";
	display: block;
	height: 100%;
	width: 5%;
	position: absolute;
	top: -10%;
	left: 0;
	background-color: #fff;
	opacity: 0;
	-webkit-transform: rotate(45deg);
	-webkit-animation: reflection 2.5s ease-in-out infinite;
	transform: rotate(45deg);
	animation: reflection 2.5s ease-in-out infinite;
}

.btn__member {
	font-size:17px;
	font-weight:bold;
	text-decoration:none!important;
	text-align:center;
	display:block;
	width:100%;
	margin-bottom:10px;
	padding:10px 0;
	border:none;
	border-radius:6px!important;
	-moz-border-radius:6px!important;
	-webkit-border-radius:6px!important;
}

.btn__member {
	color:#fff;
	text-shadow:0 1px 1px rgba(0,0,0,0.5);
	background-color:#57af01;
	background-image:-webkit-linear-gradient(top, #b8e061 0%, #93d100 1%, #57af01 100%);
	background-image:-moz-linear-gradient(top, #b8e061 0%, #93d100 1%, #57af01 100%);
	background-image:linear-gradient(top, #b8e061 0%, #93d100 1%, #57af01 100%);
}

/*-----------------------------
 uriba
-------------------------------*/
.uriba_1 {
	background-color:#fff9e1;
	padding: 3% 0 6%;
}

.uriba {
	background-color:#fff9e1;
}

/*-----------------------------
 gif
-------------------------------*/
.gif01{
	position: absolute;
	width: 43%;
	right: 3%;
	bottom: 10%;
}
.gif02{
	position: absolute;
	width: 43%;
	left: 4%;
	bottom: 12%;
}
.gif03{
	position: absolute;
	width: 43%;
	right: 3%;
	bottom: 6%;
}


/*-----------------------------
 accordion
-------------------------------*/
.acc__area{

}
.acc{
	padding-top: 5%;
}
.qa__set{
	overflow: hidden;
	margin: 0 auto 5%;
	width: 95%;
	position: relative;
	z-index: 1;
}
.acc__q{
	position: relative;
	cursor: pointer;
	min-height: 15vw;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: stretch;
	align-items: stretch;
	border-bottom: 1px solid #ce778b;
}
.q__icon{
	width: 10%;
	padding: 4% 3% 0;
	background-color: #ce778b;
}
.q__text{
	width: 85%;
	font-size: 4.21875vw;
	line-height: 1.3;
	font-feature-settings: "palt";
	text-align: justify;
	margin: auto auto auto 3%;
	padding: 2% 0;
}
.acc__a{
	display: none;
	background: #fff;
	padding: 3.6vw 4% 5.5vw 3%;
}
.a__ttl{
	color:#D00C3C ;
	line-height: 1.5;
	display: block;
	text-align: justify;
	font-feature-settings: "palt";
	font-size: 3.4375vw;
	margin-bottom: 1%;
}
.a__main{
	line-height: 1.6;
	display: block;
	text-align: justify;
	font-feature-settings: "palt";
	font-size: 3.4375vw;
}
.icon__bg{
	position: absolute;
	margin: auto 0;
	top: 0;
	bottom: 0;
	width:4.21875vw ;
	height: 4.21875vw;
	right: 4%;
}
.icon__bg:after{
	content: '';
	position: absolute;
	width: 40%;
	height: 40%;
	border-bottom: 1px solid #ad1c3e;
    border-right: 1px solid #ad1c3e;
	margin: auto;
	top: 50%;
	bottom: 0;
	right: 0;
	transform: rotate(45deg);
	transition: all .4s;
	z-index: 5;
}
.active:after{
	transform: rotate(225deg);
	transition: all .4s;
}

/*-----------------------------
 accordion_モイスチャー
-------------------------------*/
.acc_moi__area{
	background: rgba(173,28,62,.05)
}

.acc_moi__q{
	position: relative;
	cursor: pointer;
	background: #AD1C3E;
	min-height: 15vw;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: stretch;
	align-items: stretch;
}

/*-----------------------------
 anime
-------------------------------*/
@keyframes purupuru{
0% {
	transform: scale(1);
}
100% {
	transform: scale(1.08);
}
}
@keyframes reflection{
0%{
	transform: scale(0) rotate(45deg);
	opacity: 0;
}
80%{
	transform: scale(0) rotate(45deg);
	opacity: .5;
}
81%{
	transform: scale(4) rotate(45deg);
	opacity: .8;
}
100%{
	transform: scale(50) rotate(45deg);
	opacity: 0;
}
}

/*-----------------------------
 keyframe animation
-------------------------------*/
@media screen and (min-width:640px) and ( max-width:999px){
.icon__bg{
	width: 4.2vw ;
	height: 4.2vw;
}
.acc__q{
	min-height: 14.6vw;
}
.q__text{
	font-size: 4.2vw;
}
.a__ttl{
	font-size: 3.4vw;
}
.a__main{
	font-size: 3.4vw;
}
.acc__a{
	padding: 3.6% 4% 5.5% 3%;
}
.voice{
	height: 100vw;
}
}
@media screen and (min-width:1000px){
.wrapOuter{
	width: 100%;
}
.q__icon{
	width: auto;
	padding: 4% 3%;
}
.icon__bg{
	width: 42px;
	height: 42px;
}
.acc__q{
	min-height: 1vw;
}
.q__text{
	font-size: 18px;
}
.a__ttl{
	font-size: 16px;
}
.a__main{
	font-size: 12px;
}
.acc__a{
	 padding: 3.6% 4% 5.5% 3%;
}
.icon__bg:after{
	border-bottom: solid 2px #AD1C3E;
}
.icon__bg:before{
	border-bottom: solid 2px #AD1C3E;
}
.voice{
	height: 1000px;
}
}

/*-----------------------------
 footer
-------------------------------*/
#lp_footer {
	padding: 40px 30px 0 30px;
	color: #fff;
	text-align: center;
	background: #AD1C3E;
	max-width: 1000px;
	width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
}
#lp_footer ul {
	margin: 0 0 20px 0;
	padding: 0;
	clear: both;
	display: inline-block;
	overflow: hidden;
	list-style-type: none;
}
#lp_footer li {
	float: left;
	padding: 0 11px;
	line-height: 1.2em;
}
#lp_footer li a:link, a:visited {
	color: #fff;
}
#lp_footer li a:hover {
	text-decoration: underline
}
#lp_footer li + li {
	border-left: 1px solid #ccc;
}
@media screen and (min-width:1000px){
#lp_footer {
	max-width: 100%;
}
#lp_footer li.last {
	border-right: 1px solid #ccc;
}
}
@media only screen and (max-width: 420px) {
#lp_footer {
	font-size: 60%;
	padding: 20px 5% 0 5%;
}
#lp_footer ul {
	margin: 0 0 10px 0;
}
#lp_footerr li {
	padding: 0 8px;
}
}
@media only screen and (max-width: 380px) {
#lp_footer {
	font-size: 55%;
}
#lp_footer li {
	padding: 0 5px;
}
}
@media only screen and (max-width: 360px) {
#lp_footer li {
	padding: 0 3px;
}
}
@media only screen and (max-width: 320px) {
#lp_footer {
	font-size: 50%;
	padding: 20px 4% 0 4%;
}
#lp_footer ul {
	margin: 0;
}
#lp_footer li {
	padding: 0 2px;
}
}

/*-----------------------------
 copyright
-------------------------------*/
div.footer_link,div.footer_form,
div.footer_guide,div.footer_form,div.sp_footer_inquiry,
div.footer_inquiry,div.footer_nav_wrapper,div.flv{
  display: none;
}
footer{
  padding: 10px 0;
  color: #fff;
  text-align: center;
  background: #AD1C3E;
}

.sp_only {
    display: none;
}

@media only screen and (max-width: 736px) {
    footer{
      font-size: 60%;
    }
    .pc_only {
        display: none;
    }
    .sp_only {
        display: block;
    }
}

/*-----------------------------
モイスチャーLP注釈
-------------------------------*/

.subscription {
	width: 98%;
    margin: 0 auto 10px;
    font-size: 84%;
    line-height: 1.2;
}

@media screen and (max-width:860px){

  .subscription {
  	width: 98%;
      margin: 0 auto 10px;
      font-size: 0.7em;
      line-height: 1.3;
  }

}