@charset 'UTF-8';

/*

    Base

*/

/*  color  */
:root {
	--main-color: #211900;
	--light-color: #f9f3e8;
	--medium-color: #e15c0e;
	--dark-color: #211900;
	--warning-color: #DC143C;
}

/*  webkit  */
body {
	-webkit-text-size-adjust: 100%;
}
a {
	-webkit-tap-highlight-color: rgba(255,255,255,0.4);
}
img {
	-webkit-touch-callout: none;
}
input[type=password], input[type=text], button, textarea {
	max-width: 100%;
	-webkit-appearance: none;
	border-radius: 0;
}

/*  font  */
html { font-size: 8px;}
@media screen and (min-width: 768px) { html { font-size: 10px;}}
body {
	font-family: 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #333333;
}
a {
	color: var(--main-color);
	transition: all 0.1s linear;
}
a:hover   { opacity: 0.7;}

/*  size color  */
body { font-size: 1.5rem;}
h1 { font-size: 2.7rem;}
h2 { font-size: 2.4rem;}
h3 { font-size: 2.1rem;}

/*  common  */
.global ul,
.global li,
.global p {
	margin: 0;
	list-style: none;
}
.global a {
	text-decoration: none;
	color: inherit;
}
div.wrapper {
	margin: 0 20px;
}
@media screen and (min-width: 768px) {
	div.wrapper {
		max-width: 1020px;
		margin: 0 auto;
	}
	div.wrapper.narrow {
		max-width: 640px;
	}
}

/*  max width  */
body img,
body iframe {
	max-width: 100%;
}

/*  placeholder  */
::placeholder {
	font-size: 1.4rem;
	color: #999999;
}

/*  material icons  */
.material-icons {
	margin-right: 0.25em;
	font-size: 1.25em;
	vertical-align: middle;
}





/*

    Header

*/

/*  common  */
body {
	background-color: var(--light-color);
}
header.global {
	display: flex;
	justify-content: space-between;
}

/*  sitetop  */
header.global div.sitetop img {
	display: block;
	height: 60px;
}
@media screen and (min-width: 768px) {
	header.global div.sitetop img {
		height: 110px;
	}
}

/*  account  */
header.global nav.account a {
	display: block;
	width: 40px;
	height: 40px;
	margin-top: 10px;
	margin-right: 15px;
	background-color: #ffffff;
	border-radius: 45px;
}
@media screen and (min-width: 768px) {
	header.global nav.account a {
		margin-top: 30px;
		margin-right: 30px;
	}
}






/*

    Breadcrumbs

*/

/*  common  */
nav.breadcrumbs {
	padding: 5px;
}
nav.breadcrumbs ol {
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
nav.breadcrumbs ol li {
	display: inline;
	margin: 0;
	color: #999999;
	font-size: 1.3rem;
}
nav.breadcrumbs ol li:before {
	content: '>';
	margin: 0 0.25em;
}
nav.breadcrumbs ol li:first-child:before {
	content: none;
}
nav.breadcrumbs ol li a {
	color: inherit;
}
@media screen and (min-width: 768px) {
	nav.breadcrumbs {
		max-width: 1220px;
		margin: 0 auto;
		padding: 1em;
	}
}





/*

    Message

*/

/*  layout  */
#message {
	display: flex;
	align-items: center;
	margin: 1em;
	padding: 0.5em 1em;
	color: #ffffff;
	border-radius: 3px;
	animation: failure 10s linear both;
}
#message.success { background-color: #8fc31f;}
#message.failure { background-color: #ea545d;}
#message p {
	margin: 0 0 0 0.75em;
}
@media screen and (min-width: 768px) {
	#message {
		max-width: 1200px;
		margin: 1em auto;
	}
}
@keyframes failure {
	0% { opacity: 1;}
	2% { opacity: 1;}
	5% { opacity: 0.3;}
	12% { opacity: 1;}
	95% { opacity: 1;}
	100% { opacity: 0;}
}



/*

    Footer

*/

/*  common  */
footer.global {
	background-color: var(--dark-color);
	color: #ffffff;
}
@media screen and (min-width: 768px) {
	footer.global {
		display: flex;
		justify-content: space-between;
		padding: 30px 60px;
	}
	footer.global nav.footer {
		width: 70%;
	}
}

