@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Dela+Gothic+One&display=swap');

:root {
    --color-main: #00a99d;
    --color-green: #4fb486;
}

p {
    margin: 0;
}

h2 {
    margin: 0;
    padding-left: 0;
}

h2::before {
    content: normal;
}

h3 {
    margin: 0;
    background-color: transparent;
    border-left: none;
    padding: 0;
    color: inherit;
}

body #dMWrapper {
    margin-bottom: 0;
}

#dMainColumn #aMainContents {
    padding-bottom: 0;
}


.carbon-free-manga-article #dMainColumn #aMainContents {
    padding-top: 0;
}

.palmtop-visible {
    display: none;
}
@media (max-width: 768px) {
    .palmtop-visible {
        display: block;
    }
}
@media (max-width: 768px) {
    .laptop-visible {
        display: none;
    }
}

.manga-hero {
    position: relative;
    padding-bottom: 50px;
    max-width: 1040px;
}
@media (max-width: 768px) {
    .manga-hero {
        padding-bottom: 25px;
     }
 }

 .manga-hero__heading {
    width: 740px;
    position: relative;
    z-index: 1;
 }
 @media (max-width: 1540px) {
    .manga-hero__heading {
        width: 48vw;
     }
 }
 @media (max-width: 1080px) {
    .manga-hero__heading {
        width: 60vw;
     }
 }
 @media (max-width: 768px) {
    .manga-hero__heading {
        width: 100%;
     }
 }

 .manga-hero__heading-b {
    margin-top: 20px;
    margin-left: 30px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.45em;
 }
 @media (max-width: 1540px) {
    .manga-hero__heading-b {
        font-size: 2.666vw;
     }
 }
 @media (max-width: 1080px) {
    .manga-hero__heading-b {
        font-size: 3.666vw;
     }
 }
 @media (max-width: 768px) {
    .manga-hero__heading-b {
        font-size: 6.4vw;
        margin-top: 14vw;
        line-height: 1.25em;
        margin-left: 10px;
     }
 }

 .manga-hero__latest {
    position: relative;
    margin-top: 40px;
    padding-top: 100px;
    max-width: 500px;
    margin-left: 30px;
    margin-right: 47%;
 }
 @media (max-width: 768px) {
     .manga-hero__latest {
        margin-top: 8vw;
        padding-top: 18.666vw;
        max-width: none;
        margin-left: 2.6666vw;
        margin-right: 0;
     }
 }
 
