@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;700;900&display=swap');
* {
	margin: 0;
	padding: 0;
	font-style: normal;
	font-weight: normal;
}
html {
	font-size: 62.5%;
} /* 10px */
body {
	margin: 0px;
	padding: 0px;
	font-size: 1.6rem;
	color:#333;
	font-family: 'Noto Sans JP', sans-serif;
	-ms-font-feature-settings: "normal";
	background-color:#fff;
	font-weight:300;
	letter-spacing: 0.05em;
}
input {
	font-family: 'Noto Sans JP', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 1.6rem;
	font-weight:400;
}
p,li,b,i,span {
	font-weight:300;
}
a {
	outline:none;
}
a:link,
a:visited {
	color:#333;
	text-decoration:underline;

}
a:hover {
	color:#333;
	text-decoration:none;
}
.pc-only {
	display:block;
}
img.pc-only {
	margin:0 auto;
	display:inline-block;
}
.sp-only {
	display:none;
}
/*default page setting*/
#wrapper {
	position:relative;
}
header {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 2.5em 0;
}
header h1 a,
header p,
#greeting .inner .sign span,
footer .group p a  {
	height: 0px;
	overflow: hidden;
	line-height: 2;
	background-repeat: no-repeat;
	background-position: center top;
}
header h1 a,
footer .group p a {
	width: 166px;
	padding-top: 44px;
	background-image: url(../img/logo.png);
	display: block;
}
header p {
	width: 660px;
	padding-top: 26px;
	background-image: url(../img/header_copy.png);
	display: none;
}
#mainPanel {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
}
#mainPanel .panelWrap {
	width: 100%;
	padding-top: 50%;
	overflow: hidden;
	height: 0;
}
#mainPanel .panelWrap > p {
	position: absolute;
	left: 0;
	top: 0;
	display: none;
}
#mainPanel .panelWrap p img {
	width: 100%;
	height: auto;
}
#main1 {
	z-index: 1;
}
#main2 {
	z-index: 2;
}
#layer1 {
	z-index: 20;
}
#layer2 {
	z-index: 3;
}
#layer3 {
	z-index: 4;
}
#layer4 {
	z-index: 5;
}
.anigp {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 6;
}
.anigp p {
	position: absolute;
	display: none;
}
#ani1 {
	left: 0;
	top: 0;
	width: 40%;
}
#ani3,
#ani16 {
	left: 60%;
	top: 0;
	width: 20%;
}
#ani4 {
	left: 0;
	bottom: 0;
	width: 20%;
}
#ani2 {
	right: 0;
	bottom: 0;
	width: 40.91%;
}
#ani5 {
	left: 40%;
	top: 0;
	width: 20%;
}
#ani7,
#ani15 {
	left: 20%;
	bottom: 0;
	width: 20%;
}
#ani6 {
	right: 0;
	top: 33.2%;
	width: 20%;
}
#ani8 {
	left: 40%;
	bottom: 0;
	width: 20%;
}
#ani9 {
	right: 0;
	top: 0;
	width: 20%;
}
#ani10 {
	left: 0;
	top: 33.2%;
	width: 20%;
}
#ani11 {
	left: 20%;
	top: 33.2%;
	width: 20%;
}
#ani12 {
	left: 60%;
	top: 33.2%;
	width: 20%;
}
#ani13 {
	left: 20%;
	top: 0;
	width: 20%;
}
#ani14 {
	left: 0;
	top: 0;
	width: 20%;
}

