@charset "UTF-8";
@-webkit-keyframes animation-top { 0% { opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  60% { opacity: 1; } }

@keyframes animation-top { 0% { opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  60% { opacity: 1; } }

@-webkit-keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0);
    transform: scale(0); }
  40% { -webkit-transform: scale(1);
    transform: scale(1); } }

@keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0);
    transform: scale(0); }
  40% { -webkit-transform: scale(1);
    transform: scale(1); } }

.centerBox, #js_fade p { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }

#js_fade { width: 100%; height: 100%; display: block; background: #ed6c00; position: fixed; z-index: 2000; background: url(../images/omiso-okasan/omiso-okasan-bg1.png); }

#js_fade p { width: 200px; height: 128px; bottom: 0; }

body > *:not(#js_fade) { opacity: 0; -webkit-transition: opacity 1.5s; transition: opacity 1.5s; }

body.pageShow > *:not(#js_fade) { opacity: 1; }

.pagetop { margin: 0; padding: 2.34375%; }

#omiso-okasan-top { font-size: 24px; font-size: 2.4rem; font-size: 3.75vw; font-family: 'Helvetica Neue','Helvetica','Arial',"游ゴシック体", YuGothic,"游ゴシック", "Yu Gothic",'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ ゴシック',sans-serif; position: relative; overflow: hidden; }

#omiso-okasan-top .section { margin: 0 auto; width: 100%; }

#omiso-okasan-top .section-full { width: 100%; }

#omiso-okasan-top img { width: 100%; height: auto; vertical-align: bottom; }

#omiso-okasan-top div, #omiso-okasan-top ul, #omiso-okasan-top li, #omiso-okasan-top div, #omiso-okasan-top p, #omiso-okasan-top dl, #omiso-okasan-top dt, #omiso-okasan-top dd, #omiso-okasan-top figure, #omiso-okasan-top figcaption { -webkit-box-sizing: border-box; box-sizing: border-box; }

#omiso-okasan-top .bg-shadow { content: ''; display: block; position: absolute; bottom: -11px; left: 0; width: 100%; height: 11px; background: url(../images/omiso-okasan/omiso-okasan-bg-shadow.png); }

#omiso-okasan-top .bg-shadow-top, #omiso-okasan-top #product-list:after { content: ''; display: block; position: absolute; top: -11px; left: 0; width: 100%; height: 11px; background: url(../images/omiso-okasan/omiso-okasan-bg-shadow-top.png); z-index: 10; }

#omiso-okasan-top .clearfix, #omiso-okasan-top #chara-cont #detail ul:after { content: ''; display: block; clear: both; }

#omiso-okasan-top #main-visual { padding: 0 0 116.25%; position: relative; height: 0; background: url(../images/omiso-okasan/omiso-okasan-kv-bgi.jpg) no-repeat; background-size: contain; }

#omiso-okasan-top #main-visual > .section { position: relative; }

#omiso-okasan-top #main-visual > .section h1, #omiso-okasan-top #main-visual > .section p { position: relative; z-index: 2; line-height: 1; }

#omiso-okasan-top #main-visual > .section h1 img, #omiso-okasan-top #main-visual > .section p img { vertical-align: bottom; }

#omiso-okasan-top #main-visual > .section h1 { padding-top: 8.90625%; }

#omiso-okasan-top #main-visual > .section p.copy { padding: 4.6875% 0 3.4375%; text-align: center; }

#omiso-okasan-top #main-visual #top-pkg { width: 100%; margin: 0 auto; position: relative; z-index: 2; }

#omiso-okasan-top #chara-cont { margin-top: -1px; padding: 34.375% 0 11.71875%; position: relative; display: block; background: url(../images/omiso-okasan/omiso-okasan-bg-white.png); }

#omiso-okasan-top #chara-cont #detail { margin: 0 auto; padding: 6.25% 3.125% 9.375%; width: 93.75%; position: relative; background: #fff; border-radius: 10px; -webkit-box-shadow: 7px 7px 0px 0px rgba(25, 12, 11, 0.05); box-shadow: 7px 7px 0px 0px rgba(25, 12, 11, 0.05); }

#omiso-okasan-top #chara-cont #detail h3 { margin: 0 auto 10.7142857143%; text-align: center; line-height: 1; }

#omiso-okasan-top #chara-cont #detail h3 img { width: 74.2857142857%; }

#omiso-okasan-top #chara-cont #detail ul li:first-child { margin: 0 auto 10.7142857143%; }

#omiso-okasan-top #chara-cont #detail ul li figure { padding: 8.9285714286% 0 7.1428571429%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; background: #f8f5ec; border: 1px solid #e0d9c5; border-radius: 10px; position: relative; }

#omiso-okasan-top #chara-cont #detail ul li figure img { max-width: 82.6335877863%; }

#omiso-okasan-top #chara-cont #detail ul li figcaption { padding: 3.5714285714% 0; text-align: center; border-bottom: 1px solid #e0d9c5; line-height: 1; color: #693206; font-weight: bold; font-size: 33px; font-size: 3.3rem; font-size: 5.15625vw; }

#omiso-okasan-top #chara-cont #detail ul li p { padding: 2.1428571429% 0 0 0; font-size: 28px; font-size: 2.8rem; font-size: 4.375vw; color: #403024; line-height: 1.5; }

#omiso-okasan-top #product-list { padding: 9.375% 3.125% 12.5%; background: url(../images/omiso-okasan/omiso-okasan-bg1.png); position: relative; }

#omiso-okasan-top #product-list h3 { margin: 0 auto 6.6666666667%; text-align: center; }

#omiso-okasan-top #product-list h3 img { width: 42.3333333333%; }

#omiso-okasan-top #product-list .product-info { margin: 6.6666666667% 0; width: 100%; position: relative; }

#omiso-okasan-top #product-list .product-chara { padding: 3.3333333333%; width: 68.3333333333%; }

#omiso-okasan-top #product-list .product-chara.new1 { background: url(../images/omiso-okasan/omiso-okasan-product1-waku.jpg) #cddfa3; }

#omiso-okasan-top #product-list .product-chara.new2 { background: url(../images/omiso-okasan/omiso-okasan-product2-waku.jpg) #edbab3; }

#omiso-okasan-top #product-list .product-chara dl { padding: 13.5135135135% 8.1081081081% 2.7027027027%; width: 100%; height: 100%; background: #fff; -webkit-box-shadow: 0px 0px 1rem 0px rgba(25, 12, 11, 0.2); box-shadow: 0px 0px 1rem 0px rgba(25, 12, 11, 0.2); }

#omiso-okasan-top #product-list .product-chara dl dt { margin: 0 auto; padding-bottom: 9.6774193548%; background: url(../images/omiso-okasan/omiso-okasan-product-line.png) no-repeat bottom; background-size: 100% auto; text-align: center; }

#omiso-okasan-top #product-list .product-chara dl dt img { width: 92.9032258065%; }

#omiso-okasan-top #product-list .product-chara dl dd { padding: 4.8387096774% 0; position: relative; color: #a2792e; line-height: 1.33333; background: url(../images/omiso-okasan/omiso-okasan-product-line.png) no-repeat bottom; background-size: 100% auto; text-align: justify; }

#omiso-okasan-top #product-list .product-chara .product-pkg { margin-right: -0.5%; position: absolute; width: 39.5%; right: 0; bottom: 0; }

#omiso-okasan-top #product-list .product-composition dl { width: 100%; display: table; border-top: 1px dotted #958b63; }

#omiso-okasan-top #product-list .product-composition dl:last-of-type { border-bottom: 1px dotted #958b63; }

#omiso-okasan-top #product-list .product-composition dl dt, #omiso-okasan-top #product-list .product-composition dl dd { padding: 1.6666666667% 3.3333333333%; display: table-cell; font-size: 26px; font-size: 2.6rem; font-size: 4.0625vw; line-height: 1.5em; color: #403024; }

#omiso-okasan-top #product-list .product-composition dl dt span, #omiso-okasan-top #product-list .product-composition dl dd span { font-size: 18px; font-size: 1.8rem; font-size: 2.8125vw; }

#omiso-okasan-top #product-list .product-composition dl dt { padding-right: 0; width: 23.3333333333%; line-height: 1.3; background: #fff; font-weight: bold; }

#omiso-okasan-top #product-list .product-composition dl dd { width: 76.6666666667%; }

/* sp-side
-------------------------------------------------- */
@media only screen and (max-width: 640px) { html, :root { font-size: 62.5%; } }

/* iPhone5-side
-------------------------------------------------- */
@media only screen and (max-width: 568px) { html, :root { font-size: 55.46875%; } }

/* android-w
-------------------------------------------------- */
@media only screen and (max-width: 540px) { html, :root { font-size: 52.734375%; } }

/* android-m
-------------------------------------------------- */
@media only screen and (max-width: 480px) { html, :root { font-size: 46.875%; } }

/* iphone6plus
-------------------------------------------------- */
@media only screen and (max-width: 414px) { html, :root { font-size: 40.4296875%; } }

/* iphone6
-------------------------------------------------- */
@media only screen and (max-width: 375px) { html, :root { font-size: 36.62109375%; } }

/* android
-------------------------------------------------- */
@media only screen and (max-width: 360px) { html, :root { font-size: 35.15625%; } }

/* iphone5, android-s
-------------------------------------------------- */
@media only screen and (max-width: 320px) { html, :root { font-size: 31.25%; } }