.manga-hero__latest::after {
    content: '';
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    width: 130px;
    height: 82px;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0idXVpZC1kZTJkYThjOC1jOTY2LTQzOTktYjU0Yi1hZDJiMTc1MWNlMmUiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDEyOS4yNSA4MS40MiI+CiAgPGcgaWQ9InV1aWQtNmQ4Yjk5ZDItOTFiZS00MDRiLWI2ZTItOTk1N2JkMTdmNDhlIiBkYXRhLW5hbWU9Iue3qOmbhuODouODvOODiSI+CiAgICA8cGF0aCBkPSJNMTA4LjMxLDI5LjYxYy0xLjA0LTEuMTMtMy4yOC42MS00LjA0LDEuMTgtMS44MSwxLjM4LTQuNCw0LjAxLTcuMDUsNi43NC0xLjQsMS40Ni0yLjgzLDIuOTQtNC4xNCw0LjMxLTEuODMtMS4yNC0zLjY2LTIuNDItNS40Ny0zLjUyLTQuOTYtMy4wNC05Ljc1LTUuNTUtMTMuNzQtNy40OC00LjAxLTEuODktOC45Ny00LjAzLTE0LjQ2LTUuOTctMi42NC0uOTQtNS40LTEuODItOC4yMy0yLjY0LjczLTIuNDksMS41OC01LjY2LDIuMjMtOC43OC43OC0zLjcyLDEuMjctNy4zNywxLjE5LTkuNjItLjAyLS45NC0uMTctMy43NC0xLjctMy43OC0xLjQ2LS40OC0yLjU3LDIuMDMtMi45NiwyLjg2LS45MSwyLTEuOTIsNS40MS0yLjk1LDguOTQtLjg5LDMuMDUtMS44LDYuMTgtMi41NCw4LjYxLS44NS0uMi0xLjY5LS4zOS0yLjU0LS41OC01Ljk5LTEuMy0xMS45Ny0yLjE2LTE3LjMzLTIuNTYtMS4zNC0uMTQtMi42NC0uMTYtMy44OS0uMjQtLjYzLS4wMy0xLjI0LS4wNi0xLjg0LS4wOS0uNiwwLTEuMTktLjAxLTEuNzctLjAyLTEuMTUsMC0yLjI0LS4wMi0zLjI3LDAtMS4wMy4wNS0xLjk5LjA5LTIuODcuMTMtMS40OC4wNS00LjQzLjMzLTYuODguNzgtMi40Ni41LTQuNDEsMS4xNC00LDEuODgtLjMxLjc3LDEuNzEsMS4yMSw0LjEyLDEuNDcsMi40Mi4zMSw1LjI3LjQ2LDYuNy42Mi44NS4wNywxLjc4LjE1LDIuNzYuMjMuOTguMSwyLjAzLjIsMy4xMy4zMS41NS4wNSwxLjExLjEsMS42OS4xNi41Ny4wNywxLjE2LjE0LDEuNzYuMjIsMS4yLjE2LDIuNDQuMjYsMy43Mi40Niw1LjExLjY4LDEwLjc5LDEuNywxNi40OSwzLjA5LjY3LjE2LDEuMzUuMzMsMi4wMi41MS0uNDUsMS40Mi0uOTMsMi45MS0xLjQsNC4zOC0xLjEyLDMuNS0yLjE5LDYuODktMi41NSw5LjA2LS4xNS45MS0uNjIsMy42MS44NSw0LjAyLDEuMjkuODIsMi45OC0xLjQyLDMuNTItMi4xOSwxLjMyLTEuODIsMi45NS01LjEyLDQuMzktOC42NC42Ni0xLjU5LDEuMjctMy4yMywxLjgyLTQuNzksMi43NC44Myw1LjQyLDEuNzMsNy45OSwyLjY2LDUuMjMsMS45LDkuOTYsMy45NiwxMy43OSw1Ljc2LDMuODEsMS44NSw4LjM5LDQuMjIsMTMuMTYsNy4wOSwxLjM5Ljg0LDIuODEsMS43Miw0LjIyLDIuNjMtMS42OSwxLjczLTMuNjksMy43OC01LjY1LDUuNzgtMi42NSwyLjc0LTUuMTksNS40MS02LjUyLDcuMjYtLjU1Ljc3LTIuMjIsMy4wNy0xLjA1LDQuMDcuODEsMS4zLDMuMzUtLjA1LDQuMi0uNTIsMi4wMy0xLjEyLDUuMDEtMy40NCw3Ljk0LTYuMDIsMi41NC0yLjIzLDUuMDMtNC42Nyw2LjkzLTYuNiwxLjQ1LDEuMDMsMi45LDIuMDksNC4zMSwzLjE3LDQuNjcsMy41NSw5LjA0LDcuMzIsMTIuNzgsMTAuODYuOTYuODYsMS44MiwxLjc2LDIuNywyLjU5LjQzLjQyLjg2LjgzLDEuMjcsMS4yMy40LjQxLjguODIsMS4xOCwxLjIxLjc4Ljc5LDEuNTIsMS41MywyLjIxLDIuMjQuNjguNzIsMS4zMiwxLjM5LDEuOTEsMiwxLjAyLDEuMDEsMi45MywzLjEzLDQuNjksNC44MSwxLjcyLDEuNzIsMy4zMywzLjAxLDMuNzQsMi4yOC44NC0uMTQuMS0yLjA2LTEuMDUtNC4yOS0xLjItMi4xOS0yLjgzLTQuNjUtMy43Mi01LjgzLS41My0uNzEtMS4xLTEuNDktMS43MS0yLjMxLS42My0uODEtMS4zMi0xLjY1LTIuMDUtMi41NC0uMzctLjQ0LS43NC0uOS0xLjEyLTEuMzYtLjQtLjQ1LS44MS0uOTEtMS4yMi0xLjM4LS44NS0uOTItMS42OS0xLjkzLTIuNjMtMi44OC0zLjY4LTMuOTEtOC4xMS04LjAxLTEyLjktMTEuODUtMS4yMy0uOTktMi40OC0xLjk2LTMuNzUtMi45LDEuMTMtMS4yNSwyLjMtMi41OSwzLjQxLTMuOTMsMi40OS0zLjAxLDQuNzItNi4wNiw1Ljc3LTguMTIuNDQtLjg2LDEuNzItMy40NC4zOS00LjIxWiIgZmlsbD0iI2ZmYWM1MyIvPgogIDwvZz4KPC9zdmc+');
}
@media (max-width: 768px) {
    .manga-hero__latest::after {
        width: 14.3999vw;
        height: 13.8666vw;
        top: -2.666vw;
        right: 8vw;
        background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0idXVpZC1hM2IwOTUzYS04MmIyLTQ4ZDAtOGNkYy04NjVmNmEwNGUwOGUiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDU0IDUyIj4KICA8ZyBpZD0idXVpZC1iNTc0YTJlNy1iY2VhLTQ4N2QtYWMwMS05ZTNiNWVjOTdiNDciIGRhdGEtbmFtZT0i57eo6ZuG44Oi44O844OJIj4KICAgIDxwYXRoIGQ9Ik01MS40OCwyMy4yNmMtLjM0LS43Mi0xLjctLjIxLTIuMTYtLjA0LTEuMDkuNDEtMi43NiwxLjMtNC40NywyLjI1LS45MS41LTEuODMsMS4wMi0yLjY4LDEuNDktLjcxLS44OS0xLjQyLTEuNzYtMi4xNC0yLjU4LTEuOTYtMi4yNy0zLjkyLTQuMjQtNS41OC01LjgxLTEuNjgtMS41NS0zLjc3LTMuMzgtNi4xNi01LjE4LTEuMTUtLjg3LTIuMzYtMS43My0zLjYyLTIuNTcuNzQtMS4xMiwxLjYzLTIuNTUsMi40My00LC45NS0xLjcyLDEuNzQtMy40NSwyLjA1LTQuNTcuMTMtLjQ3LjQ5LTEuODgtLjI2LTIuMTMtLjY0LS40Ni0xLjU3LjYxLTEuODguOTYtLjc1Ljg1LTEuNzYsMi4zOC0yLjgsMy45Ni0uOSwxLjM3LTEuODIsMi43OC0yLjU1LDMuODctLjM4LS4yMy0uNzctLjQ2LTEuMTUtLjY4LTIuNzMtMS41Ny01LjUyLTIuOTEtOC4wOC0zLjk0LS42My0uMjctMS4yNy0uNDktMS44Ny0uNzItLjMtLjExLS42LS4yMi0uODktLjMzLS4yOS0uMS0uNTgtLjE5LS44Ni0uMjgtLjU2LS4xOC0xLjA5LS4zNS0xLjYtLjUtLjUxLS4xNC0uOTgtLjI2LTEuNDItLjM4LS43My0uMi0yLjIxLS41Mi0zLjQ4LS42OEMxLjAxLDEuMjgtLjA0LDEuMjkuMDUsMS43MmMtLjI3LjM0LjY1Ljg2LDEuNzksMS4zNiwxLjE0LjUzLDIuNTEsMS4wNCwzLjE4LDEuMzQuNDEuMTcuODUuMzUsMS4zMi41NC40Ny4yLjk2LjQxLDEuNDguNjQuMjYuMTEuNTMuMjIuOC4zNC4yNy4xMi41NS4yNS44My4zOC41Ni4yNiwxLjE1LjUsMS43NS44LDIuMzksMS4xMiw1LjAyLDIuNTEsNy41OSw0LjA3LjMxLjE4LjYxLjM3LjkxLjU2LS40NC42My0uOSwxLjMtMS4zNSwxLjk1LTEuMDgsMS41Ni0yLjEyLDMuMDctMi42Myw0LjA5LS4yMS40My0uODYsMS42OS0uMiwyLjEyLjUxLjYxLDEuNjctLjI0LDIuMDYtLjU0LjkyLS43LDIuMjItMi4wOCwzLjQ2LTMuNTkuNTYtLjY5LDEuMTEtMS40LDEuNjItMi4wOSwxLjIxLjgzLDIuMzksMS42OSwzLjUsMi41NSwyLjI3LDEuNzQsNC4yNywzLjQ5LDUuODcsNC45NywxLjU4LDEuNSwzLjQ2LDMuMzgsNS4zNSw1LjUzLjU1LjYzLDEuMTEsMS4yOCwxLjY2LDEuOTUtMS4wOS41OS0yLjM4LDEuMy0zLjY0LDEuOTktMS43MS45NC0zLjM2LDEuODctNC4yOSwyLjU4LS4zOS4zLTEuNTUsMS4xOC0xLjEzLDEuODUuMi43NywxLjY1LjQ5LDIuMTMuMzksMS4xNi0uMjQsMi45Ny0uOTMsNC44LTEuNzYsMS41OC0uNzEsMy4xNy0xLjUzLDQuMzktMi4xOS41NS43MywxLjEsMS40OCwxLjYyLDIuMjMsMS43NCwyLjQ3LDMuMyw1LjAxLDQuNTksNy4zNC4zNC41Ny42MiwxLjE1LjkyLDEuNy4xNS4yNy4yOS41NC40NC44LjEzLjI3LjI3LjUzLjM5Ljc4LjI2LjUxLjUxLjk5Ljc0LDEuNDUuMjMuNDYuNDQuODkuNjMsMS4yOS4zNS42Ni45NSwyLDEuNTYsMy4xLjU4LDEuMTEsMS4xNywyLDEuNDgsMS43LjQzLjA2LjM3LTEsLjE0LTIuMjgtLjI1LTEuMjctLjY4LTIuNzQtLjkzLTMuNDYtLjE1LS40My0uMzEtLjktLjQ4LTEuNDEtLjE4LS41LS40LTEuMDItLjYyLTEuNTctLjExLS4yOC0uMjMtLjU2LS4zNC0uODUtLjEzLS4yOC0uMjYtLjU3LS4zOS0uODctLjI3LS41OS0uNTMtMS4yMS0uODUtMS44My0xLjIxLTIuNS0yLjc0LTUuMjEtNC41LTcuODQtLjQ1LS42OC0uOTEtMS4zNS0xLjM5LTIuMDEuNzQtLjQ0LDEuNTItLjkyLDIuMjctMS40MiwxLjY4LTEuMSwzLjIzLTIuMjcsNC4wNi0zLjEyLjM1LS4zNiwxLjM2LTEuNDQuODMtMi4wMloiIGZpbGw9IiNmZmFjNTMiLz4KICA8L2c+Cjwvc3ZnPg==');
    }
}

