@charset "UTF-8";

/* ↓PC（横幅640px超）の場合 */
html {
    /* 1rem = 1pxと定義 */
    font-size: 1px;
}

/* ↓スマホ（横幅640px以上）の場合 */


@media screen and (max-width: 640px) {
    html {
        font-size: .75px;
    }

}

body {
    font-size: 16rem;
    color: #000000;
    font-family: "Noto Sans JP";
    font-feature-settings: 'palt' on;
    min-width: 375px;
    position: relative;
    margin: 0 auto;
    background: #fff;
}

.maru {
    font-family: "Zen Maru Gothic", serif;
}




.inner {
    padding: 0 24px;
    margin: 0 auto;
    position: relative;
}

/* グローバルまたは共通スタイルとして定義 */
:root {
    /* Desktop SVGs */
    --tooth-svg-downward: url('data:image/svg+xml;utf8,<svg width="30" height="15" viewBox="0 0 30 15" xmlns="http://www.w3.org/2000/svg"><polygon points="0,0 15,15 30,0" fill="white"/></svg>');
    --tooth-svg-upward: url('data:image/svg+xml;utf8,<svg width="30" height="15" viewBox="0 0 30 15" xmlns="http://www.w3.org/2000/svg"><polygon points="0,15 15,0 30,15" fill="white"/></svg>');

    /* Mobile SVGs */
    --tooth-svg-downward-mobile: url('data:image/svg+xml;utf8,<svg width="22" height="11" viewBox="0 0 22 11" xmlns="http://www.w3.org/2000/svg"><polygon points="0,0 11,11 22,0" fill="white"/></svg>');
    --tooth-svg-upward-mobile: url('data:image/svg+xml;utf8,<svg width="22" height="11" viewBox="0 0 22 11" xmlns="http://www.w3.org/2000/svg"><polygon points="0,11 11,0 22,11" fill="white"/></svg>');
}

/*fv
================================================*/


#fv {
    position: relative;
    padding: 8px 0 0;
    margin: 0 auto -15px;
}

#fv::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;

    background: #058BE5 url(../img/bk_fv.png) center bottom no-repeat;
    background-size: 100% auto;

    --main-mask-fv-bottom: linear-gradient(to bottom, white calc(100% - 15px), transparent calc(100% - 15px));
    -webkit-mask-image: var(--main-mask-fv-bottom), var(--tooth-svg-common);
    mask-image: var(--main-mask-fv-bottom), var(--tooth-svg-common);
    -webkit-mask-size: 100% 100%, 30px 15px;
    mask-size: 100% 100%, 30px 15px;
    -webkit-mask-position: top left, bottom left;
    mask-position: top left, bottom left;
    -webkit-mask-repeat: no-repeat, repeat-x;
    mask-repeat: no-repeat, repeat-x;
}

#fv h1 {
    max-width: calc(1221px + 24px * 2);
    padding: 0 24px;
    margin: 0 auto;
    transform: translateY(20px);
    position: relative;
    z-index: 1;
}

#fv h1 img {
    width: 100%;
    height: auto;
    display: block;
}

@media screen and (max-width:670px) {
    @media screen and (max-width:670px) {
        #fv {
            padding: 3px 0 0;
            margin: 0 auto -11px;
        }

        #fv::before {
            background: #058BE5 url(../img/bk_fv_s.png) center bottom no-repeat;
            background-size: cover;
            --main-mask-fv-bottom-mobile: linear-gradient(to bottom, white calc(100% - 11px), transparent calc(100% - 11px));
            -webkit-mask-image: var(--main-mask-fv-bottom-mobile), var(--tooth-svg-downward-mobile);
            mask-image: var(--main-mask-fv-bottom-mobile), var(--tooth-svg-downward-mobile);
            -webkit-mask-size: 100% 100%, 22px 11px;
            mask-size: 100% 100%, 22px 11px;
        }

        #fv h1 {
            max-width: 100%;
            padding: 0;
            margin: 0 auto;
            transform: translateY(6px);
            position: relative;
            /* z-index: 1; (既存) */
        }
    }

}



/*parts
================================================*/

.btn a {
    display: block;
    max-width: 480px;
    width: 100%;
    margin: 0 auto;
    border-radius: 40px;
    border: 3px solid #FFF;
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.25);
    position: relative;
    text-align: center;
    padding: 16px;
    transition: .3s;
}

.btn a:hover {
    opacity: .75;
    transform: translateX(4px) translateY(4px);
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.25);
}

.btn a>img {
    height: 38px;
    width: auto;
}

.btn a i {
    width: 14.574px;
    height: 17px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 26px;
    margin: auto;
}

