@charset 'UTF-8';
@import url( //fonts.googleapis.com/earlyaccess/notosansjapanese.css );

.mo { display : none; }
@media only screen and (max-width: 767px){
    .pc { display : none; }
    .mo { display : block; }
}

#top {
    color          : #fff;
    font-family    : "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",
                     "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.logo1 {
    margin-bottom  : 60px !important;
}

.txt1 {
    font-size      : 2em;
    font-weight    : normal;
    letter-spacing : 0.1em;
    line-height    : 1.75em;
    margin-bottom  : 34px !important;
}
@media only screen and (max-width: 767px){
    .txt1 {
        font-size      : 1.2em;
        line-height    : 1.65em;
    }
}

.txt2 {
    font-size      : 1.05em;
    font-weight    : normal;
    letter-spacing : 0.18em;
    line-height    : 2.1em;
}
@media only screen and (max-width: 767px){
    .txt2 {
        font-size      : 0.8em;
        line-height    : 1.65em;
        padding        : 0 5%;
        text-align     : left !important;
    }
}

@media only screen and (max-width: 767px){
    .block_local .ttl {
        margin-bottom  : 0 !important;
    }
    .pttl {
        margin-bottom  : 65px !important;
    }
    .pttl img {
        max-width      : 70%;
    }
}

.ttl {
    color          : #200;
    font-size      : 1.5em;
    font-weight    : bold;
    letter-spacing : 0.2em;
    text-shadow    :  1px  1px 0 rgba( 255, 255, 255, 0.5 ),
                     -1px -1px 0 rgba( 255, 255, 255, 0.5 ),
                     -1px  1px 0 rgba( 255, 255, 255, 0.5 ),
                      1px -1px 0 rgba( 255, 255, 255, 0.5 ),
                      0px  1px 0 rgba( 255, 255, 255, 0.5 ),
                      0px -1px 0 rgba( 255, 255, 255, 0.5 ),
                     -1px  0px 0 rgba( 255, 255, 255, 0.5 ),
                      1px  0px 0 rgba( 255, 255, 255, 0.5 );
}

.sttl {
    color          : #fff;
    font-size      : 1.5em;
    font-weight    : bold;
    letter-spacing : 0.2em;
    line-height    : 2.5em;
    margin-bottom  : 20px !important;
    text-shadow    :  1px  1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px -1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px  1px 0 rgba( 0, 0, 0, 0.5 ),
                      1px -1px 0 rgba( 0, 0, 0, 0.5 ),
                      0px  1px 0 rgba( 0, 0, 0, 0.5 ),
                      0px -1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px  0px 0 rgba( 0, 0, 0, 0.5 ),
                      1px  0px 0 rgba( 0, 0, 0, 0.5 );
}

.desc {
    color          : #fff;
    font-weight    : bold;
    line-height    : 2em;
    text-shadow    :  1px  1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px -1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px  1px 0 rgba( 0, 0, 0, 0.5 ),
                      1px -1px 0 rgba( 0, 0, 0, 0.5 ),
                      0px  1px 0 rgba( 0, 0, 0, 0.5 ),
                      0px -1px 0 rgba( 0, 0, 0, 0.5 ),
                     -1px  0px 0 rgba( 0, 0, 0, 0.5 ),
                      1px  0px 0 rgba( 0, 0, 0, 0.5 );
}

.concept h3 img {
    height         : auto;
    width          : 240px;
}


.contact {
    font-size      : 1.3em;
    margin-bottom  : 20px;
}

.contact > a {
    color          : #fff;
}

#top .concept, 
#top .vision,
#top .community, 
#top .urban {
    background-size: cover;
}










/*----------------------------------------------------------------------------*/
/*  ポップアップ                                                              */
/*----------------------------------------------------------------------------*/
.popup-mo {
    display        : none;
}

