@charset "UTF-8";
/*
Theme Name: 三洋不動産テーマ
Template: xeory_extension
Description: 三洋不動産テーマ
Author: WorldUtility
Version: 1.0.0
*/

:root{
    --base: #231815;
    --blue: #005ba8;
    --lightblue:#00abeb;

    --px1: calc(100vw / 1920);

    --header-height:88px;

    --futura:"futura-pt", sans-serif;
}

.futura{
    font-family:var(--futura);
}

body,
body.home{
    color:var(--base);
    background:#FFF;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
    font-weight:500;
    opacity:0;
    transition:0.5s;
}

body:not(.home){
    padding-top:calc(12px + var(--header-height));
}

body.loaded{
    opacity:1;
}

.wrap,
body.home .wrap,
footer .wrap{
    width:100%;
    max-width:1240px;
    padding:0 20px;
    margin:0 auto;
}

.wrap.mvwrap{
    max-width:1320px;
}

/* RESET*/
p,h1,h2,h3,h4,h5,h6,li,span,small,em,dt,dd,th,td{
	line-height:1.6;
	letter-spacing:0.0125em;
	padding:0;
	margin:0;
}
a,a:hover{
    color:var(--blue);
    text-decoration:none;
}
a.nolink{
    pointer-events:none;
}
ul,ol,dl{
  padding:0;
  margin:0;
}

/* COMMON */
.center{
	text-align:center;
}
.right{
	text-align:right;
}

.flex{
	display:flex;
	flex-wrap:wrap;
}
.jc-sb{
	justify-content:space-between;
}
.jc-center{
	justify-content:center;
}
.al-center{
	align-items:center;
}
.al-end{
	align-items:flex-end;
}
.fd-row-r{
	flex-direction:row-reverse;
}
.fd-col-r{
	flex-direction:column-reverse;
}

.ps-re{
	position:relative;
}
.ps-ab{
	position:absolute;
}
.ps-fix{
	position:fixed;
}
.ps-st{
	position:sticky;
}


.vert{
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
}


/* HEADER */
.main-header{
    position:fixed;
    z-index:999998;
    top:0;
    left:0;
    width:100vw;
    height:var(--header-height);

    mix-blend-mode: multiply;
}
.main-header__wrapper{
    padding:22px 22px 0;
    display:flex;
    justify-content:space-between;
    align-items: center;
}
.main-header__logo img{
    width:240px;
}
.main-header__toggler{
    width:46px;
}

.menu-toggler{
    display:block;
    position:relative;
    width:46px;
    height:46px;
    cursor:pointer;
}
.menu-toggler span{
    position:absolute;
    left:0;
    width:100%;
    height:1px;
    background:var(--base);
    transition:all .2s;
}
.menu-toggler span:nth-of-type(1){
    top:0;
}
.menu-toggler span:nth-of-type(2){
    top:10px;
}
.menu-toggler span:nth-of-type(3){
    top:20px;
}
.menu-toggler small{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    display:flex;
    justify-content:center;
    font-size:15px;
    font-weight:100;
    font-family:var(--futura);
    color:var(--base);
}
.menu-toggler.open span:nth-of-type(1){
    top:10px;
    transform:rotate(45deg);
}
.menu-toggler.open span:nth-of-type(2){
    opacity:0;
}
.menu-toggler.open span:nth-of-type(3){
    top:10px;
    transform:rotate(-45deg);
}


/* DRAWER */
.main-drawer{
    position:fixed;
    z-index:999997;
    top:0;
    right:0;
    width:100%;
    max-width:380px;
    height:100dvh;
    padding:calc(var(--header-height) + 12px) 30px 30px;
    background:#FFF;
    transform:translateX(101%);
    transition:all .3s;
}
.main-drawer.open{
    transform:translateX(0);
}
.main-drawer__inner{
    height:100%;
    overflow-y:scroll;
     -ms-overflow-style: none;
    scrollbar-width: none;
}
.main-drawer__inner::-webkit-scrollbar {
    display:none;
}

.main-drawer__menus>li{
    border-top:1px solid var(--base);
}
.main-drawer__menus>li:last-of-type{
    border-bottom:1px solid var(--base);
}
.main-drawer__menus>li>a{
    display:block;
    padding:20px;
    font-size:18px;
    font-weight:bold;
}
.main-drawer__submenus{
    margin-left:30px;
}
.main-drawer__submenus>li{
    border-top:1px dashed var(--base);
}
.main-drawer__submenus>li>a{
    display:block;
    padding:16px;
    font-size:16px;
    font-weight:bold;
}


