#wrap {
  background: url("../img/content_bg_01.webp") no-repeat left top;
  background-size: cover;
  position: relative; }
  @media screen and (max-width: 600px) {
    #wrap {
      /*height: 100svh;*/
      background-position: 70% top; } }
  #wrap::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(178, 157, 92, 0.35);
    position: absolute;
    left: 0;
    top: 0; }
  #wrap #contents {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100vh;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 600px) {
      #wrap #contents {
        height: 100%; } }
    #wrap #contents section {
      width: 100%;
      max-width: 440px;
      text-align: center;
      margin: auto; }
      @media screen and (max-width: 600px) {
        #wrap #contents section {
          padding: 0 10px;
          margin: 0 0 60px; } }
      #wrap #contents section #logo {
        height: 80px;
        background: url("../img/logo.svg") no-repeat top center;
        background-size: contain;
        margin: 0 auto 95px; }
        @media screen and (max-width: 600px) {
          #wrap #contents section #logo {
            width: 100%;
            max-width: 250px;
            margin: 40px auto 60px; } }
      #wrap #contents section form input {
        margin: 30px 0 0;
        width: 100%;
        line-height: 1.5;
        font-size: 1.125em;
        padding: 10px 15px;
        color: #333333;
        border: 1px solid #fff;
        border-radius: 0; }
        @media screen and (max-width: 600px) {
          #wrap #contents section form input {
            width: 100%;
            max-width: 335px;
            margin: 30px 0 10px; } }
        #wrap #contents section form input:focus {
          outline: none; }
        #wrap #contents section form input#showPasswordCheckbox {
          width: auto;
          margin: 10px 5px 0 0; }
      #wrap #contents section form button {
        margin: 50px 0 0;
        background-color: #000;
        border: solid 1px #333;
        border-radius: 25px;
        width: 100%;
        max-width: 260px;
        line-height: 47px;
        text-align: center;
        font-family: "Noto Serif JP", serif;
        /*font-family: "Noto Sans JP", sans-serif;*/
        font-size: 1.25em;
        font-weight: 400;
        color: #fff;
        letter-spacing: 0.05em;
        cursor: pointer;
        transition: all .5s; }
        @media screen and (max-width: 600px) {
          #wrap #contents section form button {
            margin: 40px 0 0;
            line-height: 40px;
            padding: 0 0 2px; } }
        @media screen and (min-width: 1025px) {
          #wrap #contents section form button:hover {
            background-color: #fff;
            color: #333; } }
    #wrap #contents footer {
      grid-template-columns: 1fr;
      padding: 0 0 25px; }
      #wrap #contents footer dl {
        grid-template-columns: 1fr;
        text-align: center; }
        #wrap #contents footer dl dt {
          font-size: 1.125em;
          font-weight: 600;
          line-height: 1.78;
          letter-spacing: 0.05em;
          color: #333;
          margin: 0 0 25px; }
          @media screen and (max-width: 600px) {
            #wrap #contents footer dl dt span {
              display: block; } }
        #wrap #contents footer dl dd {
          display: grid;
          grid-template-columns: auto auto;
          gap: 0 30px;
          font-size: 1.125em;
          font-weight: 500;
          line-height: 1.78;
          letter-spacing: 0.1em;
          color: #333; }
          @media screen and (max-width: 600px) {
            #wrap #contents footer dl dd {
              grid-template-columns: 1fr;
              font-size: 1em; } }
          #wrap #contents footer dl dd .tel a {
            font-weight: 500;
            line-height: 1.78;
            letter-spacing: 0.1em;
            color: #333;
            pointer-events: none; }
            @media screen and (max-width: 600px) {
              #wrap #contents footer dl dd .tel a {
                pointer-events: auto;
                text-decoration: underline; } }