@charset "UTF-8";
body {
  background: #FFF;
  color: #666666;
  font-family: ArialMT, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif !important;
  font-size: 14px;
  line-height: 1.5;
  -webkit-text-size-adjust: none;
  /* フォントサイズ自動調整 */
  word-wrap: break-word;
  margin: 0;
}

hr {
  border: 0;
  height: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

/*****************　共通 *****************/
body {
  max-width: 640px;
  width: 100%;
  margin: 0 auto;
  background-color: #FFFFFF;
}

#header {
  width: 100%;
}
#header header {
  width: 100%;
  display: block;
}
#header header div:first-of-type {
  width: 50%;
}
#header header div:first-of-type > img {
  display: inline-block;
  width: 100%;
  padding-left: 5px;
  margin-left: 5px;
  max-width: 190px;
}
#header header div {
  width: 45%;
  display: inline-block;
}
#header header div button {
  display: block;
  background-color: #0085cf;
  margin: 10px 0 10px auto;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  line-height: 6px;
  padding: 2px 10px;
  width: 85%;
  max-width: 180px;
}
#header header div button img {
  width: 22px;
  display: inline-block;
}
#header header div button p {
  display: inline-block;
  color: #FFF;
  font-size: 12px;
  vertical-align: middle;
}
#header header div button a {
  text-decoration: none;
}

#header nav {
  width: 100%;
  line-height: 3.0em;
}
#header nav ul {
  border-top: 2px solid #dfe5e6;
  padding: 0px;
  margin: 0px;
  letter-spacing: -0.3em;
}
#header nav ul li {
  display: inline-block;
  width: 33.0%;
  font-size: 12px;
  text-align: center;
  letter-spacing: normal;
  list-style-type: none;
}
#header nav ul li:first-of-type {
  font-size: 10px;
  border-right: 1px solid #dfe5e6;
  border-bottom: 5px solid #ffc82e;
}
#header nav ul li:first-of-type a {
  color: #ffc82e;
}
#header nav ul li:nth-of-type(2) {
  border-right: 1px solid #dfe5e6;
  border-bottom: 5px solid #0085cf;
}
#header nav ul li:nth-of-type(2) a {
  color: #0085cf;
}
#header nav ul li:nth-of-type(3) {
  border-bottom: 5px solid #fd4239;
}
#header nav ul li:nth-of-type(3) a {
  color: #fd4239;
}
#header nav ul li a {
  display: block;
  text-decoration: none;
}

#main #mainVisual {
  width: 100%;
  position: relative;
}
#main #mainVisual img {
  width: 100%;
}
#main #mainVisual p {
  position: absolute;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  background-color: rgba(240, 123, 5, 0.3);
  width: 100%;
  bottom: 0px;
  margin: 0;
  color: #FFF;
  text-align: center;
  font-size: 18px;
}

#registWrap {
  margin: 10px 0 30px;
}
#registWrap div {
  width: 100%;
  text-align: center;
}
#registWrap div > img {
  width: 60px;
}
#registWrap div p {
  display: inline-block;
  color: #8fd400;
}
#registWrap div a {
  display: inline-block;
  width: 40%;
}
#registWrap div a > img {
  width: 100%;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  -moz-box-shadow: 1px 2px 4px #999;
  -webkit-box-shadow: 1px 2px 4px #999;
  box-shadow: 1px 2px 4px #999;
}
#registWrap div a:first-of-type {
  margin-right: 3%;
}
#registWrap div a:nth-of-type(2) {
  margin-left: 3%;
}
#registWrap > p {
  text-align: center;
  color: #000;
}

#main article {
  width: 100%;
  background-color: #e3decc;
  padding-bottom: 10px;
}
#main article h1 {
  font-size: 105%;
  text-align: center;
  padding: 15px 0 5px 0;
  color: #000;
}
#main article h1:before {
  content: "|";
  display: inline-block;
  margin-right: 5px;
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#main article h1:after {
  content: "|";
  display: inline-block;
  margin-left: 5px;
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#main article .field {
  width: 95%;
  margin: 0 auto 10px;
  background-color: #FFF;
  padding-top: 5px;
  overflow: auto;
}
#main article .field h2 {
  position: relative;
  background-color: #ee8dc2;
  color: #FFF;
  font-size: 15px;
  line-height: 2.0em;
  width: 85%;
  padding-left: 10px;
  -moz-box-shadow: 1px 2px 4px #999;
  -webkit-box-shadow: 1px 2px 4px #999;
  box-shadow: 1px 2px 4px #999;
}
#main article .field h2:after {
  content: "";
  position: absolute;
  top: 0px;
  left: 100%;
  width: 0;
  height: 0;
  border-width: 15px 10px;
  border-style: solid;
  border-color: #ee8dc2;
  border-right-color: transparent;
}
#main article .field img {
  width: 45%;
  float: left;
  margin-left: 10px;
  margin-right: 10px;
  padding-bottom: 20px;
}
#main article .field p {
  overflow: hidden;
}
#main article .field p::after {
  content: "";
  display: block;
  clear: both;
}

