@charset "UTF-8";

/*================================================
* history
================================================*/
#history {
  background: #c6e776;
  padding: 38rem 0 14rem;
}

.history_inner {
  width: 110rem;
  margin: 0 auto;
}

.hist_list {
  margin-top: 10rem;
}


.hist_box {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10rem;
  position: relative;
}

.hist_box:nth-of-type(5)::before,
.hist_box:nth-of-type(11)::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/history/history_circle.webp);
  width: 12rem;
  height: 12rem;
  top: 50%;
  right: -10rem;
  transform: translate(-50%, -50%);
}

.hist_box:nth-of-type(2)::before,
.hist_box:nth-of-type(8)::before,
.hist_box:nth-of-type(14)::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/history/history_circle.webp);
  width: 18rem;
  height: 18rem;
  top: 0;
  left: -10rem;
  transform: translate(-50%, -50%);
}

.hist_num {
  width: 36rem;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.hist_num::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/history/history_circle.webp);
  width: 36rem;
  height: 36rem;
  top: 0rem;
  left: 0rem;
  animation: 20s linear infinite rotation2;
  pointer-events: none;
}

.reverse .hist_num::before {
  animation: 20s linear infinite rotation;
}

.hist_num::after {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/history/history_line.webp);
  width: 40.5rem;
  height: 21.5rem;
  bottom: -9rem;
  right: -35rem;
  pointer-events: none;
}

.hist_num h3 {
  font-size: 8rem;
  font-family: var(--en);
  color: #000;
  font-weight: 700;
  text-align: center;
}

.hist_cnt {
  width: 54rem;
}

.hist_cnt h4 {
  font-size: 3.6rem;
  font-weight: 700;
  position: relative;
  padding-bottom: 1rem;
  width: fit-content;

}

.hist_cnt h4 span {
  font-size: 4rem;
}

.hist_cnt h4::after {
  position: absolute;
  content: "";
  width: 21rem;
  height: 0.2rem;
  background: var(--color-white);
  left: -15rem;
  top: 6.5rem;
}

.hist_cnt p {
  font-size: 2.5rem;
  margin-bottom: 1rem;
}

.hist_box.reverse {
  flex-direction: row-reverse;
}

.hist_box.reverse .hist_cnt h4 {
  margin-left: auto;
}

.hist_box.reverse .hist_cnt h4::after {
  right: -15rem;
  left: auto;
}

.hist_box.reverse .hist_num::after {
  background-image: url(../images/history/history_line02.webp);
  left: -35rem;
  right: auto;
}

.hist_box:last-of-type .hist_num::after {
  content: none;
}

.hist_box.reverse .hist_cnt p {
  text-align: right;
}

#history .subBtn {
  margin: 10rem auto 0;
}

@media screen and (max-width:767px) {
  #history {
    padding: 26rem 0 14rem;
  }

  .history_inner {
    width: 60rem;
    margin: 0 auto;
  }

  .hist_list {
    margin-top: 10rem;
  }


  .hist_box {
    justify-content: space-between;
    gap: 0;
  }

  .hist_box:nth-of-type(5)::before,
  .hist_box:nth-of-type(11)::before,
  .hist_box:nth-of-type(2)::before,
  .hist_box:nth-of-type(8)::before,
  .hist_box:nth-of-type(14)::before {
    content: none;
  }

  .hist_num {
    width: 24rem;
    min-width: 24rem;
  }

  .hist_num::before {
    width: 24rem;
    height: 24rem;
  }

  .hist_num::after {
    width: 22.5rem;
    height: 12.2rem;
    bottom: -6rem;
    right: -16rem;
  }

  .hist_num h3 {
    font-size: 4.6rem;
  }

  .hist_cnt {
    width: 34rem;
    /* margin-left: auto; */
  }

  .hist_cnt h4 {
    font-size: 2rem;
  }

  .hist_cnt h4 span {
    font-size: 2.6rem;
  }

  .hist_cnt h4::after {
    width: 17rem;
    left: -5.5rem;
    top: 4.5rem;
  }

  .hist_cnt p {
    font-size: 2rem;
  }

  .hist_box.reverse .hist_cnt h4::after {
    right: -5.5rem;
    left: auto;
  }

  .hist_box.reverse .hist_num::after {
    left: -16rem;
    right: auto;
  }


}

