@charset "UTF-8";
body, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li, blockquote, form, table, label, input, div, a, section, img, table, thead, tbody, tr, th, td, figure, figcaption, span, strong, em { box-sizing: border-box; margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6, th, td { font-weight: normal; font-size: 100%; }

th, td { text-align: left; line-height: 1.75; }

img { border: none; vertical-align: bottom; }

table { border-spacing: 0; border-collapse: collapse; }

html { font-size: 62.5%; }

.normal { font-weight: normal; }

.bold { font-weight: bold; }

.lineH1 { line-height: 1; }

.left { float: left; }

.right { float: right; }

.textLeft { text-align: left; }

.textRight { text-align: right; }

.textCenter { text-align: center; }

.clearFix:after { display: block; clear: both; content: ""; }

.animate { opacity: 0; }

.fadeInUp3 { -webkit-animation: fadeInUp3 1.5s; -moz-animation: fadeInUp3 1.5s; animation: fadeInUp3 1.5s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; }

@-webkit-keyframes fadeInUp3 { from { opacity: 0; -webkit-transform: translate3d(0, 2%, 0); -moz-transform: translate3d(0, 2%, 0); -o-transform: translate3d(0, 2%, 0); -ms-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); }
  to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none; } }
@-moz-keyframes fadeInUp3 { from { opacity: 0; -webkit-transform: translate3d(0, 2%, 0); -moz-transform: translate3d(0, 2%, 0); -o-transform: translate3d(0, 2%, 0); -ms-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); }
  to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none; } }
@keyframes fadeInUp3 { from { opacity: 0; -webkit-transform: translate3d(0, 2%, 0); -moz-transform: translate3d(0, 2%, 0); -o-transform: translate3d(0, 2%, 0); -ms-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); }
  to { opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none; } }
@-webkit-keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
@-moz-keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
@keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
/* ハナマルキ甘酒
------------------------------ */
#contents { width: 100%; margin: 0; }

.gnav { margin-bottom: 0; }

#amazake { position: relative; font-family: "游明朝","YuMincho","游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; line-height: 1.2857142857; overflow: hidden; }
#amazake:after { clear: both; display: block; content: ''; }
#amazake *, #amazake *:before, #amazake *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#amazake section { display: block; position: relative; }
#amazake img { width: 100%; height: auto; vertical-align: bottom; }
#amazake a { cursor: pointer; }
#amazake a .nrmlBtn, #amazake a .hoverBtn { position: absolute; top: 0; right: 0; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; -ms-transition: 0.2s; transition: 0.2s; }
#amazake a .hoverBtn { opacity: 0; }
#amazake a:hover .hoverBtn { opacity: 1; }
#amazake .inner { display: block; position: relative; top: 0; left: 0; width: 100%; height: auto; padding: 0 6.25%; }
#amazake .btn { display: inline-block; position: relative; top: 0; left: 0; }
#amazake .tategaki { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }
#amazake .tgt, #amazake .tgt2 { opacity: 0; }
#amazake .tgt span, #amazake .tgt2 span { opacity: 0; }
#amazake .tgt.indent, #amazake .tgt2.indent { margin-top: -.5em; }
#amazake #js_loading, #amazake #js_loading_white { position: fixed; top: 0; left: 0; z-index: 999; width: 100%; height: 100%; }
#amazake #js_loading { top: 0; left: 0; background: url(../images/kv-bgi.png) no-repeat center center; background-size: cover; }
#amazake #js_loading img { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 33.3333333333%; height: auto; margin: auto; }
#amazake #js_loading_white { background: #fff; z-index: 980; }
#amazake .amazakeKv { position: relative; }
#amazake .amazakeKv .btn { position: absolute; top: 0; right: 0; width: 100%; margin: 6.25% 0 0; }
#amazake .amazakeKv .scroll { position: absolute; width: 100%; right: 0; bottom: 0; left: 1%; width: 15.625%; margin: 0 auto; z-index: 900; }
#amazake .amazakeKv .scroll img { top: auto; bottom: 0; }
#amazake .leadArea { padding: 12.5% 0 65.625%; background: url(../images/lead-bgi.jpg) no-repeat center bottom; background-size: cover; }
#amazake .leadArea h2 { position: absolute; right: 0; width: 25%; margin-right: 6.25%; }
#amazake .leadArea .leadTxt { float: left; margin: 0 0 0 -1.5625%; line-height: 1.5357142857; }
#amazake .leadArea .notice { color: #600; }
#amazake .applyArea { position: relative; }
#amazake .applyArea .catch { position: absolute; bottom: 0; margin-bottom: 12.5%; }
#amazake .feature h2 { padding: 0 0 12.5%; }
#amazake .feature li { padding-bottom: 6.25%; }
#amazake .feature .detailLabel { opacity: 0; }
#amazake .feature .detailLabel img { position: relative; top: 0; margin-top: -12.5%; }
#amazake .feature .seiho { padding: 12.5% 0 0; background: url(../images/feature-bgi-1.jpg) no-repeat center center; background-size: cover; }
#amazake .feature .seiho .lead { position: absolute; bottom: 0; width: 100%; margin: 0 auto 73px; }
#amazake .feature .seiho .detailLabel img { margin: 0 0 6.25%; }
#amazake .feature .aji { background: url(../images/feature-bgi-2.jpg) no-repeat center; background-size: cover; }
#amazake .feature .sozai { background: url(../images/feature-bgi-3.jpg) no-repeat center; background-size: cover; }
#amazake .howtoDrink { padding: 12.5% 0; }
#amazake .howtoDrink h2 { padding: 0 0 12.5%; }
#amazake .howtoDrink .lead { padding-bottom: 1em; line-height: 1.5; }
#amazake .applyArea.area2 .btnArea { padding: 10.9375% 0 12.5%; background: url(../images/apply-bgi-2.png); }
#amazake .applyArea.area2 h3 { padding: 0 0 4.6875%; }
#amazake .requirement { background: url(../images/requirement-bgi.png) no-repeat center bottom; }
#amazake .requirement h2 { padding: 10.9375% 0 12.5%; }
#amazake .requirement dl { padding: 1em 0; border-bottom: solid 1px #e6daca; color: #b1874d; overflow: hidden; }
#amazake .requirement dl:first-child { padding-top: 0; }
#amazake .requirement dl dt { padding-bottom: .5em; line-height: 1.1666666667; }
#amazake .requirement dl dd { line-height: 1.2857142857; letter-spacing: 0; font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
#amazake .requirement dl small { display: block; }
#amazake .requirement dl small.deliver { padding-top: .5em; padding-left: 1em; text-indent: -1em; }
#amazake .requirement dl small.deliver + small { padding-left: 1em; text-indent: -1em; }
#amazake .requirement dl ul { list-style-type: disc; padding-left: 1.25em; }
#amazake .requirement .requirementItem { display: block; padding: 9.375% 0 0; }
#amazake.androidDefaultBrowser .animate { opacity: 1; }

