@charset "UTF-8";

/* --- 共通設定 --- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}


body {
  margin: 0;
}

h1, h2, h3, p, a, span, th, td {
  font-family: "Kiwi Maru", serif;
}

li {
  list-style: none;
}

a {
  color: #000;
  text-decoration: none;
}

a:hover {
  opacity: .8;
}

/* --- コンテナ設定 --- */
.w-container {
  width: 96%;
  margin-left: 2%;
  margin-right: 2%;
}

img {
  max-width: 100%;
  height: auto;
  border-style: none;
}

/* 消してる要素 */
.sp-header, .sp-br, .fixed-footer-menu, .p1-f-img2 {
  display: none;
}

/* ヘッダー */
#header {
  width: 100%;
  height: min(8.71vw, 122px);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background-color: #fff;
}

.header-container {
  width: 100%;
  height: 100%;
  padding: 0 min(2.29vw, 32px);
}

.header-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

.header-logo {
  width: min(14vw, 196px);
  height: auto;
}

.header-logo img {
  width: 100%;
  height: auto;
}

.header-nav {
  display: flex;
  align-items: center;
  gap: min(2.14vw, 30px);
}

.header-nav ul {
  display: flex;
  align-items: center;
  gap: min(2.14vw, 30px);
}

.header-nav ul li a {
  font-size: clamp(14px, 1.43vw, 20px);
  position: relative;
}

.header-nav ul li a::after {
  content: "";
  position: absolute;
  bottom: min(-0.71vw, -10px);
  left: 50%;
  transform: translateX(-50%);
  width: min(0.36vw, 5px);
  height: min(0.36vw, 5px);
  background-color: #B44C97;
  border-radius: 50%;
  opacity: 0;
  transition: opacity 0.3s;
}

.header-nav ul li a:hover::after {
  opacity: 1;
}

.header-tel a {
  display: inline-block;
  font-size: clamp(16px, 2.29vw, 32px);
  font-weight: bold;
  color: #fff;
  font-family: "Zen Maru Gothic", sans-serif;
  background-color: #000;
  padding: min(0.86vw, 12px) min(1.57vw, 22px) min(0.86vw, 12px) min(3vw, 42px);
  position: relative;
  text-decoration: none;
  white-space: nowrap;
}

.header-tel a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: min(0.71vw, 10px);
  transform: translateY(-50%);
  width: min(1.71vw, 24px);
  height: min(1.71vw, 24px);
  background-image: url("../image/tel.png");
  background-size: contain;
  background-repeat: no-repeat;
}


/* トップ */
.main-v {
  position: relative;
  width: 100%;
  height: min(100vh, 71.4vw);
}

.main-v-slider {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.slide-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}

.slide1 { background-image: url("../image/top-img1.png"); }
.slide2 { background-image: url("../image/top-img2.png"); }
.slide3 { background-image: url("../image/top-img3.png"); }

.slide-img.is-active {
  opacity: 1;
}

.deco-img {
  position: absolute;
  z-index: 5;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* 1400px基準で可変：最大値を超えないように設定 */
.deco-right {
  right: min(13.57vw, 190px);
  bottom: min(1.79vw, 25px);
  width: min(6.64vw, 93px);
  height: min(6.64vw, 93px);
  background-image: url("../image/back6.png");
}

.deco-left {
  left: min(15.71vw, 220px);
  bottom: min(-2.57vw, -36px);
  width: min(8.36vw, 117px);
  height: min(8.36vw, 117px);
  background-image: url("../image/back7.png");
}

.main-v-container {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.main-v-title {
  position: relative;
}

/* 共通設定 */
.main-v-title::before,
.main-v-title::after,
.deco-top {
  content: "";
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 3;
}

/* ① 左上 (before) */
.main-v-title::before {
  background-image: url("../image/back13.png");
  width: min(3.57vw, 50px);
  height: min(3vw, 42px);
  top: min(-1.07vw, -15px);
  left: min(3.57vw, 50px);
}

/* ② 真上 (deco-top) */
.deco-top {
  background-image: url("../image/back14.png");
  width: min(10vw, 140px);
  height: min(3.93vw, 55px);
  top: min(-2.86vw, -40px);
  left: 50%;
  transform: translateX(-50%);
}

/* ③ 右上 (after) */
.main-v-title::after {
  background-image: url("../image/back15.png");
  width: min(3.57vw, 50px);
  height: min(3vw, 42px);
  top: min(-1.07vw, -15px);
  right: min(5vw, 70px);
}

.main-v-title h1 {
  color: #fff;
  text-align: center;
  line-height: 1.6;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.9));
  /* 1400pxで40px、それ以下は画面幅に合わせて縮小 */
  font-size: clamp(24px, 2.86vw, 40px);
  margin: 0;
}