/*================================================
* 
================================================*/

#subVisual.service {
  background: var(--color-bg-pink);
  padding: 38rem 0 22rem;
  position: relative;
}

#subVisual.service .hd {
  margin-bottom: 0;
}

#subVisual.service .hd .ja {
  color: var(--color-black);
  font-size: 7rem;
  text-align: left;
  margin-bottom: 0;
  line-height: 1.3;
}

#subVisual.service .lead {
  font-size: 2.8rem;
}


#subVisual.service .subVis_inner {
  width: 70%;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

#subVisual.service .subVis_inner::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/svc_ill.webp);
  width: 34.7rem;
  height: 35rem;
  top: -25%;
  left: -12rem;
  z-index: -1;


  animation: 20s linear infinite rotation;
}

.subVis_en {
  color: var(--color-white);
  font-size: 15rem;
  font-family: var(--en);
  text-align: right;
  line-height: 1;

  font-weight: 700;
  position: absolute;
  bottom: -3rem;
  right: 0;
}

@media screen and (max-width:767px) {
  #subVisual.service {
    padding: 22rem 0 11rem;
  }

  #subVisual.service .subVis_inner {
    width: 84%;
    margin: 0 auto;
  }

  #subVisual.service .subVis_inner::before {
    width: 25rem;
    height: 25.2rem;
    top: -18%;
    left: -9rem;
  }

  #subVisual.service .hd .ja {
    font-size: 5rem;
  }

  #subVisual.service .lead {
    font-size: 2.6rem;
  }

  .subVis_en {
    font-size: 5rem;
    bottom: -1rem;
    white-space: nowrap;
  }
}

/*================================================
* service
================================================*/
#service::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/service/svc_bg.webp);
  width: 88.8rem;
  height: 87rem;
  bottom: 0;
  right: 0;
  pointer-events: none;
  z-index: -1;
}

.service_inner {
  width: 130rem;
  margin: 0 auto;
}

.service_inner h2 {
  font-size: 4.5rem;
  color: var(--color-primary);
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.5;
}

.service_inner .lead {
  position: relative;
  padding: 4rem 0 4rem;
  z-index: 1;
}

.service_inner .lead::before {
  position: absolute;
  content: "";
  width: calc(100% + (100vw - 130rem) / 2);
  background: #c6e776;
  height: 100%;
  left: 23rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}


.service_inner .lead ul {
  padding-left: 29rem;
}


.service_inner .lead ul li {
  font-size: 2.8rem;
  position: relative;
  padding-left: 1em;
  margin-top: 1rem;
}

.service_inner .lead ul li::before {
  position: absolute;
  content: "●";
  left: 0;
  top: 0;
  color: #006837;
}

.productBefore {
  margin: 20rem 0;
}

.productBefore h3 {
  font-size: 3.6rem;
  font-weight: 700;
  margin-bottom: 3rem;
}

.productBefore_clm {
  display: grid;
  gap: 5rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 6rem;
  align-items: stretch;
}

.productBefore_clm h4 {
  text-align: center;
  margin-bottom: 1rem;
  font-weight: 600;
}

.productBefore_clm p {
  line-height: 2;
}

.productBefore_item {
  position: relative;
}

/* .productBefore_item:first-of-type:before {
  position: absolute;
  content: "▶︎";
  top: 50%;
  right: -3.5rem;
  font-size: 2rem;
} */

.productBefore_item:nth-of-type(3) {
  background: #d9e6ec;
  padding: 2rem;
}



.productBefore_clm h5 {
  font-weight: 600;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid;
}





.productList {
  display: grid;
  gap: 5rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 10rem;
}

.productList li {
  background: #e6e6e6;
  position: relative;
}

.productList li::before {
  position: absolute;
  content: "";
  width: 4rem;
  height: 4rem;
  background: #ff328a;
  clip-path: polygon(100% 0, 0% 100%, 100% 100%);
  bottom: 0;
  right: 0;
  pointer-events: none;
}

