@-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); } }

.spinner { margin: auto; width: 77px; height: 20px; top: 220px; }

.spinner > div { margin-left: 5px; display: inline-block; border-radius: 100%; width: 15px; height: 15px; -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both; }

.spinner .bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; background: #aed04c; }

.spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; background: #fac524; }

.spinner .bounce3 { background: #e60012; }

#js_fade { 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; position: fixed; z-index: 2000; width: 100%; height: 100%; background: url(../images/yakiago-dashi/bg-loading.png); }

@font-face { font-family: 'MyYuGothicM'; font-weight: normal; src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular"); }

@font-face { font-family: 'MyYuGothicM'; font-weight: bold; src: local("YuGothic-Bold"), local("Yu Gothic"); }

#yakiago-dashi { min-width: 960px; font-family: MyYuGothicM, YuGothic, sans-serif; }

#yakiago-dashi .section { margin: 0 auto; width: 960px; }

#yakiago-dashi #main-visual { position: relative; overflow: hidden; background: url(../images/yakiago-dashi/bg-main-visual.png) no-repeat center center; background-size: cover; -webkit-box-shadow: 0px 8px 8px -1px rgba(0, 0, 0, 0.3) inset; box-shadow: 0px 8px 8px -1px rgba(0, 0, 0, 0.3) inset; }

#yakiago-dashi #main-visual .img-area { margin: 0 auto; padding: 30px 0 0; position: relative; width: 960px; line-height: 0; text-align: right; }

#yakiago-dashi #main-visual h1 { position: absolute; top: 0; left: 0; z-index: 2; }

#yakiago-dashi #main-visual .lead { position: absolute; bottom: 0; width: 100%; color: #FFF; background: url(../images/yakiago-dashi/bg-lead.png) no-repeat center center; background-size: cover; -webkit-box-shadow: 0px -8px 8px -1px rgba(0, 0, 0, 0.3); box-shadow: 0px -8px 8px -1px rgba(0, 0, 0, 0.3); }

#yakiago-dashi #main-visual .lead .section { position: relative; }

#yakiago-dashi #main-visual .lead p { margin: 0 auto; padding: 12px 0 12px 330px; position: relative; line-height: 2; -webkit-box-sizing: border-box; box-sizing: border-box; width: 960px; font-size: 20px; }

#yakiago-dashi #main-visual .lead p:after { margin-right: 50px; position: absolute; top: 50%; right: 0; display: block; width: 580px; height: 1px; content: ""; background: rgba(255, 255, 255, 0.4); }

#yakiago-dashi #main-visual .lead img { position: absolute; bottom: 0; right: -20px; }

#yakiago-dashi .point { padding: 60px 0; overflow: hidden; -webkit-box-shadow: 0px 8px 8px -1px rgba(0, 0, 0, 0.3) inset, 0px -8px 8px -1px rgba(0, 0, 0, 0.3) inset; box-shadow: 0px 8px 8px -1px rgba(0, 0, 0, 0.3) inset, 0px -8px 8px -1px rgba(0, 0, 0, 0.3) inset; background: url(../images/yakiago-dashi/bg-gray.png); }

#yakiago-dashi .point .point-box { padding: 40px 0; position: relative; border: 8px solid #302d8b; border-radius: 16px; -webkit-box-sizing: border-box; box-sizing: border-box; background: #FFF; text-align: center; }

#yakiago-dashi .point .point-box h2 { line-height: 0; }

#yakiago-dashi .point .point-box .line { margin: 36px auto 0; padding-bottom: 0.1em; width: 680px; line-height: 2.2; background-image: linear-gradient(to right, #fff 1.1px, transparent 1px), linear-gradient(to bottom, #000 1.1px, transparent 1px); background-size: 2px 2.2em; font-size: 22px; font-weight: bold; }

#yakiago-dashi .point .point-box .line span { font-size: 10px; vertical-align: super; }

#yakiago-dashi .point .point-box .line.margin-short { margin: 20px auto 0; }

#yakiago-dashi .point .point-box .notes { margin: 15px 0 0; color: #333; font-size: 16px; }

#yakiago-dashi .point .point-box + .point-box { margin: 40px 0 0; }

#yakiago-dashi .point .point-box:after { position: absolute; bottom: -8px; right: -28px; line-height: 0; content: url(../images/yakiago-dashi/wave.png); }

#yakiago-dashi .product-list { padding: 0 0 85px; background: url(../images/yakiago-dashi/bg-wood.png) no-repeat center center; background-size: cover; }

#yakiago-dashi .product-list h2 { margin: 0 0 60px; position: relative; background: #FFF; font-size: 56px; font-weight: bold; text-align: center; text-shadow: 0px 0px 5px #c9812e; -webkit-box-shadow: 0px 10px 20px 0 rgba(0, 0, 0, 0.2); box-shadow: 0px 10px 20px 0 rgba(0, 0, 0, 0.2); letter-spacing: .2em; }

#yakiago-dashi .product-list h2 .inner { margin: 0 auto; position: relative; z-index: 3; padding: 25px 0; width: 960px; background: url(../images/yakiago-dashi/bg-fish.png) no-repeat left bottom; }

#yakiago-dashi .product-list h2:before { position: absolute; z-index: 1; bottom: -25px; left: 50%; width: 54px; height: 50px; content: ""; background: #FFF; -webkit-transform: translate(-50%, 0) rotate(145deg) skewX(20deg); transform: translate(-50%, 0) rotate(145deg) skewX(20deg); -webkit-box-shadow: 5px -5px 20px rgba(0, 0, 0, 0.3); box-shadow: 5px -5px 20px rgba(0, 0, 0, 0.3); }

#yakiago-dashi .product-list h2:after { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; height: 100%; content: ""; background: #FFF; }

#yakiago-dashi .product-list .product-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

#yakiago-dashi .product-list .product-chara { padding: 18px; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; background: url(../images/yakiago-dashi/bg-product.png) no-repeat center center; background-size: cover; -ms-flex-item-align: start; align-self: flex-start; }

#yakiago-dashi .product-list .product-chara dl { padding: 25px 20px; width: 290px; min-height: 324px; background: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }

#yakiago-dashi .product-list .product-chara dl dt { margin: 0 0 15px; text-align: center; }

#yakiago-dashi .product-list .product-chara dl dd { padding: 18px 0 18px 42px; min-height: 124px; font-size: 16px; line-height: 1.35; background: url(../images/yakiago-dashi/bg-product-inner.png) no-repeat; }

#yakiago-dashi .product-list .product-chara .product-pkg { position: absolute; bottom: -10px; right: -162px; }

#yakiago-dashi .product-list .product-composition { width: 490px; -webkit-font-feature-settings: 'palt'; font-feature-settings: 'palt'; }

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

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

#yakiago-dashi .product-list .product-composition dl dt, #yakiago-dashi .product-list .product-composition dl dd { padding: 12px 0 12px 20px; display: table-cell; font-size: 16px; line-height: 1.5em; color: #403024; }

#yakiago-dashi .product-list .product-composition dl dt span, #yakiago-dashi .product-list .product-composition dl dd span { font-size: 12px; }

#yakiago-dashi .product-list .product-composition dl dt { width: 140px; background: #dcc291; font-weight: bold; }
