@charset "UTF-8";
/*========== 子ページ ==========*/
#mv .inner,
#breadcrumb .inner {
  max-width: calc(1080px + var(--paddingLR) * 2);
}

/*==========
子ページ共通
==========*/
#mv {
  background: center/cover url("../img/child/child_mv.jpg") no-repeat;
  min-height: 140px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
#mv .title_main {
  font-size: 2.25rem;
  line-height: 1.25;
  font-weight: 500;
  color: #fff;
}
@media screen and (max-width: 959px) {
  #mv {
    min-height: 80px;
    background: center/cover url("../img/child/child_mv-sp.jpg") no-repeat;
  }
  #mv .title_main {
    font-size: 1.375rem;
  }
}

#child_body {
  background: center bottom/100% auto url("../img/child/child_bg.jpg") no-repeat;
  padding-bottom: calc(var(--paddingSection) * 1.5);
}
#child_body .child_body_bg {
  padding-top: 1.5rem;
  background-color: #fff;
  padding-bottom: calc(var(--paddingSection) * 2);
}
@media screen and (max-width: 959px) {
  #child_body .container,
#child_body .inner {
    padding-left: calc(var(--paddingLR) / 2);
    padding-right: calc(var(--paddingLR) / 2);
  }
}

/*=== breadcrumb ===*/
#breadcrumb {
  background-color: #F0F3F5;
  padding: 0.875rem 0;
}

.list_breadcrumb {
  font-size: 0.875rem;
  display: flex;
  justify-content: flex-start;
  white-space: nowrap;
  overflow: auto;
  overflow-x: auto;
  scrollbar-width: none;
}
.list_breadcrumb::-webkit-scrollbar {
  display: none;
}
.list_breadcrumb > *:first-child {
  margin-left: auto;
}
.list_breadcrumb > *:not(:last-child) {
  display: flex;
  align-items: center;
}
.list_breadcrumb > *:not(:last-child)::after {
  content: "/";
  margin: 0 0.5em;
  display: block;
  color: var(--color_main);
}
.list_breadcrumb a {
  font-weight: 700;
  color: var(--color_main);
  text-decoration: none;
}
@media screen and (max-width: 959px) {
  .list_breadcrumb {
    font-size: 0.75rem;
  }
}

/*=== layout_anchor ===*/
.layout_anchor {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.25rem;
  font-weight: 700;
  color: #073F92;
}
.layout_anchor a {
  color: inherit;
  text-decoration: none;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.layout_anchor > * {
  width: calc((100% - 3.75rem) / 4);
  height: 60px;
  border: 1px solid var(--color_main);
  display: flex;
  align-items: center;
  justify-content: center;
}
.layout_anchor .active {
  background-color: var(--color_main);
  color: #fff;
  pointer-events: none;
}
@media screen and (max-width: 959px) {
  .layout_anchor {
    font-size: 0.875rem;
    gap: 0.625rem;
  }
  .layout_anchor > * {
    width: calc((100% - 0.625rem) / 2);
    height: 40px;
  }
}

/*=== pagination ===*/
.layout_pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 1rem;
  margin: 1.5rem 0;
}
.layout_pagination .pagination {
  font-size: 0.875rem;
  font-weight: 500;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.layout_pagination .pagination > *:not(:has(a)),
.layout_pagination .pagination a {
  min-width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color_main);
  color: var(--color_main);
  padding: 2px;
}
.layout_pagination .pagination a {
  text-decoration: none;
}
@media screen and (min-width: 960px) {
  .layout_pagination .pagination a {
    transition: background-color 0.5s, color 0.5s;
  }
  .layout_pagination .pagination a:hover {
    color: #fff;
    background-color: var(--color_main_hover);
    opacity: 1;
  }
}
.layout_pagination .pagination .dots a {
  pointer-events: none;
}
.layout_pagination .pagination .disable a {
  pointer-events: none;
  background-color: #eeeeee;
  border-color: #808080;
  color: #808080;
}
.layout_pagination .pagination .current a {
  background-color: var(--color_main);
  color: #fff;
}
.layout_pagination .pagination .sp_br {
  display: none;
}
.layout_pagination .page_now {
  font-weight: 700;
  color: var(--color_main);
  margin-left: auto;
}
@media screen and (max-width: 959px) {
  .layout_pagination .pagination {
    width: 100%;
  }
  .layout_pagination .pagination .sp_br {
    display: block;
    opacity: 0;
    width: 100%;
    height: 0;
    padding: 0;
    margin: 0;
  }
  .layout_pagination .pagination .sp_row_under {
    order: 1;
  }
}