.productList li div {
  padding: 2rem 2rem 4rem 2rem;
}

.productList li div h3 {
  font-size: 2.5rem;
  margin-bottom: 1rem;
}

.productList li div p {
  font-size: 2rem;
}

.productList li dl {
  display: flex;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
  font-size: 2rem;
}

.productList li dl dt {
  width: 12rem;
}

.productList li dl dd {
  width: calc(100% - 12rem);
}

.svc_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-top: 10rem;
}

.svc_btn a {
  width: 36rem;
  font-size: 2.2rem;
  margin: 0;
}

.svc_btn a:hover {
  background: #4294ff
}

.svc_btn-pdf {
  display: block;
  width: fit-content;
  margin: 6rem auto;
  padding: 3rem 10rem;
  border: 1px solid var(--color-primary);
  border-radius: 10rem;
  color: var(--color-primary);
  font-size: 3rem;
}

.productFlow {
  margin: 8rem 0;
}

.productFlow h3 {
  font-size: 3.6rem;
  font-weight: 700;
  margin-bottom: 3rem;
}


.productFlow ul {
  display: grid;
  gap: 5rem;
  grid-template-columns: repeat(5, 1fr);
}

.productFlow ul li {
  text-align: center;
  position: relative;
}

.productFlow ul li:not(:last-child):before {
  position: absolute;
  content: "";
  width: 2rem;
  height: 2rem;
  background: var(--color-primary);
  top: 70%;
  right: -4rem;
  transform: translateY(-50%);
  z-index: -1;
  clip-path: polygon(100% 50%, 0 0, 0 100%);
}

.productFlow ul li h4 {
  color: var(--color-primary);
  font-family: var(--en);
  font-weight: 700;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--color-black);
  font-size: 5rem;
}


.productFlow ul li p {
  font-size: 2.5rem;
}

.strength {
  width: fit-content;
  margin: 4rem auto 0;
  padding: 3rem;
  background: #d9e6ec;
  position: relative;
  text-align: center;
  font-size: 2rem;
}

.strength::before {
  position: absolute;
  content: "";
  width: 3rem;
  height: 3rem;
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  background: #d9e6ec;
  top: -2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

.strength h5 {
  font-size: 2.5rem;
  font-weight: 700;
}

@media screen and (max-width:767px) {
  #service::before {
    width: 70rem;
    height: 68.5rem;
  }

  .service_inner {
    width: 92%;
    margin: 0 auto;
  }

  .service_inner .lead::before {
    position: absolute;
    content: "";
    width: calc(100% + (100vw - 90%) / 2);
    background: #c6e776;
    height: 100%;
    left: 10%;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
  }

  .service_inner h2 {
    font-size: 3.8rem;
    margin-bottom: 2rem;
  }

  .service_inner .lead ul {
    padding-left: 10rem;
  }

  .service_inner .lead ul li {
    font-size: 2.4rem;
  }

  .productBefore_clm {
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
  }

  .productBefore_item:first-of-type:before {
    top: auto;
    right: auto;
    bottom: -5rem;
    left: 50%;
    transform: translateX(-50%) rotate(90deg);
  }

  .productBefore_item:nth-of-type(2) {
    margin-top: 4rem;
  }

  .productBefore_clm h4 {
    text-align: left;
  }

  .productList {
    gap: 5rem;
    grid-template-columns: repeat(1, 1fr);
    margin-top: 10rem;
  }

  .productList li div {
    padding: 4rem 4rem 6rem 4rem;
  }

  .productList li div h3 {
    font-size: 2.8rem;
  }

  .productList li dl,
  .productList li div p {
    font-size: 2.4rem;
  }

  .svc_btn {
    flex-wrap: wrap;
    gap: 2rem;
  }

  .svc_btn a {
    width: 50rem;
  }

  .svc_btn-pdf {
    margin: 6rem auto;
    padding: 3rem 5rem;
    font-size: 2.4rem;
  }


  .productFlow h3 {
    font-size: 3rem;
    margin-bottom: 2rem;
  }

  .productFlow ul {
    gap: 4rem;
    grid-template-columns: repeat(1, 1fr);
    width: 60%;
    margin: 0 auto;
  }

  .productFlow ul li {
    text-align: center;
    position: relative;
  }

  .productFlow ul li:not(:last-child):before {
    width: 2rem;
    height: 2rem;
    top: auto;
    right: auto;
    bottom: -3.2rem;
    left: 50%;
    transform: translateX(-50%);
    clip-path: polygon(50% 100%, 100% 0, 0 0);
  }

  .productFlow ul li h4 {
    font-size: 4rem;
  }

  .strength {
    margin: 6rem auto 0;
    padding: 3rem;
    font-size: 2rem;
  }
}

