@charset "utf-8";

main {
    font-family: Noto Sans JP, Helvetica Neue, Arial, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, ヒラギノ角ゴシック, Hiragino Sans, Meiryo, メイリオ, sans serif;
    background: linear-gradient(180deg, #31459B 0.05%, #34314F 100%);
}

a:hover,
a:active,
a:link,
a:visited {
    text-decoration: none;
}

.cp-container__background {
    box-shadow: 0 4px 10px 0 rgba(0, 255, 200, 0.48);
    margin: 0 auto;
}

.cp-container__background--1 {
    background: linear-gradient(180deg, #3C4049 0.05%, #9BA2BB 16.38%);
}
.cp-container__background--2 {
    background: linear-gradient(180deg, #1F5DCF 0%, #4898D9 38.46%);
}
.cp-container__background--3 {
    background: linear-gradient(180deg, #0C9D57 0.05%, #78B588 16.38%);
}
.cp-container__background--4 {
    background: linear-gradient(180deg, #9E006A 0.05%, #E6A6D5 16.38%);
}

.cp-container {
    display: flex;
    justify-content: center;
}
.cp-kv {
    text-align: center;
}
.cp-kv img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* クーポン取得 */
.cp-get-coupon {
    width: 680px;
}
.cp-get-coupon-wrapper {
    margin-top: 3px;
}
.cp-get-coupon__image--register-text {
    color: #FFFFFF;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    margin-top: 66px;
    margin-bottom: 5px;
}
.cp-get-coupon__image--button {
    position: relative;
    width: 318px;
    margin: 0 auto;
}
.cp-get-coupon__image--button a {
    background: url("/resources/a/image/landing/page/kadokawafestival50off/button_get_coupon.png?date=20260311") no-repeat;
    background-size: 318px 72px;
    background-position: 0;
    display: block;
    overflow: hidden;
    width: 318px;
    height: 72px;
}
.cp-get-coupon__image--button a.off.already {
    background: url("/resources/a/image/landing/page/kadokawafestival50off/coupon_obtained_button.png?date=20260311") no-repeat;
    background-size: 318px 72px;
    background-position: 0;
}
.cp-get-coupon__image--button img {
    width: 100%;
    height: auto;
}
.cp-get-coupon__image--button p {
    color: #FFFFFF;
    font-size: 14px;
    font-weight: bold;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 52%;
}
.cp-get-coupon__image--button a:hover img {
    opacity: 1;
}
.cp-get-coupon-detail {
    border-radius: 6px;
    background-color: #FFFFFF;
    padding: 26px 16px 20px 24px;
    font-size: 13px;
    line-height: 1.25;
    margin-top: -20px;
}
.cp-get-coupon-detail p:nth-child(3) {
    margin-bottom: 8px;
}
.cp-get-coupon-detail p:nth-child(4),
.cp-get-coupon-detail p:nth-child(5) {
    color: #E90800;
    font-weight: bold;
}
@media not all and (max-width: 950px) {
    .cp-get-coupon-detail {
        font-size: 15px;
    }
}
@media screen and (max-width: 950px) {
    .cp-get-coupon-detail {
        background-color: #D6E4FF;
        width: auto;
        max-width: 373px;
        padding: 26px 16px 16px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .cp-get-coupon__image--register-text {
        margin-top: 20px;
        margin-bottom: 15px;
        font-size: 15px;
    }
    .cp-get-coupon {
        width: auto;
    }
}


/* コマ見せスライダー */
.slider_content {
    margin: auto;
    margin-top: 40px;
}

.card-slider {
    background: inherit;
}

.btn_module.small {
    color: #333333;
    background: #FFFFFF;
    border: 1px solid #B4B4B4;
}

.btn_module.small:hover {
    opacity: 0.5;
}

/* swiper */
.card-slider .swiper-slide {
    width: 250px;
    padding-right: 15px;
}

.card-slider .swiper-slide .card-item {
    background: #FFFFFF;
    box-sizing: border-box;
    flex-shrink: 0;
    border: #DDDDDD solid 1px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0px 0px 3px rgba(17, 17, 17, 0.5);
}

.card-slider .swiper-slide .card-item .card-slider_img {
    width: 250px;
    height: 300px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.card-slider .swiper-slide .card-item .card-slider_img img {
    width: 100%;
    max-height: 100%;
    height: auto;
    object-fit: contain;
}

.card-slider .swiper-slide .card-item .card-title-info {
    padding: 10px;
    height: 130px;
}

.card-slider .swiper-slide .card-item .product_detail {
    display: flex;
}

.card-slider .swiper-slide .card-item .product_thumbnail {
    min-width: 90px;
    height: 130px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.card-slider .swiper-slide .card-item .product_thumbnail img {
    max-width: 90px;
    max-height: 130px;
    object-fit: contain;
}

.card-slider .swiper-slide .card-item .product_description {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-left: 10px;
}
.card-slider .swiper-slide .card-item .product_description a {
    margin-top: auto;
}

.card-slider .swiper-slide .card-item .product_description .card-slider_attention {
    color: #FF0000;
    font-weight: 700;
}

.card-slider .swiper-slide .card-item .eci_panel_btn_read {
    align-items: flex-end;
}

.card-slider .swiper-slide .card-item .card-slider_title {
    display: -webkit-box;
    font-size: 12px;
    color: #333;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.card-slider .swiper-button-prev,
.card-slider .swiper-button-next {
    position: absolute;
    top: 96%;
    width: 30px;
    height: 30px;
}

.card-slider .swiper-button-prev {
    background: url("/resources/a/pc/common/images/main_viz_arrow.png") no-repeat 50% / contain;
    background-position: 0 -28px;
    background-size: 30px 56px;
    height: 30px;
    width: 30px;
}

.card-slider .swiper-button-next {
    background: url("/resources/a/pc/common/images/main_viz_arrow.png") no-repeat 50% / contain;
    background-position: 0 0;
    background-size: 30px 56px;
    height: 30px;
    width: 30px;
}

.card-slider .swiper-button-next:after,
.card-slider .swiper-button-prev:after {
    font-size: 22px;
    color: grey;
    opacity: 0;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: 1;
}

.card-slider .swiper-pagination-bullet-active {
    background: #ff5a00;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 20px;
}

@media screen and (max-width: 950px) {
    .swiper-horizontal > .swiper-pagination-bullets,
    .swiper-pagination-bullets.swiper-pagination-horizontal,
    .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 8px;
    }
}

/* 作品リスト */
.cp__inner {
    padding-left: 10px;
    padding-right: 10px;
}
.cp__title--notice {
    font-weight: bold;
    text-align: center;
    background-color:#A6C3FF;
    border-radius: 100vh;
    margin-bottom: 12px;
    color: #2354A3;
}
.notice__row {
    display: flex;
}
.cp__title--notice .notice__row {
    margin-right: auto;
    margin-left: auto;
    justify-content: center;
    font-size: 13px;
}
.cp__booklist {
    display: flex;
    justify-content: center;
}
.cp__booklist--line {
    overflow: hidden;
    width: 100%;
    display: grid;
    column-gap: 10px;
    grid-template-columns: 1fr 1fr 1fr;
}
.cp__booklist--picture {
    margin-bottom: 6px;
    width: 100%;
    display: flex;
    align-items: flex-end;
    /* 一番縦幅が大きい書影に合わせた比率 */
    padding-top: 145.45%;
    position: relative;
}
.cp__booklist--picture a {
    display: inline-block;
}
.cp__booklist--picture img {
    box-sizing: border-box;
    border: solid 1px #222222;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.25);
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0;
}
.cp__booklist--picture:hover img {
    box-shadow: none;
    opacity: 1.0 !important;
}
.cp__booklist--title {
    font-size: 13px;
    margin-bottom: 6px;
    line-height: 14px;
    height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    color: #FFFFFF;
}
.cp__booklist--discount {
    border-radius: 44px;
    width: 100%;
    height: 22px;
    margin-bottom: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cp__booklist--discount img {
    width: 95px;
    height: 22px;
    object-fit: contain;
}
.cp__booklist--text {
    margin-bottom: 6px;
    padding-top: 4px;
    text-align: center;
    background-color: #FFF1B5;
    border-radius: 4px;
}
.cp__booklist--volume {
    text-align: center;
    color: #777777;
    background-color: #FFD25F;
    border-radius: 100vh;
    height: 16px;
    line-height: 1.2;
    font-size: 13px;
    width: 90%;
    margin: 0 auto;
}
.cp__booklist--regular-price {
    font-size: 11px;
    text-decoration: line-through;
    line-height: 1;
    margin-top: 4px;
    color: #222222;
}
.cp__booklist--regular-price em {
    font-size: 13px;
    font-style: normal;
    color: #222222;
}
.cp__booklist--sale-price {
    font-size: 12px;
    font-weight: bold;
    color: #FF0000;
    line-height: 1;
    padding-top: 1px;
    padding-bottom: 6px;
}
.cp__booklist--sale-price em {
    font-size: 16px;
    font-style: normal;
}

.cp__btn--show-detail {
    display: flex;
    border: 1px solid #222222;
    /* 横幅はborder-widthを含めた形、縦幅は含めない長さで指定されていたのでwidthだけ目視で調整 */
    width: 125px;
    height: 40px;
    border-radius: 3px;
    font-weight: bold;
    background-color: #FFFFFF;
    position: relative;
}
.cp__btn--show-detail a {
    display: block;
    text-decoration: none;
    width: 100%;
}
.cp__btn--show-detail img {
    position: absolute;
    height: 10px;
    width: 6px;
    /* ここは目視で調整 */
    top: 38%;
    right: 10px;
}
.cp__btn--show-detail-text {
    height: 19px;
    line-height: 19px;
    padding-top: 10px;
    text-align: center;
    font-weight: bold;
    color: #222222;
}
.cp-show_works_eligible_for_coupon {
    margin: 16px auto 35px;
    width: 268px;
    height: auto;
    object-fit: contain;
}
.cp__btn--text {
    width: inherit;
    text-align: center;
    color: #222222;
}
.cp-title-list {
    overflow: hidden;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.cp-title-list__item {
    margin-right: 10px;
    margin-bottom: 16px;
}
.cp-title-list__text {
    background-color: #222222;
    color: #FFFFFF;
    border-radius: 100vh;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.2;
    padding: 4px 10px;
    display: block;
}
.cp-title-list__text:hover {
    background-color: #454545;
}
.cp-title-list__more-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-right: 10px;
    margin-bottom: 16px;
    padding: 0 10px;
    background: #709AFF;
    color: #222222;
    border: 1px solid #222;
    border-radius: 100vh;
    font-size: 13px;
    font-weight: bold;
    height: 24px;
    line-height: 1.3;
    cursor: pointer;
    transition: background 0.2s;
}
.cp-title-list__more-btn:hover {
    background: #2354A3;
}
.cp-title-list__item--hidden {
    display: none;
}
.cp-title-list__more-btn img {
    width: 10px;
    height: 6px;
}
.cp__btn--cart-in {
    margin-top: 5px;
}
.cp__btn--cart-in img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.cart-in-booklist {
    margin-top: 40px;
    margin-bottom: 30px;
}
.cart-in-booklist .cp__booklist--line {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 122px));
    row-gap: 20px;
    column-gap: 15px;
    justify-content: center;
}
.cart-in-booklist .cp__booklist--book {
    margin-bottom: 0;
}
@media screen and (max-width: 374px) {
    .cp__booklist--line,
    .cart-in-booklist .cp__booklist--line {
        grid-template-columns: 1fr 1fr;
    }
}

@media not all and (max-width: 950px) {
    /* PC */
    :not(.cart-in-booklist) .cp__inner {
        width: 680px;
        padding: 0;
        margin-top: 48px;
    }
    .cp__booklist {
        width: inherit;
    }
    .cp__booklist--line {
        width: 100%;
        max-width: 680px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        row-gap: 40px;
        column-gap: 20px;
    }
    .cp__booklist--book:nth-last-of-type(1) {
        /* 横一列に並べるため、最後のマージン不要 */
        margin-right: 0;
    }
    .cp__booklist--book {
        width: 120px;
    }
    .cp__booklist--picture img {
        width: 120px;
    }
    .cp__booklist--volume {
        font-size: 13px;
        padding-bottom: 0;
    }
    .cp__btn--show-detail:hover {
        background-color: #EEEEEE;
    }
    .cp__btn--show-detail {
        width: calc(100% - 2px);
        font-size: 13px;
    }
    .cp__btn--show-detail a {
        width: 120px;
        padding-inline: 12px;
        padding-block: 11px;
    }
    .cp__btn--show-detail-text {
        padding: 0;
    }
    .cp__btn--show-detail img {
        right: 13px;
    }
    .cp-title-list {
        width: 100%;
        max-width: 960px;
    }
    .cp__title--notice {
        font-size: 13px;
        width: 400px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 20px;
    }
}
@media screen and (max-width: 950px) {
    .cp__inner {
        margin-top: 20px;
    }
    .cp__btn--show-detail {
        width: 98%;
    }
    .cp__booklist--book {
        margin-bottom: 20px;
    }
    .cp-title-list {
        margin-top: 4px;
    }
}

.entry-description__image {
    margin: 40px auto 20px;
}

.entry-description__image img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.entry-description__text {
    color: #FFFFFF;
    font-size: 16px;
    line-height: 1.5;
    margin: 0 auto;
}

/* エントリーボタン */
.entry-description__button {
    margin-top: 40px;
    text-align: center;
}
.entry-description__button-link {
    display: inline-block;
    width: 260px;
    height: 74px;
    line-height: 74px;
    background: #FF5A00;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border-radius: 4px;
    box-shadow: 1px 2px 0 #353535;
}
.entry-description__button-link span {
    color: #FFFFFF;
}

/* 注意事項 */
.cp-attention {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 80px;
}
.cp-attention-wrapper {
    background-color: #FFFFFF;
    max-width: 560px;
    padding-inline: 40px;
    border-radius: 6px;
    line-height: 125%;
    margin-top: 48px;
    font-size: 15px;
    padding-top: 28px;
}
.cp-attention h4 {
    padding-left: 16px;
    padding-top: 0;
    padding-bottom: 10px;
    font-weight: bold;
    line-height: 1.5;
    position: relative;
    display: inline-block;
}
.cp-attention h4::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    border: 4px solid #3E88FE;
    border-radius: 1px;
    pointer-events: none;
    box-sizing: border-box;
    background-color: #3E88FE;
    width: 8px;
    height: 15px;
}
.cp-attention__lead {
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 48px;
    transform: translate(14px, 0%);
    width: calc(100% - 14px);
}
.cp-attention__lead li {
    margin-bottom: 1.1em;
    position: relative;
    padding-left: 14px;
    line-height: 135%;
}.cp-attention__lead li:last-child {
    margin-bottom: 0;
}
.cp-attention__lead li::before {
    content: '・';
    left: 0;
    position: absolute;
    font-weight: bold;
}
@media screen and (max-width: 950px) {
    .cp-attention {
        padding-left: 10px;
        padding-right: 10px;
        margin-bottom: 40px;
    }
    .cp-attention-wrapper {
        max-width: 369px;
        margin: 40px auto 0;
        padding: 28px 20px 0 16px;
        font-size: 13px;
    }
    .cp-attention-wrapper li {
        margin-bottom: 0.9em;
    }
    .cp-attention-wrapper h4 {
        padding-left: 16px;
        padding-top: 0;
        padding-bottom: 10px;
    }
}
/* 終了ページ */
.cp-end {
    text-align: center;
    font-size: 15px;
    margin-top: 60px;
    margin-bottom: 60px;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.3;
}

/* リンクリスト */
.cp-link-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 5px;
    row-gap: 15px;
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    margin-top: 40px;
}
.cp-link-list__item {
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    border-radius: 8px;
    transition: opacity 0.2s;
}
.cp-link-list__item:hover {
    opacity: 0.8;
}
.cp-link-list__item img {
    width: 100%;
    height: auto;
    display: block;
}

@media not all and (max-width: 950px) {
    .cp-link-list__item:nth-child(5) {
        grid-column: 1 / -1;
        max-width: 50%;
        margin: 10px auto 0;
    }
}
@media screen and (max-width: 950px) {
    /* SP */
    .cp-link-list {
        max-width: 430px;
        margin-top: 10px;
        margin-bottom: 20px;
        grid-template-columns: 1fr;
        row-gap: 10px;
    }
    .entry-description__image {
        margin: 0 auto;
    }
    .cp-link-list--page_name .cp-link-list__item:nth-child(5) {
        margin-top: 18px;
    }
}

@media not all and (max-width: 950px) {
    /* PC */
    .cp-container__background {
        width: 1024px;
    }
    .cp-kv {
        width: 100%;
    }
    h2 {
        text-align: center;
        margin-top: 40px;
    }
    .cp-kv img,
    h2 img {
        width: 100%;
        max-width: 680px;
        object-fit: cover;
    }
    .cp-container {
        max-width: 680px;
        margin: 0 auto;
    }
    .slider_content {
        background-color: #FFFFFF;
        width: 680px;
    }
    .entry-description__image {
        width: 640px;
    }
    .entry-description__text {
        width: 560px;
    }
    .card-slider.swiper-container {
        padding: 42px 0 0 15px;
        overflow: hidden;
    }
    .card-slider.swiper-container {
        height: 510px;
    }
}
@media screen and (max-width: 950px) {
    /* SP */
    .cp-container__background--sp-blue {
        background-color: #203253;
    }
    .cp-container__background--1 .cp-container:not(.cp-container__background--sp-blue) {
        background: linear-gradient(180deg, #3C4049 0.05%, #9BA2BB 16.38%);
    }
    .cp-container__background--2 .cp-container:not(.cp-container__background--sp-blue) {
        background: linear-gradient(180deg, #203253 0.05%, #4060CB 16.38%);
    }
    .cp-container__background--3 .cp-container:not(.cp-container__background--sp-blue) {
        background: linear-gradient(180deg, #0C9D57 0.05%, #78B588 16.38%);
    }
    .cp-container__background--4 .cp-container:not(.cp-container__background--sp-blue) {
        background: linear-gradient(180deg, #9E006A 0.05%, #E6A6D5 16.38%);
    }
    .cp-kv {
        max-width: 430px;
        margin: 0 auto;
    }
    .cp-container .cp-container--spacing {
        max-width: 430px;
        width: 100%;

    }
    h2 img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .cp-container--slider {
        width: 100%;
    }
    .slider_content {
        margin-top: 20px;
    }
    .slider_content .card-slider {
        padding: 0 0 35px 10px;
    }
    .card-slider.swiper-container-horizontal>.swiper-pagination-bullets {
        bottom: 0px;
    }
    .card-slider .swiper-button-prev,
    .card-slider .swiper-button-next {
        top: 98%;
    }
    .entry-description__text {
        padding: 5px 10px 0;
        max-width: 430px;
        font-size: 10px;
    }
}