/*==========
company_about
==========*/
#company_about .row_flex {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
#company_about .row_flex:not(:first-child) {
  margin-top: 2rem;
}
#company_about .icon_area {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
#company_about .row:not(:first-child) {
  margin-top: 2rem;
}
@media screen and (max-width: 959px) {
  #company_about .row_flex {
    flex-direction: column;
  }
}

/*==========
company_introduct
==========*/
.layout_introduct .item:not(:last-child) {
  margin-bottom: var(--paddingSection);
}
.layout_introduct .title {
  font-size: 1.625rem;
  line-height: 1.25;
  font-weight: 500;
  color: var(--color_main);
  background-color: var(--color_sub);
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}
.layout_introduct .flex {
  display: flex;
  gap: 1rem 1.25rem;
}
.layout_introduct .img_area {
  width: 38%;
  flex-shrink: 0;
}
.layout_introduct .text_area p + p {
  margin-top: 0.5rem;
}
@media screen and (max-width: 959px) {
  .layout_introduct .title {
    font-size: 1.125rem;
    padding: 0.75rem 1rem;
  }
  .layout_introduct .flex {
    flex-direction: column;
  }
  .layout_introduct .img_area {
    width: 100%;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
  }
  .layout_introduct .text_area {
    font-size: 0.875rem;
  }
}

/*==========
company_base
==========*/
.layout_base {
  display: flex;
  flex-wrap: wrap;
}
.layout_base .headquarters {
  width: 100%;
  padding-bottom: var(--paddingSection);
}
.layout_base .headquarters .map_area {
  margin-top: 1rem;
  width: 100%;
  height: 300px;
}
.layout_base .headquarters .map_area iframe {
  width: 100%;
  height: 100%;
}
.layout_base > *:not(.headquarters) {
  width: 50%;
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px dashed #CDD6DD;
}
.layout_base > *:not(.headquarters):nth-child(odd) {
  padding-left: 1.25rem;
  margin-left: -2px;
}
.layout_base > *:not(.headquarters):nth-child(even) {
  padding-right: 1.25rem;
}
.layout_base .row_title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
}
.layout_base .row_title .title_03 {
  margin-bottom: 0;
}
.layout_base .btn_map {
  margin-left: auto;
  flex-shrink: 0;
}
@media screen and (max-width: 959px) {
  .layout_base .headquarters .map_area {
    height: 160px;
  }
  .layout_base > *:not(.headquarters) {
    width: 100%;
  }
  .layout_base > *:not(.headquarters):nth-child(odd) {
    padding-left: 0rem;
    margin-left: 0;
  }
  .layout_base > *:not(.headquarters):nth-child(even) {
    padding-right: 0;
  }
  .layout_base .address {
    font-size: 0.875rem;
  }
}