.main-v-title h1 span {
  /* 1400pxで64px、それ以下は画面幅に合わせて縮小 */
  font-size: clamp(36px, 4.57vw, 64px);
  font-weight: 400;
}

.p1-a {
  margin-top: min(6.55vw, 72px);
}

.p1-a-container {
  width: min(88.91vw, 978px);
  margin: 0 auto;
}

.p1-a-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.p1-a-text {
  width: min(45.82vw, 504px);
  margin-top: min(3.91vw, 43px);
}

.p1-a-text p {
  font-size: clamp(10px, 1.45vw, 16px);
  line-height: 1.8;
  letter-spacing: 1px;
}

.p1-a-img {
  width: min(38.64vw, 425px);
  height: auto;
}

.p1-a-img img {
  width: 100%;
  height: auto;
  display: block;
}

.p1-b {
  background-image: url(../image/back2.png), url(../image/back3.png);
  background-repeat: no-repeat, no-repeat;
  background-size: min(10.83vw, 130px) min(16.42vw, 197px), min(10.83vw, 130px) min(16.67vw, 200px);
  background-position: right top min(10.25vw, 123px), left bottom;
  margin-top: min(8.33vw, 100px);
}

.p1-b-item {
  display: flex;
  justify-content: center;
  gap: min(3.33vw, 40px);
  margin-top: min(4.17vw, 50px);
}

.p1-b-text {
  width: min(40vw, 480px);
}

.p1-b-text h3 {
  font-size: clamp(18px, 2vw, 24px);
  color: #B44C97;
  background-image: url(../image/back8.png);
  background-repeat: no-repeat;
  background-size: 100% 5px;
  background-position: bottom;
  padding-bottom: min(1.25vw, 15px);
}

.p1-b-text h3 span {
  font-size: clamp(24px, 2.67vw, 32px);
  color: #B44C97;
}

.p1-b-text p {
  font-size: clamp(10px, 1.33vw, 16px);
  line-height: 1.8;
  letter-spacing: 1px;
  margin-top: min(1vw, 12px);
}

.p1-b-img {
  width: min(26.83vw, 322px);
  height: auto;
}

.p1-b-img img {
  width: 100%;
  height: auto;
  display: block;
}

.p1-b .p1-b-item2 {
  gap: min(0.83vw, 10px);
  margin-top: min(2.92vw, 35px);
}

.p1-b-item2 .p1-b-text {
  width: min(48.58vw, 583px);
  margin-top: min(1.5vw, 18px);
}

.p1-b-item2 .p1-b-img {
  width: min(23.08vw, 277px);
}

.p1-b .p1-link {
  padding-bottom: min(3.5vw, 35px);
  margin-top: min(3.5vw, 35px);
}

.p1-c {
  background-image: url(../image/back9.png);
  background-repeat: no-repeat;
  background-size: min(24.55vw, 270px) auto;
  background-position: right 8.75% bottom min(5.18vw, 57px);
  margin-top: min(5.45vw, 60px);
}

.p1-c-text {
  width: min(79.09vw, 870px);
  margin: min(3.64vw, 40px) auto min(10.91vw, 120px);
}

.p1-c-text p {
  font-size: clamp(10px, 1.45vw, 16px);
  line-height: 1.8;
  letter-spacing: 1px;
}

.p1-d {
  background-image: url(../image/back5.png), url(../image/back4.png);
  background-repeat: no-repeat, no-repeat;
  background-size: min(134px, 11.1vw) auto, min(148px, 12.3vw) auto;
  background-position: right bottom min(270px, 22.5vw), left bottom;
}

.p1-d-container {
  max-width: 872px;
  width: min(872px, 72.6vw);
  margin: min(80px, 6.6vw) auto 0;
  padding-bottom: min(110px, 9.1vw);
}

.p1-d-box {
  display: flex;
  flex-wrap: wrap;
  gap: min(8px, 0.6vw);
  padding-top: min(46px, 3.8vw);
}

.p1-d-img {
  width: min(212px, calc((100% - (min(8px, 0.6vw) * 3)) / 4));
}

.p1-d-img img {
  width: 100%;
  height: auto;
  display: block;
}

