@charset "UTF-8";
@import url("font-awesome.min.css");
@import url("https://use.typekit.net/tdz1nqc.css");

html {
	font-family: din-2014,'Roboto','Noto Sans JP',"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", "ＭＳ ゴシック", san-serif;
	background: #333;
	}

header {
	position: relative;
	padding: 15px;
	}
@media screen and (max-width: 767.98px){
header {
	padding: 10px;
	}
}

header .logo {
	height: 20px;	
	}
@media screen and (max-width: 767.98px){
header .logo {
	height: 15px;	
	}
}

header .logo img {
	height: 20px;	
	}
@media screen and (max-width: 767.98px){
header .logo img {
	height: 15px;	
	}
}

header ul {
	position: absolute;
	right: 0;
	top: 0;
	display: block;
	padding: 15px;
	}
@media screen and (max-width: 767.98px){
header ul {
	padding: 5px;
	}
}

header li {
	display: inline-block;
	}

header li a {
	display: block;
	padding: 0 5px;
	color: #fff;
	font-size: 15px;
	line-height: 1em;
	text-decoration: none;
	}
@media screen and (max-width: 767.98px){
header li a {
	font-size: 10px;
	}
}

#mv {
	padding: 50px 0;
	background: #222;
	}

#mv h1 {
	display: block;
	color: #fff;
	font-size: 50px;
	font-weight: 700;
	line-height: 1em;
	letter-spacing: .05em;
	text-align: center;
	}
@media screen and (max-width: 767.98px){
#mv h1 {
	font-size: 30px;
	}
}

#staff_list {
	padding: 50px 0;
	background: #111;
	}
@media screen and (max-width: 767.98px){
#staff_list {
	padding: 4vw;
	}
}

.staff_body {
	position: relative;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto 50px auto;
	background: #fefefe;
	}
@media screen and (max-width: 767.98px){
.staff_body {
	margin: 0 auto 4vw auto;
	}
}

.staff_body:nth-child(odd) {
	padding: 100px 440px 40px 40px;
	}
@media screen and (max-width: 767.98px){
.staff_body:nth-child(odd) {
	padding: 10vw 4vw 4vw 4vw;
	}
}

.staff_body:nth-child(even) {
	padding: 100px 40px 40px 440px;
	}
@media screen and (max-width: 767.98px){
.staff_body:nth-child(even) {
	padding: 10vw 4vw 4vw 4vw;
	}
}

.staff_body img {
	position: absolute;
	top: 0;
	display: block;
	width: 400px;
	height: 100%;
	object-fit: cover;
	}
@media screen and (max-width: 767.98px){
.staff_body img {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	width: 100%;
	height: auto;
	margin: 0 0 1em 0;
	}
}

.staff_body:nth-child(odd) img {
	right: 0;
	}

.staff_body:nth-child(even) img {
	left: 0;
	}

.staff_body h2 {
	position: relative;
	display: block;
	height: 70px;
	margin: 0 0 1em 0;
	font-size: 30px;
	font-weight: 700;
	line-height: 1em;
	letter-spacing: .25em;
	}
@media screen and (max-width: 767.98px){
.staff_body h2 {
	height: 50px;
	margin: 0 0 .5em 0;
	font-size: 6vw;
	}
}

.staff_body h2 img {
	top: 0;
	left: auto;
	display: block;
	width: auto;
	height: auto;
	max-height: 60px;
	object-fit: cover;
	}
@media screen and (max-width: 767.98px){
.staff_body h2 img {
	height: 50px;
	}
}

.staff_body h2 span {
	display: block;
	color: #666;
	font-size: 20px;
	font-weight: 300;
	line-height: 2em;
	letter-spacing: .1em;
	}
@media screen and (max-width: 767.98px){
.staff_body h2 span {
	font-size: 4vw;
	}
}

.staff_body h3 {
	display: block;
	margin: 0 0 2em 0;
	font-size: 14px;
	font-weight: 300;
	line-height: 2em;
	letter-spacing: .05em;
	}
@media screen and (max-width: 767.98px){
.staff_body h3 {
	font-size: 3vw;
	}
}

