@charset "UTF-8";

.hdg-lv2-03__title,
.matrix-chart__product-name,
.matrix-chart__product-price {
  font-family: "Clarimo UD PE DemiBold", "UD Shin Go Conde90 DB", sans-serif;
  font-weight: bold;
}

.hdg-01 {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 24px;
}

.hdg-02 {
  font-size: 18px;
  position: relative;
  margin-bottom: 10px;
  padding-left: 40px;
}

.hdg-02.type-icon-01::before {
  text-align: center;
  background-image: url("/common/renew/images/icon-info-03.png");
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 0;
  top: 0;
  left: 0;
  display: block;
  width: 31px;
  height: 29px;
  content: "";
}

.mark-new {
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 1px;
  color: #e54ba3;
  background: #fff;
  display: inline-block;
  margin-right: 15px;
  padding: 2px 5px;
  border: solid 1px #e54ba3;
}

.mark-doc-wrapper {
  margin-top: 10px;
  margin-bottom: 10px;
}

:is(.mark-doc-01, .mark-doc-02, .mark-doc-03) {
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 1px;
  color: #6daf3d;
  background: #fff;
  display: inline-block;
  margin-right: 1px;
  margin-bottom: 5px;
  padding: 2px 5px;
  border: solid 1px #6daf3d;
}

.mark-doc-01 {
  color: #6daf3d;
  border: solid 1px #6daf3d;
}

.mark-doc-02 {
  color: #e67600;
  border: solid 1px #e67600;
}

.mark-doc-03 {
  color: #737373;
  border: solid 1px #737373;
}

.box-layout-image.image-l > .content .list-link-01 > li {
  margin-bottom: 0;
}

.btn-mw290 {
  width: 100%;
  max-width: 290px;
}

.w430 {
  max-width: 430px;
}

.lp-box__inner > [class^=hdg-]:first-child,
.lp-box-02 > [class^=hdg-]:first-child {
  margin-top: 0;
}

.btn-action:not(.btn-disabled),
.btn-action.btn-disabled {
  font-family: "Clarimo UD PE Regular", "UD Shin Go Conde90 R", sans-serif;
  font-weight: normal;
}

.product-box__price .tax-txt {
  font-family: "Clarimo UD PE Regular", "UD Shin Go Regular", sans-serif;
  font-weight: normal;
}

.hdg-wrapper-lv1,
.product-box__name,
.product-box__price {
  font-family: "Clarimo UD PE DemiBold", "UD Shin Go DemiBold", sans-serif;
  font-weight: bold;
}

.under-line {
  background: linear-gradient(transparent 50%, #fff5d3 0%);
  background-position-y: -2px;
}

/* ============================================================================
* 見出しモジュール
* ========================================================================= */
.hdg-wrapper-lv1 .hdg-lv1-01 {
  font-size: 24px;
}

.hdg-wrapper-lv1 .subtitle {
  font-size: 46px;
}

.hdg-lv2-02 {
  font-size: 38px;
}

.hdg-lv2-02.type-05,
.hdg-lv2-02.type-06 {
  position: relative;
  padding-bottom: 0;
  padding-left: 75px;
  border-bottom: 0;
}

.hdg-lv2-02.type-05::before,
.hdg-lv2-02.type-06::before {
  text-align: center;
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 48px;
  height: 48px;
  content: "";
  transform: translateY(-20%);
}

.hdg-lv2-02.type-05::before {
  background-image: url("/contents/printer/images/hdg-icon-color-01.png");
}

.hdg-lv2-02.type-06::before {
  background-image: url("/contents/printer/images/hdg-icon-color-02.png");
}

.hdg-lv2-03 {
  display: flex;
  justify-content: flex-start;

  column-gap: 20px;
}
.hdg-lv2-03__title {
  font-size: 38px;
}
.hdg-lv2-03 .mark-doc-wrapper {
  margin-top: 0;
  margin-bottom: 0;
}

.hdg-lv3-04 {
  margin-bottom: 20px;
}

.hdg-lv3-04.type-05 {
  color: #fff;
  padding-left: 40px;
}

.hdg-lv3-04.type-05::before {
  background-image: url("/contents/printer/images/icon-notice-02.png");
  top: -1px;
  width: 27px;
  height: 31px;
}

.hdg-lv3-04.type-06 {
  color: #333;
  padding-left: 40px;
}

.hdg-lv3-04.type-06::before {
  background-image: url("/common/renew/images/icon-notice-01.png");
  top: -1px;
  width: 27px;
  height: 31px;
}

/* ============================================================================
* レイアウトモジュール
* ========================================================================= */
.lp-box__inner {
  background-color: #4db9d4;
  padding: 18px;
}

.lp-box__inner .inner {
  padding: 0 20px 20px 20px;
}

.lp-box__inner .inner .img {
  margin: auto !important;
}

.lp-box-02 {
  background-color: #f6f6f6;
  padding: 18px;
}

.lp-box-02__content {
  background-color: #fff;
  padding: 15px;
  border: 1px solid #dcdcdc;
}

.lp-box-02__content .img {
  text-align: center;
}

.lp-box-02__content .product-box__name {
  margin-bottom: 10px;
}

.layout-panel-flex {
  background-color: #fff;
}

.layout-panel-flex > .inner {
  margin-top: 0;
}

.product-box__feature {
  margin-bottom: 15px;
}

.product-box__name {
  font-size: 18px;
  color: #386499;
}

.product-box__price {
  font-size: 56px;
  color: #fb0020;
}

.product-box__price .tax-txt {
  font-size: 14px;
  color: #333;
}

.product-box__price.-small {
  font-size: 36px;
}

.feature-list {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.feature-list__item {
  display: block;
}

.feature-list__item img {
  width: 100%;

  object-fit: contain;
}

.feature-list__item:first-child {
  margin-right: 10px;
}

.feature-list__item:not(:first-child) {
  margin-right: 20px;
}

.discount-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.discount-price-box {
  display: flex;
  justify-content: flex-start;

  column-gap: 13px;
}

.discount-content__txt {
  font-family: "Clarimo UD PE DemiBold", "UD Shin Go DemiBold", sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #fb0020;
  width: -moz-fit-content;
  width: fit-content;
}

.discount-price-box__price {
  font-family: "Clarimo UD PE DemiBold", "UD Shin Go DemiBold", sans-serif;
  font-size: 21px;
  font-weight: bold;
  color: #fb0020;
  position: relative;
  display: flex;
  align-items: flex-end;
  margin-bottom: 0 !important;
  padding-bottom: 5px;
}

.discount-price-box__discount {
  position: relative;
}

.discount-price-box__discount::before {
  font-size: 18px;
  color: #333;
  position: absolute;
  top: 20%;
  left: -17px;
  display: block;
  content: "▶";
}

.discount-price-box__tax {
  font-family: "Clarimo UD PE Regular", "UD Shin Go Regular", sans-serif;
  font-size: 14px;
  font-weight: normal;
}

.box-layout-image.image-l:not(.hdg-wrapper) > .content {
  padding-left: 10px;
}

/* ============================================================================
* ボタンモジュール
* ========================================================================= */
.btn-wrapper {
  margin-top: 5px;
  margin-bottom: 10px;
}

.btn-action:not(.btn-disabled),
.btn-action.btn-disabled {
  width: 100%;
  min-width: 0;
}

/* ============================================================================
* マトリクス要素
* ========================================================================= */
.matrix-chart {
  position: relative;
  width: auto;
  max-width: 960px;
  max-height: 569px;
  margin: 70px auto;

  aspect-ratio: 960/569;
}
.matrix-chart__bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  max-width: 960px;
  height: 100%;
}
.matrix-chart__bg-text {
  position: absolute;
  top: 28.2828282828%;
  left: 63.5416666667%;
}
.matrix-chart__list-item {
  position: absolute;
}
.matrix-chart__list-item .matrix-chart__product {
  z-index: 2;
}
.matrix-chart__list-item--multi-C2410SD {
  top: 41.8181818182%;
  left: 21.875%;
  width: 26.25%;
}
.matrix-chart__list-item--multi-C2410SD .matrix-chart__product {
  bottom: 92%;
  left: -10%;
}
.matrix-chart__list-item--multi-C2410SD .matrix-chart__link::before {
  top: -11%;
  left: 24%;
}
.matrix-chart__list-item--multi-C320z {
  top: 16.9696969697%;
  left: 45.8333333333%;
  width: 21.9791666667%;
}
.matrix-chart__list-item--multi-C320z .matrix-chart__product {
  bottom: 86%;
  left: -37%;
}
.matrix-chart__list-item--multi-C320z .matrix-chart__link::before {
  top: -7%;
  left: -1%;
}
.matrix-chart__list-item--multi-3410SD {
  top: 44.0404040404%;
  left: 50.8333333333%;
  width: 16.6666666667%;
}
.matrix-chart__list-item--multi-3410SD .matrix-chart__product {
  bottom: 72%;
  left: -46%;
}
.matrix-chart__list-item--multi-3410SD .matrix-chart__link::before {
  top: 14%;
  left: 0;
}
.matrix-chart__list-item--multi-4020SD {
  top: 36.9696969697%;
  left: 67.7083333333%;
  width: 18.3333333333%;
}
.matrix-chart__list-item--multi-4020SD .matrix-chart__product {
  bottom: 72%;
  left: -44%;
}
.matrix-chart__list-item--multi-4020SD .matrix-chart__link::before {
  top: 14%;
  left: 0;
}
.matrix-chart__list-item--printer-C2410SD {
  top: 46.8686868687%;
  left: 21.9791666667%;
  width: 26.4583333333%;
}
.matrix-chart__list-item--printer-C2410SD .matrix-chart__product {
  bottom: 72%;
  left: -15%;
}
.matrix-chart__list-item--printer-C2410SD .matrix-chart__link::before {
  bottom: 47%;
  left: 27%;
}
.matrix-chart__list-item--printer-C320dw {
  top: 45.8585858586%;
  left: 46.0416666667%;
  width: 13.9583333333%;
}
.matrix-chart__list-item--printer-C320dw .matrix-chart__product {
  bottom: 111%;
  left: -61%;
}
.matrix-chart__list-item--printer-C320dw .matrix-chart__link::before {
  bottom: 64%;
  left: -1%;
}
.matrix-chart__list-item--printer-C3530 {
  top: 22.0202020202%;
  left: 53.9583333333%;
  width: 12.5%;
}
.matrix-chart__list-item--printer-C3530 .matrix-chart__product {
  bottom: 104%;
  left: -71%;
}
.matrix-chart__list-item--printer-C3530 .matrix-chart__link::before {
  bottom: 73%;
  left: -7%;
}
.matrix-chart__list-item--printer-C4030 {
  top: 8.0808080808%;
  left: 66.0416666667%;
  width: 22.7083333333%;
}
.matrix-chart__list-item--printer-C4030 .matrix-chart__product {
  bottom: 90%;
  left: -42%;
}
.matrix-chart__list-item--printer-C4030 .matrix-chart__link::before {
  bottom: 65%;
  left: -4%;
}
.matrix-chart__list-item--printer-3410SD {
  top: 49.898989899%;
  left: 45.5208333333%;
  width: 21.0416666667%;
}
.matrix-chart__list-item--printer-3410SD .matrix-chart__product {
  bottom: 68%;
  left: -26%;
}
.matrix-chart__list-item--printer-3410SD .matrix-chart__link::before {
  bottom: 43%;
  left: 26%;
}
.matrix-chart__list-item--printer-4020SD {
  top: 56.9696969697%;
  left: 66.0416666667%;
  width: 15.2083333333%;
}
.matrix-chart__list-item--printer-4020SD .matrix-chart__product {
  bottom: 105%;
  left: -70%;
}
.matrix-chart__list-item--printer-4020SD .matrix-chart__link::before {
  bottom: 62%;
  left: 2%;
}
.matrix-chart__list-item--printer-4620SDW {
  top: 51.9191919192%;
  left: 76.9791666667%;
  width: 15%;
}
.matrix-chart__list-item--printer-4620SDW .matrix-chart__product {
  bottom: 105%;
  left: -70%;
}
.matrix-chart__list-item--printer-4620SDW .matrix-chart__link::before {
  bottom: 62%;
  left: 2%;
}
.matrix-chart__list-item--printer-4830 {
  top: 26.2626262626%;
  left: 81.9791666667%;
  width: 13.6458333333%;
}
.matrix-chart__list-item--printer-4830 .matrix-chart__product {
  bottom: 65%;
  left: -55%;
}
.matrix-chart__list-item--printer-4830 .matrix-chart__link::before {
  bottom: 8%;
  left: -3%;
}
.matrix-chart__link::before {
  background-image: url("/contents/printer/images/icon_message.png");
  background-repeat: no-repeat;
  position: absolute;
  display: block;
  width: 49px;
  height: 54px;
  content: "";
}
.matrix-chart__link:hover::before,
.matrix-chart__link:focus::before {
  display: none;
}
.matrix-chart__product {
  position: absolute;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
}
.matrix-chart__product-inner {
  text-align: center;
  background: #fff;
  width: 100%;
  max-width: 252px;
  height: 100%;
  padding: 10px 15px;
  border: 2px solid #01916d;
}
.matrix-chart__product-inner::before {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0;
  margin-bottom: -20px;
  margin-left: -9.5px;
  content: "";
  border: 20px solid transparent;
  border-top-color: #01916d;
  border-right: 0;
  border-bottom: 0;
}
.matrix-chart__product-inner::after {
  position: absolute;
  z-index: 2;
  bottom: 4px;
  left: 50%;
  width: 0;
  height: 0;
  margin-bottom: -19px;
  margin-left: -9.2px;
  content: "";
  border: 18px solid transparent;
  border-top-color: #fff;
  border-right: 0;
  border-bottom: 0;
}
.matrix-chart__product-name {
  font-size: 16px;
  color: #333;
  margin-bottom: 6px !important;
}
.matrix-chart__product-price {
  font-size: 23px;
  color: #fb0020;
}
.matrix-chart__product-price-tax {
  font-size: 14px;
}