/*  */
* .m-collist-ico2 > li:before {
  background: #333;
  width: 14px;
  height: 14px;
  top: .3em;
  left: -1px;
}

.accordion-btn:hover {
  cursor: pointer;
}

.registration-btn {
  max-width: 390px;
  margin: auto;
}

.btn:hover {
  opacity: .7;
}

.u-border-bottom {
  border-bottom: 1px solid #333;
}

.main-content {
  background-color: #f00000;
    background-image:
      url(/kouza/lp/youtube_cp_202607/imgs/kv_bg_01.png),
      radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px),
      radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px);
    background-repeat:
      no-repeat,
      repeat,
      repeat;
    background-position:
      top center,
      0 0,
      7px 7px;
    background-size:
      auto,
      14px 14px,
      14px 14px;
  background-attachment: fixed;
}
@media screen and (max-width: 48em) {
  * .m-collist-ico2 > li:before {
    width: 10px;
    height: 10px;
    top: .4em;
    left: 2px;
  }

  .main-content {
    background: none;
  }

  .u-fz-sp-xs {
    font-size: 1.2rem;
  }
}

/* kv-block */
.kv-block {
  padding: 63px 10px 30px;
}

.kv-block .block-ttl {
  max-width: 440px;
  margin: 0 auto 71px;
}

.kv-btn {
  max-width: 395px;
  margin: 0 auto 30px;
}

.kv-txt {
  max-width: 370px;
  margin: auto;
}
@media screen and (max-width: 48em) {
  .kv-block {
    padding-top: 100px;
    background-color: #f00000;
    background-image:
      url(/kouza/lp/youtube_cp_202607/imgs/kv_bg_01_sp.png),
      radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px),
      radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px);
    background-repeat:
      no-repeat,
      repeat,
      repeat;
    background-position:
      top,
      0 0,
      7px 7px;
    background-size:
      auto 90%,
      14px 14px,
      14px 14px;
    padding-left: 40px;
    padding-right: 40px;
  }

  .kv-block .block-ttl {
    max-width: 400px;
    margin-bottom: 37px;
  }

  .kv-btn {
    max-width: 295px;
    margin-bottom: 32px;
  }

  .kv-txt {
    max-width: 400px;
    padding: 0 30px;
  }
}


/* privilege-block */
.privilege-block {
  background-color: #f00000;
  background-image:
    radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px),
    radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px);
  background-size: 14px 14px;
  background-position:
    0 0,
    7px 7px;
  max-width: 500px;
  margin: auto;
}

.privilege-block .block-inner {
  padding: 98px 23px 43px;
  position: relative;
}

.privilege-block .block-ttl {
  max-width: 290px;
  margin: auto;
  position: absolute;
  top: 37px;
  left: 0;
  right: 0;
}

.privilege-box {
  background: #fff;
  padding: 86px 15px 29px;
  border-radius: 20px;
}

.block-sub-ttl .sub-ttl-img01 {
  max-width: 344px;
  margin: 0 auto 272px;
}
.block-sub-ttl .sub-ttl-img02 {
  position: absolute;
  max-width: 455px;
  width: 100%;
  top: 318px;
  right: 11px;
  left: 0;
  margin: auto;
}
.block-sub-ttl .sub-ttl-img03 {
  max-width: 285px;
  margin: 0 auto 50px;
}

.sub-ttl-img02 {
  opacity: 0;
  transform: scale(.7);
}
.sub-ttl-img02.is-show {
  animation: popup .6s cubic-bezier(.18,1.35,.4,1) forwards;
}