.staff_body p {
	display: block;
	margin: 0 0 1em 0;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.5em;
	letter-spacing: .025em;
	}
@media screen and (max-width: 767.98px){
.staff_body p {
	font-size: 4vw;
	letter-spacing: 0;
	}
}

.staff_body .sns {
	position: absolute;
	bottom: 30px;
	display: block;
	}
@media screen and (max-width: 767.98px){
.staff_body .sns {
	position: relative;
	bottom: auto;
	width: 100%;
	text-align: center;
	}
}

.staff_body:nth-child(odd) .sns {
	right: 440px;
	}
@media screen and (max-width: 767.98px){
.staff_body:nth-child(odd) .sns {
	right: auto;
	}
}

.staff_body:nth-child(even) .sns {
	right: 40px;
	}
@media screen and (max-width: 767.98px){
.staff_body:nth-child(even) .sns {
	right: auto;
	}
}


.staff_body .sns li {
	display: inline-block;
	padding: 0 0 0 10px;
	}
@media screen and (max-width: 767.98px){
.staff_body .sns li {
	padding: 10px;
	}
}

.staff_body .sns li a {
	display: block;
	font-size: 24px;
	color: #333;
	}
@media screen and (max-width: 767.98px){
.staff_body .sns li a {
	font-size: 30px;
	}
}

footer {
	margin: 0;
	padding: 50px 4vw;
	background: #222
	}

footer address {
	display: block;
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 18px;
	font-weight: 200;
	line-height: 1em;
	letter-spacing: .05em;
	text-align: center;
	}
@media screen and (max-width: 767.98px){
footer address {
	font-size: 5vw;
	}
footer address span {
	display: none;
	}
}

.totop {
	position: fixed;
	right: 20px;
	bottom: 80px;
	display: block;
	width: 50px;
	height: 50px;
	z-index: 99999999;
	}
@media screen and (max-width:414px){
.totop {
	right: 15px;
	width: 40px;
	height: 40px;
	}
}

.totop a {
	display: block;
	width: 50px;
	height: 50px;
	background: url("../images/totop.png") center center no-repeat #ec6000;
	background-size: 20px 11px;
	overflow: hidden;
	text-indent: 100%;
	font-size: 0;
	border-radius: 50px;
	opacity: .8;
	transition: .3s ease;
	}
@media screen and (max-width:414px){
.totop a {
	width: 40px;
	height: 40px;
	}
}

.totop a:hover {
	opacity: 1;
	}

#map {
	position: relative;
	width: 900px;
	height: 400px;
	margin: 0 auto;
	background: url(/staff/img/map.svg) center center no-repeat;
	background-size: auto 380px;
	}
@media screen and (max-width: 767.98px){
#map {
	width: 320px;
	height: 200px;
	background-size: auto 160px;
	}
}

#map li {
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	transition: .3s ease;
	}
@media screen and (max-width: 767.98px){
#map li {
	width: 20px;
	height: 20px;
	}
}

#map li:hover {
	scale: 2;
	z-index: +1;
	}
@media screen and (max-width: 767.98px){
#map li:hover {
	scale: 3;
	}
}

#map li:hover:after {
	position: absolute;
	left: -15px;
	bottom: 0px;
	display: block;
	width: 60px;
	color: #fff;
	font-size: 5px;
	text-align: center;
	text-shadow: 0 0 1px rgba(0,0,0,1);
	}
@media screen and (max-width: 767.98px){
#map li:hover:after {
	left: -20px;
	}
}

#map a {
	display: block;
	width: 100%;
	height: 100%;
	}

#map img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	}

#map li.KazunoriHashimura {
	left: 105px;
	top: 164px;
	}
@media screen and (max-width: 767.98px){
#map li.KazunoriHashimura {
	left: 5px;
	top: 84px;
	}
}
#map li.KazunoriHashimura:hover:after {
	content: "橋村 和徳";
	}

#map li.NaokiChaya {
	left: 292px;
	top: 272px;
	}