/*  navigation  */
footer.global nav.footer ul {
	padding: 1.5em 2em 1em;
}
footer.global nav.footer ul li {
	margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
	footer.global nav.footer ul {
		display: flex;
	}
	footer.global nav.footer ul li {
		margin: 1em 2em 1em 1em;
		font-size: 1.3rem;
	}
}

/*  small  */
footer.global small {
	display: block;
	margin: 1em 0;
	text-align: center;
}
footer.global small img {
	display: inline-block;
	height: 60px;
}
@media screen and (min-width: 768px) {
	footer.global small img {
		height: 90px;
	}
}





/*

    Contents

*/

/*  layout  */
div#contents {
	padding: 0 0 2em;
}
@media screen and (min-width: 768px) {
	div#contents {
		padding: 1em 1em 6em;
	}
}

/*  container  */
div.container {
	margin: 2em 1em;
	padding: 2em;
	background-color: #ffffff;
	box-shadow: 3px 3px 10px 5px rgba(0,0,0,0.05);
	border-radius: 10px;
}
div.container > *:first-child {
	margin-top: 0;
}
div.container > *:last-child {
	margin-bottom: 0;
}
@media screen and (min-width: 768px) {
	div.container {
		max-width: 1200px;
		margin: 2em auto;
		padding: 3em;
		box-sizing: border-box;
	}
}

/*  container.form  */
@media screen and (min-width: 768px) {
	div.container.form {
		max-width: 720px;
	}
}

/*  container.narrow  */
@media screen and (min-width: 768px) {
	div.container.narrow {
		max-width: 960px;
	}
}





/*

    Common modules

*/

/*  h1  */
h1 {
	margin: 0 0 1em;
	text-align: center;
}
h1.plain {
	padding: 2em 0;
	background-color: var(--half-color);
	color: #ffffff;
	text-align: center;
	border-radius: 5px;
}

/*  headings  */
h2 {
	margin: 2em 0 1em;
	text-align: center;
}

/*  strong.caution  */
strong.caution {
	color: var(--warning-color);
}

/*  line height  */
p, li {
	line-height: 2;
}

/*  hr  */
hr {
	border-color: var(--main-color);
}

/*  table  */
table {
	width: 100%;
}
table th {
	background-color: var(--main-color);
	color: #ffffff;
}

/*  notes  */
.notes {
	font-size: 1.3rem;
	color: #666666;
}

/*  buttons  */
nav.buttons {
	display: flex;
	justify-content: center;
	gap: 1em;
}
a.button, input[type=submit], button {
	display: inline-block;
	min-width: 5em;
	margin: 0.25em 0;
	padding: 0.5em 2em;
	background-color: var(--main-color);
	border: 1px var(--main-color) solid;
	font-size: 1.5rem;
	font-weight: normal;
	line-height: 1.5;
	color: #ffffff;
	text-align: center;
	border-radius: 100px;
	cursor: pointer;
	box-sizing: border-box;
}
a.button.small, input[type=submit].small, button.small {
	min-width: 4em;
	padding: 0.25em 1em;
}
a.button.xsmall, input[type=submit].xsmall, button.xsmall {
	min-width: 3em;
	padding: 0.125em 0.5em;
	font-size: 1.2rem;
}
a.button.large, input[type=submit].large, button.large {
	width: 100%;
	max-width: 530px;
	min-width: 8em;
	padding: 0.5em 4em;
	font-size: 1.8rem;
}
a.button.xlarge, input[type=submit].xlarge, button.xlarge {
	width: 100%;
	padding: 0.75em 3em;
	font-size: 2.1rem;
	box-sizing: border-box;
}
a.button.light, input[type=submit].light, button.light,
a.button.back, input[type=submit].back, button.back {
	background-color: transparent;
	color: var(--main-color);
}
a.button.back, input[type=submit].back, button.back {
	margin-top: 2em;
	padding: 0.25em 1em;
}

/*  div.multi-button  */
div.multi-button {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1em;
}

/*  labels  */
span.label {
	display: inline-block;
	margin: 0 0.25em 0.25em 0;
	padding: 0 0.5em;
	background-color: var(--main-color);
	color: #ffffff;
	font-size: 1.2rem;
	font-weight: bold;
	border-radius: 2px;
}
span.label.disable,
span.label.optional {
	background-color: #999999;
}
span.label.warning,
span.label.required {
	background-color: #ea545d;
}
span.label.required:before { content: '\5FC5\9808';}
span.label.optional:before { content: '\4EFB\610F';}

