@media only screen and (max-width: 767px) {
  header {
    height: 120vw; } }
#key {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0; }
  #key:before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/party/kv_shadow.png") no-repeat top left/100% 100%;
    pointer-events: none; }
  #key img {
    width: 100%;
    height: 100%;
    object-fit: cover; }

#sec1 {
  padding: 10vw 3.5% 13vw;
  z-index: 0; }
  #sec1:before, #sec1:after {
    content: "";
    position: absolute;
    z-index: -1;
    background: url("../img/shared/bg3.jpg");
    width: 60%; }
  #sec1:before {
    left: 0;
    top: 0;
    height: 50vw; }
  #sec1:after {
    right: 0;
    bottom: 0;
    height: 120vw; }
  #sec1 h2 {
    color: #4f2a15;
    font-size: 6vw;
    line-height: 1.75;
    margin-bottom: 7vw;
    padding-bottom: 2vw;
    position: relative;
    display: inline-block;
    padding-right: 5vw;
    letter-spacing: 0.07em; }
    #sec1 h2:before {
      content: "";
      position: absolute;
      bottom: 0;
      right: 0;
      width: 200%;
      height: 1px;
      background: #947965; }
  #sec1 .sec1-txt1 {
    margin: 5vw 0 7vw; }
  #sec1 .sec1-txt2 {
    text-align: center;
    font-size: 4.5vw;
    color: #4f2a15;
    margin-bottom: 5vw;
    line-height: 1.7;
    letter-spacing: 0.1em; }
  #sec1 .sec1-btn a {
    margin-top: 5vw; }
  #sec1 .slick-dots {
    position: static;
    text-align: left;
    margin-left: 0;
    margin-top: 10px; }
    #sec1 .slick-dots li {
      padding: 0 6px 0 0; }
      #sec1 .slick-dots li button {
        height: 3px;
        width: 30px;
        padding: 0; }
  @media only screen and (min-width: 768px) {
    #sec1 {
      padding: 134px 0 119px; }
      #sec1:before, #sec1:after {
        width: 100%; }
      #sec1:before {
        left: auto;
        right: 415px;
        height: 463px; }
      #sec1:after {
        right: auto;
        left: 430px;
        height: 617px; }
      #sec1 h2 {
        font-size: 40px;
        margin-bottom: 0;
        padding-bottom: 5px;
        display: block;
        padding-right: 0;
        float: left;
        width: 478px; }
      #sec1 .sec1-img {
        float: right;
        width: 728px;
        margin-right: -250px;
        margin-top: 7px; }
      #sec1 .sec1-txt1 {
        margin: 36px 0 107px 10px;
        float: left;
        width: 462px;
        letter-spacing: 2px; }
      #sec1 .sec1-txt2 {
        font-size: 30px;
        margin-bottom: 54px; }
      #sec1 .sec1-btn {
        margin: auto;
        width: 957px; }
        #sec1 .sec1-btn a {
          margin-top: 0;
          width: 447px; }
      #sec1 .slick-dots {
        margin-top: 20px; }
        #sec1 .slick-dots li {
          padding: 0 25px 0 0; }
          #sec1 .slick-dots li button {
            height: 8px !important;
            width: 60px !important;
            background: #99857a; }
          #sec1 .slick-dots li.slick-active button {
            background: #cba590; } }

#sec2 {
  background: url("../img/shared/bg2.jpg");
  padding: 5vw 0 1px; }
  #sec2 h2 {
    text-align: center;
    color: #fff;
    border-top: 2px solid #b47448;
    border-bottom: 2px solid #b47448;
    font-size: 4.2vw;
    letter-spacing: 0;
    line-height: 2;
    margin-bottom: 5vw;
    padding: 3vw 0; }
  #sec2 .dis-flex-pc {
    padding: 0 3.5vw; }
  #sec2 a {
    display: block;
    position: relative;
    color: #4f2a15;
    font-size: 4vw;
    margin-bottom: 5vw; }
    #sec2 a p:nth-child(2) {
      position: absolute;
      z-index: 2;
      text-align: center;
      background: url("../img/takeout/sec2_bg.png") no-repeat center/100% 100%;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 100%;
      padding: 5vw 0; }
    #sec2 a span {
      display: block;
      margin: auto;
      width: 5.5%;
      line-height: 1; }
  @media only screen and (min-width: 768px) {
    #sec2 {
      padding: 21px 0 20px; }
      #sec2 h2 {
        font-size: 30px;
        letter-spacing: 3px;
        line-height: 2;
        margin-bottom: 18px;
        padding: 27px 0; }
      #sec2 .dis-flex-pc {
        padding: 0;
        margin: auto;
        width: 100%;
        max-width: 1460px; }
      #sec2 a {
        width: calc((100% - 30px)/3);
        height: 552px;
        font-size: 25px;
        margin-bottom: 0; }
        #sec2 a img {
          width: 100%;
          height: 100%;
          object-fit: cover; }
        #sec2 a p:nth-child(1) {
          width: 100%;
          height: 100%; }
        #sec2 a p:nth-child(2) {
          padding: 30px 0 22px; }
        #sec2 a span {
          margin-top: 7px;
          width: 26px; } }