@media screen and (max-width: 767.98px){
#map li.NaokiChaya {
	left: 84px;
	top: 133px;
	}
}
#map li.NaokiChaya:hover:after {
	content: "茶屋 尚輝";
	}

#map li.YukisadaFukaya {
	left: 392px;
	top: 270px;
	}
@media screen and (max-width: 767.98px){
#map li.YukisadaFukaya {
	left: 131px;
	top: 123px;
	}
}
#map li.YukisadaFukaya:hover:after {
	content: "深谷 由紀貞";
	}

#map li.NaokiTakamatsu {
	left: 260px;
	top: 190px;
	}
@media screen and (max-width: 767.98px){
#map li.NaokiTakamatsu {
	left: 71px;
	top: 89px;
	}
}
#map li.NaokiTakamatsu:hover:after {
	content: "髙松 直紀";
	}

#map li.AlanSomeyaPete {
	left: 419px;
	top: 279px;
	}
@media screen and (max-width: 767.98px){
#map li.AlanSomeyaPete {
	left: 150px;
	top: 126px;
	}
}
#map li.AlanSomeyaPete:hover:after {
	content: "ピート 染谷 亜蘭";
	}

#map li.KazumaYasuda {
	left: 297px;
	top: 245px;
	}
@media screen and (max-width: 767.98px){
#map li.KazumaYasuda {
	left: 97px;
	top: 118px;
	}
}
#map li.KazumaYasuda:hover:after {
	content: "保田 和真";
	}

#map li.TomoumiAkitoshi {
	left: 130px;
	top: 175px;
	}
@media screen and (max-width: 767.98px){
#map li.TomoumiAkitoshi {
	left: 24px;
	top: 88px;
	}
}
#map li.TomoumiAkitoshi:hover:after {
	content: "秋吉 友海";
	}

#map li.AnnaOoishi {
	left: 346px;
	top: 280px;
	}
@media screen and (max-width: 767.98px){
#map li.AnnaOoishi {
	left: 114px;
	top: 128px;
	}
}
#map li.AnnaOoishi:hover:after {
	content: "大石 杏奈";
	}

#map li.YukiHashimoto {
	left: 156px;
	top: 190px;
	}
@media screen and (max-width: 767.98px){
#map li.YukiHashimoto {
	left: 39px;
	top: 96px;
	}
}
#map li.YukiHashimoto:hover:after {
	content: "橋本 優樹";
	}

#map li.AshleyKakumoto {
	left: 800px;
	top: 264px;
	}
@media screen and (max-width: 767.98px){
#map li.AshleyKakumoto {
	left: 302px;
	top: 124px;
	}
}
#map li.AshleyKakumoto:hover:after {
	content: "角本 アシュリー";
	}

#map li.TakuyaSugano {
	left: 520px;
	top: 191px;
	}
@media screen and (max-width: 767.98px){
#map li.TakuyaSugano {
	left: 186px;
	top: 92px;
	}
}
#map li.TakuyaSugano:hover:after {
	content: "菅野 拓也";
	}

#map li.RenKodera {
	left: 520px;
	top: 137px;
	}
@media screen and (max-width: 767.98px){
#map li.RenKodera {
	left: 188px;
	top: 68px;
	}
}
#map li.RenKodera:hover:after {
	content: "小寺 蓮";
	}

#map li.RyoShimoyama {
	left: 390px;
	top: 240px;
	}
@media screen and (max-width: 767.98px){
#map li.RyoShimoyama {
	left: 138px;
	top: 107px;
	}
}
#map li.RyoShimoyama:hover:after {
	content: "下山 諒";
	}

#map li.ManamiIwakawa {
	left: 60px;
	top: 278px;
	}
@media screen and (max-width: 767.98px){
#map li.ManamiIwakawa {
	left: 0px;
	top: 129px;
	}
}
#map li.ManamiIwakawa:hover:after {
	content: "岩川 愛実";
	}

#map li.RyoIguchi {
	left: 419px;
	top: 248px;
	}
@media screen and (max-width: 767.98px){
#map li.RyoIguchi {
	left: 158px;
	top: 107px;
	}
}
#map li.RyoIguchi:hover:after {
	content: "猪口 涼";
	}