@charset "UTF-8";

@media screen and (max-width: 768px) {

  body {
  }

  .l-inner {
    padding: 0 15px 0 30px;
  }

  .l-inner2 {
    padding: 0 4px 0 4px;
  }

  .hamburger {
     top: 0;
     left: 0;
     height: 50px;
  }

  .l-header,
  .l-header2_main {
    margin-top: 15px;
/*
    position: relative;

    padding: 0 15px;
    z-index: 1000;
*/
  }

  .l-header #siteId,
  .l-header2 #siteId {
    width: 100%;
    margin-top: 0px;
    margin-left: 75px; 
  }

  .l-header #siteId img,
  .l-header2 #siteId img {
    max-width: 187px;
  }

.l-header2_sub .page_ttl .sub_ttl {
    display:block;
    margin-top: 10px;
  }

  #navi {
    width: 80%;
    height: 520px;
  }

  #navi .menu {
    width: 80%;
  }
  #navi .menu li {
    font-size: 22px;
    font-size: 1.375rem;
  }

  #navi .menu li:before {
    width:16px;
    margin:0 20px 16px 0;
    top:3px;
    left:0;
  }

  .l-header #grape img,
  .l-header2 #grape img {
    max-width: 25px;
  }

  .l-header2_sub {
    margin-top: 15px;
    text-align: center;
  }

  .l-footer #l-footer__lower {
    margin-top: 115px;
  }

  .l-footer .commone_logo img {
  }

  .l-footer .bc_logo img {
  }

  .c-copyright {
  }

  .l-section {
    padding: 40px 0;
  }
/*
  .c-label-category {
    padding: 2px 8px;
    font-size: 11px;
    font-size: 0.6875rem;
  }
*/
  main ul.tagList {
	width: 100%;
  }

  /* smartphone only */
  .pc {
    display: none !important;
  }

  .pc_inline {
    display: none !important;
  }

  .sp {
    display: block !important;
  }

  .sp_inline {
    display: inline !important;
  }


/* top */

  .mainvisual {
    max-width: 100%;
    width: 100%;
    margin-top: 0;
    padding: 0;
 /*   z-index: -1000; */
  }

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

  .top-news.l-section {
    padding: 90px 0 150px 0;
  }

  .top-news-list__body a::after {
    margin-right: 0;
  }

  .top-news-list__body a.top-news-list__link::after {
    margin-right: -1em;
  }

  .top-news-list__date {
   }

  .top-news-list__link {
   }

  .top-news-list__body > a, .top-news-list__body a.top-news-list__link {
    width: 100%;
  }

  .top-about__inner {
    padding: 0 15px 0 20px;
  }

  .top-about__upper {
    display: block;
    padding: 30px 15px 30px 17px;
  }

  .top-about__lower {
    display: block;
    padding: 30px;
  }

  .top-about-upper__text,
  .top-about-upper__img {
    margin-top: 40px;
  }

  .top-about-upper__img img {
    max-width: 104px;
  }

  .top-about-upper__text,
  .top-about-lower__text {
    width: 100%;
    margin-right: 0;
  }

  .top-about-upper__text {
    width: 95%;
  }

  .top-about-upper__text p {
  }

  .top-about-lower__text {
    max-width: 100%;
    margin-left: 0;
  }

  .top-about-lower__text p {
  }

  .top-about-upper__heading {
    margin-right: 0;
  }

  .top-about-upper__heading h3 {
  }

  #top-about__more,
  #top-about__more .flexBox {
    margin-top: 150px;
  }

  #top-about__more .flexBox {
    display: block;
    position: relative;
  }

  #top-about__more .flexBox ul {
    position: relative;
  }

  #top-about__more .flexBox .flexBoxImg {
    position: relative;
    transform: translate(90px, -70px);
    z-index: -1;
  }

  #top-about__more .flexBox .flexBoxImg {
    max-width: 80%;
  }

  .top-statement {
    margin-top: -170px;
  }

  .top-statement__body {
    display: block;
    position: relative;
    padding: 30px 15px;
  }

  .top-statement__text p {
  }

  .top-statement__text .tagList {
    margin-top: 25px;
  }

  main ul.tagList li {
    margin-right: 5px;
  }
  .top-statement__body .top-statement__img {
    position: absolute;
    top: 20px;
    right: -35px;
    right: 30px;
  }

  .top-statement__body .top-statement__img img {
    max-width: 100%;
  }

  .top-access.l-section {
    padding-top: 100px;
  }

  .top-access__inner.l-inner {
    padding: 0 0 0 30px;
  }