/* FOOTER */
.main-footer{
    padding: 130px 0 50px;
    position:relative;
    z-index:2;
    background:#FFF;
}
@media only screen and (min-width:992px){
    body.home .main-footer{
        padding-top:0;
        margin-top:-50px;
    }
}
.main-footer__contact{
    margin-bottom:130px;
}
.main-footer__contact a{
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#FFF;
    background:var(--blue);
    font-size:21px;
    font-weight:bold;
    padding:0 36px;
    width:425px;
    height:138px;
    border-radius:18px;
    filter:drop-shadow(7px 7px 5px rgba(0,0,0,0.4));
}
.main-footer__contact a::after{
    content:'';
    display:block;
    width:24px;
    height:33px;
    background:no-repeat center/contain url('assets/img/common/icon-angle.svg');
}

.main-footer__flex{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:40px;
    flex-direction:row-reverse;
    justify-content:space-between;
}
.main-footer__mainmenus{
    display:flex;
    justify-content:flex-end;
    gap:25px;
    margin-bottom:18px;
}
.main-footer__mainmenus li a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:160px;
    height:43px;
    color:#FFF;
    background:var(--blue);
    border-radius:8px;
    font-size: 13px;
    font-weight:bold;
}
.main-footer__submenus{
    display:flex;
    justify-content:flex-end;
    gap:25px;
}
.main-footer__submenus li a{
    color:var(--base);
    font-size:12px;
}

.main-footer__info{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:20px 48px;
}
.main-footer__logo img{
    width:260px;
}
.main-footer__address{
    font-size:10px;
}
.main-footer__address a{
    color:var(--base);
}

.main-footer__copyright{
    margin-top:50px;
    font-size:8px;
    text-align:right;
}


/* COMMON PARTS */
.view-more a{
    display:flex;
    width:162px;
    height:32px;
    align-items:center;
    justify-content:space-between;
    border:2px solid var(--blue);
    padding:0 10px;
    font-size:10px;
    color:var(--base);
}
.view-more.center a{
    margin:0 auto;
}
.view-more.external a::after{
    content:'';
    width:6.5px;
    height:6.5px;
    background:no-repeat center/contain url('assets/img/common/icon-external.svg');
}
.view-more.invert a{
    color:#FFF;
    background:var(--blue);
}
.view-more.invert a::after{
    filter:brightness(0) invert(1);
}


/* TOP */
.top-main{
    position: relative;
    z-index: 1;
    -ms-overflow-style: none;    /* IE, Edge 対応 */
    scrollbar-width: none;       /* Firefox 対応 */
}
.top-main::-webkit-scrollbar {  /* Chrome, Safari 対応 */
    display:none;
}

.map-wrapper{
    position:relative;
    aspect-ratio:1920/1000;
    width:100%;
}
.map-cover{
    position:absolute;
    top:0;
    left:0;
    z-index:99;
}

.map-pin{
    position:absolute;
    z-index:996;
    width:calc(29.7599 * var(--px1));
    height:calc(54.9322 * var(--px1));
    background:no-repeat center/contain url('assets/img/top/pin.svg');
    cursor:pointer;
    animation:infinite map-float linear 4s;
}
.map-pin.pin-r{
    background:no-repeat center/contain url('assets/img/top/pin-r.svg');
}

.map-pin__title{
    opacity:0;
    pointer-events:none;
    position:absolute;
    display:flex;
    align-items:center;
    justify-content:center;
    width:calc(200 * var(--px1));
    height:calc(40 * var(--px1));
    border-radius:calc(10 * var(--px1));
    color:#FFF;
    background:var(--blue);
    font-size:calc(20 * var(--px1));
    font-weight:bold;
    top:0;
    left:50%;
    transform:translate(-50%,calc(-100% - (10 * var(--px1))));
    transition:0.2s;
}
.map-pin:hover .map-pin__title{
    opacity:1;
}

@keyframes map-float{
    0%{
        transform:translateY(0) scale(1);
    }
    25%{
        transform:translateY(-30%) scale(1.2);
    }
    50%{
        transform:translateY(0) scale(1);
    }
    75%{
        transform:translateY(-30%) scale(1.2);
    }
    100%{
        transform:translateY(0) scale(1);
    }
    
}