.manga-hero__latest__balloon {
    width: 186px;
    position: absolute;
    top: 0;
    left: 0;
    animation: bounce 2s infinite;
}
@media (max-width: 768px) {
    .manga-hero__latest__balloon {
        width: 37.333vw;
        left: 2.666vw;
    }
}

.manga-hero__latest__chara {
    width: 69px;
    position: absolute;
    top: 27px;
    left: 200px;
    animation: bounce 2s infinite;
}
@media (max-width: 768px) {
    .manga-hero__latest__chara {
        width: 18.4vw;
        top: 0;
        left: 45.333vw;
    }
}
 
 .manga-hero__latest__box {
    display: block;
    text-decoration: none !important;
    box-sizing: border-box;
    position: relative;
    background-color: #ffd407;
    border-radius: 100px 100vw 100vw 100px;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, .15);
    padding: 15px 30px 20px;
    transition: background-color .3s;
}
@media (max-width: 768px) {
    .manga-hero__latest__box {
        height: 42.1333vw;
        padding: 2.666vw 4vw;
        border-radius: 25px 100vw 100vw 25px;
    }
}

.manga-hero__latest__box:hover {
    background-color: #163d70;
}

.manga-hero__latest__box:hover {
    background-color: #163d70;
}

.manga-hero__latest__box--new {
    position: relative;
}

.manga-hero__latest__box--new::before {
    content: '';
    background-image: url('/member_assets/images/page/member/p/carbon-free/archive_new.svg');
    width: 135px;
    height: 74px;
    background-size: cover;
    position: absolute;
    top: -45px;
    left: 12px;
    z-index: -1;
    animation: bounce 2s infinite;
}
@media (max-width: 768px) {
    .manga-hero__latest__box--new::before {
        width: 85px;
        height: 45px;
        top: -28px;
    }
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
}
40% {
    transform: translateY(-10px);
}
60% {
    transform: translateY(-10px);
}
}

.manga-hero__latest__box--pre {
    pointer-events: none;
    background-color: #cccccc;
}

.manga-hero__latest__box__text {

}

.manga-hero__latest__box__text__label {
    color: #163d70;
    font-size: 21px;
    letter-spacing: 0.03em;
    font-family: "Dela Gothic One", system-ui;
    font-weight: 400;
    transition: color .3s;
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__label {
        font-size: 2.666vw;
        margin-bottom: 1vw;
    }
}

.manga-hero__latest__box:hover .manga-hero__latest__box__text__label {
    color: #ffd407;
}

.manga-hero__latest__box__text__heading {
    font-size: 20px;
    letter-spacing: 0.09em;
    line-height: 1.4 !important;
    padding-right: 120px;
    color: #163d70;
    transition: color .3s;
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__heading {
        font-size: 4.8vw;
    }
}

.manga-hero__latest__box:hover .manga-hero__latest__box__text__heading {
    color: #ffd407;
}

.manga-hero__latest__box__text__heading br,
.manga-hero__latest__box__text__sub-heading br {
    display: none;
}
@media (max-width: 768px) {
.manga-hero__latest__box__text__heading br,
.manga-hero__latest__box__text__sub-heading br {
    display: block;
}
}

.manga-hero__latest__box__text__sub-heading {
    font-size: 14px;
    font-weight: 700;
    color: #163d70;
    padding-right: 120px;
    transition: color .3s;
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__sub-heading {
        font-size: 3.4666vw;
    }
}


.manga-hero__latest__box:hover .manga-hero__latest__box__text__sub-heading {
    color: #ffd407;
}

.manga-hero__latest__box__text__button {
    width: 80px;
    margin-top: 8px;
    margin-bottom: 0;
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__button {
        width: 21.333vw;
        margin-top: 1vw;
    }
}