/*==========
company_history
==========*/
.layout_history {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  position: relative;
  z-index: 1;
}
.layout_history::after {
  content: "";
  width: 2px;
  height: 100%;
  background-color: #CDD6DD;
  position: absolute;
  top: 0;
  left: 90px;
  transform: translateX(-50%);
  z-index: -1;
}
.layout_history > * {
  display: flex;
}
.layout_history > *:not(:first-child) {
  margin-top: 2rem;
}
.layout_history > *:not(:has(.year)) {
  padding-left: 80px;
  margin-top: 0.5rem;
}
.layout_history > *:not(:has(.year)) .month::before {
  transform: scale(0.8);
}
.layout_history .year {
  width: 80px;
  font-weight: 700;
  color: var(--color_main);
  flex-shrink: 0;
}
.layout_history .month {
  width: 76px;
  padding-left: 32px;
  font-weight: 700;
  color: var(--color_main);
  position: relative;
  flex-shrink: 0;
}
.layout_history .month::before {
  content: "";
  width: 1rem;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: #89BAF1;
  position: absolute;
  top: 0.25em;
  left: calc((20px - 1rem) / 2);
  z-index: 1;
}
.layout_history .text_area {
  padding-left: 0.25rem;
}
@media screen and (max-width: 959px) {
  .layout_history {
    font-size: 0.875rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .layout_history::after {
    left: 66px;
  }
  .layout_history > *:not(:first-child) {
    margin-top: 1rem;
  }
  .layout_history > *:not(:has(.year)) {
    padding-left: 56px;
  }
  .layout_history .year {
    font-size: 0.75rem;
    width: 56px;
  }
  .layout_history .month {
    font-size: 0.75rem;
    width: 56px;
    padding-left: 24px;
  }
  .layout_history .month::before {
    width: 0.75rem;
    left: calc((20px - 0.75rem) / 2);
  }
  .layout_history .text_area {
    margin-top: -0.125em;
  }
}

/*==========
フォーム
==========*/
label:has(input[type=checkbox], input[type=radio]) {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5em;
}
label input[type=checkbox],
label input[type=radio] {
  flex-shrink: 0;
}

input[type=checkbox] {
  position: relative;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--color_main);
  background-color: #fff;
  width: 1.5em;
  aspect-ratio: 1/1;
  border-radius: 5px;
  cursor: pointer;
}
input[type=checkbox]::after {
  display: block;
  position: absolute;
  content: "";
  width: 60%;
  height: 25%;
  border-bottom: 3px solid;
  border-left: 3px solid;
  transform: rotate(-45deg);
  top: 22%;
  left: 10%;
  display: none;
  border-color: var(--color_main);
}
input[type=checkbox]:checked::after {
  display: block;
}

input[type=radio] {
  position: relative;
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--color_main);
  background-color: #fff;
  width: 1.5em;
  aspect-ratio: 1/1;
  border-radius: 100px;
  cursor: pointer;
}
input[type=radio]::after {
  display: block;
  position: absolute;
  content: "";
  width: 62%;
  aspect-ratio: 1/1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
  background-color: var(--color_main);
  border-radius: 100px;
  z-index: 1;
}
input[type=radio]:checked::after {
  display: block;
}

select {
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid var(--color_main);
  border-radius: 5px;
  padding: 0.25em 1.5rem 0.25em 0.625rem;
  font: inherit;
  line-height: 1.5;
  font-weight: 500;
  background: right 0.5em center/0.75em auto url("../img/common/icon_arrow-under-blue.svg") no-repeat #fff;
}

input[type=text],
input[type=tel],
input[type=email],
input[type=number],
input[type=file],
input[type=url] {
  width: 100%;
  border: 1px solid var(--color_main);
  background-color: #fff;
  border-radius: 5px;
  padding: 0.625rem 1em;
  font: inherit;
  line-height: 1;
  font-weight: 500;
}
input[type=text]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=number]::-moz-placeholder, input[type=file]::-moz-placeholder, input[type=url]::-moz-placeholder {
  color: rgba(51, 51, 51, 0.5);
}
input[type=text]::placeholder,
input[type=tel]::placeholder,
input[type=email]::placeholder,
input[type=number]::placeholder,
input[type=file]::placeholder,
input[type=url]::placeholder {
  color: rgba(51, 51, 51, 0.5);
}
input[type=text].short,
input[type=tel].short,
input[type=email].short,
input[type=number].short,
input[type=file].short,
input[type=url].short {
  width: 8em;
  max-width: 8em;
}