.btn a i img {
    width: 100%;
    height: auto;
}

.btn_entry a {
    background: #E63C96;
}

.btn_line a {
    background: #089114;
}

.btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 977px;
    margin: 0 auto;
}

.btns>li {
    display: flex;
    flex-direction: column;
    width: calc((100% - 17px) / 2);
    margin: 0 17px 0 0;
}

.btns>li:nth-of-type(2n) {
    margin: 0;
}

@media screen and (max-width:670px) {
    .btn a {
        border: 2.4px solid #FFF;
        box-shadow: 3.2px 3.2px 0px 0px rgba(0, 0, 0, 0.25);
        padding: 14px;
    }

    .btn a:hover {
        transform: translateX(3.2px) translateY(3.2px);
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.25);
    }

    .btn a>img {
        height: 30px;
    }

    .btn a i {
        width: 11.659px;
        height: 13.6px;
        right: 29px;
    }

    .btns {
        margin: 0 auto;
    }

    .btns>li {
        width: 100%;
        margin: 0 auto 24px;
    }

    .btns>li:nth-of-type(2n) {
        margin: 0;
    }

}

/*about
================================================*/
#about {
    /* 既存のスタイル */
    background: #FFEF31 url(../img/bk_about.png) center top no-repeat;
    background-size: 100% auto;
    color: #000;
    padding: 100px 0 90px;
    margin: 0 auto -15px;
    position: relative;

    --middle-opaque-mask-for-about: linear-gradient(to bottom,
            transparent 0px, transparent 15px,
            white 15px, white calc(100% - 15px),
            transparent calc(100% - 15px), transparent 100%);

    -webkit-mask-image:
        var(--middle-opaque-mask-for-about),
        var(--tooth-svg-upward),
        var(--tooth-svg-downward);
    mask-image:
        var(--middle-opaque-mask-for-about),
        var(--tooth-svg-upward),
        var(--tooth-svg-downward);

    -webkit-mask-size:
        100% 100%,
        30px 15px,
        30px 15px;
    mask-size:
        100% 100%,
        30px 15px,
        30px 15px;

    -webkit-mask-position:
        top left,
        15px top,
        15px bottom;
    mask-position:
        top left,
        15px top,
        15px bottom;

    -webkit-mask-repeat:
        no-repeat,
        repeat-x,
        repeat-x;
    mask-repeat:
        no-repeat,
        repeat-x,
        repeat-x;
}

#about .inner {
    max-width: calc(674px + 24px * 2);
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}

#about .txt {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 190%;
    margin: 0 0 24px;
}

#about .box {
    max-width: 637px;
    display: flex;
    padding: 16px;
    justify-content: center;
    align-items: center;
    gap: 16px;
    border-radius: 16px;
    background: #FFF;
    margin: 0 auto 20px;
}

#about .box>li:nth-of-type(1) {
    width: 49px;
}

#about .box>li:nth-of-type(2) {
    width: calc(100% - 49px);
}

#about .box>li img {
    width: 100%;
    height: auto;
}

#about .box>li p {
    color: #000;
    font-size: 16px;
    font-weight: 700;
    line-height: 170%;
}

#about .box>li p a {
    color: #000;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    transition: .3s;
}

#about .box>li p a:hover {
    opacity: .75;
}

.fig_about01 img,
.fig_about02 img,
.fig_about_s img {
    width: 100%;
    height: auto;
}

.fig_about01,
.fig_about02 {
    position: absolute;
    right: 0;
    left: 0;
    margin: 0 auto;
    bottom: 60px;
}

.fig_about01 {
    width: 189.466px;
    height: 229.75px;
    transform: translateX(-240%);
}

.fig_about02 {
    width: 169.91px;
    height: 217.992px;
    transform: translateX(270%);
}

.fig_about_s {
    display: none;
}

@media screen and (max-width:1110px) {

    .fig_about01,
    .fig_about02 {
        display: none;
    }

    .fig_about_s {
        display: block;
        max-width: 300px;
        margin: 0 auto;
        padding-bottom: 16px;
    }
}