#main #prof {
  width: 100%;
  background-color: #abdfbf;
}
#main #prof h1 {
  font-size: 16px;
  color: white;
  background-color: #58be89;
  line-height: 2.0em;
}
#main #prof h1 img {
  width: 25px;
  margin: 5px 10px;
  vertical-align: bottom;
}
#main #prof form {
  width: 100%;
  padding-bottom: 0;
}
#main #prof form p {
  width: 100%;
  color: black;
  font-size: 16px;
  margin: 5px 0 15px 0;
}
#main #prof form p span {
  width: 30%;
  display: inline-block;
  text-align: right;
  margin-left: 20px;
  font-size: 18px;
  font-weight: bold;
}
#main #prof form p select {
  background-color: white;
  border: 1px solid black;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 3px;
}
#main #prof form div {
  width: 160px;
  position: relative;
  margin: 0 auto;
}
#main #prof form div input[type="submit"] {
  background: url(../img/searchButton_160_45_3.png) no-repeat 0 0;
  display: block;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  margin: 10px auto 0;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
#main #prof form div span {
  position: absolute;
  left: 58px;
  top: 9px;
  color: white;
  font-size: 20px;
}
#main #prof form div img {
  position: absolute;
  left: 18px;
  top: 8px;
  width: 28px;
  margin-right: 10px;
  vertical-align: top;
}
#main #prof > p {
  color: #2c3e50;
  text-align: center;
  padding-bottom: 10px;
  margin-top: 8px;
}

#footer {
  width: 100%;
  background-color: whitesmoke;
}
#footer ul {
  /*
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  */
  list-style-type: none;
  padding-left: 0;
  border-top: 1px solid #B7B7B7;
  border-bottom: 1px solid #B7B7B7;
  width: 100%;
}
#footer ul::after {
  content: "";
  display: block;
  clear: both;
}
#footer ul li {
  width: 49%;
  font-size: 12px;
  padding: 7px 0 7px 2px;
}
#footer ul li:first-of-type, #footer ul li:nth-of-type(3) {
  float: left;
}
#footer ul li:nth-of-type(2), #footer ul li:nth-of-type(4) {
  float: right;
}
#footer ul li a {
  display: block;
  color: black;
  text-decoration: none;
}
#footer ul li a img {
  width: 20px;
  margin: 0 5px;
  vertical-align: text-bottom;
  vertical-align: bottom;
}
#footer ul li:first-of-type {
  border-bottom: 1px solid #B7B7B7;
  border-right: 1px solid #B7B7B7;
}
#footer ul li:nth-of-type(2), #footer ul li:nth-of-type(3), #footer ul li:nth-of-type(4) {
  border-bottom: 1px solid #B7B7B7;
}
#footer ul li:nth-of-type(3) {
  border-right: 1px solid #B7B7B7;
}
#footer dl {
  font-size: 12px;
  margin: 5px 0 0 0;
}
#footer dl dt {
  margin-left: 10px;
}
#footer dl dd {
  display: inline-block;
}
#footer dl dd:nth-of-type(2) {
  margin-left: 5px;
}
#footer footer {
  background-color: #3d3431;
}
#footer footer p {
  color: white;
  text-align: center;
  margin-bottom: 0;
}
#footer footer p span {
  margin: 0 7px;
}

#agreeWrap, #privacyWrap, #companyWrap, #ageWrap {
  width: 100%;
}
#agreeWrap article, #privacyWrap article, #companyWrap article, #ageWrap article {
  width: 95%;
  margin: 0 auto;
}
#agreeWrap article section, #privacyWrap article section, #companyWrap article section, #ageWrap article section {
  margin-bottom: 40px;
}
#agreeWrap article section h2, #privacyWrap article section h2, #companyWrap article section h2, #ageWrap article section h2 {
  font-size: 20px;
  margin-bottom: 3px;
}
#agreeWrap article section p, #privacyWrap article section p, #companyWrap article section p, #ageWrap article section p {
  margin-top: 0;
}