@keyframes popup {
  0% {
    opacity: 0;
    transform: scale(.7);
  }
  70% {
    opacity: 1;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.youtube-premium .description-ttl {
  max-width: 362px;
  margin: 0 auto 12px;
  position: relative;
  padding: 6px 46px 4px;
  text-align: center;
  font-size: 2rem;
}

.youtube-premium .description-ttl::before,
.youtube-premium .description-ttl::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 3px;
  height: 34px;
  background: #333;
}
.youtube-premium .description-ttl::before {
  left: 25px;
  transform: rotate(-28deg);
}
.youtube-premium .description-ttl::after {
  right: 25px;
  transform: rotate(28deg);
}

.youtube-premium .description-img {
  margin-bottom: 18px;
}

.privilege-block .registration-btn {
  max-width: 390px;
  margin-bottom: 31px;
}
@media screen and (max-width: 48em) {
  .privilege-block {
    max-width: 100%;
  }

  .privilege-block .block-inner {
    padding: 60px 17px 32px;
  }

  .privilege-block .block-ttl {
    max-width: 218px;
    top: 11px;
  }

  .privilege-box {
    padding: 65px 7px 20px;
  }

  .block-sub-ttl .sub-ttl-img01 {
    max-width: 264px;
    margin: 0 auto 200px;
  }
  .block-sub-ttl .sub-ttl-img02 {
    max-width: 339px;
    top: 228px;
  }
  .block-sub-ttl .sub-ttl-img03 {
    max-width: 220px;
    margin-bottom: 35px;
  }

  .youtube-premium .description-ttl {
    font-size: 1.8rem;
  }
  .youtube-premium .description-ttl::before,
  .youtube-premium .description-ttl::after {
    height: 30px;
  }
  .youtube-premium .description-ttl::before {
    left: 6.66vw;
  }
  .youtube-premium .description-ttl::after {
    right: 6.66vw;
  }

  .youtube-premium .description-img {
    max-width: 360px;
    margin: 0 auto 14px;
  }

  .privilege-block .registration-btn {
    max-width: 292px;
    margin-bottom: 22px;
  }

  .privilege-note {
    max-width: 350px;
    margin: auto;
  }
}


/* registration-block */
.registration-block {
  background-color: #f00000;
  background-image:
    radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px),
    radial-gradient(circle, rgba(180, 0, 0, .45) 2px, transparent 2px);
  background-size: 14px 14px;
  background-position:
    0 0,
    7px 7px;
  max-width: 500px;
  margin: auto;
  padding: 0 30px 55px;
}

.registration-block .block-inner {
  background: #fff;
  margin-bottom: 45px;
}

.registration-block .block-ttl {
  max-width: 273px;
  margin: auto;
  padding: 14px 0;
}

.accordion-btn {
  position: relative;
}

.accordion-btn-icn {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 18px;
  color: transparent;
  font-size: 0;
  width: 20px;
  height: 20px;
  margin: auto;
  background: url(/kouza/lp/youtube_cp_202607/imgs/acc_icn_01.png) no-repeat center;
  background-size: contain;
}
.m-accordion.is-show .accordion-btn-icn {
  transform: rotate(180deg);
}

.registration-block .m-accordion_body {
  border: none;
  border-top: 1px solid #d4d4d4;
  padding-top: 30px;
}

.registration-block .registration-btn {
  margin-bottom: 20px;
}

.registration-txt-01 {
  max-width: 312px;
  margin: 22px auto 12px;
}

.gift-note {
  background: #fff;
  padding: 3px;
  border-radius: 10px;
}

.note-head {
  background: #f00000;
  border-radius: 10px 10px 0 0;
  padding: 20px 15px 20px 20px;
}

.note-ttl {
  max-width: 360px;
  margin: auto;
}

.note-body {
  padding: 20px 39px 30px 30px;
}

.note-txt-01 {
  margin-bottom: 5px;
}

.registration-block .gift-note .registration-btn {
  max-width: 310px;
  margin-bottom: 10px;
}
@media screen and (max-width: 48em) {
  .registration-block {
    max-width: 100%;
    padding: 0 20px 42px;
  }

  .registration-block .block-inner {
    margin-bottom: 31px;
  }

  .registration-block .block-ttl {
    max-width: 203px;
    padding: 12px 0;
  }

  .accordion-btn-icn {
    right: 15px;
  }

  .registration-block .m-accordion_body {
    padding: 20px 15px;
  }

  .registration-block .m-accordion_item {
    max-width: 360px;
    margin: auto;
  }

  .registration-txt-01 {
    max-width: 230px;
    margin: 16px auto 12px;
  }

  .registration-block .registration-btn{
    max-width: 292px;
    margin: 0 auto 20px;
  }

  .gift-note {
    padding: 3px;
  }

  .note-head {
    padding: 18px 15px 14px 20px;
  }

  .note-ttl {
    max-width: 280px;
  }

  .note-body {
    padding: 17px 32px 10px 25px;
  }

  .note-txt-01 {
    max-width: 360px;
    margin: 0 auto 5px;
  }

  .note-txt-02 {
    max-width: 360px;
    margin: 0 auto;
  }

  .registration-block .gift-note .registration-btn {
    max-width: 240px;
  }
}



/* flow-block */
.flow-block {
  max-width: 500px;
  margin: auto;
  background: #fff;
  padding: 50px 25px;
  background: #ffe6ff;
}

.flow-block .block-ttl {
  max-width: 320px;
  margin: 0 auto 33px;
  transform: translateX(-17px);
}

.flow-img {
  position: relative;
}
.flow-img + .flow-img {
  margin-top: 41px;
}

.flow-img .kouza-btn {
  position: absolute;
  bottom: 59px;
  right: 0;
  left: 0;
  margin: auto;
  max-width: 391px;
}
.flow-img .entry-btn {
  position: absolute;
  bottom: 53px;
  right: 0;
  left: 0;
  margin: auto;
  max-width: 391px;
}