@media screen and (max-width:670px) {
    #about {
        background: #FFEF31 url(../img/bk_about_s.png) center top no-repeat;
        background-size: 100% auto;
        padding: 90px 0 60px;
        margin: 0 auto -11px;
        --middle-opaque-mask-for-about-mobile: linear-gradient(to bottom,
                transparent 0px, transparent 11px,
                white 11px, white calc(100% - 11px),
                transparent calc(100% - 11px), transparent 100%);

        -webkit-mask-image:
            var(--middle-opaque-mask-for-about-mobile),
            var(--tooth-svg-upward-mobile),
            /* モバイル用SVGに変更 */
            var(--tooth-svg-downward-mobile);
        /* モバイル用SVGに変更 */
        mask-image:
            var(--middle-opaque-mask-for-about-mobile),
            var(--tooth-svg-upward-mobile),
            var(--tooth-svg-downward-mobile);

        -webkit-mask-size:
            100% 100%,
            22px 11px,
            22px 11px;
        mask-size:
            100% 100%,
            22px 11px,
            22px 11px;

        -webkit-mask-position:
            top left,
            11px top,
            11px bottom;
        mask-position:
            top left,
            11px top,
            11px bottom;

    }

    #about .txt {
        font-size: 15px;
    }

    #about .txt {
        font-size: 15px;
    }

    #about .box {
        padding: 12px;
        gap: 12px;
        border-radius: 12px;
        margin: 0 auto 16px;
    }

    #about .box>li:nth-of-type(1) {
        width: 36.75px;
    }

    #about .box>li:nth-of-type(2) {
        width: calc(100% - 36.75px);
    }

    #about .box>li img {
        width: 100%;
        height: auto;
    }

    #about .box>li p {
        font-size: 12px;
    }

}

/*more
================================================*/

#more {
    padding: 0px 0 140px;
    position: relative;
    margin: 0 auto -15px;
}

#more::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: #5AB800;
    --middle-opaque-mask-for-more-before: linear-gradient(to bottom,
            transparent 0px, transparent 15px,
            white 15px, white calc(100% - 15px),
            transparent calc(100% - 15px), transparent 100%);

    -webkit-mask-image:
        var(--middle-opaque-mask-for-more-before),
        var(--tooth-svg-upward),
        var(--tooth-svg-downward);
    mask-image:
        var(--middle-opaque-mask-for-more-before),
        var(--tooth-svg-upward),
        var(--tooth-svg-downward);

    -webkit-mask-size:
        100% 100%,
        30px 15px,
        30px 15px;
    mask-size:
        100% 100%,
        30px 15px,
        30px 15px;

    -webkit-mask-position:
        top left,
        top left,
        bottom left;
    mask-position:
        top left,
        top left,
        bottom left;

    -webkit-mask-repeat:
        no-repeat,
        repeat-x,
        repeat-x;
    mask-repeat:
        no-repeat,
        repeat-x,
        repeat-x;
}

#more .inner {
    position: relative;
    z-index: 1;
}

#tit_more {
    max-width: 641px;
    margin: 0 auto;
    transform: translateY(-20px);
}

#tit_more img {
    width: 100%;
    height: auto;
    display: block;
}

.fig_more01 img,
.fig_more02 img,
.fig_more_s img {
    width: 100%;
    height: auto;
}

.fig_more01,
.fig_more02 {
    position: absolute;
    right: 0;
    left: 0;
    margin: 0 auto;
}

.fig_more01 {
    width: 379.342px;
    height: 448.114px;
    transform: translateX(-115%);
    top: 30px;
}

.fig_more02 {
    width: 336.351px;
    height: 404.586px;
    transform: translateX(125%);
    top: 60px;
}

.fig_more_s {
    display: none;
}


#more .txt {
    color: #FFF;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    line-height: 190%;
    letter-spacing: 1px;
    margin: 0 0 8px;
}

#more .note {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.8px;
    margin: 0 0 42px;
}


@media screen and (max-width:1200px) {
    .fig_more01 {
        transform: translateX(-10%) scale(66%);
        top: 30px;
        right: auto;
        left: 0;
    }

    .fig_more02 {
        transform: translateX(10%) scale(66%);
        top: 60px;
        left: auto;
        right: 0;
    }

}

@media screen and (max-width:960px) {
    #tit_more {
        margin: 0 auto -30%;
        position: relative;
        z-index: 1;
    }

    .fig_more01,
    .fig_more02 {
        display: none;
    }

    .fig_more_s {
        display: block;
        max-width: calc(100% + 24px * 2);
        margin: 0 -24px;
        padding-bottom: 16px;
        position: relative;
        z-index: 2;
    }
}

@media screen and (max-width:670px) {
    #more {
        padding-bottom: 70px;
        margin: 0 auto -11px;
    }

    #more::before {
        --middle-opaque-mask-for-more-before-mobile: linear-gradient(to bottom,
                transparent 0px, transparent 11px,
                white 11px, white calc(100% - 11px),
                transparent calc(100% - 11px), transparent 100%);

        -webkit-mask-image:
            var(--middle-opaque-mask-for-more-before-mobile),
            var(--tooth-svg-upward-mobile),
            var(--tooth-svg-downward-mobile);
        mask-image:
            var(--middle-opaque-mask-for-more-before-mobile),
            var(--tooth-svg-upward-mobile),
            var(--tooth-svg-downward-mobile);

        -webkit-mask-size:
            100% 100%,
            22px 11px,
            22px 11px;
        mask-size:
            100% 100%,
            22px 11px,
            22px 11px;
    }

    #tit_more {
        width: calc(100% + 24px * 2);
        margin: 0 -24px -30%;
    }

    #more .txt {
        font-size: 15px;
        margin: 0 0 8px;
    }

    #more .note {
        font-size: 12px;
        margin: 0 0 24px;
    }

}

