/* ========================================================
  こだわり
=========================================================*/
body {
  width: 100%;
  height: 100%;
}
.speciality {
  margin-top: clamp(24px, calc(121 / 1440 * 100vw), 121px);
}
.specialityContents {
  position: relative;
  background-color: var(--brand-color);
  padding-bottom: clamp(42px, calc(140 / 1440 * 100vw), 140px);
  margin-top: 11.5%;
}
.speciality_catch {
  width: 95%;
  max-width: 1777px;
  margin-top: -11.5%;
}
.speciality_head {
  display: flex;
  flex-direction: column;
  width: 89.6%;
  margin: 0 auto;
}
.speciality_title {
  font-size: clamp(16px, calc(32 / 1440 * 100vw), 32px);
  text-align: left;
}
.speciality_title.en {
  font-size: clamp(56px, calc(80 / 1440 * 100vw), 80px);
  line-height: calc(64 / 48);
  color: var(--brand-color);
}
.speciality_catchcopy {
  font-size: clamp(30px, calc(48 / 1440 * 100vw), 48px);
  line-height: calc(56 / 30);
  letter-spacing: calc(40 / 1000 * 1em);
  text-align: center;
  color: #fff100;
  margin-top: clamp(56px, calc(128 / 1440 * 100vw), 128px);
}
.speciality_catchcopy > * {
  border-bottom: 2px dashed #fff;
}
@media screen and (min-width: 768px) {
  .speciality_head {
    flex-direction: row-reverse;
    justify-content: center;
    align-items: baseline;
    -moz-column-gap: 1.25em;
    column-gap: 1.25em;
  }
  .speciality_catch {
    margin-top: -9.6%;
  }
}

/* ========================================================
  Section
=========================================================*/
.section {
  width: 89.6%;
  height: 100%;
  max-width: 1220px;
  margin: 0 auto;
  background-color: #feffee;
  padding-right: clamp(24px, calc(80 / 1440 * 100vw), 80px);
  padding-left: clamp(24px, calc(80 / 1440 * 100vw), 80px);
  padding-top: calc(11.5% - clamp(32px, calc(80 / 1440 * 100vw), 80px));
  padding-bottom: clamp(32px, calc(80 / 1440 * 100vw), 80px);
  margin-top: 82px;
}
.section_eyecatch {
  translate: 0 -20%;
  height: 100%;
}
.section_title {
  font-size: clamp(20px, calc(28 / 1440 * 100vw), 28px);
  color: var(--brand-color);
  text-align: center;
  line-height: calc(36 / 20);
  font-weight: bold;
}
.section_description {
  font-size: clamp(14px, calc(18 / 1440 * 100vw), 18px);
  line-height: calc(22.4 / 14);
  margin-top: clamp(12px, calc(24 / 1440 * 100vw), 24px);
  text-align: center;
}
.section_description .textBlock + .textBlock {
  margin-top: clamp(12px, calc(16 / 1440 * 100vw), 16px);
}
@media screen and (min-width: 768px) {
  .section {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    -moz-column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
    column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
    padding-top: clamp(32px, calc(80 / 1440 * 100vw), 80px);
    padding-left: 0;
    padding-right: 0;
  }
  .section_eyecatch {
    width: 50%;
    flex-shrink: 0;
    translate: 0;
  }
  .sectionInner {
    width: 50%;
    flex-shrink: 0;
  }
  .section_eyecatch_image {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
  .section_title {
    text-align: left;
  }
  .section_title br.block {
    display: none;
  }
  .section_description {
    text-align: left;
  }
}
@media screen and (min-width: 1200px) {
  /* .section {
    padding-right: 0;
    padding-left: 0;
  } */
  .sectionInner {
    width: 50%;
  }
  .section_eyecatch {
    width: calc(1220 / 2 / 1220 * 100%);
  }
  .section_description {
    line-height: calc(32.4 / 18);
  }
}

/* ========================================================
  3つのこだわり
=========================================================*/
.featureContents {
  width: 89.6%;
  max-width: 1220px;
  margin: 0 auto;
}
.feature_head {
  display: flex;
  justify-content: center;
  align-items: center;
}
.feature_head_logo {
  width: clamp(76px, calc(137 / 1440 * 100vw), 137px);
}
.feature_title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: clamp(30px, calc(56 / 1440 * 100vw), 56px);
  color: var(--brand-color);
  font-weight: bold;
  border-bottom: 2px dashed var(--brand-color);
  line-height: 1.1;
  position: relative;
}
.feature_title::before {
  display: grid;
  place-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  content: "feature";
  text-transform: uppercase;
  font-size: clamp(10px, calc(20 / 1440 * 100vw), 20px);
  background-color: #fff100;
  border-radius: 999px;
  padding: 0.2em 1em;
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -150%;
  font-family: "azo-mono", monospace;
  font-weight: 500;
  font-style: normal;
}
.number-outline {
  margin: 10px;
  font-size: clamp(70px, calc(130 / 1440 * 100vw), 130px);
  font-weight: bold;
  color: #fff;
  -webkit-text-stroke: 2px var(--brand-color);
  font-family: "azo-mono", monospace;
  font-weight: 500;
  font-style: normal;
}
.feature_list {
  counter-reset: number;
  display: flex;
  flex-direction: column;
  row-gap: clamp(80px, calc(90 / 1440 * 100vw), 90px);
  margin-top: clamp(36px, calc(116 / 1440 * 100vw), 116px);
}
.feature_item_headline {
  display: flex;
  align-items: flex-start;
  -moz-column-gap: 1em;
  column-gap: 1em;
  margin-top: clamp(24px, calc(32 / 1440 * 100vw), 32px);
}
.feature_item_number {
  counter-increment: number;
  content: counter(number);
  font-size: clamp(51px, calc(72 / 1440 * 100vw), 72px);
  font-weight: bold;
  color: #fff;
  -webkit-text-stroke: 2px var(--brand-color);
  border-bottom: 2px dashed var(--brand-color);
  font-family: "azo-mono", monospace;
  font-weight: 500;
  font-style: normal;
  line-height: 1.2;
}
.feature_item_title {
  font-size: clamp(20px, calc(28 / 1440 * 100vw), 28px);
  font-weight: bold;
  line-height: calc(50.4 / 28);
  letter-spacing: calc(40 / 1000 * 1em);
  color: var(--brand-color);
}
.feature_item_text {
  font-size: clamp(15px, calc(16 / 1440 * 100vw), 16px);
  margin-top: clamp(12px, calc(16 / 1440 * 100vw), 16px);
  line-height: calc(27 / 15);
}
@media screen and (min-width: 768px) {
  .feature_item {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    -moz-column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
    column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
  }
  .feature_item_eyecatch {
    width: 50%;
    flex-shrink: 0;
  }
  .feature_item_headline {
    margin-top: 0;
  }
}