.p1-e {
  background-image: url(../image/back11.png), url(../image/back10.png);
  background-repeat: no-repeat, no-repeat;
  background-size: min(462px, 35.5vw) auto, 100% min(983px, 75.6vw);
  background-position: left min(90px, 6.9vw) bottom min(30px, 2.3vw), bottom;
}

.p1-e-container {
  max-width: 960px;
  width: min(960px, 73.8vw);
  padding-top: min(100px, 7.7vw);
  padding-bottom: min(40px, 3.1vw);
  margin: 0 auto;
}

.p1-e-text {
  width: min(840px, 100%);
}

.p1-e-text h2 {
  font-size: min(64px, 4.9vw);
  font-weight: 400;
  color: #FFCC00;
  letter-spacing: 2px;
}

.p1-e-text h3 {
  font-size: min(32px, 2.5vw);
  font-weight: 400;
}

.p1-e-text p {
  font-size: clamp(10px, 1.2vw, 16px);
  line-height: 2em;
  padding-top: min(40px, 3.1vw);
  padding-bottom: min(38px, 2.9vw);
}

.p1-e-img {
  display: flex;
  justify-content: space-between;
  gap: min(20px, 1.5vw);
}

.p1-e-img img {
  width: min(425px, 48%);
  height: auto;
}

.p1-f {
  background-image: url(../image/back2.png), url(../image/back3.png);
  background-repeat: no-repeat, no-repeat;
  background-size: min(10.83vw, 130px) min(16.42vw, 197px), min(10.83vw, 130px) min(16.67vw, 200px);
  background-position: right top min(10.25vw, 123px), left bottom min(107px, 8.9vw);
  margin-top: min(8.33vw, 100px);
}

.p1-f-container {
  max-width: 847px;
  width: min(847px, 70.6vw);
  padding-top: min(80px, 6.7vw);
  padding-bottom: min(56px, 4.7vw);
  margin: 0 auto;
}

.p1-f-box {
  display: flex;
  justify-content: space-between;
  padding-top: min(60px, 5vw);
  padding-bottom: min(36px, 3vw);
  gap: min(20px, 1.7vw);
}

.p1-f-table {
  width: min(372px, 44vw);
  margin-top: min(20px, 1.7vw);
}

.p1-f-table table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: min(26px, 2.2vw);
}

.p1-f-table table tr th,
.p1-f-table table tr td {
  font-size: clamp(10px, 1.3vw, 16px);
  font-weight: 400;
  padding-top: min(15px, 1.3vw);
  padding-bottom: min(15px, 1.3vw);
  border-bottom: 1px solid #EAEAEA;
}

.p1-f-table table tr th {
  width: 40%;
  text-align: left;
}

.p1-f-table table tr td {
  width: 60%;
  text-align: left;
}

.p1-f-text {
  text-align: center;
}

.p1-f-text p {
  font-size: clamp(10px, 1.3vw, 16px);
  padding-bottom: min(16px, 1.3vw);
}

.p1-f-img {
  width: min(432px, 51vw);
}

.p1-f-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* 農園概要 */
.p2-a-container {
  margin-top: min(66px, 4.71vw);
  margin-bottom: min(43px, 3.07vw);
}

.p2-a-item {
  display: flex;
  justify-content: center;
  gap: min(15px, 1.07vw);
}

.p2-a-text {
  width: min(845px, 60.36vw);
  padding-top: min(40px, 2.86vw);
}

.p2-a-text p {
  font-size: clamp(10px, 1.14vw, 16px);
  line-height: 2em;
}

.p2-a-img {
  width: min(425px, 30.36vw);
}

.p1-b.p2-b {
  margin-top: 0;
  margin-bottom: min(100px, 8.33vw);
}

.p2-b .p1-b-container {
  padding-bottom: min(100px, 8.33vw);
}

.p2-b .p1-b-text p {
  width: min(594px, 49.5vw);
}

/* 取り扱い品目 */
.p3-a {
  background-image: url(../image/back2.png), url(../image/back3.png), url(../image/back5.png), url(../image/back4.png);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  /* background-size: 130px auto, 128px auto, 116px auto, 166px auto; */
  background-size: min(130px, 10vw) auto, min(128px, 9.8vw) auto, min(116px, 8.9vw) auto, min(166px, 12.7vw) auto;
  /* background-position: right top 1150px, left bottom 1130px, right bottom 400px, left bottom 120px; */
  background-position: right top min(1150px, 88.4vw), left bottom min(1130px, 86.9vw), right bottom min(400px, 30.7vw), left bottom min(120px, 9.2vw);
}