.toggle .toggle-link:after {
  content: url("../img/takeout/sec2_arrow.png");
  display: block;
  margin: auto; }
.toggle.active .toggle-link:after {
  content: url("../img/takeout/sec2_arrow_on.png"); }
@media only screen and (min-width: 768px) {
  .toggle .toggle-link {
    pointer-events: none; }
    .toggle .toggle-link:after {
      display: none; }
  .toggle .toggle-main {
    display: block; } }

.takeout-ttl {
  text-align: center;
  font-size: 4vw;
  line-height: 1.7;
  margin-bottom: 7vw; }
  .takeout-ttl span {
    display: block;
    font-weight: 600;
    font-size: 227%;
    color: #342513; }
  @media only screen and (min-width: 768px) {
    .takeout-ttl {
      font-size: 22px;
      margin-bottom: 38px;
      line-height: 1.9; } }

.takeout-item {
  background: #fff;
  position: relative;
  padding-bottom: 7vw;
  margin-bottom: 10vw; }
  .takeout-item .takeout-label {
    position: absolute;
    z-index: 1;
    top: 3vw;
    left: 3%;
    color: #fff;
    letter-spacing: 2px; }
    .takeout-item .takeout-label span {
      display: block;
      margin-right: 10px; }
      .takeout-item .takeout-label span:nth-child(1) {
        background: #4f2a15;
        padding: 0 12px 0 10px; }
      .takeout-item .takeout-label span:nth-child(2) {
        background: #a15228;
        padding: 0 17px 0 20px; }
  .takeout-item .takeout-ttl2 {
    margin: 3vw 3%;
    text-align: center;
    border-bottom: 2px solid #a0a0a0;
    font-size: 4.5vw;
    line-height: 1.5;
    padding-bottom: 3vw; }
    .takeout-item .takeout-ttl2 dd {
      font-size: 95%;
      line-height: 1.2; }
      .takeout-item .takeout-ttl2 dd .fsm {
        font-size: 74%; }
    .takeout-item .takeout-ttl2 .takeout-red {
      color: #a15228; }
  .takeout-item .takeout-txt {
    margin: 0 7%; }
  @media only screen and (min-width: 768px) {
    .takeout-item {
      padding-bottom: 20px;
      margin-bottom: 15px; }
      .takeout-item .takeout-label {
        top: 23px;
        left: 20px; }
        .takeout-item .takeout-label span {
          margin-right: 12px;
          line-height: 29px; }
          .takeout-item .takeout-label span:nth-child(2) {
            padding: 0 17px 0 20px;
            min-width: 94px;
            text-align: center; }
      .takeout-item .takeout-ttl2 {
        font-size: 20px; }
        .takeout-item .takeout-ttl2 dd {
          line-height: 1.7;
          margin-top: 7px; }
      .takeout-item .takeout-txt {
        margin: 0 43px; } }

@media only screen and (min-width: 768px) {
  .takeout-2item {
    margin: 0 -10.6%;
    flex-wrap: wrap; }
    .takeout-2item .takeout-item {
      width: calc(50% - 8px); }
      .takeout-2item .takeout-item .takeout-ttl2 {
        margin: 16px 27px 8px;
        padding-bottom: 10px; }
      .takeout-2item .takeout-item .takeout-txt {
        margin: 0 44px; }

  .takeout-3item {
    margin: 0 -10.6%;
    flex-wrap: wrap;
    justify-content: flex-start; }
    .takeout-3item .takeout-item {
      width: calc((100% - 30px)/3);
      padding-bottom: 35px;
      margin-left: 15px; }
      .takeout-3item .takeout-item:nth-child(3n + 1) {
        margin-left: 0; }
      .takeout-3item .takeout-item .takeout-ttl2 {
        margin: 18px 13px 7px;
        padding-bottom: 7px; }
        .takeout-3item .takeout-item .takeout-ttl2 dd {
          margin-top: 0px; }
      .takeout-3item .takeout-item .takeout-txt {
        margin: 0 24px; } }
.takeout-link {
  width: 60%; }
  @media only screen and (min-width: 768px) {
    .takeout-link {
      margin-top: 40px;
      width: 313px; } }

#sec3 {
  margin-top: 2vw;
  margin-bottom: 13vw; }
  #sec3 .sec3-txt1 {
    margin-bottom: 5vw; }
  @media only screen and (min-width: 768px) {
    #sec3 {
      margin-top: 3px;
      margin-bottom: 85px; }
      #sec3 .sec3-txt1 {
        margin-bottom: 34px; }
      #sec3 .takeout-link {
        margin-top: 24px; } }