.pagetop { margin: 2.5% 0; line-height: 1; }

/* sp-side
-------------------------------------------------- */
@media only screen and (max-width: 640px) { .font28 { font-size: 28px; font-size: 2.8rem; font-size: 4.375vw; }
  #amazake { font-size: 28px; font-size: 2.8rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 36px; font-size: 3.6rem; font-size: 5.625vw; } }
/* iPhone5-side
-------------------------------------------------- */
@media only screen and (max-width: 568px) { .font28 { font-size: 24.85px; font-size: 2.485rem; font-size: 4.375vw; }
  #amazake { font-size: 24.85px; font-size: 2.485rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 31.95px; font-size: 3.195rem; font-size: 5.625vw; } }
/* android-w
-------------------------------------------------- */
@media only screen and (max-width: 540px) { .font28 { font-size: 23.625px; font-size: 2.3625rem; font-size: 4.375vw; }
  #amazake { font-size: 23.625px; font-size: 2.3625rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 30.375px; font-size: 3.0375rem; font-size: 5.625vw; } }
/* android-m
-------------------------------------------------- */
@media only screen and (max-width: 480px) { .font28 { font-size: 21px; font-size: 2.1rem; font-size: 4.375vw; }
  #amazake { font-size: 21px; font-size: 2.1rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 27px; font-size: 2.7rem; font-size: 5.625vw; } }
/* iphone6plus
-------------------------------------------------- */
@media only screen and (max-width: 414px) { .font28 { font-size: 18.1125px; font-size: 1.81125rem; font-size: 4.375vw; }
  #amazake { font-size: 18.1125px; font-size: 1.81125rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 23.2875px; font-size: 2.32875rem; font-size: 5.625vw; } }
/* iphone6
-------------------------------------------------- */
@media only screen and (max-width: 375px) { .font28 { font-size: 16.40625px; font-size: 1.640625rem; font-size: 4.375vw; }
  #amazake { font-size: 16.40625px; font-size: 1.640625rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 21.09375px; font-size: 2.109375rem; font-size: 5.625vw; } }
/* android
-------------------------------------------------- */
@media only screen and (max-width: 360px) { .font28 { font-size: 15.75px; font-size: 1.575rem; font-size: 4.375vw; }
  #amazake { font-size: 15.75px; font-size: 1.575rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 20.25px; font-size: 2.025rem; font-size: 5.625vw; } }
/* iphone5, android-s
-------------------------------------------------- */
@media only screen and (max-width: 320px) { .font28 { font-size: 14px; font-size: 1.4rem; font-size: 4.375vw; }
  #amazake { font-size: 14px; font-size: 1.4rem; font-size: 4.375vw; }
  #amazake .requirement dl dt { font-size: 18px; font-size: 1.8rem; font-size: 5.625vw; } }