@charset "UTF-8";

/*------------------------------------------------------ここからスマートフォン------------------------------------------------------*/
/*------------------------------------------------------ここからスマートフォン------------------------------------------------------*/
/*------------------------------------------------------ここからスマートフォン------------------------------------------------------*/
/*------------------------------------------------------ここからスマートフォン------------------------------------------------------*/

@media only screen and (max-width:599px) {
    body {
        background: whitesmoke;
        position: relative;
        height: 100%;
        font-family: sans-serif;
    }


    .fix_contact_btn {
        display: none;
    }

    .fix_contact_btn:hover {
        width: 60px;
        background: white;
        color: #0071bc;
    }


    .fix_top_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        font-size: 48px;
        background: #0071bc;
        color: white;
        position: fixed;
        bottom: 5vh;
        right: 5vw;
        text-decoration: none;
        border-radius: 12px;
        transition: 0.3s;
    }


    .fix_top_btn:hover {
        background: white;
        color: #0071bc;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここから------------------------------------------------------*/
    #A_Hero {
        width: 100%;
        height: 100vh;
        margin: 0 auto;
        color: white;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto;
        background-image: url("../img/hero.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: left 0 bottom 50%;
    }


    .A_catch_copy {
        font-size: 18px;
        padding: 20px 0 0 30px;
        line-height: 2;
        grid-column: 1/-1;
        grid-row: 1/-1;

    }


    .A_logo_base {
        height: 464px;
        margin: auto 0;
        grid-column: 1/-1;
        grid-row: 1/2;
        display: grid;
        align-items: center;
        justify-content: center;

    }


    .A_logo_name {
        width: 288px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }

    .A_logo_script {
        width: 288px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }


    .A_scroll_base {
        grid-column: 1/-1;
        grid-row: 3/4;
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgba(0, 118, 188, 0.9);
        text-decoration: none;
        padding: 20px 0;
    }




    @keyframes move1 {
        0% {
            transform: translateY(0%);
            opacity: 0.2;
        }


        100% {
            transform: translateY(50%);
            opacity: 1;
        }
    }

    .A_scroll_btn {
        font-size: 16px;
        color: white;
        font-weight: bold;
        text-align: center;
    }

    .fa-angle-down {
        font-weight: normal;
        font-size: 48px;
        animation: move1 1s 0.25s infinite alternate;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここまで------------------------------------------------------*/



    /*------------------------------------------------------コンセプトここから------------------------------------------------------*/
    #B_Concept {
        width: 100%;
        padding-top: 128px;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
    }

    .B_back_home_btn {
        grid-column: 1/-1;
        grid-row: 1/2;
        text-decoration: none;
        color: gray;
        padding: 10px 0;
        margin-bottom: 40px;
        font-size: 12px;
        display: flex;
        align-items: center;
        padding-left: 14px;
    }


    .B_back_home_btn:hover {
        color: black;
    }


    .fa-caret-left {
        font-size: 18px;
        padding-right: 9px;
    }

    .B_concept_base {
        width: 100%;
        grid-column: 1/-1;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
        grid-row-gap: 20px;
        justify-content: center;
        align-items: flex-start;
        margin-bottom: 128px;
    }


    .B_concept_img_circle {
        width: 195px;
        grid-column: 1/-1;
        grid-row: 1/3;
        margin: 0 auto;
    }

    .B_concept_img {
        grid-column: 1/-1;
        grid-row: 1/2;
        margin: auto;
        width: 128px;
    }


    #B_Concept .B_concept_description {
        width: 256px;
        text-align: left;
        grid-column: 1/-1;
        grid-row: 2/3;
        font-size: 18px;
        line-height: 2;
        color: #0071bc;
        display: grid;
        align-items: stretch
    }

    .B_concept_description br {
        display: none;
    }

    /*------------------------------------------------------コンセプトここまで------------------------------------------------------*/

    /*------------------------------------------------------物件一覧ここから------------------------------------------------------*/
    #C_Estate {
        background: white;
        width: 100%;
        margin: auto auto 128px auto;
        display: grid;
        grid-template-rows: auto;
    }

    .C_estate_base {
        width: 288px;
        margin: 28px auto 60px auto;
        display: grid;
        grid-template-columns: auto;
        grid-column-gap: 10px;
        grid-template-rows: auto;
        grid-row-gap: 20px;
    }

    .C_estate_title {
        width: 240px;
        margin: 0 auto;
        font-size: 24px;
        text-align: center;
        padding-top: 32px;
        padding-bottom: 10px;
        border-bottom: 3px solid black;
    }

    .C_estate_0 {
        width: 288px;
        height: 376px;
    }

    .C_estate_1 {}

    .C_estate_1 .C_estate_box {
        overflow: hidden;
        width: 288px;
        height: 158px;
        background-image: url(../estate-img/no-img.svg);
        background-position: center center;
    }


    .C_estate_form {
        padding: 20px;
        border: solid 2px whitesmoke;
    }

    .C_estate_box_number {
        font-size: 10px;
        padding-bottom: 8px;
    }

    .C_estate_box_name {
        font-size: 16px;
        padding-bottom: 8px;
    }

    .C_estate_box_address {
        font-size: 10px;
        padding-bottom: 10px;
    }


    .C_estate_box_price {
        display: flex;
        align-items: center;
        margin-bottom: 8px;

    }

    .C_estate_box_price_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_price {
        font-size: 20px;
    }


    .C_estate_box_profit {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }

    .C_estate_box_profit_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_profit {
        font-size: 20px;
    }


    .C_estate_box_detail {
        display: block;
        align-items: center;
        text-align: center;
        font-size: 12px;
        width: 248px;
        padding: 12px 0;
        background: #0071bc;
        color: white;
        border-radius: 18px;
        text-decoration: none;
        transition: 0.3s;
    }

    .C_estate_box_detail:hover {
        background: white;
        border: 1px solid #0071bc;
        color: #0071bc;
    }

    /*ここから非公開
    .more_btn1,
    .more_btn2 {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 96px auto;
        font-size: 18px;
        width: 232px;
        height: 48px;
        background: #0071bc;
        color: white;
        border-radius: 24px;
        text-decoration: none;
        text-align: center;
        grid-column: 1/-1;
        grid-row: 3/4;
        transition: 0.3s;
        list-style: none;
    }

    details summary::-webkit-details-marker {
        display: none;
    }

    .more_btn1:hover,
    .more_btn2:hover {
        background: whitesmoke;
        color: #0071bc;
    }



    .more_btn1::after {
        margin: 15px auto;
        content: "▶︎ もっと見る";
    }

    .more_btn2::after {
        margin: 15px auto;
        content: "▶︎ もっと見る";
    }


    .more_area1[open] .more_btn1::after {
        margin: 15px auto;
        content: "▼ 閉じる";
    }


    .more_area2[open] .more_btn2::after {
        margin: 15px auto;
        content: "▼ 閉じる";
    }

ここまで非公開*/




    /*------------------------------------------------------物件一覧ここまで------------------------------------------------------*/


    /*------------------------------------------------------契約のながれここから------------------------------------------------------*/
    #D_Step {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 128px;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
        display: grid;
        grid-template-rows: auto;
        padding: 28px 0;
    }

    .D_step_base {
        width: 288px;
        margin: auto;
        border-radius: 24px;
        background-color: white;
        justify-content: center;
    }

    .D_step_title {
        width: 256px;
        margin: 0 auto;
        font-size: 24px;
        text-align: center;
        padding: 32px 0 10px 0;
        border-bottom: 3px solid black;
    }

    .D_step_list {}

    .D_step_list0 {
        width: 240px;
        list-style: none;
        margin: 0 auto;
        padding: 16px 0;
        display: flex;
        flex-direction: column;
        border-bottom: 2px solid whitesmoke;
        align-items: flex-start;
        justify-content: center;
    }


    .D_step_list1 {
        margin-top: 48px;
    }

    .D_step_list5 {
        border: none;
        padding: 16px 0 96px 0;
    }

    .D_step_list_img {
        width: 72px;
        margin: 0 auto;
        margin-bottom: 28px;
    }

    .D_step_list_img_thunder {
        width: 50px;
        margin: 0 auto;
        margin-bottom: 28px;
    }

    .D_step_list_title {
        font-size: 18px;
        margin-bottom: 14px;
    }

    .D_step_list_description {
        font-size: 14px;
        line-height: 2;
    }

    /*------------------------------------------------------契約のながれここまで------------------------------------------------------*/


    /*------------------------------------------------------フッターここから------------------------------------------------------*/
    footer {
        width: 100%;
        height: auto;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
    }

    .footer_base {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 40px;
        margin: 0 auto;
        color: white;
    }

    .footer_logo {
        width: 152px;
        grid-column: 1/3;
        grid-row: 1/2;
        margin: 0 auto;
        align-items: center;
        padding-bottom: 60px;
    }


    .footer_lead_copy_base {
        width: 240px;
        font-size: 16px;
        line-height: 2;
        padding-bottom: 40px;
    }

    .footer_lead_copy {
        padding-bottom: 20px;
    }

    .footer_contact_btn {
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 240px;
        height: 36px;
        background: white;
        color: #0071bc;
        border-radius: 24px;
        text-decoration: none;
        transition: 0.3s;
    }

    .footer_contact_btn:hover {
        color: white;
        background: #0071bc;
    }

    .footer_profile_base {
        width: 240px;
    }

    .footer_profile_name {
        font-size: 16px;
        padding-bottom: 20px;
    }

    .footer_profile_address {
        font-size: 14px;
        line-height: 2;
    }

    .copy_right {
        font-size: 12px;
        grid-column: 1/3;
        text-align: center;
        padding-top: 60px;
        margin-bottom: 40px;
        color: white;
    }

    /*------------------------------------------------------フッターここまで------------------------------------------------------*/
}