#flow {
    display: flex;
    flex-wrap: wrap;
    max-width: 1152px;
    margin: 0 auto 16px;
    position: relative;
}

#flow>li {
    border-radius: 24px;
    border: 3px solid #089114;
    background: #fff;
    display: flex;
    flex-direction: column;
    margin: 0 24px 24px 0;
    width: calc((100% - 24px) / 2);
}

#flow>li:nth-of-type(2n) {
    margin: 0 0 24px;
}

#flow>li h3 {
    border-radius: 18px 18px 0 0;
    background: #089114;
    padding: 12px 8px 16px 8px;
    text-align: center;
}

#flow>li h3 img {
    height: 28px;
    width: auto;
}

#flow ul {
    padding: 16px 24px 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

#flow ul>li {
    display: flex;
    flex-direction: column;
}

#flow ul>li:nth-of-type(1) {
    width: 300px;
    margin: 0 24px 0 0;
    text-align: center;
}

#flow ul>li:nth-of-type(2) {
    width: calc(100% - 300px - 24px);
}

#flow ul>li:nth-of-type(1) p {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.7;
    margin: 0 0 8px;
}

#flow ul>li:nth-of-type(1) p span {
    display: block;
    font-size: 18px;
    margin: 8px 0 0;
    font-weight: 400;
}

.arrow_b {
    width: 30px;
    margin: 0 auto 8px;
}

.arrow_b img {
    width: 100%;
    height: auto;
}

.img_flow img {
    width: 100%;
    height: auto;
}

.fig_flow01_s {
    display: none;
}

#more>.btn_entry {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    transform: translateY(50%);
    -webkit-transform: translateY(50%);
}


#more>.fig_main01 {
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(50%);
    -webkit-transform: translateY(50%);
    width: 372px;
    height: 329px;
    z-index: 10;
}

#more>.fig_main01 img {
    width: 100%;
    height: auto;
}


@media screen and (max-width:1150px) {



    #flow ul>li:nth-of-type(1) {
        width: 270px;
        margin: 0 16px 0 0;
    }

    #flow ul>li:nth-of-type(2) {
        width: calc(100% - 270px - 16px);
    }

    #flow ul>li:nth-of-type(1) p {
        font-size: 20px;
    }

    #flow ul>li:nth-of-type(1) p span {
        font-size: 14px;
    }

    .br01 {
        display: block;
    }
}

@media screen and (max-width:1090px) {}

@media screen and (max-width:960px) {
    #flow>li {
        margin: 0 0 24px 0;
        width: 100%;
    }

    #flow>li:nth-of-type(2n) {
        margin: 0 0 24px;
    }

    #flow ul>li:nth-of-type(1) {
        width: calc(100% - 200px - 16px);
        margin: 0 16px 0 0;
    }

    #flow ul>li:nth-of-type(2) {
        width: 200px;
    }
}

@media screen and (max-width:670px) {

    #flow {
        margin: 0 auto 8px;
    }

    #flow>li h3 {
        padding: 12px;
    }

    #flow>li h3 img {
        height: 21px;
        width: auto;
    }

    #flow ul>li:nth-of-type(1) {
        width: 100%;
        margin: 0 0 16px;
    }

    #flow ul>li:nth-of-type(2) {
        width: 100%;
        max-width: 200px;
        margin: 0 auto;
    }

    #flow ul>li:nth-of-type(1) p {
        font-size: 15px;
    }

    #flow ul>li:nth-of-type(1) p span {
        font-size: 12px;
    }

}

/*main
================================================*/


#main {
    padding: 70px 0 0;
    position: relative;
    color: #fff;
}

#main::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: #058BE5;
    background-image: url(../img/bk_main.png);
    background-repeat: no-repeat;
    background-position: center 82%;
    --top-clear-mask-for-main-before: linear-gradient(to bottom,
            transparent 0px, transparent 15px,
            white 15px, white 100%);

    -webkit-mask-image:
        var(--top-clear-mask-for-main-before),
        var(--tooth-svg-upward);
    mask-image:
        var(--top-clear-mask-for-main-before),
        var(--tooth-svg-upward);

    -webkit-mask-size:
        100% 100%,
        30px 15px;
    mask-size:
        100% 100%,
        30px 15px;

    -webkit-mask-position:
        top left,
        15px top;
    mask-position:
        top left,
        15px top;

    -webkit-mask-repeat:
        no-repeat,
        repeat-x;
    mask-repeat:
        no-repeat,
        repeat-x;
}