#greeting {
	max-width: 1005px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 6.87em 0  8.75em;
}
#greeting h2,
#vision h3 {
	text-align: center;
	font-size: 3.2rem;
	font-family: 'Noto Serif JP', serif;
	padding-bottom: 0.8em;
	position: relative;
	margin-bottom: 2.9em;
}
#greeting h2::after,
#vision h3::after {
	content: " ";
	display: block;
	padding-top: 3px;
	width: 40px;
	margin-left: -20px;
	position: absolute;
	left: 50%;
	bottom: 0;
	background-color: #541b86;
}
#greeting .inner p {
	line-height: 1.6;
	margin-bottom: 1.8em;
}
#greeting figure {
	float: right;
	padding: 0;
	margin: 1em 0 2.2em 3em;
}
#greeting .inner .sign {
	text-align: right;
	display: flex;
	justify-content:flex-end;
	align-items: center;
}
#greeting .inner .sign p {
	text-align: left;
	margin-bottom: 0;
}
#greeting .inner .sign span {
	width: 218px;
	padding-top: 46px;
	background-image: url(../img/sign.png);
	display: block;
	margin-left: 2.4em;
}
#history h2,
#vision h2 {
	background-image: url(../img/history_header.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 3.2rem;
	height: 16.7vw;
	box-sizing: border-box;
	font-family: 'Noto Serif JP', serif;
	text-shadow: 0px 0px 5px rgba(24, 20, 18, 1), 0px 0px 80px rgba(59, 50, 45, 1), 0px 0px 40px rgba(59, 50, 45, 1), 0px 0px 15px rgba(59, 50, 45, 1), 0px 0px 20px rgba(59, 50, 45, 1), 0px 0px 11px rgba(59, 50, 45, 1), 0px 0px 5px rgba(59, 50, 45, 1);
	margin-bottom: 2.7em;
}
.proprietor {
	max-width: 840px;
	margin: 0 auto 4em;
	padding-bottom: 3.75em;
	position: relative;
}
.proprietor::after {
	content: " ";
	display: block;
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 500px;
	margin-left: -250px;
	padding-top: 1px;
	background-color: #241e1b;
}
.proprietor:last-child::after {
	display: none;
}
.proprietor figure {
	text-align: center;
	margin-bottom: 3.75em;
}
.proprietor figure figcaption {
	display: block;
	font-size: 1.8rem;
	font-family: 'Noto Serif JP', serif;
	margin-top: 1em;
}
.proprietor figure figcaption em {
	font-weight: 500;
	font-size: 3.2rem;
	display: block;
	margin: 0.2em 0 0.3em;
}
.proprietor figure figcaption span {
	font-size: 1.6rem;
	display: block;
	font-family: 'Noto Sans JP', sans-serif;
}
.proprietor table th {
	text-align: left;
	width: 11.25em;
}
.proprietor table td:nth-child(2) {
	width: 7.5em;
}
.proprietor table th,
.proprietor table td {
	line-height: 1.6;
	padding-bottom: 2em;
}
.proprietor p {
	line-height: 1.6;
	margin-bottom: 1.8em;
}
#vision {
	background-color: #f9f9f9;
	padding: 0 0 7.75em;
}
#vision h2 {
	background-image: url(../img/vision_header.jpg);
	text-shadow: 0px 0px 5px rgba(85, 85, 85, 1), 0px 0px 80px rgba(85, 85, 85, 1), 0px 0px 40px rgba(85, 85, 85, 1), 0px 0px 15px rgba(85, 85, 85, 1), 0px 0px 20px rgba(85, 85, 85, 1), 0px 0px 11px rgba(85, 85, 85, 1), 0px 0px 5px rgba(85, 85, 85, 1);
	margin-bottom: 0;
}
.visionNav {
	display: flex;
	justify-content: center;
	max-width: 1000px;
	margin: -2.37em auto 4.37em;
}
.visionNav li {
	width: 32%;
	box-sizing: border-box;
	text-align: center;
	list-style: none;
	background-color: #fff;
	border-radius: 10px;
	margin: 0 2em;
}
.visionNav li a {
	display: block;
	text-decoration: none;
	background-color: #fff;
	padding: 1.2em 0 2.12em;
	border-radius: 10px;
	border: solid 1px #bcbcbc;
	position: relative;
}
.visionNav li a span {
	font-weight: 400;
}
.visionNav li a::after {
	content: " ";
	display: block;
	position: absolute;
	left: 50%;
	bottom: 1.2em;
	margin-left: -5px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8px 5px 0 5px;
	border-color: #333333 transparent transparent transparent;
}
.introduction {
	box-sizing: border-box;
	max-width: 1000px;
	margin: 0 auto 5em;
	border: solid 3px #d8d8d8;
	padding: 2.5em 2.37em;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.introduction ul {
	width: 60%;
}
.introduction li {
	list-style: none;
	position: relative;
	padding-left: 1.2em;
	line-height: 1.6;
	font-size: 1.4rem;
}
.introduction li::before {
	content: "●";
	position: absolute;
	left: 0;
	top: 0;
}
.introduction li + li {
	margin-top: 2em;
}
.introduction figcaption {
	font-size: 1.4rem;
	text-align: center;
	margin-top: 0.5em;
}
#vision h4 {
	text-align: center;
	font-size: 2.4rem;
	line-height: 1.5;
	font-family: 'Noto Serif JP', serif;
	margin-bottom: 2.5em;
}
#vision .inner {
	max-width: 1000px;
	margin: 0 auto 8em;
}
#vision .inner p {
	line-height: 1.6;
	margin-bottom: 1.8em;
}
.imgR {
	float: right;
	margin: 0.5em 0 3.1em 3.1em;
}
.imgL {
	float: left;
	margin: 0.5em 3.1em 3.1em 0;
}
#vision .inner p span {
	margin-right: 1em;
}
#aboutMeister {
	background-color: #f0f0f0;
	padding: 2em;
	font-weight: 300;
	margin-top: 5em;
}
#aboutMeister dt {
	margin-bottom: 1em;
	font-weight: 500;
}
#aboutMeister dd {
	line-height: 1.6;
}
a.gotop:link,
a.gotop:visited {
	display: block;
	background-image: url(../img/pagetop.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	width: 158px;
	padding-top: 158px;
	height: 0;
	overflow: hidden;
	line-height: 2;
	right: 3.1em;
	position: fixed;
}
footer {
	max-width: 1000px;
	margin: 0 auto;
	padding: 3.37em 1.6em 1.25em;
}
footer .group {
	display: flex;
	justify-content: space-between;
	margin-bottom: 3.75em;
}
footer .group dl {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
footer .group dl dd {
	margin-left: 1.75em;
}
.copyright {
	font-size: 1.2rem;
	text-align: center;
}

.fadein {
	opacity: 0;
	transform: translateY(30px);
	transition: all 5s;
}
a.visionNavTop:link ,
a.visionNavTop:visited {
	display: flex;
	justify-content: center;
	align-items: center;
	border:solid 1px #66658c;
	padding: 1.18em;
	line-height: 1;
	max-width: 21em;
	box-sizing: border-box;
	margin: -2em auto 6.25em;
	text-decoration: none;
}
a.visionNavTop::before {
	content: " ";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 4px 7px 4px;
	border-color: transparent transparent #666666 transparent;
	line-height: 0;
	margin-right: 0.5em;
	margin-top: 0.1em;
}
#movie {
	position: relative;
	padding: 7.18em 0 0;
}
#movie::before {
	content: "";
	display: block;
	width: 500px;
	height: 1px;
	position: absolute;
	left: 50%;
	margin-left: -250px;
	top: 0;
	background-color: #999999;
}
.movOuter {
	width: 720px;
	margin: 0 auto;
}
.video {
	width: 100%;
	padding-top: 56.25%;
	position: relative;
	height: 0;
	overflow: hidden;
}
.video #thumbnail,
.video #myPlayer {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.video #thumbnail {
	z-index: 10;
}
.historybn {
	padding:3.75em 0 9.75em;
	text-align: center;
}

