*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,
body{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
}

body{
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Noto Sans JP",
        sans-serif;

    background:#f8dcc7;
    color:#333;
    line-height:1.6;
}


/* ==================================================
   全体
================================================== */

.container{
    width:min(1200px, calc(100vw - 24px)) !important;
    max-width:1200px !important;

    margin:20px auto !important;

    background:#fffaf7;

    padding:30px;

    border-radius:22px;

    box-shadow:
        0 8px 25px rgba(0,0,0,.08);
}


/* ==================================================
   ページタイトル
================================================== */

.pageTitle{
    margin:0;

    text-align:center;

    font-size:2.2rem;

    line-height:1.3;

    font-weight:800;

    color:#e66f4d;

    letter-spacing:.03em;
}


.betaTitle{
    text-align:center;

    margin-top:5px;
    margin-bottom:20px;

    color:#777;

    font-size:.82rem;

    line-height:1.5;
}


/* ==================================================
   追従メニュー
================================================== */

.stickyMenu{
    position:sticky;

    top:0;

    z-index:9990;

    display:flex;

    justify-content:center;
    align-items:stretch;

    width:100vw !important;
    max-width:none !important;

    margin-left:0;

    background:#fff;

    border-bottom:2px solid #f0d6a8;

    box-shadow:
        0 2px 8px rgba(0,0,0,.08);
}


.stickyMenu a{
    flex:1 1 0;

    max-width:360px;

    display:flex;

    align-items:center;
    justify-content:center;

    min-height:50px;

    padding:7px 8px;

    color:#333;

    font-size:17px;

    font-weight:bold;

    line-height:1.25;

    text-align:center;

    text-decoration:none;

    border-right:1px solid #eee;
}


.stickyMenu a:last-child{
    border-right:none;
}


.stickyMenu a:hover{
    background:#fff4dc;
}


/* ==================================================
   線画をつくる 3分岐
================================================== */

.lineChoiceSection{
    scroll-margin-top:70px;

    margin:22px auto 28px;

    padding:0 8px;
}


.lineChoiceTitle{
    margin:0 0 14px;

    text-align:center;

    font-size:25px;

    line-height:1.4;
}


.lineChoiceButtons{
    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:12px;
}


.lineChoiceButton{
    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:center;

    min-height:92px;

    padding:14px 10px;

    box-sizing:border-box;

    border-radius:14px;

    border:2px solid #f3bd55;

    background:#fff4dc;

    color:#333;

    font-size:19px;

    font-weight:bold;

    line-height:1.35;

    text-align:center;

    text-decoration:none;
}


.lineChoiceButton:hover{
    opacity:.9;
}


.lineChoiceButton:nth-child(1){
    background:#fff8f4;

    border-color:#f3c2ad;
}


.lineChoiceButton:nth-child(2){
    background:#eef9ff;

    border-color:#75c9ed;
}


.lineChoiceButton:nth-child(3){
    background:#fff8e8;

    border-color:#f2c35e;
}


.lineChoiceSub{
    margin-top:4px;

    font-size:13px;

    font-weight:normal;
}


/* ==================================================
   ページ内リンク
================================================== */

#toolCharacter,
#toolOther,
#aiSection,
#howToUse,
#tipsSection,
#usageNote{
    scroll-margin-top:80px;
}


/* ==================================================
   線画作成エリア 色
================================================== */

#toolCharacter{
    background:#fff8f4 !important;

    border-color:#f3c2ad !important;
}


#toolOther{
    background:#eef9ff !important;

    border-color:#75c9ed !important;
}


#aiSection{
    background:#fff8e8 !important;

    border-color:#f2c35e !important;
}


/* ==================================================
   ツール見出しアイコン
================================================== */

.toolTitleIcon{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:42px;
    height:42px;

    margin-right:6px;

    border-radius:50%;

    background:#fff;

    font-size:25px;

    vertical-align:middle;
}


/* ==================================================
   サンプル画像カルーセル
================================================== */

.sampleCarousel{
    width:100%;

    overflow:hidden;

    position:relative;

    border-radius:18px;

    background:#fff;
}


.sampleTrack{
    display:flex;

    width:500%;
}


.sampleSlide{
    flex:0 0 20%;

    width:20%;

    min-width:20%;
}