/*------------------------------------------------------ここからタブレット------------------------------------------------------*/
/*------------------------------------------------------ここからタブレット------------------------------------------------------*/
/*------------------------------------------------------ここからタブレット------------------------------------------------------*/
/*------------------------------------------------------ここからタブレット------------------------------------------------------*/
@media only screen and (min-width:600px) {



    body {
        background: whitesmoke;
        font-family: sans-serif;
    }


    .fix_contact_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 120px;
        font-size: 14px;
        background: #0071bc;
        color: white;
        writing-mode: vertical-rl;
        position: fixed;
        top: 50vh;
        left: 0;
        text-decoration: none;
        border-radius: 0 14px 14px 0;
        transition: 0.3s;
    }

    .fix_contact_btn:hover {
        width: 60px;
        background: white;
        color: #0071bc;
    }


    .fix_top_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        font-size: 48px;
        background: #0071bc;
        color: white;
        position: fixed;
        bottom: 5vh;
        right: 5vw;
        text-decoration: none;
        border-radius: 12px;
        transition: 0.3s;
    }


    .fix_top_btn:hover {
        background: white;
        color: #0071bc;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここから------------------------------------------------------*/
    #A_Hero {
        width: 100%;
        height: 100vh;
        margin: 0 auto;
        color: white;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto;
        background-image: url("../img/hero.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: left 0 bottom 50%;
    }


    .A_catch_copy {
        font-size: 18px;
        padding: 20px 0 0 30px;
        line-height: 2;
        grid-column: 1/-1;
        grid-row: 1/-1;

    }


    .A_logo_base {
        height: 464px;
        margin: auto 0;
        grid-column: 1/-1;
        grid-row: 1/2;
        display: grid;
        align-items: center;
        justify-content: center;

    }


    .A_logo_name {
        width: 320px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }

    .A_logo_script {
        width: 320px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }


    .A_scroll_base {
        height: 112px;
        grid-column: 1/-1;
        grid-row: 3/4;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        background: rgba(0, 118, 188, 0.9);
        margin-top: auto;
        padding-bottom: 22px;
        text-decoration: none;
    }




    @keyframes move1 {
        0% {
            transform: translateY(0%);
            opacity: 0.2;
        }


        100% {
            transform: translateY(50%);
            opacity: 1;
        }
    }

    .A_scroll_btn {
        font-size: 16px;
        color: white;
        font-weight: bold;
        text-align: center;
    }

    .fa-angle-down {
        font-weight: normal;
        font-size: 48px;
        animation: move1 1s 0.25s infinite alternate;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここまで------------------------------------------------------*/



    /*------------------------------------------------------コンセプトここから------------------------------------------------------*/
    #B_Concept {
        width: 100%;
        height: 560px;
        padding-top: 128px;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
    }

    .B_back_home_btn {
        grid-column: 1/-1;
        grid-row: 1/2;
        text-decoration: none;
        color: gray;
        padding: 10px 0;
        margin-bottom: 40px;
        font-size: 12px;
        display: flex;
        align-items: center;
        padding-left: 58px;
    }


    .B_back_home_btn:hover {
        color: black;
    }


    .fa-caret-left {
        font-size: 18px;
        padding-right: 9px;
    }


    .B_concept_base {
        width: 100%;
        height: 424px;
        grid-column: 1/-1;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
        justify-content: center;
        margin-bottom: 128px;
    }


    .B_concept_img_circle {
        width: 424px;
        height: 424px;
        grid-column: 1/-1;
        grid-row: 1/3;
        margin: 0 auto;
    }

    .B_concept_img {
        width: 192px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 1/2;
        margin: 0 auto;
    }


    #B_Concept .B_concept_description {
        grid-column: 1/-1;
        grid-row: 2/3;
        text-align: center;
        font-size: 24px;
        line-height: 2;
        color: #0071bc;
    }

    #B_Concept br {}

    /*------------------------------------------------------コンセプトここまで------------------------------------------------------*/

    /*------------------------------------------------------物件一覧ここから------------------------------------------------------*/
    #C_Estate {
        background: white;
        width: 720px;
        margin: 128px auto;
        border-radius: 24px;
        display: grid;
        grid-template-rows: auto auto;
    }

    .C_estate_base {
        width: 592px;
        margin: 114px auto 60px auto;
        display: grid;
        grid-template-columns: auto auto;
        grid-column-gap: 10px;
        grid-template-rows: auto;
        grid-row-gap: 20px;
    }

    .C_estate_title {
        width: 536px;
        margin: 0 auto;
        font-size: 36px;
        text-align: center;
        padding-top: 128px;
        padding-bottom: 40px;
        border-bottom: 3px solid black;
    }

    .C_estate_0 {
        width: 288px;
        height: 376px;
    }

    .C_estate_1 {}

    .C_estate_1 .C_estate_box {
        overflow: hidden;
        width: 288px;
        height: 158px;
        background-image: url(../estate-img/no-img.svg);
        background-position: center center;
    }


    .C_estate_form {
        padding: 20px;
        border: solid 2px whitesmoke;
    }

    .C_estate_box_number {
        font-size: 10px;
        padding-bottom: 8px;
    }

    .C_estate_box_name {
        font-size: 16px;
        padding-bottom: 8px;
    }

    .C_estate_box_address {
        font-size: 10px;
        padding-bottom: 10px;
    }


    .C_estate_box_price {
        display: flex;
        align-items: center;
        margin-bottom: 8px;

    }

    .C_estate_box_price_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_price {
        font-size: 20px;
    }


    .C_estate_box_profit {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }

    .C_estate_box_profit_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_profit {
        font-size: 20px;
    }


    .C_estate_box_detail {
        display: block;
        align-items: center;
        text-align: center;
        font-size: 12px;
        width: 248px;
        padding: 12px 0;
        background: #0071bc;
        color: white;
        border-radius: 18px;
        text-decoration: none;
        transition: 0.3s;
    }

    .C_estate_box_detail:hover {
        background: white;
        border: 1px solid #0071bc;
        color: #0071bc;
    }

    /*ここから非公開
    .more_btn1,
    .more_btn2 {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 96px auto;
        font-size: 18px;
        width: 232px;
        height: 48px;
        background: #0071bc;
        color: white;
        border-radius: 24px;
        text-decoration: none;
        grid-column: 1/-1;
        grid-row: 3/4;
        transition: 0.3s;
        list-style: none;
    }

    details summary::-webkit-details-marker {
        display: none;
    }

    .more_btn1:hover,
    .more_btn2:hover {
        background: whitesmoke;
        color: #0071bc;
    }


    .more_btn1::after {
        margin: 15px auto;
        content: "▶︎ もっと見る";
    }

    .more_btn2::after {
        margin: 15px auto;
        content: "▶︎ もっと見る";
    }


    .more_area1[open] .more_btn1::after {
        margin: 15px auto;
        content: "▼ 閉じる";
    }


    .more_area2[open] .more_btn2::after {
        margin: 15px auto;
        content: "▼ 閉じる";
    }
ここまで非公開*/


    /*------------------------------------------------------物件一覧ここまで------------------------------------------------------*/


    /*------------------------------------------------------契約のながれここから------------------------------------------------------*/
    #D_Step {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 128px;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
        display: grid;
        grid-template-rows: auto;
        padding: 28px 0;
    }

    .D_step_base {
        width: 592px;
        margin: 96px auto;
        border-radius: 24px;
        background-color: white;
        justify-content: center;
    }

    .D_step_title {
        width: 536px;
        margin: 0 auto;
        font-size: 36px;
        text-align: center;
        padding-top: 128px;
        padding-bottom: 40px;
        border-bottom: 3px solid black;
    }

    .D_step_list {}

    .D_step_list0 {
        width: 456px;
        height: 136px;
        list-style: none;
        margin: 0 auto;
        padding: 50px 0;
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto;
        grid-column-gap: 56px;
        border-bottom: 2px solid whitesmoke;
        align-items: center;
    }


    .D_step_list1 {
        margin-top: 64px;
    }

    .D_step_list5 {
        border: none;
    }

    .D_step_list_img {
        width: 96px;
        grid-column: 1/2;
        grid-row: 1/3;
        margin: auto 0;
        justify-content: center;
    }

    .D_step_list_img_thunder {
        width: 64px;
        grid-column: 1/2;
        grid-row: 1/3;
        margin: auto 16px;
        justify-content: center;
    }

    .D_step_list_title {
        font-size: 24px;
    }

    .D_step_list_description {
        font-size: 16px;
        line-height: 1.5;
    }


    /*------------------------------------------------------契約のながれここまで------------------------------------------------------*/









    /*------------------------------------------------------フッターここから------------------------------------------------------*/
    footer {
        width: 100%;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
    }

    .footer_base {
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto auto;
        width: 648px;
        padding: 40px 0;
        margin: 0 auto;
        color: white;
    }

    .footer_logo {
        width: 152px;
        grid-column: 1/3;
        grid-row: 1/2;
        margin: 0 auto;
        align-items: center;
        padding-bottom: 60px;
    }


    .footer_lead_copy_base {
        font-size: 16px;
        line-height: 2;
    }

    .footer_lead_copy {
        padding-bottom: 20px;
    }

    .footer_contact_btn {
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 248px;
        height: 36px;
        background: white;
        color: #0071bc;
        border-radius: 24px;
        text-decoration: none;
        transition: 0.3s;
    }

    .footer_contact_btn:hover {
        color: white;
        background: #0071bc;
    }

    .footer_profile_base {}

    .footer_profile_name {
        font-size: 16px;
        padding-bottom: 20px;
    }

    .footer_profile_address {
        font-size: 14px;
        line-height: 2;
    }

    .copy_right {
        font-size: 12px;
        grid-column: 1/3;
        text-align: center;
        padding-top: 60px;
        margin-bottom: 40px;
    }

    /*------------------------------------------------------フッターここまで------------------------------------------------------*/
}


