@charset "UTF-8";
/* -----------------------------------------------------------
　common
----------------------------------------------------------- */
@media screen and (min-width: 1081px) {
  .sp_cont_wide {
    display: none !important;
  }
}

@media screen and (min-width: 769px) {
  .sp_cont {
    display: none !important;
  }
}

@media screen and (max-width: 1080px) {
  .pc_cont_wide {
    display: none !important;
  }

  a {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .pc_cont {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  a.chevron-right::after {
    padding-bottom: 2px;
  }

  body {
    -webkit-text-size-adjust: 100%;
    font-size: 1.4rem;
  }

  select,
  input[type=text] {
    height: 45px;
    padding: 6px 16px;
  }

  select+span:not(:last-of-type),
  input[type=text]+span:not(:last-of-type) {
    margin: 0 10px 0 5px;
  }

  select+span:last-of-type,
  input[type=text]+span:last-of-type {
    margin: 0 0 0 5px;
  }
}

@media screen and (max-width: 768px) {
  .btn {
    width: 90%;
  }

  input[type=email]::-moz-placeholder,
  input[type=password]::-moz-placeholder,
  input[type=text]::-moz-placeholder {
    font-size: 1.3rem;
  }

  input[type=email]::placeholder,
  input[type=password]::placeholder,
  input[type=text]::placeholder {
    font-size: 1.3rem;
  }

  .symbol__email::before,
  .symbol__password::before {
    /* top: -0.1em; */
    left: 1em;
  }

  .checkbox {
    -moz-column-gap: 10px;
    column-gap: 10px;
    margin-right: 0;
  }
}

@media only screen and (max-width: 1080px) {
  .header__inner {
    justify-content: space-between;
    padding-inline: 22px 8px;
  }
}

@media only screen and (min-width: 1081px) {
  .header__menu.is-min-pc {
    display: flex;
  }

  .header__sns.is-min-pc {
    display: flex;
  }
}

@media only screen and (max-width: 1080px) {
  .header__inner {
    justify-content: space-between;
    padding-inline: 22px 8px;
  }

  .header__sp-menu.is-tab-pc {
    display: flex;
  }

  .header__headline {
    width: 96px;
  }
}

@media only screen and (max-width: 768px) {
  .header {
    padding-block: 12px 4px;
  }
}

@media only screen and (max-width: 768px) {
  .footer__inner {
    padding-inline: 20px;
  }
}

@media only screen and (max-width: 1080px) {
  .footer__bottom {
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding-top: 52px;
    padding-left: 0;
  }

  .footer__nav-list {
    width: 250px;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px 32px;
  }

  .footer__bottom-copyright {
    font-size: 12px;
    margin-top: 32px;
  }
}

@media screen and (max-width: 1080px) {
  .box {
    padding: 0 10px;
  }

  .box h1 {
    font-size: 2.4rem;
  }

  .contact_box {
    padding: 30px 20px 50px;
  }
}

@media screen and (max-width: 768px) {
  .box {
    padding: 0 20px;
  }

  .contact_box {
    padding: 30px 0px 50px;
  }

  dl {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, auto);
    grid-template-areas: "grid-dt" "grid-dd" "grid-div";
  }

  dl>dt {
    padding: 0;
    font-size: 1.6rem;
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 768px) {
  .search-type div {
    gap: 10px;
  }
}

@media screen and (max-width: 768px) and (hover: none) {
  .tooltip-text {
    bottom: 160%;
  }
}

@media screen and (max-width: 768px) {
  .leaflet-touch .leaflet-bar a {
    width: 42px;
    height: 42px;
    line-height: 42px;
  }

  .leaflet-touch .leaflet-control-fullscreen a {
    background-position: 2px 2px;
  }

  .leaflet-control-fullscreen a {
    background: var(--WH) url("/img/auth/sub/fullscreen-38px.svg") no-repeat 0 0;
  }

  .leaflet-touch.leaflet-fullscreen-on .leaflet-control-fullscreen a {
    background-position: 2px -36px;
  }

  .leaflet-control-locate a .leaflet-control-locate-location-arrow {
    width: 20px;
    height: 20px;
    margin: 11px;
  }

  input[name=location-name] {
    width: 100%;
  }

  select[name="trans[]"],
  select[name="startdate[]"] {
    padding: 6px;
  }

  select[name="trans[]"].year,
  select[name="startdate[]"].year {
    width: 23vmin;
  }

  select[name="trans[]"].month,
  select[name="trans[]"].date,
  select[name="startdate[]"].month,
  select[name="startdate[]"].date {
    width: 13vmin;
  }
}

@media screen and (max-width: 768px) {
  select[name=breed] {
    width: 100%;
  }

  .adjustment .prediction_type {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
    row-gap: 10px;
    grid-template-areas: "earemergence" "maturation";
  }

  .adjustment .prediction_type select[name^=prediction_choice] {
    width: 50vmin;
  }

  .adjustment .prediction_type select[name^=prediction_directly] {
    width: 70px;
  }

  .adjustment .prediction_type input[name^=prediction_directly] {
    width: 45vmin;
  }

  dd.posture {
    padding-top: 0;
  }

  label input[type=radio]+span {
    width: 24px;
    height: 24px;
  }

  label input[type=radio]:checked+span {
    box-shadow: inset 0 0 0 4px #FFFFFF;
  }

  .growth_type select,
  .growth_type input {
    width: calc(100% - 25px);
  }

  .api_result {
    flex-flow: column wrap;
    padding: 20px 14px;
  }

  .api_result div {
    width: 100%;
  }

  .api_result .triangle {
    width: 20px;
    height: 16px;
    background: var(--BL01);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    margin: 0 auto 10px;
  }

  .middry_anker {
    text-align: center;
    margin-top: 30px;
  }

  .cont-block {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(6, auto);
    row-gap: 10px;
    grid-template-areas: "middry-img" "middry-heading" "middry-calc-date" "middry-error" "middry-btn" "middry-result";
  }

  .cont-block .middry-calc-date {
    margin-inline: auto;
  }

  input[name=middry] {
    min-width: 200px;
  }

  .result-middry>p:first-of-type {
    font-size: 1.4rem;
  }

  .result-middry>p:last-of-type {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 768px) {
  input[name=crops] {
    width: 100%;
  }

  .arraival-date {
    font-size: 2rem;
    letter-spacing: 0.2em;
    margin: 10px auto;
  }

  input[name=limittemp],
  input[name=effectivetemp] {
    width: calc(100% - 30px);
  }
}

@media screen and (max-width: 768px) {
  .logo {
    max-width: 120px;
  }

  .contents {
    padding: 50px 15px;
  }

  .contents__wrapper,
  .contents__complete {
    padding: 2em 1em;
  }

  .contents h2 {
    font-size: 1.6rem;
  }

  .contents__img {
    margin-bottom: 30px;
  }

  .contents .annotation {
    font-size: 1.2rem;
  }
}

/*# sourceMappingURL=media.css.map */