#main .inner {
    max-width: calc(1010px + 24px * 2);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}




#main ol {
    margin: 0 auto -24px;
}

#main ol li {
    max-width: 600px;
    padding: 24px 64px;
    border-radius: 24px;
    border: 3px solid #01609F;
    background: #FFF;
    color: #000;
    margin: 0 auto 24px;
}

#main ol li h3 {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    line-height: 150%;
    padding: 0 0 16px;
    border-bottom: 1px solid #000;
    margin: 0 0 16px;
}

#main ol li p {
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: 0.8px;
}

#main ol li p span {
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.7px;
    padding: 8px 0 0;
}

#main ol li p.note {
    font-size: 12px;
    font-weight: 400;
}

#terms {
    margin-bottom: 120px;
    position: relative;
}

#terms h2 {
    width: 100%;
    margin: 0 auto 32px;
    text-align: center;
}

#terms h2 img {
    height: 65px;
    width: auto;
}

.fig_terms01 img,
.fig_terms02 img,
.fig_terms_s img {
    width: 100%;
    height: auto;
}

.fig_terms01,
.fig_terms02 {
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
}

.fig_terms01 {
    width: 294px;
    height: 440.621px;
    transform: translateX(-160%);
    bottom: -190px;
}

.fig_terms02 {
    width: 281.351px;
    height: 381.098px;
    transform: translateX(160%);
    bottom: -160px;
}

.fig_terms_s {
    display: none;
}

@media screen and (max-width:1200px) {
    .fig_terms01 {
        transform: translateX(-140%) scale(66%);
        bottom: -190px;
    }

    .fig_terms02 {
        transform: translateX(140%) scale(66%);
        bottom: -160px;
    }
}

@media screen and (max-width:990px) {
    #main::before {
        background-position: center 100%;
    }

    .fig_terms01 {
        display: none;
    }

    .fig_terms02 {
        display: none;
    }

    .fig_terms_s {
        display: block;
        padding-top: 5%;
        margin-bottom: -20%;
    }
}

@media screen and (max-width:830px) {
    #main::before {
        background-position: center 200%;
    }
}

@media screen and (max-width:790px) {
    #main::before {
        background-position: center 180%;
    }
}

@media screen and (max-width:740px) {
    #main::before {
        background-position: center 170%;
    }
}

@media screen and (max-width:720px) {
    #main::before {
        background-position: center 160%;
    }
}

@media screen and (max-width:700px) {
    #main::before {
        background-position: center 150%;
    }
}



@media screen and (max-width:670px) {
    #main::before {
        background-image: url(../img/bk_main_s.png);
        background-position: center -1640px;
        --top-clear-mask-for-main-before-mobile: linear-gradient(to bottom,
                transparent 0px, transparent 11px,
                white 11px, white 100%);

        -webkit-mask-image:
            var(--top-clear-mask-for-main-before-mobile),
            var(--tooth-svg-upward-mobile);
        mask-image:
            var(--top-clear-mask-for-main-before-mobile),
            var(--tooth-svg-upward-mobile);

        -webkit-mask-size:
            100% 100%,
            22px 11px;
        mask-size:
            100% 100%,
            22px 11px;

        -webkit-mask-position:
            top left,
            11px top;
        mask-position:
            top left,
            11px top;
    }

    #main>.fig_main02 {
        width: 101px;
        height: 134px;
    }

    #terms {
        margin-bottom: 70px;
    }

    #terms h2 {
        margin: 0 auto 24px;
    }

    #terms h2 img {
        height: 49px;
        width: auto;
    }

    .fig_terms_s {
        margin-bottom: -30%;
    }


    #main ol li {
        padding-left: 16px;
        padding-right: 16px;
    }

    #main ol li h3 {
        font-size: 18.75px;
        padding-bottom: 12px;
        margin-bottom: 12px;
    }

    #main ol li p {
        font-size: 15px;
    }

    #main ol li p span {
        font-size: 12px;
    }

    #main ol li p.note {
        font-size: 12px;
    }

}

@media screen and (max-width:650px) {
    #main::before {
        background-position: center -1660px;
    }
}

@media screen and (max-width:550px) {
    #main::before {
        background-position: center -1720px;
    }
}

@media screen and (max-width:420px) {
    #main::before {
        background-position: center -1750px;
    }
}


