@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@500;700&display=swap');
html,body,h1,h2,h3,h4,h5,h6,p,span,div,object,iframe,em,ul,ol,li,label,dl,dt,dd,form,label,table,tbody,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-family:inherit; list-style-type:none; list-style-image:none; } html { font-size:62.5%; overflow-y:scroll; } img { border:none; vertical-align:bottom; line-height:0; font-size:0; user-select:none; -webkit-user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-drag:none; -khtml-user-drag:none; } body { background: #fff; margin:0 !important; font-family:'Shippori Mincho',serif; letter-spacing: 0; } .clearfix { zoom:1; min-height: 1px; } .clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; font-size: 0.1em; line-height: 0; } .clearboth { clear: both; height: 1px; } *html .clearfix{ height: 1px; /*\*//*/ height: auto; overflow: hidden; /**/ }

.nopc { display: none; }
.nosp { display: inline-block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }

@media screen and (max-width:768px) {
	.nosp { display: none; }
	.nopc { display: inline-block; }
}

/* --------------------------------------------------------------------------
   teaser
-------------------------------------------------------------------------- */

body { position: relative; background: center/cover no-repeat url(../img/bg.jpg); }
#teaser { width: 1000px; margin: 0 auto; padding: 80px 0; text-align: center; color: #fff; }
#teaser h1 { width: 170px; margin: 0 auto 64px; }
#teaser h1 span {
	display: block; width: 100%; height: 0; padding: 0 0 230%;
	background: center/cover no-repeat url(../img/logo.svg);
	text-indent: 120%; white-space: nowrap; overflow: hidden;
}
#teaser h2 { font-size: 2.4rem; font-weight: 700; line-height: 2.4; }
#teaser h3 { font-size: 2.2rem; font-weight: 700; line-height: 2.4; }
#teaser p { font-size: 1.8rem; font-weight: 500; line-height: 2.0; }
#teaser .sns {
	width: 90%; margin: 36px auto; padding: 24px; background: #fff; border-radius: 12px;
	color: #222; box-sizing: border-box;
}
#teaser .sns a {
	display: block; width: 500px; margin: 24px auto; background: #222; border-radius: 8px;
	font-size: 1.8rem; line-height: 2.8; color: #fff;
}
#teaser .sns a::before {
	content: ''; display: inline-block; width: 20px; height: 20px; margin-right: 10px;
	background: center/cover no-repeat url(../img/instagram.svg);
}

@media screen and (max-width:768px) {
	#teaser { width: 90%; padding: 48px 0; }
	#teaser h1 { width: 30%; margin: 0 auto 36px; }
	#teaser h2 { margin: 0 0 16px; font-size: 2.2rem; line-height: 1.6; }
	#teaser h3 { font-size: 2.0rem; }
	#teaser p { font-size: 1.6rem; text-align: left; }
	#teaser .sns { width: 100%; padding: 4vw; }
	#teaser .sns a { width: 100%; font-size: 1.6rem; }
	#teaser .tel { text-align: center; }
}

/* --------------------------------------------------------------------------
   animation
-------------------------------------------------------------------------- */

.di { opacity: 0; transform: translateY(-30px); }
.di.active {
	transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, opacity 1s ease 0s;
	opacity: 1; transform: translateY(0);
}