.manga-hero__latest__box__text__button__anchor {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 2px;
    padding-bottom: 1px;
    padding-left: 20px;
    background-color: #fff;
    font-size: 12px;
    font-weight: 700;
    border-radius: 100vw;
    color: #163d70;
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__button__anchor {
        font-size: 3.2vw;
        padding-top: 2px;
        padding-left: 5vw;
    }
}

.manga-hero__latest__box--pre .manga-hero__latest__box__text__button__anchor {
    color: #cccccc;
}

.manga-hero__latest__box__text__button__anchor::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #163d70;
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__button__anchor::before {
        width: 4.8vw;
        height: 4.8vw;
        right: .666vw;
    }
}

.manga-hero__latest__box--pre .manga-hero__latest__box__text__button__anchor::before {
    background-color: #cccccc;
}

.manga-hero__latest__box__text__button__anchor::after {
    content: '';
    width: 10px;
    height: 9px;
    background-image: url('/member_assets/images/page/member/p/carbon-free/ico_arrow.svg');
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-hero__latest__box__text__button__anchor::after {
        width: 2.666vw;
        height: 2.133vw;
        right: 1.666vw;
    }
}

.manga-hero__latest__box__image {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 130px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-hero__latest__box__image {
        width: 40vw;
        right: 1.3333vw;
    }
}

.manga-hero__latest__box__image img {
    width: 100%;   
}


 .manga-hero__paragraph {
    margin-top: 30px;
    margin-left: 30px;
    font-size: 18px;
    font-weight: 700;
    color: #163d70;
 }
 @media (max-width: 1540px) {
    .manga-hero__paragraph {
        font-size: 1.2vw;
     }
 }
 @media (max-width: 1080px) {
    .manga-hero__paragraph {
        font-size: 1.6vw;
     }
 }
 @media (max-width: 768px) {
    .manga-hero__paragraph {
        margin-top: 15vw;
        font-size: 3.4vw;
        margin-left: 20px;
     }
 }

 .manga-hero__image-01 {
    width: 50%;
    position: absolute;
    top: 60px;
    right: -50px;
 }
 @media (max-width: 768px) {
    .manga-hero__image-01 {
        position: absolute;
        width: 56%;
        top: 106vw;
        right: -15px;
    }
 }

 .manga-hero__image-02 {
    position: relative;
    z-index: 1;
    margin-top: -200px;
    transform: translateX(60px);
 }
 @media (max-width: 768px) {
    .manga-hero__image-02 {
        position: relative;
        z-index: 1;
        margin-top: 5vw;
        margin-left: -4vw;
        margin-right: -4vw;
        transform: translateX(0);
     }
 }

 .manga-hero__button {
    margin-left: 20px;
    width: 150px;
 }
 @media (max-width: 1540px) {
    .manga-hero__button {
        top: 41vw;
     }
 }

 .manga-hero__paragraph__inner {
    display: inline;
    position: relative;
    line-height: 2.3145944444em !important;
    border-bottom: 3px solid #ffd407;
    padding-bottom: 6px;
 }


.manga-archive {
    position: relative;
    z-index: 1;
    padding-bottom: 60px;
}
@media (max-width: 768px) {
    .manga-archive {
        padding-bottom: 10vw;
    }
}

.manga-archive::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 60px;
    left: 50%;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    background-color: #daeaf2;
}
@media (max-width: 768px) {
    .manga-archive::before {
        top: 9vw;
    }
}

.manga-archive__inner {
    position: relative;
    z-index: 1;
}

.manga-archive__heading {
    margin-top: -25px;
    color: #000000;
    text-align: center;
}
@media (max-width: 768px) {
    .manga-archive__heading {
        margin-top: -10px;
    }
}

.manga-archive__heading::after {
    display: block;
    content: '';
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/archive_heading_black.svg');
    background-size: cover;
    width: 450px;
    height: 124px;
    margin-inline: auto;
}
@media (max-width: 768px) {
    .manga-archive__heading::after {
        width: 69.33vw;
        height: 17.866vw;
    }
}

.manga-archive__heading__inner {
    font-size: 18px;
    letter-spacing: 0.09em;
    position: relative;
    z-index: 1;
    position: absolute;
    top: 44px;
    left: 0;
    text-align: center;
    width: 100%;
}
@media (max-width: 768px) {
    .manga-archive__heading__inner {
     font-size: 3.7333vw;
     top: 5.8vw;
    }
}

.manga-archive__list {
    margin-top: 60px;
    max-width: 1015px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 35px 35px;
}
@media (max-width: 1250px) {
    .manga-archive__list {
        grid-template-columns: repeat(1, 1fr);
        gap: 70px 0;
    }
}
@media (max-width: 768px) {
    .manga-archive__list {
        margin-top: 30px;
        gap: 8vw 0;
    }
}

.manga-archive__list__item {
    
}

.manga-archive__box {
    display: block;
    text-decoration: none !important;
    box-sizing: border-box;
    height: 135px;
    position: relative;
    background-color: var(--color-green);
    border-radius: 100px 100vw 100vw 100px;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, .15);
    padding: 17px 30px 20px 22px;
}
@media (max-width: 768px) {
    .manga-archive__box {
        height: 26.666vw;
        padding: 1.866vw 4vw 2.666vw;
        border-radius: 25px 100vw 100vw 25px;
    }
}

.manga-archive__box > div {
    transition: opacity .3s;
}

.manga-archive__box:hover > div {
    opacity: .7;
}

.manga-archive__box--new {
    position: relative;
}

.manga-archive__box--new::before {
    content: '';
    background-image: url('/member_assets/images/page/member/p/carbon-free/archive_new.svg');
    width: 135px;
    height: 74px;
    background-size: cover;
    position: absolute;
    top: -45px;
    left: 12px;
    z-index: -1;
    animation: bounce 2s infinite;
}
@media (max-width: 768px) {
    .manga-archive__box--new::before {
        width: 85px;
        height: 45px;
        top: -28px;
    }
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
}
40% {
    transform: translateY(-10px);
}
60% {
    transform: translateY(-10px);
}
}

.manga-archive__box--pre {
    pointer-events: none;
    background-color: #cccccc;
}

.manga-archive__box__text {

}

.manga-archive__box__text__label {
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.03em;
    font-family: "Dela Gothic One", system-ui;
    font-weight: 400;
}
@media (max-width: 768px) {
    .manga-archive__box__text__label {
        font-size: 2.666vw;
        margin-bottom: 0;
    }
}