.p3-a-container {
  max-width: min(874px, 67.2vw);
  padding-top: min(72px, 5.5vw);
  padding-bottom: min(120px, 9.2vw);
  margin: 0 auto;
}

.p3-a-title {
  text-align: center;
}

.p3-a-title p {
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 2em;
}

.p3-a-item {
  margin-top: min(40px, 3vw);
}

.p3-a-item h3 {
  text-align: center;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 400;
  color: #B44C97;
  background-image: url(../image/back12.png);
  background-repeat: no-repeat;
  background-size: 100% 5px;
  background-position: bottom;
  padding-bottom: min(17px, 1.3vw);
}

.p3-a-item p {
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 2em;
  padding-top: min(24px, 1.8vw);
  padding-bottom: min(24px, 1.8vw);
}

.p3-a-img {
  text-align: center;
}

.p3-a-img img {
  width: min(230px, 17.6vw);
  height: auto;
}

/* ギャラリー */
.p4-a-container {
  max-width: min(1280px, 91.4vw);
  padding-top: min(80px, 5.7vw);
  padding-bottom: min(120px, 8.5vw);
  margin: 0 auto;
}

.p4-a-box {
  display: flex;
  flex-wrap: wrap;
  gap: min(12px, 0.85vw); 
  justify-content: center;
}

.p4-a-img {
  width: min(311px, 22.2vw);
}

.p4-a-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 採用情報 */
.p5-a {
  background-image: url(../image/back2.png), url(../image/back3.png);
  background-repeat: no-repeat, no-repeat;
  /* サイズを可変に */
  background-size: min(130px, 10vw) auto, min(130px, 10vw) auto;
  /* 位置を可変に（968pxを基準に計算） */
  background-position: right top min(968px, 74.4vw), left bottom;
}

.p5-a-container {
  padding-top: min(90px, 6.9vw);
}

.p5-a-table {
  max-width: min(872px, 67vw);
  padding-top: min(40px, 3vw);
  margin: 0 auto;
}

.p5-a-table table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 min(15px, 1.1vw);
}

.p5-a-table table tr th, 
.p5-a-table table tr td {
  /* フォントサイズを20pxから16px程度まで可変 */
  font-size: clamp(12px, 1.5vw, 20px);
  padding-top: min(14px, 1vw);
  padding-bottom: min(14px, 1vw);
}

.p5-a-table table tr th {
  width: min(160px, 12.3vw);
  color: #fff;
  font-weight: 400;
  background-color: #B44C97;
}

.p5-a-table table tr td {
  padding-left: min(25px, 1.9vw);
} 

.p5-b-container {
  padding-top: min(66px, 5vw);
}

.p5-a-img-box {
  max-width: min(872px, 67vw);
  padding-top: min(56px, 4.3vw);
  margin: 0 auto;
}

.p5-a-img-box h3 {
  text-align: center;
  font-size: clamp(18px, 1.8vw, 24px);
  color: #B44C97;
  background-image: url(../image/back12.png);
  background-repeat: no-repeat;
  background-size: 100% 5px;
  background-position: bottom;
  padding-bottom: min(24px, 1.8vw);
}

.p5-a-img {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: min(6px, 0.4vw);
  padding-top: min(40px, 3vw);
}

.p5-a-img img {
  width: min(189px, 14.5vw);
  height: auto;
}

.p5-a-img .p5-part {
  width: min(30px, 2.3vw);
  height: auto; /* 比率維持のためautoに変更 */
  align-self: center; 
  /* ずらし具合も可変に */
  transform: translateY(min(15px, 1.1vw));
}

.p5-a.p5-c {
  background-image: url(../image/back2.png);
  background-repeat: no-repeat, no-repeat;
  background-size: min(130px, 10vw) auto;
  background-position: right top min(968px, 74.4vw);
}

.p5-b.p5-d {
  background-image: url(../image/back3.png);
  background-repeat: no-repeat;
  background-size: min(128px, 9.8vw) auto;
  background-position: left top min(57px, 4.3vw);
  padding-bottom: min(100px, 7.6vw);
}

/* アクセス */
.p6-a-container {
  padding-top: min(66px, 5vw);
  padding-bottom: min(120px, 9.2vw);
}