/*================================================
* quality
================================================*/
#quality {}

#quality {
  padding: 38rem 0 14rem;
}

#quality::before {
  position: absolute;
  content: "";
  width: 100%;

  height: 110rem;
  background: var(--color-bg-pink);
  top: 0;
  left: 0;
  z-index: -1;
}

.quality_inner {
  width: 160rem;
  margin: 0 auto;
}

#quality .hd .en {
  color: var(--color-white);
}

.quality_lead {
  text-align: center;
  font-size: 2.5rem;
  color: var(--color-white);
  margin-bottom: 6rem;
}

.quality_lead h3 {
  color: var(--color-black);
  font-size: 2.8rem;
  margin: 3rem 0;
}


.quality_list {
  display: grid;
  gap: 5rem;
  text-align: center;
  font-size: 2rem;
  grid-template-columns: repeat(3, 1fr);
  line-height: 2;
}


.quality_md {
  display: flex;
  align-items: start;
  justify-content: center;
  gap: 10rem;
  margin-top: 10rem;
}

.quality_txt {
  width: 66rem;
  padding-top: 2rem;
  font-size: 2.5rem;
}

.quality_txt h4 {
  font-size: 3.6rem;
  margin-bottom: 1rem;
}

.quality_img {
  width: 50rem;
  position: relative;
}

.quality_img::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: -5rem;
  top: 5rem;
  background: #e6e6e6;
  z-index: -1;
}

.quality_inner .subBtn {
  margin: 10rem auto 0;
}

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

  #quality {
    padding: 26rem 0 14rem;
  }

  .quality_inner {
    width: 56rem;
    margin: 0 auto;
  }

  .quality_lead h3 {
    margin: 4rem 0;
  }


  .quality_list {
    gap: 5rem;
    grid-template-columns: repeat(1, 1fr);
  }


  .quality_md {
    flex-wrap: wrap;
    gap: 4rem;
  }

  .quality_txt {
    width: 100%;
  }

  .quality_img {
    width: 50rem;
    position: relative;
  }

  .quality_img::before {
    left: -3rem;
    top: 3rem;
  }


}

/*================================================
* recruit
================================================*/
#recruit {
  padding: 38rem 0 14rem;
  background: #dadf00;
  overflow: clip;
}

#recruit .hd .en {
  color: var(--color-white);
}

.recruit_inner .subBtn {
  margin: 10rem auto 0;
}

.recruit_list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 6rem 0;
}


.recruit_lead h3 {
  text-align: center;
  font-size: 4.2rem;
  font-weight: 600;
  margin: 4rem 0;
  color: #004195;
}

.recruit_lead p {
  font-size: 2.5rem;
  margin-top: 3rem;
  text-align: center;
  line-height: 1.8;
}

.recruit_mdl {
  width: 147rem;
  margin: 10rem auto;
  padding: 6rem;
  background: var(--color-white);
  position: relative;
}

.recruit_mdl::before,
.recruit_mdl::after {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/co_img02.webp);
  width: 53.6rem;
  height: 53.6rem;
  opacity: .2;
  animation: 20s linear infinite rotation;
}

.recruit_mdl::before {
  top: -37rem;
  right: -37rem;
}

.recruit_mdl::after {
  top: 23rem;
  left: -29rem;
  width: 39.4rem;
  height: 39.4rem;
}

.recruit_mdl h4 {
  text-align: center;
  font-weight: 600;
  color: #004195;
  font-size: 3rem;
  position: relative;
  padding-bottom: 4rem;
}

