.tab-bar{
    display: flex;
    width: 84.37%;
    max-width: 1620px;
    height: 70px;
    border-bottom: 1px solid #367ED6;
    margin: 0 auto;
  }
  .tab-bar button{
    width: 18.64%;
    height: 100%;
    background-color: #fff;
    color: #000;
    font-weight: bold;
    border: 1px solid #367ED6;
    border-bottom: none;
    position: relative;
    top: 1px;
  }

  .tab-bar button:last-child{
    left: 4.3%;
  }

  .tab-bar button.active{
    background-color: rgba(54, 126, 214, 31%);
    color: #585858;
    border-bottom: 1px solid #fff;
  }

  .state{
    width: 84.37%;
    max-width: 1620px;
    margin: 0 auto;
  }
  .meister{
    width: 84.37%;
    max-width: 1620px;
    margin: 0 auto;
  }

  .meister p{font-size: 31.5px; line-height: normal;}
  .meister .title{font-size: 48px; font-weight: bold; display: block; margin-bottom: 27px;}
  .meister .bold{font-weight: bold;}

  .map{
    position: relative;
    width: 100%;
    max-width: 1920px;
    height: clamp(0px, 58.17vw, 1117px);
    margin: clamp(0px, 4.94vw, 95px) auto 0;
  }
  svg {
    position: absolute;
    width: clamp(0px, 57.5vw, 1105px); 
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  svg g{
    opacity: 0.7;
    cursor: pointer;
  }
  svg g:hover{
    opacity: 1;
  }
  .regionText{
      display: inline-block;
      padding: clamp(0px, 0.78vw, 15px) clamp(0px, 1.3vw, 25px);
      box-sizing: border-box;
  }

  .regionText.red{
      position: absolute;
      right: 0;
      top: clamp(0px, 7.5vw, 144px);
      background-color: rgba(231, 76, 60, 0.2);
      border: 1px solid #E74C3C;
  }
  .regionText.orange{
    position: absolute;
    right: 0;
    top: clamp(0px, 15.26vw, 293px);
    background-color: rgba(243, 156, 18, 0.2);
    border: 1px solid #F39C12;
  }
  .regionText.yellow{
    position: absolute;
    right: 0;
    top: clamp(0px, 27.13vw, 521px);
    background-color: rgba(255, 202, 40, 0.2);
    border: 1px solid #FFCA28;
  }
  .regionText.green{
    position: absolute;
    right: 0;
    top: clamp(0px, 39.01vw, 749px);
    background-color: rgba(46, 204, 113, 0.15);
    border: 1px solid #2ECC71;
  }
  .regionText.sky{
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(0, 188, 212, 0.15);
    border: 1px solid #00BCD4;
  }
  .regionText.blue{
    position: absolute;
    left: 0;
    top: clamp(0px, 11.92vw, 229px);
    background-color: rgba(54, 126, 214, 0.15);
    border: 1px solid #367ED6;
  }
  .regionText.violet{
    position: absolute;
    left: 20.37%;
    top: clamp(0px, 11.92vw, 229px);
    background-color: rgba(155, 89, 182, 0.15);
    border: 1px solid #9B59B6;
  }
  .regionText.pink{
    position: absolute;
    left: 0;
    top: clamp(0px, 23.85vw, 458px);
    background-color: rgba(236, 64, 122, 0.15);
    border: 1px solid #EC407A;
  }

  .regionText.red,
  .regionText.orange,
  .regionText.blue,
  .regionText.violet{
    width: 15.62vw;
    max-width: 300px;
  }

  .regionText.red .content-container .content,
  .regionText.orange .content-container .content,
  .regionText.blue .content-container .content,
  .regionText.violet .content-container .content{
    width: 45%;
  }

  .regionText.yellow,
  .regionText.green,
  .regionText.sky,
  .regionText.pink{
    width: 23.43vw;
    max-width: 450px;
  }

  .regionText .content-container .content{
    display: inline-block;
    width: 30%;
  }

  .regionText .title{
      display: flex;
      align-items: center;
      font-size: clamp(0px, 1.64vw, 31.5px);
      line-height: normal;
      font-weight: bold;
  }

  .regionText .title::before{
      content: "";
      left: 0;
      top: 0;
      width: 30px;
      height: 30px;
      margin-right: clamp(0px, 0.36vw, 7px);
  }

  .regionText.red .title::before{
    background-color: rgba(231, 76, 60);
  }
  .regionText.orange .title::before{
    background-color: rgba(243, 156, 18);
  }
  .regionText.yellow .title::before{
    background-color: rgba(255, 202, 40);
  }
  .regionText.green .title::before{
    background-color: rgba(46, 204, 113);
  }
  .regionText.sky .title::before{
    background-color: rgba(0, 188, 212);
  }
  .regionText.blue .title::before{
    background-color: rgba(54, 126, 214);
  }
  .regionText.violet .title::before{
    background-color: rgba(155, 89, 182);
  }
  .regionText.pink .title::before{
    background-color: rgba(236, 64, 122);
  }

  .regionText .content{
      font-size: clamp(0px, 1.25vw, 24px);
      line-height: clamp(0px, 2.03vw, 39px);
  }

  .regionText .content:hover{
      text-decoration: underline;
      cursor: pointer;
  }

  .region{
    font-size: clamp(0px, 2.5vw, 48px);
    font-weight: bold;
    line-height: normal;
    padding: clamp(0px, 1.04vw, 20px) 0;
    box-sizing: border-box;
    border-bottom: 2px solid #D9D9D9;
    margin: clamp(0px, 8.85vw, 170px) auto 0;
  }    
  .store-locator-wrapper {
      padding: 40px 20px;
  }

  .region-main-section {
      margin-bottom: 60px;
  }

  .region-main-title {
      font-size: clamp(0px, 2.5vw, 48px);
      font-weight: bold;
      margin-bottom: clamp(0px, 1.25vw, 24px);
      padding-bottom: clamp(0px, 1.25vw, 24px);
      border-bottom: 2px solid #D9D9D9;
      color: #111;
  }

  .region-sub-section {
      margin-bottom: 32px;
  }

  .region-sub-title {
      width: 10.93vw;
      height: 2.08vw;
      max-width: 210px;
      max-height: 40px;
      border-radius: 40px;
      font-size: clamp(0px, 1.25vw, 24px);
      font-weight: bold;
      color: #fff;
      text-align: center;
      line-height: clamp(0px, 2.08vw, 40px);
      margin-bottom: clamp(0px, 0.83vw, 16px);
  }

  .stores-list {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 16px;
      justify-content: space-between;
  }

  .store-card {
      width: 47.5%;
      margin-top: clamp(0px, 0.83vw, 16px);
  }

  .store-card .flex-wrapper{
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .store-badge-image {
      width: 4.16vw;
      max-width: 80px;
      height: auto;
      margin-left: clamp(0px, 2.08vw, 40px);
  }

  .badge-icon {
      width: 100%;
      height: auto;
      border-radius: 0 8px 0 0;
  }

  .store-name {
      height: clamp(0px, 6.04vw, 116px);
      font-size: clamp(0px, 2.08vw, 40px);
      line-height: normal;
      color: #0066cc;
      font-weight: bold;
  }

  .store-zipcode {
      font-size: clamp(0px, 1.25vw, 24px);
      line-height: normal;
      margin-top: clamp(0px, 1.04vw, 20px);
  }

  .store-address {
      font-size: clamp(0px, 1.25vw, 24px);
      line-height: normal;
      margin-top: clamp(0px, 0.4vw, 8px);
      height: clamp(0px, 3.54vw, 68px);
  }

  .store-buttons {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin-top: clamp(0px, 1.04vw, 20px);
      width: 70%;
  }

  .btn {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      width: 13.02vw;
      max-width: 250px;
      height: 2.6vw;
      max-height: 50px;
      border-radius: 6px;
      font-size: clamp(0px, 1.25vw, 24px);
      text-decoration: none;
      transition: background 0.2s, color 0.2s;
      line-height: normal;
  }

  #container .btn-phone {
      background: #2196f3;
      color: #fff;
  }
  .store-buttons .btn img{
      width: 1.04vw;
      max-width: 20px;
      height: 1.04vw;
      max-height: 20px;
      margin-right: 4px;
  }

  .store-buttons .btn-phone:hover{
    color: #fff !important;
  }
  
  .store-buttons .btn-map:hover{
    color: #2196f3 !important;
  }

  .btn-phone:hover {
      background: #1976d2;
      color: #fff;
  }

  #container .btn-map {
      background: #fff;
      color: #2196f3;
      border: 1px solid #2196f3;
  }

  .btn-map:hover {
      background: #e3f2fd;
  }

  .product{
      width: 100%;
      background-color: #F7F9FA;
      padding: 15px;
      box-sizing: border-box;
      font-size: clamp(0px, 1.25vw, 24px);
      line-height: normal;
      margin-top: clamp(0px, 1.04vw, 20px);
  }

  .product .title{
      color: #367ED6;
      font-weight: bold;
  }

  .no-data {
      text-align: center;
      color: #888;
      padding: 40px;
  }

  @media (max-width: 1024px) {
      .store-locator-wrapper{
        width: 87%;
        padding: 0;
        margin: 10vw auto;
      }
      .store-card {
          width: 100%;
      }

      .btn {
          width: 100%;
          justify-content: center;
      }
      .state{
        width: 100%;
      }
      .map{
        height: auto;
        margin: 0;
      }
      svg {
        position: relative;
        width: 87%;
        left: 50%;
        top: 0;
        transform: translate(-50%, 0);
      }
      .store-info{
        width: 100%;
      }
      .store-info:nth-child(1) .prefecture{
        margin-top: 3.2vw;
      }
      .regionText{
        margin: 2.6vw auto 0;
        padding: 5.06vw 8.8vw;
      }
      .regionText.red,
      .regionText.orange,
      .regionText.yellow,
      .regionText.green,
      .regionText.sky,
      .regionText.blue,
      .regionText.violet,
      .regionText.pink{
        position: initial;
        display: flex;
        flex-direction: column;
        width: 87%;
        max-width: none;
      }
      .regionText .title{
        font-size: 5.33vw;
      }
      .regionText .content{
        font-size: 4.8vw;
        line-height: normal;
      }
      .regionText .title::before{
        width: 4.53vw;
        height: 4.53vw;
      }
      .region{
        font-size: 6.4vw;
        border-bottom: 1px solid #D9D9D9;
      }
      .region-main-title{
        font-size: 6.4vw;
        border-bottom: 1px solid #D9D9D9;
        padding-bottom: 2.5vw;
        margin-bottom: 2.5vw;
      }
      .region-sub-title{
        width: 33.33vw;
        height: 8vw;
        font-size: 4.8vw;
        line-height: 8vw;
        border-radius: 4vw;
        margin-top: 10.66vw;
      }
      .store-name{
        height: 15vw;
        font-size: 5.33vw;
      }
      .store-zipcode{
        font-size: 4.26vw;
        margin-top: 3.2vw;
      }
      .store-address{
        font-size: 4.26vw;
        margin-top: 1.86vw;
        height: auto;
      }
      .store-buttons {
        width: auto;
        flex-direction: row;
        margin-top: 3.2vw;
      }
      .store-buttons .btn-phone{
        flex-direction: column;
        width: 47.5%;
        max-width: none;
        height: 16.26vw;
        max-height: none;
        font-size: 4.26vw;
        border-radius: 2.66vw;
      }
      .store-buttons .btn-phone img{
        width: 5.86vw;
        height: auto;
        margin-right: 0;
        margin-bottom: 0.8vw;
      }
      .store-buttons .btn-map{
        flex-direction: column;
        width: 47.5%;
        max-width: none;
        height: 16.26vw;
        max-height: none;
        font-size: 4.26vw;
        border-radius: 2.66vw;
      }
      .store-buttons .btn-map img{
        width: 5.86vw;
        height: auto;
        margin-right: 0;
        margin-bottom: 0.8vw;
      }
      .product{
        padding: 0 3.2vw;
        width: 100%;
        max-width: none;
        height: 28.26vw;
        max-height: none;
        margin-top: 3.2vw;
        font-size: 4.26vw;
      }
      .product .title{
        font-weight: bold;
        color: #367ED6;
        margin-bottom: clamp(0px, 0.5vw, 10px);
      }
      .store-badge-image{
        width: 14vw;
        margin-left: 8vw;
      }
  }