@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500;700&display=swap');


/* --------- web fonts --------------------------- */
@font-face {
	font-family:'CGothic';
	src:url('images/CGothic.ttf') format('truetype');
}
@font-face {
	font-family:'CSerif';
	src:url('images/CSerif.ttf') format('truetype');
}



/* --------- initialize --------------------------- */
* {
	box-sizing:border-box;
	text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
	margin:0;
	padding:0;
	border:0 none;
	font-size:inherit;
	font-weight:inherit;
	font-style:inherit;
	text-decoration:inherit;
	vertical-align:inherit;
/*
	backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
*/
}
ol ,ul ,li {
	list-style:none;
}
button ,input ,textarea ,select {
	font-size:14px;
	letter-spacing:1px;
}
button {
	padding:5px 20px;
}
img {
	max-width:100%;
}
a ,a:before ,a:after {
	color:inherit;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
a:hover {
	color:#f00;
}
.anchorLink {
	cursor:pointer;
}

.flex {
	display:flex;
	justify-content:center;
	align-items:center;
}

/* --------- animation settings --------------------------- */
@-webkit-keyframes blink {
	0%   {opacity:1;}
	100% {opacity:0;}
}
@keyframes blink {
	0%   {opacity:1;}
	100% {opacity:0;}
}
@keyframes marquee {
	from   { transform:translate(0%);}
	99%,to { transform:translate(-100%);}
}
@-webkit-keyframes marquee {
	from   { -webkit-transform:translate(0%);}
	99%,to { -webkit-transform:translate(-100%);}
}


/* --------- common layout --------------------------- */
body{
	font-size:14px;
	line-height:1.6em;
	color:#2f2725;
	background:url(images/common/bg1.png) 50% 0 repeat #fff;
	font-family:"Noto Serif JP",serif;
}
#outer {
	width:480px;
	margin:0 auto;
}

.inner {
	width:100%;
	margin:0 auto;
	padding:0 10px;
}

main {
	padding-top:60px;
}


@media screen and (min-width:800px) { 
	.sp {
		display:none !important;
	}
	#outer {
		width:100%;
	}
	.inner {
		width:1200px;
		max-width:100%;
	}
	main {
		padding-top:80px;
	}
}
@media screen and (max-width:799px) { 
	.pc {
		display:none !important;
	}
#outer {
	box-shadow:-5px 0 5px #ccc,5px 0 5px #ccc;
}

}



/* --------- pagetop Link ------------------ */
#pageTop {
	position:fixed;
	right:10px;
	bottom:10px;
	width:60px !important;
	height:60px !important;
	padding:0;
	display:none;
}
#pageTop div {
	width:100%;
	height:100%;

	color:#fff;
	background:linear-gradient(#5f4745, #1f0705) #2f2725;
	border:1px solid #999;
	border-radius:3px;
	box-shadow:0px 0px 3px #000;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;

	font-size:11px;
	line-height:1.4;
	text-align:center;
	font-family:"CSerif",serif;
}
#pageTop div span {
	width:100%;
}



/* --------- header layout --------------------------- */
header {
	position:fixed;
	top:0;
	left:0;
	right:0;
	height:70px;
	z-index:9001;
	background:rgba(255,255,255,0.95);
}
@media screen and (min-width:800px) { 
	header {
		height:70px;
	}
}

/* --------- fixedHeader ------------------ */
#fixedHeader {
	width:100%;
	height:100%;
	box-shadow:0 1px 5px 1px #666;
}
#fixedHeader ul.flex {
	height:100%;
	padding:1px 10px;
	position:relative;
	justify-content:space-between;
}
#fixedHeader ul.flex li {
	margin-right:5px;
	height:100%;
	text-align:left;
}
#fixedHeader ul.flex li:nth-child(2) {
	margin-left:auto;
}
#fixedHeader ul.flex li img {
	max-height:100%;
}

