@charset "shift_jis";
/* Updated 2025/09/29.T */
/*-----------------------
common
------------------------*/
@font-face {
  font-family: "noto-sans-black";
  src: url("/kojin/special/fonts/NotoSansJP-Black.woff") format("woff");
}
body {
  min-width: auto;
}
#main-area {
  overflow: hidden;
}
#footer-content {
  position: relative;
  z-index: 1;
  margin-top: 0;
}
.section-main {
  position: relative;
  max-width: 500px;
  margin: 0 auto;
  overflow: hidden;
  z-index: 1;
  box-shadow: 0px 0px 80px 0px rgba(20, 29, 29, 1);
  background: #000;
}
.bg-content01 {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  height: 100vh;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_01.jpg) no-repeat center 0 / cover;
}
._t-orange01{
  color: #F68213!important;
}
#header-wrap{
  z-index: 2;
}
.cpEndTxt{
  z-index: 3;
}
.cpEndMask{
  z-index: 1;
}
.list-circle01>.item::before {
  background: #56635F;
}
.toggle-block01 > [role=tablist] > [role=tab]::after {
  top: calc(50% - 16px) !important;
  right: 5px !important;
  background-position: center center;
  background-size: 26px auto;
}
.card-normal01>.inner>.header {
  padding: 16px;
}
.modal-block01>.inner>.header>.title._t-left{
  padding-left: 2%;
}
#footer-area.footer-fixed:not(.-close) #footer-content .footer-logo {
  padding-bottom: 67px;
}
/*-----------------------
load-wrap01
------------------------*/
.load-wrap01{
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  padding: 24px;
  background: #000 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_02.jpg) no-repeat center center / 0;
  overflow: hidden;
}
.load-wrap01 .ttl01{
  position: relative;
  z-index: 1;
}
.load-wrap01::before,
.load-wrap01::after,
.load-wrap01 .bg01 {
  background: inherit;
  background-size: cover;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.load-wrap01::before,
.load-wrap01::after{
  content: "";
}
.load-wrap01 .bg01 {
  mix-blend-mode: screen;
}
.load-wrap01 .bg01::before {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  mix-blend-mode: multiply;
}
.load-wrap01 .r::before {
  background: #f00;
}
.load-wrap01 .g::before {
  background: #0f0;
}
.load-wrap01 .b::before {
  background: #00f;
}
.load-wrap01::before {
  animation: glitch-before 2.4s .6s linear infinite alternate both;
}
.load-wrap01::after {
  animation: glitch-after 2.4s .6s linear infinite alternate both;
}
.load-wrap01 .g {
  animation: rgb-shift-g 2.4s .6s steps(1, jump-end) infinite alternate both;
}
.load-wrap01 .b {
  animation: rgb-shift-b 2.4s .6s steps(1, jump-end) infinite alternate both;
}
@keyframes glitch-before {
  0% {
    clip-path: polygon(0% 37.7571033331%, 100% 37.7571033331%, 100% 41.7635621401%, 0% 41.7635621401%);
    transform: translate(1.364191512%, -0.3809281039%);
  }
  5% {
    clip-path: polygon(0% 73.6898221892%, 100% 73.6898221892%, 100% 74.7001981665%, 0% 74.7001981665%);
    transform: translate(-4.3549045874%, -0.2069073053%);
  }
  10% {
    clip-path: polygon(0% 78.8913596898%, 100% 78.8913596898%, 100% 84.2651301607%, 0% 84.2651301607%);
    transform: translate(3.5197163296%, 0.3350720211%);
  }
  15% {
    clip-path: polygon(0% 56.7793816567%, 100% 56.7793816567%, 100% 64.656631704%, 0% 64.656631704%);
    transform: translate(-7.0983752763%, -0.3636174265%);
  }
  20% {
    clip-path: polygon(0% 74.3044940554%, 100% 74.3044940554%, 100% 82.9575924936%, 0% 82.9575924936%);
    transform: translate(2.6030445289%, 0.4308072327%);
  }
  25% {
    clip-path: polygon(0% 74.600590707%, 100% 74.600590707%, 100% 84.275089075%, 0% 84.275089075%);
    transform: translate(-2.9243006524%, -0.0224249092%);
  }
  30% {
    clip-path: polygon(0% 67.6142111395%, 100% 67.6142111395%, 100% 77.3158202977%, 0% 77.3158202977%);
    transform: translate(0.2896614228%, -0.1351516983%);
  }
  35% {
    clip-path: polygon(0% 38.9680143417%, 100% 38.9680143417%, 100% 44.2228356859%, 0% 44.2228356859%);
    transform: translate(6.5578517135%, -0.4785858693%);
  }
  40% {
    clip-path: polygon(0% 23.1645595052%, 100% 23.1645595052%, 100% 24.2864376987%, 0% 24.2864376987%);
    transform: translate(5.167486576%, 0.061664508%);
  }
  45% {
    clip-path: polygon(0% 72.9993806924%, 100% 72.9993806924%, 100% 76.2314615895%, 0% 76.2314615895%);
    transform: translate(6.6249206377%, 0.0771632812%);
  }
  50%, 100% {
    clip-path: none;
    transform: none;
  }
}
@keyframes glitch-after {
  0% {
    clip-path: polygon(0% 29.8468595332%, 100% 29.8468595332%, 100% 38.3540893132%, 0% 38.3540893132%);
    transform: translate(6.1151029269%, 0.4730066259%);
  }
  5% {
    clip-path: polygon(0% 32.777068373%, 100% 32.777068373%, 100% 38.8951314062%, 0% 38.8951314062%);
    transform: translate(-3.8025784709%, 0.4058803568%);
  }
  10% {
    clip-path: polygon(0% 74.4969982529%, 100% 74.4969982529%, 100% 77.148365117%, 0% 77.148365117%);
    transform: translate(-1.6332380992%, 0.1789250478%);
  }
  15% {
    clip-path: polygon(0% 59.7431653003%, 100% 59.7431653003%, 100% 67.2491913882%, 0% 67.2491913882%);
    transform: translate(-0.2468332056%, 0.0731531194%);
  }
  20% {
    clip-path: polygon(0% 82.5730085973%, 100% 82.5730085973%, 100% 85.3644531576%, 0% 85.3644531576%);
    transform: translate(-4.5786644039%, -0.3046872821%);
  }
  25% {
    clip-path: polygon(0% 55.3147399539%, 100% 55.3147399539%, 100% 63.2818673042%, 0% 63.2818673042%);
    transform: translate(0.9804471414%, 0.4990224918%);
  }
  30% {
    clip-path: polygon(0% 55.3841812089%, 100% 55.3841812089%, 100% 62.0765798947%, 0% 62.0765798947%);
    transform: translate(5.5003789343%, -0.0159192391%);
  }
  35% {
    clip-path: polygon(0% 12.7842126445%, 100% 12.7842126445%, 100% 16.0562216973%, 0% 16.0562216973%);
    transform: translate(3.8923053375%, 0.1763514237%);
  }
  40% {
    clip-path: polygon(0% 48.9644706542%, 100% 48.9644706542%, 100% 58.6546043817%, 0% 58.6546043817%);
    transform: translate(6.1243796769%, -0.3952597262%);
  }
  45% {
    clip-path: polygon(0% 85.8719533119%, 100% 85.8719533119%, 100% 88.666018107%, 0% 88.666018107%);
    transform: translate(3.048460652%, 0.4409182963%);
  }
  50%, 100% {
    clip-path: none;
    transform: none;
  }
}
@keyframes rgb-shift-g {
  0% {
    transform: translate(-1.0531428321%, 0.087371746%);
  }
  5% {
    transform: translate(-0.4053362819%, -0.3467567989%);
  }
  10% {
    transform: translate(1.4470704141%, -0.1618240779%);
  }
  15% {
    transform: translate(0.4854735489%, 0.4611972518%);
  }
  20% {
    transform: translate(-1.8253530543%, -0.0281653869%);
  }
  25% {
    transform: translate(1.1803386152%, 0.2964928258%);
  }
  30% {
    transform: translate(-1.1361113785%, 0.3678579169%);
  }
  35% {
    transform: translate(0.293580657%, -0.4698380911%);
  }
  40% {
    transform: translate(1.7642986428%, -0.4141977449%);
  }
  45% {
    transform: translate(-1.6468374382%, 0.3189248988%);
  }
  50%, 100% {
    transform: none;
  }
}
@keyframes rgb-shift-b {
  0% {
    transform: translate(-1.6082509987%, 0.0254374529%);
  }
  5% {
    transform: translate(-0.7386252243%, -0.2502338057%);
  }
  10% {
    transform: translate(1.2050887112%, 0.084223571%);
  }
  15% {
    transform: translate(1.8339247175%, -0.3440079453%);
  }
  20% {
    transform: translate(1.708575681%, 0.1806288658%);
  }
  25% {
    transform: translate(-0.0504480865%, -0.1186426742%);
  }
  30% {
    transform: translate(-0.7489463699%, -0.1040463104%);
  }
  35% {
    transform: translate(-1.8967548233%, -0.4651153767%);
  }
  40% {
    transform: translate(0.3416369533%, -0.1616640914%);
  }
  45% {
    transform: translate(1.1330103213%, 0.2805137914%);
  }
  50%, 100% {
    transform: none;
  }
}
.load-wrap01.-load{
  animation: load01 0s .4s ease-in-out forwards;
  background-size: cover;
}
.load-wrap01.-load::before,
.load-wrap01.-load::after,
.load-wrap01.-load .bg01{
  display: none;
}
@keyframes load01 {
  0%{
    opacity: 1;
  }
  100%{
    opacity: 0;
  }
}
/*-----------------------
load-wrap02
------------------------*/
.load-wrap02{
  position: fixed;
  top: 0;
  left: 200%;
  right: -200%;
  bottom: 0;
  z-index: 3;
  transform: skewX(-45deg);
  background: #000;
}
.load-wrap02.-load{
  animation: load02 .8s 0s ease-in-out forwards;
}
@keyframes load02 {
  0%{
    left: 200%;
    right: -200%;
  }
  50%{
    left: -100%;
    right: -200%;
  }
  100%{
    left: -100%;
    right: 200%;
  }
}
/*-----------------------
kv-area01
------------------------*/
.kv-area01>.inner{
  position: relative;
  top: 0;
  left: 0;
}
.kv-area01>.inner::before,
.kv-area01>.inner::after{
  position: absolute;
  display: block;
  content: '';
  top: 0;
  z-index: 1;
  bottom: 0;
  width: 19px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_07.png) repeat-y 0 0 / 100%;
}
.kv-area01>.inner::before{
  left: 0;
  animation: bg01 25s linear infinite;
}
.kv-area01>.inner::after{
  right: 0;
  animation: bg02 25s linear infinite;
}
@keyframes bg01 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -901px;
  }
}
@keyframes bg02 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 901px;
  }
}
/*-----------------------
bg-wrap01
------------------------*/
.bg-wrap01{
  position: relative;
  z-index: 1;
  margin: -20vw 0 -11vw;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_03.png) no-repeat 0 0 / 100% , url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_06.png) no-repeat 0 bottom / 100%;
}
.bg-wrap01>.inner{
  padding: 64px 12px 74px;
  min-height: 230vw;
}
/*-----------------------
bg-wrap02
------------------------*/
.bg-wrap02{
  position: relative;
  width: 100%;
  padding: 64px 18px 76px;
  -webkit-clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
  clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
  background-color: transparent;
}
.bg-wrap02::before{
  display: block;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}
