@-webkit-keyframes shimmer-effect {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@keyframes shimmer-effect {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
body.illust2611 {
  position: relative;
  height: auto;
  min-width: 0;
  padding-top: 0;
  min-height: 3000px;
  font-size: 1.6rem;
  color: #333;
}

.l-local-header {
  position: relative;
  z-index: 10;
  height: 50px;
  box-shadow: 0 5px 10px -5px rgba(56%, 65.3333333333%, 70%, 0.5);
  background: #fff;
}
.l-local-header .local-logo-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.l-local-header .local-logo {
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  display: block;
  width: 166px;
  height: 32px;
  background: url(/assets/styles/img/common/logo_01.svg) no-repeat 0 0;
  background-size: contain;
  -webkit-transition: opacity 0.15s ease-out;
  transition: opacity 0.15s ease-out;
}
.l-local-header .local-logo:hover {
  opacity: 0.7;
}
.l-local-header .share-links {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
}
.l-local-header .share-link {
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  position: relative;
  width: 30px;
  height: 30px;
  border-radius: 3px;
  -webkit-transition: opacity 0.15s ease-out;
  transition: opacity 0.15s ease-out;
}
.l-local-header .share-link:hover {
  opacity: 0.7;
}
.l-local-header .share-link::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  content: "";
}
.l-local-header .share-link.is-x {
  background: #000;
}
.l-local-header .share-link.is-x::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
  background-size: 16px 16px;
}
.l-local-header .share-link.is-pommu {
  background: #3fa9f5;
}
.l-local-header .share-link.is-pommu::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 21'%3E%3Cpath fill='%23fff' d='M18.3759 8.79136C18.293 8.02548 17.9583 7.28826 17.4341 6.72329C17.2962 6.57531 17.0421 6.41249 17.1762 6.18192C18.9264 3.25561 16.4056 -0.453438 13.0468 0.0454613C11.9263 0.203221 10.9437 0.796843 10.2739 1.7252C10.0652 2.01915 9.84276 2.30972 9.61994 2.58041C8.38651 4.05351 7.06342 5.09782 5.40188 6.21462C4.0707 7.12949 2.74929 7.79795 1.54957 8.96867C-1.87395 12.3966 0.773247 18.4201 5.60684 18.2428C6.01843 18.2293 6.42665 18.1727 6.81801 18.0769C6.97577 18.0382 7.13286 18.1555 7.14601 18.3173C7.17162 18.6294 7.18443 18.9349 7.18443 19.2312C7.16219 20.1123 7.92301 20.8971 8.80013 20.8758C9.23936 20.8758 9.66679 20.6948 9.97928 20.357C10.7381 19.5379 11.4055 18.6352 11.9675 17.6674C12.0062 17.6006 12.073 17.5534 12.1492 17.5389C12.9892 17.3768 13.7739 17.1988 14.5408 16.9959C15.2083 16.8412 15.8949 16.5658 16.3426 16.0985C17.3535 15.1537 17.6377 13.5225 17.0232 12.2843C16.9595 12.1559 17.0299 12.0167 17.1365 11.9331C18.0244 11.1685 18.5391 9.89399 18.3759 8.79204V8.79136ZM14.9605 11.7628C14.4043 12.0153 13.7278 12.2284 12.8658 12.4343C12.1576 12.6015 12.2476 13.5899 12.9605 13.6081C13.8889 13.4385 14.7579 13.1419 15.4867 12.8166C15.6296 12.7502 15.7972 12.8156 15.8555 12.9615C16.2533 13.9543 15.8225 15.2521 14.5793 15.5841C13.4942 15.8943 12.3888 16.1296 11.2784 16.3284C11.1979 16.3426 11.1294 16.3935 11.0914 16.466C10.5132 17.5676 9.80399 18.5624 8.99058 19.4402C8.82709 19.6168 8.53281 19.5022 8.53348 19.2615C8.53483 18.6241 8.48494 17.9917 8.39662 17.366C8.38314 17.2696 8.42359 17.1759 8.50112 17.1172C9.91591 16.0729 10.518 14.0558 9.89467 12.407C9.32498 10.616 7.14668 9.65196 5.45986 10.4593C4.1098 11.0617 3.52461 12.6811 4.20351 14.015C4.67882 14.9909 5.96753 15.4031 6.91375 14.9524C7.28287 14.7876 7.3995 14.2907 7.06881 13.9711C6.6707 13.5885 6.18967 14.1299 5.73156 13.8936C5.50301 13.806 5.32199 13.6347 5.22221 13.4106C4.45296 11.0991 7.92166 10.6383 8.69933 12.5938C9.66005 14.8284 7.87076 16.9059 5.56268 16.8944C1.97431 17.0144 -0.0900498 12.5452 2.51231 9.91253C3.58394 8.87429 4.92961 8.17718 6.15158 7.33512C8.13639 6.0218 10.0019 4.46813 11.3738 2.50557C13.6694 -0.427481 17.9765 2.7557 15.8157 5.82156C14.9201 7.05061 13.3843 8.1256 11.42 8.8844C11.1493 8.9889 10.9649 9.26498 11.0182 9.5505C11.0876 9.92737 11.4773 10.1279 11.8107 9.99816C13.48 9.35768 14.883 8.49404 15.9158 7.49018C16.4016 7.09342 17.0424 8.51191 17.0363 8.9353C17.2025 10.3248 16.0867 11.2265 14.9612 11.7622L14.9605 11.7628Z'/%3E%3C/svg%3E");
  background-size: 15px 17px;
}