@media screen and (min-width:769px)  {
	.visionNav li a:hover,
	a.gotop:hover,
	.group dd a:hover,
	a.visionNavTop:hover,
	header h1 a:hover,
	footer .group p a:hover {
		opacity: 0.5;
	}
}

@media screen and (max-width: 1200px) {
	header {
		width: 90%;
	}
	#mainPanel {
		width: 100%;
	}
	#greeting,
	.visionNav,
	.introduction,
	#vision .inner,
	footer {
		width: 84%;
	}
	.proprietor {
		width: 70%;
	}
	#mainPanel img {
		max-width: 100%;
	}
}
@media screen and (max-width: 1000px) {
	body,
	.proprietor figure figcaption em,
	.proprietor figure figcaption span {
		font-size:2.4vw;
	}
	#greeting h2,
	#history h2,
	#vision h3,
	.proprietor figure figcaption em,
	#vision h2 {
		font-size: 3.2vw;
	}
	.proprietor figure figcaption {
		font-size: 2vw;
	}
	.introduction li {
		font-size: 2vw;
	}
	#vision h4 {
		font-size: 2.4vw;
	}
	header p {
		width: 66vw;
		padding-top: 2.6vw;
		background-size: 100% auto;
	}
	header h1 a, footer .group p a {
    width: 16.6vw;
    padding-top: 4.4vw;
    background-size: 100% auto;
		display: block;
	}
	.introduction {
		display: block;
	}
	.introduction ul {
		width: 100%;
	}
	.introduction figure {
		text-align: center;
		margin-top: 2em;
	}
	a.gotop:link, a.gotop:visited {
		width: 15.8vw;
		padding-top: 15.8vw;
	}
	#vision {
		padding-bottom: 10em;
	}
	footer .group dl dd img {
		zoom:0.5;
	}
	#greeting .inner .sign span {
    width: 21.8vw;
    padding-top: 4.6vw;
		background-size: 100% auto;
	}
}

