@charset "UTF-8";
/* 各ページごとの設定 */
/*
@mixin pc_top_gradient{
	background-image: -webkit-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-image: -ms-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-size: auto auto, cover;
	background-position: left top, center, center;
}
@mixin sp_top_gradient{
	background-image: -webkit-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-image: -ms-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-size: auto auto, auto 100%;
	background-position: left top, center, center;
}
*/
/*------------------------------------------
共通
-------------------------------------------*/
/*PC
-----------------------------------------------------------------------------*/
@media print, screen and (min-width: 751px) {
  .inner {
    width: 1180px; }

  #mainv {
    background: #f0f2f1;
    margin: 0; }
    #mainv .inner {
      background-image: -webkit-linear-gradient(0deg, #f0f2f1, #f0f2f1 30%, rgba(240, 242, 241, 0) 35%, rgba(240, 242, 241, 0) 55%, #f0f2f1), url(../images/reserve/mainv_bg.jpg);
      background-image: -ms-linear-gradient(0deg, #f0f2f1, #f0f2f1 30%, rgba(240, 242, 241, 0) 35%, rgba(240, 242, 241, 0) 55%, #f0f2f1), url(../images/reserve/mainv_bg.jpg);
      background-size: auto auto, auto 130%;
      background-position: left top, right center;
      height: auto;
      padding: 0; }
      #mainv .inner h1 {
        color: #333;
        font-family: YuMincho, "Yu Mincho", "Noto Serif JP", serif;
        padding: 90px 60px 100px; }
        #mainv .inner h1 span {
          font-size: 36px; }

  /* 最終的にform_share.scssに統合 */
  #breadCrumb {
    margin: 0 0 20px;
    background: none; }
    #breadCrumb .inner {
      width: 1180px; }
      #breadCrumb .inner ul li a {
        color: #9E6657; }

  h2 {
    position: relative;
    padding: 0 0 15px;
    margin: 0 0 50px;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    color: #ff8746; }
    h2::before {
      position: absolute;
      left: 50%;
      bottom: 0;
      width: 170px;
      height: 4px;
      background: #ff8746;
      transform: translateX(-50%);
      content: ""; }

  .stepList {
    display: flex;
    margin: 0 auto 30px;
    width: 870px;
    counter-reset: step; }
    .stepList > li {
      position: relative;
      margin: 0 90px 0 0;
      width: 230px;
      counter-increment: step; }
      .stepList > li::before {
        position: absolute;
        right: -50px;
        top: 60px;
        width: 0;
        height: 11px;
        border-right: solid 6px #c9b3a4;
        content: "";
        transform: skew(40deg); }
      .stepList > li::after {
        position: absolute;
        right: -50px;
        top: 71px;
        width: 0;
        height: 11px;
        border-right: solid 6px #c9b3a4;
        content: "";
        transform: skew(-40deg); }
      .stepList > li:last-child {
        margin: 0; }
        .stepList > li:last-child::before, .stepList > li:last-child::after {
          display: none; }
      .stepList > li .number {
        position: absolute;
        left: -30px;
        top: -30px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 78px;
        height: 78px;
        text-align: center;
        background: #ffe7d0;
        border-radius: 50%;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2); }
        .stepList > li .number span {
          font-family: YuMincho, "Yu Mincho", "Noto Serif JP", serif;
          font-weight: bold;
          font-size: 12px;
          color: #9E6657; }
          .stepList > li .number span::after {
            display: block;
            font-size: 30px;
            content: counter(step);
            line-height: 1; }
      .stepList > li .image {
        margin: 0 0 15px; }
        .stepList > li .image img {
          border-radius: 5px; }

  #contents {
    width: 860px; }
    #contents .telWrap {
      margin: 0 0 30px; }
      #contents .telWrap h3 {
        text-align: center;
        margin: 0 0 5px;
        color: #ff8746;
        font-size: 20px;
        font-weight: bold; }
      #contents .telWrap .telInner {
        display: flex;
        justify-content: center;
        align-items: center; }
        #contents .telWrap .telInner .tel {
          margin: 0 35px 0 0;
          font-size: 36px;
          font-weight: bold; }
          #contents .telWrap .telInner .tel a {
            pointer-events: none; }
          #contents .telWrap .telInner .tel::before {
            content: "\f095";
            font-family: fontAwesome;
            color: #ff8746;
            margin: 0 10px 0 0; }
        #contents .telWrap .telInner .reception {
          font-size: 14px; }
    #contents #formArea .lead {
      border-bottom: none; }
    #contents #formArea h3 {
      padding: 12px 15px;
      background: #f0f0f0;
      border-left: solid 6px #ff8746;
      font-weight: bold;
      font-size: 18px; }
    #contents #formArea table {
      margin: 0 0 40px; }
      #contents #formArea table.insideTable {
        margin: 0; }
        #contents #formArea table.insideTable tr:last-child th,
        #contents #formArea table.insideTable tr:last-child td {
          border-bottom: none; }

  #contents #formArea table tr.required th {
    padding: 30px 60px 30px 10px; }
    #contents #formArea table tr.required th::after {
      float: right;
      margin: 2px 0 0; }
  #contents #formArea table tr td {
    width: 560px; }
    .mw_wp_form_confirm #contents #formArea table tr td .note {
      display: none; }
    #contents #formArea table tr td .note > li {
      position: relative;
      padding: 0 0 0 1em; }
      #contents #formArea table tr td .note > li::before {
        position: absolute;
        left: 0;
        top: 0;
        content: "\203B"; }
  #contents #formArea table tr .dateArea input {
    margin: 0 10px 0 0;
    width: calc(100% - 10px);
    box-sizing: border-box; }
  #contents #formArea table tr .nameArea .fb {
    -webkit-align-items: center;
    align-items: center; }
  #contents #formArea table tr .nameArea p {
    width: 2em;
    margin: 0 10px 0 0; }
  #contents #formArea table tr .nameArea input {
    margin: 0 20px 0 0; }
  #contents #formArea table tr .genderArea label,
  #contents #formArea table tr .methodArea label {
    margin: 0 20px 0 0; }
  #contents #formArea table tr .ageArea input {
    margin: 0 10px 0 0; }
  #contents #formArea table tr .addressArea .head {
    width: 6em;
    display: inline-block;
    margin: 0 10px 0 0; }
  #contents #formArea table tr .addressArea .city {
    width: 340px; }
  #contents #formArea table tr .addressArea .street {
    width: 340px; }
  #contents #formArea table tr .mailArea input[type="text"] {
    width: 300px; }

  /*--------------------------endPC--------------------------------*/ }