#sec4 {
  padding: 13vw 0;
  background: url("../img/shared/bg2.jpg"); }
  #sec4 .takeout-ttl {
    color: #fff; }
    #sec4 .takeout-ttl span {
      color: #fff; }
  #sec4 .toggle .toggle-link:after {
    content: url("../img/takeout/sec4_arrow.png"); }
  #sec4 .toggle.active .toggle-link:after {
    content: url("../img/takeout/sec4_arrow_on.png"); }
  #sec4 .btn-link:hover {
    border-color: #342513;
    color: #fff; }
    #sec4 .btn-link:hover:before {
      background: #342513; }
    #sec4 .btn-link:hover:after {
      background: url(../img/shared/arrow_on.png) no-repeat center/100% 100%; }
  @media only screen and (min-width: 768px) {
    #sec4 {
      padding: 57px 0 92px; } }

#sec5 {
  background: url("../img/shared/bg3.jpg");
  padding: 13vw 0; }
  @media only screen and (min-width: 768px) {
    #sec5 {
      padding: 60px 0 69px; }
      #sec5 .toggle .toggle-link {
        margin-bottom: 27px; } }

#sec6 {
  padding: 13vw 3.5%;
  text-align: center; }
  #sec6 h2 {
    text-align: center;
    font-size: 6.3vw;
    margin-bottom: 5vw;
    letter-spacing: 0.1em; }
    #sec6 h2 i {
      margin: auto;
      width: 31px; }
  #sec6 h3 {
    color: #fff;
    text-align: center;
    font-size: 4.5vw;
    background: #342513;
    margin-bottom: 5vw; }
  #sec6 .sec6-txt1 {
    margin-bottom: 3vw; }
  #sec6 .tel {
    background: #fff;
    color: #342513;
    display: inline-block;
    padding: 5px 20px;
    margin: 5vw 0 10vw; }
    #sec6 .tel p:nth-child(2) {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      justify-content: center;
      align-items: center;
      font-weight: 600;
      font-size: 6vw;
      line-height: 1; }
      #sec6 .tel p:nth-child(2) i {
        width: 12px;
        height: auto;
        top: -1px; }
  #sec6 .btn-link {
    margin: auto;
    width: 70%; }
  @media only screen and (min-width: 768px) {
    #sec6 {
      padding: 84px 0 57px; }
      #sec6 h2 {
        text-align: center;
        font-size: 40px;
        margin-bottom: 41px;
        line-height: 85px; }
        #sec6 h2 i {
          width: 63px; }
      #sec6 .sec6-col {
        width: 487px; }
      #sec6 h3 {
        font-size: 23px;
        line-height: 52px;
        margin-bottom: 27px; }
      #sec6 .sec6-txt1 {
        margin-bottom: 14px;
        line-height: 27px; }
      #sec6 .tel {
        padding: 1px 21px 10px 0;
        width: 360px;
        margin: 24px 0 0;
        font-size: 16px;
        box-sizing: border-box; }
        #sec6 .tel p:nth-child(2) {
          font-size: 39px;
          line-height: 1.1;
          letter-spacing: 0.02em; }
          #sec6 .tel p:nth-child(2) i {
            width: 22px;
            top: -2px; }
      #sec6 .btn-link {
        width: 353px;
        margin-top: 22px; } }

#sec7 {
  background: url("../img/shared/bg3.jpg");
  margin: 0 auto 13vw;
  max-width: 1210px;
  width: 100%;
  padding: 13vw 0; }
  #sec7 h2 {
    text-align: center;
    font-size: 6vw;
    color: #342513;
    margin-bottom: 5vw; }
  @media only screen and (min-width: 768px) {
    #sec7 {
      margin-bottom: 77px;
      padding: 59px 0 51px; }
      #sec7 h2 {
        font-size: 28px;
        margin-bottom: 54px;
        letter-spacing: 2px; }
      #sec7 .border {
        border-right: 2px solid #000;
        margin-right: 20px; } }