.p6-table {
  max-width: min(1076px, 82.7vw);
  display: flex;
  justify-content: space-between;
  padding-top: min(50px, 3.8vw);
  margin: 0 auto;
}

.p6-table table {
  width: min(470px, 36.1vw);
  border-collapse: separate;
  border-spacing: 0 min(15px, 1.1vw);
}

.p6-table table tr th, 
.p6-table table tr td {
  font-size: clamp(12px, 1.5vw, 20px);
  font-weight: 400;
  padding-top: min(15px, 1.1vw);
  padding-bottom: min(15px, 1.1vw);
}

.p6-table table tr th {
  width: min(160px, 12.3vw);
  color: #fff;
  background-color: #B44C97;
}

.p6-table table tr td {
  padding-left: min(25px, 1.9vw);
}

.p6-a-img img {
  width: min(556px, 42.7vw);
  height: auto;
}




/* 共通 */
.h2-title {
  text-align: center;
  background-image: url(../image/back1.png);
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: center center;
  padding: min(7.27vw, 80px) 0 min(8.82vw, 97px);
}

.h2-title p {
  font-size: clamp(10px, 1.45vw, 16px);
  color: #9F1343;
}

.h2-title h2 {
  font-size: clamp(20px, 2.91vw, 32px);
  color: #9F1343;
}

.p1-link {
  text-align: center;
}

.p1-link a {
  display: inline-block;
  font-size: clamp(10px, 1.6vw, 16px);
  color: #fff;
  background-color: #000;
  padding: min(1.2vw, 15px) min(6vw, 60px);
  text-decoration: none;
  transition: opacity 0.3s;
}

/* 下層共通 */
.sub-v {
  width: 100%;
  height: min(525px, 37.5vw);
  background-image: url(../image/sub-back.png);
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: min(122px, 8.7vw);
  box-sizing: border-box;
}

.sub-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.sub-title h1 {
  font-size: clamp(20px, 2.8vw, 40px);
  color: #fff;
  text-align: center;
  font-weight: 400;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.9));
}

.sub .h2-title {
  background-image: url(../image/back6.png), url(../image/back7.png), url(../image/back1.png);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-size: min(93px, 7.75vw) auto, min(117px, 9.75vw) auto, auto 100%;
  background-position: right min(190px, 15.8vw) top, left min(215px, 17.9vw) top min(15px, 1.25vw), center center;
}


/* フッター */
footer {
  background-color: #FDF8EE;
}

.footer-map iframe {
  width: 100%;
  height: min(477px, 43.3vw);
}

.footer-nav {
  padding: min(45px, 4.1vw) 0;
}

.footer-item {
  text-align: center;
}

.footer-logo {
  padding-bottom: min(30px, 2.7vw);
}

.footer-logo img {
  width: min(194px, 17.6vw);
  height: auto;
}

.footer-nav ul {
  display: flex;
  justify-content: center;
  gap: min(30px, 2.7vw);
  padding-top: min(30px, 2.7vw);
}

.footer-nav ul li a {
  font-size: clamp(10px, 1.8vw, 20px);
}

.copy-right {
  text-align: center;
  background-color: #fff;
  padding-top: min(22px, 2vw);
  padding-bottom: min(22px, 2vw);
}

.copy-right p {
  font-size: clamp(10px, 1.4vw, 16px);
}

.top-botan {
  position: fixed;
  bottom: min(88px, 8vw);
  right: min(97px, 8.8vw);
  width: min(65px, 5.9vw);
  height: min(65px, 5.9vw);
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s, visibility 0.5s;
}

.top-botan.is-show {
  opacity: 1;
  visibility: visible;
}