input[type=number] {
  padding: 0.5rem 1em;
}

textarea {
  width: 100%;
  resize: vertical;
  border: 1px solid var(--color_main);
  background-color: #fff;
  border-radius: 5px;
  padding: 0.625rem 1em;
  font: inherit;
  line-height: 1.75;
  font-weight: 500;
}
textarea::-moz-placeholder {
  color: rgba(51, 51, 51, 0.5);
}
textarea::placeholder {
  color: rgba(51, 51, 51, 0.5);
}

.layout_form {
  margin-top: var(--paddingSection);
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.layout_form .aside {
  font-size: 0.75rem;
  margin-bottom: 0.5rem;
}
.layout_form .list {
  border-top: 1px dashed var(--color_main);
}
.layout_form .list > [data-class=wpcf7cf_group] li, .layout_form .list > *:not([data-class=wpcf7cf_group]) {
  width: 100%;
  border-bottom: 1px dashed var(--color_main);
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  display: flex;
  gap: 0.75rem 1.25rem;
}
.layout_form .list > *:has(.wpcf7-radio) .label_area label::after, .layout_form .list > *:has(.wpcf7-validates-as-required) .label_area label::after, .layout_form .list > *:has([required]) .label_area label::after {
  content: "※";
  color: var(--color_red);
}
.layout_form .list .label_area {
  width: 12.5rem;
  font-weight: 500;
  padding-top: 0.625em;
  flex-shrink: 0;
}
.layout_form .list .input_area {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.layout_form .list .input_area [data-class=wpcf7cf_group] {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1rem;
}
.layout_form .list .input_area [data-class=wpcf7cf_group] .row_input {
  width: 100%;
}
.layout_form .wpcf7-not-valid-tip {
  width: 100%;
}
.layout_form .row_privacy,
.layout_form .label_wrap:not(:has(.wpcf7-radio)),
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)),
.layout_form .wpcf7-radio,
.layout_form .wpcf7-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1rem;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.layout_form .row_privacy .wpcf7-list-item,
.layout_form .label_wrap:not(:has(.wpcf7-radio)) .wpcf7-list-item,
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)) .wpcf7-list-item,
.layout_form .wpcf7-radio .wpcf7-list-item,
.layout_form .wpcf7-checkbox .wpcf7-list-item {
  margin-left: 0;
}
.layout_form .row_privacy label,
.layout_form .label_wrap:not(:has(.wpcf7-radio)) label,
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)) label,
.layout_form .wpcf7-radio label,
.layout_form .wpcf7-checkbox label {
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.layout_form .row_privacy label .wpcf7-list-item-label,
.layout_form .row_privacy label .text_label,
.layout_form .label_wrap:not(:has(.wpcf7-radio)) label .wpcf7-list-item-label,
.layout_form .label_wrap:not(:has(.wpcf7-radio)) label .text_label,
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)) label .wpcf7-list-item-label,
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)) label .text_label,
.layout_form .wpcf7-radio label .wpcf7-list-item-label,
.layout_form .wpcf7-radio label .text_label,
.layout_form .wpcf7-checkbox label .wpcf7-list-item-label,
.layout_form .wpcf7-checkbox label .text_label {
  flex: 1;
}
.layout_form .label_wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 2em;
}
.layout_form .label_wrap .wpcf7-radio,
.layout_form .label_wrap .wpcf7-checkbox {
  margin-top: 0;
  margin-bottom: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1em 2em;
}
.layout_form .label_wrap:not(:last-child) {
  margin-bottom: 0.5rem;
}
.layout_form .row_input {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem 1em;
}
.layout_form .row_input input,
.layout_form .row_input textarea {
  flex: 1;
}
.layout_form .row_input .text_input {
  margin-top: 0.75em;
  font-weight: 500;
  flex-shrink: 0;
}
.layout_form .wpcf7-form-control-wrap {
  display: contents;
}
.layout_form .wpcf7-list-item-label,
.layout_form .text_label {
  font-weight: 500;
  flex-shrink: 0;
}
.layout_form .aside {
  margin-top: 0.625rem;
}
.layout_form .row_submit {
  margin-top: 3rem;
  display: flex;
  gap: 1.5rem 2.5rem;
}
.layout_form .row_submit > * {
  flex: 1;
}
.layout_form .row_submit .wpcf7-spinner {
  position: absolute;
  bottom: -2.5rem;
  right: 0;
}
.layout_form .row_icon {
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.layout_form .row_icon .icon {
  flex-shrink: 0;
}
@media screen and (max-width: 959px) {
  .layout_form {
    font-size: 0.875rem;
  }
  .layout_form .title_list {
    font-size: 1rem;
    margin-bottom: 0.75rem;
  }
  .layout_form .list > [data-class=wpcf7cf_group] li, .layout_form .list > *:not([data-class=wpcf7cf_group]), .layout_form .list > * {
    flex-direction: column;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .layout_form .list > [data-class=wpcf7cf_group] li .label_area, .layout_form .list > *:not([data-class=wpcf7cf_group]) .label_area, .layout_form .list > * .label_area {
    width: 100%;
  }
  .layout_form .list > [data-class=wpcf7cf_group] li .label_area label::after, .layout_form .list > *:not([data-class=wpcf7cf_group]) .label_area label::after, .layout_form .list > * .label_area label::after {
    margin-top: -0.25em;
  }
  .layout_form .list .label_area {
    padding-top: 0;
  }
  .layout_form .row_input textarea {
    flex: 0 1 auto;
  }
  .layout_form .row_privacy,
.layout_form .label_wrap:not(:has(.wpcf7-radio)),
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)),
.layout_form .wpcf7-radio,
.layout_form .wpcf7-checkbox {
    gap: 0.625rem 2.5rem;
  }
  .layout_form .row_privacy label,
.layout_form .label_wrap:not(:has(.wpcf7-radio)) label,
.layout_form .label_wrap:not(:has(.wpcf7-checkbox)) label,
.layout_form .wpcf7-radio label,
.layout_form .wpcf7-checkbox label {
    max-width: none;
    min-width: 6em;
  }
  .layout_form .label_wrap .wpcf7-radio,
.layout_form .label_wrap .wpcf7-checkbox {
    display: flex;
  }
  .layout_form .row_submit {
    flex-direction: column;
    align-items: center;
  }
  .layout_form .row_submit > * {
    flex: 0 1 auto;
    max-width: 240px;
  }
}

