@charset "UTF-8";
.summer-cp2023 { font-size: 2.2rem; line-height: 2.4; }
@media (max-width: 768px) { .summer-cp2023 { font-size: 1.6rem; } }
.summer-cp2023 .inner { max-width: 1240px; margin: 0 auto; padding-left: 20px; padding-right: 20px; }
@media (max-width: 768px) { .summer-cp2023 .inner { padding-left: 3%; padding-right: 3%; } }
.summer-cp2023 .col-half { display: flex; width: 100%; }
.summer-cp2023 .col-half.-reverse { flex-direction: row-reverse; }
@media (max-width: 768px) { .summer-cp2023 .col-half.-reverse { flex-direction: row; } }
.summer-cp2023 .col-half.-reverse > div { margin-left: 0; margin-right: 20px; }
.summer-cp2023 .col-half.-reverse > div:nth-child(2n + 1) { margin-left: 0; margin-right: 0; }
.summer-cp2023 .col-half.-itemcenter { align-items: center; }
.summer-cp2023 .col-half > div { width: calc((100% - 20px) / 2); margin-left: 20px; }
.summer-cp2023 .col-half > div:nth-child(2n + 1) { margin-left: 0; }
@media (max-width: 768px) { .summer-cp2023 .col-half { display: block; }
  .summer-cp2023 .col-half > div { width: 100%; margin-left: 0; }
  .summer-cp2023 .col-half > div + div { margin-top: 10%; } }
.summer-cp2023 rt { font-weight: normal; letter-spacing: -0.1em; opacity: 0.7; }
@media (max-width: 768px) { .summer-cp2023 rt { transform: translateY(3px); } }
.summer-cp2023 .m-s { margin: 1em; }
.summer-cp2023 .c-maker { background: linear-gradient(transparent 70%, rgba(242, 255, 0, 0.7) 0); }
.summer-cp2023 .color-foodloss { color: #00ce40; }
.summer-cp2023 .theme__wrap { display: none; }
.summer-cp2023 .theme__wrap.-act { display: block; }
.summer-cp2023 .c-notice { font-weight: normal; font-size: 1.6rem; color: #555; }
.summer-cp2023 .c-notice rt { letter-spacing: -0.3em; }
.summer-cp2023 .relect { transform: scale(-1); }
.summer-cp2023 .kv { width: 100%; position: relative; }
.summer-cp2023 .kv img { width: 100%; object-fit: cover; max-height: 800px; }
.summer-cp2023 .kv:before { content: ""; display: block; background: url(/activity/summer-2023/images/kv_btm.png) repeat-x center; width: 100%; height: 55px; position: absolute; bottom: 0; left: 0; }
@media (max-width: 768px) { .summer-cp2023 .kv:before { height: 25px; background: url(/activity/summer-2023/images/kv_btm.png) repeat-x center bottom; background-size: cover; } }
.summer-cp2023 .lede { position: relative; padding-bottom: 40px; }
.summer-cp2023 .lede__logo { width: 26vw; text-align: center; margin: -20% auto 30px; }
@media (max-width: 768px) { .summer-cp2023 .lede__logo { margin: -20% auto 5%; width: 40vw; } }
.summer-cp2023 .lede__logo img { width: 100%; max-width: 382px; }
.summer-cp2023 .lede__txt { margin-bottom: 60px; }
@media (max-width: 768px) { .summer-cp2023 .lede__txt { margin-bottom: 5%; } }
.summer-cp2023 .lede__nav { text-align: center; }
.summer-cp2023 .lede__nav li { position: relative; }
.summer-cp2023 .lede__nav .popup { position: absolute; right: 0; top: 0; transform: translate(68%, -74%); filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.2)); transition: .4s; }
.summer-cp2023 .lede__nav .popup:hover { transform: translate(68%, -78%); opacity: 0.8; }
@media (max-width: 1114px) { .summer-cp2023 .lede__nav .popup { transform: none; top: 120px; transition: 0s; }
  .summer-cp2023 .lede__nav .popup:hover { transform: none; opacity: 1; } }