.manga-archive__box__text__heading {
    font-size: 19px;
    letter-spacing: 0.09em;
    color: #fff;
}
@media (max-width: 768px) {
    .manga-archive__box__text__heading {
        font-size: 3.7333vw;
    }
}

.manga-archive__box__text__sub-heading {
    margin-top: -2px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
}
@media (max-width: 768px) {
    .manga-archive__box__text__sub-heading {
        font-size: 2.6666vw;
    }
}


.manga-archive__box__text__button {
    width: 80px;
    margin-top: 7px;
}
@media (max-width: 768px) {
    .manga-archive__box__text__button {
        width: 21.333vw;
    }
}


.manga-archive__box__text__button__anchor {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    width: 100%;
    padding-top: 2px;
    padding-bottom: 1px;
    padding-left: 20px;
    background-color: #fff;
    font-size: 12px;
    font-weight: 700;
    border-radius: 100vw;
    color: var(--color-green);
}
@media (max-width: 768px) {
    .manga-archive__box__text__button__anchor {
        font-size: 3.2vw;
        padding-top: 2px;
        padding-left: 5vw;
    }
}

.manga-archive__box--pre .manga-archive__box__text__button__anchor {
    color: #cccccc;
}

.manga-archive__box__text__button__anchor::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--color-green);
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-archive__box__text__button__anchor::before {
        width: 4.8vw;
        height: 4.8vw;
        right: .666vw;
    }
}

.manga-archive__box--pre .manga-archive__box__text__button__anchor::before {
    background-color: #cccccc;
}

.manga-archive__box__text__button__anchor::after {
    content: '';
    width: 10px;
    height: 9px;
    background-image: url('/member_assets/images/page/member/p/carbon-free/ico_arrow.svg');
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-archive__box__text__button__anchor::after {
        width: 2.666vw;
        height: 2.133vw;
        right: 1.666vw;
    }
}

.manga-archive__box__image {
    position: absolute;
    top: 0;
    right: 0;
    width: 135px;
}
@media (max-width: 768px) {
    .manga-archive__box__image {
        width: 26.53vw;
    }
}


.manga-archive__author {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #fff;
    max-width: 1015px;
    margin-left: auto;
    margin-right: auto;
    text-align: right;
}

/* @media (max-width: 768px) {
    .manga-archive__author {
        margin-top: 8vw;
        padding-top: 6vw;
        margin-left: 2.666vw;
        margin-right: 2.666vw;
    }
}

.manga-archive__author__name {
    display: flex;
    align-items: center;
    font-weight: 700;
}

.manga-archive__author__name dt {
    position: relative;
    width: 66px;
    height: 57px;
}
@media (max-width: 768px) {
    .manga-archive__author__name dt {
        width: 14.399vw;
        height: 12.533vw;
    }
}

.manga-archive__author__name dt::before {
    content: '';
    background-image: url('/member_assets/images/page/member/p/carbon-free/hint_author_term.svg');
    width: 66px;
    height: 57px;
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
    .manga-archive__author__name dt::before {
        width: 14.399vw;
        height: 12.533vw;
    }
}

.manga-archive__author__name dt span {
    display: block;
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: 16px;
    letter-spacing: 0.225em;
    text-align: center;
    font-weight: 700;
    top: 50%;
    left: calc(50% - 2px);
    transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
    .manga-archive__author__name dt span {
        font-size: 3.4666vw;
    }
}

.manga-archive__author__name dd {
    font-size: 14px;
    color: #163d70;
    margin-left: 20px;
}
@media (max-width: 768px) {
    .manga-archive__author__name dd {
        font-size: 3.733vw;
        margin-left: 3vw;
    }
}


.manga-archive__author__name dd ruby {
    font-size: 20px;
    margin-right: 10px;
}
@media (max-width: 768px) {
    .manga-archive__author__name dd ruby {
        font-size: 4.8vw;
        margin-right: 2vw;
    }
}

.manga-archive__author__name dd ruby rt {
    transform: translateY(-3px);
} */


.manga-article {
    text-align: center;
    position: relative;
    padding-top: 30px;
    padding-bottom: 25px;

}

.manga-article::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    background-color: #94d0cb;
}

.manga-article__inner {
    position: relative;
    z-index: 1;
}

.manga-article__label {
    width: 202px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
    .manga-article__label {
        width: 48.53vw;
    }
}

.manga-article__heading {
    font-size: 50px;
    font-family: "Dela Gothic One", system-ui;
    font-weight: 400;
    color: #323232;
    text-align: center;
    margin-top: 12px;
}
@media (max-width: 768px) {
    .manga-article__heading {
        font-size: 8.533vw;
        line-height: 1.3125em !important;
    }
}

.manga-content {
    position: relative;
    padding: 60px 0 90px;
}

.manga-content::before {
    content: '';
    position: absolute;
    top: 0; 
    left: 50%;
    width: calc(100vw - 250px);
    height: 100%;
    transform: translateX(-50%);
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_01.png');
    background-size: cover;
    background-position: center;
}
@media screen and (max-width: 1080px) {
    .manga-content::before {
        width: calc(100% + 100px);
    }
}

.manga-content--02::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_02.png');
}

.manga-content--03::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_03.png');
}

.manga-content--04::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_04.png');
}

.manga-content--05::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_05.png');
}

.manga-content--06::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_06.png');
}

.manga-content--07::before {
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/content_bg_07.png');
}

.manga-content__container {
    position: relative;
    z-index: 1;
    max-width: 355px;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (max-width: 768px) {
    .manga-content__container {
        max-width: 245px;
    }
}

.manga-point {
    margin-top: -60px;
    position: relative;
    padding-bottom: 80px;
}

.manga-point::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 60px;
    left: 50%;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    background-color: #f4f8e9;
}

.manga-point__inner {
    position: relative;
    z-index: 1;
}

.manga-point__heading {
    width: 320px;
    margin-left: auto;
    margin-right: auto;
}

.manga-point__box {
    background-color: #fff;
    border-radius: 10px;
    padding: 40px 50px 60px;
    max-width: 854px;
    width: 100%;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 768px) {
    .manga-point__box {
        padding: 20px 15px 15px;
    }
}