/*SP
-----------------------------------------------------------------------------*/
@media screen and (max-width: 750px) {
  .inner {
    width: 94vw;
    margin: 0 auto; }

  #mainv {
    margin: 0;
    background: #f0f2f1; }
    #mainv .inner {
      display: flex;
      -webkit-justify-content: flex-start;
      justify-content: flex-start;
      -webkit-align-items: center;
      align-items: center;
      background-image: -webkit-linear-gradient(0deg, #f0f2f1, #f0f2f1 20%, rgba(240, 242, 241, 0) 36%, rgba(240, 242, 241, 0) 88%, #f0f2f1), url(../images/reserve/mainv_bg.jpg);
      background-image: -ms-linear-gradient(0deg, #f0f2f1, #f0f2f1 20%, rgba(240, 242, 241, 0) 36%, rgba(240, 242, 241, 0) 88%, #f0f2f1), url(../images/reserve/mainv_bg.jpg);
      background-size: auto auto, auto 100%;
      background-position: left top, right -25vw bottom;
      height: 36.2vw;
      width: 94vw;
      padding: 0; }
      #mainv .inner h1 {
        color: #333;
        padding: 0;
        font-family: YuMincho, "Yu Mincho", "Noto Serif JP", serif; }
        #mainv .inner h1 span {
          font-size: 5.5vw; }

  /* 最終的にform_share.scssに統合 */
  #breadCrumb {
    margin: 0;
    background: none; }
    #breadCrumb .inner ul li a {
      color: #9E6657; }

  h2 {
    position: relative;
    padding: 0 0 2.4vw;
    margin: 0 0 8vw;
    text-align: center;
    font-size: 5vw;
    font-weight: bold;
    color: #ff8746; }
    h2::before {
      position: absolute;
      left: 50%;
      bottom: 0;
      width: 27.7vw;
      height: .7vw;
      background: #fbf9f8;
      transform: translateX(-50%);
      content: ""; }

  .stepList {
    margin: 0 7.2vw 6vw 10vw;
    counter-reset: step; }
    .stepList > li {
      display: flex;
      position: relative;
      margin: 0 0 10.8vw;
      counter-increment: step; }
      .stepList > li::before {
        position: absolute;
        left: 14vw;
        bottom: -6.7vw;
        width: 2.5vw;
        height: 0;
        border-bottom: solid 1.2vw #c9b3a4;
        content: "";
        transform: skewY(40deg);
        transform-origin: 100% 100%; }
      .stepList > li::after {
        position: absolute;
        left: 16.5vw;
        bottom: -6.7vw;
        width: 2.5vw;
        height: 0;
        border-bottom: solid 1.2vw #c9b3a4;
        content: "";
        transform: skewY(-40deg);
        transform-origin: 0 100%; }
      .stepList > li:last-child {
        margin: 0; }
        .stepList > li:last-child::before, .stepList > li:last-child::after {
          display: none; }
      .stepList > li .number {
        position: absolute;
        left: -5.4vw;
        top: -5.4vw;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 14.1vw;
        height: 14.1vw;
        text-align: center;
        background: #ffe7d0;
        border-radius: 50%;
        box-shadow: 0 0.3vw 1.2vw rgba(0, 0, 0, 0.2); }
        .stepList > li .number span {
          font-family: YuMincho, "Yu Mincho", "Noto Serif JP", serif;
          font-weight: bold;
          font-size: 1.8vw;
          color: #9E6657; }
          .stepList > li .number span::after {
            display: block;
            font-size: 5vw;
            content: counter(step);
            line-height: 1; }
      .stepList > li .image {
        width: 40%; }
        .stepList > li .image img {
          width: 100%;
          height: 25.3vw;
          border-radius: .9vw;
          object-fit: cover; }
      .stepList > li .text {
        display: flex;
        align-items: center;
        width: 60%;
        padding: 0 0 0 6.6vw;
        font-size: 3.1vw;
        box-sizing: border-box;
        line-height: 1.8; }

  #contents .telWrap {
    margin: 0 0 6vw; }
    #contents .telWrap h3 {
      text-align: center;
      color: #ff8746;
      font-size: 3.6vw;
      font-weight: bold; }
    #contents .telWrap .telInner {
      text-align: center; }
      #contents .telWrap .telInner .tel {
        font-size: 7.2vw;
        font-weight: bold; }
        #contents .telWrap .telInner .tel::before {
          content: "\f095";
          font-family: fontAwesome;
          color: #ff8746;
          margin: 0 2.4vw 0 0; }
      #contents .telWrap .telInner .reception {
        font-size: 3.3vw; }
  #contents #formArea h3 {
    padding: 3.6vw;
    background: #f0f0f0;
    border-left: solid 1.9vw #ff8746;
    font-weight: bold;
    font-size: 4.1vw; }
  #contents #formArea table tr:first-child th {
    border-top: none; }
  #contents #formArea table tr td .selectArea {
    display: block; }

  .mw_wp_form_confirm #contents #formArea table tr td .note {
    display: none; }
  #contents #formArea table tr td .note > li {
    position: relative;
    padding: 0 0 0 1em;
    text-indent: 0; }
    #contents #formArea table tr td .note > li::before {
      position: absolute;
      left: 0;
      top: 0;
      content: "\203B"; }
  #contents #formArea table tr .dateArea .date {
    width: 100%; }
  #contents #formArea table tr .dateArea input {
    margin: 10px 0 0; }
  #contents #formArea table tr .dateArea .selectArea {
    margin: 10px 0 0; }
  #contents #formArea table tr .nameArea .fb {
    -webkit-align-items: center;
    align-items: center; }
  #contents #formArea table tr .nameArea p {
    text-align: right;
    width: 2em;
    margin: 0 10px 0 0; }
  #contents #formArea table tr .nameArea input {
    width: 50% !important; }
  #contents #formArea table tr .nameArea input:nth-child(2) {
    margin: 0 20px 0 0; }
  #contents #formArea table tr .ageArea input {
    width: 100px !important;
    margin: 0 5px 0 0; }
  #contents #formArea table tr .addressArea .head {
    display: block;
    margin: 0 0 5px; }

  /*--------------------------endSP--------------------------------*/ }

/*# sourceMappingURL=reserve.css.map */