#fixedHeader ul.flex li.hover {
	padding:5px 0;
}
#fixedHeader ul.flex li.hover img {
	border:1px solid #fff;
	cursor:pointer;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
#fixedHeader ul.flex li.hover:hover img {
	border:1px solid #f60;
	box-shadow:0 0 5px #f90;
}
@media screen and (max-width:799px) { 
	#fixedHeader ul.flex {
		width:480px;
	}
}



/* --------- header navigation ------------------ */
#headerNav {
	position:fixed;
	top:0;
	right:-100%;
	z-index:-1;
	padding-top:50px;
	background:rgba(255,255,255,0.95);
	-webkit-transition:.2s ease-out;
	transition:.2s ease-out;
}
.menuOpen #headerNav {
	right:0;
}
#headerNav .inner {
	width:auto;
	padding:5px 20px;
	box-shadow:-3px 3px 3px #999;
}
#headerNav ul {
}
	#headerNav ul li {
		padding:5px;
		border-bottom:1px solid #666;
		text-align:right;
	}
	#headerNav ul li a {
		padding:15px 10px;
		font-size:20px;
		display:flex;
		align-items:center;
		justify-content:flex-end;
	}
	#headerNav ul li a > span {
		padding-right:0.3em;
	}
	#headerNav ul li a:after {
		content:"＞";
		font-weight:bold;
		color:#999;
		width:1.6em;
		padding-left:1em;
		background:url(images/icons/keyhole.png) 0 50% no-repeat;
		background-size:contain;
	}
	#headerNav ul li.active a:after {
		background-image:url(images/icons/key.png);
	}
	#headerNav ul li a .ja {
		display:none;
	}

@media screen and (min-width:800px) { 
	#headerNav {
		padding-top:70px;
	}
	#headerNav .inner {
		padding:30px;
	}

}



/* --------- aside ------------------ */
aside.asideEntry {
	padding:10px 0 30px;
}

aside.asideEntry h2 {
	padding:5px;
	background:#fc3;
	font-size:20px;
	text-align:center;
}
aside.asideEntry .flex.asideButtons {
	flex-direction:column;
	padding:10px 0;
}
aside.asideEntry .flex.asideButtons li {
	padding:5px;
}
aside.asideEntry .flex.asideButtons li a {
	display:block;
	font-size:0;
}
aside.asideEntry .flex.asideButtons li a img {
	border:1px solid #fff;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

aside.asideEntry .flex.asideButtons li a:hover img {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}

aside.asideEntry .flex.asideTels {
	padding:10px 0;
	flex-direction:column;
	justify-content:space-between;
}
aside.asideEntry .flex.asideTels li:nth-child(1) {
	width:60%;
}
aside.asideEntry .flex.asideTels li:nth-child(2) a.flex > * {
	display:block;
}
aside.asideEntry .flex.asideTels li:nth-child(2) a.flex span {
	font-size:28px;
}
aside.asideEntry .flex.asideTels li:nth-child(2) a.flex small {
	font-size:14px;
}
@media screen and (max-width:799px) { 
	aside.asideEntry .flex.asideTels li a.flex {
		padding:10px 0;
		flex-wrap:wrap;
		justify-content:center;
	}
	aside.asideEntry .flex.asideTels li:nth-child(2) a.flex small {
		width:100%;
		padding-left:40px;
		text-align:center;
	}
}
@media screen and (min-width:800px) { 
	aside.asideEntry .flex.asideButtons {
		flex-direction:row;
	}
	aside.asideEntry {
		padding:40px 20px 60px;
	}
	aside.asideEntry .flex.asideTels {
		flex-direction:row;
	}
	aside.asideEntry .flex.asideTels li:nth-child(1) {
		width:30%;
		margin-right:auto;
	}
	aside.asideEntry .flex.asideTels li:nth-child(2) a.flex span {
		margin-right:auto;
	}
}
@media screen and (min-width:1000px) { 
	aside.asideEntry .flex.asideTels li:nth-child(2) a.flex span {
		font-size:36px;
	}
	aside.asideEntry .flex.asideTels li:nth-child(2) a.flex small {
		font-size:16px;
	}
}



/* --------- section (common) ------------------ */
main article section {
	padding:10px 0 30px;
}
main article section:nth-of-type(2n) {
	background:rgba(255,255,153,0.4);
}

main article section > .inner > h2 {
	padding-bottom:20px;
	color:#630;
	font-size:28px;
	line-height:1.4em;
	letter-spacing:1px;
	font-weight:bold;
	font-family:serif;
	text-align:center;
}
main article section > .inner > h2 span {
	display:block;
}
main article section > .inner > h2 span:nth-child(2) {
	font-size:14px;
	line-height:1.2em;
	letter-spacing:0px;
}
@media screen and (min-width:800px) { 
	main article section {
		padding:40px 20px 60px;
	}
	main article section > .inner > h2 {
		font-size:36px;
	}
	main article section > .inner > h2 span:nth-child(2) {
		font-size:18px;
	}
}



/* --------- section#catch ------------------ */
#catch{
	text-align:center;
}
#catch p{
	padding-bottom:30px;
}

