@charset "UTF-8";

/* Common
------------------------------------------------*/
html {
font-size: 62.5%;
margin: 0;
padding: 0;
}
body {
background-color: #FFFFFF;
background-image: url("../_img/bg.jpg");
background-position: center top;
background-size: cover;
background-attachment: fixed;
color: #000000;
font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
letter-spacing: 0.1rem;
}
main {
background-color: #fff;
font-size: 1.6rem;
line-height: 1.4;
margin: 0 auto;
width:100%;
}
a {text-decoration:underline;}
a:link, a:visited {color: #333;}
a:hover {color: #7D6733; text-decoration: none;}
img {vertical-align: bottom;}
a img {	transition: .35s ease-in-out; vertical-align: bottom;}
a img:hover {opacity: 0.7;}
@media screen and (max-width:599.98px) {
.pc_only {display: none;}
/* @media end */
}
@media screen and (min-width:600px) {
main {
max-width: 600px;
margin: 0 auto;
}
/* @media end */
}



/* Image
------------------------------------------------*/
.bigimg img {
width: 100%;
vertical-align: bottom;
}
.bigimg * {
margin-top: 0;
margin-bottom: 0;
}



/* Animation
------------------------------------------------*/
/* キーフレーム：位置固定フェードイン */
@keyframes fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/* キーフレーム：下から上にフェードイン */
@keyframes fadeup {
  0% {
    opacity: 0;
    transform: translate(0px, 30px); }
  20% {
    opacity: 0; }
  100% {
    opacity: 1;
    transform: translate(0px, 0px); } }

.fadein, .fadein_delay, .fadein_delay2, .fadein_delay3, .fadein_delay4 {
  opacity: 0; }

.fadein.scrollin {
  animation: fadeup .8s ease-out 0s 1 normal forwards; }

.fadein_delay.scrollin {
  animation: fadeup .8s ease-out 0.3s 1 normal forwards; }

.fadein_delay2.scrollin {
  animation: fadeup .8s ease-out 0.6s 1 normal forwards; }

.fadein_delay3.scrollin {
  animation: fadeup .8s ease-out 0.9s 1 normal forwards; }

.fadein_delay4.scrollin {
  animation: fadeup .8s ease-out 1.2s 1 normal forwards; }

/* Page Top
------------------------------------------------*/
.btm {
  position: fixed;
  bottom: 0px;
  margin: 0;
  display: flex;
  z-index: 9999;
  list-style: none;
  opacity: 0;
  animation: fadein .8s ease-out 1.9s 1 normal forwards;
  }
.btm img {
  width: 100%;
  height: auto;
}
.btm__insta {
  width: 16%;
}
.btm__cart {
  width: 84%;
}
@media screen and (min-width:550px) {
  .btm {
    width: 600px;
    left: 50%;
    transform: translateX(-50%);
  }
  .btm__insta {
    width: 96px;
  }
  .btm__cart {
    width: 504px;
  }
}