@charset "utf-8";
/* 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%;
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: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Meiryo,"メイリオ","ＭＳ Ｐゴシック",Helvetica,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
-------------------------------*/
@media screen and (min-width:641px) { 
.wrap{
    max-width: 1000px;
    margin: 0 auto;
    background:#fff;
}}
@media screen and (max-width:640px) { 
.wrap{
	max-width: 640px;
    margin: 0 auto;
    background:#fff;}
}
#banner{
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: 640px;
    margin: 0 auto;
    z-index: 10;
}

.scroll{
position: absolute;
bottom: 9.7%;
right: 0%;
display: flex;
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
width: 95%;
padding: 0 0 0 7%;
}

/*購入ボタン*/
.overlaid{
    position: relative;
}
.abs{
    position: absolute;
}
.btn01{
    top: 45.5%;
    left: 50%;
    width: 43%;
	animation: fluffyY 1s infinite ease;/*ボタン動き*/
}
.btn02{
	bottom:6%;
	right:0.1%;
	width:17%;
	animation: fluffyY 1s infinite ease;/*ボタン動き*/
}
.btn05{
    width: 80%;
	left: 10%;
    bottom: 6%;
	animation: fluffyY 1s infinite ease;/*ボタン動き*/
}
@keyframes fluffyY {
  0% { transform:translateY(7px); }
  50% { transform:translateY(-7px); }
  100% { transform:translateY(7px); }
}

/*アコーディオン*/
.acc__area1{
background-color: #EBF3F5;
padding-bottom: 12px;
margin: 10px auto 36px;
}
.acc__area{
background: url("https://www.fromcocoro.com/daily1/sp/common/img/acc_bg.jpg");
padding-bottom: 12px;
margin: 10px auto 36px;
}
.acc{
margin: 0 auto;
width: 93.6%;
}
.qa__set{
margin-bottom: 3.5%;
}
.acc__q{
position: relative;
cursor: pointer;
}
.active{
border-radius: 0;
overflow: hidden;
}
.acc__a{
display: none;
}
.acc__q::before{
content: '';
position: absolute;
width: 3.6%;
height: 1px;
border-bottom: solid 1px #000;
margin: auto;
top: 0%;
bottom: 0;
right: 2.8%;
transform: rotate(0deg);
transition: all .4s;
z-index: 5;
}
.active::before{
transform: rotate(360deg);
transition: all .4s;
}
.acc__q::after{
content: '';
position: absolute;
width: 3.6%;
height: 1px;
border-bottom: solid 1px #000;
margin: auto;
top: 0;
bottom: 0;
right: 2.8%;
transform: rotate(90deg);
transition: all .4s;
z-index: 5;
}
.active::after{
transform: rotate(360deg);
transition: all .4s;
}
.mv2btn {
  display: block;
  bottom: 1%;
  left: 10%;
  animation: fluffyY 1s infinite ease;/*ボタン動き*/
}


.fv { position: relative; }

.fv__item { 
  position: absolute; 
  left: 50%; bottom: -10%; 
  transform: translateX(-50%); 
  position: absolute; 
  width: 100%; 
  text-align: center; 
}

.fv-2 { 
  position: relative; 
  height: calc(100% - 7px); 
  margin-top:33%;
}

.fv-2__item { 
  position: absolute; 
  left: 50%; bottom: 0%;  
  transform: translateX(-50%); 
  position: absolute; 
  width: 100%; 
  text-align: center; 
}

.fv-2 video { 
  width: 100%; 
  max-width:1000px;   
}

.fv-2__video { 
max-height: 750px;
}