.local-header-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 960px;
  height: 100%;
  margin: 0 auto;
  padding: 0 10px;
}

.cp-header {
  position: relative;
  overflow: hidden;
  height: 0;
  padding-top: 95%;
  background: #fff;
}
@media screen and (min-width: 769px) {
  .cp-header {
    padding-top: 700px;
  }
}

.cp-header-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 120%;
  background: url(/assets/styles/img/static/campaign/illust1912/bg_01.jpg) no-repeat center center;
  background-size: cover;
  -webkit-animation: fadeIn 0.6s ease 3s both;
          animation: fadeIn 0.6s ease 3s both;
}

.cp-logo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: -6.8%;
  bottom: 0;
  margin: auto;
  left: 0;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .cp-logo {
    top: 0.8%;
    margin-top: 0;
  }
}
.cp-logo::before {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 600px;
  height: 350px;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background: url(/assets/styles/img/static/campaign/illust1912/bg_02.png) no-repeat center center;
  background-size: cover;
  -webkit-animation: fadeIn 0.6s ease 4s both;
          animation: fadeIn 0.6s ease 4s both;
  content: "";
}
@media screen and (min-width: 769px) {
  .cp-logo::before {
    width: 1200px;
    height: 700px;
  }
}
.cp-logo > * {
  position: absolute;
  top: 0;
}
.cp-logo .pc {
  display: none;
  max-width: 100%;
  right: 0;
  left: 0;
  margin: auto;
}
.cp-logo .sp {
  display: block;
  width: 125%;
}
@media screen and (min-width: 769px) {
  .cp-logo .pc {
    display: block;
  }
  .cp-logo .sp {
    display: none;
  }
}

.logo-01 {
  -webkit-animation: fadeIn 0.6s ease 3s both;
          animation: fadeIn 0.6s ease 3s both;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.logo-02.pc {
  -webkit-animation: logoSlideIn 0.6s ease 3.6s both;
          animation: logoSlideIn 0.6s ease 3.6s both;
}

@-webkit-keyframes logoSlideIn {
  0% {
    -webkit-transform: translateY(-300px);
            transform: translateY(-300px);
    opacity: 0;
  }
  40% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  70% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
  90% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  95% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes logoSlideIn {
  0% {
    -webkit-transform: translateY(-300px);
            transform: translateY(-300px);
    opacity: 0;
  }
  40% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
  }
  70% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  80% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
  }
  90% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  95% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.logo-02.sp {
  -webkit-animation: logoScaleIn 0.3s ease 3.6s both;
          animation: logoScaleIn 0.3s ease 3.6s both;
}

@-webkit-keyframes logoScaleIn {
  0% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
    opacity: 0;
  }
  40% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 1;
  }
  70% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes logoScaleIn {
  0% {
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
    opacity: 0;
  }
  40% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    opacity: 1;
  }
  70% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.logo-03 {
  -webkit-animation: logoPopIn 0.6s ease 4s both;
          animation: logoPopIn 0.6s ease 4s both;
  -webkit-transform-origin: 30% 60%;
      -ms-transform-origin: 30% 60%;
          transform-origin: 30% 60%;
}

