@charset "UTF-8";
@-webkit-keyframes animation-menu { 0% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@-moz-keyframes animation-menu { 0% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes animation-menu { 0% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05); }
  100% { opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

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

@-moz-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, .spinner, #js_fade p { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; }

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

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

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

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

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

#js_fade p { width: 255px; height: 185px; bottom: 0; }

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

#karaage-panko-top { min-width: 960px; font-family: MyYuGothicM, YuGothic, sans-serif; position: relative; }

#karaage-panko-top:before, #karaage-panko-top:after { width: 50%; height: 640px; content: ''; display: block; position: absolute; top: 0; z-index: -1; }

#karaage-panko-top:before { right: 0; background: url(../images/karaage-panko/karaage-panko-kvbg-right.jpg) repeat-x; }

#karaage-panko-top:after { left: 0; background: url(../images/karaage-panko/karaage-panko-kvbg-left.jpg) repeat-x; }

#karaage-panko-top div, #karaage-panko-top ul, #karaage-panko-top li, #karaage-panko-top div, #karaage-panko-top p, #karaage-panko-top dl, #karaage-panko-top dt, #karaage-panko-top dd { box-sizing: border-box; }

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

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

#karaage-panko-top .clearfix, #karaage-panko-top #main-visual > .section ul.kv-product:after, #karaage-panko-top #main-cont #chara-cont #person-box dl:after, #karaage-panko-top #main-cont #effect-cont #pkg-contents:after, #karaage-panko-top #main-cont #recipe:after, #karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl:after, #karaage-panko-top #product-list .product-info:after { content: ''; display: block; clear: both; }

#karaage-panko-top .tx-red { color: #da0009; }

#karaage-panko-top .area-shadow, #karaage-panko-top #main-cont #chara-cont #person-box, #karaage-panko-top #main-cont #effect-cont, #karaage-panko-top #main-cont #recipe .recipe-detail, #karaage-panko-top #product-list .product-chara dl { box-shadow: 7px 7px 0px 0px rgba(25, 12, 11, 0.05); }

#karaage-panko-top #main-visual { padding: 30px 0 0 0; width: 100%; height: 639px; position: relative; display: block; text-align: center; z-index: 15; background: url(../images/karaage-panko/karaage-panko-kv-bg.jpg) no-repeat center top; }

#karaage-panko-top #main-visual > .section h1 { text-align: center; }

#karaage-panko-top #main-visual > .section h1 img:nth-child(2) { margin-top: -40px; }

#karaage-panko-top #main-visual > .section ul.kv-product { width: 820px; margin: 0 auto; }

#karaage-panko-top #main-visual > .section ul.kv-product li { float: left; }

#karaage-panko-top #main-visual > .section ul.kv-product li:nth-child(2) { padding-top: 50px; }

#karaage-panko-top #main-cont { padding: 120px 0 90px 0; position: relative; z-index: 10; background: url(../images/karaage-panko/karaage-panko-bg2.jpg); }

#karaage-panko-top #main-cont:before { margin: -130px auto 0 auto; content: ''; width: 100%; height: 1651px; z-index: -1; display: block; position: absolute; right: 0; left: 0; background: url(../images/karaage-panko/karaage-panko-bg-nature.png) no-repeat center top; }

#karaage-panko-top #main-cont h3 { text-align: center; }

#karaage-panko-top #main-cont #chara-cont h3 { margin: 0 0 70px 0; }

#karaage-panko-top #main-cont #chara-cont #person-box { margin: 0 0 45px 0; padding: 20px 30px; height: 350px; position: relative; background: url(../images/karaage-panko/karaage-panko-chara-bg.png) center bottom #272731; color: #fff; }

#karaage-panko-top #main-cont #chara-cont #person-box:before { margin: auto; width: 940px; height: 330px; content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #666666; }

#karaage-panko-top #main-cont #chara-cont #person-box h4 { text-align: center; }

#karaage-panko-top #main-cont #chara-cont #person-box dl { padding: 80px 0 0 0; }

#karaage-panko-top #main-cont #chara-cont #person-box dl dt { float: left; padding: 0 0 0 90px; margin: 0 0 0 0; }

#karaage-panko-top #main-cont #chara-cont #person-box dl dd { width: 310px; float: right; line-height: 1.6; font-size: 14px; }

#karaage-panko-top #main-cont #effect-cont { padding: 80px 35px 55px 35px; border-radius: 10px; background: #fff; text-align: center; }

#karaage-panko-top #main-cont #effect-cont h3 { margin: 0 0 40px 0; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents { padding: 70px 0 0 0; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents li { float: left; width: 430px; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents li:first-of-type { margin: 0 20px 0 0; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents dl { padding: 35px 0 25px 0; border-radius: 10px; border: 1px solid #e0d9c5; background: #f8f5ec; text-align: center; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents dl dd, #karaage-panko-top #main-cont #effect-cont #pkg-contents dl + p { font-weight: bold; text-align: center; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents dl dd { margin-top: 1em; font-size: 16px; color: #71543a; }

#karaage-panko-top #main-cont #effect-cont #pkg-contents dl + p { margin-top: 1em; font-size: 22px; color: #693206; }

#karaage-panko-top #main-cont #recipe { padding: 110px 0 0 0; }

#karaage-panko-top #main-cont #recipe h3 { margin: 0 0 70px 0; }

#karaage-panko-top #main-cont #recipe .recipe-detail { width: 472px; border-radius: 10px; }

#karaage-panko-top #main-cont #recipe .recipe-detail > p:first-of-type { position: relative; margin-top: -70px; text-align: center; }

#karaage-panko-top #main-cont #recipe .recipe-detail .detail-area { padding: 45px 0 30px 0; background: #fff; border-radius: 6px; }

#karaage-panko-top #main-cont #recipe .recipe-detail .detail-area h4 { text-align: center; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list { margin: 20px auto; width: 400px; padding: 20px 0; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl { margin: 0 0 .5em 0; position: relative; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl:before { width: 400px; overflow: hidden; position: absolute; display: block; content: '・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・'; z-index: 1; letter-spacing: -0.5em; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl dt, #karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl dd { display: inline; background: #fff; vertical-align: middle; position: relative; z-index: 5; font-size: 16px; color: #403024; line-height: 1.375; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl dt { padding-right: .5em; float: left; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl dd { padding-left: .5em; float: right; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl.line2:before { top: 10px; }

#karaage-panko-top #main-cont #recipe .recipe-detail .material-list dl.line2 dd { padding-top: 10px; }

#karaage-panko-top #main-cont #recipe .recipe-detail .point { margin-top: 100px; min-height: 203px; }

#karaage-panko-top #main-cont #recipe .recipe-detail.karaage { background: #5cb0dd; float: left; border: 7px solid #5cb0dd; }

#karaage-panko-top #main-cont #recipe .recipe-detail.karaage .material-list { border-top: 2px solid #5cb0dd; border-bottom: 2px solid #5cb0dd; }

#karaage-panko-top #main-cont #recipe .recipe-detail.karaage .material-list li span { color: #082884; font-weight: bold; }

#karaage-panko-top #main-cont #recipe .recipe-detail.karaage .point { background: #82bfd6; }

#karaage-panko-top #main-cont #recipe .recipe-detail.karaage .steps li { margin: 0 0 25px 0; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko { background: #16b563; float: right; border: 7px solid #16b563; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko .material-list { border-top: 2px solid #16b563; border-bottom: 2px solid #16b563; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko .material-list li span { color: #33ba70; font-weight: bold; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko .point { background: #43BA70; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko .point:before { border-top: 2px solid #16b563; }

#karaage-panko-top #main-cont #recipe .recipe-detail.panko .steps dl dd:last-of-type { position: absolute; top: 20px; right: 20px; }

#karaage-panko-top #main-cont #recipe .steps { padding: 0 0 0 30px; min-height: 550px; }

#karaage-panko-top #main-cont #recipe .steps li { margin: 0 0 20px 0; padding: 0 0 0 60px; position: relative; clear: both; }

#karaage-panko-top #main-cont #recipe .steps li:last-of-child { margin: 0; }

#karaage-panko-top #main-cont #recipe .steps li:before { width: 46px; height: 58px; content: ''; display: block; position: absolute; top: 0; left: 0; }

#karaage-panko-top #main-cont #recipe .steps li:nth-of-type(1) { background: url(../images/karaage-panko/karaage-panko-icon-step1.png) no-repeat; }

#karaage-panko-top #main-cont #recipe .steps li:nth-of-type(2) { background: url(../images/karaage-panko/karaage-panko-icon-step2.png) no-repeat; }

#karaage-panko-top #main-cont #recipe .steps li:nth-of-type(3) { background: url(../images/karaage-panko/karaage-panko-icon-step3.png) no-repeat; }

#karaage-panko-top #main-cont #recipe .steps li:nth-of-type(4) { background: url(../images/karaage-panko/karaage-panko-icon-step4.png) no-repeat; }

#karaage-panko-top #main-cont #recipe .steps dl { width: 190px; }

#karaage-panko-top #main-cont #recipe .steps dl dt { padding: .5em 0; font-size: 20px; color: #403024; font-weight: bold; }

#karaage-panko-top #main-cont #recipe .steps dl dd { font-size: 15px; color: #403024; line-height: 1.5; }

#karaage-panko-top #main-cont #recipe .steps dl dd:last-of-type { position: absolute; top: 20px; right: 10px; }

#karaage-panko-top #main-cont #recipe .point { margin: 0 auto; padding: 28px 22px; width: 400px; position: relative; }

#karaage-panko-top #main-cont #recipe .point:before { position: absolute; top: -35px; left: 0; content: ''; border-top: 2px solid #5cb0dd; display: block; width: 100%; }

#karaage-panko-top #main-cont #recipe .point p { font-size: 16px; color: #fff; text-align: center; letter-spacing: -0.05em; }

#karaage-panko-top #main-cont #recipe .point p:first-of-type { font-size: 20px; }

#karaage-panko-top #main-cont #recipe .point p.description { padding-top: 1.5em; text-align: left; }

#karaage-panko-top #main-cont #recipe .point figure { margin-top: 20px; text-align: center; }

#karaage-panko-top #product-list { padding: 70px 0 80px 0; background: url(../images/karaage-panko/karaage-panko-bg1.png); position: relative; }

#karaage-panko-top #product-list h3 { margin: 0 0 60px 0; text-align: center; }

#karaage-panko-top #product-list .product-info:first-of-type { margin-bottom: 70px; }

#karaage-panko-top #product-list .product-info .product-chara { float: left; }

#karaage-panko-top #product-list .product-info .product-composition { float: right; }

#karaage-panko-top #product-list .product-chara { padding: 18px; width: 328px; height: 340px; position: relative; }

#karaage-panko-top #product-list .product-chara.new1 { background: #5cb0dd; }

#karaage-panko-top #product-list .product-chara.new2 { background: #16b563; }

#karaage-panko-top #product-list .product-chara dl { padding: 20px; width: 100%; height: 100%; background: #fff; }

#karaage-panko-top #product-list .product-chara dl dt { padding: 20px 0; margin: 0 0 15px 0; text-align: center; }

#karaage-panko-top #product-list .product-chara dl dd { padding: 15px 0 30px 55px; min-height: 180px; font-size: 16px; color: #a2792e; line-height: 1.35; background: url(../images/karaage-panko/karaage-panko-product-detailbg.png) no-repeat; }

#karaage-panko-top #product-list .product-chara .product-pkg { position: absolute; bottom: 15px; right: -120px; }

#karaage-panko-top #product-list .product-composition { padding-top: 40px; width: 490px; }

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

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

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

#karaage-panko-top #product-list .product-composition dl dt span, #karaage-panko-top #product-list .product-composition dl dd span { font-size: 12px; }

#karaage-panko-top #product-list .product-composition dl dt { width: 140px; background: #fff; font-weight: bold; }

#karaage-panko-top #product-list .product-composition dl dt span { line-height: 1.2; display: inline-block; }

#karaage-panko-top #product-list .product-composition dl dd { letter-spacing: -0.05em; }

#karaage-panko-top .section { margin: 0 auto; width: 960px; }

#karaage-panko-top .section-full { width: 100%; }