#prize {
    padding-bottom: 100px;
    position: relative;
}

#prize .inner {
    position: relative;
}

#prize h2 {
    width: 100%;
    margin: 0 auto 60px;
    text-align: center;
}

#prize h2 img {
    height: 65px;
    width: auto;
    margin: 0 auto;
}

.present {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 60px;
    max-width: calc(860px + 90px * 2);
    margin: 0 -24px;
    padding: 0 90px;
}

.present>li {
    display: flex;
    flex-direction: column;
    width: calc((100% - 60px) / 2);
    position: relative;
}

.present>li .box {
    margin: 0 0 8px
}

.present>li .box h3 {
    border-radius: 24px 24px 0px 0px;
    background: #01609F;
    padding: 8px;
    color: #FFEF31;
    text-align: center;
    font-size: 24px;
    font-weight: 900;
    line-height: 120%;
}

.present>li .box figure img {
    width: 100%;
    height: auto;
    display: block;
}

.present>li h4 span {
    display: block;
    margin: 0 auto 8px;
    text-align: center;
}

.present>li h4 span:nth-of-type(1) {
    border-radius: 24px;
    background: #000;
    width: 200px;
    padding: 8px;
}

.present>li h4 span:nth-of-type(2) {
    color: #FFF;
    text-align: center;
    font-size: 31px;
    font-weight: 900;
    line-height: 120%;
}

.present>li p {
    color: #FFF;
    text-align: justify;
    font-size: 18px;
    font-weight: 400;
    line-height: 190%;
    letter-spacing: 0.9px;
}

.present>li p span {
    font-size: 14px;
    letter-spacing: -.01em;
    line-height: 1.3;
}

.present .badge {
    position: absolute;
    top: -90px;
    left: -90px;
    width: 169.853px;
    height: 166.239px;
    filter: drop-shadow(0px 16px 16px rgba(0, 0, 0, 0.25));
    background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="170" height="167" viewBox="0 0 170 167"><path d="M161.806 100.693C163.136 94.8282 169.853 89.3928 169.853 83.1196C169.853 76.8464 163.136 71.4218 161.806 65.5461C160.432 59.4877 164.091 51.6892 161.452 46.2216C158.78 40.6681 150.379 38.6809 146.569 33.9115C142.739 29.1207 142.664 20.4843 137.878 16.6494C133.114 12.8361 124.691 14.673 119.144 11.9875C113.683 9.34503 109.884 1.58946 103.833 0.214514C97.974 -1.11747 91.1928 4.18898 84.9266 4.18898C78.6604 4.18898 71.8791 -1.11747 66.0206 0.214514C59.969 1.58946 56.1706 9.34503 50.7092 11.9875C45.1618 14.673 36.7389 12.8361 31.9749 16.6494C27.1894 20.4735 27.1035 29.1099 23.2837 33.9115C19.4746 38.6809 11.0732 40.6681 8.40145 46.2216C5.76192 51.6892 9.43152 59.4877 8.04737 65.5461C6.71687 71.4111 0 76.8464 0 83.1196C0 89.3928 6.70614 94.8174 8.04737 100.693C9.42079 106.752 5.76192 114.55 8.40145 120.018C11.0839 125.571 19.4746 127.558 23.2837 132.328C27.1035 137.119 27.1894 145.755 31.9749 149.59C36.7389 153.403 45.1618 151.566 50.7092 154.252C56.1706 156.894 59.969 164.65 66.0206 166.025C71.8791 167.357 78.6603 162.05 84.9158 162.05C91.1713 162.05 97.9526 167.357 103.822 166.025C109.873 164.65 113.672 156.883 119.133 154.252C124.681 151.566 133.103 153.403 137.868 149.59C142.653 145.766 142.739 137.129 146.559 132.328C150.368 127.558 158.769 125.571 161.441 120.018C164.081 114.55 160.411 106.752 161.795 100.693H161.806Z" fill="%23FFEF31"/></svg>');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.present li:nth-of-type(2n) .badge {
    left: auto;
    right: -90px;
}

.present .badge>span {
    color: #01609F;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 22.651px;
    font-weight: 900;
    line-height: 1.2;
    font-feature-settings: 'palt' on, 'pkna' on;
    box-sizing: border-box;
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
}

.present .badge>span span {
    font-family: "Poppins";
    font-size: 36.651px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: -.05em;
    padding-top: 0.1em;
}

.present .badge02>span {
    font-size: 26.651px;
}

.present .badge02>span span {
    font-size: 63.651px;
}



#prize .btn_entry {
    margin-top: 90px;
}