@-webkit-keyframes logoPopIn {
  0% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0;
  }
  40% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  70% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  80% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
  }
  90% {
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes logoPopIn {
  0% {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    opacity: 0;
  }
  40% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  70% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  80% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
  }
  90% {
    -webkit-transform: scale(1.02);
            transform: scale(1.02);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.logo-04 {
  opacity: 0;
  -webkit-animation: logoBgFade 0.3s ease 4.2s both;
          animation: logoBgFade 0.3s ease 4.2s both;
  -webkit-transform: translate(-8px, -8px);
      -ms-transform: translate(-8px, -8px);
          transform: translate(-8px, -8px);
}

@-webkit-keyframes logoBgFade {
  0% {
    opacity: 0;
    -webkit-transform: translate(-8px, -8px);
            transform: translate(-8px, -8px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
}

@keyframes logoBgFade {
  0% {
    opacity: 0;
    -webkit-transform: translate(-8px, -8px);
            transform: translate(-8px, -8px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
}
#athena-stroke {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -3.6%;
  margin: auto;
  width: 63.5% !important;
  height: auto;
  -webkit-animation: fadeOut 0.6s ease 3s forwards;
          animation: fadeOut 0.6s ease 3s forwards;
}
@media screen and (min-width: 769px) {
  #athena-stroke {
    top: 2%;
    margin-top: 0;
    right: -20px;
    width: 494px !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 971px) {
  #athena-stroke {
    width: 51% !important;
  }
}
#athena-stroke path {
  stroke: #333;
  fill: #fff;
  fill-opacity: 0;
  stroke-width: 1;
  stroke-dasharray: 3000;
  stroke-dashoffset: 3000;
  -webkit-animation: strokeAnimation 6s ease-in 1s forwards;
          animation: strokeAnimation 6s ease-in 1s forwards;
}

@-webkit-keyframes strokeAnimation {
  0% {
    stroke-dashoffset: 3000;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes strokeAnimation {
  0% {
    stroke-dashoffset: 3000;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.cp-section {
  padding: 100px 0;
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 769px) {
  .cp-section {
    padding: 150px 0;
  }
}

.cp-section-inner {
  position: relative;
  z-index: 2;
  padding: 0 15px;
}
@media screen and (min-width: 769px) {
  .cp-section-inner {
    width: 1024px;
    margin: 0 auto;
  }
}
@media screen and (min-width: 769px) and (max-width: 971px) {
  .cp-section-inner {
    width: 100%;
  }
}

.cp-section-bg-01 {
  position: absolute;
  top: -1000px;
  bottom: -1000px;
  left: 0;
  width: 100%;
}

.cp-section.type-01 .cp-section-bg-01 {
  background-color: #ffe0e0;
  background-image: -webkit-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}

.cp-section.type-02 .cp-section-bg-01 {
  background-color: #d5f1cd;
  background-image: -webkit-repeating-linear-gradient(135deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}

.cp-section.type-03 .cp-section-bg-01 {
  background-color: #d5f0fb;
  background-image: -webkit-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}

.cp-section.type-04 .cp-section-bg-01 {
  background-color: #ffe9dc;
  background-image: -webkit-repeating-linear-gradient(135deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}

.cp-section.type-05 .cp-section-bg-01 {
  background-color: #eeddfb;
  background-image: -webkit-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}

.cp-section-bg-02 {
  display: block;
  opacity: 0.5;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}
@media screen and (min-width: 769px) {
  .cp-section-bg-02 {
    opacity: 1;
  }
}
@media screen and (min-width: 769px) and (max-width: 971px) {
  .cp-section-bg-02 {
    opacity: 0.5;
  }
}

.cp-section.type-01 .cp-section-bg-02 {
  background: url(/assets/styles/img/static/campaign/illust1912/bg_03.png) no-repeat center center;
  background-size: 120% auto;
}

.cp-section.type-02 .cp-section-bg-02 {
  background: url(/assets/styles/img/static/campaign/illust1912/bg_04.png) no-repeat center center;
  background-size: 120% auto;
}

.cp-section.type-03 .cp-section-bg-02 {
  background: url(/assets/styles/img/static/campaign/illust1912/bg_05.png) no-repeat center center;
  background-size: 120% auto;
}

.cp-section.type-04 .cp-section-bg-02 {
  background: url(/assets/styles/img/static/campaign/illust1912/bg_06.png) no-repeat center center;
  background-size: 120% auto;
}

.cp-section.type-05 .cp-section-bg-02 {
  background: url(/assets/styles/img/static/campaign/illust1912/bg_07.png) no-repeat center center;
  background-size: 120% auto;
}

@media screen and (min-width: 769px) {
  .cp-section.type-01 .cp-section-bg-02 {
    background-size: auto auto;
    background-position: right 2% center;
  }
  .cp-section.type-02 .cp-section-bg-02 {
    background-size: auto auto;
    background-position: left 2% center;
  }
  .cp-section.type-03 .cp-section-bg-02 {
    background-size: auto auto;
    background-position: right 2% center;
  }
  .cp-section.type-04 .cp-section-bg-02 {
    background-size: auto auto;
    background-position: left 2% center;
  }
  .cp-section.type-05 .cp-section-bg-02 {
    background-size: auto auto;
    background-position: right 2% center;
  }
}
.cp-title {
  margin-bottom: 50px;
  text-align: center;
}
@media screen and (min-width: 769px) {
  .cp-title {
    margin-bottom: 100px;
  }
}
.cp-title img {
  max-width: 100%;
}
@media screen and (min-width: 769px) {
  .cp-title img {
    height: 90px;
  }
}

.cp-lead {
  font-size: 1.8rem;
  line-height: 1.6;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
}
@media screen and (min-width: 769px) {
  .cp-lead {
    font-size: 2.4rem;
    line-height: 1.8;
  }
}
.cp-lead br {
  display: none;
}
.cp-lead br.valid {
  display: block;
}
@media screen and (min-width: 769px) {
  .cp-lead br {
    display: block;
  }
}
.cp-lead ~ .cp-lead {
  margin-top: 50px;
}
.cp-lead strong {
  font-size: 1.2em;
}
@media screen and (min-width: 769px) {
  .cp-lead.center {
    text-align: center;
  }
}

.cp-prize {
  max-width: 100%;
}
@media screen and (min-width: 769px) {
  .cp-prize {
    max-width: 70%;
  }
}

.illust-sample {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 50px;
}
.illust-sample > li {
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  background: #fff;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  width: calc((100% - 10px) / 2);
}
@media screen and (max-width: 768px) {
  .illust-sample > li:not(:nth-child(-n+2)) {
    margin-top: 10px;
  }
  .illust-sample > li:not(:nth-child(2n-1)) {
    margin-left: 10px;
  }
  .illust-sample > li:nth-child(2n) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
}
@media screen and (min-width: 769px) {
  .illust-sample > li {
    width: calc((100% - 60px) / 4);
  }
  .illust-sample > li:not(:nth-child(-n+4)) {
    margin-top: 20px;
  }
  .illust-sample > li:not(:nth-child(4n-3)) {
    margin-left: 20px;
  }
  .illust-sample > li:nth-child(4n-2) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
  .illust-sample > li:nth-child(4n-1) {
    -webkit-transition-delay: 0.6s;
            transition-delay: 0.6s;
  }
  .illust-sample > li:nth-child(4n) {
    -webkit-transition-delay: 0.9s;
            transition-delay: 0.9s;
  }
}
.illust-sample > li:hover {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
.illust-sample > li img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  vertical-align: bottom;
}

.cp-flow > li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.cp-flow > li:not(:first-child) {
  margin-top: 30px;
}
@media screen and (min-width: 769px) {
  .cp-flow > li:not(:first-child) {
    margin-top: 50px;
  }
}
.cp-flow > li:not(:first-child)::before {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 15px 0 15px;
  border-color: #32bef3 transparent transparent transparent;
  margin: 0 auto 30px;
  content: "";
}
@media screen and (min-width: 769px) {
  .cp-flow > li:not(:first-child)::before {
    margin: 0 auto 50px;
  }
}

.cp-flow-step {
  font-size: 2rem;
  margin: 0 auto 20px;
  padding: 10px 50px;
  border-radius: 40px;
  display: inline-block;
  background: #32bef3;
  color: #fff;
}
@media screen and (min-width: 769px) {
  .cp-flow-step {
    font-size: 2.6rem;
    margin: 0 auto 30px;
  }
}

.cp-tweet-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 2rem;
  position: relative;
  top: 0;
  width: 100%;
  height: 80px;
  box-shadow: 0 6px 0 #2a9cc7;
  margin: 30px auto 0;
  border-radius: 6px;
  background: #32bef3;
  color: #fff;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
}
@media screen and (min-width: 769px) {
  .cp-tweet-btn {
    width: 400px;
    height: 90px;
    font-size: 3rem;
    border-radius: 10px;
  }
}
.cp-tweet-btn:hover {
  top: 4px;
  box-shadow: 0 2px 0 #2a9cc7;
  text-decoration: none;
  color: #fff;
}

.btn-copy {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 2rem;
  position: relative;
  top: 0;
  width: 100%;
  padding: 20px 0;
  box-shadow: 0 6px 0 #2a9cc7;
  margin: 30px auto 0;
  border-radius: 6px;
  background: #32bef3;
  color: #fff;
  border: none;
  outline: none;
  -webkit-transition: all 0.15s ease;
  transition: all 0.15s ease;
}
@media screen and (min-width: 769px) {
  .btn-copy {
    width: 400px;
    padding: 26px 0;
    font-size: 2.6rem;
    border-radius: 10px;
  }
}
.btn-copy:hover {
  top: 4px;
  box-shadow: 0 2px 0 #2a9cc7;
  text-decoration: none;
  color: #fff;
}
.btn-copy:focus {
  outline: none;
}
.btn-copy i {
  position: relative;
  z-index: 10;
}

.copy-tooltip {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: -50px;
  left: 50%;
  -webkit-transform: translate(-50%, 20px);
      -ms-transform: translate(-50%, 20px);
          transform: translate(-50%, 20px);
  padding: 10px 30px;
  border-radius: 3px;
  background: rgba(50, 190, 243, 0.8);
  color: #fff;
  font-size: 1.4rem;
  white-space: nowrap;
  -webkit-transition: all 0.2s cubic-bezier(0.6, -0.28, 0.735, 0.045);
  transition: all 0.2s cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
.copy-tooltip.show {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  -webkit-transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
}

.cp-sub-heading {
  width: 100%;
  margin: 50px auto 0;
  padding: 0.4em 1.5em;
  border: 1px solid currentColor;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
}
@media screen and (min-width: 769px) {
  .cp-sub-heading {
    margin-top: 60px;
    font-size: 2.2rem;
  }
}
.cp-sub-heading:first-child {
  margin-top: 0;
}

.cp-period {
  text-align: center;
}
.cp-period .cp-sub-heading {
  width: auto;
  display: inline-block;
  margin-bottom: 0.8em;
}

@media screen and (max-width: 768px) {
  .cp-lead strong.cp-hashtags {
    font-size: 1em;
  }
}

.cp-pommu {
  width: 100%;
  margin-top: 30px;
  padding: 16px 20px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.6);
  text-align: center;
}
@media screen and (min-width: 769px) {
  .cp-pommu {
    width: 400px;
  }
}

.cp-pommu-banner {
  display: inline-block;
  -webkit-transition: opacity 0.15s ease-out;
  transition: opacity 0.15s ease-out;
}
.cp-pommu-banner:hover {
  opacity: 0.7;
}
.cp-pommu-banner img {
  display: block;
  max-width: 100%;
  height: auto;
}

.cp-pommu-note {
  margin-top: 0.5em;
  font-size: 1.4rem;
  line-height: 1.6;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
}
@media screen and (min-width: 769px) {
  .cp-pommu-note {
    font-size: 1.6rem;
  }
}

.cp-note {
  margin-top: 2em;
  font-size: 1.4rem;
  line-height: 1.6;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
}
@media screen and (min-width: 769px) {
  .cp-note {
    font-size: 1.6rem;
  }
}
.cp-note.center {
  text-align: center;
}

.cp-notice {
  padding-left: 20px;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
  font-size: 1.4rem;
  line-height: 1.6;
}
@media screen and (min-width: 769px) {
  .cp-notice {
    font-size: 1.6rem;
  }
}
.cp-notice:not(:first-child) {
  margin-top: 1em;
}
.cp-notice-item > .cp-notice {
  padding-left: 20px;
  margin-top: 0.6em;
}
@media screen and (min-width: 769px) {
  .cp-notice-item > .cp-notice {
    padding-left: 40px;
  }
}

.cp-notice-item {
  list-style: disc;
}
.cp-notice-item:not(:first-child) {
  margin-top: 0.6em;
}
ol .cp-notice-item {
  list-style: decimal;
}
ol ol .cp-notice-item {
  list-style: none;
  counter-increment: cp-notice-sub;
}
ol ol .cp-notice-item::before {
  content: "(" counter(cp-notice-sub) ") ";
}

ol.cp-notice {
  counter-reset: cp-notice-sub;
  padding-left: 2em;
}

.cp-footer {
  position: relative;
  z-index: 10;
}

.cp-result {
  position: relative;
  overflow: hidden;
  padding: 100px 0;
}
@media screen and (min-width: 769px) {
  .cp-result {
    padding: 200px 0;
  }
}
.cp-result .cp-section-bg-01 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 300%;
  background-color: #ffe883;
  background-image: -webkit-repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
  background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 35px, rgba(255, 255, 255, 0.2) 70px);
}
.cp-result > * {
  position: relative;
  z-index: 2;
}

.cp-result-title {
  height: 22vw;
  text-align: center;
  margin-bottom: 100px;
}
@media screen and (min-width: 769px) {
  .cp-result-title {
    height: 140px;
    margin-bottom: 150px;
  }
}

.cp-result-title img {
  opacity: 0;
  height: 100%;
  width: auto;
}

.cp-result-title.aos-animate {
  -webkit-transition: none !important;
  transition: none !important;
}

.cp-result-title.aos-animate img {
  -webkit-animation: scaleIn 0.3s ease both;
          animation: scaleIn 0.3s ease both;
}

.cp-result-title.aos-animate img:nth-child(2) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.cp-result-title.aos-animate img:nth-child(3) {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.cp-result-title.aos-animate img:nth-child(4) {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}

@-webkit-keyframes scaleIn {
  0% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    opacity: 0;
  }
  33% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    opacity: 1;
  }
  66% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

@keyframes scaleIn {
  0% {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    opacity: 0;
  }
  33% {
    -webkit-transform: scale(0.95);
            transform: scale(0.95);
    opacity: 1;
  }
  66% {
    -webkit-transform: scale(1.05);
            transform: scale(1.05);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
.result-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 20px;
}

.result-list.type-single {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 100px;
}

.result-list-item {
  width: calc((100% - 20px) / 2);
}
@media screen and (max-width: 768px) {
  .result-list-item:nth-child(2n) {
    margin-left: 20px;
  }
  .result-list-item:not(:nth-child(-n+2)) {
    margin-top: 40px;
  }
}
@media screen and (min-width: 769px) {
  .result-list-item {
    width: calc((100% - 60px) / 3);
  }
  .result-list-item:not(:nth-child(3n-2)) {
    margin-left: 30px;
  }
  .result-list-item:not(:nth-child(-n+3)) {
    margin-top: 60px;
  }
}
.result-list.type-single .result-list-item {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .result-list.type-single .result-list-item {
    width: 50%;
  }
}
.result-list.type-single .result-list-item img {
  max-height: none;
}
.result-list-item img {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .result-list-item img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}

@media screen and (max-width: 768px) {
  .result-list-item:nth-child(2n) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
}
@media screen and (min-width: 769px) {
  .result-list-item:nth-child(3n-1) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
  .result-list-item:nth-child(3n) {
    -webkit-transition-delay: 0.6s;
            transition-delay: 0.6s;
  }
}
.illust-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
  position: relative;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .illust-wrap {
    padding-top: 141%;
  }
}
@media screen and (min-width: 769px) {
  .illust-wrap {
    height: 434px;
  }
  .illust-wrap:hover {
    opacity: 0.9;
  }
}
.result-list.type-single .illust-wrap {
  height: auto;
}

.twitter-account {
  margin-top: 10px;
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.6;
  text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 6px #fff;
}
@media screen and (min-width: 769px) {
  .twitter-account {
    font-size: 2.4rem;
    line-height: 1.8;
  }
}

[data-aos*=flip] {
  opacity: 0;
  -webkit-transition-property: all !important;
  transition-property: all !important;
}
[data-aos*=flip].aos-animate {
  opacity: 1;
}