@charset "utf-8";
/* CSS Document */
* {box-sizing: border-box;}
html {
	background-color: #F2F2F3;
}
body {
	background-color: #FFF;
  color: #000;
  font-size: 18px;
}
.container {
  margin: 0 auto;
  padding: 0;
	text-align: left;
}
.container:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
img {
  max-width: 100%;
}
.wrap {
  overflow: hidden;
}
@media (max-width: 599px) {
  body {
    font-size: 16px;
  }
  .hidden_sp {
    display: none;
  }
  .container {
    padding: 0;
    overflow: hidden;
  }
  .spWrap {
    width: 100%;
    overflow: hidden;
  }
}
@media (min-width: 600px) and (max-width: 1024px) {
  .container {
    max-width: 850px;
    padding: 0 15px;
  }
  .hidden_tb {
    display: none;
  }
}
@media (min-width: 1025px) {
  .container {
    width: 980px;
    padding: 0;
  }
  .hidden_pc {
    display: none;
  }
}

.wrap {
	flex-direction: column;
	display: flex;
	min-height: 100vh;
}
#header {
	background-image: url("../img/head_border.png");
	background-repeat: repeat-x;
	background-color: #F2F2F3;
	border-bottom: 1px solid #CCC;
	padding-top: 20px;
}
#header .headWrap {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	text-align: left;
}
#header .headWrap h1 {
	font-weight: 400;
}
@media (max-width: 599px) {
#header .headWrap {
	padding: 8px 15px;
	gap: 4px;
}
#header .headWrap .logo {
	width: 50%;
}
#header .headWrap h1 {
	font-size: 18px;
}
}
@media (min-width: 600px) {
#header .headWrap {
	width: 1200px;
	margin: 0 auto;
	flex-direction: row;
	justify-content: space-between;
}
#header .headWrap .logo img {
	max-height: 40px;
}
}
@media (max-width: 599px) {
#main .container {
	padding: 30px 15px;
}
}
@media (min-width: 600px) {
#main .container {
	padding: 50px 0;
}
}

.contents .lead {
	margin-bottom: 30px;
}
.contents ul {
	margin-left: 1.5em;
	margin-bottom: 15px;
}
.contents ul li {
	list-style-position: outside;
	list-style-type: disc;
	line-height: 1.2;
	margin-bottom: 0.5em;
}
.contents ul li span {
	color: #F00;
}
.contents .lead .notice {
	border: 3px solid #F00;
	color: #F00;
	padding: 0.5em 1em;
}
.contents .lead .redRight {
	text-align: right;
	font-size: 80%;
	color: #F00;
}
.contents h3 {
	background-color: #E3EEF5;
	padding: 0.5em 1em;
	margin-bottom: 1em;
}
.contents .note {
	text-indent: 2em;
	margin-bottom: 1em;
}
.contents dl {
	margin-bottom: 1em;
}
.contents dl dt {
	background-color: #F2F2F3;
	padding: 8px;
	line-height: 1.2;
}
.contents dl dt span {
	font-size: 70%;
	background-color: #F00;
	color: #FFF;
	border-radius: 999px;
	padding: 2px 0.8em;
	white-space: nowrap;
}
.contents dl dt sup {
	color: #F00;
}
.contents dl dd {
	padding: 8px;
}
.contents dl dd p.err {
	font-size: 80%;
	color: #F00;
}
.contents dl dd .memo {
	font-size: 80%;
	color: #F00;
}
.contents .bottomLead {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.contents .bottomLead h4 {
	text-decoration: underline;
}
.contents .bottomLead label,
.contents .submit p,
.contents .bottomLead p {
	margin-bottom: 1em;
	font-size: 80%;
}
@media (max-width: 599px) {
.contents dl {
	border: 1px solid #CCC;
}
.contents .bottomLead h4 {
	margin-bottom: 0.5em;
}
}
@media (min-width: 600px) {
.contents dl {
	width: 850px;
	margin: 0 auto 15px;
	display: flex;
	flex-wrap: wrap;
}
.contents dl dt {
	flex-basis: 300px;
	padding: 15px;
	border-bottom: 1px dotted #CCC;
}
.contents dl dd {
	flex-basis: 550px;
	padding: 15px;
	border-bottom: 1px dotted #CCC;
}
.contents .bottomLead {
	width: 850px;
	margin: 0 auto 15px;
	display: flex;
	flex-wrap: wrap;
}
}
@media (min-width: 600px) and (max-width: 1024px) {
.contents dl {
	width: 100%;
}
.contents .bottomLead {
	width: 100%;
}
}
@media (min-width: 1024px) {
.contents dl {
	width: 850px;
}
.contents .bottomLead {
	width: 850px;
}
}

button#btn_post {
  background-color: #ccc;
	border-radius: 4px;
  padding: 0.5em 2em;
	border: none;
}
.submit button.historyback {
	background-color: #8DB5AC;
	display: inline-block;
	border-radius: 4px;
	border: none;
  cursor: pointer;
  padding: 0.8em 2.6em;
	color: #000;
	font-size: 16px;
}

.submit input.send {
	background-color: #ED273C;
	display: inline-block;
	border-radius: 4px;
	border: none;
  cursor: pointer;
  padding: 0.8em;
	color: #FFF;
	font-size: 20px;
}
@media (max-width: 599px) {
.submit input.send {
	width: 100%;
}
}
@media (min-width: 600px) {
.submit input.send {
	width: 50%;
}
}

.form_ok {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 30px;
}
.form_ok h2 {
	font-size: 18px;
}
@media (min-width: 600px) {
.form_ok {
	width: 540px;
	margin: 0 auto;
}
.form_ok h2 {
	font-size: 22px;
}
}
#footer {
	margin-top: auto;
	background-color: #F2F2F3;
	border-top: 1px solid #CCC;
}
#footer .copy {
	text-align: center;
}