/* --------- section#details ------------------ */
section#details {
}
section#details table {
	max-width:1000px;
	width:100%;
	margin:auto;
	border-collapse:collapse;
}
section#details table tr th {
	width:20%;
	padding:1em 0;
	color:#fff;
	background:#432;
	border-bottom:1px solid #fff;
}
section#details table tr td {
	padding:1em;
	background:#fff;
	border-bottom:1px solid #963;
}
section#details table tr:last-child > * {
	border-bottom:0 none;
}
@media screen and (min-width:800px) {
	section#details table tr td {
		padding:1em 2em;
	}
}


/* --------- section#gallery ------------------ */
section#gallery {
}
section#gallery > .inner > ul.flex {
	max-width:1000px;
	width:100%;
	margin:0 auto;
	font-size:0;
}
section#gallery > .inner > ul.flex li.flex:nth-child(1) {
	width:60%;
	padding:10px;
	flex-direction:column;
}
section#gallery > .inner > ul.flex li.flex:nth-child(2) {
	width:40%;
	padding:10px;
	flex-direction:column;
}

section#gallery > .inner > ul.flex > li.flex > div {
	padding:10px 0;
}




/* --------- section#recreation ------------------ */
section#recreation {
}
section#recreation > .inner > ul {
	width:100%;
	margin:0 auto;
}
section#recreation > .inner > ul li {
	position:relative;
	padding:20px 0;
}
section#recreation > .inner > ul li > div.frame {
	position:relative;
	height:400px;
	padding:10px;
	border:1px solid #999;
	border-radius:10px;
	box-shadow:0 0 10px #ccc;
	background:#fff;
	overflow:hidden;
	-webkit-transition:all 0.6s ease;
	transition:all 0.6s ease;
}

section#recreation > .inner > ul li > div.frame > h3 {
	color:#c00;
	font-size:28px;
	padding-bottom:10px;
	border-bottom:2px solid #333;
}
section#recreation > .inner > ul li > div.frame > h3 span {
	display:block;
	padding:0 0.5em;
	line-height:2em;
}
section#recreation > .inner > ul li > div.frame > h3 span:nth-child(1) {
	border-bottom:2px solid #c00;
}
section#recreation > .inner > ul li > div.frame > h3 span:nth-child(2) {
	font-size:14px;
	text-align:right;
}

section#recreation > .inner > ul li > div.frame > div {
	font-size:16px;
	line-height:1.6em;
}