.top-botan a,
.top-botan img {
  display: block;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 767px) {
  /* 全体 */
  #header, .pc-br {
    display: none;
  }

  .sp-br {
    display: block;
  }

  /* ヘッダー */
 .sp-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 104px;
    background-color: transparent;
    z-index: 9999;
    display: block; /* スマホでは表示 */
  }

  .sp-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding-right: 20px;
  }

  .sp-header-logo {
    background-color: #fff;
  }

  .sp-header-logo a {
    display: inline-block;
    padding: 10px 16px 13px;
  }

  .sp-header-logo img {
    height: 80px;
    width: auto;
  }

  /* ハンバーガーボタン */
  .sp-menu-btn {
    position: relative;
    width: 54px;
    height: 54px;
    background-color: #B44C97;
    border: none;
    z-index: 1000;
  }

  .sp-menu-btn span {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 18px;
    height: 3px;
    background-color: #fff;
    transition: 0.3s;
  }

  .sp-menu-btn span:nth-child(1) { top: 14px; }
  .sp-menu-btn span:nth-child(2) { top: 20px; }
  .sp-menu-btn span:nth-child(3) { top: 26px; }

  /* ×印に変形（20pxの位置で交差） */
  .sp-menu-btn.is-active span:nth-child(1) { 
    transform: translate(-50%, 6px) rotate(45deg); 
  }
  .sp-menu-btn.is-active span:nth-child(2) { 
    opacity: 0; 
  }
  .sp-menu-btn.is-active span:nth-child(3) { 
    transform: translate(-50%, -6px) rotate(-45deg); 
  }

  .sp-menu-btn::after {
    content: "Menu";
    position: absolute;
    top: 35px; /* 26px + 6px */
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
  }

  /* 全画面メニュー */
  .sp-header-nav {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    transition: 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
  }

  .sp-header-nav.is-active {
    right: 0;
  }

  .sp-nav-list {
    list-style: none;
    text-align: center;
  }

  .sp-nav-list li { margin: 25px 0; }
  .sp-nav-list li a {
    color: #000;
    text-decoration: none;
    font-size: 1.2rem;
  }

  /* トップ */
  .main-v {
    height: 662px;
  }

  .deco-right {
    right: 52px;
    bottom: 9px;
    width: 64px;
    height: 64px;
  }

  .deco-left {
    left: 20px;
    bottom: -30px;
    width: 81px;
    height: 81px;
  }

  /* ① 左上 (before) */
  .main-v-title::before {
    width: 50px;
    height: 42px;
    top: -20px;
    left: -40px;
  }

  /* ② 真上 (deco-top) */
  .deco-top {
    width: 140px;
    height: 55px;
    top: -100px;
  }

  /* ③ 右上 (after) */
  .main-v-title::after {
    width: 50px;
    height: 42px;
    top: -20px;
    right: -10px;
  }

  .main-v-title h1 {
    font-size: 24px;
  }

  .main-v-title h1 span {
    font-size: 36px;
  }

  .p1-a {
    margin-top: 97px;
  }

  .p1-a-container {
    width: 92%;
    margin: 0 auto;
  }

  .p1-a-item {
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }

  .p1-a-text {
    width: 100%;
    margin-top: 24px;
  }

  .p1-a-text p {
    font-size: 15px;
  }

  .p1-a-img {
    width: 287px;
  }

  .p1-b {
    background-image: url(../image/back2.png), url(../image/back3.png);
    background-repeat: no-repeat, no-repeat;
    background-size: 51px auto, 41px auto;
    background-position: right top, left bottom 280px;
    margin-top: 38px;
  }

  .p1-b-item {
    width: 92%;
    flex-direction: column-reverse;
    align-items: center;
    gap: 40px;
    margin: 24px auto 0;
  }

  .p1-b-text {
    width: 100%;
  }

  .p1-b-text h3 {
    font-size: 16px;
    padding-bottom: 15px;
  }

  .p1-b-text h3 span {
    font-size: 24px;
  }

  .p1-b-text p {
    font-size: 15px;
    margin-top: 12px;
  }

  .p1-b-img {
    width: 258px;
  }

  .p1-b .p1-b-item2 {
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
  }

  .p1-b-item2 .p1-b-text {
    width: 100%;
    margin-top: 0;
  }

  .p1-b-item2 .p1-b-img {
    width: 222px;
  }

  .p1-b .p1-link {
    padding-bottom: 0;
    margin-top: 40px;
  }

  .p1-c {
    width: 92%;
    background-image: url(../image/back9.png);
    background-repeat: no-repeat;
    background-size: 159px auto;
    background-position: right 0 bottom 52px;
    margin: 50px auto 0;
  }

  .p1-c-text {
    width: 100%;
    margin: 24px 0 40px;
  }

  .p1-c-text p {
    font-size: 15px;
  }

  .p1-d {
    background-size: 30px auto, 40px auto;
    background-position: right top 20px, left bottom;
  }

  .p1-d-container {
    width: 92%;
    margin: 40px auto 0;
    padding-bottom: 60px;
  }

  .p1-d-box {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 20px;
  }

  .p1-d-img {
    width: calc((100% - 16px) / 3);
  }

  .p1-d-img img {
    width: 100%;
    height: auto;
    display: block;
  }
  
  .p1-e {
    background-image: url(../image/back11.png), url(../image/sp-back4.png);
    background-repeat: no-repeat, no-repeat;
    background-size: 230px auto, 100% auto;
    background-position: left 12px bottom 33px, center top;
  }

  .p1-e-container {
    max-width: 92%;
    width: 100%;
    padding-top: 60px;
    padding-bottom: 70px;
    margin: 0 auto;
  }

  .p1-e-text {
    width: 100%;
  }

  .p1-e-text h2 {
    text-align: center;
    font-size: 36px;
  }

  .p1-e-text h3 {
    text-align: center;
    font-size: 20px;
  }

  .p1-e-text p {
    font-size: 15px;
    padding-top: 24px;
    padding-bottom: 35px;
  }

  .p1-e-img {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .p1-e-img img {
    width: 266px;
  }

  .p1-f {
    background-image: url(../image/back2.png), url(../image/back3.png);
    background-repeat: no-repeat, no-repeat;
    background-size: 53px auto, 41px auto;
    background-position: right top, left bottom 70px;
    margin-top: 48px;
  }

  .p1-f-container {
    max-width: 92%;
    width: 100%;
    padding-top: 0;
    padding-bottom: 54px;
  }

  .p1-f-box {
    flex-direction: column;
    padding-top: 24px;
    padding-bottom: 24px;
    gap: 24px;
  }

  .p1-f-table {
    width: 100%;
    margin-top: 0;
  }

  .p1-f-table table {
    margin-bottom: 0;
  }

  .p1-f-table table tr th,
  .p1-f-table table tr td {
    font-size: 16px;
    padding-top: 20px;
    padding-bottom: 15px;
  }

  .p1-f-table table tr th {
    width: 30%;
  }

  .p1-f-table table tr td {
    width: 70%;
  }

  .p1-f-text {
    text-align: center;
    margin-top: 40px;
  }

  .p1-f-text p {
    font-size: 16px;
    padding-bottom: 12px;
  }

  .p1-f-img {
    display: none;
  }

  .p1-f-img2 {
    display: block;
    margin-top: 24px;
  }

  .p1-f-img img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* 農園概要 */
  .p2-a-container {
    margin-top: 50px;
    margin-bottom: 40px;
  }

  .p2-a-item {
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .p2-a-text {
    width: 92%;
    padding-top: 24px;
    margin: 0 auto;
  }

  .p2-a-text p {
    font-size: 15px;
  }

  .p2-a-img {
    width: 287px;
  }

  .p1-b.p2-b {
    margin-top: 0;
    margin-bottom: 50px;
  }

  .p2-b .p1-b-container {
    padding-bottom: 50px;
  }

  .p2-b .p1-b-text p {
    width: 100%;
  }

  /* 取り扱い品目 */
  .p3-a {
    background-image: url(../image/back2.png), url(../image/back3.png), url(../image/back5.png), url(../image/back4.png);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-size: min(130px, 10vw) auto, min(128px, 9.8vw) auto, min(116px, 8.9vw) auto, min(166px, 12.7vw) auto;
    background-position: right top min(1150px, 88.4vw), left bottom min(1130px, 86.9vw), right bottom min(400px, 30.7vw), left bottom min(120px, 9.2vw);
  }

  .p3-a-container {
    max-width: 92%;
    padding-top: 35px;
    padding-bottom: 60px;
    margin: 0 auto;
  }

  .p3-a-title p {
    font-size: 15px;
  }

  .p3-a-item {
    margin-top: 24px;
  }

  .p3-a-item h3 {
    font-size: 24px;
    background-image: url(../image/back12.png);
    background-size: 100% 5px;
    padding-bottom: 15px;
  }

  .p3-a-item p {
    font-size: 15px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .p3-a-img img {
    width: 230px;
    height: auto;
  }

  /* ギャラリー */
.p4-a-container {
    max-width: 92%;
    padding-top: 40px;
    padding-bottom: 60px;
    margin: 0 auto;
  }

  .p4-a-box {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-start;
  }

  .p4-a-img {
    width: calc((100% - 16px) / 3);
  }

  .p4-a-img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
  }

  /* 採用情報 */
  .p5-a {
    background-image: url(../image/back2.png), url(../image/back3.png);
    background-repeat: no-repeat, no-repeat;
    /* サイズを可変に */
    background-size: min(130px, 10vw) auto, min(130px, 10vw) auto;
    /* 位置を可変に（968pxを基準に計算） */
    background-position: right top min(968px, 74.4vw), left bottom;
  }

  .p5-a-container {
    padding-top: 45px;
  }

  .p5-a-table {
    max-width: 92%;
    padding-top: 24px;
    margin: 0 auto;
  }

  .p5-a-table table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
  }

  .p5-a-table table tr th, 
  .p5-a-table table tr td {
    font-size: 15px;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .p5-a-table table tr th {
    width: 100px;
  }

  .p5-a-table table tr td {
    padding-left: 15px;
  } 

  .p5-b-container {
    padding-top: 33px;
  }

  .p5-a-img-box {
    max-width: 92%;
    padding-top: 28px;
    margin: 0 auto;
  }

  .p5-a-img-box h3 {
    font-size: 24px;
    padding-bottom: 15px;
  }

  .p5-a-img {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
    justify-content: center;
  }

  .p5-a-img img {
    width: calc((100% - 10px) / 2);
    height: auto;
  }

  .p5-a-img .p5-part {
    display: none;
  }

  .p5-a.p5-c {
    background-image: url(../image/back2.png);
    background-repeat: no-repeat, no-repeat;
    background-size: min(130px, 10vw) auto;
    background-position: right top min(968px, 74.4vw);
  }

  .p5-b.p5-d {
    background-image: url(../image/back3.png);
    background-repeat: no-repeat;
    background-size: min(128px, 9.8vw) auto;
    background-position: left top min(57px, 4.3vw);
    padding-bottom: min(100px, 7.6vw);
  }

  /* アクセス */
  .p6-a-container {
    padding-top: 33px;
    padding-bottom: 60px;
  }

  .p6-table {
    max-width: 92%;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    padding-top: 25px;
    margin: 0 auto;
  }

  .p6-table table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
  }

  .p6-table table tr th, 
  .p6-table table tr td {
    font-size: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .p6-table table tr th {
    width: 100px;
  }

  .p6-table table tr td {
    padding-left: 15px;
  }

  .p6-a-img img {
    width: 100%;
    height: auto;
  }


  /* 共通 */
  .h2-title {
    padding: 46px 0 52px;
  }

  .h2-title p {
    font-size: 11px;
  }

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

  .p1-link a {
    font-size: 16px;
    padding: 15px 60px;
  }

  .header-tel a {
    width: 279px;
    height: 66px;
    font-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 auto;
  }

  .header-tel a::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 14px;
    width: 24px;
    height: 24px;
  }

  /* 下層共通 */
  .sub-v {
    width: 100%;
    height: 276px;
    padding-top: 64px;
    box-sizing: border-box;
  }

  .sub-container {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
  }

  .sub-title h1 {
    font-size: 36px;
  }

  .sub .h2-title {
    background-image: url(../image/back6.png), url(../image/back7.png), url(../image/back1.png);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: 64px auto, 81px auto, auto 100%;
    background-position: right 5% top, left 5% top 15px, center center;
  }

  /* フッター */
  footer {
    margin-bottom: 70px;
  }

  .footer-map iframe {
    height: 333px;
  }

  .footer-nav {
    padding: 40px 0 24px;
  }

  .footer-logo {
    padding-bottom: 24px;
  }

  .footer-logo img {
    width: 144px;
    height: auto;
  }

  .footer-nav ul {
    flex-wrap: wrap;
    gap: 40px;
    padding-top: 40px;
  }

  .footer-nav ul li a {
    font-size: 15px;
  }

  .copy-right {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .copy-right p {
    font-size: 13px;
  }

  .top-botan {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 40px;
    height: 40px;
  }

  /* 固定フッター */
  .fixed-footer-menu {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70px; /* お好みの高さ */
    display: flex;
    z-index: 999;
  }

  .footer-tel-btn {
    width: 50%;
    background-color: #000; /* 電話側は白 */
    font-size: 20px;
    font-weight: bold;
    font-family: "Zen Maru Gothic", sans-serif;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: bold;
  }

  .footer-tel-btn::before {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    background-image: url(../image/tel.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px;
  }

  .footer-menu {
    width: 50%;
    background-color: #B44C97; /* メニュー側はピンク */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .footer-menu p {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    font-family: "Zen Maru Gothic", sans-serif;
    margin: 0;
  }
}

@media screen and (max-width: 430px) {
  /* トップ */
  .slide1 { background-image: url("../image/sp-back1.png"); }
  .slide2 { background-image: url("../image/sp-back2.png"); }
  .slide3 { background-image: url("../image/sp-back3.png"); }


}