.bg-wrap02.-bg01{
  padding-bottom: 0;
}
.bg-wrap02.-bg01::before{
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_04.jpg) repeat-y 0 0 / cover;
}
/*02*/
.bg-wrap02.-bg02{
  padding-top: 0;
  padding-bottom: 40.8vw;
}
.bg-wrap02.-bg02::before{
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_05.jpg) repeat-y 0 0 / cover;
}
/*03*/
.bg-wrap02.-bg03{
  margin-top: -40.8vw;
  padding-top: 40.8vw;
}
.bg-wrap02.-bg03::before{
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_02.jpg) repeat-y 0 0 / cover;
}
/*-----------------------
button01
------------------------*/
.button01{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
  min-height: 60px;
  box-shadow: 0px 0px 15px 0px rgba(42, 255, 230, 1);
  background: #2AFFE6;
  text-decoration: none;
  color: #000 !important;
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 1.2;
  text-align: center;
  transition:  box-shadow .2s 0s ease-in-out;
}
/*-----------------------
button02
------------------------*/
.button02{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
  min-height: 58px;
  border: 3px solid #2AFFE6;
  box-shadow: 0px 0px 15px 0px rgba(42, 255, 230, 1),0px 0px 16px 0px rgba(42, 255, 230, .5) inset;
  background: rgba(0, 0, 0, 0.8);
  text-decoration: none;
  color: #9FFFF4 !important;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.2;
  text-align: center;
  transition:  box-shadow .2s 0s ease-in-out;
}
.button02.-type02{
  min-height: 72px;
  font-size: 1.8rem;
}
/*-----------------------
button03
------------------------*/
.button03{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 60px;
  min-height: 52px;
  padding: 8px;
  border: 3px solid #FFBFFE;
  box-shadow: 0px 0px 15px 0px rgba(255, 93, 252, 1),0px 0px 16px 0px rgba(255, 93, 252, 1) inset;
  background: rgba(0, 0, 0, 0.8);
  text-decoration: none;
  color: #FFDAFE !important;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1.2;
  text-align: center;
  transition:  box-shadow .2s 0s ease-in-out;
}
/*-icon01*/
.button03.-icon01{
  text-align: left;
}
.button03.-icon01>.inner{
  display: inline-block;
  position: relative;
  padding-left: 32px;
}
.button03.-icon01>.inner::before{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  top: calc(50% - 13px);
  width: 26px;
  height: 26px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_01.svg) repeat-y 0 0 / 100%;
}
/*-----------------------
button-wrap01
------------------------*/
.button-wrap01{
  position: relative;
  margin: 50px 0 0;
}
.button-wrap01::before{
  display: block;
  content: '';
  position: absolute;
  top: -18px;
  left: calc(50% - 124px);
  width: 248px;
  height: 22px;
  border-radius: 30px;
  box-shadow: 0px 0px 15px 0px rgba(42, 255, 230, 1);
  background: #000 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_txt_02.png) no-repeat center center / 90%;
}
.button-wrap01::after{
  display: block;
  content: '';
  position: absolute;
  top: 3px;
  left: calc(50% - 5px);
  width: 10px;
  height: 12px;
  background: #000;
  -webkit-clip-path: polygon(0 0, 100% 0, 50% 100%);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.turbo-hover .button-wrap01{
  margin: 27px 0 0;
}
/*-text02*/
.button-wrap01.-text02{
  margin: 42px 0 0;
}
.button-wrap01.-text02::before{
  left: calc(50% - 75px);
  width: 150px;
  background: #000 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_txt_13.png) no-repeat center center / 87%;
}
/*-----------------------
link-text01
------------------------*/
a.link-text01{
  display: inline-block;
  position: relative;
  padding-left: 20px;
  color: #2AFFE6;
  font-size: 1.6rem;
  font-weight: normal;
  text-decoration: none;
}
.link-text01::before{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 14px;
  height: 14px;
  background: #000 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_08.svg) no-repeat 0 0 / 100%;
}
/*-----------------------
link-text02
------------------------*/
.link-text02{
  margin: 32px 0 0;
  text-align: center;
}
.link-text02 a{
  display: inline-block;
  position: relative;
  padding-right: 34px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  font-size: 1.8rem;
}
.link-text02 a::before{
  display: block;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 28px;
  height: 28px;
  background: url(/kojin/cmn/imgs/ico_arrow_right_02.svg)  no-repeat 0 0 / cover;
}
/*-----------------------
img-wrap01
------------------------*/
.img-wrap01{
  position: relative;
  margin: 0 -12px;
  padding: 0 12px;
}
.img-wrap01::after{
  display: block;
  content: '';
  position: absolute;
  right: 0;
  top: 80px;
  width: 80px;
  height: 144px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_img_04.png) no-repeat 0 0 /100%;
}
/*-----------------------
turbo-hover
------------------------*/
.turbo-hover{
  position: relative;
}
.turbo-hover::before{
  display: block;
  content: '';
  position: absolute;
  z-index: 1;
  left:10px;
  top: 2px;
  width: 78px;
  height: 94px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_img_06.png) no-repeat 0 0 / 100%;
  opacity: 0;
  transition: opacity 0.2s 0s ease-in-out;
}
/*-----------------------
ttl-img01
------------------------*/
.ttl-img01{
  position: relative;
  z-index: 1;
  margin: 0 -18px;
}
/*-----------------------
bg-area01
------------------------*/
.bg-area01{
  margin: -70px 0 0;
  padding: 60px 24px 60px;
  background: rgba(0, 0, 0, 0.8);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
}
/*-----------------------
ttl-img02
------------------------*/
.ttl-img02{
  margin: 56px -24px 0;
}
.ttl-img02{
  margin: 56px -24px 0;
}
section:first-child>.ttl-img02{
  margin-top: 0;
}
/*-----------------------
text-wrap01
------------------------*/
.text-wrap01{
  margin: 26px 0 0;
  font-size: 2.4rem;
  line-height: 1.2;
  font-weight: bold;
  color: #CAFF1D;
}
/*-----------------------
img-wrap03
------------------------*/
.img-wrap03{
  margin: 48px -18px 0;
  padding: 14px 22px 0;
  min-height: 192vw;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_20.png) no-repeat center 0 / 100%;
}
.img-wrap03>.img01{
  margin-right: -22px;
}
/*-----------------------
bg-area02
------------------------*/
.bg-area02{
  position: relative;
  margin: 32px -18px 0;
  padding: 24px 18px 60px;
  background: rgba(0, 0, 0, 0.8);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
}
.bg-area02::before{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  z-index: -1;
  top: -11vw;
  height: 11vw;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_08.png) no-repeat 0 bottom / 100% 100%;
  opacity: 0.8;
}
/*-----------------------
ttl-bg01
------------------------*/
.ttl-bg01{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 88vw;
  padding-top: 10vw;
  margin: -14vw -18px 0;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_09.png) no-repeat 0 0 / 100%;
}
/*-----------------------
ttl-bg02
------------------------*/
.ttl-bg02{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 90vw;
  padding-top: 10vw;
  margin: 28px -18px 0;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_10.png) no-repeat 0 0 / 100%;
}
/*-----------------------
img-wrap04
------------------------*/
.img-wrap04{
  margin: -50px 0 0;
  text-align: center;
}
/*-----------------------
img-wrap05
------------------------*/
.img-wrap05{
  margin: -60px 0 0;
  text-align: center;
}
/*-----------------------
text-wrap02
------------------------*/
.text-wrap02{
  margin: 16px 0 0;
  padding: 10px;
  background: rgba(0, 0, 0, 0.9);
}
/*-----------------------
bg-area03
------------------------*/
.bg-area03{
  margin: 0 -18px;
  padding-bottom: 10vw;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_12.png) no-repeat 0 bottom / 100%;
}
.bg-area03>.inner01{
  padding: 66px 0 0;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_11.png) no-repeat 0 bottom / 100%;
}
.bg-area03>.inner02{
  position: relative;
  padding: 28px 0 16px;
  background: #C1F320;
}
/*-----------------------
bg-scroll01
------------------------*/
.bg-scroll01{
  position: relative;
  z-index: 1;
  padding-top: 31px;
}
.bg-scroll01::before{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 32px;
  background: #9917FD url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_14.png) repeat-x 0 center / auto 32px;
  animation: obi01 20s linear infinite;
}
@keyframes obi01 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -544px 0;
  }
}
/*-----------------------
img-wrap06
------------------------*/
.img-wrap06{
  margin: 20px 0 0;
  text-align: center;
}
.img-wrap06>img{
  width: 84%;
}
/*-----------------------
img-note01
------------------------*/
.img-note01{
  margin: -9vw 24px 0 18px;
}
/*-----------------------
ttl-bg03
------------------------*/
.ttl-bg03{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 78vw;
  padding-top: 10vw;
  margin: -44px -18px 0;
  background: #7C46B4;
}
.ttl-bg03>img{
  max-width: 69%;
}
/*-----------------------
img-layout01
------------------------*/
.img-layout01{
  position: relative;
  margin: 0 -18px 0;
  padding-bottom: 60px;
  background: #7C46B4;
}
.img-layout01>.item01{
  position: relative;
  width: 90.9%;
  background: rgba(0, 0, 0, 0.8);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  color: #fff;
}
.img-layout01>.item01 a{
  color: #fff;
}
.img-layout01>.item01:nth-child(odd){
  margin-left: auto;
}
.img-layout01>.item01:nth-child(even){
  margin-right: auto;
}
.img-layout01>.item01:not(:first-child){
  margin-top: 100px;
}
.img-layout01>.item01>.icon01{
  position: absolute;
  width: 100px;
  left: -30px;
  top: -40px;
}
.img-layout01>.item01:nth-child(even)>.icon01{
  left: auto;
  right: -30px;
}
.img-layout01>.item01>.ttl01{
  padding: 48px 20px 0;
  text-align: center;
}
.img-layout01>.item01>.img01{
  margin: 32px 0 0;
}
.img-layout01>.item01>.inner01{
  padding: 32px 20px;
}
.img-layout01 .icon-link01>.inner{
  position: relative;
  padding-right: 1.8em;
}
.img-layout01 .icon-link01>.inner::after {
  position: absolute;
  top: .0em;
  right: 0;
  left: auto;
  width: 1.5em;
  height: 1.5em;
  background: url(/kojin/cmn/imgs/ico_arrow_right_02.svg) no-repeat 0 0 / cover;
}
.img-layout01::after{
  display: block;
  content: '';
  position: absolute;
  bottom: -10vw;
  left: 0;
  right: 0;
  z-index: 1;
  height: 11vw;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_13.png) no-repeat 0 bottom / 100%;
}
/*-----------------------
bg-area04
------------------------*/
.bg-area04{
  position: relative;
  padding: 80px 24px;
  margin: 0 -18px 0;
  -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
  clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
  background-color: transparent;
}
.bg-area04::before{
  display: block;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_02.jpg) no-repeat 0 0 / cover;
  pointer-events: none;
}
.bg-area04 .obi01,
.bg-area04 .obi02{
  display: block;
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 23px;
  margin: 0;
  border: none;
  background: #7CFF62 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_15.png) repeat-x 0 0 / auto 23px;
}
.bg-area04 .obi01{
  top: -1px;
}
.bg-area04 .obi02{
  bottom: 0;
}
.bg-area04>.bg{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0.28;
  z-index: -1;
  overflow: hidden;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_02.jpg) no-repeat 0 0 / cover;
}
.bg-area04>.bg img{
  max-width: none;
}
.bg-area04>.bg>li{
  position: absolute;
  left:0;
  padding-left: 100%;
}
.bg-area04>.bg>li:nth-child(1){
  top: 0%;
}
.bg-area04>.bg>li:nth-child(2){
  top: 12%;
}
.bg-area04>.bg>li:nth-child(3){
  top: 17%;
}
.bg-area04>.bg>li:nth-child(4){
  top: 36%;
}
.bg-area04>.bg>li:nth-child(5){
  top: 43%;
}
.bg-area04>.bg>li:nth-child(6){
  top: 55%;
}
.bg-area04>.bg>li:nth-child(7){
  top: 61%;
}
.bg-area04>.bg>li:nth-child(8){
  top: 66%;
}
.bg-area04>.bg>li:nth-child(9){
  top: 76%;
}
.bg-area04>.bg>li:nth-child(10){
  top: 79%;
}
.bg-area04>.bg>li:nth-child(11){
  top: 83%;
}
.bg-area04>.bg>li:nth-child(12){
  top: 90%;
}
.bg-area04>.bg>li:nth-child(odd){
  animation: text01 22s 0s linear infinite;
}
.bg-area04>.bg>li:nth-child(even){
  animation: text01 30s 0s linear infinite;
}
@keyframes text01 {
  from {
    transform: translate(0%, 0);
  }
  to {
    transform: translate(-100%, 0);
  }
}
/*-----------------------
talk-wrap01
------------------------*/
.talk-wrap01{
  margin: 36px 0 56px;
}
.talk-wrap01>.item{
  position: relative;
  padding: 16px 26px;
  font-size: 1.4rem;
  font-weight: bold;
  color: #000000;
}
.talk-wrap01>.item::before{
  display: block;
  content: '';
  position: absolute;
  bottom: 0;
  width: 60px;
  height: 72px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_02.svg) no-repeat 0 0 / 100%;
}
.talk-wrap01>.item:nth-child(odd){
  margin: 28px 0 0 70px;
  border-radius: 20px 20px 20px 0;
  background: rgba(202, 255, 29, 0.9);
}
.talk-wrap01>.item:nth-child(even){
  margin: 28px 70px 0 0;
  border-radius: 20px 20px 0 20px;
  background: rgba(42, 255, 230, 0.9);
}
.talk-wrap01>.item:nth-child(odd)::before{
  left: -70px;
}
.talk-wrap01>.item:nth-child(even)::before{
  right: -70px;
}
.talk-wrap01>.item:nth-child(1)::before{
  animation: advice_jump01 2.2s 1s infinite linear;
}
.talk-wrap01>.item:nth-child(2)::before{
  animation: advice_jump01 2.2s 2s infinite linear;
}
.talk-wrap01>.item:nth-child(3)::before{
  animation: advice_jump01 2.2s 3s infinite linear;
}
.talk-wrap01>.item:nth-child(4)::before{
  animation: advice_jump01 2.2s 1.5s infinite linear;
}
.talk-wrap01>.item:nth-child(5)::before{
  animation: advice_jump01 2.2s 2.5s infinite linear;
}
@keyframes advice_jump01 {
  0% {
    transform: translate(0, 0) scaleY(1) rotate(0deg);
  }
  2% {
    transform: translate(0, 3px) scaleY(0.9) rotate(0deg);
    background-image: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_02.svg);
  }
  5% {
    transform: translate(0, -10px) scaleY(1) rotate(2deg);
    background-image: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_03.svg);
  }
  8% {
    transform: translate(0, -30px) scaleY(1) rotate(4deg);
  }
  11% {
    transform: translate(0, -20px) scaleY(1) rotate(-2deg);
  }
  14% {
    transform: translate(0, 0) scaleY(1) rotate(0deg);
    background-image: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_03.svg);
  }
  15% {
    transform: translate(0, 0) scaleY(1) rotate(0deg);
    background-image: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_02.svg);
  }
  100% {
    transform: translate(0, 0) scaleY(1) rotate(0deg);
  }
}
/*-----------------------
text-wrap03
------------------------*/
.text-wrap03{
  margin: 36px 0 0;
  color: #fff;
  font-size: 1.6rem;
  line-height: 2;
}
.text-wrap03 p:not(:first-child){
  margin-top: 1.5em;
}
/*-----------------------
ttl-img03
------------------------*/
.ttl-img03{
  position: relative;
  z-index: 1;
  margin: -26.2vw 0 0;
  text-align: center;
}
.ttl-img03>img{
  width: 60vw;
}
/*-----------------------
table-layout01
------------------------*/
.table-layout01{
  background: #fff;
}
.table-layout01>dt{
  padding: 16px;
  background: #7C46B4;
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
}
.table-layout01>dd{
  padding: 16px;
  font-size: 1.6rem;
}
/*-----------------------
sns-list01
------------------------*/
.sns-list01{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 58px 0 0;
}
.sns-list01>li{
  width: 40px;
}
.sns-list01>li:not(:first-child){
  margin-left: 36px;
}
/*-----------------------
flex-wrap01
------------------------*/
.flex-wrap01{
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  background: rgba(0, 0, 0, 0.9);
  padding: 10px 18px;
}
.flex-wrap01>.inner{
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 500px;
  margin: 0 auto;
}
.flex-wrap01>.inner>.item01{
  flex: 1;
}
.flex-wrap01>.inner>.item01:not(:first-child){
  margin-left: 18px;
}
.flex-wrap01 .button01{
  min-height: 42px;
  font-size: 1.4rem;
}
.flex-wrap01 .button02{
  min-height: 42px;
  font-size: 1.2rem;
}
/*-----------------------
obi-anime01
------------------------*/
.obi-anime01{
  position: relative;
}
.obi-anime01::before,
.obi-anime01::after{
  display: block;
  content: '';
  position: absolute;
  left: -50px;
  right: -50px;
  height: 34px;
  background: #CCFF24 url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_17.png) repeat-x 0 0 / auto 34px;
}
.obi-anime01::before{
  bottom: 74px;
  animation: obi02 28s linear infinite;
  transform: rotate(-12deg);
}
.obi-anime01::after{
  bottom: 108px;
  animation: obi02 28s linear infinite reverse;
  transform: rotate(16deg);
}
@keyframes obi02 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -803px 0;
  }
}
/*-----------------------
obi-anime02
------------------------*/
.obi-anime02{
  position: relative;
}
.obi-anime02::before{
  display: block;
  content: '';
  position: absolute;
  left: -50px;
  right: -50px;
  height: 49px;
  top: -8px;
  background: #9917FD url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_18.png) repeat-x 0 0 / auto 49px;
  transform: rotate(-10deg);
  animation: obi03 30s linear infinite;
}
.obi-anime02 img{
  position: relative;
  z-index: 1;
}
@keyframes obi03 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -952px 0;
  }
}
/*-----------------------
fn-more
------------------------*/
.fn-more{
  position: relative;
  overflow: hidden;
}
.fn-more:not(.-open){
  height: 10em;
}
.fn-more-btn{
  position: relative;
  z-index: 1;
  padding-top: 60px;
  margin: -60px -28px 0;
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,.9) 60%,rgba(0,0,0,0) 100%);
  text-align: center;
}
@keyframes obi04 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -900px 0;
  }
}
/*-----------------------
bg-area05
------------------------*/
.bg-area05{
  position: relative;
  padding: 60px 28px;
  margin: 0 -18px;
  -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
  clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
  background-color: transparent;
}
.bg-area05::before{
  display: block;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_bg_02.jpg) no-repeat 0 0 / cover;
  pointer-events: none;
}
.bg-area05after{
  position: relative;
  margin: -40.8vw 0 0;
}
.bg-area05after>img{
  width: 100%;
}
/*-----------------------
fn-carousel-fade
------------------------*/
.fn-carousel-fade img{
  margin: 0 auto;
}
/*-----------------------
scroll01
------------------------*/
.scroll01{
  position: absolute;
  left: calc(50% - 38px);
  width: 75px;
  top: 70vw;
}
.scroll01 .img02{
  width: 65px;
  margin: -16px auto 0;
}
/*-----------------------
table-layout02
------------------------*/
.table-layout02{
  margin: 24px 0 0;
  width: 100%;
  font-size: 1.2rem;
}
.table-layout02 .w01{
  width: 34%;
}
.table-layout02 th,
.table-layout02 td{
  padding: 10px 0;
  border-bottom: 1px solid #CAFF1D;
  vertical-align: middle;
}
.table-layout02 td{
  padding-left: 8px;
}
.table-layout02>tbody>tr>th{
  color: #CAFF1D;
}
.table-layout02>tbody>tr>td em{
  color: #FF5DFC;
}
/*-----------------------
button-wrap02
------------------------*/
.button-wrap02{
  display: flex;
  justify-content: center;
  margin: 16px 0 0;
}
.button-wrap02>.item{
  width: 48.64%;
}
.button-wrap02>.item:not(:first-child){
  margin-left: 2.4%;
}
.button-wrap02>.item>.btn01{
  display: block;
  padding: 12px 8px;
  width: 100%;
  border-radius: 30px;
  background: #CAFF1D;
  box-shadow: 0px 0px 12px 0px rgba(202, 255, 29, 1);
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.2;
  color: #000;
  font-weight: bold;
}
.button-wrap02>.item>.btn01>span{
  display: inline-block;
  position: relative;
  padding-right: 22px;
}
.button-wrap02>.item>.btn01>span::after{
  display: block;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 18px;
  height: 18px;
  background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_09.svg) no-repeat 0 0 / 100%;
}
/*-----------------------
arrowanime01
------------------------*/
.arrowanime01{
  position: relative;
}
.arrowanime01>.item01{
  opacity: 1;
  transform: translate(0 , 6px);
}
.arrowanime01>.item01:nth-child(1){
  animation: arrow01 2.4s 0s linear infinite;
}
.arrowanime01>.item01:nth-child(2){
  position: absolute;
  left: 0;
  top: 0;
  animation: arrow01 2.4s 0.2s linear infinite;
}
.arrowanime01>.item01:nth-child(3){
  position: absolute;
  left: 0;
  top: 0;
  animation: arrow01 2.4s .4s linear infinite;
}
@keyframes arrow01 {
  0% {
    opacity: 1;
    transform: translate(0 , 6px);
  }
  16%{
    opacity: .4;
    transform: translate(0 , 6px);
  }
  31%{
    opacity: .2;
    transform: translate(0 , 6px);
  }
  32%{
    opacity: .2;
    transform: translate(0 , 0);
  }
  48%{
    opacity: .9;
    transform: translate(0 , 6px);
  }
  100% {
    opacity: 1;
    transform: translate(0 , 6px);
  }
}
/*-----------------------
img-arrow01
------------------------*/
.img-arrow01{
  width: 65px;
  margin: 24px auto;
}
/*02*/
.img-arrow02{
  width: 113px;
  margin: 40px auto;
}
/*-----------------------
fn-view-wrap
------------------------*/
.fn-view{
  opacity: 0;
}
.fn-view.-show{
  animation: show01 .4s 0s ease-in-out forwards;
}
/* single*/
.fn-view-single{
  opacity: 0;
}
.fn-view-single.-show{
  animation: show01 .4s .4s ease-in-out forwards;
}
/* -action01*/
.fn-view.-action01.-show{
  animation: show02 .4s .0s ease-in-out forwards;
}
.fn-view-single.-action01.-show{
  animation: show02 .4s .4s ease-in-out forwards;
}
/* -action02*/
.fn-view.-action02.-show{
  animation: show03 .4s .0s ease-in-out forwards;
}
.fn-view-single.-action02.-show{
  animation: show03 .4s .4s ease-in-out forwards;
}
/* -action03*/
.fn-view.-action03.-show{
  animation: show04 .4s .0s ease-in-out forwards;
}
.fn-view-single.-action03.-show{
  animation: show04 .4s .4s ease-in-out forwards;
}
@keyframes show01 {
  0% {
    opacity: 0;
    transform: translate(0 , 20px);
  }
  100% {
    opacity: 1;
    transform: translate(0 , 0);
  }
}
@keyframes show02 {
  0% {
    opacity: 1;
    transform: translate(-375px , 0) scale(.8,.8);
  }
  50% {
    opacity: 1;
    transform: translate(0 , 0) scale(.8,.8);
  }
  100% {
    opacity: 1;
    transform: translate(0 , 0) scale(1,1);
  }
}
@keyframes show03 {
  0% {
    opacity: 0;
    transform: translate(375px , 0) scale(.8,.8);
  }
  50% {
    opacity: 1;
    transform: translate(0 , 0) scale(.8,.8);
  }
  100% {
    opacity: 1;
    transform: translate(0 , 0) scale(1,1);
  }
}
@keyframes show04 {
  0% {
    opacity: 0;
    transform: translate(0 , 20px) scale(.9,.9);
  }
  66%{
    opacity: 1;
    transform: translate(0 , 0) scale(1.1,1.1);
  }
  100% {
    opacity: 1;
    transform: translate(0 , 0) scale(1,1);
  }
}
@media screen and (min-width: 1181px) {
  /*-----------------------
  flex-wrap01
  ------------------------*/
  .flex-wrap01{
    display: none!important;
  }
  #footer-area.footer-fixed:not(.-close) #footer-content .footer-logo {
    padding-bottom: 0;
  }
}
@media screen and (max-width: 1180px) {
  .flex-wrap02{
    display: none!important;
  }
}
@media screen and (min-width: 768px) {
  /*-----------------------
  hover
  ------------------------*/
  .button01:hover{
    box-shadow: 0px 0px 30px 0px rgba(42, 255, 230, 1);
  }
  .button02:hover{
    box-shadow: 0px 0px 30px 0px rgba(42, 255, 230, 1),0px 0px 32px 0px rgba(42, 255, 230, .5) inset;
  }
  .button03:hover{
    box-shadow: 0px 0px 30px 0px rgba(255, 93, 252, 1),0px 0px 32px 0px rgba(255, 93, 252, 1) inset;
  }
  .turbo-hover:hover::before{
    opacity: 1;
  }
}
@media screen and (min-width: 500px) {
  /*-----------------------
  common
  ------------------------*/
  .bg-content01{
    display: block;
  }
  /*-----------------------
  kv-area01
  ------------------------*/
  .kv-area01>.inner>h1{
    width: 500px;
  }
  .kv-area01>.inner::before,
  .kv-area01>.inner::after{
    transform: scale(1.33,1.33);
  }
  .kv-area01>.inner::before{
    left: calc(50% - 247px);
  }
  .kv-area01>.inner::after{
    right: calc(50% - 247px);
  }
  /*-----------------------
  bg-wrap01
  ------------------------*/
  .bg-wrap01>.inner::before{
    left: calc(50% - 250px);
    width: 500px;
  }
  .bg-wrap01{
    margin: -100px 0 -28px;
  }
  .bg-wrap01>.inner{
    padding: 86px 16px 98px;
    min-height: 1146px;
  }
  /*-----------------------
  bg-wrap02
  ------------------------*/
  .bg-wrap02::before{
    left: calc(50% - 250px);
    width: 500px;
  }
  .bg-wrap02.-bg02 {
    padding-bottom: 203px;
  }
  /*03*/
  .bg-wrap02.-bg03{
    margin-top: -204px;
    padding-top: 204px;
  }
  /*-----------------------
  button01
  ------------------------*/
  .button01{
    min-height: 80px;
    font-size: 3.2rem;
  }
  /*-----------------------
  button02
  ------------------------*/
  .button02{
    min-height: 62px;
    font-size: 2rem;
  }
  /*-----------------------
  button-wrap01
  ------------------------*/
  .button-wrap01{
    margin: 66px 0 0;
  }
  .button-wrap01::before{
    top: -24px;
    left: calc(50% - 165px);
    width: 330px;
    height: 30px;
  }
  .button-wrap01::after{
    top: 4px;
    left: calc(50% - 7px);
    width: 14px;
    height: 16px;
  }
  .turbo-hover .button-wrap01{
    margin: 36px 0 0;
  }
  /*-text02*/
  .button-wrap01.-text02{
    margin: 56px 0 0;
  }
  .button-wrap01.-text02::before{
    left: calc(50% - 100px);
    width: 200px;
  }
  /*-----------------------
  bg-area02
  ------------------------*/
  .bg-area02::before{
    top: -56px;
    height: 56px;
  }
  /*-----------------------
  ttl-bg01
  ------------------------*/
  .ttl-bg01{
    min-height: 420px;
    margin: -70px -18px 0;
    padding-top: 60px;
  }
  /*-----------------------
  ttl-bg02
  ------------------------*/
  .ttl-bg02{
    min-height: 440px;
    padding-top: 50px;
  }
  /*-----------------------
  button03
  ------------------------*/
  .button03{
    min-height: 70px;
    font-size: 2rem;
  }
  /*-----------------------
  bg-area03
  ------------------------*/
  .bg-area03{
    margin-top: -1px;
    padding-bottom: 52px;
  }
  /*-----------------------
  img-note01
  ------------------------*/
  .img-note01{
    margin: -54px 24px 0;
  }
  /*-----------------------
  ttl-bg03
  ------------------------*/
  .ttl-bg03{
    min-height: 390px;
    margin: -44px -18px 0;
    padding-top: 40px;
  }
  /*-----------------------
  talk-wrap01
  ------------------------*/
  .talk-wrap01>.item{
    padding: 22px 35px;
    font-size: 1.8rem;
  }
  .talk-wrap01>.item::before{
    width: 80px;
    height: 96px;
  }
  .talk-wrap01>.item:nth-child(odd){
    margin: 38px 0 0 90px;
  }
  .talk-wrap01>.item:nth-child(even){
    margin: 38px 90px 0 0;
  }
  .talk-wrap01>.item:nth-child(odd)::before{
    left: -90px;
  }
  .talk-wrap01>.item:nth-child(even)::before{
    right: -90px;
  }
  /*-----------------------
  flex-wrap01
  ------------------------*/
  .flex-wrap02{
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: calc(50% + 250px);
    right: 0;
    top: 0;
    bottom: 0;
  }
  .flex-wrap02 .ttl01{
    padding: 0 10px;
  }
  .flex-wrap02>.inner{
    width: 100%;
    max-width: 480px;
  }
  .flex-wrap02 .cv01{
    padding: 0 10px;
    margin: 30px auto 0;
    max-width: 340px;
  }
  .flex-wrap02 .copy01 img{
    width: 268px;
  }
  .flex-wrap02 .button01 {
    min-height: 60px;
    font-size: 2.4rem;
  }
  .flex-wrap02 .button02 {
    min-height: 50px;
    font-size: 1.8rem;
  }
  /*-----------------------
  flex-menu01
  ------------------------*/
  .flex-menu01{
    margin: 48px auto 0;
    max-width: 216px;
  }
  .flex-menu01>li{
    position: relative;
    margin: 34px 0 0;
    padding:  0 0 0 72px;
  }
  .flex-menu01>li a{
    color: #fff;
    text-decoration: none;
    font-size: 1.6rem;
    font-weight: bold;
  }
  .flex-menu01>li.-active a{
    color: #CAFF1D;
  }
  .flex-menu01>li.-active::before{
    display: block;
    content: '';
    position: absolute;
    left: 0;
    top: -0.8em;
    width: 42px;
    height: 50px;
    background: url(/kojin/olive/special/campaign/collab/dandadan202510/imgs/index_ico_07.png) no-repeat 0 0 / 100%;
  }
  /*-----------------------
  text-wrap03
  ------------------------*/
  .text-wrap03{
    font-size: 1.8rem;
  }
  /*-----------------------
  bg-area04
  ------------------------*/
  .bg-area04::before{
    left: calc(50% - 250px);
    width: 500px;
  }
  /*-----------------------
  bg-area05after
  ------------------------*/
  .bg-area05after {
    margin: -204px 0 0;
  }
  /*-----------------------
  ttl-img03
  ------------------------*/
  .ttl-img03{
    margin: -131px 0 0;
  }
  .ttl-img03>img{
    width: 300px;
  }
  /*-----------------------
  table-layout02
  ------------------------*/
  .table-layout02{
    margin: 32px 0 0;
    font-size: 1.6rem;
  }
  /*-----------------------
  img-wrap03
  ------------------------*/
  .img-wrap03{
    min-height: 970px;
  }
  /*-----------------------
  modal bg
  ------------------------*/
  body[style="padding-right: 15px;"] .bg-wrap02::before {
    left: calc(50% - 250px - 7.5px);
  }
  /*-----------------------
  img-layout01
  ------------------------*/
  .img-layout01::after{
    bottom: -50px;
    height: 52px;
  }
  /*-----------------------
  img-wrap01
  ------------------------*/
  .img-wrap01{
    margin: 0 -16px;
    padding: 0 16px;
  }
  /*-----------------------
  scroll01
  ------------------------*/
  .scroll01{
    top: 360px;
  }
}

@media screen and (max-height: 900px) {
  .flex-wrap02>.inner>*:not(.cv01){
    display: none;
  }
  .flex-wrap02>.inner>.cv01{
    margin-top: 0;
  }
}