section#recreation > .inner > ul li > div.more {
	position:absolute;
	right:10px;
	bottom:30px;
	width:60px;
	height:60px;
	border:1px solid #fff;
	color:#fff;
	background:#600;
	font-size:14px;
	line-height:1.4em;
	border-radius:10px;
	cursor:pointer;
}
section#recreation > .inner > ul li > div.more div.flex {
	height:100%;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
	text-align:center;
}
section#recreation > .inner > ul li > div.more:hover {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}

section#recreation > .inner > ul li.close > div.frame:after {
	content:"";
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	height:100px;
	background:linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,1));
	background:-webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0)), color-stop(0.5,rgba(255,255,255,1)), to(rgba(255,255,255,1)));
	border-radius:0 0 10px 10px;
}
section#recreation > .inner > ul li.close > div.more span:nth-child(2) {
	display:none;
}


section#recreation > .inner > ul li.open > div.frame {
	height:auto;
}
section#recreation > .inner > ul li.open > div.more span:nth-child(1) {
	display:none;
}

@media screen and (min-width:800px) {
	section#recreation > .inner > ul {
		width:800px;
	}
	section#recreation > .inner > ul li > div.frame {
		padding:20px 40px;
	}
}



/* --------- section#interview ------------------ */
section#interview {
}
section#interview > .inner > ul {
	max-width:1000px;
	width:100%;
	margin:0 auto;
}
section#interview > .inner > ul li {
	padding:20px 0;
}
section#interview > .inner > ul li div.flex {
	padding:10px;
	border:1px solid #c60;
	box-shadow:0 0 10px #c60;
	background:linear-gradient(#fff, #fed);
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#fed));
	justify-content:space-between;
	align-items:flex-start;
}
section#interview > .inner > ul li:nth-child(2n) div.flex {
	flex-direction:row-reverse;
}

section#interview > .inner > ul li div.flex > div:nth-child(1) {
	width:80%;
	padding:0 10px;
}
section#interview > .inner > ul li div.flex > div:nth-child(1) h3 {
	font-size:20px;
	line-height:1.6em;
	padding-bottom:10px;
}
section#interview > .inner > ul li div.flex > div:nth-child(1) h3 span:nth-child(1) {
	display:block;
	padding:0 0.5em;
	border-bottom:2px solid #333;
}
section#interview > .inner > ul li div.flex > div:nth-child(1) h3 span:nth-child(2) {
	display:block;
	padding:0 0.5em;
	text-align:right;
}
section#interview > .inner > ul li div.flex > div:nth-child(1) h3.type1 {
	color:#f06;
}
section#interview > .inner > ul li div.flex > div:nth-child(1) h3.type1 span:nth-child(1) {
	border-bottom:2px solid #f06;
}

section#interview > .inner > ul li div.flex > div:nth-child(1) p {
	font-size:13px;
	line-height:1.6em;
}

section#interview > .inner > ul li div.flex > div:nth-child(2) {
	width:20%;
	text-align:center;
	padding-top:30px;
}

@media screen and (min-width:800px) {
	section#interview > .inner > ul li div.flex {
		padding:20px;
	}
	section#interview > .inner > ul li div.flex > div:nth-child(1) {
		width:75%;
		padding:0 20px;
	}
	section#interview > .inner > ul li div.flex > div:nth-child(1) h3 {
		font-size:30px;
		line-height:2em;
	}
	section#interview > .inner > ul li div.flex > div:nth-child(1) h3 span:nth-child(1) {
		border-bottom:2px solid #333;
	}
	section#interview > .inner > ul li div.flex > div:nth-child(1) p {
		font-size:16px;
	}
	section#interview > .inner > ul li div.flex > div:nth-child(2) {
		width:25%;
		padding-top:0;
	}
}



/* --------- section#group ------------------ */
section#group {
}
section#group > .inner > ul.flex {
	max-width:1000px;
	width:100%;
	margin:0 auto;
	flex-wrap:wrap;
	text-align:center;
	font-size:0;
}
section#group > .inner > ul.flex li {
	width:50%;
	padding:5px;
}
section#group > .inner > ul.flex li a {
	display:block;
}
section#group > .inner > ul.flex li a img {
	border:1px solid #fff;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