/*------------------------------------------------------ここからPC------------------------------------------------------*/
/*------------------------------------------------------ここからPC------------------------------------------------------*/
/*------------------------------------------------------ここからPC------------------------------------------------------*/
/*------------------------------------------------------ここからPC------------------------------------------------------*/


@media only screen and (min-width:1025px) {

    body {
        background: whitesmoke;
        font-family: sans-serif;
    }


    .fix_contact_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 120px;
        font-size: 14px;
        background: #0071bc;
        color: white;
        writing-mode: vertical-rl;
        position: fixed;
        top: 45vh;
        left: 0;
        text-decoration: none;
        border-radius: 0 14px 14px 0;
        transition: 0.3s;
    }

    .fix_contact_btn:hover {
        width: 60px;
        background: white;
        color: #0071bc;
    }


    .fix_top_btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64px;
        height: 64px;
        font-size: 48px;
        background: #0071bc;
        color: white;
        position: fixed;
        bottom: 5vh;
        right: 5vw;
        text-decoration: none;
        border-radius: 12px;
        transition: 0.3s;
    }


    .fix_top_btn:hover {
        background: white;
        color: #0071bc;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここから------------------------------------------------------*/
    #A_Hero {
        width: 100%;
        height: 100vh;
        margin: 0 auto;
        color: white;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto;
        background-image: url("../img/hero.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: left 0 bottom 50%;
    }


    .A_catch_copy {
        font-size: 18px;
        padding: 20px 0 0 30px;
        line-height: 2;
        grid-column: 1/-1;
        grid-row: 1/-1;

    }


    .A_logo_base {
        height: 464px;
        margin: auto 0;
        grid-column: 1/-1;
        grid-row: 1/2;
        display: grid;
        align-items: center;
        justify-content: center;

    }


    .A_logo_name {
        width: 320px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }

    .A_logo_script {
        width: 320px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 2/3;
    }


    .A_scroll_base {
        height: 112px;
        grid-column: 1/-1;
        grid-row: 3/4;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        background: rgba(0, 118, 188, 0.9);
        margin-top: auto;
        padding-bottom: 22px;
        text-decoration: none;
    }




    @keyframes move1 {
        0% {
            transform: translateY(0%);
            opacity: 0.2;
        }


        100% {
            transform: translateY(50%);
            opacity: 1;
        }
    }

    .A_scroll_btn {
        font-size: 16px;
        color: white;
        font-weight: bold;
        text-align: center;
    }

    .fa-angle-down {
        font-weight: normal;
        font-size: 48px;
        animation: move1 1s 0.25s infinite alternate;
    }


    /*------------------------------------------------------ファーストビュー（メインイメージ）ここまで------------------------------------------------------*/



    /*------------------------------------------------------コンセプトここから------------------------------------------------------*/
    #B_Concept {
        width: 100%;
        height: 560px;
        padding-top: 128px;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
    }

    .B_back_home_btn {
        grid-column: 1/-1;
        grid-row: 1/2;
        text-decoration: none;
        color: gray;
        padding: 10px 0;
        margin-bottom: 40px;
        font-size: 12px;
        display: flex;
        align-items: center;
        padding-left: 58px;
    }


    .B_back_home_btn:hover {
        color: black;
    }


    .fa-caret-left {
        font-size: 18px;
        padding-right: 9px;
    }


    .B_concept_base {
        width: 100%;
        height: 424px;
        grid-column: 1/-1;
        grid-row: 2/3;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
        justify-content: center;
        margin-bottom: 128px;
    }


    .B_concept_img_circle {
        width: 424px;
        height: 424px;
        grid-column: 1/-1;
        grid-row: 1/3;
        margin: 0 auto;
    }

    .B_concept_img {
        width: 192px;
        height: auto;
        grid-column: 1/-1;
        grid-row: 1/2;
        margin: 0 auto;
    }


    #B_Concept .B_concept_description {
        grid-column: 1/-1;
        grid-row: 2/3;
        text-align: center;
        font-size: 24px;
        line-height: 2;
        color: #0071bc;
    }

    #B_Concept br {}

    /*------------------------------------------------------コンセプトここまで------------------------------------------------------*/

    /*------------------------------------------------------物件一覧ここから------------------------------------------------------*/
    #C_Estate {
        background: white;
        width: 1024px;
        height: 100%;
        margin: 128px auto;
        border-radius: 24px;
        display: grid;
        grid-template-rows: auto auto auto;
    }

    .C_estate_base {
        width: 896px;
        margin: 114px auto 60px auto;
        display: grid;
        grid-template-columns: auto auto auto;
        grid-column-gap: 10px;
        grid-template-rows: auto;
        grid-row-gap: 20px;
    }

    .C_estate_title {
        width: 536px;
        margin: 0 auto;
        font-size: 36px;
        text-align: center;
        padding-top: 128px;
        padding-bottom: 40px;
        border-bottom: 3px solid black;
    }

    .C_estate_0 {
        width: 288px;
        height: 376px;
    }

    .C_estate_1 {}

    .C_estate_1 .C_estate_box {
        overflow: hidden;
        width: 288px;
        height: 158px;
        background-image: url(../estate-img/no-img.svg);
        background-position: center center;
    }


    .C_estate_form {
        padding: 20px;
        border: solid 2px whitesmoke;
    }

    .C_estate_box_number {
        font-size: 10px;
        padding-bottom: 8px;
    }

    .C_estate_box_name {
        font-size: 16px;
        padding-bottom: 8px;
    }

    .C_estate_box_address {
        font-size: 10px;
        padding-bottom: 10px;
    }


    .C_estate_box_price {
        display: flex;
        align-items: center;
        margin-bottom: 8px;

    }

    .C_estate_box_price_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_price {
        font-size: 20px;
    }


    .C_estate_box_profit {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }

    .C_estate_box_profit_tag {
        font-size: 12px;
        width: 64px;
        text-align: center;
        padding: 6px 0;
        margin-right: 32px;
        background: #0071bc;
        color: white;
    }

    .C_estate_profit {
        font-size: 20px;
    }


    .C_estate_box_detail {
        display: block;
        align-items: center;
        text-align: center;
        font-size: 12px;
        width: 248px;
        padding: 12px 0;
        background: #0071bc;
        color: white;
        border-radius: 18px;
        text-decoration: none;
        transition: 0.3s;
    }

    .C_estate_box_detail:hover {
        background: white;
        border: 1px solid #0071bc;
        color: #0071bc;
    }

    /*ここから非公開

    .more_btn1,
    .more_btn2 {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 96px auto;
        font-size: 18px;
        width: 232px;
        height: 48px;
        background: #0071bc;
        color: white;
        border-radius: 24px;
        text-decoration: none;
        grid-column: 1/-1;
        grid-row: 3/4;
        transition: 0.3s;
        list-style: none;
    }

    details summary::-webkit-details-marker {
        display: none;
    }

    .more_btn1:hover,
    .more_btn2:hover {
        background: whitesmoke;
        color: #0071bc;
    }



    .more_btn1::after {
        margin: 0 auto;
        content: "▶︎ もっと見る";
    }

    .more_btn2::after {
        margin: 0 auto;
        content: "▶︎ もっと見る";
    }


    .more_area1[open] .more_btn1::after {
        margin: 0 auto;
        content: "▼ 閉じる";
    }


    .more_area2[open] .more_btn2::after {
        margin: 0 auto;
        content: "▼ 閉じる";
    }
ここまで非公開*/


    /*------------------------------------------------------物件一覧ここまで------------------------------------------------------*/


    /*------------------------------------------------------契約のながれここから------------------------------------------------------*/
    #D_Step {
        width: 1024px;
        height: 1696px;
        margin: 0 auto;
        margin-bottom: 128px;
        border-radius: 24px;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
        display: grid;
        grid-template-rows: auto auto;
    }

    .D_step_base {
        width: 768px;
        height: 1504px;
        margin: 96px auto;
        border-radius: 24px;
        background-color: white;
        justify-content: center;
    }

    .D_step_title {
        width: 536px;
        margin: 0 auto;
        font-size: 36px;
        text-align: center;
        padding-top: 128px;
        padding-bottom: 40px;
        border-bottom: 3px solid black;
    }

    .D_step_list {}

    .D_step_list0 {
        width: 456px;
        height: 136px;
        list-style: none;
        margin: 0 auto;
        padding: 50px 0;
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto;
        grid-column-gap: 56px;
        border-bottom: 2px solid whitesmoke;
        align-items: center;
    }


    .D_step_list1 {
        margin-top: 64px;
    }

    .D_step_list5 {
        border: none;
    }

    .D_step_list_img {
        width: 96px;
        grid-column: 1/2;
        grid-row: 1/3;
        margin: auto 0;
        justify-content: center;
    }

    .D_step_list_img_thunder {
        width: 64px;
        grid-column: 1/2;
        grid-row: 1/3;
        margin: auto 16px;
        justify-content: center;
    }

    .D_step_list_title {
        font-size: 24px;
    }

    .D_step_list_description {
        font-size: 16px;
        line-height: 1.5;
    }

    /*------------------------------------------------------契約のながれここまで------------------------------------------------------*/









    /*------------------------------------------------------フッターここから------------------------------------------------------*/
    footer {
        width: 100%;
        height: 480px;
        background: rgb(0, 113, 188);
        background: linear-gradient(90deg, rgba(0, 113, 188, 1) 0%, rgba(255, 123, 172, 1) 100%);
    }

    .footer_base {
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto auto;
        width: 648px;
        height: 400px;
        padding: 40px 0;
        margin: 0 auto;
        color: white;
    }

    .footer_logo {
        width: 152px;
        grid-column: 1/3;
        grid-row: 1/2;
        margin: 0 auto;
        align-items: center;
        padding-bottom: 60px;
    }


    .footer_lead_copy_base {
        font-size: 16px;
        line-height: 2;
    }

    .footer_lead_copy {
        padding-bottom: 20px;
    }

    .footer_contact_btn {
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 248px;
        height: 36px;
        background: white;
        color: #0071bc;
        border-radius: 24px;
        text-decoration: none;
        transition: 0.3s;
    }

    .footer_contact_btn:hover {
        color: white;
        background: #0071bc;
    }

    .footer_profile_base {}

    .footer_profile_name {
        font-size: 16px;
        padding-bottom: 20px;
    }

    .footer_profile_address {
        font-size: 14px;
        line-height: 2;
    }

    .copy_right {
        font-size: 12px;
        grid-column: 1/3;
        text-align: center;
        padding-top: 60px;
        margin-bottom: 40px;
    }

    /*------------------------------------------------------フッターここまで------------------------------------------------------*/
}