@media screen and (max-width: 425px) {
body {
 margin: 0px;
 padding: 0px;
 font-size:3.5vw;/*13px*/
 -webkit-text-size-adjust: 100%;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 3.5vw;
}
.pc-only {
	display:none;
}
.sp-only {
	display:block;
}
header h1 a, footer .group p a {
    width: 98px;
    padding-top: 26px;
}
header {
	display: block;
	padding: 5.3vw 0 3.7vw;
	text-align: center;
}
header h1 {
	margin: 0 auto 0.5em;
}
header p {
	width: 80.26vw;
	padding-top: 3.2vw;
	margin: 0 auto;
}
#greeting h2,
#vision h3,
.proprietor figure figcaption em {
	font-size: 5vw;
}
.proprietor figure figcaption {
	font-size: 3.8vw;
}
.introduction li {
	font-size: 3.2vw;
}
#vision h4 {
	font-size: 4vw;
}
#greeting {
	padding: 4em 0 6em;
}
#greeting figure img {
	zoom:0.5;
}
#greeting .inner .sign {
	align-items: flex-end;
}
#greeting .inner .sign p {
	margin-bottom: 0;
}
.proprietor table th,
.proprietor table td:nth-child(2) {
	display: inline-block;
	padding-bottom: 0;
	width: auto;
}
.proprietor table td:nth-child(3) {
	display: block;
	padding-top: 0.5em;
}
.proprietor::after {
	width: 80%;
	margin-left: -40%;
}
.proprietor:last-child {
	margin-bottom: 0;
}
#vision h2 {
	padding-bottom: 1em;
}
.visionNav {
	margin: -1.6em auto 4em;
	width: 100%;
}
.visionNav li {
	font-size: 2.4vw;
	display:flex;
	align-items: center;
	margin: 0 1em;
	width: 40%;
}
.visionNav li a {
  padding: 0.8em 0 1.8em;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	align-items: center;
	line-height: 1.2;
}

.visionNav li a span {
	letter-spacing: -0.05em;
	display: block;
	transform :scale(0.8, 1);
	font-weight: 400;
}
.visionNav li a::after {
	border-width: 5px 4px 0 4px;
	bottom: 0.8em;
	margin-left: -4px;
}
/*.visionNav {
	margin: 3em auto 4em;
	display: block;
}
.visionNav li {
	width: 100%;
	margin-bottom: 0.5em;
}
.visionNav li a {
	padding: 1em 0 1.8em;
}
.visionNav li a::after {
	bottom: 0.6em;
}*/
img {
	max-width: 100%;
}
#vision .inner .imgR,
#vision .inner .imgL {
	margin: 0 0 1.8em;
	float: none;
}
#vision {
    padding-bottom: 5em;
}
footer .group {
	display: block;
}
footer .group dl {
	margin-top: 1em;
	flex-wrap: wrap;
	justify-content: center;
}
footer .group dl dt {
	width: 100%;
	margin-bottom: 1em;
	text-align: center;
}
footer .group dl dd {
	margin-left: 0;
	margin-right: 1.5em;
}
footer {
	padding: 2.5em 0 1em;
}
a.gotop:link, a.gotop:visited {
	right: 1em;
}
#greeting figure {
	margin: 1em 0 1.5em 2em;
}
#movie {
	padding: 6rem 0;
}
.movOuter {
	width: 90%;
}
#movie::before {
	width: 60%;
	margin-left: -30%;
}

}
@media screen and (max-width: 375px) {

}
@media screen and (max-width: 320px) {

}
@media print {
body {
	width: 210mm;
  height: 296mm;
}
}