.sampleSlide img{
    display:block;

    width:100%;

    height:auto;

    margin:0;

    border-radius:18px;

    box-shadow:
        0 6px 18px rgba(0,0,0,.10);

    user-select:none;

    -webkit-user-drag:none;
}


/* ==================================================
   カルーセルコメント
================================================== */

.slideComment{
    margin:8px 0 18px;

    text-align:center;

    color:#e66f4d;

    font-size:.95rem;

    font-weight:bold;
}


/* ==================================================
   使い方
================================================== */

.howToUse{
    scroll-margin-top:80px;

    margin:28px auto 30px;

    padding:24px 20px;

    background:#fff;

    border:2px solid #e9d9c8;

    border-radius:18px;

    text-align:center;
}


.howToMain{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:15px;
}


.howToIcon{
    font-size:38px;

    flex:0 0 auto;
}


.howToText{
    margin:0;

    font-size:20px;

    font-weight:bold;

    line-height:1.6;
}


.howToImage{
    display:block;

    width:100%;

    max-width:900px;

    height:auto;

    margin:22px auto 10px;

    border-radius:12px;
}


.howToTip{
    margin:20px 0 12px;

    font-size:25px;

    font-weight:bold;

    line-height:1.5;

    color:#e87545;
}


.promiseLink{
    display:block;

    margin:16px auto 0;

    font-size:22px;

    font-weight:bold;

    line-height:1.5;

    color:#e87545;

    text-decoration:underline;
}


/* ==================================================
   色ぬりボタン
================================================== */

.coloringSection{
    margin-top:20px;

    margin-bottom:4px;

    text-align:center;
}


.coloringButton{
    display:block;

    width:100%;

    border:2px solid #f3bd55;

    border-radius:16px;

    background:#fff4dc;

    color:#333;

    padding:18px 12px;

    font-size:23px;

    font-weight:bold;

    cursor:pointer;
}


.coloringButton:hover{
    opacity:.9;
}


/* ==================================================
   線画メーカー
================================================== */

.toolArea{
    width:100%;
}


.toolCards{
    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:16px;

    margin-top:10px;
}


.toolCard{
    background:#fff;

    border:2px solid #f3c7b1;

    border-radius:16px;

    padding:20px 16px;

    text-align:center;
}


.toolCard h2{
    margin:0 0 10px;

    font-size:1.25rem;

    line-height:1.4;

    color:#333;
}


.toolCard p{
    font-size:.95rem;

    margin-bottom:14px;
}


/* ==================================================
   ファイル選択
================================================== */

.uploadBox{
    text-align:center;

    margin:16px 0;
}


input[type=file]{
    max-width:100%;

    font-size:16px;
}


/* ==================================================
   プレビュー
================================================== */

.preview{
    text-align:center;

    margin:12px 0;
}


#previewImage,
#previewImage2{
    display:none;

    max-width:100%;

    height:auto;

    margin:0 auto;

    border-radius:12px;

    box-shadow:
        0 4px 12px rgba(0,0,0,.12);
}


/* ==================================================
   ボタン
================================================== */

.buttonArea{
    text-align:center;

    margin:16px 0 8px;
}


button{
    min-height:54px;

    background:#f27b4d;

    color:#fff;

    border:none;

    padding:13px 30px;

    border-radius:12px;

    font-size:18px;

    font-weight:bold;

    cursor:pointer;

    transition:.15s;

    box-shadow:
        0 3px 7px rgba(0,0,0,.12);
}


button:hover{
    background:#e9673b;

    transform:translateY(-1px);
}


button:active{
    transform:translateY(1px);
}


.secondToolButton{
    background:#f27b4d;
}


.secondToolButton:hover{
    background:#e9673b;
}


/* ==================================================
   生成結果
================================================== */

#resultArea,
#resultArea2{
    margin-top:20px;

    text-align:center;
}


#resultArea img,
#resultArea2 img{
    display:block;

    max-width:100%;

    height:auto;

    margin:15px auto;

    border-radius:12px;
}


/* ==================================================
   保存ボタン
================================================== */

.saveButton{
    display:block;

    width:100%;

    max-width:360px;

    margin:14px auto 6px;

    background:#6f9f6f;

    color:#fff;
}


.saveButton:hover{
    background:#5d8c5d;
}


/* ==================================================
   生成中
================================================== */