/* grapes */

  .grapes {
    padding: 175px 0 100px 0;
  }

  .lead.sp {
    padding: 150px 25px 0;
    font-size: 15px;
    font-size: 0.9375rem;
  }

  .brewing {
    padding: 198px 0 100px 0;
  }

  .grapes .l-inner,
  .flow .l-inner,
  .brewing .l-inner {
    padding: 0;
  }

  .grapes .flexBox + .flexBox {
    margin-top: 80px;
  }

  .grapes .grapes__heading,
  .grapes .flexBoxTxt,
  .grapes .spTxt,
  .flow .flow__heading,
  .flow .flexBoxTxt,
  .flow .other_work {
    padding: 0 30px;
  }

  .grapes__inner .flexBox,
  .page_ttl .l-inner:has(.sub_ttl),
  .flow__inner .flexBox,
  .brewing__inner > .flexBox {
    display: block;
  }

  .grapes .flexBoxImg,
  .grapes .flexBox:nth-child(1) .flexBoxImg,
  .grapes .flexBox:nth-child(2) .flexBoxImg,
  .grapes .flexBox:nth-child(3) .flexBoxImg,
  .grapes .flexBox:nth-child(4) .flexBoxImg,
  .grapes .flexBoxTxt,
  .flow .flexBoxImg,
  .flow .flexBoxTxt,
  .flow .flexBox::after,
  .brewing .flexBox .rouge,
  .brewing .flexBox .blanc {
    width: 100%;
  }

  .grapes .grapes__heading,
  .grapes .flexBoxImg {
    margin-right: 0;
  }

  .grapes .flexBox:nth-child(1) .flexBoxImg  {
    transform: translate(0px, -25px);
  }

  .grapes .flexBox:nth-child(2) .flexBoxImg  {
    transform: translate(0px, -20px);
  }

  .grapes .flexBox:nth-child(3) .flexBoxImg {
    transform: translate(0px, -40px);
  }

  .grapes .flexBox:nth-child(4) .flexBoxImg {
    transform: translate(0px, -80px);
  }

  .grapes  .sp .flexBoxImg {
    transform: translate(0px, -80px);
  }

  .grapes .flexBox:nth-child(1) .flexBoxImg img,
  .grapes .flexBox:nth-child(2) .flexBoxImg img,
  .grapes .flexBox:nth-child(3) .flexBoxImg img,
  .grapes .flexBox:nth-child(4) .flexBoxImg img {
    max-width: 100%;
  }

  .grapes .flexBox:nth-child(4) {
    display: none;
  }

  .grapes  .flexBox:nth-child(1) .flexBoxTxt {
    margin-top: -50px;
  }

  .grapes  .flexBox:nth-child(2) .flexBoxTxt {
    margin-top: -50px;
  }

  .grapes .sp {
    margin-top: 80px;
  }

  .page_ttl .main_ttl {
    margin-right: 0;
  }

  .page_ttl .l-inner2:has(.sub_ttl) {
    display: block;
  }

  .flow {
    padding: 40px 0 100px 0;
  }

  .flow .flexBox:nth-child(2),
   .flow .flexBox:nth-child(4),
  .flow .flexBox:nth-child(5),
  .flow .flexBox:nth-child(7) {
    margin: 40px 0 50px 0;
  }

  .flow .flexBox:nth-child(1) {
    margin: 0 0 50px 0;
  }

  .flow .flexBox::after {
    content: none;
  }

  .flow .flow__heading {
    margin-right: 0;
  }

  .flow .flexBoxImg {
    margin-right: 0;
  } 

  .flow .flexBox:nth-child(1) .flexBoxImg {
    transform: translate(0px, -30px);
  }

  .flow .flexBox:nth-child(2) .flexBoxImg {
    transform: translate(0px, -30px);
  }

  .flow .flexBox:nth-child(3) .flexBoxImg {
    transform: translate(0px, 30px);
  }

  .flow .flexBox:nth-child(4) .flexBoxImg {
    transform: translate(0px, 20px);
  }

  .flow .flexBox:nth-child(5) .flexBoxImg {
    transform: translate(0px, 20px);
  }

  .flow .flexBox:nth-child(6) .flexBoxImg,
  .flow .flexBox:nth-child(7) .flexBoxImg {
    transform: translate(0px, 0px);
  }

  .flow .flexBox:nth-child(1) .flexBoxTxt {
    margin-top: -60px;
  }

  .flow .flexBox:nth-child(2) .flexBoxTxt {
    margin-top: -30px;
  }

  .flow .flexBox:nth-child(3) .flexBoxTxt {
    margin-top: 30px;
  }

  .flow .flexBox:nth-child(4) .flexBoxTxt {
    margin-top: 40px;
  }

  .flow .flexBox:nth-child(5) .flexBoxTxt {
    margin-top: 30px;
  }

  .flow .flexBox:nth-child(6) .flexBoxTxt {
    margin-top: 20px;
  }

  .flow .flexBox:nth-child(7) .flexBoxTxt {
    margin-top: 30px;
  }

  .flow .flexBox:nth-child(2) .flexBoxImg img,
  .flow .flexBox:nth-child(3) .flexBoxImg img,
  .flow .flexBox:nth-child(4) .flexBoxImg img,
  .flow .flexBox:nth-child(5) .flexBoxImg img,
  .flow .flexBox:nth-child(7) .flexBoxImg img {
    max-width: 100%;
  }


  .flow .other_work {
    display: block;
    margin-top: 60px;
  }

  .flow .other_work p {
    margin-top: 24px;
  }

  .green08 .l-header2_sub h2 {
    font-size: 25px;
    font-size: 1.5625rem;
  }

  .brewing .flexBox .b-label-category {
    width: 400px;
    margin-left: 30px;
  }

  .brewing .flexBox .rouge {
    margin-right: 0;
  }

  .brewing .flexBox .blanc {
    margin-top: 150px;
  }

  .brewing .brewing__item {
    margin-top: 50px;
    padding: 0 30px;
  }

  .brewing .brewing__item:not(:last-child)::before {
    left: 64px;
    bottom: -25px;
  }

  .beverages.l-section {
    padding-top: 0px;
  }

  .beverages__inner.l-inner {
    padding: 15px 30px 0;
  }

  .beverages .card_list li {
    padding: 60px 72px;
  }

  #l-footer__footernav .footernav__inner.l-inner {
    padding: 0;
  }


  .green06 .l-footer,
  .green07 .l-footer,
  .green08 .l-footer {
    padding: 100px 0 60px 0;
  }

  .green06 .l-footer #l-footer__upper,
  .green06 .l-footer #l-footer__upper .footer__inner,
  .green07 .l-footer #l-footer__upper,
  .green07 .l-footer #l-footer__upper .footer__inner,
  .green08 .l-footer #l-footer__upper,
  .green08 .l-footer #l-footer__upper .footer__inner {
    text-align: center;
  }

  .green06 .l-footer #l-footer__upper .footer__inner,
  .green07 .l-footer #l-footer__upper .footer__inner,
  .green08 .l-footer #l-footer__upper .footer__inner {
    padding: 0;
  }

  .green06 .l-footer #l-footer__upper ul,
  .green07 .l-footer #l-footer__upper ul,
  .green08 .l-footer #l-footer__upper ul {
    margin-inline: auto;
  }


  .green06 .l-footer #l-footer__upper li a.btn_full_a,
  .green07 .l-footer #l-footer__upper li a.btn_full_a {
    min-width: 100%;
  }

  .green06 .l-footer #l-footer__upper li a.btn_full_a .a__icon,
  .green07 .l-footer #l-footer__upper li a.btn_full_a .a__icon,
  .green08 .l-footer #l-footer__upper li a.btn_full_a .a__icon {
    padding-right: 0.5rem;
  }

  .green06 .l-footer #l-footer__upper li a.btn_full_a .a__text,
  .green07 .l-footer #l-footer__upper li a.btn_full_a .a__text,
  .green08 .l-footer #l-footer__upper li a.btn_full_a .a__text {
    padding-right: 1.5rem;
  }

  .page_label.blog_news_list,
  .page_label.blog_news {
    padding-top: 112px;
  }

  .archive__inner {
     padding: 0 30px;
  }

  #grid,
  .grid-sizer,
  .grid-item {
      width: 100%;
      margin-bottom: 10px;
    }

  #grid li:nth-of-type(n+2) .masonry-content{
      padding-top: 30px;
    }

  .masonry-content {
      padding-bottom: 20px;
    }

  .masonry-content .title a {
      font-size: 20px;
    }

  .masonry-content .up_ymd {
      font-size: 10px;
    }

  .pager {
      margin-top: 60px;
    }

  .article.l-section {
    padding: 30px 0;
  }

  .article__content .up_ymd {
    margin-top: 4px;
  }
  .page_label.blog_news_list .c-label-category.green04,
  .page_label.blog_news .c-label-category,
  #l-footer__footernav.news-detail .c-label-category.green04 {
    padding: 3px 15px;
    font-size: 15px;
    letter-spacing: 0;
  }

  .page_label.blog_news_list .c-label-category.black.r28{

  }

  #l-footer__footernav.news-detail a.btn_blk_a {
    padding: 15px 30px;
  }

  .p-contact-form__body {
     padding: 30px;
    }

  .contact__inner {
     padding: 0 30px;
    }

  .c-form__radio {
     display: block;
    }

  .c-form__radio:not(:last-child) {
     margin-right: 0;
     margin-bottom: 5px;
    }
  .c-form__input, .c-form__select {
     width: 100%;
    }
  .c-form input[type=tel] {
     width: 100%;
    }
  .c-form__textarea {
     width: 100%;
     min-width: 100%;
    }

}