.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center; }

#contact .main-visual {
  border-bottom: 1px solid #B0B0B0;
  background-color: #fff; }
  #contact .main-visual .layout h2 {
    font-size: 26px;
    color: #666666;
    line-height: 1;
    padding: 32px 0 13px; }

#contact .left {
  width: 730px;
  background-color: #fff; }

#contact section {
  padding: 22px 0 35px; }
  #contact section .layout .left {
    width: 730px;
    box-shadow: 0px 0 5px 0 #000; }
    #contact section .layout .left .sec1 .head {
      background-color: rgba(188, 203, 211, 0.3);
      border-left: 8px solid #BCCBD3; }
      #contact section .layout .left .sec1 .head h3 {
        font-size: 22px;
        padding: 12px 0 15px 5px; }
    #contact section .layout .left .sec1 .content {
      padding: 20px; }
      #contact section .layout .left .sec1 .content p {
        line-height: 1.4;
        padding-bottom: 10px; }
      #contact section .layout .left .sec1 .content .contact-form {
        border-top: 2px solid #000;
        text-align: center; }
        #contact section .layout .left .sec1 .content .contact-form table {
          text-align: left;
          width: 100%;
          margin-bottom: 15px; }
          #contact section .layout .left .sec1 .content .contact-form table tr th {
            font-size: 14px;
            width: 160px;
            vertical-align: middle; }
          #contact section .layout .left .sec1 .content .contact-form table tr td {
            font-size: 12px; }
            #contact section .layout .left .sec1 .content .contact-form table tr td input[type='text'], #contact section .layout .left .sec1 .content .contact-form table tr td input[type='tel'], #contact section .layout .left .sec1 .content .contact-form table tr td input[type='email'], #contact section .layout .left .sec1 .content .contact-form table tr td select, #contact section .layout .left .sec1 .content .contact-form table tr td textarea {
              width: 340px;
              height: 30px;
              border-top: 1px solid #A7BCC3;
              border-left: 1px solid #A7BCC3;
              border-bottom: 1px solid #E5E5E5;
              border-right: 1px solid #E5E5E5;
              margin: 13px 0;
              padding-left: 8px; }
            #contact section .layout .left .sec1 .content .contact-form table tr td textarea {
              width: 520px;
              height: auto; }
        #contact section .layout .left .sec1 .content .contact-form .privacy .title {
          border-top: 1px solid #000;
          border-bottom: 1px solid #000;
          margin-bottom: 12px;
          text-align: left;
          padding: 5px 0; }
          #contact section .layout .left .sec1 .content .contact-form .privacy .title span {
            width: 6px;
            height: 20px;
            background-color: #C0272D;
            margin-right: 5px;
            display: inline-block;
            vertical-align: -4px; }
          #contact section .layout .left .sec1 .content .contact-form .privacy .title p {
            font-size: 16px;
            display: inline-block;
            color: #C0272D;
            font-weight: bold;
            padding: 0; }
        #contact section .layout .left .sec1 .content .contact-form .privacy .privacy-policy {
          overflow-y: scroll;
          max-height: 135px;
          border: 1px solid #E5E5E5;
          text-align: left;
          font-size: 12px;
          padding: 10px 15px; }
          #contact section .layout .left .sec1 .content .contact-form .privacy .privacy-policy p {
            line-height: inherit; }
        #contact section .layout .left .sec1 .content .contact-form .privacy .checkbox {
          display: block;
          font-size: 14px;
          text-align: center;
          margin-top: 15px; }
        #contact section .layout .left .sec1 .content .contact-form button, #contact section .layout .left .sec1 .content .contact-form input[type="button"], #contact section .layout .left .sec1 .content .contact-form input[type="submit"] {
          position: relative;
          display: inline-block;
          text-align: center;
          margin: auto;
          font-size: 16px;
          color: #000;
          width: 110px;
          border: 1px solid #A7BCC3;
          background: linear-gradient(#fff, #DFE7E9);
          margin: 30px auto 40px;
          padding: 1px 20px 2px 20px;
          letter-spacing: -1px;
          border-radius: 5px;
          font-weight: bold;
          vertical-align: top;
          cursor: pointer; }
          #contact section .layout .left .sec1 .content .contact-form button.reset, #contact section .layout .left .sec1 .content .contact-form input[type="button"].reset, #contact section .layout .left .sec1 .content .contact-form input[type="submit"].reset {
            margin-right: 20px; }
          #contact section .layout .left .sec1 .content .contact-form button.submit, #contact section .layout .left .sec1 .content .contact-form input[type="button"].submit, #contact section .layout .left .sec1 .content .contact-form input[type="submit"].submit {
            margin-left: 20px; }
    #contact section .layout .left .sec2 {
      text-align: center;
      margin: auto; }
      #contact section .layout .left .sec2 .head {
        background-color: rgba(188, 203, 211, 0.3);
        border-left: 8px solid #BCCBD3;
        text-align: left; }
        #contact section .layout .left .sec2 .head h3 {
          font-size: 22px;
          padding: 12px 0 15px 5px;
          color: #C0272D;
          line-height: 1.5; }
      #contact section .layout .left .sec2 h4 {
        font-size: 20px;
        color: #fff;
        text-align: center;
        background-color: #BC272D;
        padding: 1px 0 4px;
        letter-spacing: -1px; }
        #contact section .layout .left .sec2 h4 a {
          position: relative;
          display: inline-block;
          font-size: 16px;
          color: #000;
          width: 120px;
          border: 1px solid #A7BCC3;
          background: linear-gradient(#fff, #DFE7E9);
          margin: auto;
          padding-right: 20px;
          letter-spacing: -1px;
          border-radius: 7px;
          font-weight: bold; }
          #contact section .layout .left .sec2 h4 a::after {
            content: '';
            position: absolute;
            background: url("../../../img/contact/pc/icon_arrow.png");
            width: 20px;
            height: 28px;
            right: 5px;
            top: 0; }
      #contact section .layout .left .sec2 p {
        font-size: 18px;
        margin-top: 8px;
        font-weight: bold; }