.generatingMessage{
    margin:18px auto;

    padding:15px;

    background:#fff7e9;

    border-radius:12px;

    text-align:center;

    font-weight:bold;

    color:#e66f4d;
}


/* ==================================================
   AIプロンプト
================================================== */

.aiSection{
    margin-top:25px;

    padding:26px 20px;

    border:2px solid #f2c35e;

    border-radius:18px;

    text-align:center;
}


.aiSection h2{
    margin:0 0 14px;

    font-size:25px;

    line-height:1.5;
}


.aiSection p{
    margin:0 auto 20px;

    font-size:17px;

    line-height:1.8;
}


.aiButton{
    display:inline-block;

    font-size:26px !important;

    font-weight:bold;

    padding:14px 30px;

    background:#ff7048;

    color:#fff !important;

    border-radius:12px;

    text-decoration:none !important;

    box-shadow:
        0 4px 8px rgba(0,0,0,.18);
}


.aiButton:hover{
    opacity:.9;
}


/* ==================================================
   うまく作るには？
================================================== */

.tips{
    scroll-margin-top:80px;

    margin-top:35px;
}


.tipsTitle{
    margin:0 0 8px;

    text-align:center;

    font-size:30px;

    line-height:1.4;
}


.tipsIntro{
    margin:-2px auto 24px;

    text-align:center;

    font-size:16px;

    line-height:1.7;
}


.tipBlock{
    margin:0 auto 24px;

    padding:22px 18px;

    background:#fff;

    border:1px solid #e5ddd6;

    border-radius:16px;

    text-align:center;
}


.tipBlock h3{
    margin:0 0 10px;

    font-size:21px;

    line-height:1.5;
}


.tipBlock p{
    margin:0 auto 16px;

    font-size:15px;

    line-height:1.7;
}


.tipThumbRow{
    display:flex;

    align-items:center;
    justify-content:center;

    gap:10px;

    flex-wrap:nowrap;
}


.tipThumb{
    flex:1 1 0;

    min-width:0;

    max-width:220px;

    text-align:center;

    cursor:pointer;
}


.tipThumb img{
    display:block;

    width:100%;

    height:auto;

    border-radius:8px;

    transition:opacity .2s;
}


.tipThumb:hover img{
    opacity:.8;
}


.tipThumb span{
    display:block;

    margin-top:5px;

    font-size:13px;

    line-height:1.4;
}


.tipArrow{
    flex:0 0 auto;

    font-size:20px;

    font-weight:bold;
}


.tipThreeImages{
    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    flex-wrap:nowrap;
}


.tipThreeImages .tipThumb{
    flex:1 1 0;

    min-width:0;

    max-width:220px;
}


.tipThreeImages .tipArrow{
    flex:0 0 auto;
}


.tipPoint{
    margin-top:15px;

    padding:10px;

    background:#fff8e8;

    border-radius:10px;

    font-size:15px;

    font-weight:bold;

    line-height:1.6;
}


.tipsEnd{
    margin:30px auto 0;

    text-align:center;

    font-size:17px;

    font-weight:bold;

    line-height:1.8;
}


/* ==================================================
   おやくそく
================================================== */

.usageNote{
    scroll-margin-top:80px;

    margin-top:30px;

    padding:28px 24px 30px;

    background:#fffaf5;

    border:2px solid #f3c7b1;

    border-radius:18px;
}


.usageNote .tipsTitle{
    margin-bottom:8px;

    font-size:30px;
}


.usageNoteIntro{
    margin:-2px auto 20px;

    text-align:center;

    font-size:16px;

    line-height:1.7;

    color:#555;
}


.usageNote ul{
    margin:0 auto 20px;

    padding:18px 28px 18px 48px;

    background:#fff;

    border:1px solid #f3c7b1;

    border-radius:14px;

    line-height:1.8;
}


.usageNote li{
    margin-bottom:10px;
}


.usageNote li:last-child{
    margin-bottom:0;
}


.usageFinal{
    margin:0;

    padding:14px;

    text-align:center;

    font-weight:bold;

    line-height:1.6;
}


/* ==================================================
   もっと楽しむ・便利にする
================================================== */

.moreSection,
.siteInfoSection{
    margin:40px auto 30px;

    padding:28px 24px 32px;

    border-radius:18px;

    text-align:center;
}


.moreSection{
    background:#fff8e9;

    border:2px solid #f3bd55;
}