/*  badge  */
span.badge {
	display: inline-block;
	min-width: 1.25em;
	height: 1.25em;
	margin: 0 0.25em;
	padding: 0;
	background-color: #ff0000;
	color: #ffffff;
	font-size: smaller;
	text-align: center;
	line-height: 1.25;
	border-radius: 3em;
}

/*  div.em  */
div.em {
	margin: 1em 0;
	padding: 0.75em 1em;
	background-color: var(--dark-color);
	color: #ffffff;
	border-radius: 5px;
}

/*  div.warning  */
div.warning {
	margin: 1em 0;
	padding: 0.75em 1em;
	background-color: var(--warning-color);
	color: #ffffff;
	border-radius: 5px;
}

/*  div.notice  */
div.notice {
	margin: 5em 0 1em;
	padding: 0.1em 2em 0;
	border: 1px var(--medium-color) solid;
	background-color: var(--light-color);
	border-radius: 5px;
}
div.notice h2 {
	margin-top: 1.25em;
	font-size: 2.1rem;
}
div.notice ul.items li {
	border: none;
	border-top: 1px var(--medium-color) solid;
}

/*  p.em  */
p.em {
	padding: 0.5em 1em;
	background-color: var(--light-color);
}

/*  pager  */
nav.page ol {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 3em 0;
}
nav.page ol li {
	margin: 0 0.5em;
	list-style: none;
}
nav.page ol li a {
	display: block;
	padding: 0.5em 1em;
	background-color: #ffffff;
	border: 1px var(--main-color) solid;
	color: var(--main-color);
	border-radius: 3px;
}
nav.page ol li.current a {
	background-color: var(--main-color);
	color: #ffffff;
}

/*  div.image-text  */
div.image-text img {
	display: block;
	border-radius: 10px;
}
div.image-text div.text {
	margin: 2em 0 3em;
}
div.image-text div.text h2 {
	margin: 0;
	text-align: left;
}
@media screen and (min-width: 768px) {
	div.image-text {
		display: flex;
		margin: 1em 0 6em;
		align-items: flex-start;
	}
	div.image-text.reverse {
		flex-direction: row-reverse;
	}
	div.image-text img {
		width: 45%;
	}
	div.image-text div.text {
		width: 55%;
		padding-left: 5em;
		padding-right: 1em;
		box-sizing: border-box;
	}
	div.image-text.reverse div.text {
		padding-left: 1em;
		padding-right: 5em;
	}
}

/*  dl.information  */
dl.information > dt {
	font-weight: normal;
	color: #666666;
}
dl.information > dd {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0.25em 0 1em;
	padding-bottom: 1em;
	border-bottom: 1px var(--main-color) dotted;
}
@media screen and (min-width: 768px) {
	dl.information {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		margin: 2em 0;
		border-bottom: 1px var(--main-color) dotted;
	}
	dl.information > dt {
		width: 30%;
		margin: 0;
		padding: 1.5em 0;
		border-top: 1px var(--main-color) dotted;
	}
	dl.information > dd {
		width: 70%;
		margin: 0;
		padding: 1.5em 0 1.5em 1em;
		border-top: 1px var(--main-color) dotted;
		border-bottom: none;
		box-sizing: border-box;
	}
}

/*  dl.openable  */
dl.openable {
	width: 100%;
}
dl.openable dt {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5em 0;
	border-bottom: 1px var(--main-color) dotted;
	font-weight: normal;
	cursor: pointer;
}
dl.openable dt:after {
	content: '';
	display: block;
	width: 0.5em;
	height: 0.5em;
	border-bottom: 2px #cccccc solid;
	border-right: 2px #cccccc solid;
	transform: rotate(45deg);
}
dl.openable dt.open:after {
	transform: rotate(-135deg);
}
dl.openable dd {
	display: none;
	margin: 0;
	padding: 1em 0;
}