.fig_prize01 img,
.fig_prize02 img,
.fig_prize_s img {
    width: 100%;
    height: auto;
}

.fig_prize01,
.fig_prize02 {
    position: absolute;
    bottom: -20px;
    right: 0;
    left: 0;
    margin: auto;
}

.fig_prize01 {
    width: 345.382px;
    height: 672.996px;
    transform: translateX(-140%);
}

.fig_prize02 {
    width: 407.351px;
    height: 701.827px;
    transform: translateX(100%);
}

.fig_prize_s {
    display: none;
}

@media screen and (max-width:1240px) {

    .fig_prize01,
    .fig_prize02 {
        position: absolute;
        bottom: -10%;
    }

    .fig_prize01 {
        transform: translateX(-100%) scale(66%);
    }

    .fig_prize02 {
        transform: translateX(85%) scale(66%);
    }
}

@media screen and (max-width:980px) {
    .present {
        gap: 16px;
        max-width: calc(860px + 16px * 2);
        width: 100%;
        margin: 0 auto;
        padding: 0 16px;
    }

    .present>li {
        width: calc((100% - 16px) / 2);
    }

    .present .badge {
        top: 0px;
        left: -16px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        width: 95.542px;
        height: 93.51px;
        filter: drop-shadow(0px 9px 9px rgba(0, 0, 0, 0.25));
        background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="170" height="167" viewBox="0 0 170 167"><path d="M161.806 100.693C163.136 94.8282 169.853 89.3928 169.853 83.1196C169.853 76.8464 163.136 71.4218 161.806 65.5461C160.432 59.4877 164.091 51.6892 161.452 46.2216C158.78 40.6681 150.379 38.6809 146.569 33.9115C142.739 29.1207 142.664 20.4843 137.878 16.6494C133.114 12.8361 124.691 14.673 119.144 11.9875C113.683 9.34503 109.884 1.58946 103.833 0.214514C97.974 -1.11747 91.1928 4.18898 84.9266 4.18898C78.6604 4.18898 71.8791 -1.11747 66.0206 0.214514C59.969 1.58946 56.1706 9.34503 50.7092 11.9875C45.1618 14.673 36.7389 12.8361 31.9749 16.6494C27.1894 20.4735 27.1035 29.1099 23.2837 33.9115C19.4746 38.6809 11.0732 40.6681 8.40145 46.2216C5.76192 51.6892 9.43152 59.4877 8.04737 65.5461C6.71687 71.4111 0 76.8464 0 83.1196C0 89.3928 6.70614 94.8174 8.04737 100.693C9.42079 106.752 5.76192 114.55 8.40145 120.018C11.0839 125.571 19.4746 127.558 23.2837 132.328C27.1035 137.119 27.1894 145.755 31.9749 149.59C36.7389 153.403 45.1618 151.566 50.7092 154.252C56.1706 156.894 59.969 164.65 66.0206 166.025C71.8791 167.357 78.6603 162.05 84.9158 162.05C91.1713 162.05 97.9526 167.357 103.822 166.025C109.873 164.65 113.672 156.883 119.133 154.252C124.681 151.566 133.103 153.403 137.868 149.59C142.653 145.766 142.739 137.129 146.559 132.328C150.368 127.558 158.769 125.571 161.441 120.018C164.081 114.55 160.411 106.752 161.795 100.693H161.806Z" fill="%23FFEF31"/></svg>');
        background-size: 100% 100%;
        background-repeat: no-repeat;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .present li:nth-of-type(2n) .badge {
        left: auto;
        right: -16px;
    }

    .present .badge>span {
        font-size: 12.741px;
    }

    .present .badge>span span {
        font-size: 20.616px;
    }

    .present .badge02>span {
        font-size: 15.576px;
    }

    .present .badge02>span span {
        font-size: 37.199px;
    }


    .fig_prize01,
    .fig_prize02 {
        display: none;
    }

    .fig_prize_s {
        display: block;
        padding-top: 5%;
    }
}

@media screen and (max-width:830px) {
    .present {
        gap: 60px;
        max-width: 100%;
        width: 100%;
        margin: 0 -8px;
        padding: 0 16px;
    }

    .present>li {
        width: 100%;
    }
}

@media screen and (max-width:670px) {
    #prize {
        padding-bottom: 40px;
        position: relative;
    }

    #prize h2 {
        margin: 0 auto 70px;
        text-align: center;
    }

    #prize h2 img {
        height: 118px;
        width: auto;
        margin: 0 auto;
    }

    .present {
        gap: 60px;
        margin: 0 auto;
        padding: 0 0;
    }

    .present>li .box h3 {
        border-radius: 16px 16px 0px 0px;
        background: #01609F;
        padding: 6.4px;
        font-size: 20px;
    }

    .present>li h4 span:nth-of-type(1) {
        border-radius: 19.2px;
        width: 170.5px;
        padding: 6.4px;
        font-size: 16px;
    }

    .present>li h4 span:nth-of-type(2) {
        font-size: 25px;
    }

    .present>li p {
        font-size: 15px;
    }


    .present>li p span {
        font-size: 12px;
    }

    #prize .btn_entry {
        width: calc(100% - 24px * 2);
        margin: 0 auto;
        margin-top: 40px;
    }

}


