html {
font-size: 62.5%;
margin: 0;
}
body {
	font-family: "source-han-sans-japanese", sans-serif;
font-weight: 300;
font-style: normal;
    letter-spacing: 0.05em;
    line-height: 2;
}
div, ul, li {
	box-sizing: border-box;
}
img {
	max-width: 100%;
	vertical-align: bottom;
}
/*ヘッダー*/
header {
    width: 100%;
	height: 90px;
	position: fixed;
	z-index: 20;
    box-sizing: border-box;
    padding: 10px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    top:0;
    left: 0;
}
.logo {
	width: 280px;
}
.header_icon {
	display: flex;
    align-items: center;
    gap: 18px;
}
.header_icon a {
	width: 50px;
    transition: .4s;
}
.header_icon a:hover {
transform: scale(1.2,1.2);
}

main {
	max-width: 1260px;
    padding: 0px 30px;
    display: block;
    margin: 26px auto 30px;
    box-sizing: border-box;
}
footer {
    text-align: center;
    padding: 20px 30px;
}
.copyright {
    font-size: 1.6rem;
    color: #305A92;
    font-family: neue-haas-grotesk-display, sans-serif;
font-weight: 600;
font-style: normal;
    text-align: center;
    margin: 0 auto;
}
h1 {
    font-size: 1.8rem;
    color: #305A92;
font-family: "source-han-sans-japanese", sans-serif;
font-weight: 700;
font-style: normal;
    text-align: center;
    letter-spacing: 3px;
    margin: 0 auto 70px;
}
.comingsoon {
    font-size:min(7.5vw,119px);
    color: #E7EEF6;
font-family: neue-haas-grotesk-display, sans-serif;
font-weight: 600;
font-style: normal;
    text-align: center;
    margin: 0 auto 60px;
    letter-spacing: 0;
    line-height: 1;
}
.change {
    display: block flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin: 0 auto 50px;
    text-align: center;
    max-width: 800px;
    width: 85%;
}
.change img {
    height: 200px;
}
h2 {
    font-size: min(1.8vw,31px);
    color: #305A92;
font-family: neue-haas-grotesk-display, sans-serif;
font-weight: 600;
font-style: normal;
    text-align: center;
    margin: 0 auto 30px;
    letter-spacing: 0;
    line-height: 1.8;
}
p {
font-family: "source-han-sans-japanese", sans-serif;
font-weight: 300;
font-style: normal;
font-size: 1.8rem;
line-height: 2; 
color: #555555;
text-align: left;
margin-bottom: 10px;
}
.usui {
font-family: "source-han-sans-japanese", sans-serif;
font-weight: 500;
font-style: normal;
font-size: 2rem; 
color: #555555;
text-align: right;
}

/*フェードイン*/
.fadein, .time-fadein {
	opacity: 0;
	transform: translate(0, 40px);
	transition: all 800ms;
}
.fadein.scrollin, .time-fadein.scrollin {
	opacity: 1;
	transform: translate(0, 0);
}
.fadein.fadein_l, .time-fadein.fadein_l {
	transform: translate(-50px, 0);
	transition: all 800ms;
	opacity: 0;
}
.fadein.fadein_l.scrollin, .time-fadein.fadein_l.scrollin {
	transform: translate(0, 0);
	opacity: 1;
}
.fadein.fadein_r.fadein, .time-fadein.fadein_r.fadein {
	transform: translate(50px, 0);
	transition: all 800ms;
	opacity: 0;
}
.fadein.fadein_r.scrollin, .time-fadein.fadein_r.scrollin {
	transform: translate(0, 0);
	opacity: 1;
}
.banner {
	display: block;
    text-align: center;
    margin: 40px auto 0;
    max-width: 300px;
    width: 75%;
}

.br-pc {
    display: block;
}
.br-sp {
    display: none;
}

@media screen and (max-width:1000px) {
    
/*ヘッダー*/
header {
    width: 100%;
	height: 65px;
    padding: 2px 20px;
    background: rgba(255, 255, 255, 0.8);
}
.logo {
	width: 200px;
}
.header_icon {
    gap: 15px;
}
.header_icon a {
	width: 40px;
}

main {
    padding: 0px 20px;
    margin: 75px auto 30px;
}
footer {
    padding: 15px 20px;
}
.copyright {
    font-size: 1.4rem;
}
h1 {
    font-size: 1.6rem;
    letter-spacing: 2px;
    margin: 0 auto 20px;
}
.comingsoon {
    font-size:8vw;
    margin: 0 auto 30px;
}
.change {
    gap: 5px;
    margin: 0 auto 20px;
}
.change img {
    height: 100px;
}
h2 {
    font-size: 1.6rem;
    text-align: left;
    margin-bottom: 8px;
}
p {
font-size: 1.4rem;
line-height: 1.8; 
margin-bottom: 8px;
}
.usui {
font-size: 1.5rem; 
line-height: 1.6; 
}
    
    
	/*タブレット以下は下からスライドに固定(横ずれを防ぐ為)*/
	.fadein, .time-fadein {
		transform: translate(0, 40px) !important;
	}
	.fadein.scrollin, .time-fadein.scrollin {
		opacity: 1;
		transform: translate(0, 0) !important;
	}
    
.br-pc {
    display: none;
}
.br-sp {
    display: block;
}
}

@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}