@charset "UTF-8";
/* ***************************************

          中華そば

*****************************************/
.soba_page {
  /* ***************************************
          メニュー
*****************************************/
  /* ***************************************
          店舗
*****************************************/
  /* ***************************************
          news
*****************************************/
  /* ***************************************
          footer
*****************************************/ }
  .soba_page .nav .main {
    margin: 60px 0; }
    .soba_page .nav .main a::after {
      display: none; }
  .soba_page .main_img {
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-image: url(../../img/soba/main_img.jpg); }
    .soba_page .main_img li,
    .soba_page .main_img img {
      max-width: none;
      max-height: none;
      width: 100%; }
    .soba_page .main_img .logo {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%); }
      @media print, screen and (min-width: 768px) {
        .soba_page .main_img .logo {
          width: 400px; } }
      @media screen and (max-width: 767px) {
        .soba_page .main_img .logo {
          width: 60; } }
    @media print, screen and (min-width: 768px) {
      .soba_page .main_img {
        height: 760px; } }
    @media screen and (max-width: 767px) {
      .soba_page .main_img {
        padding-bottom: 103%; } }
  .soba_page .bg_brown {
    background: #41250c; }
    .soba_page .bg_brown > * {
      color: white; }
  .soba_page .top_banner li img {
    border-radius: 20px; }
  .soba_page .top_banner .swiper-button-prev,
  .soba_page .top_banner .swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E"); }
  .soba_page .top_banner .swiper-button-next,
  .soba_page .top_banner .swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E"); }
  .soba_page .story01 {
    overflow: hidden;
    position: relative; }
    .soba_page .story01::before, .soba_page .story01::after {
      content: "";
      display: block;
      position: absolute; }
    .soba_page .story01::before {
      background: url(../../img/soba/story_bg1.svg) no-repeat center;
      left: 50%;
      transform: translate(-50%, 0%); }
      @media print, screen and (min-width: 768px) {
        .soba_page .story01::before {
          width: 40%;
          height: 20vw;
          top: 50%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story01::before {
          width: 80%;
          height: 36vw;
          top: 12%; } }
    .soba_page .story01::after {
      background: url(../../img/soba/story_bg3.svg) no-repeat center;
      bottom: 5%; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story01::after {
          width: 35px;
          height: 40vw;
          left: 2%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story01::after {
          width: 6%;
          height: 89vw;
          top: 46%;
          left: 5%; } }
  .soba_page .soba_nav {
    font-family: "FOT-筑紫ゴシック Pr5 D"; }
    @media print, screen and (min-width: 768px) {
      .soba_page .soba_nav {
        max-width: 760px;
        padding-top: 60px;
        padding-bottom: 60px; } }
    @media screen and (max-width: 767px) {
      .soba_page .soba_nav {
        width: 75%;
        padding-top: 40px;
        padding-bottom: 40px; } }
    .soba_page .soba_nav ol {
      flex-wrap: wrap; }
    .soba_page .soba_nav li {
      text-align: center; }
      @media print, screen and (min-width: 768px) {
        .soba_page .soba_nav li {
          width: 20%; } }
      @media screen and (max-width: 767px) {
        .soba_page .soba_nav li {
          width: 48%;
          margin-bottom: 20px; } }
      .soba_page .soba_nav li a {
        display: block;
        border: solid 1px white;
        color: white;
        border-radius: 30px;
        padding: 6px 15px 8px; }
  .soba_page .story_title .story_box {
    border: solid 1px white;
    padding: 1px 15px 5px;
    position: relative;
    margin-top: 10px;
    text-align: center;
    font-size: 2.2rem;
    font-family: "FOT-筑紫A見出ミン Std E"; }
  .soba_page .story_title .contents-title::before,
  .soba_page .story_title .contents-title::after,
  .soba_page .story_title .story_box::before,
  .soba_page .story_title .story_box::after {
    content: "";
    position: absolute;
    display: block;
    border: solid 1px white;
    width: 7px;
    height: 7px; }
  .soba_page .story_title .story_box::before {
    left: -9px;
    top: -9px; }
  .soba_page .story_title .story_box::after {
    left: -9px;
    bottom: -9px; }
  .soba_page .story_title .contents-title::before {
    right: -9px;
    top: -9px; }
  .soba_page .story_title .contents-title::after {
    right: -9px;
    bottom: -9px; }
  .soba_page .story {
    padding: 100px 0;
    position: relative; }
    .soba_page .story::after {
      content: "";
      display: block;
      position: absolute;
      background: url(../../img/soba/story_bg2.svg) no-repeat center;
      width: 35px;
      height: 20vw;
      top: 34%; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story::after {
          right: 2%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story::after {
          right: 5%;
          width: 6%;
          height: 56vw;
          top: 16%; } }
    .soba_page .story .copy {
      writing-mode: vertical-rl;
      font-family: "FOT-筑紫Cオールド明朝 Pr6 D";
      text-align: center;
      position: relative;
      z-index: 3; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story .copy {
          font-size: 5rem;
          height: 12em;
          margin: 100px auto 15%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story .copy {
          font-size: 7vw;
          height: 78vw;
          margin: 60px auto 18%; } }
    .soba_page .story .story_pic1,
    .soba_page .story .story_pic2 {
      position: absolute;
      z-index: 2; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story .story_pic1,
        .soba_page .story .story_pic2 {
          border-radius: 30px;
          width: 45%;
          padding-bottom: 30%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story .story_pic1,
        .soba_page .story .story_pic2 {
          border-radius: 20px;
          width: 80%;
          padding-bottom: 53%; } }
    .soba_page .story .story_pic1 {
      background: url(../../img/soba/story1.jpg) no-repeat center;
      background-size: cover;
      left: -5%; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story .story_pic1 {
          top: 23%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story .story_pic1 {
          bottom: 31%; } }
    .soba_page .story .story_pic2 {
      background: url(../../img/soba/story2.jpg?v3) no-repeat center;
      background-size: cover;
      right: -5%; }
      @media print, screen and (min-width: 768px) {
        .soba_page .story .story_pic2 {
          top: 43%; } }
      @media screen and (max-width: 767px) {
        .soba_page .story .story_pic2 {
          bottom: 0; } }
    .soba_page .story .story_pic_area {
      position: relative;
      padding: 10px 0;
      max-width: 1200px;
      margin-left: auto;
      margin-right: auto; }
      @media screen and (max-width: 767px) {
        .soba_page .story .story_pic_area {
          padding-bottom: 80%;
          margin-bottom: 40px; } }
    .soba_page .story p {
      font-size: 1.6rem; }
  .soba_page .tonkotsushoyu {
    position: relative;
    z-index: 2;
    margin-bottom: 70px; }
    @media print, screen and (min-width: 768px) {
      .soba_page .tonkotsushoyu {
        justify-content: space-between; }
        .soba_page .tonkotsushoyu .img {
          width: 50%; }
        .soba_page .tonkotsushoyu .cont {
          width: 45%; } }
  .soba_page .kodawari::before {
    content: "";
    display: block;
    width: 100%;
    height: 40px;
    background: url(../../img/soba/line1.svg) repeat center;
    margin-bottom: 60px; }
  @media print, screen and (min-width: 768px) {
    .soba_page .kodawari .cont {
      width: 45%; } }
  @media screen and (max-width: 767px) {
    .soba_page .kodawari .cont {
      margin-bottom: 40px; } }
  .soba_page .kodawari .ll-size {
    font-size: 3.2rem; }
  .soba_page .kodawari .img {
    border-radius: 30px;
    overflow: hidden; }
  .soba_page .contents-title {
    font-family: "FOT-筑紫A見出ミン Std E"; }
  .soba_page .oldmin {
    font-family: "FOT-筑紫Cオールド明朝 Pr6 D"; }
  .soba_page .midashi_line_tate {
    writing-mode: vertical-rl;
    font-family: "FOT-筑紫Cオールド明朝 Pr6 D";
    font-size: 3rem;
    text-align: center;
    margin: 80px auto 200px; }
    @media screen and (max-width: 767px) {
      .soba_page .midashi_line_tate {
        margin-top: 40px;
        margin-bottom: 100px; } }
    .soba_page .midashi_line_tate::before, .soba_page .midashi_line_tate::after {
      content: "";
      display: block;
      width: 50px;
      height: 300px;
      background: url(../../img/soba/title_parts_r.svg) no-repeat center;
      margin: 0 30px; }
    .soba_page .midashi_line_tate::after {
      background: url(../../img/soba/title_parts_l.svg) no-repeat center; }
    .soba_page .midashi_line_tate span {
      writing-mode: horizontal-tb;
      font-size: 1.8rem;
      display: inline-block;
      margin-top: 10px; }
  .soba_page .limited_title {
    position: relative; }
    @media print, screen and (min-width: 768px) {
      .soba_page .limited_title {
        margin: 0 auto 60px;
        width: 400px; } }
    @media screen and (max-width: 767px) {
      .soba_page .limited_title {
        margin: 0 auto 30px;
        width: 65%; } }
  .soba_page .menu {
    /*&::after {
      content: "";
      display: block;
      height: 25px;
      margin: 100px 0 20px;
      background: url(../../img/soba/line3.svg) repeat center;
    }*/ }
    .soba_page .menu::after {
      content: "";
      display: block;
      height: 25px;
      margin: 100px 0 20px;
      width: 100%;
      background-image: url(../../img/soba/line3.svg);
      background-repeat: repeat-x;
      background-size: auto 100%;
      animation: scroll-left 30s linear infinite;
      will-change: background-position; }
@keyframes scroll-left {
  from {
    background-position: 0 0; }
  to {
    background-position: -1160px 0; } }
    .soba_page .menu .bg_area {
      background-color: #f7ebc5; }
      @media print, screen and (min-width: 768px) {
        .soba_page .menu .bg_area {
          padding-bottom: 300px;
          margin-bottom: -160px;
          padding-top: 40px; } }
      @media screen and (max-width: 767px) {
        .soba_page .menu .bg_area {
          padding-bottom: 40vw;
          margin-bottom: -28vw; } }
      .soba_page .menu .bg_area::before, .soba_page .menu .bg_area::after {
        background: url(../../img/soba/menu_line.svg) no-repeat center top;
        position: absolute; }
        @media print, screen and (min-width: 768px) {
          .soba_page .menu .bg_area::before, .soba_page .menu .bg_area::after {
            top: -110px;
            height: 390px;
            background-size: 160% 390px !important; } }
        @media screen and (max-width: 767px) {
          .soba_page .menu .bg_area::before, .soba_page .menu .bg_area::after {
            top: -70px;
            height: 250px;
            background-size: 210% 250px !important; } }
      .soba_page .menu .bg_area::after {
        top: auto;
        bottom: -50px;
        background-image: url(../../img/soba/menu_line_w.svg); }
      .soba_page .menu .bg_area > * {
        z-index: 2; }
    .soba_page .menu .menu_cont {
      position: relative;
      z-index: 2; }
      @media screen and (max-width: 767px) {
        .soba_page .menu .menu_cont {
          padding: 40px 5% 80px; } }
      @media print, screen and (min-width: 768px) {
        .soba_page .menu .menu_cont .flex-ce.flex-re .img {
          padding-right: 0; } }
      .soba_page .menu .menu_cont .flex-ce:first-child {
        align-items: center; }
      @media print, screen and (min-width: 768px) {
        .soba_page .menu .menu_cont h2.contents-title {
          font-size: 5rem; } }
      @media screen and (max-width: 767px) {
        .soba_page .menu .menu_cont h2.contents-title {
          font-size: 4.3rem; } }
      @media print, screen and (min-width: 768px) {
        .soba_page .menu .menu_cont::after {
          background: url(../../img/soba/line2.svg) no-repeat center;
          height: 30px; } }
      @media screen and (max-width: 767px) {
        .soba_page .menu .menu_cont::after {
          background: url(../../img/soba/line2_sp.svg) no-repeat center;
          height: 7vw;
          width: 90%;
          left: 5%; } }
      .soba_page .menu .menu_cont.limited .img::before {
        display: none; }
      .soba_page .menu .menu_cont h2.limited_ico img {
        height: 120px !important;
        width: auto !important; }
        @media screen and (max-width: 767px) {
          .soba_page .menu .menu_cont h2.limited_ico img {
            height: 100px !important; } }
  .soba_page .shop {
    background-color: #f7ebc5;
    padding: 20px 0 60px; }
    @media print, screen and (min-width: 768px) {
      .soba_page .shop .midashi_line_tate {
        margin-bottom: 10px; } }
    @media screen and (max-width: 767px) {
      .soba_page .shop .midashi_line_tate {
        margin-top: 30px;
        margin-bottom: -40px; } }
    .soba_page .shop .shop_list img {
      border-radius: 20px; }
  @media print, screen and (min-width: 768px) {
    .soba_page .news {
      padding: 40px 0; } }
  .soba_page .news .midashi_line_tate {
    margin-bottom: 10px; }
  .soba_page .soba_foot_logo {
    margin: 60px auto 40px;
    max-width: 500px; }
    @media print, screen and (min-width: 768px) {
      .soba_page .soba_foot_logo {
        width: 100%; } }
    @media screen and (max-width: 767px) {
      .soba_page .soba_foot_logo {
        width: 70%;
        margin-bottom: 0; } }
  @media print, screen and (min-width: 768px) {
    .soba_page .to_gaba_btn.foot {
      margin: 40px auto 60px; } }
  @media screen and (max-width: 767px) {
    .soba_page .to_gaba_btn.foot {
      margin: 0px auto 60px; } }
  .soba_page .to_gaba_btn.foot a {
    display: block;
    border: solid 1px white;
    padding: 1px 30px 5px;
    border-radius: 30px;
    position: relative;
    margin-top: 10px;
    text-align: center;
    font-size: 2.2rem;
    font-family: "FOT-筑紫A見出ミン Std E"; }
  .soba_page footer {
    background: #41250c;
    margin-top: 200px; }
    .soba_page footer > * {
      color: white; }
    .soba_page footer::before {
      height: 35px;
      background-size: auto 100% !important;
      background: url(../../img/soba/line1.svg) repeat center;
      top: -45px; }
    .soba_page footer .soba_nav {
      padding-top: 20px;
      padding-bottom: 60px; }
    .soba_page footer ol {
      padding: 0; }
    .soba_page footer .sns.flex-mce {
      margin: 0;
      filter: invert(1); }