.wpcf7-form-control-wrap > .wpcf7-not-valid-tip {
  display: none;
}
.wpcf7-form-control-wrap.is-show > .wpcf7-not-valid-tip {
  display: block;
}

.layout_confirm .layout_form .list > * .label_area label::after {
  display: none;
}
.layout_confirm .label_area {
  padding-bottom: 0.625rem;
}
.layout_confirm .text_confirm {
  margin-top: 0.625em;
  margin-bottom: 0.625rem;
  font-weight: 700;
}
.layout_confirm .text_confirm + .text_confirm {
  margin-top: 0;
}
.layout_confirm .hidden_field {
  display: none;
}
@media screen and (max-width: 959px) {
  .layout_confirm .text_confirm {
    font-size: 0.875rem;
  }
}

.btn_clear,
.btn_back {
  background-color: #EBEBEB;
  font-size: 1.375rem;
  font-weight: 700;
  width: 100%;
  max-width: 440px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 100px;
  cursor: pointer;
}
@media screen and (min-width: 960px) {
  .btn_clear,
.btn_back {
    transition: background-color 0.5s;
  }
  .btn_clear:hover,
.btn_back:hover {
    background-color: var(--color_sub);
  }
}
@media screen and (max-width: 959px) {
  .btn_clear,
.btn_back {
    font-size: 1rem;
    height: 56px;
  }
}