.siteInfoSection{
    background:#fff;

    border:2px solid #f0cdbb;
}


.moreSection h2,
.siteInfoSection h2{
    margin:0 0 22px;

    font-size:27px;

    line-height:1.4;
}


.moreButtons,
.siteInfoButtons{
    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:14px;
}


.moreButton,
.siteInfoButton{
    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:center;

    min-height:76px;

    padding:12px 10px;

    box-sizing:border-box;

    border-radius:14px;

    border:2px solid #f3bd55;

    background:#fff;

    color:#333;

    font-size:17px;

    font-weight:bold;

    line-height:1.35;

    text-align:center;

    text-decoration:none;

    cursor:pointer;
}


.moreButton span,
.siteInfoButton span{
    margin-top:4px;

    font-size:12px;

    font-weight:normal;
}


.moreButton:hover,
.siteInfoButton:hover{
    opacity:.9;
}


.moreButtonDisabled,
.siteInfoPlaceholder{
    border-color:#ddd;

    background:#f7f7f7;

    color:#777;

    cursor:default;
}


.siteInfoButtons{
    grid-template-columns:
        repeat(4,1fr);
}


.supportButton{
    border-color:#e87545;
}


.bottomSupportNote{
    grid-column:1 / -1;

    margin:2px auto 0;

    padding:4px 0 0;
}


/* ==================================================
   最下部リンク
================================================== */

.bottomLinks{
    margin-top:35px;

    padding-top:10px;

    display:flex;

    justify-content:center;
    align-items:flex-start;

    gap:20px;
}


.bottomLink{
    display:block;

    flex:1 1 0;

    max-width:420px;
}


.bottomLink img{
    display:block;

    width:100%;

    height:auto;

    border-radius:12px;

    box-shadow:
        0 3px 10px rgba(0,0,0,.12);

    transition:opacity .2s;
}


.bottomLink:hover img{
    opacity:.9;
}


/* ==================================================
   画像ポップアップ共通
================================================== */

.imageModal{
    display:none;

    position:fixed;

    z-index:99999;

    left:0;
    top:0;

    width:100%;
    height:100%;

    background:rgba(0,0,0,.78);

    padding:15px;

    box-sizing:border-box;

    align-items:center;
    justify-content:center;
}


.imageModal.open{
    display:flex;
}


.imageModalContent{
    position:relative;

    width:min(1000px,100%);

    max-height:95vh;

    background:#fff;

    border-radius:14px;

    padding:20px 55px;

    box-sizing:border-box;

    text-align:center;

    overflow:hidden;
}


.imageModalTitle{
    margin:0 0 12px;

    font-size:21px;

    line-height:1.4;
}


.imageModalSlide{
    display:none;
}


.imageModalSlide.active{
    display:block;
}


.imageModalImage{
    display:block;

    width:100%;

    max-width:850px;

    max-height:76vh;

    height:auto;

    margin:0 auto;

    object-fit:contain;

    border-radius:8px;
}


.imageModalClose{
    position:absolute;

    top:7px;
    right:12px;

    width:42px;
    height:42px;

    border:none;

    border-radius:50%;

    background:#fff;

    font-size:30px;

    line-height:1;

    cursor:pointer;

    z-index:5;
}


.imageModalArrow{
    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:44px;

    height:54px;

    border:none;

    border-radius:10px;

    background:rgba(255,255,255,.9);

    font-size:28px;

    font-weight:bold;

    cursor:pointer;

    z-index:5;
}


.imageModalPrev{
    left:7px;
}


.imageModalNext{
    right:7px;
}


.imageModalDots{
    display:flex;

    justify-content:center;

    gap:8px;

    margin-top:12px;
}


.imageModalDot{
    width:9px;

    height:9px;

    padding:0;

    border:none;

    border-radius:50%;

    background:#ccc;

    cursor:pointer;
}


.imageModalDot.active{
    background:#555;
}


/* ==================================================
   AdSense
================================================== */

.displayAd{
    width:100%;

    margin:30px auto 20px;

    text-align:center;
}


.displayAd .adsbygoogle{
    width:100%;
}


/* ==================================================
   スマホ
================================================== */