/*  ul.items  */
ul.items {
	border-top: 1px var(--main-color) dotted;
}
ul.items li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0;
	padding: 1em 0;
	border-bottom: 1px var(--main-color) dotted;
}
ul.items li div.information {
	width: 70%;
}
ul.items li div.information span.supplementary {
	font-size: 1.3rem;
	color: #666666;
}
ul.items li div.information span.label {
	margin: 0;
}
ul.items li div.information a {
	color: inherit;
	cursor: pointer;
}
ul.items li div.action {
	width: 25%;
	text-align: right;
}
ul.items.small li {
	padding: 0.25em 0;
}

/*  div.faq  */
div.faq div.category h2 {
	padding: 0 0 1em;
	border-bottom: 1px #eeeeee solid;
}
div.faq div.category dl dt {
	margin: 1em 0;
	font-weight: normal;
	cursor: pointer;
}
div.faq div.category dl dt span.question {
	margin-right: 0.5em;
}
div.faq div.category dl dd {
	display: none;
	gap: 0.5em;
	margin: 0 0 1em 1em;
	padding: 1em;
	background-color: #eeeeee;
	border-radius: 5px;
}
@media screen and (min-width: 768px) {
	div.faq {
		display: flex;
		flex-wrap: wrap;
	}
	div.faq div.category {
		width: 50%;
		box-sizing: border-box;
	}
	div.faq div.category:nth-child(odd) {
		padding-right: 1.5em;
	}
	div.faq div.category:nth-child(even) {
		padding-left: 1.5em;
	}
}

/*  ul.dates  */
ul.dates li {
	margin: 1em;
	padding: 1em;
	border: 1px #211900 dotted;
	border-radius: 10px;
	list-style: none;
	text-align: center;
}
ul.dates li > *:first-child {
	margin-top: 0;
}
ul.dates li > *:last-child {
	margin-bottom: 0;
}
ul.dates li div.status {
	padding-top: 60px;
	background-size: 60px 60px;
	background-position: center top;
}
ul.dates li div.status.close { background-image: url('../images/close.png');}
ul.dates li div.status.open { background-image: url('../images/open.png');}
ul.dates li div.status.full { background-image: url('../images/full.png');}

@media screen and (min-width: 768px) {
	ul.dates {
		display: flex;
		flex-wrap: wrap;
	}
	ul.dates li {
		width: calc(33.3% - 2em);
		box-sizing: border-box;
	}
}



/*

    Form common

*/

/*  basic elements  */
input[type=text], input[type=password], input[type=email], input[type=date], input[type=datetime-local], input[type=time], textarea {
	width: 100%;
	padding: 0.5em 1em;
	border-radius: 1.5em;
	box-sizing: border-box;
}
select {
	padding: 0.5em 1em;
	background-color: #ffffff;
	border-radius: 100px;
	box-sizing: border-box;
}
input[type=datetime-local], input[type=time] {
	width: auto;
}
input[type=file] {
	display: none;
}
label.file {
	display: flex;
	justify-content: space-between;
	min-width: 48%;
	border: 1px #cccccc solid;
	font-size: 1.3rem;
	border-radius: 100px;
	overflow: hidden;
	cursor: pointer;
}
label.file:before,
label.file span {
	display: block;
	padding: 1em 1.25em;
	color: #666666;
}
label.file:before {
	content: '\30D5\30A1\30A4\30EB\3092\9078\629E\3057\3066\304F\3060\3055\3044';
}
label.file:after {
	content: '\9078\629E';
	display: flex;
	align-items: center;
	padding: 1em 1.25em;;
	background-color: var(--main-color);
	color: #ffffff;
}
label.file.selected:before {
	content: none;
}
label.file.selected:after {
	content: '\53D6\6D88';
}

/*  dl  */
form dl dt {
	font-weight: normal;
	color: #666666;
}
form dl dd {
	margin: 0.5em 0 2em;
}
form dl dd.notes {
	margin-top: -1.75em;
}
form dl dd.error {
	padding: 0.5em;
	border: 1px var(--warning-color) solid;
}
form dl dd.error-message {
	margin-top: -1.75em;
	font-size: smaller;
	color: var(--warning-color);
}
form dl dd p.error-message {
	font-size: smaller;
	color: var(--warning-color);
}
form dl dd div.wide {
	width: 100%;
}
@media screen and (min-width: 768px) {
	form dl dd {
		display: flex;
		gap: 1em;
		align-items: center;
	}
}

