@charset "UTF-8";
/*
Theme Name: チーズアーモンド40周年
*/
/* ----------------------------- リセット */
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; }

div:before, div:after, ul:before, ul:after, ol:before, ol:after, dl:before, dl:after { content: ""; display: block; }

div:after, ul:after, ol:after, dl:after { clear: both; }

div, ul, ol, dl { zoom: 1; }

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

body { font-size: 16px; font-size: 1.6rem; line-height: 180%; color: #000; background: #fff; position: relative; min-width: 1100px; -webkit-text-size-adjust: 100%; 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: #3F3C3E; text-decoration: underline; }
a:hover, a:active { color: #3F3C3E; 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; }

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

/* ----------------------------- チーズアーモンド40周年 */
.p-ca40__header { position: fixed; left: 0; top: 0; width: 100%; background: #fff; display: flex; justify-content: space-between; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 20px 50px; z-index: 999; }
.p-ca40__header .logo { width: 90px; }
.p-ca40__header .nav { display: flex; align-items: center; justify-content: center; width: calc(100% - 120px); }
.p-ca40__header .nav li { font-size: 37px; font-size: 3.7rem; 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; line-height: 1.5; margin-left: 40px; margin-right: 40px; text-decoration-line: underline; text-decoration-color: #000; text-decoration-style: solid; text-decoration-thickness: 3px; text-underline-offset: 12px; text-decoration-skip-ink: none; }
.p-ca40__header .nav a { color: #000; }
.p-ca40-wrap { padding-top: 130px; padding-bottom: 115px; background: url(../img/kv_bg2.png) no-repeat center top, url(../img/kv_bg1.png) no-repeat center top; background-color: #fff200; background-size: auto, 100% auto; }
.p-ca40__kv { text-align: center; padding-top: 35px; }
.p-ca40__kv .title { position: relative; max-width: 1600px; margin-left: auto; margin-right: auto; }
.p-ca40__kv .title-icon { position: absolute; }
.p-ca40__kv .title-icon.i1 { width: 22.125%; top: 15.7522%; left: 9.875%; }
.p-ca40__kv .title-icon.i2 { width: 18.875%; right: 17.8125%; bottom: 14.6902%; }
.p-ca40__kv .txt1 { position: relative; margin-top: -83px; max-width: 1600px; margin-left: auto; margin-right: auto; }
.p-ca40__kv .txt1-icon { position: absolute; }
.p-ca40__kv .txt1-icon.i1 { width: 13.375%; top: 12.4118%; left: 13.9375%; }
.p-ca40__kv .txt1-icon.i2 { width: 17.125%; right: 12.875%; top: 0; }
.p-ca40-content { border: 14px solid rgba(255, 190, 0, 0.8); background: #FFFCCC; border-radius: 85px; max-width: 1300px; -webkit-box-sizing: border-box; box-sizing: border-box; margin-left: auto; margin-right: auto; padding: 0 30px 40px; text-align: center; }
.p-ca40__about { padding-top: 50px; margin-bottom: 82px; }
.p-ca40__about .lead { margin-bottom: 28px; position: relative; }
.p-ca40__about .lead .btn { margin-top: 10px; }
.p-ca40__about .lead-icon { position: absolute; top: 0; }
.p-ca40__about .lead-icon.i1 { width: 15.8415%; left: 1.815%; }
.p-ca40__about .lead-icon.i2 { width: 14.4389%; right: 1.815%; }
.p-ca40__event .title { position: relative; text-align: center; }
.p-ca40__event .title-icon { position: absolute; width: 4.7029%; }
.p-ca40__event .title-icon.i1 { left: 6.1881%; bottom: 20.4753%; }
.p-ca40__event .title-icon.i2 { right: 5.6930%; bottom: 7.8610%; }
.p-ca40__event .btn { position: relative; margin-top: -58px; margin-bottom: 45px; display: flex; flex-direction: column; justify-content: center; }
.p-ca40__event .btn a { margin-bottom: 76px; }
.p-ca40__event .btn a:last-child { margin-bottom: 0; }
.p-ca40__game { background-image: url(../img/game_bg1.png), url(../img/game_bg2.png), url(../img/game_bg3.png); background-position: center top, center bottom, center top; background-repeat: repeat-x, repeat-x, repeat-y; background-color: #fffbb2; padding-top: 108px; padding-bottom: 86px; }
.p-ca40__game .wrap { max-width: 900px; margin-left: auto; margin-right: auto; }
.p-ca40__game .heading { text-align: center; margin-bottom: 24px; position: relative; }
.p-ca40__game .heading .title { margin-bottom: 24px; }
.p-ca40__game .heading .icon1 { position: absolute; top: 0; right: -80px; }
.p-ca40__game .content { display: flex; justify-content: center; text-align: center; }
.p-ca40__game .content li { width: 50%; }
.p-ca40__game .content .img1 { margin-bottom: 27px; }
.p-ca40__game .content .txt1 { margin-bottom: 15px; }
.p-ca40__link { background: #fff200; padding-top: 77px; padding-bottom: 58px; }
.p-ca40__link .wrap { max-width: 1010px; margin-left: auto; margin-right: auto; }
.p-ca40__link .bnr { margin-bottom: 35px; }
.p-ca40__link .bnr li { margin-bottom: 30px; }
.p-ca40__link .bnr li:last-child { margin-bottom: 0; }
.p-ca40__link .note p { text-indent: -1em; padding-left: 1em; font-size: 19px; font-size: 1.9rem; line-height: 1.5; }

.lb-number { display: none !important; }

.remodal { max-width: 1100px; padding: 30px; background: transparent; }
.remodal-close { width: 70px; height: 70px; background: transparent url(../img/icon_close.svg) no-repeat center; background-size: contain; left: auto; border-radius: 100%; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
.remodal-close:before { display: none; }
.remodal.event1 .remodal-close { top: 86px; right: 75px; }
.remodal.event2 { padding-top: 100px; }
.remodal.event2 .remodal-close { top: 30px; right: 0; }
.remodal.game1, .remodal.game2 { max-width: 589px; }
.remodal.game1 .remodal-close, .remodal.game2 .remodal-close { right: 0; }

/* ----------------------------- タブレット */
/* ----------------------------- スマホ */
@media screen and (max-width: 767px) { body { min-width: initial; font-size: 14px; font-size: 1.4rem; }
  .l-pagetop { right: 15px; bottom: 15px; width: 50px; }
  .p-ca40__header { padding: 11px 0 11px 7px; }
  .p-ca40__header .logo { width: 32px; }
  .p-ca40__header .nav { width: calc(100% - 32px); }
  .p-ca40__header .nav li { margin-left: 7px; margin-right: 7px; font-size: 13px; font-size: 1.3rem; text-decoration-thickness: 1px; text-underline-offset: 6px; }
  .p-ca40-wrap { background: url(../img/kv_bg1_sp.png) no-repeat center top; background-color: #fff200; background-size: contain; padding-top: 76px; padding-bottom: 35px; }
  .p-ca40__kv { padding-top: 0; padding-bottom: 0; }
  .p-ca40__kv .title { margin-bottom: 5vw; }
  .p-ca40__kv .title-icon.i1 { width: 22.6666%; top: 37.5%; left: 4.5333%; }
  .p-ca40__kv .title-icon.i2 { width: 27.3333%; bottom: 21.75%; right: 4.2666%; }
  .p-ca40__kv .txt1 { margin-top: 0; }
  .p-ca40__kv .txt1-icon.i1 { width: 16.2666%; left: 2.4%; top: 19.8675%; }
  .p-ca40__kv .txt1-icon.i2 { width: 25.8666%; right: 3.0666%; top: -12.0860%; }
  .p-ca40-content { max-width: 90%; border-radius: 27px; border-width: 4px; padding: 0 7px 6px 7px; }
  .p-ca40__about { padding-top: 23px; margin-bottom: 31px; }
  .p-ca40__about .lead { margin-bottom: 6px; padding-left: 7.5%; padding-right: 7.5%; }
  .p-ca40__about .lead-icon.i1 { width: 8.2408%; left: 2.5356%; top: -4.7619%; }
  .p-ca40__about .lead-icon.i2 { width: 15.2139%; right: -5.6069%; top: -7.1428%; }
  .p-ca40__event .title-icon { width: 5.4814%; }
  .p-ca40__event .title-icon.i1 { left: 2.5185%; bottom: 19.5454%; }
  .p-ca40__event .title-icon.i2 { right: 5.1851%; bottom: 29.5454%; }
  .p-ca40__event .btn { margin-top: -3.86vw; margin-bottom: 10px; }
  .p-ca40__event .btn a { margin-bottom: 22px; }
  .p-ca40__event .btn a:last-child { margin-bottom: 0; }
  .p-ca40__game { background-image: url(../img/game_bg1.png), url(../img/game_bg2.png); background-position: center top, center bottom; background-repeat: repeat-x, repeat-x; background-size: auto 15px, auto 15px; background-color: #fffbb2; padding-top: 32px; padding: 32px 4%; }
  .p-ca40__game .heading { margin-bottom: 10px; }
  .p-ca40__game .heading .title { margin-bottom: 10px; }
  .p-ca40__game .heading .title img { width: 270px; }
  .p-ca40__game .heading .lead img { width: 310px; }
  .p-ca40__game .heading .icon1 { top: 5px; right: -1%; }
  .p-ca40__game .heading .icon1 img { width: 67px; }
  .p-ca40__game .content li { -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 8px; padding-right: 8px; }
  .p-ca40__game .content .img1 { margin-bottom: 11px; }
  .p-ca40__game .content .txt1 { margin-bottom: 5px; }
  .p-ca40__link { padding: 30px 20px 26px; }
  .p-ca40__link .bnr { margin-bottom: 10px; }
  .p-ca40__link .bnr li { margin-bottom: 15px; }
  .p-ca40__link .bnr li:last-child { margin-bottom: 0; }
  .p-ca40__link .note p { font-size: 10px; font-size: 1rem; }
  .remodal { padding: 12px; }
  .remodal-wrapper { padding: 0; }
  .remodal-close { width: 28px; height: 28px; right: 12px; drop-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4); }
  .remodal.event1, .remodal.event2 { padding-top: 28px; }
  .remodal.event1 .remodal-close, .remodal.event2 .remodal-close { top: 8px; right: 12px; } }
@media screen and (min-width: 768px) { .l-footer { /* width: 1600px; */ padding-top: 60px; padding-bottom: 40px; margin: 0 auto; background: #fff; }
  .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; }
  .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); } } }