.btn_submit {
  background: center right 1.5em/0.75em url("../img/common/icon_arrow-white.svg") no-repeat var(--color_main);
  color: #fff;
  font-size: 1.375rem;
  font-weight: 700;
  width: 100%;
  max-width: 440px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 100px;
  cursor: pointer;
}
@media screen and (min-width: 960px) {
  .btn_submit {
    transition: background-color 0.5s;
  }
  .btn_submit:hover {
    background-color: var(--color_main_hover);
  }
}
@media screen and (max-width: 959px) {
  .btn_submit {
    font-size: 1rem;
    height: 56px;
  }
}

/*==========
sitemap
==========*/
.layout_sitemap {
  width: 85%;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1rem;
}
.layout_sitemap .item {
  width: calc((100% - 1rem) / 2);
  border-bottom: 1px dashed var(--color_main);
  padding-bottom: 1rem;
}
.layout_sitemap a {
  color: inherit;
  text-decoration: none;
}
.layout_sitemap .parent {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color_main);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  padding-left: 1em;
}
.layout_sitemap .parent::before {
  content: "‣";
  position: absolute;
  left: 0.25em;
}
.layout_sitemap .parent:not(:first-child) {
  margin-top: 0.5rem;
}
.layout_sitemap .child {
  font-size: 1.125rem;
  font-weight: 500;
  position: relative;
  padding-left: 1em;
  margin-left: 1em;
}
.layout_sitemap .child::before {
  content: "-";
  position: absolute;
  left: 0;
}
.layout_sitemap .child:not(:first-child) {
  margin-top: 0.5rem;
}
@media screen and (max-width: 959px) {
  .layout_sitemap {
    margin-top: 1.5rem;
  }
  .layout_sitemap .item {
    width: 100%;
  }
  .layout_sitemap .parent {
    font-size: 1rem;
  }
  .layout_sitemap .child {
    font-size: 0.875rem;
  }
}

/*==========
sustainability
==========*/
#sustainability_intro .thumb_area {
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.layout_sdgs > * {
  display: flex;
  gap: 1.25rem;
}
.layout_sdgs > *:not(:last-child) {
  margin-bottom: var(--paddingSection);
}
.layout_sdgs .text_area {
  width: 50%;
  flex-shrink: 0;
}
.layout_sdgs .icon_area {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.layout_sdgs .icon_area > * {
  width: 120px;
  aspect-ratio: 1/1;
}
.layout_sdgs .icon_area > * img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 959px) {
  .layout_sdgs > * {
    flex-direction: column;
  }
  .layout_sdgs .text_area {
    width: 100%;
  }
  .layout_sdgs .icon_area {
    justify-content: flex-end;
  }
  .layout_sdgs .icon_area > * {
    width: 80px;
  }
}

/*==========
products
==========*/
.layout_search {
  background-color: #F0F3F5;
  margin-top: 2.5rem;
  padding: 1.5rem 2.5rem 2.5rem;
}
.layout_search .row_input {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}
.layout_search select,
.layout_search input {
  border-color: #E4E4E4;
}
.layout_search input {
  flex: 1;
}
.layout_search .btn_area {
  flex-shrink: 0;
}
.layout_search .link_clear {
  font-weight: 700;
  color: var(--color_main);
  margin-top: 0.5rem;
  margin-left: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  align-items: flex-start;
  display: flex;
  gap: 0.25em;
}
.layout_search .link_clear::before {
  content: "";
  width: 1em;
  aspect-ratio: 1/1;
  background: center/contain url("../img/common/icon_clear.svg") no-repeat;
  margin-top: 0.325em;
}
@media screen and (max-width: 959px) {
  .layout_search {
    padding: var(--paddingLR);
  }
  .layout_search select,
.layout_search input {
    flex: 0 1 auto;
    width: 100%;
  }
  .layout_search .btn_area {
    margin-left: auto;
    margin-right: auto;
  }
}