@media screen and (max-width: 750px) {
  #contact .main-visual {
    border-bottom: .1rem solid #000;
    background: rgba(255, 255, 255, 0.6); }
    #contact .main-visual .layout h2 {
      font-size: 3.4rem;
      color: #000;
      line-height: 1;
      padding: 1.5rem 0 4.5rem; }
  #contact .page-link li {
    line-height: 1; }
  #contact .left {
    width: auto;
    background-color: transparent;
    float: none; }
  #contact section {
    padding: 2.8rem 0 0; }
    #contact section .layout .left {
      width: auto;
      box-shadow: none; }
      #contact section .layout .left .sec1 {
        box-shadow: 0 1px 1px 0 #000;
        background-color: #fff; }
        #contact section .layout .left .sec1 .head {
          background-color: rgba(188, 203, 211, 0.3);
          border-left: .7rem solid #BBCAD2; }
          #contact section .layout .left .sec1 .head h3 {
            font-size: 2.6rem;
            padding: 1.3rem 0 1.3rem .5rem; }
        #contact section .layout .left .sec1 .content {
          padding: 2rem;
          margin-bottom: 3.7rem; }
          #contact section .layout .left .sec1 .content p {
            line-height: 1.4;
            padding-bottom: 2rem;
            font-size: 2.6rem; }
          #contact section .layout .left .sec1 .content .contact-form {
            border-top: .1rem solid #A7BCC3;
            text-align: center; }
            #contact section .layout .left .sec1 .content .contact-form table {
              text-align: left;
              width: 100%;
              margin: 1rem auto; }
              #contact section .layout .left .sec1 .content .contact-form table tr th {
                font-size: 2.6rem;
                width: auto;
                vertical-align: middle;
                display: block;
                font-weight: normal; }
              #contact section .layout .left .sec1 .content .contact-form table tr td {
                font-size: 12px;
                display: block; }
                #contact section .layout .left .sec1 .content .contact-form table tr td input[type='text'], #contact section .layout .left .sec1 .content .contact-form table tr td input[type='tel'], #contact section .layout .left .sec1 .content .contact-form table tr td input[type='email'], #contact section .layout .left .sec1 .content .contact-form table tr td select, #contact section .layout .left .sec1 .content .contact-form table tr td textarea {
                  width: 63rem;
                  height: 8rem;
                  border-top: 1px solid #A7BCC3;
                  border-left: 1px solid #A7BCC3;
                  border-bottom: 1px solid #E5E5E5;
                  border-right: 1px solid #E5E5E5;
                  margin: .5rem 0 1rem;
                  padding-left: 1rem; }
                #contact section .layout .left .sec1 .content .contact-form table tr td select {
                  width: 64rem;
                  margin-bottom: 1.5rem; }
                #contact section .layout .left .sec1 .content .contact-form table tr td textarea {
                  width: 63rem;
                  height: auto;
                  margin-bottom: 3rem; }
            #contact section .layout .left .sec1 .content .contact-form .privacy .title {
              border-top: 1px solid #000;
              border-bottom: 1px solid #000;
              margin-bottom: .2rem;
              text-align: left; }
              #contact section .layout .left .sec1 .content .contact-form .privacy .title span {
                width: .6rem;
                height: 3.2rem;
                background-color: #C0272D;
                margin-right: .5rem;
                display: inline-block;
                vertical-align: -.4rem; }
              #contact section .layout .left .sec1 .content .contact-form .privacy .title p {
                font-size: 2.6rem;
                display: inline-block;
                color: #C0272D;
                font-weight: bold;
                padding-bottom: 0; }
            #contact section .layout .left .sec1 .content .contact-form .privacy .privacy-policy {
              overflow-y: scroll;
              max-height: 23rem;
              border: 1px solid #E5E5E5;
              text-align: left;
              font-size: 2.2rem;
              padding: 1rem 2rem;
              margin-top: 2rem; }
              #contact section .layout .left .sec1 .content .contact-form .privacy .privacy-policy p {
                line-height: inherit; }
            #contact section .layout .left .sec1 .content .contact-form .privacy .checkbox {
              display: block;
              font-size: 2.2rem;
              text-align: center;
              margin-top: 2rem; }
            #contact section .layout .left .sec1 .content .contact-form button, #contact section .layout .left .sec1 .content .contact-form input[type="button"], #contact section .layout .left .sec1 .content .contact-form input[type="submit"] {
              position: relative;
              display: inline-block;
              text-align: center;
              margin: auto;
              font-size: 3.2rem;
              color: #000;
              width: 22rem;
              border: 1px solid #A7BCC3;
              background: linear-gradient(#fff, #DFE7E9);
              margin: 7rem auto 5.5rem;
              padding: 0;
              letter-spacing: 0;
              border-radius: .5rem;
              font-weight: bold; }
              #contact section .layout .left .sec1 .content .contact-form button.reset, #contact section .layout .left .sec1 .content .contact-form input[type="button"].reset, #contact section .layout .left .sec1 .content .contact-form input[type="submit"].reset {
                margin-right: 4.2rem; }
              #contact section .layout .left .sec1 .content .contact-form button.submit, #contact section .layout .left .sec1 .content .contact-form input[type="button"].submit, #contact section .layout .left .sec1 .content .contact-form input[type="submit"].submit {
                margin-left: 4.2rem; }
            #contact section .layout .left .sec1 .content .contact-form .ajax-loader {
              display: block;
              margin: 0 auto; }
      #contact section .layout .left .sec2 {
        text-align: center;
        margin: auto; }
        #contact section .layout .left .sec2 .head {
          background-color: rgba(188, 203, 211, 0.3);
          border-left: .7rem solid #BCCBD3;
          text-align: left; }
          #contact section .layout .left .sec2 .head h3 {
            font-size: 2.6rem;
            padding: 1.3rem 0 1.3rem .5rem;
            color: #000;
            line-height: 1.5; }
        #contact section .layout .left .sec2 h4 {
          font-size: 2.2rem;
          color: #fff;
          text-align: left;
          background-color: #BC272D;
          padding: .5rem 1.2rem .5rem;
          letter-spacing: 0;
          display: flex;
          justify-content: space-between; }
          #contact section .layout .left .sec2 h4 span {
            text-align: left;
            line-height: 1.4; }
          #contact section .layout .left .sec2 h4 a {
            position: relative;
            font-size: 2.4rem;
            color: #000;
            width: 18.8rem;
            border: 1px solid #A7BCC3;
            background: linear-gradient(#fff, #DFE7E9);
            margin: auto 0;
            padding-right: 2rem;
            letter-spacing: 0;
            border-radius: .5rem;
            font-weight: bold;
            text-align: center; }
            #contact section .layout .left .sec2 h4 a::after {
              content: '';
              position: absolute;
              background: url("../../../img/contact/sp/icon_arrow.png");
              background-size: contain;
              width: 2.9rem;
              height: 4.2rem;
              right: .5rem;
              top: 0; }
        #contact section .layout .left .sec2 p {
          font-size: 2.2rem;
          margin: 1.4rem auto;
          font-weight: bold;
          white-space: nowrap; } }
