/*######################################################################
共通設定
######################################################################*/

:root {
    --width__main-content: min(100%, 1000px);
    /* --color__accent: #FF7BAC; */
}

/* コンテンツ全体の調整 */
body {
    width: min(100%, 750px);
    margin-inline: auto;
    font-family: "Noto Sans JP","Zen+Kaku+Gothic" ;
    font-optical-sizing: auto;
    background-color: #fff;
    color: #fff;
    margin-top: 0;
}

h1 {
    margin: 0;
}

p, a, ul, ol, table {
    /* 400-768 */
    font-size: clamp(0.875rem, 0.739rem + 0.543vw, 1rem);
}

/* imgタグの調整 */
img {
    vertical-align: top;
    width: 100%;
}


/*######################################################################
コンテンツ
######################################################################*/
/*------------------------------------------------------------
cta共通
------------------------------------------------------------*/
.cta01,
.cta02,
.cta03 {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    width: 97%;
    margin-left: 1.5%;
}
/*------------------------------------------------------------
fv周り
------------------------------------------------------------*/
.fv {
    position: relative;
}
.logo {
    position: absolute;
    width: min(28.5%, 217px);
    top: 1.4%;
    left: 3.3%;
}
.cta01 {
    top: 76.8%;
}

/*------------------------------------------------------------
warry周り
------------------------------------------------------------*/
.worry {
    position: relative;
}
.cta02 {
    top: 93.9%;
}

/*------------------------------------------------------------
message周り
------------------------------------------------------------*/
.message {
    position: relative;
}
.cta03 {
    top: 68.1%;
}

/*------------------------------------------------------------
footer
------------------------------------------------------------*/
.footer {
    padding: 1.5rem 0;
    background-color: #43434f;
    color: #fff;
}
.logo_footer {
    width: 45.4%;
    margin: 0 auto; /* 左右中央揃え */
    text-align: center;
    padding-top: 1%;
}


.footer__nav {
    font-size: clamp(0.875rem, 0.765rem + 0.49vw, 1rem);
    
    ul {
        display: flex;
        justify-content: center;
        list-style: none;
        margin: 2% 0 0 0;
        padding: 0;

        li:not(:last-child)::after {
            content: "｜";
        }
    }

    a {
        text-decoration: none;
        transition: 0.2s;

        &:hover {
            color: lightgray;
        }
    }
}