#memberWrap {
  width: 100%;
}
#memberWrap article {
  width: 90%;
  margin: 0 auto;
}
#memberWrap article h2 {
  font-size: 20px;
}
#memberWrap article > p {
  text-align: left;
}
#memberWrap article form {
  width: 100%;
}
#memberWrap article form p {
  font-size: 18px;
}
#memberWrap article form p span {
  display: inline-block;
  width: 100px;
  text-align: right;
  font-size: 16px;
}
#memberWrap article form p input[type="text"] {
  border: 1px solid black;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 5px;
}
#memberWrap article form p input[name="password"] {
  padding-right: 30px;
}
#memberWrap article form > p {
  position: relative;
  width: 160px;
  margin: 0 auto;
}
#memberWrap article form > p span {
  position: absolute;
  top: 20px;
  left: 20px;
  color: white;
  font-size: 20px;
  font-weight: bold;
  width: 160px;
  text-align: left;
}
#memberWrap article form > p span img {
  width: 24px;
  margin-right: 10px;
  vertical-align: sub;
}
#memberWrap article form > p input[type="submit"] {
  background: url(../img/loginButton_160_45_2.png) no-repeat 0 0;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  margin: 10px auto 0;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
#memberWrap article section {
  margin-top: 50px;
}

#qaWrap {
  width: 90%;
  margin: 0 auto;
}
#qaWrap h1 {
  font-size: 20px;
}
#qaWrap article section h2 {
  font-size: 16px;
  border-bottom: 1px solid #000;
  display: inline-block;
}
#qaWrap article section p {
  margin-top: 0;
}
#qaWrap > section {
  margin-top: 35px;
}
#qaWrap > section h2 {
  font-size: 16px;
  margin-bottom: 5px;
}
#qaWrap > section p {
  margin-top: 0;
}
#qaWrap > section a {
  background-color: #0085cf;
  color: #FFF;
  text-decoration: none;
  padding: 10px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  display: block;
  width: 160px;
  text-align: center;
  margin: 10px auto 40px;
  font-size: 16px;
}
#qaWrap > section a img {
  width: 25px;
  vertical-align: bottom;
  margin-right: 10px;
}

#wrapContact {
  width: 90%;
  margin: 0 auto;
}
#wrapContact h1 {
  font-size: 20px;
  margin-bottom: 5px;
}
#wrapContact > p {
  margin-top: 5px;
}
#wrapContact article {
  margin-top: 25px;
}
#wrapContact article section {
  margin-top: 20px;
  margin-bottom: 20px;
}
#wrapContact article section h2 {
  font-size: 18px;
  margin-bottom: 3px;
}
#wrapContact article section h2 img {
  width: 23px;
  margin-right: 8px;
  vertical-align: top;
}
#wrapContact article section dl {
  margin-top: 3px;
  color: #212121;
}
#wrapContact article section dl dt {
  font-size: 20px;
}
#wrapContact article section dl dt a {
  color: #00796b;
}
#wrapContact article section dl dd {
  margin-left: 20px;
}
#wrapContact article section dl dd:first-of-type {
  margin-top: 8px;
}
#wrapContact article section dl dd span {
  color: #FF0000;
}

#regist_check_wrap {
  width: 90%;
  margin: 0 auto;
}
#regist_check_wrap h1 {
  font-size: 20px;
  margin-bottom: 10px;
}
#regist_check_wrap p {
  color: #212121;
  font-size: 16px;
  margin-top: 10px;
}
#regist_check_wrap article {
  margin-top: 20px;
  margin-bottom: 40px;
}
#regist_check_wrap article section h2 {
  text-align: center;
}
#regist_check_wrap article section h2 a {
  color: #8e44ad;
}
#regist_check_wrap article section h2 img {
  margin-right: 8px;
}

#regist_01 {
  width: 95%;
  margin: 0 auto;
}
#regist_01 form {
  width: 100%;
  margin: 0 auto;
}
#regist_01 form h1 {
  font-size: 20px;
}
#regist_01 form h1 img {
  width: 28px;
  margin-right: 6px;
  vertical-align: middle;
}
#regist_01 form p {
  color: #212121;
  font-size: 16px;
  margin-top: 20px;
  margin-bottom: 5px;
}
#regist_01 form p.p_em {
  color: #27ae60;
  font-weight: bold;
  font-size: 16px;
}
#regist_01 form input, #regist_01 form select {
  border: 2px solid #212121;
  padding: 14px;
  font-size: 16px;
  background-color: #FFFFFF;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