.map-pin.pin01{
    top:60%;
    left:15%;
}
.map-pin.pin02{
    top:25%;
    left:23%;
}
.map-pin.pin03{
    top:10%;
    left:39%;
}
.map-pin.pin04{
    top:18%;
    left:46%;
}
.map-pin.pin05{
    top:72%;
    left:49.5%;
}
.map-pin.pin06{
    top:55%;
    left:78.5%;
}
.map-pin.pin07{
    top:26.8%;
    left:50.2%;
}
.map-pin.pin08{
    top:22%;
    left:58%;
}
.map-pin.pin09{
    top:12%;
    left:64.5%;
}
.map-pin.pin10{
    top:48%;
    left:72%;
}

/*
Canvas:
1980 * 1000 px
Road Angle:
33.8 deg
*/
.map-objects{
    pointer-events:none;
}
.map-car01{
    position:absolute;
    z-index:100;

    top:32%;
    left:60.4%;
    width:calc(108.3306 * var(--px1));
    height:calc(93.8032 * var(--px1));
    background:no-repeat center/contain url('assets/img/top/car01.svg');
    animation:car01 ease-in-out 16s forwards;
}
@keyframes car01{
    0%{
        /*
        transform:translateY(calc(-19.8 * var(--px1))) translateX(calc(-20 * var(--px1)));
        */
        top:32%;
        left:60.4%;
    }
    100%{
        /*
        transform:translate(0);
        */
        top:28.5%;
        left:56%;
    }
}


.map-car02{
    position:absolute;
    z-index:98;

    width:calc(66.7823 * var(--px1));
    height:calc(49.0364 * var(--px1));

    top:49%;
    left:30%;

    background:no-repeat center/contain url('assets/img/top/car02.svg');
    animation:car02 ease-out 42s forwards;
}
@keyframes car02{
    0%{
        top:12%;
        left:60%;
    }
    10%{
        top:16.5%;
        left:56.25%;
    }
    70%{
        top:43.5%;
        left:33.75%;
    }
    80%{
        top:48%;
        left:30%;
    }
    100%{
        top:48%;
        left:30%;
    }
}

.map-car03{
    position:absolute;
    z-index:98;

    width:calc(224.2317 * var(--px1));
    height:calc(171.41 * var(--px1));

    top:73%;
    left:30%;

    background:no-repeat center/contain url('assets/img/top/car03.svg');
    animation:infinite car03 ease-in-out 14s alternate;
}
@keyframes car03{
    0%{
        top:57%;
        left:16%;
    }
    15%{
        top:64.4%;
        left:22%;
    }
    65%{
        top:64.4%;
        left:22%;
    }
    80%{
        top:73%;
        left:30%;
    }
    100%{
        top:73%;
        left:30%;
    }
}

.map-car04{
    position:absolute;
    z-index:98;

    width:calc(62.2793 * var(--px1));
    height:calc(45.3345 * var(--px1));

    top:57%;
    left:80%;

    background:no-repeat center/contain url('assets/img/top/car04.svg');
    animation:car04 ease-out 24s forwards;
}
@keyframes car04{
    0%{
        top:47%;
        left:88%;
    }
    100%{
        top:57%;
        left:80%;
    }
}

.map-ppl01{
    position:absolute;
    z-index:99;

    width:calc(14.999 * var(--px1));
    height:calc(33.583 * var(--px1));

    top:27%;
    left:40%;

    background:no-repeat center/contain url('assets/img/top/ppl01.svg');
    animation:infinite ppl01 linear 10s alternate;
}
@keyframes ppl01{
    0%{
        top:28%;
        left:41%;
    }
    10%{
        top:28%;
        left:41%;
    }
    20%{
        top:28%;
        left:41%;
    }
    40%{
        top:28%;
        left:41%;
    }
    50%{
        top:28%;
        left:41%;
    }
    60%{
        top:30%;
        left:42.5%;
    }
    70%{
        top:30%;
        left:42.5%;
    }
    90%{
        top:30%;
        left:42.5%;
    }
    100%{
        top:30%;
        left:42.5%;
    }
}

