:root {
  --header: 120px;
  --bgSite: #67c9bf;
  --content-width: 1000px;
  --font-yugothic: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  --font-yumincho: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",
    "Hiragino Mincho ProN", "HG明朝B", serif;
  --font-meiryo: "Meiryo UI", Meiryo, メイリオ, Osaka, "MS PGothic", arial,
    helvetica, sans-serif;
}

@media screen and (min-width: 750px) {
  .group .desc p.right {
    text-align: right;
    font-size: 24px;
    font-weight: 400;
    font-family: var(--font-yumincho);
  }
}

@media screen and (min-width: 1px) and (max-width: 750px) {
  body .uContact-step li::after {
    left: -2px;
  }

  .uContact-step .title {
    font-size: 12px;
    padding: 0 20px;
  }

  .uContact-step li {
    padding-right: 20px;
    margin-right: -75px;
    clip-path: polygon(0% 0%,
        calc(100% - 30px) 0%,
        100% 50%,
        calc(100% - 30px) 100%,
        0% 100%);
  }

  .uContact-step li:nth-child(2) {
    margin-left: 45px;
  }

  .uContact-step li:nth-child(2) .title {
    padding: 0 0 0 30px;
  }

  .uContact-step li:nth-child(3) .title {
    padding: 0 0 0 20px;
  }

  .under .main_content section h3.h3-title {
    font-size: 22px;
    max-width: 100px;
  }

  .under .main_content section h4.h4-title {
    padding: 15px 62px 15px 15px;
    font-size: 18px;
  }

  .group .desc p.right {
    text-align: right;
    font-size: 18px;
    font-family: var(--font-yumincho);
  }

  .under .main_content section h3.h3-title.cus {
    max-width: 100%;
  }

  table.form-wrap {
    font-size: 14px;
  }

  table.form-wrap tr {
    display: flex;
    flex-wrap: wrap;
  }

  table.form-wrap th,
  table.form-wrap td {
    padding: 10px;
    width: 100%;
    margin-bottom: 5px;
  }

  /*-- main_content --------------------------
    ------------------------------------------*/
  .under .main_content .image-r,
  .under .main_content .image-l {
    margin: 0 auto 1.5em;
    width: 100%;
    text-align: center;
  }

  .under .main_content .image-r img,
  .under .main_content .image-l img {
    margin: 0 auto 0;
  }

  .sub_main {
    margin-top: 80px;
    padding: 8vw 0;
  }

  .sub_main .title_sub_main {
    font-size: 26px;
  }

  .under .main_content h1 .sub {
    font-size: 16px;
  }

  .breadcrumb {
    padding: 10px 4vw;
  }

  .breadcrumb ul.topic-path {
    flex-wrap: wrap;
  }

  .breadcrumb ul.topic-path li::before,
  .breadcrumb ul.topic-path li span,
  .breadcrumb ul.topic-path li a {
    font-size: 14px;
  }

  .breadcrumb ul.topic-path li::before {
    top: 3px;
  }

  .under .main_content h1 {
    font-size: 22px;
    padding: 4vw 4vw;
  }

  .under .main_content {
    padding: 0 4vw;
  }

  .under .main_content section {
    margin-bottom: 50px;
  }

  .under .main_content section h2 {
    font-size: 24px;
    margin-bottom: 1em;
    padding: 15px 35px 15px 15px;
  }

  .under .main_content section h2::before {
    clip-path: polygon(0 0, calc(100% - 30px) 0%, 100% 100%, 0% 100%);
  }

  .under .main_content section h3 {
    font-size: 22px;
    display: inline-block;
  }

  .under .main_content .frame.frame06.mb60 {
    margin-bottom: 1.5em !important;
  }

  /*-- /main_content -------------------------
    ------------------------------------------*/

  /*-- btn all content------------------------
    ------------------------------------------*/
  .uList-bnr li {
    max-width: 320px;
    width: 100%;
    height: auto;
    min-height: auto;
    background-position: top 54% right 10px;
    padding: 24px 12px;
    background-size: 26px;
    margin-bottom: 20px;
  }

  .uList-bnr li:last-child {
    margin-bottom: 0;
  }

  .uList-bnr li::before {
    width: calc(100% - 10px);
    height: calc(100% - 10px);
  }

  .max {
    font-size: 18px;
  }

  .min {
    font-size: 14px;
    top: calc(6px / 16px * 1em);
  }

  /*-- /btn all content----------------------
    ------------------------------------------*/

  /*-- page merchandise ----------------------
    ------------------------------------------*/

  h2.spSmall span {
    display: inline-block;
    font-size: 18px;
  }

  .under .list-under {
    width: 100%;
  }

  .under .d-flex-under {
    flex-direction: column-reverse;
  }

  .under .frame02,
  .under .frame01 {
    padding: 20px;
  }

  .under .list-under li {
    padding: 5px 0 5px 35px;
    font-size: 16px;
  }

  .under .d-flex-under .des {
    width: 100%;
    padding-left: 0;
    margin-top: 1em;
  }

  .under .d-flex-under .des dl dt {
    font-size: 18px;
  }

  .under .d-flex-under .des dl:not(:last-child) {
    margin-bottom: 1em;
  }

  .under .d-flex-under .txt {
    width: 100%;
    padding-top: 1em;
  }

  .under .main_content section h4 {
    font-size: 18px;
  }

  .under .d-flex-under .txt .title {
    font-size: 18px;
  }

  .under .frame03 {
    padding: 20px;
  }

  .under .frame07 {
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .under .frame07__image {
    width: 100%;
  }

  .under .frame07__list {
    width: 100%;
  }

  .under .frame07__list li img {
    width: 28px;
    height: 28px;
  }

  .under .frame07__list li span::first-line {
    font-size: 18px;
  }

  .under .frame08 {
    flex-direction: column;
  }

  .under .frame08__item {
    width: 100%;
  }

  .under .frame09 {
    width: 100%;
    padding: 32px 16px;
  }

  .under .frame09 ul li {
    width: calc((100% - 8px) / 2);
  }

  .under .merchandise_bnr {
    background: url(../images/merchandise_bg01_sp.png) no-repeat;
    position: relative;
  }

  .under .merchandise_bnr.umino-mitsu {
    background-size: contain;
    padding: 40vw 4vw 0 4vw;
  }

  .under .merchandise_bnr.bg_utter,
  .under .merchandise_bnr {
    padding: 46vw 4vw 0 4vw;
    background-size: contain;
  }

  .under .merchandise_bnr .price {
    left: 50%;
    width: 100%;
    font-size: 45px;
    padding: 0 0 0.5em 0;
    position: absolute;
    top: 23vw;
    translate: -54% 0;
  }

  .under .merchandise_bnr .lead {
    font-size: 12px;
    margin-bottom: 0;
    position: absolute;
    top: 30vw;
  }

  .under .merchandise_bnr .price .tax {
    font-size: 18px;
  }

  .under .bnr_buy a {
    padding: 15px 10vw;
    font-size: 18px;
    min-width: 260px;
  }

  .under .bnr_buy a span.icon_tooth,
  .under .bnr_buy a span.icon_smile,
  .under .bnr_buy a span {
    background-size: 38px;
    text-align: center;
    line-height: 1.4;
    padding: 0 0 0 45px;
  }

  .under .list-bf-at {
    margin-bottom: 4vw;
  }

  .under .list-bf-at li {
    padding: 10px;
  }

  .under .list-bf-at li span {
    font-size: 18px;
    top: -10px;
  }

  .under .frame06,
  .under .frame05 {
    padding: 20px;
  }

  .under .frame .title {
    font-size: 20px;
  }

  .under .frame.frame05 .d-flex-under .item {
    width: 100%;
  }

  .under .frame.frame05 .d-flex-under .item:not(:last-child) {
    margin-bottom: 1.5em;
  }

  .under .frame.frame06 .d-flex-under .item .thumb {
    max-width: 100%;
    margin-bottom: 1em;
  }

  .under .frame.frame06 .d-flex-under .item .text {
    width: 100%;
    padding-left: 0;
  }

  .under .frame.frame06 .d-flex-under .item .text p {
    font-size: 100%;
  }

  /*-- /page merchandise --------------------
    ------------------------------------------*/

  /*-- /page food-enterprise --------------------
    ------------------------------------------*/
  .btn_anchor a {
    min-width: unset;
    padding: 4px 10px;
  }

  /*-- archive list -------------------------
    ------------------------------------------*/
  .under main .archive_content {
    padding: 30px 4vw;
  }

  .under main .archive_list {
    grid-template-columns: repeat(1, 1fr);
    max-width: 320px;
    margin: 0 auto;
  }

  .under main .archive_list .item_ttl {
    font-size: 16px;
    height: 80px;
  }

  .under main .post_content img {
    max-height: 300px;
    width: auto;
    height: auto;
    margin: 0 auto 30px;
    display: block;
    text-align: center;
  }

  .d-flex-under.align-items-c.flexChange {
    flex-direction: column;
  }

  .d-flex-under.align-items-c.flexChange .txt {
    display: contents;
  }

  .d-flex-under.align-items-c.flexChange .image {
    order: 2;
  }

  .d-flex-under.align-items-c.flexChange .txt h5 {
    order: 1;
  }

  .d-flex-under.align-items-c.flexChange .txt p {
    order: 3;
    padding-top: 1em;
  }

  /*-- /archive list ------------------------
    ------------------------------------------*/

  /*-- single list --------------------------
    ------------------------------------------*/
  .under main .main_content_single .h1_single {
    font-size: 22px;
    padding: 4vw 4vw;
    margin-bottom: 30px;
  }

  .under main .main_content_single>.inner {
    padding: 0 4vw;
  }

  .under main .main_content_single .btn a {
    width: 240px;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
  }

  /*-- /single list -------------------------
    ------------------------------------------*/

  .under main .form_box_gray {
    padding: 15px 15px;
  }

  .under main .form_box_gray dl {
    flex-direction: column;
    align-items: flex-start;
  }

  .under main .form_ttl01,
  .under main .form_ttl_list {
    font-size: 16px;
  }

  .under main .form_box_gray dd {
    margin-left: 0;
    margin-top: 20px;
    padding: 0;
    width: 100%;
  }

  .under main .form_box_gray dd>p {
    width: 100%;
    padding: 0;
  }

  .under main .form_box_gray dd>p .wpcf7-form-control-wrap {
    width: calc(100% - 59px);
  }

  .under main .form_box_gray .input_label {
    margin-bottom: 6px;
  }

  .under h2.h2-title.cus {
    font-size: 20px;
  }

  .under h3.cl-green {
    font-size: 18px;
  }

  .under main .input_number {
    width: 100%;
    font-size: 16px;
    height: 40px;
  }

  .under main .order_frame_list {
    flex-direction: column;
    gap: 70px;
  }

  .under main .order_frame_item {
    width: 100%;
  }

  .under main .order_frame_item .item_num {
    font-size: 60px;
    margin-bottom: 10px;
    margin-top: -40px;
  }

  .item_img img {
    max-width: 120px;
  }

  .under main .order_frame_item:not(:last-child)::after {
    border-width: 12px 12px 12px 12px;
    border-color: #c2c2c2 transparent transparent transparent;
    position: absolute;
    left: calc(50% - 12px);
    bottom: -42px;
    top: unset;
    right: unset;
  }

  .under .content_list_in {
    margin-top: 60px;
    flex-direction: column;
    gap: 74px;
  }

  .under .item_list_in .item_ttl .txt a {
    padding: 20px 40px;
  }

  .under main .form_main_white {
    padding: 15px 15px 20px;
  }

  .under main .form_main_white dl {
    flex-direction: column;
    padding: 15px 0;
  }

  .under main .form_main_white dt {
    width: 100% !important;
    margin: 0 0 10px;
  }

  .under main .form_main_white dt p {
    font-size: 18px;
    width: 100%;
    margin-right: 0;
    margin-bottom: 5px;
  }

  .under main .form_main_white dt .must {
    font-size: 12px;
    width: 38px;
    height: 20px;
  }

  .under main .form_main_white dt .fmust {
    font-size: 12px;
    width: 38px;
    height: 20px;
  }

  .under main .form_main_white dd {
    width: 100% !important;
    margin-bottom: 5px;
  }

  .under main .input_main {
    font-size: 16px;
    height: 40px;
    width: 100%;
  }

  .under main .form_main_white dd p {
    margin-bottom: 10px;
  }

  .under main .form_main_white .client-type {
    flex-direction: column;
    gap: 16px;
  }

  .under main .form_main_white .client-type>span {
    margin-left: 0;
  }

  .flex_box {
    flex-direction: column;
  }

  .flex_box .box_item {
    padding: 15px;
    width: 100%;
  }

  .mod_lr.style1 p {
    font-size: 4vw;
  }

  .flex_mod.mod_r {
    flex-direction: column;
    flex-flow: column-reverse;
    gap: 0;
  }

  .flex_mod.mod_r .content_l {
    width: 100%;
  }

  .flex_mod.mod_r .content_r {
    width: 100%;
  }

  .flex_img_r {
    flex-direction: column;
    gap: 0;
  }

  .flex_img_r.fixw .ct_left {
    width: 100%;
  }

  .flex_img_r .ct_left {
    width: 100%;
  }

  .flex_img_r.fixw .ct_right {
    width: 100%;
    margin-top: 20px;
  }

  .flex_img_r .ct_right {
    width: 100%;
    margin-top: 20px;
  }

  .flex_spa {
    flex-direction: column;
    gap: 0;
  }

  .flex_spa .ct_left {
    width: 100%;
  }

  .flex_spa .ct_right {
    width: 100%;
  }

  .title_green {
    font-size: 22px;
  }

  .box_col_3 {
    gap: 0;
    flex-direction: column;
  }

  .box_col_3 .item_box {
    width: 100%;
  }

  .online_order {
    margin-top: 60px;
    padding: 50px 0 37px 0;
  }

  .onl_order {
    font-size: 9vw;
    top: -29px;
  }

  .lg_size {
    font-size: 5vw;
  }

  .btn_order a {
    width: 290px;
  }

  .btn_order a::before {
    left: 43px;
  }

  .ec_site_title {
    font-size: 12vw;
    margin-bottom: 10px !important;
  }

  .flex_col_4 {
    flex-direction: column;
  }

  .flex_col_4 .item {
    width: 100%;
    margin-bottom: 15px !important;
  }

  .flex_img_l {
    flex-flow: column-reverse;
  }

  .flex_img_l .ct_left {
    width: 100%;
  }

  .flex_img_l .ct_right {
    width: 100%;
  }

  .box_center_item {
    flex-direction: column;
  }

  .box_center_item .box_l {
    width: 100%;
  }

  .box_center_item .box_r {
    width: 100%;
  }

  .title_lgf {
    font-size: 6vw;
    margin-bottom: 15px !important;
    text-align: center;
  }

  .title_lgf br.sp {
    display: block;
  }

  .img_baner img {
    max-width: 100%;
    margin: 0 auto;
  }

  .box_lightbox {
    gap: 10px;
    margin-top: 10px;
    padding: 0 20px;
    flex-direction: column;
  }

  .box_lightbox .slick-prev,
  .box_lightbox .slick-next {
    width: 15px;
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    background: #67c9bf;
  }

  .box_lightbox .slick-prev {
    left: -5px;
    transform: scale(-1, 1);
  }

  .box_lightbox .slick-next {
    right: -5px;
  }

  .box_lightbox .slick-prev::before,
  .box_lightbox .slick-next::before {
    display: none;
  }

  .uContact-step .title {
    padding: 0 10px;
    font-size: 12px;
  }

  body .uContact-step li::after {
    left: -2px;
  }

  .uContact-step li {
    margin-right: -75px;
  }

  .uContact-step li:nth-child(2) {
    margin-left: 45px;
  }

  .uContact-step li:nth-child(3) {
    margin-left: 45px;
  }

  .uContact-step li:nth-child(2) .title {
    padding: 0 0 0 30px;
  }

  .uContact-step li:nth-child(3) .title {
    padding: 0 0 0 20px;
  }

  .size_24 {
    font-size: 22px;
  }

  .zoom_images_box {
    flex-direction: column;
    gap: 8px;
  }

  .zoom_images_box img {
    width: 100%;
  }
}