/*  dd.address  */
form dl dd.address input {
	margin: 0.25em 0;
}
form dl dd.address input[name*=zip1] {
	width: 6em;
}
form dl dd.address input[name*=zip2] {
	width: 10em;
}
form dl dd.address input[name=pref],
form dl dd.address input[name=city],
form dl dd.address input[name=address] {
	width: 100%;
}
@media screen and (min-width: 768px) {
	form dl dd.address {
		flex-wrap: wrap;
	}
	form dl dd.address input {
		margin: 0;
	}
}

/*  confirm  */
form.confirm dl dt {
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	border-bottom: 1px #cccccc solid;
}





/*

    Entrance Form

*/

/*  layout  */
form.entrance {
	margin: 1.5em;
	padding: 1em 2em 2em;
	background-color: #ffffff;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	border-radius: 5px;
	text-align: center;
}
form.entrance dl {
	text-align: left;
}
@media screen and (min-width: 768px) {
	form.entrance {
		max-width: 530px;
		margin: 0 auto;
		box-sizing: border-box;
	}
}

/*  description  */
form.entrance p.description {
	color: #666666;
	text-align: center;
}
form.entrance p.description img {
	display: block;
	height: 80px;
	margin: 0 auto;
}

/*  help  */
form.entrance p.help {
	text-align: center;
}

/*  adjust  */
form.entrance dl dt {
	font-size: 1.3rem;
}
form.entrance dl dd {
	margin: 0 0 0.5em;
}
form.entrance button, form.entrance input[type=submit] {
	margin: 0;
}





/*

    Workspace nav

*/

/*  common  */
nav.workspace {
	margin: 1em;
}
nav.workspace ul li {
	margin: 1em 0;
	list-style: none;
}
nav.workspace ul li a {
	display: flex;
	align-items: center;
	padding: 1.25em;
	background-color: var(--light-color);
	color: #333333;
	border-radius: 5px;
}
nav.workspace ul li.disabled {
	opacity: 0.3;
}
nav.workspace ul li a i {
	margin-right: 0.5em;
	color: var(--main-color);
	font-size: 4.0rem;
}
@media screen and (min-width: 768px) {
	nav.workspace {
		max-width: 1220px;
		margin: 0 auto;
		overflow: hidden;
	}
	nav.workspace ul {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		margin: 0 -1em;
	}
	nav.workspace ul li {
		width: 33.3%;
		margin: 0;
		padding: 1em;
		box-sizing: border-box;
	}
}





/*

    Manager

*/

/*  layout  */
body.manager div#contents {
	display: flex;
	padding: 0;
}
body.manager div#contents nav.menu {
	flex-shrink: 0;
	width: 250px;
	padding: 0;
	background-color: var(--dark-color);
	color: #ffffff;
}
body.manager div#contents div.container {
	width: 100%;
	max-width: none;
	padding: 2em 3em;
}
@media screen and (max-width: 767px) {
	body.manager div#contents nav.menu {
		width: 45px;
	}
	body.manager div#contents div.container {
		padding: 0.5em 1em;
	}
}


/*  message  */
body.manager #message {
	max-width: none;
	margin: 0;
	border-radius: 0;
	animation: none;
}

/*  menu  */
body.manager div#contents nav.menu ul {
	position: sticky;
	top: 60px;
	margin: 0;
	padding: 0.75em 0;
}
body.manager div#contents nav.menu ul li {
	margin: 0;
	list-style: none;
}
body.manager div#contents nav.menu ul li.disabled {
	opacity: 0.3;
}
body.manager div#contents nav.menu ul li a {
	display: flex;
	align-items: center;
	padding: 0.75em 1em;
	color: #ffffff;
}
body.manager div#contents nav.menu ul li a.current {
	background-color: var(--light-color);
	color: var(--dark-color);
}
body.manager div#contents nav.menu ul li a i {
	margin-right: 0.5em;
}
@media screen and (max-width: 767px) {
	body.manager div#contents nav.menu ul li a {
		padding: 1em 0;
		font-size: 1.8rem;
		justify-content: center;
	}
	body.manager div#contents nav.menu ul li a i {
		margin-right: 0;
	}
	body.manager div#contents nav.menu ul li a span.name {
		display: none;
	}
}