#regist_01 form input[type="text"] {
  width: 70%;
}
#regist_01 form select[name="age"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  padding: 14px;
  background: #EEE url(../img/arrow_64.png) no-repeat;
  background-size: 20px 20px;
  background-position: 90% center;
  width: 90px;
  display: block;
}
#regist_01 form select[name="map"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  padding: 14px;
  background: #EEE url(../img/arrow_64.png) no-repeat;
  background-size: 20px 20px;
  background-position: 95% center;
  width: 200px;
  margin-bottom: 25px;
  display: block;
}
#regist_01 form input[type="submit"] {
  margin: 0 auto 30px auto;
  background: url(../img/loginButton_160_45_3.png) no-repeat 0 0;
  display: block;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
#regist_01 form input[name="name"] + p {
  display: inline-block;
  font-size: 20px;
  vertical-align: bottom;
}
#regist_01 form .sms_input_form_error {
  color: #FF0000;
}

.regist_header {
  width: 100%;
}
.regist_header header {
  width: 55%;
  padding: 15px 8px;
}
.regist_header header img {
  width: 100%;
  max-width: 190px;
}

form.regist_back {
  width: 100%;
  margin: 0 auto 20px auto;
  text-align: center;
}
form.regist_back input[type="submit"] {
  border: 1px solid #999999;
  padding: 15px 20px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: #2ecc71;
  color: #FFFFFF;
  font-weight: bold;
}

#regist_02 {
  width: 95%;
  margin: 0 auto;
}
#regist_02 form {
  width: 100%;
  margin: 0 auto;
}
#regist_02 form h1 {
  font-size: 20px;
}
#regist_02 form h1 img {
  width: 28px;
  margin-right: 6px;
  vertical-align: middle;
}
#regist_02 form p {
  color: #212121;
  font-size: 16px;
  margin-top: 20px;
  margin-bottom: 5px;
}
#regist_02 form input, #regist_02 form select {
  border: 2px solid #212121;
  padding: 14px;
  font-size: 16px;
  background-color: #FFFFFF;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
#regist_02 form input[type="submit"] {
  margin: 0 auto 30px auto;
  background: url(../img/loginButton_160_45_3.png) no-repeat 0 0;
  display: block;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
#regist_02 form select[name="map2"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  padding: 14px;
  background: #EEE url(../img/arrow_64.png) no-repeat;
  background-size: 20px 20px;
  background-position: 95% center;
  width: 200px;
  margin-bottom: 25px;
  display: block;
}
#regist_02 form .sms_input_form_error {
  color: #FF0000;
}

#regist_03 {
  width: 95%;
  margin: 0 auto;
}
#regist_03 form {
  width: 100%;
  margin: 0 auto;
}
#regist_03 form h1 {
  font-size: 20px;
  color: #212121;
}
#regist_03 form h1 img {
  width: 28px;
  margin-right: 6px;
  vertical-align: top;
}
#regist_03 form p {
  color: #212121;
  font-size: 16px;
  margin-top: 20px;
  margin-bottom: 5px;
}
#regist_03 form p span {
  font-size: 18px;
  color: #0000ff;
  font-weight: bold;
}
#regist_03 form p.p_em {
  color: #27ae60;
  font-weight: bold;
  font-size: 16px;
}
#regist_03 form input, #regist_03 form select {
  border: 2px solid #212121;
  padding: 14px;
  font-size: 16px;
  background-color: #FFFFFF;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
#regist_03 form input[type="submit"] {
  margin: 0 auto 30px auto;
  background: url(../img/loginButton_160_45_4.png) no-repeat 0 0;
  display: block;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
#regist_03 form .sms_input_form_error {
  color: #FF0000;
}

#regist_04 {
  width: 95%;
  margin: 0 auto;
}
#regist_04 h1 {
  font-size: 20px;
  color: #212121;
  position: relative;
  padding: 5px 10px;
  border-left: 6px solid #3498db;
}
#regist_04 h1:after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 100%;
  height: 0;
  border-bottom: 1px solid #ccc;
}
#regist_04 p.mainText {
  font-size: 16px;
  color: #212121;
}
#regist_04 p.mainText span {
  color: #FF0000;
}
#regist_04 p {
  font-size: 16px;
}
#regist_04 h2 {
  position: relative;
  padding: 5px 10px;
}
#regist_04 h2:after {
  position: absolute;
  bottom: 5px;
  left: 0;
  z-index: -1;
  content: '';
  width: 90%;
  height: 10px;
  background-color: #b6f0fc;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

#regist_02 form input#back[type="submit"] {
  margin: 0 auto 30px auto;
  background: url(../img/backButton_160_45.png) no-repeat 0 0;
  display: block;
  width: 160px;
  height: 45px;
  color: transparent;
  font-size: 0;
  text-align: center;
  padding: 0;
  border: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 1px 1px 4px #999;
  -webkit-box-shadow: 1px 1px 4px #999;
  box-shadow: 1px 1px 4px #999;
}