.manga-point__box__heading {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5833333333em;
    text-align: center;
    color: #323232;
    margin-top: 0;
    margin-bottom: 0;
}
@media (max-width: 768px) {
    .manga-point__box__heading {
        font-size: 20px;
    }
}

.manga-point__box__paragraph {
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.075em;
    line-height: 1.85em !important;
}
@media (max-width: 768px) {
    .manga-point__box__paragraph {
        font-size: 14px;
    }
}

.manga-point__box__paragraph:not(:first-child){
    margin-top: 30px;
}
@media (max-width: 768px) {
    .manga-point__box__paragraph:not(:first-child){
        margin-top: 20px;
    }
}


.manga-hint__list {
    margin-top: 55px;
    display: flex;
    justify-content: center;
    gap: 0 20px;
    margin-left: 2.6666vw;
    margin-right: 2.6666vw;
}
@media (max-width: 768px) {
    .manga-hint__list {
        flex-wrap: wrap;
        margin-top: 12vw;
        gap: 2.666vw 0;
        margin-left: 0;
        margin-right: 0;
    }
}

.manga-hint__list__item {

}
@media (max-width: 768px) {
    .manga-hint__list__item {
        width: 100%;
    }
}

.manga-hint__box {
    text-decoration: none !important;
    box-sizing: border-box;
    width: 205px;
    position: relative;
    z-index: 1;
    display: block;
    background-color: #f4f8ea;
    border: 3px solid #d8e6b6;
    padding: 20px 10px;
    border-radius: 5px;
    transition: border .3s, background-color .3s;
}
@media (max-width: 768px) {
    .manga-hint__box {
        width: 100%;
        padding: 3vw 3vw;
    }
}

.manga-hint__box:hover {
    border-color: var(--color-green);
}

.manga-hint__box__heading {
    color: #134f30;
    text-align: center;
}
@media (max-width: 768px) {

}

.manga-hint__box__heading__sub {
    display: block;
    font-size: 18px;
    text-align: center;
    text-decoration: underline;
}
@media (max-width: 768px) {
    .manga-hint__box__heading__sub {
        text-align: left;
        font-size: 3.733vw;
    }
}