.map-ppl02{
    position:absolute;
    z-index:99;

    width:calc(34.0996 * var(--px1));
    height:calc(42.8077 * var(--px1));

    top:30%;
    left:40%;

    background:no-repeat center/contain url('assets/img/top/ppl02.svg');
    animation:infinite ppl02 linear 12s alternate;
}
@keyframes ppl02{
    0%{
        top:30%;
        left:38%;
    }
    10%{
        top:30%;
        left:38%;
    }
    20%{
        top:30%;
        left:38%;
    }
    40%{
        top:30%;
        left:38%;
    }
    50%{
        top:30%;
        left:38%;
    }
    60%{
        top:30%;
        left:40%;
    }
    70%{
        top:30%;
        left:40%;
    }
    90%{
        top:30%;
        left:40%;
    }
    100%{
        top:30%;
        left:40%;
    }
}

.map-ppl03{
    position:absolute;
    z-index:99;

    width:calc(20.431 * var(--px1));
    height:calc(34.795 * var(--px1));

    top:45%;
    left:29%;

    background:no-repeat center/contain url('assets/img/top/ppl03.svg');
    animation:infinite ppl03 linear 7s alternate;
}
@keyframes ppl03{
    0%{
        top:41%;
        left:27.3%;
    }
    60%{
        top:45%;
        left:29%;
    }
}

.map-ppl04{
    position:absolute;
    z-index:99;

    width:calc(14.9118 * var(--px1));
    height:calc(30.3478 * var(--px1));

    top:28%;
    left:59%;

    background:no-repeat center/contain url('assets/img/top/ppl04.svg');
    /*animation:infinite ppl04 linear 5s alternate;*/
}
@keyframes ppl04{
    0%{
        top:28%;
        left:59%;
    }
    100%{
        top:30%;
        left:55%;
    }
}

.map-ppl05{
    position:absolute;
    z-index:99;

    width:calc(26.2809 * var(--px1));
    height:calc(44.195 * var(--px1));

    top:70%;
    left:74%;

    background:no-repeat center/contain url('assets/img/top/ppl05.svg');
    /*animation:infinite ppl05 linear 5s alternate;*/
}
@keyframes ppl05{
    0%{
        top:70%;
        left:74%;
    }
    100%{
        top:73%;
        left:73%;
    }
}
.map-ppl06{
    position:absolute;
    z-index:99;

    width:calc(24.2816 * var(--px1));
    height:calc(45.0539 * var(--px1));

    top:77%;
    left:69%;

    background:no-repeat center/contain url('assets/img/top/ppl06.svg');
    /*animation:infinite ppl06 linear 5s alternate;*/
}
@keyframes ppl06{
    0%{
        top:77%;
        left:69%;
    }
    100%{
        top:73%;
        left:76%;
    }
}

.map-ppl07{
    position:absolute;
    z-index:999;

    width:calc(31.5371 * var(--px1));
    height:calc(53.9567 * var(--px1));

    top:45%;
    left:43.5%;

    background:no-repeat center/contain url('assets/img/top/ppl07.svg');
}
.map-ppl08{
    position:absolute;
    z-index:99;

    width:calc(16.8639 * var(--px1));
    height:calc(37.0804 * var(--px1));

    top:57.5%;
    left:42.5%;

    background:no-repeat center/contain url('assets/img/top/ppl08.svg');
}
.map-ppl09{
    position:absolute;
    z-index:99;

    width:calc(39.9859 * var(--px1));
    height:calc(38.1394 * var(--px1));

    top:45%;
    left:58%;

    background:no-repeat center/contain url('assets/img/top/ppl09.svg');
}

.map-ppl10{
    position:absolute;
    z-index:99;

    width:calc(15.68 * var(--px1));
    height:calc(29.4102 * var(--px1));

    top:52%;
    left:56%;

    background:no-repeat center/contain url('assets/img/top/ppl10.svg');
    animation:infinite ppl10 linear 7s alternate;
}
@keyframes ppl10{
    0%{
        top:47%;
        left:64%;
    }
    41%{
        top:50.5%;
        left:60%;
    }
    71%{
        top:52%;
        left:56%;
    }
}

.map-ppl11{
    position:absolute;
    z-index:99;

    width:calc(18.5261 * var(--px1));
    height:calc(40.7809 * var(--px1));

    top:64%;
    left:54.5%;

    background:no-repeat center/contain url('assets/img/top/ppl11.svg');
}