.recruit_mdl h4::before {
  position: absolute;
  content: "";
  width: 3rem;
  height: 2rem;
  background: #004195;
  left: 50%;
  bottom: 0;
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  transform: translateX(-50%);
}

.recruit_mdl .telBtn {
  display: flex;
  align-items: stretch;
  background: #004195;
  color: var(--color-white);
  width: 130rem;
  margin: 2rem auto 0;
  border-radius: 0.8rem;
}

.recruit_mdl .telBtn .ja {
  font-size: 2.6rem;
  display: block;
  background: rgb(255 255 255 / 20%);
  padding: 4rem 3rem 4rem 6rem;
  position: relative;
  z-index: 1;
}

.recruit_mdl .telBtn .ja::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 3rem;
  background: rgb(255 255 255 / 20%);
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  top: 0;
  right: -3rem;
  z-index: -1;
}

.recruit_mdl .telBtn .num {
  font-size: 5rem;
  text-align: center;
  font-weight: 600;
  display: grid;
  place-content: center;
  display: block;
  padding-left: 6rem;
}

@media screen and (max-width:767px) {
  .recruit_lead {
    width: 56rem;
    margin: 0 auto;
  }

  .recruit_lead h3 {
    font-size: 3.2rem;
  }

  .recruit_lead p {
    text-align: left;
    font-size: 2.4rem;
  }

  .recruit_mdl {
    width: 100%;
    margin: 10rem auto;
    padding: 6rem 2rem;
  }

  .recruit_mdl .telBtn {
    flex-wrap: wrap;
    width: 100%;
  }

  .recruit_mdl h4 {
    font-size: 2.8rem;
  }

  .recruit_mdl .telBtn .ja {
    width: 100%;
    text-align: center;
    padding: 3rem 0 1rem;
  }

  .recruit_mdl .telBtn .ja::before {
    height: 3rem;
    width: 100%;
    background: rgb(255 255 255 / 20%);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    top: auto;
    left: 0;
    right: auto;
    bottom: -3rem;
  }

  .recruit_mdl .telBtn .num {
    font-size: 4rem;
    padding: 5rem 0 3rem;
    width: 100%;
  }

  .recruit_mdl::before {
    width: 30rem;
    height: 30rem;
    top: -17rem;
    right: -7rem;
  }

  .recruit_mdl::after {
    top: 48rem;
    left: -12rem;
    width: 26rem;
    height: 26rem;
  }
}

/*================================================
* esg
================================================*/

#esg {
  padding: 38rem 0 14rem;
  background: #c0e3ff;
  overflow: clip;
  z-index: 1;
}

#esg::before {
  position: absolute;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  display: inline-block;
  background-image: url(../images/esg_bg.webp);
  width: 88rem;
  height: 78.7rem;
  bottom: 0;
  right: 0;
  z-index: -1;
}

.esg_inner {
  width: 110rem;
  margin: 0 auto;

}

.esg_inner .hd .ja {
  font-size: 7rem;
  color: var(--color-primary);
}

.esg_inner .lead {
  text-align: center;
  font-size: 2.5rem;
  color: var(--color-primary);
}

.esg_item {
  margin-top: 10rem;
}

.esg_item h3 {
  text-align: center;
  font-size: 4rem;
  color: var(--color-primary);
}

.esg_item p {
  margin: 2rem 0;
  font-size: 2.5rem;
}

.esg_item a {
  background: var(--color-black);
  color: var(--color-white);
  width: fit-content;
  display: block;
  padding: 1rem 4rem;
  border-radius: 10rem;
  margin: 0 auto;
}

.esg_item1 img {
  width: 19rem;
  margin: 2rem auto 0;
}

@media screen and (max-width:767px) {
  #esg {
    padding: 28rem 0 14rem;
    background: #c0e3ff;
    overflow: clip;
    z-index: 1;
  }

  .esg_inner {
    width: 56rem;
    margin: 0 auto;
  }

  .esg_inner .hd .ja {
    font-size: 6rem;
  }

  .esg_item {
    margin-top: 6rem;
  }
}