#announcement {
    padding-bottom: 90px;
}

#announcement h2 {
    margin: 0 auto 40px;
    text-align: center;
}

#announcement h2 img {
    height: 65px;
    width: auto;
}


#announcement .box ul {
    max-width: 600px;
    border-radius: 24px;
    border: 3px solid #01609F;
    background: #FFF;
    padding: 24px 8px;
    margin: 0 auto;
}

#announcement .box li {
    color: #000;
    margin: 0 0 32px;
}

#announcement .box li:nth-of-type(2) {
    margin: 0;
    position: relative;
}

#announcement .box li:nth-of-type(2)::after {
    content: "";
    display: block;
    width: 80%;
    height: 1px;
    background: #000;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    top: -16px;
}

#announcement .box li h3 {
    color: #000;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: 0.75px;
}

#announcement .box li p {
    color: #000;
    text-align: center;
    font-size: 13px;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: 0.65px;
}

#announcement .box li a {
    text-decoration: underline;
    transition: .3s;
}

#announcement .box li a:hover {
    opacity: .75;
}

@media screen and (max-width:670px) {


    #announcement {
        padding-bottom: 64px;
    }

    #announcement h2 {
        margin: 0 auto 24px;
    }

    #announcement h2 img {
        height: 49px;
        width: auto;
    }

    #announcement .box {
        max-width: 600px;
        margin: 0 auto;
        padding: 18px 12px;
        border-radius: 8px;
    }

}

@media screen and (max-width:450px) {
    .badge {
        width: 101px;
        height: 99px;
    }
}

/*info
================================================*/

#info {
    background: #095D96;
    padding: 120px 0;
}

#info .inner {
    max-width: calc(1280px + 24px * 2);
    margin: 0 auto;
}

#info h3 {
    color: #FFF;
    text-align: center;
    font-feature-settings: 'palt' on;
    font-size: 40px;
    font-weight: 900;
    line-height: 90%;
    margin: 0 auto 40px;
}

#caution {
    max-width: 803px;
    margin: 0 auto 100px;
}

#caution ul {
    padding-left: 1.25em;
    margin: 0 auto 32px;
}


#caution li {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 190%;
    list-style-type: disc;

}

#caution p {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 190%;
}

#contact p {
    color: #FFF;
    text-align: center;
    font-feature-settings: 'palt' on;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: 1.25px;
}

#contact p a {
    text-decoration: none;
    transition: .3s;
    -webkit-transition: .3s;
}

#contact p a:hover {
    opacity: .75;
}

@media screen and (max-width:670px) {
    #info {
        padding: 56px 0 64px;
    }

    #info h3 {
        font-size: 30px;
        margin: 0 auto 32px;
    }

    #caution li,
    #caution p {
        font-size: 13.5px;
    }

    #contact p {
        font-size: 18.75px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
        letter-spacing: 0.938px;
    }
}

/*footer
================================================*/
#footer {
    padding: 40px 10px;
    background: #fff;
    font-family: "Noto Sans JP", sans-serif;
}

#footer .inner {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    color: #000;
}

#footer ul {
    margin: 0 auto 0px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 40px;
}

#footer ul li {
    display: flex;
    flex-direction: column;
    margin: 0 0 40px;
}

#footer li img {
    height: 50px;
    width: auto;
}

#footer div {
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    padding: 16px 0;
    margin: 0 0 16px;
}

#footer div p:nth-of-type(1) {
    margin: 0 0 16px;
    font-size: 14px;
}

#footer div p:nth-of-type(2) {
    font-size: 12px;
}

#footer .inner>p {
    font-size: 12px;
}


/*bits
================================================*/
@media screen and (min-width:1000px) {}

.pc_none {
    display: none !important;
}

.sp_none {
    display: block !important;
}

@media screen and (max-width:670px) {
    .pc_none {
        display: block !important;
    }

    .sp_none {
        display: none !important;
    }
}

/*
@media screen and (max-width:670px) {
  dl {
    display: flex;
    flex-wrap: wrap;
  }
  dt,
  dd {
    display: flex;
    flex-direction: column;
  }
}
*/