.map-ppl12{
    position:absolute;
    z-index:9999;

    width:calc(11.8827 * var(--px1));
    height:calc(26.425 * var(--px1));

    background:repeat-y center/cover url('assets/img/top/ppl12-02.svg');
    animation:infinite ppl12 ease-in-out 7s alternate;
}
.map-ppl12::before{
    content:'';
    position:absolute;
    z-index:2;
    bottom:0;
    left:0;

    width:calc(11.8827 * var(--px1));
    height:calc(26.425 * var(--px1));
    background:no-repeat center/contain url('assets/img/top/ppl12-01.svg');
}
.map-ppl12-01{
    top:32%;
    left:24.3%;
}
.map-ppl12-02{
    top:36%;
    left:21.9%;
    animation-delay:1s;
}
.map-ppl12-03{
    top:31%;
    left:26%;
    animation-delay:2s;
}
@keyframes ppl12{
    0%{ 
        height:calc(26.425 * var(--px1));
    }
    100%{
        height:calc(90 * var(--px1));
    }
}

.map-baloon{
    position:absolute;
    z-index:997;

    width:calc(133.5237 * var(--px1));
    height:calc(346.9162 * var(--px1));

    top:6%;
    left:10%;

    background:no-repeat center/contain url('assets/img/top/img-baloon.webp');
    animation:infinite baloon linear 20s forwards;
}
.map-baloon a{
    display:block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1;
    pointer-events:all;
}
@keyframes baloon{
    0%{
        top:6%;
        left:110%;
        transform:rotate(0);
    }
    10%{
        top:6%;
        left:95%;
        transform:rotate(0);
    }
    20%{
    }
    40%{
        transform:rotate(20deg);
    }
    41%{
    }
    50%{
        top:3%;
        transform:rotate(0);
    }
    60%{
    }
    70%{
    }
    71%{
    }
    80%{
        transform:rotate(-4deg);
    }
    90%{
        top:6%;
        left:5%;
        transform:rotate(0);
    }
    100%{
        top:6%;
        left:-10%;
        transform:rotate(0);
    }
}