.popup {
    background     : #efefef;
    bottom         : 0;
    box-shadow     : 0 0 0 9999px rgba(0, 0, 0, .8);
    color          : #200;
    height         : 95vh;
    left           : 0;
    margin         : auto;
    opacity        : 0;
    overflow-y     : scroll;
    position       : fixed;
    right          : 0;
    top            : 0;
    transition     : .8s;
    visibility     : hidden;
    width          : 80vw;
    max-width      : 700px;
}

#popup-on {
    visibility     : hidden;
    opacity        : 0;
}

#popup-on:checked + .popup {
    visibility     : visible;
    opacity        : 1;
}

.icon-close {
    color          : #000;
    font-size      : 30px;
    padding        : 0 10px;
    position       : absolute;
    right          : 0;
    transition     : .3s;
}

.icon-close:hover {
    background     : #000;
    color          : #fff;
}

.btn-close {
    background     : #000;
    border         : solid 1px #000;
    border-radius  : 10px;
    color          : #fff;
    cursor         : pointer;
    font-weight    : bold;
    margin         : 10px auto;
    padding        : 10px;
    text-align     : center;
    transition     : .3s;
    width          : 95%;
}

.btn-close:hover {
    background     : #efefef;
    border         : solid 1px #000;
    color          : #200;
}

.btn-open {
    cursor         : pointer;
    position       : relative;
}

.popup-detail-open {
    border         : solid 2px #fff;
    border-radius  : 10px;
    font-size      : 1.3em;
    font-weight    : bold;
    left           : calc( 50% - 100px );
    padding        : 3px 0;
    position       : absolute;
    text-align     : center;
    top            : -230px;
    transition     : .3s;
    width          : 200px;
}

.popup-detail-open:hover {
    background     : rgba( 255, 255, 255, 0.5 );
    cursor         : pointer;
}

.popup-content {
    margin         : 40px auto 40px auto;
    width          : 90%;
}

.popup-content img {
    display        : block;
    height         : auto;
    margin         : auto;
    width          : 80%;
}

.popup-head {
    border-bottom  : solid 1px #200;
    border-top     : solid 1px #200;
    font-family    : "Noto Sans Japanese", sans-serif;
    font-size      : 1.4em;
    line-height    : 1.4em;
    margin         : 10px 0;
    padding        : 10px 0;
    text-align     : center;
}
.popup-intro-text{
    width          : fit-content;
    margin         : auto;
}
.popup-land-price {
    background     : #fff;
    border-radius  : 20px;
    font-family    : "Noto Sans Japanese", sans-serif;
    font-size      : 1.3em;
    margin         : 20px auto;
    padding        : 10px;
    width          : 75%;
}

.popup-land-section {
    margin         : 15px;
}

.popup-land-section span {
    font-size      : 1.2em;
    font-weight    : bold;
}

.popup-land-map {
    border         : solid 1px #200;
    border-radius  : 15px;
    display        : block;
    font-family    : "Noto Sans Japanese", sans-serif;
    font-size      : 1.1em;
    margin         : 10px auto 25px;
    padding        : 10px;
    transition     : .3s;
    width          : 200px;
}

.popup-land-map:hover {
    background     : #000;
    color          : #fff;
    transition     : .3s;
}

.popup-land-outline {
    font-size      : 0.85em;
    margin         : 15px auto 25px;
    width          : 90%;
}

/*--- タブレット向け ---------------------------------------------------------*/
@media screen and ( min-width: 481px ) and ( max-width: 768px ){
}

/*--- スマホ向け -------------------------------------------------------------*/
@media screen and ( max-width: 480px ){
.popup-mo {
    display        : block;
}
.popup {
    height         : 85vh;
    top            : 2vh;
    width          : 85vw;
}
.popup-detail-open {
    border         : solid 1px #fff;
    font-size      : 1em;
    padding        : 5px 0;
    top            : -180px;
}
.popup-content img {
    width          : 95%;
}
.popup-head {
    font-size      : 1em;
    line-height    : 1.6em;
    margin-bottom  : 10px;
}
.popup-land-price {
    font-size      : 1.1em;
    width          : 95%;
}
.popup-land-outline {
    font-size      : 0.8em;
    margin         : 15px auto 25px;
    width          : 95%;
}


}