@media(max-width:700px){

    html,
    body{
        width:100% !important;
        max-width:none !important;
    }


    body{
        line-height:1.5;

        background:#f8dcc7;
    }


    /* ------------------------------
       追従メニュー
    ------------------------------ */

    .stickyMenu{
        width:100vw !important;
    }


    .stickyMenu a{
        min-height:46px;

        padding:5px 3px;

        font-size:13px;

        line-height:1.2;
    }


    /* ------------------------------
       全体
    ------------------------------ */

    .container{
        width:calc(100vw - 12px) !important;

        max-width:none !important;

        margin:6px auto !important;

        padding:12px;

        background:#fffaf7;

        border-radius:18px;

        box-shadow:
            0 5px 18px rgba(0,0,0,.08);
    }


    /* ------------------------------
       線画をつくる
    ------------------------------ */

    .lineChoiceSection{
        margin:18px auto 24px;

        padding:0 4px;

        scroll-margin-top:60px;
    }


    .lineChoiceTitle{
        margin-bottom:10px;

        font-size:21px;
    }


    .lineChoiceButtons{
        grid-template-columns:1fr;

        gap:9px;
    }


    .lineChoiceButton{
        min-height:66px;

        padding:10px 8px;

        font-size:18px;
    }


    .lineChoiceSub{
        font-size:12px;
    }


    #toolCharacter,
    #toolOther,
    #aiSection,
    #howToUse,
    #tipsSection,
    #usageNote{
        scroll-margin-top:65px;
    }


    /* ------------------------------
       タイトル
    ------------------------------ */

    .pageTitle{
        font-size:1.65rem;

        line-height:1.25;

        letter-spacing:.02em;
    }


    .betaTitle{
        margin-top:4px;

        margin-bottom:12px;

        font-size:.72rem;

        line-height:1.5;
    }


    /* ------------------------------
       サンプル
    ------------------------------ */

    .sampleCarousel{
        width:100%;

        overflow:hidden;

        position:relative;

        border-radius:14px;

        margin:0;
    }


    .sampleTrack{
        display:flex;

        width:500%;
    }


    .sampleSlide{
        flex:0 0 20%;

        width:20%;

        min-width:20%;
    }


    .sampleSlide img{
        display:block;

        width:100%;

        height:auto;

        border-radius:14px;

        box-shadow:
            0 4px 12px rgba(0,0,0,.10);

        user-select:none;

        -webkit-user-drag:none;
    }


    .slideComment{
        margin:7px 0 14px;

        font-size:.82rem;

        white-space:nowrap;
    }


    /* ------------------------------
       使い方
    ------------------------------ */

    .howToUse{
        margin:12px 0 15px;

        padding:20px 12px;
    }


    .howToMain{
        gap:8px;

        align-items:center;
    }


    .howToIcon{
        font-size:30px;
    }


    .howToText{
        font-size:17px;

        line-height:1.5;

        text-align:left;
    }


    .howToImage{
        width:100%;

        margin-top:18px;
    }


    .howToTip{
        margin-top:10px;

        font-size:21px;

        line-height:1.5;
    }


    .promiseLink{
        font-size:17px;
    }


    /* ------------------------------
       ツール
    ------------------------------ */

    .toolCards{
        grid-template-columns:1fr;

        gap:12px;

        margin-top:10px;
    }


    .toolCard{
        padding:15px 12px;

        border-radius:14px;
    }


    .toolCard h2{
        font-size:1.05rem;
    }


    .toolCard p{
        font-size:.86rem;
    }


    .toolTitleIcon{
        width:36px;

        height:36px;

        font-size:21px;
    }


    /* ------------------------------
       ファイル
    ------------------------------ */

    .uploadBox{
        margin:12px 0;
    }


    input[type=file]{
        font-size:14px;

        max-width:100%;
    }


    /* ------------------------------
       ボタン
    ------------------------------ */

    button{
        width:100%;

        min-height:52px;

        padding:12px 14px;

        font-size:17px;
    }


    .coloringButton{
        font-size:20px;

        padding:15px 10px;
    }


    .saveButton{
        display:block;

        width:100%;

        max-width:none;

        min-height:52px;

        margin:14px auto 6px;

        font-size:16px;
    }


    /* ------------------------------
       AI
    ------------------------------ */

    .aiSection{
        margin-top:12px;

        padding:22px 12px;

        border-radius:14px;
    }


    .aiSection h2{
        font-size:21px;
    }


    .aiSection p{
        font-size:14px;

        line-height:1.7;
    }


    .aiButton{
        font-size:22px !important;

        padding:13px 20px;
    }


    /* ------------------------------
       うまく作るには
    ------------------------------ */

    .tips{
        margin-top:14px;

        padding:10px;

        background:#fff8ec;

        border-radius:14px;
    }


    .tipsTitle{
        font-size:25px;

        line-height:1.4;

        margin-bottom:12px;
    }


    .tipsIntro{
        font-size:14px;

        line-height:1.6;
    }


    .tipBlock{
        padding:18px 10px;

        margin-bottom:10px;

        border-radius:12px;
    }


    .tipBlock h3{
        font-size:18px;

        line-height:1.45;

        margin-bottom:7px;
    }


    .tipBlock p{
        font-size:14px;

        line-height:1.5;

        margin-bottom:10px;
    }


    .tipThumbRow{
        display:flex !important;

        flex-direction:row !important;

        flex-wrap:nowrap !important;

        justify-content:center !important;

        align-items:flex-start !important;

        gap:4px !important;

        width:100% !important;

        overflow:hidden !important;
    }


    .tipThumb{
        flex:1 1 0 !important;

        min-width:0 !important;

        width:auto !important;

        max-width:none !important;
    }


    .tipThumb img{
        display:block !important;

        width:100% !important;

        max-width:100% !important;

        height:auto !important;

        margin:0 !important;

        border-radius:6px !important;

        box-shadow:
            0 2px 5px rgba(0,0,0,.10);
    }


    .tipThumb span{
        margin-top:3px;

        font-size:.58rem;

        line-height:1.3;
    }


    .tipArrow{
        flex:0 0 auto;

        font-size:.95rem;

        line-height:1;

        margin-top:25px;
    }


    .tipThreeImages{
        gap:4px;
    }


    .tipPoint{
        margin-top:7px;

        font-size:.68rem;

        line-height:1.4;
    }


    .tipsEnd{
        margin-top:6px;

        padding:9px 6px;

        font-size:.7rem;

        line-height:1.5;
    }


    /* ------------------------------
       おやくそく
    ------------------------------ */

    .usageNote{
        padding:22px 12px 24px;

        margin-top:20px;
    }


    .usageNote .tipsTitle{
        font-size:24px;
    }


    .usageNoteIntro{
        font-size:14px;

        line-height:1.6;
    }


    .usageNote ul{
        padding:16px 18px 16px 34px;

        line-height:1.7;
    }


    .usageFinal{
        font-size:14px;
    }


    /* ------------------------------
       もっと楽しむ
    ------------------------------ */

    .moreSection,
    .siteInfoSection{
        margin:30px auto 24px;

        padding:22px 12px 24px;
    }


    .moreSection h2,
    .siteInfoSection h2{
        font-size:22px;

        margin-bottom:16px;
    }


    .moreButtons,
    .siteInfoButtons{
        grid-template-columns:1fr;

        gap:10px;
    }


    .moreButton,
    .siteInfoButton{
        min-height:62px;

        font-size:17px;
    }


    .moreButton span,
    .siteInfoButton span{
        font-size:12px;
    }


    /* ------------------------------
       下部リンク
    ------------------------------ */

    .bottomLinks{
        flex-direction:column;

        gap:15px;
    }


    .bottomLink{
        width:100%;

        max-width:none;
    }


    /* ------------------------------
       ポップアップ
    ------------------------------ */

    .imageModal{
        padding:0;

        align-items:flex-start;
    }


    .imageModalContent{
        width:100%;

        max-width:100%;

        max-height:100vh;

        min-height:100vh;

        padding:48px 38px 20px;

        border-radius:0;

        display:flex;

        flex-direction:column;

        justify-content:center;
    }


    .imageModalTitle{
        font-size:17px;

        margin-bottom:10px;
    }


    .imageModalImage{
        width:100%;

        max-width:100%;

        max-height:78vh;

        border-radius:5px;
    }


    .imageModalClose{
        top:5px;

        right:5px;

        width:38px;

        height:38px;

        font-size:27px;
    }


    .imageModalArrow{
        width:38px;

        height:48px;

        font-size:24px;
    }


    .imageModalPrev{
        left:3px;
    }


    .imageModalNext{
        right:3px;
    }

}