@charset "utf-8";
/* ------------------------------------

  Base

------------------------------------ */
* { box-sizing: border-box; }
body {
  background-color: rgb(0 25 125);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-style: normal;
  }
h1,h2,h3,h4,h5,h6,h6,
dl,dt,dd,
ul,li,
p {
  font-weight: 500;
  margin: 0;
  padding: 0;
  }
a { text-decoration: none; }
img { max-width: 100%; }
figure { margin: 0; }
/* --------------- */
@media (min-width: 751px) {}
/* --------------- */
@media (max-width: 750px) {}
/* ------------------------------------

  Media Switching

------------------------------------ */
@media (min-width: 751px) { .sp { display: none; } }
/* --------------- */
@media (max-width: 750px) { .pc { display: none; } }
/* ------------------------------------

  Animation

------------------------------------ */
@keyframes bordercolor-anm {
  0% { border-image: linear-gradient(to right, #ba9704, #00FFFF) 1; }
  50% { border-image: linear-gradient(to left, #ba9704, #00FFFF) 1; }
  100% { border-image: linear-gradient(to right, #ba9704, #00FFFF) 1; }
  }
/* ------------------------------------

  Fonts

------------------------------------ */
.f-jost { font-family: "Jost", sans-serif; }
.f-notosans { font-family: "Noto Sans JP", sans-serif; }
.f-notoserif { font-family: "Noto Serif JP", serif; }
/* ------------------------------------

  Fade-In

------------------------------------ */
.fadein {
  opacity: 0;
  position: relative;
  transform: translate(0, 100px);
  transition: all 1s;
  }
.fadein.fdi-on {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  }
/* ------------------------------------

  container

------------------------------------ */
.container {
  overflow: hidden;
  position: relative;
  z-index: 1;
  }
/* ------------------------------------

  intro

------------------------------------ */
.intro {
  padding-top: 10vh;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  }
.int-ttl {
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 1;
  }
.int-ttl img { width: min(60vw, 350px); }
.int-fig {
  height: 100%;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
  box-sizing: border-box;
  }
.int-fig .item {
  position: absolute;
  text-align: center;
  }
.int-fig .item.light { mix-blend-mode: hard-light; }
.int-fig .item.i01 {
  z-index: 2;
  animation: 4s linear infinite glf-illustarea1;
  }
.int-fig .item.i02 {
  z-index: 1;
  animation: 7s linear infinite glf-illustarea2;
  }
.int-fig .item.i03 {
  z-index: 1;
  animation: 9s linear infinite glf-illustarea1;
  }
.int-fig .item.i04 {
  z-index: 1;
  animation: 10s linear infinite glf-illustarea2;
  }
.int-fig .item.light { z-index: 0; }
@keyframes glf-illustarea1 { 0%{ transform: translateY(0px); } 50%{ transform: translateY(-10px); } 100%{ transform: translateY(0px); } }
@keyframes glf-illustarea2 { 0%{ transform: translateY(0px); } 50%{ transform: translateY(20px); } 100%{ transform: translateY(0px); } }
/* --------------- */
@media (min-width: 751px) {
.intro { padding-bottom: 500px; }
.int-fig {
  left: 50%;
  transform: translateX(-50%);
  }
.int-fig .item.i01 { left: 0; right: 0; top: 280px; }
.int-fig .item.i02 { left: 15%; top: 0; }
.int-fig .item.i03 { left: -5%; top: 0; }
.int-fig .item.i04 { right: -20%; top: 0; }
.int-fig .item.light { left: 0; right: 0; }
}
/* --------------- */
@media (max-width: 750px) {
.intro { padding-bottom: 400px; }
.int-fig {
  left: 0;
  right: 0;
  }
.int-fig .item.i01 { left: -5%; top: 50%; width: 140%; }
.int-fig .item.i02 { left: -5%; right: -5%; top: -5%; }
.int-fig .item.light { left: 0; right: 0; top: 0; }
}
/* ------------------------------------

  home-block

------------------------------------ */
.home-block { position: relative; }
  .home-block .ttlarea {
    position: relative;
    text-align: center;
    z-index: 2;
    }
  .home-block .ttlarea .ttl.main {
    font-family: "Playwrite CU", cursive;
    font-weight: 100;
    display: inline-flex;
    flex-direction: column;
    }
  .home-block .ttlarea .ttl.sub {
    position: relative;
    display: inline-flex;
    }
  .home-block .bodyarea {
    position: relative;
    z-index: 2;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block { padding-bottom: 300px; }
}
/* --------------- */
@media (max-width: 750px) {
  .home-block .ttlarea .ttl.main { padding: 0 15vw; }
}
/* ------------------------------------

  Concept

------------------------------------ */
.home-block.concept { color: rgb(255 255 255); }
.home-block.concept:before,
.home-block.concept:after {
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  }
.home-block.concept:before {
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 1;
  mix-blend-mode: screen;
  animation: 10s linear infinite glf-illustarea2;
  }
.home-block.concept:after {
  background: transparent linear-gradient(180deg, rgb(10 25 55 / 0) 0%, rgb(10 25 55) 20%) 0% 0% no-repeat padding-box;
  z-index: 0;
  }
  .ccp-txt { text-align: center; }
  .ccp-txt p {
    font-size: min(4vw, 25px);
    line-height: 2;
    }
  .ccp-info {
    border: 1px solid rgb(255 255 255);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    }
  .ccp-info-item {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    }
  .ccp-info-item:last-child { border: none; }
  .ccp-info-item .ccp-info-ttl {
    color: rgb(0 255 255);
    font-family: "Noto Serif JP", serif;
    font-size: min(8vw, 45px);
    letter-spacing: 5px;
    }
  .ccp-info-item .ccp-info-con {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    }
  .ccp-info-item .ccp-info-link { position: relative;  }
  .ccp-info-item .ccp-info-link:before {
    background-image: url(../img/home/btn-place-frame.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: '';
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    }
  .ccp-info-item .ccp-info-link a,
  .ccp-info-item .ccp-info-link a img {
    position: relative;
    z-index: 1;
    }
  .ccp-info-item .ccp-info-link a {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block.concept { padding-bottom: 500px; }
.home-block.concept:before { background-image: url(../img/home/concept-bg-pc.png); }
  .ccp-txt { margin-top: 60px; }
  .ccp-info {
    margin-top: 80px;
    max-width: 1200px;
    padding: 40px 0;
    }
  .ccp-info-item {
    border-right: 1px dashed rgb(255 255 255);
    padding: 0 40px;
    width: 50%;
    }
  .ccp-info-item .ccp-info-con {
    height: 330px;
    margin-top: 40px;
    }
  .ccp-info-item .ccp-info-con img.fig { max-width: min(40vw, 400px); }
  .ccp-info-item .ccp-info-link {
    max-width: 400px;
    margin-top: 40px;
    padding: 13px 10px 11px;
    }
  .ccp-info-item .ccp-info-link a:before {
    background: transparent linear-gradient(90deg, rgb(101 142 255) 0%, rgb(0 172 186) 100%) 0% 0% no-repeat padding-box;
    bottom: 0;
    content: '';
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
    z-index: 0;
    transition: all .3s;
    filter: blur(20px);
    }
  .ccp-info-item .ccp-info-link a:hover:before {
    width: 100%;
    filter: blur(0px);
    }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.concept { padding: 50px 25px 200px; }
.home-block.concept:before {
  background-image: url(../img/home/concept-bg-sp.png);
  background-size: 130%;
  }
  .ccp-txt { margin-top: 30px; }
  .ccp-info {
    margin-top: 60px;
    padding: 0 40px;
    flex-wrap: wrap;
    }
  .ccp-info-item {
    border-bottom: 1px dashed rgb(255 255 255);
    padding: 40px 0;
    width: 100%;
    }
  .ccp-info-item .ccp-info-con { margin-top: 40px; }
  .ccp-info-item .ccp-info-link {
    max-width: 300px;
    margin-top: 30px;
    padding: 4% 4% 2%;
    }
}
/* ------------------------------------

  Story

------------------------------------ */
.home-block.story {
  color: rgb(255 255 255);
  z-index: 1;
  }
.home-block.story:before,
.home-block.story:after {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  content: '';
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  }
.home-block.story:before {
  background-image: url(../img/home/story-star.png);
  z-index: 1;
  }
.home-block.story:after { z-index: 0; }
  .home-block.story .bodyarea {
    text-align: center;
    z-index: 3;
    }
  .story-txt p {
    font-family: "Noto Serif JP", serif;
    font-size: min(4vw, 25px);
    line-height: 2;
    }
  .story-txt p:last-child { margin-bottom: 0; }
/* --------------- */
@media (min-width: 751px) {
.home-block.story {
  margin-top: -350px;
  padding-bottom: 700px;
  padding-top: 200px;
  }
.home-block.story:after { background-image: url(../img/home/story-sky-pc.png); }
  .story-intro {
    margin-top: -100px;
    padding-left: 10vw;
    display: flex;
    align-items: center;
    justify-content: center;
    }
  .story-catch {
    margin-right: -3vw;
    max-width: min(40vw, 500px);
    }
  .story-whale {
    margin-left: -3vw;
    max-width: min(70vw, 1000px);
    }
  .story-txt p { margin-bottom: 30px; }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.story {
  margin-top: -100px;
  padding-bottom: 300px;
  padding-top: 100px;
  }
.home-block.story:after {
  background-image: url(../img/home/story-sky-sp.png);
  border-radius: 100px 100px 0 0;
  mix-blend-mode: multiply;
  }
  .story-intro {
    margin-top: 30px;
    overflow: hidden;
    }
  .story-catch {
    max-width: min(70vw, 500px);
    margin: 0 auto;
    }
  .story-whale {
    margin-left: 20vw;
    margin-top: -150px;
    width: min(120vw, 800px);
    }
  .story-txt { padding: 0 20px; }
  .story-txt p { margin-bottom: 20px; }
}
/* ------------------------------------

  Area / Campaign

------------------------------------ */
.hb-ro2.areacampaign {
  position: relative;
  z-index: 1;
  }
.hb-ro2.areacampaign:before,
.hb-ro2.areacampaign:after {
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  }
.hb-ro2.areacampaign:before {
  background-image: url(../img/home/bg-grd-purple.png);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: auto 100%;
  z-index: 1;
  }
.hb-ro2.areacampaign:after {
  background: transparent linear-gradient(180deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255) 30%, rgb(255 255 255 / 0) 100%) 0% 0% no-repeat padding-box;
  z-index: 0;
  }
/* --------------- */
@media (min-width: 751px) {
.hb-ro2.areacampaign { margin-top: -500px; }
}
/* --------------- */
@media (max-width: 750px) {
.hb-ro2.areacampaign {
  background: transparent linear-gradient(180deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255) 30%, rgb(255 255 255 / .5) 100%) 0% 0% no-repeat padding-box;
  margin-top: -200px;
  padding-bottom: 200px;
  }
}
/* ------------------------------------

  Area

------------------------------------ */
.home-block.area { text-align: center; }
  .area-map {
    margin: 0 auto;
    position: relative;
    }
  .area-map img {
    position: relative;
    z-index: 1;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block.area { padding-bottom: 150px; }
  .sa-inner {
    background-image: url(../img/home/area-map-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.area { padding-bottom: 100px; }
.home-block.area .bodyarea { margin-top: 30px; }
  .area-map:before {
    color: #fff;
    content: '☜ 横にスライドしてご覧ください ☞';
    display: block;
    margin-bottom: 20px;
    text-align: center;
    }
  .sa-wrap {
    min-width: 0;
    overflow-x: scroll;
    }
  .sa-inner {
    display: block;
    width: 100%;
    white-space: nowrap;
    }
  .area-map img { max-width: 800px; }
}
/* ------------------------------------

  Campaign

------------------------------------ */
.home-block.campaign {
  background-image: url(../img/home/bg-grd-color.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 1;
  /*
  background: transparent linear-gradient(180deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255) 30%, rgb(255 255 255 / 0) 100%) 0% 0% no-repeat padding-box;
  */
  }
.home-block.campaign:before,
.home-block.campaign:after {
  background-repeat: no-repeat;
  content: '';
  position: absolute;
  }
.home-block.campaign:before {
  background-image: url(../img/home/bg-grd-color.png);
  background-size: cover;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 0;
  }
.home-block.campaign:after {
  background-position: center top;
  mix-blend-mode: hard-light;
  z-index: 1;
  }
.home-block.campaign .bodyarea { margin: 0 auto; }
  .camp-con { margin: 0 auto; }
  .camp-fig {
    display: flex;
    align-items: center;
    justify-content: center;
    }
  .camp-info {
    margin: 0 auto;
    text-align: center;
    }
  .camp-info dl {
    color: rgb(0 25 125);
    font-size: min(4vw, 25px);
    line-height: 1.5;
    text-align: left;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    }
  .camp-info dl dt {
    background-color: rgb(255 255 255);
    text-align: center;
    }
  .camp-outline {
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    }
  .camp-outline:before {
    background-image: url(../img/home/bg-grd-color.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: '';
    position: absolute;
    }
  .camp-outline .cpotl-fig {
    background: transparent linear-gradient(128deg, rgb(0 118 192) 0%, rgb(0 30 133) 100%) 0% 0% no-repeat padding-box;
    overflow: hidden;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    animation: 20s linear infinite glf-illustarea2;
    }
  .camp-outline .cpotl-fig:before {
    background-image: url(../img/home/bg-grd-color.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: '';
    left: 0;
    opacity: .5;
    position: absolute;
    right: 0;
    top: 0;
    mix-blend-mode: hard-light;
    }
  .camp-outline .cpotl-fig img {
    position: relative;
    z-index: 1;
    animation: 7s linear infinite glf-illustarea1;
    }
  .camp-outline .cpotl-txt {
    color: rgb(255 255 255);
    font-size: min(4vw, 25px);
    line-height: 1.75;
    position: relative;
    z-index: 1;
    text-shadow: 1px 1px 15px rgb(0 25 125);
    box-sizing: border-box;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block.campaign { background-position: center bottom; }
.home-block.campaign:before { background-position: center bottom; }
.home-block.campaign:after {
  background-image: url(../img/home/campaign-fish-pc.png);
  background-size: contain;
  bottom: 10vh;
  left: 10vw;
  right: 10vw;
  top: 10vh;
  }
.home-block.campaign .bodyarea {
  margin-top: 30px;
  max-width: 1400px;
  }
  .camp-con { max-width: 1200px; }
  .camp-info { max-width: 900px; }
  .camp-info dl dt {
    min-width: 200px;
    padding: 20px;
    }
  .camp-info dl dd { padding: 20px; }
  .camp-outline { margin-top: 50px; }
  .camp-outline:before {
    background-position: center;
    bottom: 10px;
    left: 0;
    right: 0;
    top: 20px;
    }
  .camp-outline .cpotl-fig {
    min-width: 500px;
    max-width: 500px;
    padding: 30px 60px;
    border-radius: 5px;
    }
  .camp-outline .cpotl-txt {
    padding-left: 30px;
    text-align: left;
    }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.campaign {
  background-position: center;
/*  padding-bottom: 500px;*/
  }
.home-block.campaign:before { background-position: center; }
.home-block.campaign:after {
  background-image: url(../img/home/campaign-fish-sp.png);
  background-size: 120%;
  bottom: 10vh;
  left: 0;
  right: 0;
  top: 10vh;
  }
.home-block.campaign .bodyarea {
  margin-top: 30px;
  max-width: 1400px;
  }
  .camp-con { padding: 0 20px; }
  .camp-fig { flex-wrap: wrap; }
  .camp-fig .item { padding: 10px 0; }
  .camp-info { max-width: 900px; }
  .camp-info dl {
    margin-bottom: 20px;
    flex-direction: column;
    }
  .camp-info dl:last-child { margin-bottom: 0; }
  .camp-info dl dt {
    padding: 10px 0;
    width: 100%;
    }
  .camp-info dl dd { margin-top: 10px; }
  .camp-outline {
    margin-top: 30px;
    flex-wrap: wrap;
    }
  .camp-outline:before {
    background-position: center;
    background-size: 200%;
    bottom: -300px;
    left: -20px;
    right: -20px;
    top: 20px;
    }
  .camp-outline .cpotl-fig {
    min-width: 90vw;
    max-width: 90vw;
    padding: 15px 30px;
    border-radius: 5px;
    }
  .camp-outline .cpotl-txt {
    margin-top: 20px;
    padding: 0 20px;
    text-align: center;
    }
}
/* ------------------------------------

  City

------------------------------------ */
.home-block.city {
  background-color: rgb(255 255 255);
  z-index: 3;
  }
  .home-block.city .ttlarea { text-align: center; }
  .home-block.city .ttlarea .ttl.main {
    background: linear-gradient(135deg, #0C24D5 0%, #0CD5A5 100%);
    background: -webkit-linear-gradient(-45deg, #0C24D5 0%, #0CD5A5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    }
  .city-item {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    }
  .city-item:nth-child(even) { background-color: rgb(246 244 244); }
  .city-item .figarea img { border-radius: 10px; }
  .city-item .figarea figcaption { text-align: right; }
  .city-item .figarea figcaption a {
    color: #0059F2;
    text-decoration: underline;
    }
  .city-item .conarea .cityname {
    background: transparent linear-gradient(117deg, #0C24D5 0%, #0CD5A5 100%) 0% 0% no-repeat padding-box;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    }
  .city-item .conarea .detail dl {
    border-bottom: 1px solid rgb(112 112 112 / 0.5);
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    }
  .city-item .conarea .detail dl:last-child { border-bottom: none; }
  .city-item .conarea .btnarea { text-align: right; }
  .city-item .conarea .btnarea a {
    background: transparent linear-gradient(106deg, #EB2F86 0%, #C8A71D 100%) 0% 0% no-repeat padding-box;
    color: #fff;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 100px;
    }
  .city-item .conarea .btnarea a:after {
    background-image: url(../../src/img/common/arrow-right-white.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    content: '';
    display: inline-block;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block.city {}
  .home-block.city .ttlarea .ttl.main {
    font-size: min(7vw, 90px);
    line-height: 1.3em;
    padding: 5vh 0;
    }
  .home-block.city .ttlarea .ttl.sub {
    font-size: min(2.5vw, 25px);
    line-height: 1.5em;
    }
  .city-list { margin-top: 25px; }
  .city-item { padding: 25px; }
  .city-item:last-child { padding-bottom: 300px; }
  .city-item .figarea {
    max-width: 550px;
    min-width: 550px;
    padding: 25px;
    }
  .city-item .figarea figcaption {
    font-size: 16px;
    margin-top: 5px;
    }
  .city-item .conarea {
    max-width: 550px;
    padding: 25px;
    }
  .city-item .conarea .cityname {
    font-size: 25px;
    padding: 5px 15px;
    }
  .city-item .conarea .eventname {
    font-size: 25px;
    line-height: 1.5;
    margin-top: 15px;
    }
  .city-item .conarea .detail { margin-top: 15px; }
  .city-item .conarea .detail dl {
    font-size: 17px;
    line-height: 1.65;
    padding: 15px 0;
    }
  .city-item .conarea .detail dl dt { min-width: 100px; }
  .city-item .conarea .btnarea { margin-top: 15px; }
  .city-item .conarea .btnarea a {
    font-size: 18px;
    height: 50px;
    max-width: 220px;
    padding: 0 10px 0 25px;
    }
  .city-item .conarea .btnarea a:after {
    height: 9px;
    min-width: 11px;
    }
  /* Hover */
  .city-item .figarea figcaption a,
  .city-item .conarea .btnarea a { transition: all 0.3s; }
  .city-item .figarea figcaption a:hover,
  .city-item .conarea .btnarea a:hover { opacity: 0.6; }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.city {}
  .home-block.city .ttlarea .ttl.main {
    font-size: min(8vw, 40px);
    line-height: 1.3em;
    padding: 2vh 0;
    }
  .home-block.city .ttlarea .ttl.sub {
    font-size: min(3.5vw, 15px);
    line-height: 1.5em;
    }
  .city-list { margin-top: 10px; }
  .city-item {
    padding: 15px 30px;
    flex-wrap: wrap;
    }
  .city-item:last-child { padding-bottom: 300px; }
  .city-item .figarea { padding: 12.5px 0; }
    .city-item .figarea figcaption {
      font-size: 13px;
      margin-top: 5px;
      }
  .city-item .conarea { padding: 12.5px 0; }
  .city-item .conarea .cityname {
    font-size: 20px;
    padding: 5px 15px;
    }
  .city-item .conarea .eventname {
    font-size: 20px;
    line-height: 1.5;
    margin-top: 10px;
    }
  .city-item .conarea .detail { margin-top: 10px; }
  .city-item .conarea .detail dl {
    font-size: 15px;
    line-height: 1.65;
    padding: 15px 0;
    }
  .city-item .conarea .detail dl dt { min-width: 100px; }
  .city-item .conarea .btnarea { margin-top: 10px; }
  .city-item .conarea .btnarea a {
    font-size: 15px;
    height: 60px;
    max-width: 180px;
    padding: 0 10px 0 25px;
    }
  .city-item .conarea .btnarea a:after {
    height: 9px;
    min-width: 11px;
    }
}
/* ------------------------------------

  Sponsorship

------------------------------------ */
.home-block.sponsorship:before {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  }
  .sss-list { margin: 0 auto; }
  .sss-list ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    }
  .sss-list ul li {
    color: rgb(255 255 255);
    font-size: min(3.25vw, 25px);
    line-height: 1.5;
    padding: 10px;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    }
/* --------------- */
@media (min-width: 751px) {
.home-block.sponsorship {
  background: transparent linear-gradient(180deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255) 30%, rgb(255 255 255 / 0) 100%) 0% 0% no-repeat padding-box;
  margin-top: -600px;
  padding-bottom: 200px;
  padding-top: 500px;
  }
.home-block.sponsorship:before { background-image: url(../img/home/bg-sponsorship-pc.png); }
  .sss-list {
    margin-top: 30px;
    max-width: 1200px;
    }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.sponsorship {
  margin-top: -180px;
  z-index: 1;
  padding-bottom: 150px;
  padding-top: 100px;
  background: transparent linear-gradient(180deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255) 30%, rgb(255 255 255 / 0) 100%) 0% 0% no-repeat padding-box;
  }
.home-block.sponsorship:before { background-image: url(../img/home/bg-sponsorship-sp.png); }
  .sss-list { margin-top: 20px; }
  .sss-list ul { padding: 0 10px; }
}
/* ------------------------------------

  Footer

------------------------------------ */
.home-block.footer {
  padding: 0;
  position: relative;
  text-align: center;
  z-index: 3;
  }
.home-block.footer .radius {
  position: relative;
  pointer-events: none;
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  }
.home-block.footer .radius img { width: 100%; }
.home-block.footer .bodyarea { background-color: rgb(255 255 255); }
  .f-credit { border-bottom: 1px solid rgb(112 112 112); }
  .f-sponsored {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    }
  .f-sponsored .logo dl {
    display: flex;      
    align-items: center;
    justify-content: center;
    }
  .f-sponsored .addr dl { line-height: 1.5; }
  .f-sponsored .addr dl dt { font-weight: 700; }
  .f-sponsored .addr a.tel {
    color: initial;
    font-size: 130%;
    font-weight: 700;
    }
  .f-copy { font-weight: 500; }
/* --------------- */
@media (min-width: 751px) {
.home-block.footer { margin-top: -150px; }
.home-block.footer .bodyarea { padding: 0 60px 60px; }
  .f-credit {
    display: inline-block;
    font-size: 16px;
    padding-bottom: 30px;
    }
  .f-sponsored { padding-top: 20px; }
  .f-sponsored .item { padding: 10px 25px; }
  .f-sponsored .item dl { font-size: 20px; }
  .f-sponsored .addr dl { text-align: left; }
  .f-sponsored .addr a.tel { pointer-events: none; }
  .f-sponsored .logo a img { transition: all 0.3s; }
  .f-copy {
    font-size: 16px;
    margin-top: 40px;
    }
  /* Hover */
  .f-sponsored .logo a:hover img { opacity: 0.7; }
}
/* --------------- */
@media (max-width: 750px) {
.home-block.footer { margin-top: -100px; }
.home-block.footer .bodyarea { padding: 20px 20px 60px; }
  .f-credit {
    display: block;
    font-size: 13px;
    line-height: 1.5;
    padding-bottom: 30px;
    }
  .f-sponsored { padding-top: 20px; }
    .f-sponsored .item { padding: 10px 0; }
    .f-sponsored .item dl { font-size: 17px; }
  .f-copy {
    font-size: 12px;
    margin-top: 40px;
    }
}