@charset "UTF-8";
/*
Theme Name: 香り揚げ
*/
/* ----------------------------- リセット */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, var, b, i, dl dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-size: 100%; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }

a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; }

ins { background-color: #ff9; color: #000; text-decoration: none; }

mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

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

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

img { vertical-align: top; font-size: 0; line-height: 0; }

sup { font-size: 8px; }

em { font-style: normal; }

/* ----------------------------- 全体 */
html { font-size: 62.5%; }

body { font-size: 16px; font-size: 1.6rem; line-height: 180%; color: #000; background: #530008; position: relative; min-width: 1100px; -webkit-text-size-adjust: 100%; font-feature-settings: "palt"; font-family: "Noto Sans JP", Helvetica, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "小塚ゴシック Pro L", "Kozuka Gothic Pro Light", "メイリオ", Meiryo, "ＭＳ　Ｐゴシック", "MS PGothic", sans-serif; }

a:link, a:visited { color: #000; text-decoration: underline; }
a:hover, a:active { color: #000; text-decoration: none; }
a, a img { -webkit-transition: 0.3s ease all; transition: 0.3s ease all; }
a:hover { opacity: 0.7; -ms-filter: "alpha(opacity=70)"; filter: alpha(opacity=70); }

img { max-width: 100%; height: auto; }

@media screen and (min-width: 768px) { .sp-only { display: none !important; } }
@media screen and (max-width: 767px) { .pc-only { display: none !important; } }
/* ----------------------------- パーツ */
.c-wrap { max-width: 1030px; margin-left: auto; margin-right: auto; padding-left: 10px; padding-right: 10px; }
.c-wrap__1100 { max-width: 1100px; margin-left: auto; margin-right: auto; padding-left: 10px; padding-right: 10px; }

/* ----------------------------- ヘッダー・フッター */
#container { position: relative; }
#container:before { display: block; content: ""; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: url(../img/bg2.png) no-repeat left top, url(../img/bg1.jpg?2) no-repeat center top; }

.l-pagetop { position: fixed; z-index: 999; right: 30px; bottom: 30px; }

/* ----------------------------- チーズアーモンド40周年 */
.p-kaoriage { max-width: 750px; margin-left: auto; margin-right: auto; background: #fff; position: relative; z-index: 9; padding-bottom: 30px; }
.p-kaoriage__header { position: fixed; left: 50px; top: 30px; z-index: 10; }
.p-kaoriage__nav ul { display: flex; align-items: center; justify-content: center; padding: 30px 0 36px; }
.p-kaoriage__nav li { margin-left: 15px; margin-right: 15px; }
.p-kaoriage__nav li a { font-size: 26px; font-size: 2.6rem; border-bottom: 2px solid #000; padding: 12px 0; text-decoration: none; font-family: "Zen Maru Gothic", "Noto Sans JP", Helvetica, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "小塚ゴシック Pro L", "Kozuka Gothic Pro Light", "メイリオ", Meiryo, "ＭＳ　Ｐゴシック", "MS PGothic", sans-serif; font-weight: 900; display: inline-block; }
.p-kaoriage__kv { margin-bottom: 50px; }
.p-kaoriage__kv img { width: 100%; }
.p-kaoriage__point { margin-bottom: 197px; }
.p-kaoriage__point .heading { text-align: center; margin-bottom: 38px; }
.p-kaoriage__point .block1 { margin-left: 35px; margin-right: 35px; margin-bottom: 38px; background-repeat: no-repeat; background-position: center top; background-size: 100% auto; height: 503px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; padding: 40px 30px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.p-kaoriage__point .block1 .content { display: none; }
.p-kaoriage__point .block1 .trigger { margin-top: 15px; width: 46px; height: 46px; cursor: pointer; background: #fff4cc; border: 1.5px solid #d0956e; border-radius: 11px; display: flex; justify-content: center; align-items: center; }
.p-kaoriage__point .block1 .trigger img { -webkit-transition: 0.3s ease all; transition: 0.3s ease all; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.p-kaoriage__point .block1 .trigger.is-open img { -webkit-transform: rotate(270deg); transform: rotate(270deg); }
.p-kaoriage__point .block1:last-child { margin-bottom: 0; }
.p-kaoriage__point .block1.p1 { background-image: url(../img/point1_bg1.jpg); }
.p-kaoriage__point .block1.p1 .content img { filter: drop-shadow(-2px -2px 5px #aa410a) drop-shadow(-2px 2px 5px #aa410a) drop-shadow(2px -2px 5px #aa410a) drop-shadow(2px 2px 5px #aa410a); }
.p-kaoriage__point .block1.p2 { background-image: url(../img/point2_bg1.jpg); }
.p-kaoriage__point .block1.p2 .content img { filter: drop-shadow(-2px -2px 5px #fcc30f) drop-shadow(-2px 2px 5px #fcc30f) drop-shadow(2px -2px 5px #fcc30f) drop-shadow(2px 2px 5px #fcc30f); }
.p-kaoriage__point .block1.p3 { background-image: url(../img/point3_bg1.jpg); }
.p-kaoriage__point .block1.p3 .content img { filter: drop-shadow(-2px -2px 5px #693c8c) drop-shadow(-2px 2px 5px #693c8c) drop-shadow(2px -2px 5px #693c8c) drop-shadow(2px 2px 5px #693c8c); }
.p-kaoriage__lineup { margin-bottom: 103px; }
.p-kaoriage__lineup .heading { text-align: center; margin-bottom: 55px; }
.p-kaoriage__lineup .block1 { margin-left: 35px; margin-right: 35px; margin-bottom: 37px; background-repeat: no-repeat; background-position: center top; background-size: 100% auto; height: 788px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; text-align: center; padding: 54px 30px 42px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.p-kaoriage__lineup .block1:last-child { margin-bottom: 0; }
.p-kaoriage__lineup .block1.p1 { background-image: url(../img/lineup1_bg1.jpg); }
.p-kaoriage__lineup .block1.p2 { background-image: url(../img/lineup2_bg1.jpg); }
.p-kaoriage__lineup .block1 .img1 { margin-bottom: 20px; }
.p-kaoriage__lineup .block1 .txt1 { margin-bottom: 15px; }
.p-kaoriage__campaign { margin-bottom: 52px; }
.p-kaoriage__campaign .heading { text-align: center; margin-bottom: 45px; }
.p-kaoriage__campaign .block1 { margin-left: 33px; margin-right: 33px; text-align: center; }
.p-kaoriage__enjoy .heading { text-align: center; margin-bottom: 25px; }
.p-kaoriage__enjoy .block1 { margin-bottom: 100px; }
.p-kaoriage__enjoy .block1 .t { text-align: center; position: relative; z-index: 2; }
.p-kaoriage__enjoy .block1 .img1 { position: relative; z-index: 1; margin-top: -40px; }
.p-kaoriage__enjoy .block1.p2 { margin-bottom: 50px; }
.p-kaoriage__enjoy .block1.p2 .img1 { margin-top: -20px; }
.p-kaoriage__enjoy .block1.p3 { margin-bottom: 27px; }
.p-kaoriage__enjoy .note { margin-left: 37px; margin-right: 37px; }
.p-kaoriage__enjoy .note li { font-size: 19px; font-size: 1.9rem; line-height: 1.5; text-indent: -1em; padding-left: 1em; font-weight: 500; }

/* ----------------------------- タブレット */
/* ----------------------------- スマホ */
@media screen and (max-width: 767px) { body { min-width: initial; font-size: 14px; font-size: 1.4rem; background: none; }
  .l-pagetop { right: 15px; bottom: 15px; width: 50px; }
  .p-kaoriage { padding-bottom: 15px; }
  .p-kaoriage__header { left: 2.66667vw; top: 2.66667vw; }
  .p-kaoriage__header img { width: 8.53333vw; height: 8.53333vw; }
  .p-kaoriage__nav ul { padding-top: 2.13333vw; padding-bottom: 3.73333vw; padding-left: 11.2vw; }
  .p-kaoriage__nav li { margin-left: 1.86667vw; margin-right: 1.86667vw; }
  .p-kaoriage__nav li a { font-size: 3.2vw; border-bottom-width: 1px; padding-top: 1.06667vw; padding-bottom: 0.26667vw; }
  .p-kaoriage__kv { margin-bottom: 40px; }
  .p-kaoriage__point { margin-bottom: 100px; }
  .p-kaoriage__point .heading { margin-bottom: 20px; }
  .p-kaoriage__point .heading img { width: auto; height: 50px; }
  .p-kaoriage__point .block1 { margin-left: 15px; margin-right: 15px; margin-bottom: 20px; height: 67.06667vw; padding: 5.33333vw 4vw 2.66667vw; }
  .p-kaoriage__point .block1 .t img { width: 60.26667vw; }
  .p-kaoriage__point .block1 .content img { width: 62vw; }
  .p-kaoriage__point .block1 .trigger { margin-top: 2.66667vw; width: 6.66667vw; height: 6.66667vw; border: 1px solid #d0956e; border-radius: 1.33333vw; }
  .p-kaoriage__point .block1 .trigger img { width: 3.2vw; }
  .p-kaoriage__point .block1.p1 .content img { filter: drop-shadow(-2px -2px 5px #aa410a) drop-shadow(-2px 2px 5px #aa410a) drop-shadow(2px -2px 5px #aa410a) drop-shadow(2px 2px 5px #aa410a); }
  .p-kaoriage__point .block1.p2 .content img { filter: drop-shadow(-2px -2px 5px #fcc30f) drop-shadow(-2px 2px 5px #fcc30f) drop-shadow(2px -2px 5px #fcc30f) drop-shadow(2px 2px 5px #fcc30f); }
  .p-kaoriage__point .block1.p3 .content img { filter: drop-shadow(-2px -2px 5px #693c8c) drop-shadow(-2px 2px 5px #693c8c) drop-shadow(2px -2px 5px #693c8c) drop-shadow(2px 2px 5px #693c8c); }
  .p-kaoriage__lineup { margin-bottom: 52px; }
  .p-kaoriage__lineup .heading { margin-bottom: 20px; }
  .p-kaoriage__lineup .heading img { width: auto; height: 50px; }
  .p-kaoriage__lineup .block1 { margin-left: 15px; margin-right: 15px; margin-bottom: 20px; height: 105.06667vw; padding: 6.66667vw 4vw 5.33333vw; }
  .p-kaoriage__lineup .block1 .img1 { margin-bottom: 2.66667vw; }
  .p-kaoriage__lineup .block1 .img1 img { width: 54.13333vw; }
  .p-kaoriage__lineup .block1 .txt1 { margin-bottom: 2.13333vw; }
  .p-kaoriage__lineup .block1 .txt1 img { width: 68.4vw; }
  .p-kaoriage__lineup .block1 .btn img { width: 33.86667vw; }
  .p-kaoriage__campaign { margin-bottom: 40px; }
  .p-kaoriage__campaign .heading { margin-bottom: 20px; }
  .p-kaoriage__campaign .heading img { width: auto; height: 50px; }
  .p-kaoriage__campaign .block1 { margin-left: 15px; margin-right: 15px; }
  .p-kaoriage__enjoy .heading { margin-bottom: 15px; }
  .p-kaoriage__enjoy .heading img { width: auto; height: 50px; }
  .p-kaoriage__enjoy .block1 { margin-bottom: 50px; }
  .p-kaoriage__enjoy .block1 .t { margin-left: 15px; margin-right: 15px; }
  .p-kaoriage__enjoy .block1 .img1 { margin-top: -20px; }
  .p-kaoriage__enjoy .block1.p2 { margin-bottom: 25px; }
  .p-kaoriage__enjoy .block1.p2 .img1 { margin-top: -10px; }
  .p-kaoriage__enjoy .block1.p3 { margin-bottom: 13px; }
  .p-kaoriage__enjoy .note { margin-left: 15px; margin-right: 15px; }
  .p-kaoriage__enjoy .note li { font-size: 10px; font-size: 1rem; } }
@media screen and (min-width: 768px) { .l-footer { /* width: 1600px; */ padding-top: 60px; padding-bottom: 40px; margin: 0 auto; background: #fff; position: relative; z-index: 10; }
  .l-footer .footer-h5 { text-align: center; font-size: 25px; margin-bottom: 57px; }
  .l-footer .ul-a { display: flex; }
  .l-footer .ul-a li { padding: 0 17px; }
  .l-footer .footer-wrap { display: flex; justify-content: center; margin-bottom: 27px; }
  .l-footer .line-ss { display: none; }
  .l-footer .footer-wrap-sp { display: none; }
  .l-footer .footer-wrap .sns { padding-left: 33px; }
  .l-footer .footer-wrap .sns H4 { font-size: 25px; color: #727171; text-align: center; padding: 0px 0 20px 0; }
  .l-footer .menu, .l-footer .menu .footer-ul { display: flex; justify-content: center; }
  .l-footer .footer-sanko { text-align: center; margin-bottom: 34px; display: block; }
  .l-footer .menu .footer-ul li { padding: 0 22px; }
  .l-footer .menu .footer-ul li a { text-decoration: none; cursor: pointer; }
  .l-footer .menu p { padding-right: 80px; }
  .l-footer .footer-h5 br { display: none; }
  .Karuta .Karuta-wrap .shaking-a { transform-origin: center bottom; animation: yurayura 6s linear infinite; width: 32%; /* top: 34px; */ }
  .l-footer .left-box { width: 30%; box-sizing: border-box; max-width: 56.6rem; display: flex; align-items: center; justify-content: space-between; /* padding: 2.09% 2.09% 2.09% 2.09%; */ padding: 1.09% 1.09% 1.09% 1.09%; margin: 0% 2.0% 0% 0%; border-radius: 2.0rem; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4); }
  .l-footer .left-box.is-insta { width: 20%; } }
@media screen and (min-width: 768px) and (min-width: 916px) and (max-width: 1200px) { .l-footer .left-box { width: 45%; } }
@media screen and (min-width: 768px) and (max-width: 1570px) { .l-footer .left-box { width: 35%; }
  .l-footer .left-box p { font-size: 160.5% !important; } }
@media screen and (min-width: 768px) { .l-footer .left-box .line { width: 20.49%; }
  .l-footer .left-box .insta { width: 31.49%; }
  .l-footer .left-box .qr { width: 20.49%; }
  .l-footer .left-box p { text-align: left; font-weight: bold; font-size: 162.5%; line-height: 1.46; margin: 0 0.5rem; } }
@media screen and (max-width: 767px) { .l-footer { padding: 20px 12px; background: #fff; position: relative; z-index: 10; }
  .l-footer .footer-wrap { display: none; }
  .l-footer .footer-h5 { text-align: center; font-size: 15px; line-height: 20px; padding: 18px 0px 12px; }
  .l-footer .footer-wrap-sp { display: block; }
  .l-footer .footer-wrap-sp ul { display: flex; justify-content: center; }
  .l-footer .footer-wrap-sp ul li { max-width: 50px; padding: 0 12px; }
  .l-footer .menu { flex-direction: column-reverse; display: flex; }
  .l-footer .menu .footer-ul { display: flex; justify-content: center; margin-bottom: 10px; }
  .l-footer .menu .footer-ul li { /* padding: 0 7px; */ padding-right: 1.2rem; }
  .l-footer .menu .footer-ul li:last-child { padding-right: 0; }
  .l-footer .menu .footer-ul li a { text-decoration: none; cursor: pointer; font-size: 12px; }
  .l-footer .footer-sanko { width: 100%; text-align: center; margin: 20px auto; display: inline-block; }
  .l-footer .footer-sanko img { width: 88.98%; max-width: 319px; }
  .l-footer .Copyright { font-size: 0.85rem; text-align: center; margin-bottom: 10px; } }
@keyframes top-bottom { 50% { transform: translate(0, -50px); } }
@keyframes right-left { 50% { transform: translate(-50px, 0); } }
@keyframes c-scale { 50% { transform: scale(0.8) rotate(90deg); } }
/* フェードインしながら少し上へ */
@-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); }
  100% { opacity: 1; -webkit-transform: translateY(0); } }
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); } }
@-webkit-keyframes fadeOut { 0% { opacity: 1; -webkit-transform: translateY(0); }
  100% { opacity: 0; -webkit-transform: translateY(20px); } }
@keyframes fadeOut { 0% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(20px); } }
.js-hidden-animate { opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }
.js-hidden-animate.is--animate { -webkit-animation: fadeOut 1.2s 1 ease-in-out; animation: fadeOut 1.2s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }

.js-animate { opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }
.js-animate.is--animate { -webkit-animation: fadeInUp 0.6s 1 ease-in-out; animation: fadeInUp 0.6s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }
.js-animate--delay1 { -webkit-animation-delay: 0.1s !important; animation-delay: 0.1s !important; }
.js-animate--delay2 { -webkit-animation-delay: 0.2s !important; animation-delay: 0.2s !important; }
.js-animate--delay3 { -webkit-animation-delay: 0.3s !important; animation-delay: 0.3s !important; }
.js-animate--delay4 { -webkit-animation-delay: 0.4s !important; animation-delay: 0.4s !important; }
.js-animate--delay5 { -webkit-animation-delay: 0.5s !important; animation-delay: 0.5s !important; }
.js-animate--delay6 { -webkit-animation-delay: 0.6s !important; animation-delay: 0.6s !important; }
.js-animate--delay7 { -webkit-animation-delay: 0.7s !important; animation-delay: 0.7s !important; }
.js-animate--delay8 { -webkit-animation-delay: 0.8s !important; animation-delay: 0.8s !important; }
.js-animate--delay9 { -webkit-animation-delay: 0.9s !important; animation-delay: 0.9s !important; }
.js-animate--delay10 { -webkit-animation-delay: 1s !important; animation-delay: 1s !important; }
.js-animate--delay11 { -webkit-animation-delay: 1.1s !important; animation-delay: 1.1s !important; }
.js-animate--delay12 { -webkit-animation-delay: 1.2s !important; animation-delay: 1.2s !important; }
.js-animate--delay13 { -webkit-animation-delay: 1.3s !important; animation-delay: 1.3s !important; }
.js-animate--delay14 { -webkit-animation-delay: 1.4s !important; animation-delay: 1.4s !important; }
.js-animate--delay15 { -webkit-animation-delay: 1.5s !important; animation-delay: 1.5s !important; }
.js-animate--delay16 { -webkit-animation-delay: 1.6s !important; animation-delay: 1.6s !important; }
.js-animate--delay17 { -webkit-animation-delay: 1.7s !important; animation-delay: 1.7s !important; }
.js-animate--delay18 { -webkit-animation-delay: 1.8s !important; animation-delay: 1.8s !important; }
.js-animate--delay19 { -webkit-animation-delay: 1.9s !important; animation-delay: 1.9s !important; }
.js-animate--delay20 { -webkit-animation-delay: 2s !important; animation-delay: 2s !important; }
.js-animate--delay21 { -webkit-animation-delay: 2.1s !important; animation-delay: 2.1s !important; }
.js-animate--delay22 { -webkit-animation-delay: 2.2s !important; animation-delay: 2.2s !important; }
.js-animate--delay23 { -webkit-animation-delay: 2.3s !important; animation-delay: 2.3s !important; }
.js-animate--delay24 { -webkit-animation-delay: 2.4s !important; animation-delay: 2.4s !important; }
.js-animate--delay25 { -webkit-animation-delay: 2.5s !important; animation-delay: 2.5s !important; }
.js-animate--delay26 { -webkit-animation-delay: 2.6s !important; animation-delay: 2.6s !important; }
.js-animate--delay27 { -webkit-animation-delay: 2.7s !important; animation-delay: 2.7s !important; }
.js-animate--delay28 { -webkit-animation-delay: 2.8s !important; animation-delay: 2.8s !important; }
.js-animate--delay29 { -webkit-animation-delay: 2.9s !important; animation-delay: 2.9s !important; }
.js-animate--delay30 { -webkit-animation-delay: 3s !important; animation-delay: 3s !important; }
.js-animate--delay31 { -webkit-animation-delay: 3.1s !important; animation-delay: 3.1s !important; }
.js-animate--delay32 { -webkit-animation-delay: 3.2s !important; animation-delay: 3.2s !important; }
.js-animate--delay33 { -webkit-animation-delay: 3.3s !important; animation-delay: 3.3s !important; }
.js-animate--delay34 { -webkit-animation-delay: 3.4s !important; animation-delay: 3.4s !important; }
.js-animate--delay35 { -webkit-animation-delay: 3.5s !important; animation-delay: 3.5s !important; }
.js-animate--delay36 { -webkit-animation-delay: 3.6s !important; animation-delay: 3.6s !important; }
.js-animate--delay37 { -webkit-animation-delay: 3.7s !important; animation-delay: 3.7s !important; }
.js-animate--delay38 { -webkit-animation-delay: 3.8s !important; animation-delay: 3.8s !important; }
.js-animate--delay39 { -webkit-animation-delay: 3.9s !important; animation-delay: 3.9s !important; }
.js-animate--delay40 { -webkit-animation-delay: 4s !important; animation-delay: 4s !important; }
.js-animate--duration1 { -webkit-animation-duration: 0.1s !important; animation-duration: 0.1s !important; }
.js-animate--duration2 { -webkit-animation-duration: 0.2s !important; animation-duration: 0.2s !important; }
.js-animate--duration3 { -webkit-animation-duration: 0.3s !important; animation-duration: 0.3s !important; }
.js-animate--duration4 { -webkit-animation-duration: 0.4s !important; animation-duration: 0.4s !important; }
.js-animate--duration5 { -webkit-animation-duration: 0.5s !important; animation-duration: 0.5s !important; }
.js-animate--duration6 { -webkit-animation-duration: 0.6s !important; animation-duration: 0.6s !important; }
.js-animate--duration7 { -webkit-animation-duration: 0.7s !important; animation-duration: 0.7s !important; }
.js-animate--duration8 { -webkit-animation-duration: 0.8s !important; animation-duration: 0.8s !important; }
.js-animate--duration9 { -webkit-animation-duration: 0.9s !important; animation-duration: 0.9s !important; }
.js-animate--duration10 { -webkit-animation-duration: 1s !important; animation-duration: 1s !important; }
.js-animate--duration11 { -webkit-animation-duration: 1.1s !important; animation-duration: 1.1s !important; }
.js-animate--duration12 { -webkit-animation-duration: 1.2s !important; animation-duration: 1.2s !important; }
.js-animate--duration13 { -webkit-animation-duration: 1.3s !important; animation-duration: 1.3s !important; }
.js-animate--duration14 { -webkit-animation-duration: 1.4s !important; animation-duration: 1.4s !important; }
.js-animate--duration15 { -webkit-animation-duration: 1.5s !important; animation-duration: 1.5s !important; }
.js-animate--duration16 { -webkit-animation-duration: 1.6s !important; animation-duration: 1.6s !important; }
.js-animate--duration17 { -webkit-animation-duration: 1.7s !important; animation-duration: 1.7s !important; }
.js-animate--duration18 { -webkit-animation-duration: 1.8s !important; animation-duration: 1.8s !important; }
.js-animate--duration19 { -webkit-animation-duration: 1.9s !important; animation-duration: 1.9s !important; }
.js-animate--duration20 { -webkit-animation-duration: 2s !important; animation-duration: 2s !important; }
.js-animate--duration21 { -webkit-animation-duration: 2.1s !important; animation-duration: 2.1s !important; }
.js-animate--duration22 { -webkit-animation-duration: 2.2s !important; animation-duration: 2.2s !important; }
.js-animate--duration23 { -webkit-animation-duration: 2.3s !important; animation-duration: 2.3s !important; }
.js-animate--duration24 { -webkit-animation-duration: 2.4s !important; animation-duration: 2.4s !important; }
.js-animate--duration25 { -webkit-animation-duration: 2.5s !important; animation-duration: 2.5s !important; }
.js-animate--duration26 { -webkit-animation-duration: 2.6s !important; animation-duration: 2.6s !important; }
.js-animate--duration27 { -webkit-animation-duration: 2.7s !important; animation-duration: 2.7s !important; }
.js-animate--duration28 { -webkit-animation-duration: 2.8s !important; animation-duration: 2.8s !important; }
.js-animate--duration29 { -webkit-animation-duration: 2.9s !important; animation-duration: 2.9s !important; }
.js-animate--duration30 { -webkit-animation-duration: 3s !important; animation-duration: 3s !important; }
.js-animate--duration31 { -webkit-animation-duration: 3.1s !important; animation-duration: 3.1s !important; }
.js-animate--duration32 { -webkit-animation-duration: 3.2s !important; animation-duration: 3.2s !important; }
.js-animate--duration33 { -webkit-animation-duration: 3.3s !important; animation-duration: 3.3s !important; }
.js-animate--duration34 { -webkit-animation-duration: 3.4s !important; animation-duration: 3.4s !important; }
.js-animate--duration35 { -webkit-animation-duration: 3.5s !important; animation-duration: 3.5s !important; }
.js-animate--duration36 { -webkit-animation-duration: 3.6s !important; animation-duration: 3.6s !important; }
.js-animate--duration37 { -webkit-animation-duration: 3.7s !important; animation-duration: 3.7s !important; }
.js-animate--duration38 { -webkit-animation-duration: 3.8s !important; animation-duration: 3.8s !important; }
.js-animate--duration39 { -webkit-animation-duration: 3.9s !important; animation-duration: 3.9s !important; }
.js-animate--duration40 { -webkit-animation-duration: 4s !important; animation-duration: 4s !important; }

/* フェードインしながら少し右へ */
@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(-20px); }
  100% { opacity: 1; -webkit-transform: translateX(0); } }
@keyframes fadeInRight { 0% { opacity: 0; transform: translateX(-20px); }
  100% { opacity: 1; transform: translateX(0); } }
.js-animateFadeInRight { opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }
.js-animateFadeInRight.is--animate { -webkit-animation: fadeInRight 0.8s 1 ease-in-out; animation: fadeInRight 0.8s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }

/* フェードインしながら少し左へ */
@-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(20px); }
  100% { opacity: 1; -webkit-transform: translateX(0); } }
@keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(20px); }
  100% { opacity: 1; transform: translateX(0); } }
.js-animateFadeInLeft { opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }
.js-animateFadeInLeft.is--animate { -webkit-animation: fadeInLeft 0.8s 1 ease-in-out; animation: fadeInLeft 0.8s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }

/* フェードインしながら少し上へ */
@-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(40px); }
  100% { opacity: 1; -webkit-transform: translateY(0); } }
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(40px); }
  100% { opacity: 1; transform: translateY(0); } }
.js-animateFadeInUp { opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }
.js-animateFadeInUp.is--animate { -webkit-animation: fadeInUp 0.8s 1 ease-in-out; animation: fadeInUp 0.8s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }

/* フェードインのみ */
@-webkit-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
.js-animateFadeIn { opacity: 0; -ms-filter: "alpha(opacity=0)"; filter: alpha(opacity=0); }
.js-animateFadeIn.is--animate { -webkit-animation: fadeIn 0.8s 1 ease-in-out; animation: fadeIn 0.8s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 1; -ms-filter: "alpha(opacity=100)"; filter: alpha(opacity=100); }

/* 左からマスク */
@-webkit-keyframes maskRight { 0% { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }
  100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } }
@keyframes maskRight { 0% { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }
  100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } }
.js-animateMaskRight { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }
.js-animateMaskRight.is--animate { -webkit-animation: maskRight 0.8s 1 ease-in-out; animation: maskRight 0.8s 1 ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

/* 上下無限 */
@keyframes updown { 0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-20px); } }
.u-animation-updown { animation: updown 3s infinite; }

@media screen and (max-width: 768px) { @keyframes updown { 0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); } } }
