@charset "UTF-8";
.archive__lead {
  font-size: 18px;
  margin-bottom: 5rem;
}
@media screen and (max-width: 1024px) {
  .archive__lead {
    font-size: 2.8rem;
  }
}

.archive__section {
  border-bottom: 1px solid #e5e5e5;
}

.archive__section__inner {
  border-bottom: 1px solid #e5e5e5;
  padding-bottom: 7rem;
}
@media screen and (max-width: 1024px) {
  .archive__section__inner {
    padding-bottom: 2rem;
  }
}


/*****  製品リスト  *****************************/
.product__list {
  display: flex;
  flex-wrap: wrap;
  gap: 5rem 5rem;
  margin-bottom: 9rem;
}

.product__item {
  flex-basis: calc((100% - 10rem) / 3);
  border-bottom: 1px dotted #00759c;
}
@media screen and (max-width: 1024px) {
  .product__item {
    flex-basis: calc((100% - 7rem) / 2);
  }
}
@media screen and (max-width: 540px) {
  .product__item {
    flex-basis: calc((100% - 2rem) / 1);
  }
}

.product__link {
  display: block;
  position: relative;
  padding-bottom: 2.2rem;
}
.product__orderWrap {
  display: block;
  position: relative;
  padding-bottom: 2.2rem;
}

.product__img {
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-bottom: 2.2rem;
}
.product__img img {
  transition: all 0.2s var(--var-animation-timing-function);
  transform: scale(1);
  width: 100%;
}

.product__tag__box {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.product__tag {
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3rem;
  min-width: 9.4rem;
  border-radius: 1.5rem;
  padding: 0 1rem;
  background-color: #00759c;
  background-color: #355055c;
  color: #FFF;
  font-size: 1.5rem;
  margin-left: 0.8rem;
}
@media screen and (max-width: 1024px) {
  .product__tag {
    top: 2.2rem;
    right: 1.8rem;
    padding: 0 2rem;
    height: 4.8rem;
    border-radius: 2.4rem;
    font-size: 2.2rem;
  }
}

.product__title {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .product__title {
    align-items: flex-start;
  }
}
.product__title .title {
  width: calc(100% - 2.6rem);
  padding-right: 1rem;
  font-size: 18px;
  line-height: 1.5;
}
@media screen and (max-width: 1024px) {
  .product__title .title {
    font-size: 2.8rem;
  }
}
.product__title .icon {
  width: 2.6rem;
  transition: all 0.2s var(--var-animation-timing-function);
  transform: scale(1);
}
@media screen and (max-width: 1024px) {
  .product__title .icon {
    height: 2.6rem;
    margin-top: 0.8rem;
  }
  .product__title .icon img {
    display: block;
  }
}

.product__link:hover .product__img img {
  transform: scale(1.05);
}
.product__link:hover .product__title .icon {
  transform: scale(1.2);
}


.product__paragraph {
  line-height: 2;
  color: #333;
  padding-right: 3.5rem;
}


/*****  製品スペック  *****************************/
.product__spec__wrap {
  display: block;
  position: relative;
  margin-bottom: 9rem;
}

.spec__lead {
  font-size: 16px;
  margin-bottom: 5rem;
}

@media screen and (max-width: 1024px) {
  .spec__lead {
    font-size: 1.8rem;
  }
}

.product__spec__item {
    width: 70%;
    /*border-bottom: 1px dotted #00759c;*/
    margin-bottom: 3rem;
  margin: 0 auto 3rem;
}
@media screen and (max-width: 540px) {
.product__spec__item {
    width: 100%;
  }
}

.product__spec_img {
    text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  /*margin: 0 auto 2.2rem;*/
}
.product__spec__img img {
  transition: all 0.2s var(--var-animation-timing-function);
  transform: scale(1);
  width: 100%;
}

/*.product__tag__box {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.product__tag {
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3rem;
  min-width: 9.4rem;
  border-radius: 1.5rem;
  padding: 0 1rem;
  background-color: #00759c;
  background-color: #355055c;
  color: #FFF;
  font-size: 1.5rem;
  margin-left: 0.8rem;
}
@media screen and (max-width: 1024px) {
  .product__tag {
    top: 2.2rem;
    right: 1.8rem;
    padding: 0 2rem;
    height: 4.8rem;
    border-radius: 2.4rem;
    font-size: 2.2rem;
  }
}
*/
.product__spac__title {
  display: flex;
  align-items: center;
}


@media screen and (max-width: 1024px) {
  .product__spec__title {
    align-items: flex-start;
  }
}
.product__spec__title .title {
  width: calc(100% - 2.6rem);
  padding-right: 1rem;
    font-weight: 700;
font-size: 2.2rem;
  line-height: 1.5;
}


@media screen and (max-width: 1024px) {
  .product__spec__title .title {
    font-size: 2.8rem;
  }
}
/*.product__spec__title .icon {
  width: 2.6rem;
  transition: all 0.2s var(--var-animation-timing-function);
  transform: scale(1);
}
@media screen and (max-width: 1024px) {
  .product__spec__title .icon {
    height: 2.6rem;
    margin-top: 0.8rem;
  }
  .product__spec__title .icon img {
    display: block;
  }
}*/



.spec__tb {
  position: relative;
  width: 100%;
border-top: solid #e5e5e5 1px; 
    margin-bottom: 4rem;
}

.spec__tb caption {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.spec__tb th {
  width: 20rem;
  font-weight: 700;
  text-align: left;
  vertical-align: middle;
  background: #f0f9fb;
  color: #666;
  position: relative;
  padding: 1.5rem 2rem 1.5rem;
  z-index: 1;
border-bottom: solid #e5e5e5 1px;    
}

@media screen and (max-width: 1024px) {
  .spec__tb th {
    width: 17.5rem;
  }
  .spec__tb th,
  .spec__tb td    {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .spec__tb th {
    width: 15.5rem;
  }
  .spec__tb th,
  .spec__tb td    {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 540px) {
  .spec__tb th {
    width: 12.5rem;
  }
  .spec__tb th,
  .spec__tb td    {
    font-size: 2rem;
  }
}



.spec__tb.nobd {
border: none; 
margin-bottom: 2rem;
}

.spec__tb__nobd th,
.spec__tb__nobd td {
  padding: 2.5rem 2.5rem 1rem;
    border-bottom: none; 
}

/*.history__tb th::after {
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 100%;
  background-color: #005eaf;
  position: absolute;
  top: 1rem;
  right: -5px;
}
@media screen and (max-width: 1024px) {
  .history__tb th::after {
    top: 2rem;
    right: -0.5rem;
  }
}*/
.spec__tb td {
  vertical-align: top;
  padding: 1.5rem 2rem 1.5rem;
  color: #111;
  margin : 1rem 0;
    border-bottom: solid #e5e5e5 1px;
    /*text-align: center;*/
}

.spec__tb td.alignleft {
  vertical-align: top;
    text-align: left;
}