.flow-txt {
  margin-top: 25px;
  padding: 0 19px 0 5px;
}
@media screen and (max-width: 48em) {
  .flow-block {
    max-width: 100%;
    padding: 38px 19px;
  }

  .flow-block .block-ttl {
    max-width: 240px;
    margin: 0 auto 25px;
    transform: translateX(-12px);
  }
  
  .flow-img {
    max-width: 450px;
    margin: auto;
  }
  .flow-img + .flow-img {
    margin-top: 30px;
  }

  .flow-img .kouza-btn {
    bottom: 46px;
    max-width: 293px;
  }
  .flow-img .entry-btn {
    bottom: 41px;
    max-width: 292px;
  }

  .flow-txt {
    margin-top: 19px;
    padding-top: 15px;
  }
}


/* detail-block */
.detail-block {
  background-color: #fff;
  background-image:
    linear-gradient(
      to bottom,
      transparent 0%,
      #fff 15%,
      #fff 100%
    ),
    radial-gradient(circle, #f2b1e6 3px, transparent 3px),
    radial-gradient(circle, #f2b1e6 3px, transparent 3px);
  background-size:
    100% 100%,
    20px 20px,
    20px 20px;
  background-position:
    0 0,
    0 0,
    10px 10px;
  max-width: 500px;
  margin: auto;
  padding: 80px 30px 55px;
}

.detail-block .block-ttl {
  max-width: 370px;
  margin: 0 auto 28px;
}

.detail-block .accordion-btn {
  background: #ffd4e9;
  border-top: solid 2px #e60000;
}

.detail-block .block-sub-ttl {
  text-align: center;
  padding: 15px 0;
  font-size: 1.9rem;
}

.detail-block .m-accordion_body {
  border-color: #e00000;
  border-width: 2px;
  background: #fff;
  padding: 35px 30px 10px;
}

.detail-list {
  margin: 0;
}

.detail-item + .detail-item {
  margin-top: 26px;
}

.detail-ttl {
  margin-bottom: 11px;
  padding: 5px 20px;
  border-radius: 20px;
  background: #ffeaff;
  color: #d13015;
  font-size: 1.8rem;
  font-weight: 700;
  text-align: center;
}

.detail-desc {
  padding: 0 10px;
  font-size: 1.5rem;
}

.privacy-box {
  margin: 58px auto 0;
  border: 2px solid #f00000;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

.privacy-box-ttl {
  margin: 0;
  padding: 18px 20px;
  border-bottom: 2px solid #f00000;
  font-size: 2rem;
  text-align: center;
}

.privacy-box-body {
  padding: 28px 29px;
}
@media screen and (max-width: 48em) {
  .detail-block {
    max-width: 100%;
    padding: 43px 20px 47px;
  }

  .detail-block .block-ttl {
    max-width: 276px;
    margin-bottom: 23px;
  }

  .detail-block .block-sub-ttl {

    padding: 10px 0;
    font-size: 1.5rem;
  }

  .detail-block .m-accordion_body {
    padding: 30px 25px 10px;
  }


  .detail-item + .detail-item {
    margin-top: 26px;
  }

  .detail-ttl {
    margin-bottom: 7px;
    padding: 2px 20px;
    font-size: 1.5rem;
  }

  .detail-desc {
    padding: 0 10px;
    font-size: 1.2rem;
  }

  .privacy-box {
    margin: 44px auto 0;
    border-radius: 10px;
  }

  .privacy-box-ttl {
    padding: 13px 20px;
    font-size: 1.5rem;
  }

  .privacy-box-body {
    padding: 18px 18px;
  }
}


/* faq-block */
.faq-block {
  background: #ffe6ff;
  max-width: 500px;
  margin: auto;
  padding: 66px 20px 48px;
}

.faq-block .block-ttl {
  max-width: 330px;
  margin: 0 auto 32px;
}

.faq-list {
  background: #fff;
  border-radius: 20px;
  padding: 20px 15px;
  font-size: 1.4rem;
}

.faq-block .m-accordion_btn {
  background: #fff;
  border: none;
  font-weight: bold;
  padding: 7px 46px 7px 0;
  position: relative;
}

.faq-block .m-accordion_body {
  border: none;
  padding: 0;
}

.faq-block .m-accordion_btn,
.faq-block .m-accordion_body {
  display: flex;
  align-items: center;
  gap: 13px;
}
.faq-block .m-accordion_body {
  align-items: flex-start;
  margin-top: 13px;
  padding-bottom: 20px;
  margin-bottom: 12px;
  border-bottom: solid 1px #ccc;
}
.faq-block .m-accordion:last-of-type .m-accordion_body {
  border: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.faq-block .m-accordion_btn::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -6px;
  width: 18px;
  height: 2px;
  background: #e60000;
  margin: auto;
}

.faq-block .m-accordion_btn::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2px;
  width: 2px;
  height: 18px;
  background: #e60000;
  margin: auto;
}

.m-accordion.is-show .m-accordion_btn::after {
  opacity: 0;
}

.question-icn {
  color: #e60000;
  font-size: 2rem;
}

.answer-icn {
  color: #f75a00;
  font-size: 2rem;
  font-weight: bold;
}
@media screen and (max-width: 48em) {
  .faq-block {
    max-width: 100%;
    padding: 50px 13px 38px;
  }

  .faq-block .block-ttl {
    max-width: 246px;
    margin: 0 auto 24px;
  }

  .faq-list {
    padding: 10px 15px;
    font-size: 1.2rem;
  }

  .faq-block .m-accordion_btn {
    padding: 7px 46px 7px 0;
  }

  .faq-block .m-accordion_btn,
  .faq-block .m-accordion_body {
    gap: 5px;
  }
  .faq-block .m-accordion_body {
    margin-top: 13px;
    padding-bottom: 20px;
    margin-bottom: 12px;
  }

  .faq-block .m-accordion_btn::before {
    right: -6px;
    width: 12px;
  }

  .faq-block .m-accordion_btn::after {
    right: -1px;
    height: 12px;
  }

  .question-icn {
    font-size: 1.6rem;
  }

  .answer-icn {
    font-size: 1.6rem;
    line-height: 1;
  }
}


/* contact-block */
.contact-block {
  background: #fff;
  padding: 50px 30px;
  max-width: 500px;
  margin: auto;
}

.contact-block .block-ttl {
  color: #fff;
  text-align: center;
  font-size: 2.4rem;
  padding: 10px;
  background: #e00000;
}

.contact-box {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 35px 0;
  border: solid 2px #e00000;
  border-top: none;
  font-size: 1.4rem;
}
@media screen and (max-width: 48em) {
  .contact-block {
    max-width: 100%;
    padding: 36px 22px;
  }

  .contact-block .block-ttl {
    font-size: 1.9rem;
    padding: 7px;
  }

  .contact-box {
    padding: 25px 0;
    font-size: 1.2rem;
  }
}


/* fixed-cta */
.fixed-cv {
  background: #fff;
  margin: auto;
  padding: 10px;
  display: none;
}
.fixed-cv.is-fixed {
  display: block;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
}

.fixed-cv-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

.fixed-cv .kouza-btn,
.fixed-cv .entry-btn {
  max-width: 360px;
}
@media screen and (max-width: 48em) {
  .fixed-cv-inner {
    gap: 10px;
  }

  .fixed-cv .kouza-btn,
  .fixed-cv .entry-btn {
    max-width: 250px;
  }
}


/* popup-modal */
canvas {
  max-width: 100%;
  vertical-align: bottom;
}

.qr-wrap {
  width: 145px;
  height: 145px;
  padding: 5px;
  margin: 8px auto 0;
  background: #fff;
}

.qr-popup-block {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  inset: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  background: rgb(0 0 0 / 70%);
  z-index: 1001;
  transition: .4s ease-in-out;
}

.qr-popup-block.is-show {
  opacity: 1;
  visibility: visible;
  transition: .4s ease-in-out;
}

.qr-popup-block .m-modal_html {
  position: relative;
}

.qr-popup-block .m-modal_close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border: 1px solid #333;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  color: transparent;
  font-size: 0;
}
.qr-popup-block .m-modal_close::before,
.qr-popup-block .m-modal_close::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 25px;
  height: 1px;
  background: #333;
}
.qr-popup-block .m-modal_close::before {
  transform: rotate(45deg);
}

.qr-popup-block .m-modal_close::after {
  transform: rotate(-45deg);
}

.qr-popup-block .m-modal_htmlinner {
  padding: 0;
}

.modal-body {
  padding-bottom: 20px;
}

.modal-sub-ttl {
  max-width: 390px;
  margin: 20px auto;
}

.modal-txt {
  max-width: 400px;
  margin: 20px auto 0;
}

.modal-btn {
  max-width: 390px;
  margin: auto;
  padding: 30px;
}
@media screen and (max-width: 48em) {
  .qr-popup-block .m-modal_close {
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
  }

  .qr-popup-block .m-modal_close::before,
  .qr-popup-block .m-modal_close::after {
    width: 20px;
  }
}

/* entry-modal */
.qr-img {
  max-width: 200px;
  margin: 20px auto;
}

.modal-note {
  background: #ffe3eb;
  border-radius: 10px;
  padding: 20px;
  max-width: 95%;
  margin: auto;
  font-size: 1.4rem;
}