#products_archive .text_intro {
  margin-top: 1rem;
}

#products_list .text_search {
  font-size: 1.125rem;
  text-align: right;
  color: var(--color_main);
  font-weight: 700;
  margin-bottom: 1.5rem;
}
#products_list .layout_anchor > * {
  height: 48px;
  border-radius: 100px;
}
#products_list .layout_anchor a {
  gap: 0.5em;
}
#products_list .layout_anchor a::after {
  content: "";
  width: 0.75em;
  aspect-ratio: 1/1;
  background: center/contain url("../img/common/icon_arrow-under-blue.svg") no-repeat;
  margin-top: 0.125em;
}
@media screen and (max-width: 959px) {
  #products_list .text_search {
    font-size: 1rem;
  }
  #products_list .layout_anchor > * {
    height: 40px;
  }
}

.layout_brand {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem 0.625rem;
}
.layout_brand .logo_area {
  width: 100%;
  max-width: 240px;
  aspect-ratio: 240/100;
  border: 1px solid #CDD6DD;
  overflow: hidden;
}
.layout_brand .logo_area img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.layout_brand .text_area {
  margin-top: 0.625rem;
}
.layout_brand .title {
  text-align: center;
  font-weight: 500;
  color: var(--color_main);
}
.layout_brand a {
  color: inherit;
  text-decoration: none;
}
@media screen and (max-width: 959px) {
  .layout_brand {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }
}

#products_single .row_thumb {
  margin-bottom: 1rem;
}
#products_single .row_thumb img {
  width: 100%;
}
#products_single .row_category {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
#products_single .row_category .layout_category {
  font-size: 1rem;
  font-weight: 700;
}
#products_single .row_category .layout_category > * {
  background-color: var(--color_main);
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 128px;
  padding: 0.25em 1.5em;
}
#products_single .row_category .logo_wrap {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}
#products_single .row_category .logo_area {
  width: 100%;
  max-width: 194px;
  aspect-ratio: 240/100;
  border: 1px solid #CDD6DD;
  overflow: hidden;
}
#products_single .row_category .logo_area img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 959px) {
  #products_single .row_category .layout_category {
    font-size: 0.875rem;
  }
  #products_single .row_category .layout_category > * {
    height: 40px;
    min-width: 80px;
  }
  #products_single .row_category .logo_wrap {
    margin-left: auto;
  }
  #products_single .row_category .logo_area {
    max-width: 120px;
  }
}

/*==========
brand
==========*/
#brand_single .logo_area {
  width: 100%;
  max-width: 240px;
  aspect-ratio: 240/100;
  border: 1px solid #CDD6DD;
  overflow: hidden;
}
#brand_single .logo_area img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

/*==========
recruit
==========*/
#recruit .row_thumb {
  margin-top: 1rem;
}
#recruit .item {
  margin-top: 1.5rem;
}
#recruit .item .title {
  font-weight: 700;
  color: #fff;
  background-color: var(--color_main);
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
}
#recruit .item .flex {
  display: flex;
  gap: 1rem 2.5rem;
}
#recruit .item .list_area {
  flex: 1;
}
#recruit .item .img_area {
  width: 32%;
  flex-shrink: 0;
}
#recruit .item + .item {
  margin-top: 2.5rem;
}
#recruit .border_area {
  border: 1px solid var(--color_main);
  padding: 1.25rem 2.5rem;
  margin-top: 2.5rem;
}
#recruit .border_area .text_tell {
  color: var(--color_main);
  font-weight: 700;
  margin-top: 1rem;
}
@media screen and (max-width: 959px) {
  #recruit .item .flex {
    flex-direction: column;
  }
  #recruit .item .img_area {
    width: 100%;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }
  #recruit .border_area {
    padding: var(--paddingLR);
  }
}