/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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

/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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

/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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


/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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

/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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

/*================================================
* 
================================================*/

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

/*================================================
* 
================================================*/


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

/*================================================
* contact
================================================*/
#contact {
  padding: 38rem 0 14rem;
}

#contact .contact_inner {
  width: 110rem;
  max-width: 90%;
  margin: 0 auto;
}

#contact .contact_lead {
  text-align: center;
  line-height: 2;
  margin-bottom: 6rem;
}

#contact .contact_required {
  display: inline-block;
  padding: 0.2rem 1rem;
  border-radius: 0.4rem;
  background: var(--color-primary);
  color: var(--color-white);
  font-size: 1.5rem;
  font-weight: 400;
  vertical-align: middle;
}

#contact .contact_row {
  display: grid;
  grid-template-columns: 29rem minmax(0, 1fr);
  gap: 3rem;
  padding: 3.5rem 0;
  border-top: 1px solid #d5dce3;
}

#contact .contact_label {
  padding-top: 1.4rem;
  font-weight: 600;
  font-size: 2.4rem;
}

#contact .contact_label .contact_required {
  margin-left: 1rem;
}

#contact .contact_field input,
#contact textarea {
  width: 100%;
  min-width: 0;
  padding: 1.4rem 1.8rem;
  border: 1px solid #c7d0da;
  border-radius: 0.4rem;
  background: #f6f8fa;
  color: var(--color-black);
  font: inherit;

  line-height: 1.6;
  font-size: 2.4rem;
}

#contact textarea {
  display: block;
  resize: vertical;
  min-height: 20rem;
}

#contact .contact_note {
  margin-top: 1.2rem;
  font-size: 1.7rem;
  line-height: 1.8;
}

#contact .contact_choices {
  padding: 0;
  margin: 0 0 3rem;
  min-width: 0;
  border: 0;
}

#contact .contact_choices legend,
#contact .contact_message_label {
  display: block;
  margin-bottom: 1.5rem;
}

#contact .contact_choices label,
#contact .contact_consent label {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  min-height: 44px;
  cursor: pointer;
}

#contact .contact_field input[type="radio"],
#contact .contact_choices input,
#contact .contact_consent input {
  appearance: auto;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin: 0 1rem 0 0;
  padding: 0;
  accent-color: var(--color-primary);
}

#contact .wpcf7-radio .wpcf7-list-item {
  display: block;
  margin-bottom: 1rem;
}

#contact .contact_consent {
  border-top: 1px solid #d5dce3;
  padding-top: 5rem;
  text-align: center;
}

#contact .contact_consent a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 0.3em;
}

#contact .contact_consent label {
  width: fit-content;
  margin: 2rem auto 0;
}

#contact .contact_submit {
  margin-top: 5rem;
  text-align: center;
}

#contact .contact_submit .subBtn {
  margin: 0 auto;
  padding: 1.8rem 4rem;
  font-family: inherit;
  font-size: 2.2rem;
  cursor: pointer;
  transition: background .4s;
}

#contact .contact_submit .subBtn:hover:not(:disabled) {
  background: var(--color-primary);
}

#contact .contact_submit .subBtn:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

#contact input:focus-visible,
#contact textarea:focus-visible,
#contact a:focus-visible,
#contact button:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}

@media screen and (max-width:767px) {
  #contact {
    padding: 28rem 0 10rem;
  }

  #contact .contact_inner {
    width: 56rem;
  }

  #contact .contact_lead {
    text-align: left;
    margin-bottom: 4rem;
  }

  #contact .contact_row {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    padding: 3rem 0;
  }

  #contact .contact_label {
    padding-top: 0;
  }

  #contact .contact_required {
    font-size: 2rem;
  }

  #contact .contact_field input,
  #contact textarea {
    font-size: max(16px, 2.4rem);
  }

  #contact .contact_note {
    font-size: 2.2rem;
  }

  #contact .contact_consent {
    padding-top: 4rem;
  }

  #contact .contact_submit .subBtn {
    width: 100%;
    font-size: 3rem;
    padding: 2rem;
  }
}