section#group > .inner > ul.flex li a:hover img {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}
@media screen and (min-width:800px) {
	section#group > .inner > ul.flex li {
		padding:10px;
	}
}



/* --------- section#entry ------------------ */
section#entry {
	padding-top:60px;
}
section#entry > .inner > ul.flex {
	max-width:1000px;
	width:100%;
	margin:0 auto;
	flex-wrap:wrap;
	text-align:center;
}
section#entry > .inner > ul.flex > li {
	width:100%;
	padding:10px;
}
section#entry > .inner > ul.flex > li > div {
	padding:20px;
	background:url(images/recruit/entry_bg.png) #f8f8f8;
	border:1px solid #ccc;
	border-radius:10px;
	box-shadow:0 0 10px #999;
}
section#entry > .inner > ul.flex > li > div > h3 {
}
section#entry > .inner > ul.flex > li > div > h3 span {
	display:block;
	font-size:20px;
}
section#entry > .inner > ul.flex > li > div > h3 img {
	width:120px;
}
section#entry > .inner > ul.flex > li > div > p {
	line-height:1.8em;
	padding-bottom:1em;
}
section#entry > .inner > ul.flex > li > div > a {
	display:block;
	width:90%;
	margin:auto;
	padding:5px;
	color:#fff;
	background:linear-gradient(#ccc, #999);
	background:-webkit-gradient(linear, left top, left bottom, from(#ccc), to(#999));
	border:1px solid #fff;
	border-radius:10px;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
section#entry > .inner > ul.flex > li > div > a span {
	display:block;
}
section#entry > .inner > ul.flex > li > div > a span:nth-child(1) {
	font-size:20px;
}
section#entry > .inner > ul.flex > li > div > a:hover {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}

section#entry > .inner > ul.flex > li#entryLine > div > a {
	background:linear-gradient(#0c3, #063);
	background:-webkit-gradient(linear, left top, left bottom, from(#0c3), to(#063));
}
section#entry > .inner > ul.flex > li#entryMail > div > a {
	background:linear-gradient(#c36, #603);
	background:-webkit-gradient(linear, left top, left bottom, from(#c36), to(#603));
}
section#entry > .inner > ul.flex > li#entryTel > div > a {
	background:linear-gradient(#f63, #c30);
	background:-webkit-gradient(linear, left top, left bottom, from(#f63), to(#c30));
}
section#entry > .inner > ul.flex > li#entryForm > div > a {
	background:linear-gradient(#66c, #336);
	background:-webkit-gradient(linear, left top, left bottom, from(#66c), to(#336));
}

section#entry > .inner > aside {
	max-width:1000px;
	width:100%;
	margin:0 auto;
	padding-top:60px;
}
section#entry > .inner > aside a img {
	border:1px solid #fff;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
section#entry > .inner > aside a:hover img {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}

@media screen and (min-width:800px) {
	section#entry {
		padding-top:100px;
	}
	section#entry > .inner > ul.flex > li {
		width:50%;
		padding:20px;
	}
}



/* --------- footer ------------------ */
footer > .inner {
	width:100%;
	padding:0;
}

footer > .inner #footerInfo {
	color:#fff;
	background:#321;
}

footer > .inner #footerInfo #footerShopInfo.inner {
	padding:30px 0 60px;
	text-align:center;
}
footer > .inner #footerInfo #footerShopInfo.inner h2 img {
	width:300px;
	opacity:0.9;
}
footer > .inner #footerInfo #footerShopInfo.inner p {
	padding-top:20px;
	font-size:11px;
	line-height:2em;
}


footer #copyright {
	font-size:14px;
	line-height:3em;
	text-align:center;
}

@media screen and (min-width:800px) {
	footer > .inner #footerInfo #footerShopInfo.inner p {
		font-size:20px;
		letter-spacing:1px;
	}
}
@media screen and (max-width:799px) { 
	footer > .inner #footerInfo #footerShopInfo.inner h2 img {
		width:50%;
	}
}