.top-modal{
    position:fixed;
    top:0;
    left:0;
    width:100vw;
    height:100dvh;
    z-index:999999;
}
.top-modal-close{
    cursor:pointer;
}
.top-modal-bg{
    position:absolute;
    z-index:-1;
    top:0;
    left:0;
    background:rgba(37,30,28,0.67);
    width:100%;
    height:100%;
}
.top-modal-window{
    position:absolute;
    width:calc(100% - 40px);
    max-width:650px;
    height:auto;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    z-index:1;
    background:#FFF;
    border:2px solid var(--blue);
    padding:60px 24px 36px;
}
.top-modal-btn{
    position:absolute;
    top:10px;
    right:10px;
    width:40px;
    height:40px;
}
.top-modal-btn::before,
.top-modal-btn::after{
    content:'';
    width:100%;
    height:1px;
    background:var(--base);
    position:absolute;
    top:calc(50% - 0.5px);
    left:0;
}
.top-modal-btn::before{
    transform:rotate(45deg);
}
.top-modal-btn::after{
    transform:rotate(-45deg);
}
.top-modal-contents{
    height:auto;
    max-height:calc(80dvh - 90px);
    overflow-y:scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.top-modal-contents::-webkit-scrollbar {
    display:none;
}
.top-modal-content__head{
    display:flex;
    justify-content:space-between;
    margin-bottom:26px;
}
.top-modal-content__head__content{
    width: calc(100% - 350px);
}
.top-modal-content__head__img{
    width:320px;
    display:flex;
    align-items:center;
}
.top-modal-content__head__title{
    margin-bottom:24px;
}
.top-modal-content__head__title--jp{
    font-size:20px;
    font-weight:bold;
}
.top-modal-content__head__title--en{
    font-size:11px;
    font-weight:bold;
    color:var(--blue);
}
.top-modal-content__title{
    font-size:32px;
    font-weight:bold;
    color:var(--blue);
}
.top-modal-content__main__text{
    font-size:14px;
}
.top-modal-content__main__vms{
    margin-top:30px;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
    width:354px;
    margin:30px auto 0;
}

.top-sakai-qrlink{
    text-align:center;
    margin:30px 0;
}
.top-sakai-qrlink__img img{
    max-width:130px;
}

/* RESIDENTS */
.residents-mv{
    position:relative;
    z-index:2;
    height:140px;
    padding:70px 0 0;
}
.residents-mv::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    z-index:-2;
    width:100%;
    height:100%;
    background:linear-gradient(to bottom, #d7e9f7, #FFF);
}
.residents-mv__img{
    position:absolute;
    z-index:-1;
    width:500px;
    max-width:unset;
    top:-80px;
    right:120px;
}

.mv-title{
    position:relative;
    padding-bottom:24px;
}
.mv-title::after{
    content:'';
    position:absolute;
    left:0;
    bottom:0;
    width:53px;
    height:3.79px;
    background:var(--blue);
}
.mv-title__en{
    color:var(--blue);
    font-weight:100;
    margin-bottom:10px;
}
.mv-title__jp{
    font-size:38px;
    font-weight:bold;
}


.residents-main{
    padding:150px 0 0;
}
.residents-main__title{
    font-size:42px;
    font-weight:bold;
    margin-bottom:1em;
}
.residents-main__text{
    font-size:28px;
}

.residents-linksec{
    padding:100px 0 60px;
}
.residents-links{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:90px;
}
.residents-link a{
    display:flex;
    flex-direction:column;
    gap:30px;
    align-items:center;
    justify-content:center;
    height:350px;
    color:#FFF;
    border-radius:10px;
    filter:drop-shadow(4px 4px 7px rgba(0,0,0,0.2));
}
.residents-link.leaving a{
    background:var(--blue);
}
.residents-link.qanda a{
    background:var(--lightblue);
}
.residents-link__icon img{
    height:102px;
}
.residents-link__title{
    font-size:38px;
    font-weight:bold;
}
.residents-link__btn{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:165px;
    height:36px;
    border-radius:18px;
    padding:0 12px 0 20px;
    color:var(--blue);
    background:#FFF;
    font-size:12px;
    font-weight:bold;
    transition:all .3s ease;
}
.residents-link__btn::after{
    content:'';
    display:block;
    width:7.6px;
    height:9.8px;
    background:no-repeat center/contain url('assets/img/common/icon-angle-blue.svg');
}
.residents-link a:hover .residents-link__btn{
    transform:scale(1.1);
}

.residents-linkworks{
    padding:50px 0 0;
}
.residents-lineworks__banner{
    text-align:center;
}
.residents-lineworks__text{
    margin-top:14px;
    font-weight:bold;
    font-size:22px;
    color:var(--blue);
}


/* QANDA */
.common-mv{
    position:relative;
    z-index:1;
    height:262px;
    padding:70px 0 0;
}
.common-mv::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    z-index:-2;
    width:100%;
    height:100%;
    background:linear-gradient(to bottom, #d7e9f7, #FFF);
}
.common-mv__img{
    position:absolute;
    z-index:-1;

    width:100%;
    max-width:unset;

    left:50%;
    transform:translateX(-50%);

    pointer-events:none;
}

.common-mv__img.qanda-mv{
    top:-37px;
    padding:0 9vw 0 68vw;
}

.residents-single-head{
    padding-top:0px;
    text-align:center;
}
.residents-single-head__title__icon{
    margin-bottom:18px;
}
.residents-single-head__title__icon img{
    height:100px;
    width:auto;
}
.residents-single-head__title__text{
    color:var(--blue);
    font-size:38px;
    font-weight:bold;
}

.qanda-main{
    padding:60px 0;
}

.qanda-dls dl{
    background:#FFF;
    border-radius:8px;
    filter:drop-shadow(4px 4px 7px rgba(0,0,0,0.2));
}
.qanda-dls dl:not(:last-of-type){
    margin-bottom:20px;
}
.qanda-dls dl dt{
    cursor:pointer;
    padding:33px 100px;
    position:relative;
}
.qanda-dls dl dt::before{
    content:'';
    width:55px;
    height:58px;
    background:no-repeat center/contain url('assets/img/qanda/icon-q.svg');
    position:absolute;
    top:28px;
    left:22.5px;
}
.qanda-dls dl dt p{
    font-size:30px;
    font-weight:bold;
}
.qanda-dt-toggler{
    position:absolute;
    width:36px;
    height:36px;
    border-radius:50%;
    border:1px solid var(--base);
    top:calc(50% - 18px);
    right:32px;
}
.qanda-dt-toggler::before{
    content:'';
    width:19px;
    height:1px;
    background:var(--base);
    position:absolute;
    top:17.5px;
    left:calc(50% - 9.5px);
}
.qanda-dt-toggler::after{
    content:'';
    width:19px;
    height:1px;
    background:var(--base);
    position:absolute;
    top:17.5px;
    left:calc(50% - 9.5px);
    transform:rotate(90deg);
    transition:all .2s;
}
.qanda-dls dl.open .qanda-dt-toggler::after{
    transform:rotate(0);
    transition:all .2s;
}

.qanda-dls dl dd{
    padding:33px 100px;
    position:relative;
}
.qanda-dls dl dd::before{
    content:'';
    width:55px;
    height:58px;
    background:no-repeat center/contain url('assets/img/qanda/icon-a.svg');
    position:absolute;
    top:28px;
    left:22.5px;
}
.qanda-dls dl dd p{
    font-size:24px;
}


/* LEAVING */
.leaving-flowsec{
    padding:80px 0;
}
.leaving-flows{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:90px;
}
.leaving-flow{
    position:relative;
    border:4px solid var(--blue);
    padding:24px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:center;
    gap:20px;
    border-radius:10px;
    color:var(--blue);
    background:#FFF;
    filter:drop-shadow(4px 4px 7px rgba(0,0,0,0.2));
}
.leaving-flow:not(:last-of-type)::after{
    content:'';
    width:25px;
    height:29px;
    background:var(--blue);
    clip-path:polygon(0 0, 100% 50%, 0 100%);
    position:absolute;
    top:50%;
    right:-45px;
    transform:translate(50%,-50%);
    filter:none;
}
.leaving-flow__num{
    position:absolute;
    width:58px;
    height:58px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#FFF;
    background:var(--blue);
    top:-10px;
    left:-10px;
    font-size:31px;
    font-weight:bold;
}
.leaving-flow__icon{
    height:70px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.leaving-flow__title{
    font-size:22px;
    font-weight:bold;
    text-align:center;
    line-height:1.2;
}

.leaving-calsec{
    padding:50px 0;
}
.leaving-calsec__title{
    text-align:center;
    font-size:38px;
    font-weight:bold;
    margin-bottom:50px;
}
.leaving-calendar__content{
    padding-bottom:120px;
}
.leaving-calendar__wrapper{
    padding:0 30px;
}
.leaving-calendar__title{
    font-size:22px;
    font-weight:bold;
    margin-bottom:1em;
}
.leaving-calendar__table table th,
.leaving-calendar__table table td{
    text-align:center;
    padding:10px;
    font-size:20px;
    font-weight:bold;
    border-color:#b0b1b2;
    letter-spacing:0.2em;
}
.leaving-calendar__table table thead th.sun{
    color:#c4004a;
    background:#eed2e2;
}
.leaving-calendar__table table thead th.sat{
    color:#4e80c2;
    background:#d4e9fa;
}
.leaving-calendar__table table td:not(.empty):not(.unavailable){
    padding:0px;
}
.leaving-calendar__table table td:not(.empty):not(.unavailable):hover{
    background:#eed2e2;
}
.leaving-calendar__table table td.unavailable{
    background:#e7e7e7;
}
.leaving-calendar__table table td a{
    display:block;
    color:var(--base);
    padding:10px;
    cursor:pointer;
}

.leaving-calbtn{
    position:absolute;
    bottom:0;
    display:block;
    width:64px;
    height:64px;
    cursor:pointer;
}
.leaving-calbtn.prev{
    left:calc(50% - 80px);
    background:no-repeat center/contain url('assets/img/leaving/icon-prev.svg');
}
.leaving-calbtn.next{
    right:calc(50% - 80px);
    background:no-repeat center/contain url('assets/img/leaving/icon-next.svg');
}

.leaveform-form{
    padding:80px 0;
}

.cform p{
    font-size:20px;
    margin-bottom:80px;
    text-align:center;
}
.form-dls dl{
    display:flex;
    border-bottom:1px solid #b0b1b2;
}
.form-dls dl dt,
.form-dls dl dd{
    font-size:18px;
    padding:20px;
}
.form-dls dl dt{
    padding-top:30px;
    position:relative;
    font-weight:bold;

    width:340px;
}
.form-dls dl dt span{
    position:absolute;
    right:10px;
    top:32px;

    display:block;
    line-height:1;
    padding:6px 12px;
    font-size:14px;
    font-weight:bold;
    color:#FFF;
    background:var(--blue);
}
.form-dls dl dd{
    width:calc(100% - 340px);
}

.form-flex{
    display:flex;
    align-items:center;
    width:100%;
    gap:8px;
}
.form-flex:not(:last-child){
    margin-bottom:10px;
}
.form-flex .wpcf7-form-control-wrap:last-child{
    width:100%;
}
form input[type="text"], form input[type="email"], form input[type="url"], form input[type="tel"], form input[type="number"], form input[type="date"], form textarea, form select{
    padding:14px 20px;
    font-size:18px;
    border-radius:6px;
    border:1px solid var(--lightblue);
    width:100%;
}
form input[name="zipcode"]{
    width:10em;
}
form input[name="your-age"]{
    width:10em;
}
.form-checklist:not(:last-child){
    margin-bottom:20px;
}
.wpcf7-list-item{
    margin:0;
    font-size:18px;
    padding-top:10px;
    display:block;
}

.submit-area{
    margin-top:60px;
    text-align:center;

}
.wpcf7-spinner{
    display:none !important;
}
form input[type="submit"], form button{
    font-size:24px;
    font-weight:bold;
    padding:24px 42px;
    border-radius:8px;
    filter:drop-shadow(4px 4px 7px rgba(0,0,0,0.2));
    background:var(--blue);
}
.wpcf7 .wpcf7-submit:disabled{
    opacity:0.6;
}

p.form-in-attention{
    margin:0;
    text-align:left;
    font-size:14px;
}

input[name="your-leavingdate"]{
    pointer-events:none;
}


/* EDITOR CONTENT */
.editor-content{
    font-size:20px;
}
.editor-content *{
    line-height:2;
}
.editor-content a{
    color:var(--blue);
    text-decoration:underline;
}
.editor-content>*:not(:first-child){
    margin-top:36px;
}
.editor-content h1{
    font-size:3em;
    font-weight: 900;
}
.editor-content h2{
    font-size:2.5em;
    font-weight: 900;
}
.editor-content h3{
    font-size:2em;
    font-weight: 900;
}
.editor-content h4{
    font-size:1.8em;
    font-weight: 900;
}
.editor-content h5{
    font-weight: 900;
}
.editor-content h6{
    font-size:0.8em;
    font-weight: 900;
}
.editor-content ul{
    list-style:disc;
}
.editor-content ol{
    list-style:decimal;
}
.editor-content li{
    margin-left:1.5em;
}
.editor-content li:not(:last-child){
    margin-bottom:15px;
}
.editor-content ol ol,
.editor-content ul ul{
    margin-top:15px;
}


/* SERVICE */
.archive-mv{
    top:calc(-1 * (var(--header-height) + 12px));
}

.archive-mainsec{
    position:relative;
    z-index:2;
    padding:100px 0 0;
}

.notfound{
    text-align:center;
    font-size:24px;
    font-weight:bold;
    padding-bottom:100px;
}

.archive-slider__wrapper:not(:last-child){
    margin-bottom:100px;
}

.archive-slide__container{
    padding: 0 15px;
}
.archive-slide__image{
    position:relative;
    margin-bottom:30px;
}
.archive-slide__image__bg{
    aspect-ratio:345/545;
    width:100%;
    height:auto;
    border-radius:12px;
    overflow:hidden;
}
.archive-slide__image__bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}
.archive-slide__image__icon{
    aspect-ratio:1;
    width:47.5%;
    height:auto;
    border-radius:50%;
    overflow:hidden;

    position:absolute;
    bottom:-27px;
    left:50%;
    transform:translateX(-50%);
}
.archive-slide__image__icon img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}
.archive-slide__price,
.archive-slide__title,
.archive-slide__detail{
    font-size:18px;
    font-weight:500;
}
.archive-slide__address{
    position:relative;
    margin-top:18px;
    padding-left:30px;
    padding-top:6px;
    font-size:15px;
}
.archive-slide__address::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:21px;
    height:30px;
    background:no-repeat center/contain url('assets/img/archive/icon-access.svg');
}

.archive-slickarrow{
    position:absolute;
    z-index:2;
    cursor:pointer;
    top:calc(50% - 42px);
    width:84px;
    height:84px;
    display:block;
}
.archive-slickarrow.prev{
    background:no-repeat center/contain url('assets/img/archive/slick-prev.svg');
    left:-10px;
}
.archive-slickarrow.next{
    background:no-repeat center/contain url('assets/img/archive/slick-next.svg');
    right:-10px;
}