/* ========================================================
  みさわのやさいの挑戦
=========================================================*/
.tryContents {
  width: 89.6%;
  max-width: 1500px;
  margin: 0 auto;
  margin-top: clamp(134px, calc(273 / 1440 * 100vw), 273px);
  border: 2px solid var(--brand-color);
  padding-bottom: clamp(32px, calc(134 / 1440 * 100vw), 134px);
}
.tryInner {
  width: 89.6%;
  max-width: 1220px;
  margin: 0 auto;
}

.try_logo {
  display: block;
  width: clamp(76px, calc(137 / 1440 * 100vw), 137px);
  margin: 0 auto;
  margin-top: -5%;
}
.try_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: clamp(8px, calc(25 / 1440 * 100vw), 25px);
}
.try_title {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: clamp(16px, calc(24 / 1440 * 100vw), 24px);
  line-height: 1.1;
}
.try_title.en {
  font-size: clamp(40px, calc(64 / 1440 * 100vw), 64px);
  color: var(--brand-color);
  font-family: "azo-mono", monospace;
  font-weight: 500;
  font-style: normal;
}

.try_list {
  display: flex;
  flex-direction: column;
  row-gap: 56px;
  margin-top: clamp(49px, calc(102 / 1440 * 100vw), 102px);
}
.try_item {
  position: relative;
}

.try_item_number {
  display: grid;
  place-content: center;
  background-color: #fff100;
  border-radius: 50%;
  width: clamp(64px, calc(80 / 1440 * 100vw), 80px);
  aspect-ratio: 1/1;
  font-size: clamp(25px, calc(32 / 1440 * 100vw), 32px);
  color: var(--brand-color);
  line-height: 1;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  translate: -50% -50%;
  font-family: "azo-mono", monospace;
  font-weight: 500;
  font-style: normal;
  letter-spacing: calc(20 / 1000 * 1em);
}
.try_item_number::before {
  content: "try";
  display: block;
  text-align: center;
  text-transform: uppercase;
  font-size: clamp(11px, calc(14 / 1440 * 100vw), 14px);
}
.try_item_title {
  font-size: clamp(20px, calc(28 / 1440 * 100vw), 28px);
  font-weight: bold;
  line-height: calc(50.4 / 28);
  letter-spacing: calc(40 / 1000 * 1em);
  color: var(--brand-color);
  margin-top: clamp(12px, calc(16 / 1440 * 100vw), 16px);
}
.try_item_text {
  font-size: clamp(15px, calc(16 / 1440 * 100vw), 16px);
  margin-top: clamp(12px, calc(16 / 1440 * 100vw), 16px);
  line-height: calc(27 / 15);
}

@media screen and (min-width: 768px) {
  .try_head {
    flex-direction: row;
    align-items: baseline;
  }
  .try_list {
    flex-direction: row;
    -moz-column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
    column-gap: clamp(32px, calc(80 / 1440 * 100vw), 80px);
  }
}