.manga-hint__box__heading__main {
    display: block;
    font-size: 14px;
    text-align: center;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (max-width: 768px) {
    .manga-hint__box__heading__main {
        font-size: 3.2vw;
        text-align: left;
        justify-content: flex-start;
        min-height: auto;
    }
}


.manga-hint__box__image {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}
@media (max-width: 768px) {
    .manga-hint__box__image {
        margin-top: 0;
        width: 21.333vw;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 3vw;
    }
}

.manga-hint__box__image--column-01 {
 width: 158px;   
}

@media (max-width: 768px) {
    .manga-hint__box__image--column-01 {
        width: 22.333vw;
    }
}

.manga-hint__box__image--column-02 {
    width: 165px;
    transform: translateX(-5px);
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-02 {
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__image--column-03 {
    width: 157px;
    transform: translateX(-5px);
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-03 {
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__image--column-04 {
    width: 157px;
    transform: translateX(-5px);
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-04 {
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__image--column-05 {
    width: 157px;
    transform: translateX(-5px);
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-05 {
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__image--column-06 {
    width: 157px;
    margin-top: 19px;
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-06 {
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__image--column-07 {
    width: 157px;
    margin-top: 11px;
}
@media (max-width: 768px) {
    .manga-hint__box__image--column-07 {
        margin-top: 0;
        width: 22.333vw;
        transform: translate(0, -50%);
    }
}

.manga-hint__box__button {
    margin-top: 20px;
    text-align: center;
}
@media (max-width: 768px) {
    .manga-hint__box__button {
        text-align: left;
        margin-top: 2vw;
    }
}

.manga-hint__box__button__anchor {
    text-align: left;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding-top: 2px;
    font-size: 12px;
    width: 80px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding-left: 24px;
    background-color: #fff;
    font-weight: 700;
    border-radius: 100vw;
    color: var(--color-main);
    border: 2px solid var(--color-main);
}
@media (max-width: 768px) {
    .manga-hint__box__button__anchor {
        font-size: 3.2vw;
        width: 21.33vw;
    }
}

.manga-hint__box__button__anchor::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--color-main);
    position: absolute;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-hint__box__button__anchor::before {
        width: 4.8vw;
        height: 4.8vw;
    }
}

.manga-hint__box__button__anchor::after {
    content: '';
    width: 10px;
    height: 8px;
    background-image: url('/member_assets/images/page/member/p/carbon-free/ico_arrow.svg');
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-hint__box__button__anchor::after {
        width: 2.666vw;
        height: 2.4333vw;
        right: 1.4vw;
    }
}

.manga-point__button {
    position: relative;
    margin-top: 80px;
    text-align: center;
    max-width: 255px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    border: 2px solid var(--color-main);
    border-radius: 100vw;
    background-color: #fff;
    transition: opacity .3s;
}
@media (max-width: 768px) {
    .manga-point__button {
        margin-top: 40px;
    }
}

.manga-point__button:hover {
    opacity: .7;
}

.manga-point__button__anchor {
display: block;
position: relative;
    padding: 17px 50px 17px 20px;
    font-size: 14px !important;
    font-weight: 700;
    letter-spacing: .075em;
    color: var(--color-main) !important;
    text-decoration: none !important;
}


.manga-point__button__anchor::before {
    content: '';
    display: block;
    width: 46px;
    height: 46px;
    background-color: var(--color-main);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
}

.manga-point__button__anchor::after {
    content: '';
    width: 19px;
    height: 16px;
    background-image: url('/member_assets/images/page/member/p/carbon-free/ico_arrow_02.svg');
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}



.manga-point__back-button {
    text-align: center;
    cursor: pointer;
    margin-top: 80px;
    display: block;
    appearance: none;
    border: none;
    background-color: var(--color-main);
    color: #fff;
    width: 340px;
    margin-left: auto;
    margin-right: auto;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .09em;
    border-radius: 100vw;
    transition: opacity .3s;
}
@media (max-width: 768px) {
    .manga-point__back-button {
        width: 60vw;
        font-size: 4.8vw;
    }
}

.manga-point__back-button:hover {
    opacity: 0.7;
}

.manga-point__back-button__anchor {
    padding: 15px 20px;
    display: inline-block;
}

a.manga-point__back-button__anchor,
a.manga-point__back-button__anchor:visited {
    text-decoration: none !important;
    color: #ffffff;
}

.manga-question__aside {
    position: relative;
    padding: 80px 0;
}

.manga-question__aside::before {
    content: "";
    pointer-events: none;
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    background-color: #f3f7e9;
}

.manga-question__aside__inner {
    position: relative;
    z-index: 1;
}


.manga-question__aside-button {
    width: 304px;
    margin-left: auto;
    margin-right: auto;
}

.manga-question__aside-button__anchor {
    position: relative;
    display: flex;
    align-items: center;
    background-color: #c8e696;
    border-radius: 100vw;
    height: 84px;
    text-decoration: none !important;
    transition: opacity .3s;
}

.manga-question__aside-button__anchor:hover {
    opacity: .7;
}

.manga-question__aside-button__anchor img {
    width: 84px;
    position: absolute;
    top: 0;
    left: 0;
}

.manga-question__aside-button__anchor__inner {
    width: 100%;
    display: block;
    padding-left: 74px;
    text-align: center;
    color: #163d70;
    font-weight: 700;
}

.manga-question__aside-button__anchor__main {
    display: block;
    font-size: 18px;
}

.manga-question__aside-button__anchor__sub {
    display: block;
    font-size: 12px;
    margin-top: 5px;
}

.manga-question__aside-button__anchor__sub::after {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 9px solid #163d70;
    border-right: 0;
    margin-left: 1px;
  }

  
.manga-question__button-columns {
    display: flex;
    justify-content: center;
    gap: 0 40px;
}
@media (max-width: 768px) {
    .manga-question__button-columns {
        flex-wrap: wrap;
        gap: 20px 0;
    }
    .manga-question__button-columns__column {
        width: 100%;
    }
    
}

.manga-back {
    margin-top: 70px;
}
@media (max-width: 768px) {
    .manga-back {
        margin-top: 35px;
    }
}

.manga-back__anchor {
    display: block;
    width: 255px;
    margin-inline: auto;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .075em;
    color: #00a99d !important;
    text-decoration: none !important; 
    background-color: #fff;
    text-align: center;
    padding: 18px;
    border-radius: 100vw;
    border: 2px solid #00a99d;
    position: relative;
    transition: opacity .3s;
}

.manga-back__anchor:hover {
    opacity: 0.7;
}

.manga-back__anchor__inner {
}

.manga-back__anchor__inner::after {
    content: '';
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0idXVpZC1lYzQ5YjI1ZS02ZGE4LTRlNmQtYmYwNi0yNTdjNmE2YTdkNzIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDQ0IDQ0Ij4KICA8ZyBpZD0idXVpZC1mZTY4ODU4Mi1mN2UzLTRmOTktYTk4Ni01NzkwZDQ3MjcxY2IiIGRhdGEtbmFtZT0i57eo6ZuG44Oi44O844OJIj4KICAgIDxnPgogICAgICA8Zz4KICAgICAgICA8cGF0aCBkPSJNMjIsNDMuMjhDMTAuMjcsNDMuMjguNzIsMzMuNzMuNzIsMjJTMTAuMjcuNzIsMjIsLjcyczIxLjI4LDkuNTUsMjEuMjgsMjEuMjgtOS41NSwyMS4yOC0yMS4yOCwyMS4yOFoiIGZpbGw9IiMwMGE5OWQiLz4KICAgICAgICA8cGF0aCBkPSJNMjIsMS40NGMxMS4zNCwwLDIwLjU2LDkuMjIsMjAuNTYsMjAuNTZzLTkuMjIsMjAuNTYtMjAuNTYsMjAuNTZTMS40NCwzMy4zNCwxLjQ0LDIyLDEwLjY2LDEuNDQsMjIsMS40NE0yMiwwQzkuODUsMCwwLDkuODUsMCwyMnM5Ljg1LDIyLDIyLDIyLDIyLTkuODUsMjItMjJTMzQuMTUsMCwyMiwwaDBaIiBmaWxsPSIjMDBhOTlkIi8+CiAgICAgIDwvZz4KICAgICAgPGc+CiAgICAgICAgPGxpbmUgeDE9IjEzLjgxIiB5MT0iMjIiIHgyPSIzMC4xOSIgeTI9IjIyIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgICAgICA8cG9seWxpbmUgcG9pbnRzPSIyMy4xNCAxNC44NSAzMC4xOSAyMiAyMy4xNCAyOS4xNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICAgIDwvZz4KICAgIDwvZz4KICA8L2c+Cjwvc3ZnPg==');
    width: 44px;
    height: 44px;
    position: absolute;
    top: 7px;
    right: 7px;
}

.manga-point__quiz {
    margin-top: 50px;
}
@media (max-width: 768px) {
    .manga-point__quiz {
        margin-top: 6.6666vw;
    }
}

.manga-point__quiz__heading {
    position: relative;
    max-width: 584px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    padding-left: 115px;
    padding-top: 25px;
}
@media (max-width: 768px) {
    .manga-point__quiz__heading {
        padding-left: 0;
        padding-top: 0;
        max-width: none;
        margin-bottom: 18.6666vw;
    }
}

.manga-point__quiz__heading::before {
    content: '';
    background-image: url('/member_assets/images/page/member/p/carbon-free/manga/latest_chara.png');
    background-size: cover;
    width: 76px;
    height: 100px;
    position: absolute;
    top: 0;
    left: 25px;
}
@media (max-width: 768px) {
    .manga-point__quiz__heading::before {
        width: 14.6666vw;
        height: 19.29vw;
        position: absolute;
        top: 17.0666vw;
        left: 50%;
        transform: translateX(-50%);
    }
}

.manga-point__quiz__heading__balloon {
    position: relative;
    top: -30px;
    display: inline-block;
    background-color: #00a99d;
    color: #fff;
    padding: 13px 30px;
    border-radius: 100vw;
    font-size: 18px;
    letter-spacing: .09em;
}
@media (max-width: 768px) {
    .manga-point__quiz__heading__balloon {
        display: block;
        width: 78.4vw;
        margin-inline: auto;
        font-size: 4vw;
        padding: 3.4666vw 5.33333vw;
        top: 0;
        box-sizing: border-box;
        text-align: center;
    }
}

.manga-point__quiz__heading__balloon::before {
    content: '';
    width: 9px;
    height: 18px;
    background-color: #00a99d;
    border-radius: 0 0 100vw 100vw;
    position: absolute;
    bottom: -18px;
    left: calc(50% - 5px);
}
@media (max-width: 768px) {
    .manga-point__quiz__heading__balloon::before {
        width: 2.6666vw;
        height: 3.2vw;
        bottom: -3.2vw;
        left: calc(50% - 5px);
    }
}

.manga-point__quiz__heading__balloon::after {
    content: '';
    width: 76px;
    height: 120px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url('/member_assets/images/page/member/');
}

.manga-point__quiz__box {
    text-decoration: none !important;
    display: block;
    max-width: 584px;
    margin-inline: auto;
    position: relative;
    background-color: #d8e6b6;
    border-radius: 3px 100vw 100vw 3px;
    padding: 18px 0 18px 27px;
    box-sizing: border-box;
    transition: background-color .3s;
}
@media (max-width: 768px) {
    .manga-point__quiz__box {
        max-width: none;
        border-radius: 0;
        padding: 15px;
    }
}

.manga-point__quiz__box:hover {
    background-color: #edf2dd;
}

.manga-point__quiz__box__text {
    
}

.manga-point__quiz__box__text__label {
    font-size: 17px;
    color: #134f30;
    font-weight: 700;
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__label {
        font-size: 4vw;
        text-align: center;
    }
}

.manga-point__quiz__box__text__heading {
    font-size: 20px;
    min-height: 64px;
    color: #134f30;
    font-weight: 700;
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__heading {
        font-size: 5.3333vw;
        min-height: auto;
        text-align: center;
    }
}

.manga-point__quiz__box__text__sub {
}


.manga-point__quiz__box__text__button {
    margin-top: 10px;
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__button {
        margin-top: 2.6666vw;
        text-align: center;
    }
}

.manga-point__quiz__box__text__button__anchor {
    text-align: left;
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding-top: 2px;
    font-size: 12px;
    width: 80px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding-left: 24px;
    background-color: #fff;
    font-weight: 700;
    border-radius: 100vw;
    color: #0a6430;
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__button__anchor {
        font-size: 3.2vw;
        width: 21.33vw;
    }
}

.manga-point__quiz__box__text__button__anchor::before {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #0a6430;
    position: absolute;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__button__anchor::before {
        width: 4.8vw;
        height: 4.8vw;
    }
}

.manga-point__quiz__box__text__button__anchor::after {
    content: '';
    width: 10px;
    height: 8px;
    background-image: url('/member_assets/images/page/member/p/carbon-free/ico_arrow.svg');
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-point__quiz__box__text__button__anchor::after {
        width: 2.666vw;
        height: 2.4333vw;
        right: 1.4vw;
    }
}

.manga-point__quiz__box__image {
    width: 150px;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
}
@media (max-width: 768px) {
    .manga-point__quiz__box__image {
        width: 23.4666vw;
        top: 0;
        right: 0;
        width: 22.333vw;
    }
}

.manga-navi {
    margin-top: 50px;
}
@media (max-width: 768px) {
    .manga-navi {
        margin-top: 13.333vw;
    }
}

.manga-navi__link {
    transition: opacity .3s;
}

.manga-navi__link:hover {
    opacity: .7;
}

.manga-navi__columns {
    display: flex;
    justify-content: center;
    gap: 0 34px;
}
@media (max-width: 768px) {
    .manga-navi__columns {
        display: flex;
        justify-content: center;
        gap: 0 2.1333vw;
    }
}

.manga-navi__columns__column {
}
@media (max-width: 768px) {
    .manga-navi__columns__column {
        width: 50%;
    }
}

.manga-navi__columns__column:nth-child(1) .manga-navi__text {
    text-align: right;
    margin-right: 30px;
}
@media (max-width: 768px) {
    .manga-navi__columns__column:nth-child(1) .manga-navi__text {
        text-align: left;
        margin-right: 0;
    }
}

.manga-navi__columns__column:nth-child(2) .manga-navi__text {
    margin-left: 30px;
}
@media (max-width: 768px) {
    .manga-navi__columns__column:nth-child(2) .manga-navi__text {
        margin-left: 0;
        text-align: right;
}
}

.manga-navi__link {
    text-decoration: none !important;
}

.manga-navi__text {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .09em;
}
@media (max-width: 768px) {
    .manga-navi__text {
        font-size: 4.2666vw;
    }
}

.manga-navi__box {
    margin-top: 10px;
    position: relative;
    background-color: #163d70;
    color: #ffffff;
    border-radius: 100vw;
    padding: 7px 30px 7px;
    width: 296px;
    box-sizing: border-box;
    transition: opacity .3s;
}
@media (max-width: 768px) {
    .manga-navi__box {
        margin-top: 2.6666vw;
        padding: 5.3333vw;
        width: auto;
        border-radius: 1.3333vw;
    }
}

.manga-navi__box:hover {
    opacity: .8;
}

.manga-navi__box__text {

}

.manga-navi__box__text__label {
    line-height: 1 !important;
    color: #fff;
    font-size: 10px;
    letter-spacing: 0.03em;
    font-family: "Dela Gothic One", system-ui;
    font-weight: 400;
    margin-bottom: 2px;
}
@media (max-width: 768px) {
    .manga-navi__box__text__label {
        font-size: 2.6666vw;
        text-align: center;
    }
}

.manga-navi__box__text__heading {
    font-size: 14px;
    font-weight: 700;
}
@media (max-width: 768px) {
    .manga-navi__box__text__heading {
        text-align: center;
        font-size: 4.2666vw;
        margin-top: 1.3333vw;
        min-height: 13.8666vw;
    }
}

.manga-navi__box__text__sub-heading {
    font-size: 10px;
    letter-spacing: 0.09em;
    margin-top: -1px;
}
@media (max-width: 768px) {
    .manga-navi__box__text__sub-heading {
        text-align: center;
        font-size: 2.6666vw;
        margin-top: 1.3333vw;
    }
}

.manga-navi__box__image {
    width: 58px;
    position: absolute;
    top: 3px;
    right: 3px;
}
@media (max-width: 768px) {
    .manga-navi__box__image {
        position: static;
        width: 21.3333vw;
        margin-inline: auto;
        margin-top: 10px;
    }
}