@charset "utf-8";


body {
    background: #fff;
    color: #545454;
    font-family: "Noto Serif JP", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 5px;
    margin: 1.5em ;
    max-width: 600px;
    padding-top: 0.5em;
}

p { line-height: 28px}


.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}


span.point{
 letter-spacing: -0.32em;
}
span.coint{
 letter-spacing: -0.5em;
}



.fade-in-bottom {
   opacity: 0;
   animation-name: fadein-bottom;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
animation-delay: 0s;
}
@keyframes fadein-bottom {
   0% {
      opacity: 0;
      transform: translateY(20px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}


.fade-in-top {
   opacity: 0;
   animation-name: fadein-top;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
animation-delay: 0s;
}
@keyframes fadein-top {
   0% {
      opacity: 0;
      transform: translateY(20px);
   }
   100% {
      opacity: 1;
      transform: translateY(0);
   }
}





@media screen and (min-width: 626px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}


@media screen and (max-width : 626px){
    
 .br-pc { display:none; }
  .br-sp { display:block; }

   body {
    font-family: "Noto Serif JP", Helvetica, Arial, sans-serif;
    font-size: 60%;
    margin: 1.5em ;
    padding-top: 2em;
}
 
p { line-height: 15px}


    
}