#mail {
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 0;
  margin: 0; }
  #mail .fc-confirm .row-note {
    display: none; }
  #mail [class^=error] {
    left: 12px;
    bottom: -16px;
    font-weight: normal;
    position: static; }
  #mail .row > .col {
    width: 100%;
    padding-bottom: 0; }
  #mail textarea {
    margin-top: 10px; }
  #mail .row > .col.align-top [class^=error] {
    top: 40px;
    bottom: inherit;
    top: 50px; }
  #mail .row > .col.align-top {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start; }
  #mail .messages-row {
    /*min-height: 320px;*/ }
  #mail .messages-row textarea {
    height: 300px !important; }
  #mail .row > .col.align-top .caption {
    padding-top: 10px; }
  #mail .row > .col.postal_code .input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
  #mail .row > .col.postal_code .txt {
    padding-right: 15px; }
  #mail .row > .col.postal_code input {
    /*width: 390px;*/ }
  #mail .row > .col .content > * {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    /* For IE10 */ }
  #mail .row:last-child {
    border: none; }
  #mail .row select {
    /* for Firefox */
    -moz-appearance: none;
    /* for Chrome */
    -webkit-appearance: none; }
  #mail .fc-form .form-parse-text {
    width: calc(100% - 100px); }
  #mail .row1 .input, #mail .row2 .input, #mail .row3 .input, #mail .row4 .input, #mail .row5 .input {
    display: flex;
    justify-content: space-between;
    align-items: center; }
  #mail .row1 select, #mail .row2 select, #mail .row3 select, #mail .row4 select, #mail .row5 select {
    width: 100%; }
  #mail .row1 input, #mail .row2 input, #mail .row3 input, #mail .row4 input, #mail .row5 input {
    width: 70px; }
  #mail .row1 .col, #mail .row2 .col, #mail .row3 .col, #mail .row4 .col, #mail .row5 .col {
    padding: 0; }
  #mail .row2, #mail .row3, #mail .row4, #mail .row5 {
    border-top: none !important;
    padding: 8px 0 0 0 !important; }
    #mail .row2 .caption::before, #mail .row3 .caption::before, #mail .row4 .caption::before, #mail .row5 .caption::before {
      display: none; }
  #mail .row1 {
    padding-bottom: 0 !important; }
    #mail .row1 .input {
      padding-top: 10px; }
  #mail .row5 {
    padding-bottom: 10px !important; }
  #mail .row > .col .content > * select::-ms-expand {
    display: none; }
  #mail .row > .col .content > * .input:nth-child(1) {
    width: 320px; }
  #mail .row > .col .content > * .input:nth-child(2) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100px;
    margin: 0;
    font-size: 14px; }
  #mail .row > .col .content > * .input:nth-child(2) input {
    width: 70px;
    text-align: center; }
  #mail .row > .col .col_reservetime {
    margin-top: 10px; }
  #mail .row > .col .col_reservetime .input {
    justify-content: space-between;
    align-items: center; }
  #mail .row > .col .col_reservetime .input > * {
    width: 100%;
    margin-bottom: 10px; }
  #mail .row > .col .col_reservetime select {
    /* for Firefox */
    -moz-appearance: none;
    /* for Chrome */
    -webkit-appearance: none; }
  #mail .row > .col .col_reservetime select::-ms-expand {
    display: none; }
  #mail .row > .col label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-left: 30px;
    padding-right: 15px;
    position: relative; }
  #mail input[type=radio] {
    position: absolute;
    opacity: 0;
    cursor: pointer; }
  #mail .input.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  #mail input:checked ~ .radiobtn {
    background-color: #2196F3; }
  #mail textarea {
    padding: 20px 25px;
    min-height: 90px; }
  #mail .radiobtn {
    position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #ddd; }
  #mail .row {
    position: relative;
    border-top: 1px solid #988774;
    padding: 10px 0; }
  #mail input, #mail select, #mail textarea {
    height: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #fff;
    color: #592514;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    padding: 8px 10px; }
  #mail .row-note {
    font-size: 12px;
    line-height: 1.5; }
  #mail input:focus, #mail select:focus, #mail textarea:focus {
    color: #000; }
  #mail .note {
    text-align: center;
    padding-bottom: 67px;
    letter-spacing: -0.02em; }
  #mail .fc-confirm .confirm-value {
    background: none;
    box-shadow: none; }
  #mail .fc-confirm .mark-require {
    display: none; }
  #mail .fc-confirm .note {
    display: none; }
  #mail .row-radiobtn .input {
    justify-content: flex-start;
    align-items: center; }
  @media only screen and (min-width: 768px) {
    #mail {
      line-height: 30px; }
      #mail .row {
        padding: 16px 0; }
      #mail .row-note {
        font-size: 16px;
        line-height: 30px;
        width: 300px;
        position: absolute;
        top: 38px;
        left: 51px; }
      #mail .col_reservetime .input > div {
        width: 48.6% !important;
        margin-bottom: 5px !important; }
      #mail .row-radiobtn {
        line-height: 28px; }
        #mail .row-radiobtn input {
          height: 27px !important; }
        #mail .row-radiobtn label {
          line-height: 27px !important; } }

#thanks {
  padding: 50px 0; }