/* --------- form ------------------ */
#recruit_formHtmlBody #fixedHeader li:nth-child(2) ,
#recruit_form_okHtmlBody #fixedHeader li:nth-child(2) {
	display:none;
}
#recruit_formHtmlBody #fixedHeader li:nth-child(3) ,
#recruit_form_okHtmlBody #fixedHeader li:nth-child(3) {
	margin-left:auto;
}
#recruit_formHtmlBody main ,
#recruit_form_okHtmlBody main {
	padding-top:100px;
	padding-bottom:60px;
}
#recruitFormNotice {
	width:800px;
	max-width:96%;
	margin:0 auto;
	background:#fff;
	border-radius:10px;
	box-shadow:0 0 10px #999;
}
#recruitFormNotice p {
	text-align:center;
	padding-bottom:2em;
}
#recruitFormNotice p strong {
	font-size:16px;
}
#recruitForm {
	width:400px;
	padding-bottom:0;
	max-width:100%;
	margin:0 auto;
}

#recruitForm #formTable {
	font-size:14px;
}

#recruitForm dt {
	font-weight:bold;
	padding-bottom:0.2em;
}
#recruitForm dt .required:after {
	content:attr(data-text);
	display:inline-block;
	margin-left:0.5em;
	padding:2px 0.5em;
	font-size:12px;
	line-height:1em;
	color:#f00;
	border:1px solid #f00;
	border-radius:5px;
	text-align:center;
}


#recruitForm dd {
	padding:0 1em 1em;
}
#recruitForm dd small {
	font-size:12px;
	color:#666;
}

#recruitForm .error {
	display:block;
	color:#f00;
	font-size:12px;
	font-weight:bold;
}

#recruitForm #formTable.formConfirm dd {
	color:#f00;
	font-size:16px;
}


#recruitForm input ,
#recruitForm select ,
#recruitForm textarea {
	padding:0.2em 0.5em;
	font-size:16px;
	border:1px solid #ccc;
	border-radius:3px;
	font-family:"メイリオ",sans-serif;
}
#recruitForm input[type="submit"] {
	padding:5px 20px;
}

#recruitForm label {
	padding:0 1em;
}
#recruitForm .widthS {
	width:5em;
	max-width:90%;
}
#recruitForm .widthM {
	width:10em;
	max-width:90%;
}
#recruitForm .widthL {
	width:100%;
}
#recruitForm textarea {
	width:100%;
	height:5em;
}

#recruitForm .formButton {
	padding:20px;
	text-align:center;
}



@media screen and (min-width:800px) {
	#recruitFormNotice p strong {
		font-size:20px;
	}
	#recruitForm {
		width:480px;
	}

}


.sendIP {
	padding-top:30px;
	color:#999;
	font-size:10px;
	line-height:1.4em;
	text-align:right;
}




/* --------- staff link banner ------------------ */
.staffLink .inner {
	max-width:1000px;
	margin:auto;
	text-align:center;
}
#staff1 .staffLink .inner {
	padding-top:10px;
}
#staff2 .staffLink .inner {
	padding-top:40px;
	padding-bottom:40px;
}
.staffLink .inner a img {
	border:1px solid #fff;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
}
.staffLink .inner a:hover img {
	border:1px solid #f60;
	box-shadow:0 0 10px #f90;
}


@media screen and (min-width:800px) {
	#staff1 .staffLink .inner {
		padding-top:30px;
	}
}







/* 2020.5.19 */
/* --------- staff recruit page ------------------ */
#recruit_staffHtmlBody #outer {
	background:rgba(153,255,255,0.2);
}
#recruit_staffHtmlBody main article section:nth-of-type(2n) {
	background:rgba(153,153,255,0.2);
}









