/*******************************
contact
*******************************/
#pageContact.confirm #title h1 span {
  margin-left: 0.5em;
  color: #f6af00; }
  @media screen and (max-width: 599px) {
    #pageContact.confirm #title h1 span {
      display: block; } }
#pageContact.confirm .note {
  margin-top: 0.5em;
  opacity: 0.5; }
#pageContact.confirm .btnSubmit {
  display: flex;
  justify-content: center; }
  @media screen and (max-width: 599px) {
    #pageContact.confirm .btnSubmit {
      display: block; } }
  #pageContact.confirm .btnSubmit p {
    width: 18em;
    margin: 0 1em; }
    @media screen and (max-width: 599px) {
      #pageContact.confirm .btnSubmit p {
        margin: 0 auto; } }
  #pageContact.confirm .btnSubmit .return {
    background: rgba(36, 134, 188, 0.5); }
#pageContact.finish #title h1 span {
  margin-left: 0.5em;
  color: #f6af00; }
  @media screen and (max-width: 599px) {
    #pageContact.finish #title h1 span {
      display: block; } }
#pageContact.finish .link {
  margin-top: 2em; }
  @media screen and (max-width: 599px) {
    #pageContact.finish .link {
      text-align: center; } }
  #pageContact.finish .link a {
    color: #00559d;
    text-decoration: underline; }
#pageContact #title {
  background: #000;
  display: flex;
  height: 8.5em;
  align-items: center;
  position: relative;
  overflow: hidden; }
  #pageContact #title h1 {
    width: 1200px;
    max-width: 95%;
    margin: 0 auto;
    font-size: 200%;
    color: #fff; }
    @media screen and (max-width: 599px) {
      #pageContact #title h1 {
        text-align: center;
        font-size: 175%; } }
  #pageContact #title .img {
    opacity: 0.25;
    position: absolute;
    right: 2.5%;
    top: 50%;
    transform: translate(0, -50%);
    width: 25em;
    max-width: 100%; }
#pageContact .wrap {
  background: #fff;
  padding: 4em 0; }
  @media screen and (max-width: 599px) {
    #pageContact .wrap {
      padding: 2.5em 0; } }
  #pageContact .wrap .sec01 {
    margin-bottom: 3em; }
    #pageContact .wrap .sec01 h2 {
      color: #00559d;
      font-size: 1.75em;
      text-align: left; }
      @media screen and (max-width: 599px) {
        #pageContact .wrap .sec01 h2 {
          font-size: 1.375em; } }
      #pageContact .wrap .sec01 h2:after {
        content: "";
        background: #006EAF;
        background: -webkit-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
        background: -o-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
        background: linear-gradient(to right, #006eaf 0%, #00a64e 56%, #f6af00 100%);
        display: block;
        width: 100%;
        height: 0.15em; }

#pageContact .contactTable {
  width: 100%;
  overflow: hidden; }

#pageContact .contactTable:first-of-type {
  margin-bottom: 2.5em; }

#pageContact .contactTable th,
#pageContact .contactTable td {
  padding: 1em 2em;
  border-bottom: 2px solid #fff;
  font-weight: 500;
  color: #333; }

#pageContact .contactTable th {
  width: 34%;
  text-align: left;
  vertical-align: middle;
  background: #eee; }

#pageContact .contactTable th span {
  margin-left: 0.8em;
  color: #fff;
  background: #ff1924;
  padding: 0.1em 1em 0.25em;
  border-radius: 500px;
  font-size: 75%; }

#pageContact .contactTable input[type="text"],
#pageContact .contactTable input[type="tel"],
#pageContact .contactTable input[type="email"],
#pageContact .contactTable textarea {
  width: 100%;
  font-size: 16px;
  font-family: inherit;
  margin: 0.5em 0px;
  padding: 0.75em 0.675em;
  background: #fdf6f6;
  resize: none;
  border: 1px solid #c8c8c8;
  border-radius: 0.25em;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease; }
  #pageContact .contactTable input[type="text"]:focus,
  #pageContact .contactTable input[type="tel"]:focus,
  #pageContact .contactTable input[type="email"]:focus,
  #pageContact .contactTable textarea:focus {
    background: #fff9cc; }

#pageContact .contactTable textarea {
  line-height: 1.4;
  height: 12em; }

#pageContact .contactTable input[type="radio"] {
  opacity: 0;
  vertical-align: middle;
  position: absolute;
  left: 0px;
  top: 0px; }

#pageContact .contactTable input[type="checkbox"] {
  opacity: 0;
  vertical-align: middle;
  position: absolute;
  left: 0px;
  top: 0px; }

#pageContact .contactTable #checkbox-1 input[type="checkbox"] {
  opacity: 100;
  vertical-align: top;
  position: relative; }

#pageContact .contactTable input[type="date"] {
  font-size: 16px;
  padding: 0.5em 0.5em;
  background: #fdf6f6;
  border: 1px solid #c8c8c8;
  border-radius: 0.25em;
  font-family: inherit; }

#pageContact select {
  font-size: 16px;
  margin: 0.625em 0px;
  padding: 0.75em 0.5em;
  background: #fdf6f6;
  border: 1px solid #c8c8c8;
  border-radius: 0.25em;
  font-family: inherit; }

#pageContact .contactTable .nameForm {
  display: flex;
  gap: 0.75em; }

#pageContact .contactTable .nameForm__inner p {
  display: flex;
  align-items: center;
  gap: 0.5em; }

#pageContact .contactTable .radio .list-item-label {
  display: inline-block;
  box-sizing: border-box;
  border-radius: 5px;
  position: relative;
  padding-left: 38px;
  vertical-align: middle;
  margin: 8px 20px 8px 0px; }