@media (max-width: 400px) { .summer-cp2023 .lede__nav .popup { top: 20vw; } }
.summer-cp2023 .theme { background: url(/activity/summer-2023/images/theme_tp.png) #dfffb9 repeat-x center top; margin-top: -100px; padding: 100px 0 60px; }
.summer-cp2023 .theme__head { text-align: center; margin-bottom: 60px; }
.summer-cp2023 .theme__tab { display: flex; justify-content: center; align-items: flex-start; width: calc(100% - 80px); margin: 0 auto; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab { width: calc(100% - 0%); } }
.summer-cp2023 .theme__tab > li { width: calc((100% - 40px) / 3); margin-left: 20px; text-align: center; line-height: 1.2; border-radius: 10px; margin-bottom: 20px; position: relative; cursor: pointer; transition: opacity .4s; }
.summer-cp2023 .theme__tab > li:hover { opacity: 0.7; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab > li { margin-left: 5px; margin-bottom: 5px; } }
.summer-cp2023 .theme__tab > li.-current { border-radius: 10px 10px 0 0; margin-bottom: 0; border-bottom: solid 20px #ddd; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab > li.-current { border-bottom: solid 5px #ddd; } }
.summer-cp2023 .theme__tab > li.foodloss { background: #00ce40; }
.summer-cp2023 .theme__tab > li.foodloss.-current { border-color: #00ce40; }
.summer-cp2023 .theme__tab > li.factory { background: #ff4e84; }
.summer-cp2023 .theme__tab > li.factory.-current { border-color: #ff4e84; }
.summer-cp2023 .theme__tab > li.space { background: #0079d9; }
.summer-cp2023 .theme__tab > li.space.-current { border-color: #0079d9; }
.summer-cp2023 .theme__tab > li.-soon { pointer-events: none; }
.summer-cp2023 .theme__tab > li.-soon > a { opacity: 0.7; }
.summer-cp2023 .theme__tab > li.-soon:after { content: "すこし\Aまってね"; position: absolute; top: -1.5em; right: -1.5em; font-size: 11px; width: 6em; height: 6em; display: flex; justify-content: center; align-items: center; border-radius: 100px; border: solid 2px #8796a2; color: #8796a2; font-weight: bold; background: #fff; white-space: pre; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab > li.-soon:after { transform: scale(0.6); } }
.summer-cp2023 .theme__tab > li .new { position: absolute; top: -3.4em; right: 0.5em; font-size: 11px; width: 6em; height: 4em; display: flex; justify-content: center; align-items: center; border-radius: 100px; border: solid 4px #e60212; color: #e60212; font-weight: bold; background: #fff; white-space: pre; filter: drop-shadow(0 2px 0 #000); transform: scale(1.6); z-index: 1; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab > li .new { transform: scale(1.2); top: -3.2em; right: 0em; } }
.summer-cp2023 .theme__tab > li .new:before { content: ""; display: block; width: 0; height: 0; border: solid 4px transparent; border-top: solid 10px #e60212; transform: rotate(45deg); position: absolute; bottom: -7px; left: -7px; }
.summer-cp2023 .theme__tab > li a { display: block; width: 100%; padding: 10px; font-size: 2.6rem; font-weight: bold; min-height: 98px; display: flex; justify-content: center; align-items: center; color: #fff; }
@media (max-width: 768px) { .summer-cp2023 .theme__tab > li a { font-size: 1.8rem; } }
.summer-cp2023 .theme__tab > li small { display: block; font-weight: normal; font-size: 1.6rem; padding-bottom: 5px; }
.summer-cp2023 .theme__tab > li:first-child { margin-left: 0; }
.summer-cp2023 .theme__wrap { background: #ddd; border-radius: 20px; padding: 40px; margin-bottom: 60px; }
@media (max-width: 768px) { .summer-cp2023 .theme__wrap { border-radius: 10px; padding: 5%; } }
.summer-cp2023 .theme__wrap__inner { padding: 20px; border-radius: 10px 10px 0 0; background: #fff; }
@media (max-width: 768px) { .summer-cp2023 .theme__wrap__inner { padding: 5% 3%; } }
.summer-cp2023 .theme__wrap__inner.-quiz { background: #feff86; border-radius: 0 0 10px 10px; }
.summer-cp2023 .theme__wrap__inner.-video { padding-top: 80px; padding-bottom: 60px; }
.summer-cp2023 .space { background: #0079d9; }
.summer-cp2023 .space__h2 { font-size: 4.0rem; position: relative; font-weight: bold; color: #0079d9; border-bottom: dashed 3px #0079d9; margin-bottom: 20px; line-height: 1.4; padding-bottom: 10px; padding-left: 60px; position: relative; }
.summer-cp2023 .space__h2 .num { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
@media (max-width: 768px) { .summer-cp2023 .space__h2 { font-size: 2.2rem; font-feature-settings: "palt"; } }
.summer-cp2023 .space__block { padding-left: 40px; padding-right: 40px; }
@media (max-width: 768px) { .summer-cp2023 .space__block { padding: 0; } }
.summer-cp2023 .space__h3 { display: inline-block; position: relative; font-size: 3.2rem; padding: 10px 40px 0; font-weight: bold; margin: 1.5em 0; line-height: 2.0; }
@media (max-width: 768px) { .summer-cp2023 .space__h3 { font-size: 2.0rem; } }
.summer-cp2023 .space__h3 span { position: relative; color: #0079d9; }
.summer-cp2023 .space__h3:before { content: ""; display: block; width: 100%; height: 100%; background: #fcf40060; position: absolute; top: 10px; left: 0; z-index: 0; border-radius: 100px; }
.summer-cp2023 .space__h3:after { content: ""; display: block; width: 100%; height: 100%; border: solid 3px #0079d9; position: absolute; top: 0; left: 0; z-index: 1; border-radius: 100px; }
.summer-cp2023 .space__block2 { background: #081541; color: #fff; }
.summer-cp2023 .space__block2 .space__h2 { color: #fff; border-color: #fff; }
.summer-cp2023 .space__block2__inner { padding: 20px; }
.summer-cp2023 .space__block2__wrap { border-radius: 20px; background: #fff; }
.summer-cp2023 .space__block2__wrap .txt { width: calc(100% - 300px); }
@media (max-width: 768px) { .summer-cp2023 .space__block2__wrap .txt { width: 100%; } }
.summer-cp2023 .space__block2__wrap .img { width: 300px; text-align: center; }
@media (max-width: 768px) { .summer-cp2023 .space__block2__wrap .img { width: 100%; margin-top: 5%; } }
.summer-cp2023 .space__block2__wrap.-main { background: transparent; }
.summer-cp2023 .space__block2__wrap.-main .txt { width: calc(100% - 290px); color: #fff; }
@media (max-width: 768px) { .summer-cp2023 .space__block2__wrap.-main .txt { width: 100%; } }
.summer-cp2023 .space__block2__wrap.-main .img { width: 250px; margin-left: 40px; }
@media (max-width: 768px) { .summer-cp2023 .space__block2__wrap.-main .img { width: 100%; margin-left: 0; } }
.summer-cp2023 .space__block2__column { display: flex; align-items: center; color: #000; padding: 40px; border-radius: 20px; }
.summer-cp2023 .space__block2__column.-reverse { flex-direction: row-reverse; }
@media (max-width: 768px) { .summer-cp2023 .space__block2__column.-reverse { flex-direction: row; } }
@media (max-width: 768px) { .summer-cp2023 .space__block2__column { padding: 5%; display: block; } }
.summer-cp2023 .space__block2__h3 { background: #0079d9; color: #fff; border-radius: 20px 20px 0 0; padding: 20px 40px 20px 100px; font-size: 2.4rem; font-weight: bold; position: relative; }
.summer-cp2023 .space__block2__h3:before { content: url(/activity/summer-2023/images/space_icon_figure.png); position: absolute; left: 40px; }
@media (max-width: 768px) { .summer-cp2023 .space__block2__h3 { font-size: 1.8rem; padding: 3% 3% 3% 50px; }
  .summer-cp2023 .space__block2__h3:before { transform: scale(0.5); transform-origin: -100%; } }
.summer-cp2023 .space__block2 .c-notice a { color: #fff; }
.summer-cp2023 .space__column { border: solid 2px #0079d9; border-radius: 20px; background: #fff; position: relative; }
.summer-cp2023 .space__column__head { text-align: center; padding: 40px 40px 0; color: #0079d9; font-size: 2.8rem; font-weight: bold; }
@media (max-width: 768px) { .summer-cp2023 .space__column__head { font-size: 1.8rem; padding: 8% 3% 5%; } }
.summer-cp2023 .space__column__head .sld { font-weight: normal; display: inline-block; position: absolute; top: -0.8em; left: 50%; transform: translateX(-50%); padding: 0 20px; font-size: 2.2rem; line-height: 1.2; font-weight: bold; background: #fff; white-space: nowrap; }
@media (max-width: 768px) { .summer-cp2023 .space__column__head .sld { font-size: 1.8rem; } }
.summer-cp2023 .space__column__body { padding: 40px; }
@media (max-width: 768px) { .summer-cp2023 .space__column__body { padding: 5% 3%; } }
.summer-cp2023 .space__column__body .dl { border-top: dashed 3px #0079d9; padding-top: 40px; }
.summer-cp2023 .space__column__body .other { border-radius: 20px; background: #e5f4ff; padding: 40px 20px 20px; }
.summer-cp2023 .space__column__body .other__head { font-size: 2.8rem; font-weight: bold; color: #fff; background: #0079d9; border-radius: 100px; padding: 5px 40px 0px; position: relative; text-align: center; margin: -60px 0 20px; }
.summer-cp2023 .space__column__body .other__head:before { content: url(/activity/summer-2023/images/space_icon_idea.png); position: absolute; left: 20px; top: -7px; }
@media (max-width: 768px) { .summer-cp2023 .space__column__body .other__head:before { left: -18px; } }
@media (max-width: 768px) { .summer-cp2023 .space__column__body .other__head { font-size: 1.4rem; } }
.summer-cp2023 .space__column__body .other__list > li { background: #fff; padding: 40px 20px 40px 140px; border-radius: 10px; margin-top: 20px; position: relative; color: #0079d9; font-weight: bold; }
.summer-cp2023 .space__column__body .other__list > li:first-child { margin-top: 0; }
.summer-cp2023 .space__column__body .other__list > li .img { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); }
.summer-cp2023 .space__column__subhead { font-weight: bold; font-size: 2.2rem; }
.summer-cp2023 .factory { background: #ff4e84; }
.summer-cp2023 .factory__h1 { text-align: center; position: relative; margin-bottom: 40px; }
@media (max-width: 768px) { .summer-cp2023 .factory__h1 { transform: scale(0.8); margin-bottom: 10px; } }
.summer-cp2023 .factory__quizbtn { position: absolute; top: -5%; left: 50%; transform: translate(67%, -28%); filter: drop-shadow(0 5px 0 #ddd); transition: .4s; }
.summer-cp2023 .factory__quizbtn:hover { transform: translate(67%, -31%); opacity: 0.8; }
@media (max-width: 768px) { .summer-cp2023 .factory__quizbtn { transform: translate(44%, -39%) scale(0.8); }
  .summer-cp2023 .factory__quizbtn:hover { opacity: 1; transform: translate(44%, -39%) scale(0.8); } }
.summer-cp2023 .factory__videobtn { position: absolute; left: 50%; margin-left: -380px; top: -5px; transition: .4s; }
.summer-cp2023 .factory__videobtn:hover { top: -10px; opacity: 0.8; }
@media (max-width: 768px) { .summer-cp2023 .factory__videobtn { transform: scale(0.7); margin-left: -280px; top: -23%; } }
@media (max-width: 375px) { .summer-cp2023 .factory__videobtn { margin-left: -270px; top: -28%; } }
.summer-cp2023 .factory .kamishibai { background: url(../images/bg_kamishibai.jpg); background-size: cover; padding-bottom: 40px; }
.summer-cp2023 .factory .kamishibai .c-roundButton { font-size: 2.2rem; }
.summer-cp2023 .factory .kamishibai__disabled { margin-bottom: 40px; }
.summer-cp2023 .factory .kamishibai__disabled:before { content: "終了しました"; font-size: 1.8rem; text-shadow: 0 2px 0 #000; font-weight: bold; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; background: rgba(89, 89, 89, 0.8); position: absolute; left: 0; top: 0; z-index: 1; }
.summer-cp2023 .factory .kamishibai__head { border-radius: 100px; border: solid 4px #2dbbed; color: #2dbbed; background: #fff; display: inline-block; padding: 0.1em 2em; font-size: 2.8rem; margin-top: -0.7em; font-weight: bold; margin-bottom: 20px; box-shadow: 0 5px 0 rgba(0, 0, 0, 0.2); line-height: 1.6; white-space: nowrap; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__head { font-size: 2.0rem; margin-top: -1.2em; } }
.summer-cp2023 .factory .kamishibai__slide { position: relative; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide { padding-top: 4%; } }
.summer-cp2023 .factory .kamishibai__slide .chara { position: absolute; bottom: 0; opacity: 0; transform: translateY(-10px); transition: .4s; width: 12.6%; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide .chara { width: 14%; bottom: auto; top: 0; } }
.summer-cp2023 .factory .kamishibai__slide .chara.left { left: 0; transition-delay: 0.5s; }
.summer-cp2023 .factory .kamishibai__slide .chara.right { right: 0; transition-delay: 1.0s; }
.summer-cp2023 .factory .kamishibai__slide .anime { position: absolute; opacity: 0; }
.summer-cp2023 .factory .kamishibai__slide .anime.logo { top: 5%; left: 50%; transform: translate(-50%, 40px); width: 47.95%; transition: .4s; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide .anime.logo { width: 87%; top: 0; } }
.summer-cp2023 .factory .kamishibai__slide .anime.logo.act { opacity: 1; transform: translate(-50%, 0); }
.summer-cp2023 .factory .kamishibai__slide .anime.curry { top: 2%; left: 2%; width: 22.88%; z-index: 1; transform: translateY(40px); transition: .4s; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide .anime.curry { top: 14%; left: 17%; width: 33.88%; } }
.summer-cp2023 .factory .kamishibai__slide .anime.curry.act { opacity: 1; transform: translateY(0); }
.summer-cp2023 .factory .kamishibai__slide .anime.ringo { top: 0; right: 2%; width: 18.2%; z-index: 1; transition: .4s; transform: translateY(40px); }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide .anime.ringo { top: 13%; right: 22%; width: 26.2%; } }
.summer-cp2023 .factory .kamishibai__slide .anime.ringo.act { opacity: 1; transform: translateY(0); }
.summer-cp2023 .factory .kamishibai__slide .anime.txt { top: 38%; left: 50%; transform: translate(-50%, 40px); width: 86.2%; transition: .4s; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__slide .anime.txt { top: 28%; } }
.summer-cp2023 .factory .kamishibai__slide .anime.txt.act { opacity: 1; transform: translate(-50%, 0); }
.summer-cp2023 .factory .kamishibai .start .chara { opacity: 1; transform: translateY(0); }
.summer-cp2023 .factory .kamishibai__ui { position: absolute; bottom: 40px; left: 0; width: 100%; text-align: center; opacity: 0; transform: translateY(40px); transition: .4s; }
.summer-cp2023 .factory .kamishibai__ui.act { opacity: 1; transform: translateY(0); }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__ui { bottom: 10px; }
  .summer-cp2023 .factory .kamishibai__ui > li { width: 28%; }
  .summer-cp2023 .factory .kamishibai__ui > li.start { width: 64%; display: none !important; }
  .summer-cp2023 .factory .kamishibai__ui > li.middle { display: none !important; } }
.summer-cp2023 .factory .kamishibai__uisp { display: none; }
@media (max-width: 768px) { .summer-cp2023 .factory .kamishibai__uisp { display: flex; width: 100%; justify-content: space-between; position: absolute; top: 50%; transform: translateY(-50%); } }
.summer-cp2023 .factory .video { border: solid 4px #ff4e84; border-radius: 20px; padding: 40px; background: #fff; position: relative; }
.summer-cp2023 .factory .video .new { position: absolute; top: -1.4em; right: -3.5em; font-size: 11px; width: 6em; height: 4em; display: flex; justify-content: center; align-items: center; border-radius: 100px; border: solid 4px #e60212; color: #e60212; font-weight: bold; background: #fff; white-space: pre; filter: drop-shadow(0 2px 0 #000); transform: scale(1.6); z-index: 2; line-height: 1; }
@media (max-width: 768px) { .summer-cp2023 .factory .video .new { transform: scale(1.2); top: -2.4em; right: -3em; } }
.summer-cp2023 .factory .video .new:before { content: ""; display: block; width: 0; height: 0; border: solid 4px transparent; border-top: solid 10px #e60212; transform: rotate(45deg); position: absolute; bottom: -7px; left: -7px; }
@media (max-width: 768px) { .summer-cp2023 .factory .video { padding: 3%; } }
.summer-cp2023 .factory .video__disabled { margin-bottom: 40px; }
.summer-cp2023 .factory .video__disabled:before { content: "終了しました"; font-size: 1.8rem; text-shadow: 0 2px 0 #000; font-weight: bold; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; background: rgba(89, 89, 89, 0.8); position: absolute; left: 0; top: 0; }
.summer-cp2023 .factory .video__head { border-radius: 100px; border: solid 4px #ff4e84; color: #ff4e84; background: #fff; display: inline-block; padding: 0.6em 2em 0.3em; font-size: 2.8rem; margin-top: -0.2em; font-weight: bold; margin-bottom: 20px; box-shadow: 0 5px 0 rgba(0, 0, 0, 0.2); position: absolute; top: -2em; left: 50%; line-height: 1.6; white-space: nowrap; transform: translateX(-50%); z-index: 1; }
.summer-cp2023 .factory .video__head span { position: absolute; top: -1em; left: 50%; background: #fff; transform: translateX(-50%); font-size: 2.2rem; display: inline-block; padding: 0 10px; }
@media (max-width: 768px) { .summer-cp2023 .factory .video__head { font-size: 2.0rem; top: -2.5em; } }
@media (max-width: 400px) { .summer-cp2023 .factory .video__head { font-size: 2.0rem; top: -3em; } }
@media (max-width: 370px) { .summer-cp2023 .factory .video__head { font-size: 4vw; }
  .summer-cp2023 .factory .video__head span { font-size: 4vw; } }
.summer-cp2023 .factory .video__player { border-radius: 10px; overflow: hidden; border: solid 4px #ff4e84; position: relative; padding-top: 56%; }
.summer-cp2023 .factory .video__player .factoryVideo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.summer-cp2023 .foodloss { background: #00ce40; }
.summer-cp2023 .foodloss__h1 { text-align: center; position: relative; margin-bottom: 40px; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__h1 { transform: scale(0.8); margin-bottom: 10px; } }
.summer-cp2023 .foodloss__quizbtn { position: absolute; top: -5%; left: 50%; transform: translate(67%, -28%); filter: drop-shadow(0 5px 0 #ddd); transition: .4s; }
.summer-cp2023 .foodloss__quizbtn:hover { transform: translate(67%, -31%); opacity: 0.8; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__quizbtn { transform: translate(44%, -39%) scale(0.8); }
  .summer-cp2023 .foodloss__quizbtn:hover { transform: translate(44%, -39%) scale(0.8); opacity: 1; } }
.summer-cp2023 .foodloss__h2 { font-size: 4.0rem; position: relative; font-weight: bold; color: #00ce40; border-bottom: dashed 3px #00ce40; margin-bottom: 20px; line-height: 1.4; padding-bottom: 10px; padding-left: 60px; position: relative; }
.summer-cp2023 .foodloss__h2 .num { position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
@media (max-width: 768px) { .summer-cp2023 .foodloss__h2 { font-size: 2.2rem; font-feature-settings: "palt"; } }
.summer-cp2023 .foodloss__block { padding-left: 40px; padding-right: 40px; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__block { padding: 0; } }
.summer-cp2023 .foodloss__note { background: url(../images/foodloss_fig01_tp.png) no-repeat #f2f2f2 center top; border-radius: 20px; padding: 60px 30px 30px; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__note { padding: 15% 5% 10%; } }
.summer-cp2023 .foodloss__column { border: solid 2px #00ce40; border-radius: 20px; background: #fff; position: relative; }
.summer-cp2023 .foodloss__column__head { text-align: center; padding: 40px; color: #00ce40; font-size: 2.8rem; border-bottom: dashed 3px #00ce40; font-weight: bold; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__column__head { font-size: 1.8rem; padding: 8% 3% 5%; } }
.summer-cp2023 .foodloss__column__head .sld { font-weight: normal; display: inline-block; position: absolute; top: -0.8em; left: 50%; transform: translateX(-50%); padding: 0 20px; font-size: 2.2rem; line-height: 1.2; font-weight: bold; background: #fff; white-space: nowrap; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__column__head .sld { font-size: 1.8rem; } }
.summer-cp2023 .foodloss__column__body { padding: 40px; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__column__body { padding: 5% 3%; } }
.summer-cp2023 .foodloss__column__li { padding: 30px 0 30px 130px; border-bottom: solid 1px #e5e2d6; position: relative; font-size: 1.6rem; margin-bottom: 20px; }
.summer-cp2023 .foodloss__column__li .fig { position: absolute; top: 40px; left: 0; }
@media (max-width: 768px) { .summer-cp2023 .foodloss__column__li { padding-left: 0; }
  .summer-cp2023 .foodloss__column__li .fig { position: static; width: 30vw; margin: 10px auto 0; } }
.summer-cp2023 .foodloss__column__subhead { font-weight: bold; font-size: 2.2rem; }
.summer-cp2023 .notice { color: #ff0000; border: dotted 2px #ff0000; padding: 20px; line-height: 1.4; margin: 20px 0; font-size: 1.8rem; }
.summer-cp2023 .notice__head { font-weight: bold; margin-bottom: 10px; }
.summer-cp2023 .btn { display: inline-flex; align-items: center; justify-content: flex-start; border-radius: 100px; padding: 16px; background-color: #e60012; color: #fff; line-height: 1.4; font-weight: bold; margin: 0.5em; }
@media (max-width: 768px) { .summer-cp2023 .btn { line-height: 1.0; } }
.summer-cp2023 .btn small { font-weight: normal; }
.summer-cp2023 .btn img { width: 58px; height: 58px; margin-right: 1em; }
@media (max-width: 768px) { .summer-cp2023 .btn img { width: 40px; height: 40px; margin-right: 0.5em; } }
.summer-cp2023 .btn.-ppt { background-color: #ff8106; }
.summer-cp2023 .btn.-disabled { position: relative; overflow: hidden; pointer-events: none; }
.summer-cp2023 .btn.-disabled:before { content: "終了しました"; font-size: 18px; font-size: 1.8rem; text-shadow: 0 2px 0 #000; font-weight: bold; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; background: rgba(89, 89, 89, 0.8); position: absolute; left: 0; top: 0; }
.summer-cp2023 .print { border: solid 2px #dfdfdf; border-radius: 20px; padding: 30px 20px 20px; position: relative; font-size: 1.8rem; }
.summer-cp2023 .print__head { position: absolute; top: -0.5em; left: 50%; transform: translateX(-50%); display: inline-block; background: #fff; padding: 0 40px; line-height: 1; white-space: nowrap; }
@media (max-width: 768px) { .summer-cp2023 .print__head { font-size: 1.4rem; padding: 0 10px; } }
.summer-cp2023 .recipe { padding-left: 40px; padding-right: 40px; margin-bottom: 80px; }
@media (max-width: 768px) { .summer-cp2023 .recipe { padding-left: 3%; padding-right: 3%; margin-bottom: 16%; } }
.summer-cp2023 .recipe__head { font-size: 3.6rem; font-weight: bold; margin-top: -80px; margin-bottom: 40px; }
.summer-cp2023 .recipe__head img { vertical-align: bottom; margin-right: 0.5em; }
@media (max-width: 768px) { .summer-cp2023 .recipe__head { padding-left: 12vw; line-height: 1.2; position: relative; margin-top: 0; font-size: 2.6rem; }
  .summer-cp2023 .recipe__head img { width: 20vw; position: absolute; left: -40px; top: -20px; } }
.summer-cp2023 .recipe__main { display: table; }
.summer-cp2023 .recipe__main > li { display: table-cell; width: 50%; vertical-align: top; }
@media (max-width: 768px) { .summer-cp2023 .recipe__main > li { display: block; width: 100%; } }
.summer-cp2023 .recipe__main > li.ingredients { padding-left: 40px; }
@media (max-width: 768px) { .summer-cp2023 .recipe__main > li.ingredients { padding-left: 0; margin-top: 10%; } }
.summer-cp2023 .recipe__h4 { background: #00ce40; color: #fff; display: inline-block; border-radius: 100px; padding: 8px 40px; line-height: 1.4; margin-bottom: 20px; }
.summer-cp2023 .recipe__ingredients { font-size: 1.6rem; width: 100%; }
.summer-cp2023 .recipe__ingredients th, .summer-cp2023 .recipe__ingredients td { border-bottom: solid 1px #e5e2d6; line-height: 2.0; }
.summer-cp2023 .recipe__ingredients td { text-align: right; }
.summer-cp2023 .recipe__ingredients tr:last-child th, .summer-cp2023 .recipe__ingredients tr:last-child td { border-bottom: none; }
.summer-cp2023 .recipe__point { border-top: solid 2px #00ce40; border-bottom: solid 2px #00ce40; position: relative; padding: 20px 0 20px 170px; }
@media (max-width: 768px) { .summer-cp2023 .recipe__point { padding-left: 0; } }
.summer-cp2023 .recipe__point__icon { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); }
@media (max-width: 768px) { .summer-cp2023 .recipe__point__icon { position: static; width: 16vw; margin: 0 auto 10px; transform: none; } }
.summer-cp2023 .recipe__flow > li { display: flex; justify-content: space-between; border-bottom: solid 2px #e5e2d6; padding: 30px 0; }
.summer-cp2023 .recipe__flow > li:last-child { border-bottom: none; }
@media (max-width: 768px) { .summer-cp2023 .recipe__flow > li { display: block; } }
.summer-cp2023 .recipe__flow > li .txt { width: calc(100% - 360px); position: relative; padding-left: 60px; }
@media (max-width: 768px) { .summer-cp2023 .recipe__flow > li .txt { width: 100%; margin-bottom: 5%; } }
.summer-cp2023 .recipe__flow > li .txt .num { position: absolute; left: 0; top: 0; }
.summer-cp2023 .recipe__flow > li .point { border: solid 2px #00ce40; padding: 10px; border-radius: 10px; font-size: 1.6rem; font-weight: bold; background: #fff; margin-top: 10px; padding-left: 90px; position: relative; margin-bottom: 20px; }
.summer-cp2023 .recipe__flow > li .point:before { content: url(../images/ico_point.png); position: absolute; left: 20px; top: 50%; transform: translateY(-50%); }
.summer-cp2023 .recipe__flow > li .point:after { content: ""; display: block; width: 0; height: 0; border: solid 10px transparent; border-left: solid 10px #00ce40; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); }
@media (max-width: 768px) { .summer-cp2023 .recipe__flow > li .point:after { right: 50%; top: auto; bottom: -30px; border-left: solid 10px transparent; border-top: solid 10px #00ce40; } }
.summer-cp2023 .recipe__flow > li .ph { width: 360px; text-align: right; }
@media (max-width: 768px) { .summer-cp2023 .recipe__flow > li .ph { width: 100%; text-align: center; } }
.summer-cp2023 .recipe__point2 { border: solid 2px #ff657b; border-radius: 20px; background: #fff; padding: 40px; }
@media (max-width: 768px) { .summer-cp2023 .recipe__point2 { padding: 3%; } }
.summer-cp2023 .recipe__point2__head { text-align: center; margin-top: -80px; }
@media (max-width: 768px) { .summer-cp2023 .recipe__point2__head { width: 50vw; margin: -5vw auto 0; } }
.summer-cp2023 .recipe__point2__subhead { color: #ff657b; font-size: 3.0rem; font-weight: bold; padding-left: 1em; text-indent: -1em; }
@media (max-width: 768px) { .summer-cp2023 .recipe__point2__subhead { font-size: 1.8rem; line-height: 1.4; margin-bottom: 0.5em; } }
.summer-cp2023 .recipe__point2__ul > li { border-top: solid 1px #e5e2d6; padding: 30px 0; }
.summer-cp2023 .recipe__point2__ul > li:first-child { border-top: none; }
.summer-cp2023 .recipe__profile { display: flex; justify-content: center; }
@media (max-width: 768px) { .summer-cp2023 .recipe__profile { display: block; } }
.summer-cp2023 .quiz__head { text-align: center; margin-top: -40px; }
.summer-cp2023 .quiz__head .title { margin-top: -80px; }
.summer-cp2023 .quiz__time { display: inline-block; padding: 20px 0; border-top: solid 1px #000; border-bottom: solid 1px #000; font-size: 2.0rem; font-weight: bold; margin-bottom: 40px; font-feature-settings: "palt"; }
@media (max-width: 768px) { .summer-cp2023 .quiz__time { font-size: 1.6rem; } }
.summer-cp2023 .quiz__inner { max-width: 880px; margin: 0 auto; padding: 10px; }
.summer-cp2023 .quiz__box { background: #fff; border-radius: 20px; padding: 40px; text-align: left; position: relative; }
@media (max-width: 768px) { .summer-cp2023 .quiz__box { padding-left: 5%; padding-right: 5%; } }
.summer-cp2023 .quiz__box:before { content: "クイズ"; display: inline-block; background: #e60012; color: #fff; border-radius: 100px; padding: 8px 40px; line-height: 1.4; position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); }
.summer-cp2023 .quiz__box__q { position: relative; padding-bottom: 30px; font-weight: bold; font-size: 3.0rem; line-height: 1.6; border-bottom: dashed 3px #00ce40; }
@media (max-width: 768px) { .summer-cp2023 .quiz__box__q { font-size: 2.0rem; } }
.summer-cp2023 .quiz__box__q .icon { position: absolute; left: 0; top: 0; }
@media (max-width: 768px) { .summer-cp2023 .quiz__box__q .icon { display: none; } }
.summer-cp2023 .quiz__box__a { padding-top: 20px; font-size: 3.0rem; font-weight: bold; }
.summer-cp2023 .quiz__box__list { text-align: center; }
@media (max-width: 768px) { .summer-cp2023 .quiz__box__list { text-align: left; } }
.summer-cp2023 .quiz__box__list > li { display: inline-block; width: calc(100% / 3); }
@media (max-width: 768px) { .summer-cp2023 .quiz__box__list > li { display: block; width: 100%; } }
.summer-cp2023 .quiz__box__list.-vertical > li { display: block; width: 100%; text-align: left; text-indent: -65px; padding-left: 65px; line-height: 1.0; margin-top: 20px; }
.summer-cp2023 .quiz__box__list.-vertical > li:first-child { margin-top: 0; }
.summer-cp2023 .quiz__box__list.-spice { font-feature-settings: "palt"; }
.summer-cp2023 .quiz__box__hint { position: absolute; bottom: -30px; right: -30px; }
.summer-cp2023 .present__head { font-size: 3.4rem; font-weight: bold; line-height: 1.6; margin-bottom: 40px; }
@media (max-width: 768px) { .summer-cp2023 .present__head { font-size: 2.4rem; } }
.summer-cp2023 .present__head.-foodloss .c-maker { background: linear-gradient(transparent 70%, rgba(188, 255, 0, 0.7) 0); }
.summer-cp2023 .present__title { display: flex; align-items: center; }
.summer-cp2023 .present__title .text { padding-right: 1em; width: calc(100% - 140px); }
.summer-cp2023 .present__title .amount { width: 140px; }
@media (max-width: 768px) { .summer-cp2023 .present__title { display: block; }
  .summer-cp2023 .present__title .text, .summer-cp2023 .present__title .amount { width: 100%; padding: 0; margin: 0 0 5%; } }
.summer-cp2023 .present__item { position: relative; margin-bottom: 60px; }
.summer-cp2023 .present__item .prize { position: absolute; bottom: -20px; right: 0; }
.summer-cp2023 .present__item.-sp { margin-bottom: 0; }
.summer-cp2023 .present__item.-sp .prize { width: 25vw; }
.summer-cp2023 .present .c-roundButton { max-width: none; width: auto; font-size: 3.6rem; border-radius: 200px; padding: 1em 3em; }
@media (max-width: 768px) { .summer-cp2023 .present .c-roundButton { font-size: 2.0rem; padding: 1em 0; width: 100%; } }
.summer-cp2023 .present__box { padding: 20px; background: #fff; border-radius: 20px; margin-bottom: 40px; position: relative; }
@media (max-width: 768px) { .summer-cp2023 .present__box { padding-top: 40px; } }
.summer-cp2023 .present__box .amount { position: absolute; top: 0; right: 0; transform: translate(25%, -25%) scale(0.8); z-index: 1; }
@media (max-width: 768px) { .summer-cp2023 .present__box .amount { transform: scale(0.55) translate(30%, -30%); transform-origin: right top; } }
.summer-cp2023 .present__box .label { position: absolute; left: 0; top: 0; }
@media (max-width: 768px) { .summer-cp2023 .present__box .label { transform: scale(0.55); transform-origin: left top; } }
.summer-cp2023 .sheet { border: solid 3px #c1a14e; background: #fff5db; border-radius: 20px; padding: 90px 40px 40px; }
@media (max-width: 768px) { .summer-cp2023 .sheet { padding: 10% 2.5% 2.5%; } }
.summer-cp2023 .sheet__inner { background: #fff; border-radius: 10px; padding: 40px; text-align: center; }
@media (max-width: 768px) { .summer-cp2023 .sheet__inner { padding: 3%; } }
.summer-cp2023 .sheet__head { margin-top: -95px; }
@media (max-width: 768px) { .summer-cp2023 .sheet__head { margin-top: -8%; } }
.summer-cp2023 .sheet__lede { margin-bottom: 40px; }
.summer-cp2023 .sheet__notice { line-height: 1.6; }
.summer-cp2023 .fun { background: url(/activity/summer-2023/images/fun_tp.png) #fff391 repeat-x center top; padding: 60px 0; }
.summer-cp2023 .fun__head { text-align: center; margin-bottom: 80px; }
.summer-cp2023 .fun__wrap { text-align: center; background: #fff; border-radius: 20px; border: solid 4px #ff4e00; position: relative; }
.summer-cp2023 .fun__wrap .theme__wrap__inner { border-radius: 0 0 20px 20px; }
.summer-cp2023 .fun__wrap + .fun__wrap { margin-top: 80px; }
.summer-cp2023 .fun__wrap .new { position: absolute; top: -3.4em; right: -5.5em; font-size: 11px; width: 6em; height: 4em; display: flex; justify-content: center; align-items: center; border-radius: 100px; border: solid 4px #e60212; color: #e60212; font-weight: bold; background: #fff; white-space: pre; filter: drop-shadow(0 2px 0 #000); transform: scale(1.6); z-index: 2; line-height: 1; }
@media (max-width: 768px) { .summer-cp2023 .fun__wrap .new { transform: scale(1.2); top: -3.4em; right: -4.5em; } }
.summer-cp2023 .fun__wrap .new:before { content: ""; display: block; width: 0; height: 0; border: solid 4px transparent; border-top: solid 10px #e60212; transform: rotate(45deg); position: absolute; bottom: -7px; left: -7px; }
.summer-cp2023 .fun__inner { padding: 0 40px 40px; }
.summer-cp2023 .fun__h3 { background: #959595; color: #fff; border-radius: 100px; padding: 0.1em 2em; display: inline-block; font-weight: bold; min-width: 230px; transform: translateY(-50%); }
.summer-cp2023 .fun__h3.-act { background: #ff4e00; }
@media (max-width: 768px) { .summer-cp2023 .fun__h3.-crossword { transform: translateY(-2em); } }
@media (max-width: 768px) { .summer-cp2023 .crossword { padding: 3%; } }
.summer-cp2023 .crossword__disabled:before { content: "終了しました"; font-size: 1.8rem; text-shadow: 0 2px 0 #000; font-weight: bold; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; color: #fff; background: rgba(89, 89, 89, 0.8); position: absolute; left: 0; top: 0; }
.summer-cp2023 .crossword__hint { border-radius: 10px; padding: 20px; background: #f1f1f1; }
.summer-cp2023 .crossword__hint__head { font-size: 2.4rem; font-weight: bold; }
@media (max-width: 768px) { .summer-cp2023 .crossword__hint__head { line-height: 1.4; } }
.summer-cp2023 .crossword__hint__subhead { border: solid 4px #ff4e00; border-radius: 100px; padding: 0.2em; color: #fff; }
.summer-cp2023 .crossword__hint__subhead.-v { border-color: #00459b; background-color: #00459b; }
.summer-cp2023 .crossword__hint__subhead.-h { border-color: #07923a; background-color: #07923a; }
.summer-cp2023 .crossword__hint__list { font-size: 80%; line-height: 1.8; padding: 20px; }
.summer-cp2023 .crossword__hint__list > li { margin-top: 5px; }
.summer-cp2023 .crossword__hint__list > li:first-child { margin-top: 0; }
@media (max-width: 768px) { .summer-cp2023 .crossword__hint__list { padding: 5% 0; } }
.summer-cp2023 .h2 { text-align: center; margin-bottom: 40px; font-weight: bold; font-size: 44px; line-height: 1.2; }
@media (max-width: 768px) { .summer-cp2023 .h2 { font-size: 28px; } }
.summer-cp2023 .inlineframe { height: 300px; overflow-y: auto; border: solid 1px #888; background: #fff; padding: 20px; }
.summer-cp2023 .mb-80 { margin-bottom: 80px; }
@media (max-width: 768px) { .summer-cp2023 .mb-80 { margin-bottom: 80px; } }
.summer-cp2023 .-disabled:before { z-index: 1; }
.summer-cp2023 .-disabled.-finish:before { content: "終了しました" !important; }