@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/* common start */
:root{
    --site-max-width:100%;
    --site-main-width:100%;
    --site-division:375;
	--site-font-family-Inter:"Inter", sans-serif;
    --site-font-size-ratio:calc(100vw / var(--site-division));
}
*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    list-style: none;
}
::before,
::after{
    box-sizing: border-box;
}
input, textarea, select {
	outline: none;
}
textarea {
	resize: none;
}
fieldset{
    border: none;
}
img{
	vertical-align: top;
}
.is-mobile{
	display: initial;
}
.is-desktop{
	display: none;
}
/* common end */

/* -------------------------------base(mobile)↓-------------------------------------- */
body{
    color: #5D5D5D;
	font-family: var(--site-font-family-Inter);
	max-width: var(--site-max-width);
    margin: auto;
}
main{
    max-width: var(--site-main-width);
	margin: auto;
}

/* footer start */
footer{
    margin-top: calc(calc(12307 - 11248 - 1009) * var(--site-font-size-ratio));
    padding: calc(calc(12347 - 12307) * var(--site-font-size-ratio));
    background-color: #5D5D5D;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: calc(15 * var(--site-font-size-ratio));
}
footer>a{
    text-decoration: none;
    color: #ffffff;
    font-weight: 900;
    font-size: calc(14 * var(--site-font-size-ratio));
    letter-spacing: 0.05em;
}
/* footer end */
/* -------------------------------base(mobile)↑-------------------------------------- */

/* -----------------desktop(include ipad)↓-------------------- */
@media screen and (min-width: 768px){
    :root{
        --site-division: 1440;
    }
	.is-mobile{
		display: none;
	}
	.is-desktop{
		display: initial;
	}

    /* footer start */
    footer{
        margin-top: calc(calc(13260 - 11834 - 1326) * var(--site-font-size-ratio));
        padding: calc(calc(13320 - 13260) * var(--site-font-size-ratio));
        flex-direction: row;
        gap: calc(30 * var(--site-font-size-ratio));
    }
    footer>a{
        font-size: calc(18 * var(--site-font-size-ratio));
    }
    /* footer end */

}

@media screen and (min-width: 1440px){
    :root{
        --site-max-width: 1960px;
        --site-main-width: 1960px;
        --site-font-size-ratio:1px;
    }
}
/* -----------------desktop(include ipad)↑-------------------- */