#pageContact .contactTable .radio .list-item-label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  background-color: #d4d4d4;
  border: 3px solid #fff;
  box-shadow: 0px 0px 0px 1px #d4d4d4;
  border-radius: 10px; }

#pageContact .contactTable .radio input[type="radio"]:checked + .list-item-label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  background-color: #F95738;
  border: 3px solid #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 0px 1px #F95738; }

#pageContact .contactTable .checkbox .list-item-label {
  display: inline-block;
  box-sizing: border-box;
  border-radius: 5px;
  position: relative;
  padding-left: 38px;
  vertical-align: middle;
  margin: 8px 20px 8px 0px; }

#pageContact .contactTable .checkbox .list-item-label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  background-color: #f4f4f4;
  border: 1px solid #ccc; }

#pageContact .contactTable .checkbox .list-item-label::after {
  border-right: 3px solid #F95738;
  border-bottom: 3px solid #F95738;
  content: '';
  display: block;
  height: 1em;
  left: 1.15em;
  margin-top: -0.95em;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: rotate(45deg);
  width: 0.5rem; }

#pageContact .contactTable .checkbox input[type="checkbox"]:checked + .list-item-label::before {
  border: 1px solid #F95738; }

#pageContact .contactTable .checkbox input[type="checkbox"]:checked + .list-item-label::after {
  opacity: 1; }

#pageContact .contactTable .postAddress .post-num p {
  display: flex;
  align-items: center;
  gap: 0.25em;
  max-width: 21.875em; }

#pageContact .contactTable .postAddress dl {
  margin-top: 20px; }

#pageContact .contactTable .postAddress dd {
  margin-top: -30px; }

#pageContact .contactTable .tel input {
  width: 20em;
  max-width: 100%; }

#pageContact .contactTable .tel p {
  margin-bottom: 0.5em; }

#pageContact .contactTable .birthday td p {
  display: flex;
  align-items: center; }

#pageContact .contactTable .birthday td select {
  margin-right: 0.5em; }

#pageContact .contactTable .birthday td input {
  width: 3em;
  margin: 0 0.5em; }

#pageContact .btnSubmit input {
  display: block;
  width: 100%;
  max-width: 15em;
  margin: 1em auto 0;
  padding: 0.75em 0;
  font-size: 1.25em;
  font-weight: 700;
  color: #fff;
  background: #006EAF;
  background: -webkit-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
  background: -o-linear-gradient(left, #006eaf 0%, #00a64e 56%, #f6af00 100%);
  background: linear-gradient(to right, #006eaf 0%, #00a64e 56%, #f6af00 100%);
  cursor: pointer;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  font-family: inherit;
  border: none;
  column-count: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 500px; }
  @media screen and (max-width: 599px) {
    #pageContact .btnSubmit input {
      font-size: 1.125em; } }

#pageContact .btnSubmit input:hover {
  opacity: .6; }

#pageContact .not-valid-tip {
  color: #ff1924;
  font-weight: 500;
  line-height: 1.4; }

#pageContact .list-item {
  margin: 0 1em 0 -0.5em;
  position: relative; }

.form-control-wrap[data-name='profile-img'] input {
  color: #ff1924;
  font-weight: 500;
  line-height: 1.4;
  font-size: 100%;
  font-family: inherit; }

#pageContact .note01 {
  color: #ff1924;
  font-size: 1.125em;
  font-weight: 700;
  text-indent: -1em;
  margin-left: 1em;
  margin-bottom: 1em; }
#pageContact .note02 {
  text-align: center;
  margin-bottom: 2em; }
#pageContact form.invalid .response-output, #pageContact form.unaccepted .response-output, #pageContact form.payment-required .response-output {
  border: none;
  color: #ff1924;
  font-weight: 500;
  padding: 0;
  text-decoration: underline;
  margin: 0 0 2em;
  background: #fff9cc;
  padding: 1.25em 2.5%; }
#pageContact form.sent .response-output {
  border: none;
  font-weight: 500;
  padding: 0;
  text-decoration: underline;
  margin: 0 0 2em;
  background: #fff9cc;
  padding: 1.25em 2.5%; }
#pageContact .contactBox01 {
  margin: -0.5em 0 2.5em; }
  #pageContact .contactBox01 select {
    width: 100%;
    text-align: center;
    margin: 0 auto;
    display: block;
    font-weight: 500;
    font-size: 112.5%; }
  #pageContact .contactBox01 .note01 {
    margin: -1.5em auto 0;
    padding-left: 1em;
    text-indent: -1em; }
#pageContact.thanks .link01 {
  margin-top: 1.5em; }
  @media screen and (max-width: 599px) {
    #pageContact.thanks .link01 {
      text-align: center; } }
  #pageContact.thanks .link01 a {
    display: inline-block;
    border-bottom: 1px solid #00977A; }

@media screen and (max-width: 599px) {
  #pageContact .contactTable {
    display: block; }

  #pageContact .contactTable tbody, #pageContact .contactTable tr {
    display: block; }

  #pageContact .contactTable th,
  #pageContact .contactTable td {
    display: block; }

  #pageContact .contactTable th {
    width: 100%;
    border-bottom: none;
    padding: 0.75em 2.5%;
    background: #666;
    color: #fff; }

  #pageContact .contactTable td {
    padding: 1em 0 2.5em; }

  #pageContact .contactTable tr:last-child td {
    padding-bottom: 0; }

  #pageContact .contactTable .nameForm {
    flex-wrap: wrap;
    gap: 10px; }

  #pageContact .contactTable th span {
    padding: 0.3em 1em;
    font-size: 87.5%; } }
