
@charset "utf-8";
　　// デフォルトのスタイル

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
/* -------------------------------------------------------------- */

body{
color:#250404;
font:14px verdana,"ヒラギノ角ゴ Pro W5","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
line-height:0;
background:#000000;
text-align:center;
margin: 0 auto;
-webkit-appearance: none;
-webkit-text-size-adjust: none;
}

/* 全体　
------------------------------------------------------------*/

.wrapper {
  max-width: 768px;
  margin: 0 auto;
  background-color: #ffffff;
  background-image: url(../img/bg.png);
  height: 100%;
}

.img-responsive {
  width:100%;
  height:auto;
  vertical-align: bottom;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

/*
img {
  width:100%;
  height:auto;
  vertical-align: bottom;
}
*/

/*アンカーリンク*/
.anker_link{
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around; 
  margin-top: -48%;
  width: 96%;
}

.anker_link img {
  margin-bottom: 4%;
}

.anker_btn{
  width: 46%;
  margin: 0% 2% 2% 2%;
}

/*App*/
.contents01 {
  margin-top: 3%;
}

.app_link{
  margin: 0 auto;
  width: 92%;
  margin-top: 3%;
  margin-bottom: 5%;
}

.good {
  background-color: #282828;
  padding: 3% 3% 3% 3%;
  margin-bottom: 5%;
}

.good img {
  margin-bottom: 2%;
}

.btn_good {
  margin-bottom: 5%;
}

/*料理*/
.contents02 {
  margin-top: 0%;
}

.episode_link{
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between; 
  width: 92%;
  margin-top: 3%;
}

.episode_link img {
  margin-bottom: 4%;
}

/*関連作*/
.contents04 {
  margin-top: 0%;
}

.archive_link{
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between; 
  width: 92%;
  margin-top: 3%;
}

.archive_link img {
  margin-bottom: 4%;
}

/*ストーリー*/
.contents04{
}

.story_img {
  margin-top: -350%;
}

.img01 {
  margin-top: -12%;
}

.img02 {
  margin-top: 4%;
}

.img03 {
  margin-top: 4%;
}

.img04 {
  margin-top: 3%;
}

.img05 {
  margin-top: 5%;
}

.btn_footer {
  width: 92%;
  margin-top: 20%;
}

/*ストーリー*/
.contents05{
  margin-top: 15%;
}

.share_link{
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between; 
  width: 70%;
}

.share_btn{
  width: 20%;
  margin-top: 8%;
}

.btn {
  margin-top: 3%;
}

.fixed_btn { 
  display: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  padding: 10px 40px;
  z-index: 99;
  }

footer {
  margin-top: 8%;
}

/*768px以下に適用されるCSS（SP以下）
------------------------------------------------------------*/
@media only screen and (max-width:768px) {

.fixed_btn { 
  display: none;
  position: fixed;
  bottom: 10px;
  right: 0;
  padding: 10px 0px 10px 0px;
  z-index: 99;
}

.fixed_btn img{ 
  width: 60%;
}

}

/* fadein.js用
------------------------------------------------------------*/
.fadein {
    opacity : 0.1;
    transform : translate(0, 50px);
    transition : all 500ms;
    }

.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }

