@charset "utf-8";
/*
   COLOR
--------------------------------------------------------------*/

/* font color */
.fc {
  color: var(--color-font);
}
.fc-base {
  color: var(--color-base);
}
.fc-base1 {
  color: var(--color-base1);
}
.fc-base2 {
  color: var(--color-base2);
}
.fc-base3 {
  color: var(--color-base3);
}
.fc-base4 {
  color: var(--color-base4);
}
.fc-accent {
  color: var(--color-accent);
}
.fc-gold2 {
  color: var(--color-gold2);
}
.fc-navy {
  color: var(--color-navy);
}

.fc-000 {
  color: var(--color-000);
}
.fc-111 {
  color: var(--color-111);
}
.fc-222 {
  color: var(--color-222);
}
.fc-333 {
  color: var(--color-333);
}
.fc-444 {
  color: var(--color-444);
}
.fc-555 {
  color: var(--color-555);
}
.fc-666 {
  color: var(--color-666);
}
.fc-777 {
  color: var(--color-777);
}
.fc-888 {
  color: var(--color-888);
}
.fc-999 {
  color: var(--color-999);
}
.fc-aaa {
  color: var(--color-aaa);
}
.fc-bbb {
  color: var(--color-bbb);
}
.fc-ccc {
  color: var(--color-ccc);
}
.fc-ddd {
  color: var(--color-ddd);
}
.fc-eee {
  color: var(--color-eee);
}
.fc-fff {
  color: var(--color-fff);
}
.fc-red {
  color: var(--color-red);
}

/* background color */
.bgc-base {
  background-color: var(--color-base);
}
.bgc-base1 {
  background-color: var(--color-base1);
}
.bgc-base2 {
  background-color: var(--color-base2);
}
.bgc-base3 {
  background-color: var(--color-base3);
}
.bgc-base4 {
  background-color: var(--color-base4);
}
.bgc-accent {
  background-color: var(--color-accent);
}
.bgc-gold2 {
  background-color: var(--color-gold2);
}
.bgc-navy {
  background-color: var(--color-navy);
}

.bgc-grad {
  background: var(--color-grad);
}
.bgc-grad1 {
  background: var(--color-grad1);
}
.bgc-grad2 {
  background: var(--color-grad2);
}
.bgc-grad3 {
  background: var(--color-grad3);
}

.bgc-grad-btn {
  background: var(--color-grad-btn);
}
.bgc-grad-document {
  background: var(--color-grad-document);
}
.bgc-grad-line {
  background: var(--color-grad-line);
}

.fc-document {
  color: var(--color-document);
}
.fc-line {
  color: var(--color-line);
}

.svgc-document {
  fill: var(--color-document);
}
.svgc-line {
  fill: var(--color-line);
}

.bgc-000 {
  background-color: var(--color-000);
}
.bgc-111 {
  background-color: var(--color-111);
}
.bgc-222 {
  background-color: var(--color-222);
}
.bgc-333 {
  background-color: var(--color-333);
}
.bgc-444 {
  background-color: var(--color-444);
}
.bgc-555 {
  background-color: var(--color-555);
}
.bgc-666 {
  background-color: var(--color-666);
}
.bgc-777 {
  background-color: var(--color-777);
}
.bgc-888 {
  background-color: var(--color-888);
}
.bgc-999 {
  background-color: var(--color-999);
}
.bgc-aaa {
  background-color: var(--color-aaa);
}
.bgc-bbb {
  background-color: var(--color-bbb);
}
.bgc-ccc {
  background-color: var(--color-ccc);
}
.bgc-ddd {
  background-color: var(--color-ddd);
}
.bgc-eee {
  background-color: var(--color-eee);
}
.bgc-fff {
  background-color: var(--color-fff);
}

/* border color */
.bc-base {
  border-color: var(--color-base);
}
.bc-base1 {
  border-color: var(--color-base1);
}
.bc-base2 {
  border-color: var(--color-base2);
}
.bc-base3 {
  border-color: var(--color-base3);
}
.bc-base4 {
  border-color: var(--color-base4);
}
.bc-accent {
  border-color: var(--color-accent);
}
.bgc-gold2 {
  border-color: var(--color-gold2);
}

.bc-000 {
  border-color: var(--color-000);
}
.bc-111 {
  border-color: var(--color-111);
}
.bc-222 {
  border-color: var(--color-222);
}
.bc-333 {
  border-color: var(--color-333);
}
.bc-444 {
  border-color: var(--color-444);
}
.bc-555 {
  border-color: var(--color-555);
}
.bc-666 {
  border-color: var(--color-666);
}
.bc-777 {
  border-color: var(--color-777);
}
.bc-888 {
  border-color: var(--color-888);
}
.bc-999 {
  border-color: var(--color-999);
}
.bc-aaa {
  border-color: var(--color-aaa);
}
.bc-bbb {
  border-color: var(--color-bbb);
}
.bc-ccc {
  border-color: var(--color-ccc);
}
.bc-ddd {
  border-color: var(--color-ddd);
}
.bc-eee {
  border-color: var(--color-eee);
}
.bc-fff {
  border-color: var(--color-fff);
}

/* svg color */
.svgc-base {
  fill: var(--color-base);
}
.svgc-base1 {
  fill: var(--color-base1);
}
.svgc-base2 {
  fill: var(--color-base2);
}
.svgc-base3 {
  fill: var(--color-base3);
}
.svgc-base4 {
  fill: var(--color-base4);
}
.svgc-accent {
  fill: var(--color-accent);
}

.svgc-000 {
  fill: var(--color-000);
}
.svgc-111 {
  fill: var(--color-111);
}
.svgc-222 {
  fill: var(--color-222);
}
.svgc-333 {
  fill: var(--color-333);
}
.svgc-444 {
  fill: var(--color-444);
}
.svgc-555 {
  fill: var(--color-555);
}
.svgc-666 {
  fill: var(--color-666);
}
.svgc-777 {
  fill: var(--color-777);
}
.svgc-888 {
  fill: var(--color-888);
}
.svgc-999 {
  fill: var(--color-999);
}
.svgc-aaa {
  fill: var(--color-aaa);
}
.svgc-bbb {
  fill: var(--color-bbb);
}
.svgc-ccc {
  fill: var(--color-ccc);
}
.svgc-ddd {
  fill: var(--color-ddd);
}
.svgc-eee {
  fill: var(--color-eee);
}
.svgc-fff {
  fill: var(--color-fff);
}

/*
   FONT
--------------------------------------------------------------*/
.jp {
  font-family: var(--jp);
}
.jp-accent {
  font-family: var(--jp-accent);
}
.en {
  font-family: var(--en);
}
.en-accent {
  font-family: var(--en-accent);
}

.fw-n:lang(ja) {
  font-weight: var(--fw-n-jp);
}
.fw-n.jp-accent:lang(ja) {
  font-weight: var(--fw-n-jp-accent);
}
.fw-n:lang(en) {
  font-weight: var(--fw-n-en);
}
.fw-b:lang(ja) {
  font-weight: var(--fw-b-jp);
}
.fw-b.jp-accent:lang(ja) {
  font-weight: var(--fw-b-jp-accent);
}
.fw-b:lang(en) {
  font-weight: var(--fw-b-en);
}
.fw-Eb {
  font-weight: 800;
}

/* 
TEXT-SHADOW

*/
.text-shadow {
  text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25);
}
.text-shadow-2 {
  text-shadow: 3px 4px 3px rgba(0, 0, 0, 0.25);
}


/*
   FONT SIZE
--------------------------------------------------------------*/
.fs-8 {
  font-size: 8px;
}
.fs-10 {
  font-size: 10px;
}
.fs-11 {
  font-size: 11px;
}
.fs-12 {
  font-size: 12px;
}
.fs-13 {
  font-size: 13px;
}
.fs-14 {
  font-size: 14px;
}
.fs-15 {
  font-size: 15px;
}
.fs-16 {
  font-size: 16px;
}
.fs-17 {
  font-size: 17px;
}
.fs-18 {
  font-size: 18px;
}
.fs-19 {
  font-size: 19px;
}
.fs-20 {
  font-size: calc(20px * var(--font-size-ratio));
}
.fs-22 {
  font-size: calc(22px * var(--font-size-ratio));
}
.fs-24 {
  font-size: calc(24px * var(--font-size-ratio));
}
.fs-26 {
  font-size: calc(26px * var(--font-size-ratio));
}
.fs-28 {
  font-size: calc(28px * var(--font-size-ratio));
}
.fs-30 {
  font-size: calc(30px * var(--font-size-ratio));
}
.fs-32 {
  font-size: calc(32px * var(--font-size-ratio));
}
.fs-34 {
  font-size: calc(34px * var(--font-size-ratio));
}
.fs-36 {
  font-size: calc(36px * var(--font-size-ratio));
}
.fs-38 {
  font-size: calc(38px * var(--font-size-ratio));
}
.fs-40 {
  font-size: calc(40px * var(--font-size-ratio));
}
.fs-42 {
  font-size: calc(42px * var(--font-size-ratio));
}
.fs-44 {
  font-size: calc(44px * var(--font-size-ratio));
}
.fs-46 {
  font-size: calc(46px * var(--font-size-ratio));
}
.fs-48 {
  font-size: calc(48px * var(--font-size-ratio));
}
.fs-50 {
  font-size: calc(50px * var(--font-size-ratio));
}
.fs-52 {
  font-size: calc(52px * var(--font-size-ratio));
}
.fs-54 {
  font-size: calc(54px * var(--font-size-ratio));
}
.fs-56 {
  font-size: calc(56px * var(--font-size-ratio));
}
.fs-58 {
  font-size: calc(58px * var(--font-size-ratio));
}
.fs-60 {
  font-size: calc(60px * var(--font-size-ratio));
}
.fs-62 {
  font-size: calc(62px * var(--font-size-ratio));
}
.fs-64 {
  font-size: calc(64px * var(--font-size-ratio));
}
.fs-66 {
  font-size: calc(66px * var(--font-size-ratio));
}
.fs-68 {
  font-size: calc(68px * var(--font-size-ratio));
}
.fs-70 {
  font-size: calc(70px * var(--font-size-ratio));
}
.fs-72 {
  font-size: calc(72px * var(--font-size-ratio));
}
.fs-74 {
  font-size: calc(74px * var(--font-size-ratio));
}
.fs-76 {
  font-size: calc(76px * var(--font-size-ratio));
}
.fs-78 {
  font-size: calc(78px * var(--font-size-ratio));
}
.fs-80 {
  font-size: calc(80px * var(--font-size-ratio));
}

@media (max-width: 1023px) {
  /*.fs-10 { font-size: 10px }
  .fs-11 { font-size: 11px }
  .fs-12 { font-size: 12px }*/
  .fs-13 {
    font-size: 12px;
  }
  .fs-14 {
    font-size: 13px;
  }
  .fs-15 {
    font-size: 13px;
  }
  .fs-16 {
    font-size: 13px;
  }
  .fs-17 {
    font-size: 14px;
  }
  .fs-18 {
    font-size: 14px;
  }
  .fs-19 {
    font-size: 14px;
  }
}
@media (min-width: 768px) {
  /*.fs-10 { font-size: 10px }
  .fs-11 { font-size: 11px }
  .fs-12 { font-size: 12px }
  .fs-13 { font-size: 13px }
  .fs-14 { font-size: 13px }*/
  .fs-15 {
    font-size: calc(15px * var(--font-size-ratio));
  }
  .fs-16 {
    font-size: calc(16px * var(--font-size-ratio));
  }
  .fs-17 {
    font-size: calc(17px * var(--font-size-ratio));
  }
  .fs-18 {
    font-size: calc(18px * var(--font-size-ratio));
  }
  .fs-19 {
    font-size: calc(19px * var(--font-size-ratio));
  }
}

@media (max-width: 1023px) {
  .fs-10-sp {
    font-size: 10px;
  }
  .fs-11-sp {
    font-size: 11px;
  }
  .fs-12-sp {
    font-size: 12px;
  }
  .fs-13-sp {
    font-size: 13px;
  }
  .fs-14-sp {
    font-size: 14px;
  }
  .fs-15-sp {
    font-size: 15px;
  }
  .fs-16-sp {
    font-size: 16px;
  }
  .fs-17-sp {
    font-size: 17px;
  }
  .fs-18-sp {
    font-size: 18px;
  }
  .fs-19-sp {
    font-size: 19px;
  }
  .fs-20-sp {
    font-size: 20px;
  }
  .fs-22-sp {
    font-size: 22px;
  }
  .fs-24-sp {
    font-size: 24px;
  }
  .fs-26-sp {
    font-size: 26px;
  }
  .fs-28-sp {
    font-size: 28px;
  }
  .fs-30-sp {
    font-size: 30px;
  }
  .fs-32-sp {
    font-size: 32px;
  }
  .fs-34-sp {
    font-size: 34px;
  }
  .fs-36-sp {
    font-size: 36px;
  }
  .fs-38-sp {
    font-size: 38px;
  }
  .fs-40-sp {
    font-size: 40px;
  }
  .fs-42-sp {
    font-size: 42px;
  }
  .fs-44-sp {
    font-size: 44px;
  }
  .fs-46-sp {
    font-size: 46px;
  }
  .fs-48-sp {
    font-size: 48px;
  }
  .fs-50-sp {
    font-size: 50px;
  }
  .fs-52-sp {
    font-size: 52px;
  }
  .fs-54-sp {
    font-size: 54px;
  }
  .fs-56-sp {
    font-size: 56px;
  }
  .fs-58-sp {
    font-size: 58px;
  }
  .fs-60-sp {
    font-size: 60px;
  }
  .fs-62-sp {
    font-size: 62px;
  }
  .fs-64-sp {
    font-size: 64px;
  }
  .fs-66-sp {
    font-size: 66px;
  }
  .fs-68-sp {
    font-size: 68px;
  }
  .fs-70-sp {
    font-size: 70px;
  }
  .fs-72-sp {
    font-size: 72px;
  }
  .fs-74-sp {
    font-size: 74px;
  }
  .fs-76-sp {
    font-size: 76px;
  }
  .fs-78-sp {
    font-size: 78px;
  }
  .fs-80-sp {
    font-size: 80px;
  }
  .fs-110-sp {
    font-size: 110px;
  }
}
@media (min-width: 768px) {
  .fs-10-tpc {
    font-size: 10px;
  }
  .fs-11-tpc {
    font-size: 11px;
  }
  .fs-12-tpc {
    font-size: 12px;
  }
  .fs-13-tpc {
    font-size: 13px;
  }
  .fs-14-tpc {
    font-size: 14px;
  }
  .fs-15-tpc {
    font-size: 15px;
  }
  .fs-16-tpc {
    font-size: 16px;
  }
  .fs-17-tpc {
    font-size: 17px;
  }
  .fs-18-tpc {
    font-size: 18px;
  }
  .fs-19-tpc {
    font-size: 19px;
  }
  .fs-20-tpc {
    font-size: 20px;
  }
  .fs-22-tpc {
    font-size: 22px;
  }
  .fs-24-tpc {
    font-size: 24px;
  }
  .fs-26-tpc {
    font-size: 26px;
  }
  .fs-28-tpc {
    font-size: 28px;
  }
  .fs-30-tpc {
    font-size: 30px;
  }
  .fs-32-tpc {
    font-size: 32px;
  }
  .fs-34-tpc {
    font-size: 34px;
  }
  .fs-36-tpc {
    font-size: 36px;
  }
  .fs-38-tpc {
    font-size: 38px;
  }
  .fs-40-tpc {
    font-size: 40px;
  }
  .fs-42-tpc {
    font-size: 42px;
  }
  .fs-44-tpc {
    font-size: 44px;
  }
  .fs-46-tpc {
    font-size: 46px;
  }
  .fs-48-tpc {
    font-size: 48px;
  }
  .fs-50-tpc {
    font-size: 50px;
  }
  .fs-52-tpc {
    font-size: 52px;
  }
  .fs-54-tpc {
    font-size: 54px;
  }
  .fs-56-tpc {
    font-size: 56px;
  }
  .fs-58-tpc {
    font-size: 58px;
  }
  .fs-60-tpc {
    font-size: 60px;
  }
  .fs-62-tpc {
    font-size: 62px;
  }
  .fs-64-tpc {
    font-size: 64px;
  }
  .fs-66-tpc {
    font-size: 66px;
  }
  .fs-68-tpc {
    font-size: 68px;
  }
  .fs-70-tpc {
    font-size: 70px;
  }
  .fs-72-tpc {
    font-size: 72px;
  }
  .fs-74-tpc {
    font-size: 74px;
  }
  .fs-76-tpc {
    font-size: 76px;
  }
  .fs-78-tpc {
    font-size: 78px;
  }
  .fs-80-tpc {
    font-size: 80px;
  }
}
@media (min-width: 1024px) {
  .fs-10-pc {
    font-size: 10px;
  }
  .fs-11-pc {
    font-size: 11px;
  }
  .fs-12-pc {
    font-size: 12px;
  }
  .fs-13-pc {
    font-size: 13px;
  }
  .fs-14-pc {
    font-size: 14px;
  }
  .fs-15-pc {
    font-size: 15px;
  }
  .fs-16-pc {
    font-size: 16px;
  }
  .fs-17-pc {
    font-size: 17px;
  }
  .fs-18-pc {
    font-size: 18px;
  }
  .fs-19-pc {
    font-size: 19px;
  }
  .fs-20-pc {
    font-size: 20px;
  }
  .fs-22-pc {
    font-size: 22px;
  }
  .fs-24-pc {
    font-size: 24px;
  }
  .fs-26-pc {
    font-size: 26px;
  }
  .fs-28-pc {
    font-size: 28px;
  }
  .fs-30-pc {
    font-size: 30px;
  }
  .fs-32-pc {
    font-size: 32px;
  }
  .fs-34-pc {
    font-size: 34px;
  }
  .fs-36-pc {
    font-size: 36px;
  }
  .fs-38-pc {
    font-size: 38px;
  }
  .fs-40-pc {
    font-size: 40px;
  }
  .fs-42-pc {
    font-size: 42px;
  }
  .fs-44-pc {
    font-size: 44px;
  }
  .fs-46-pc {
    font-size: 46px;
  }
  .fs-48-pc {
    font-size: 48px;
  }
  .fs-50-pc {
    font-size: 50px;
  }
  .fs-52-pc {
    font-size: 52px;
  }
  .fs-54-pc {
    font-size: 54px;
  }
  .fs-56-pc {
    font-size: 56px;
  }
  .fs-58-pc {
    font-size: 58px;
  }
  .fs-60-pc {
    font-size: 60px;
  }
  .fs-62-pc {
    font-size: 62px;
  }
  .fs-64-pc {
    font-size: 64px;
  }
  .fs-66-pc {
    font-size: 66px;
  }
  .fs-68-pc {
    font-size: 68px;
  }
  .fs-70-pc {
    font-size: 70px;
  }
  .fs-72-pc {
    font-size: 72px;
  }
  .fs-74-pc {
    font-size: 74px;
  }
  .fs-76-pc {
    font-size: 76px;
  }
  .fs-78-pc {
    font-size: 78px;
  }
  .fs-80-pc {
    font-size: 80px;
  }
  .fs-96-pc {
    font-size: 96px;
  }
  .fs-116-pc {
    font-size: 116px;
  }
  .fs-220-pc {
    font-size: 220px;
  }
}

/*
   TEXT ALIGN
--------------------------------------------------------------*/
.t-c {
  text-align: center;
}
.t-l {
  text-align: left;
}
.t-r {
  text-align: right;
}

@media screen and (max-width: 1023px) {
  .t-c-sp {
    text-align: center;
  }
  .t-l-sp {
    text-align: left;
  }
  .t-r-sp {
    text-align: right;
  }
}
@media screen and (min-width: 768px) {
  .t-c-tpc {
    text-align: center;
  }
  .t-l-tpc {
    text-align: left;
  }
  .t-r-tpc {
    text-align: right;
  }
}
@media screen and (min-width: 1024px) {
  .t-c-pc {
    text-align: center;
  }
  .t-l-pc {
    text-align: left;
  }
  .t-r-pc {
    text-align: right;
  }
}

/*
   LINE HIEGHT
--------------------------------------------------------------*/
.l-10 {
  line-height: calc(1 * var(--lh-ratio));
}
.l-12 {
  line-height: calc(1.2 * var(--lh-ratio));
}
.l-15 {
  line-height: calc(1.5 * var(--lh-ratio));
}
.l-18 {
  line-height: calc(1.8 * var(--lh-ratio));
}
.l-20 {
  line-height: calc(2 * var(--lh-ratio));
}
.l-22 {
  line-height: calc(2.2 * var(--lh-ratio));
}
@media screen and (max-width: 1023px) {
  .l-10-sp {
    line-height: calc(1 * var(--lh-ratio));
  }
  .l-12-sp {
    line-height: calc(1.2 * var(--lh-ratio));
  }
  .l-15-sp {
    line-height: calc(1.5 * var(--lh-ratio));
  }
  .l-18-sp {
    line-height: calc(1.8 * var(--lh-ratio));
  }
  .l-20-sp {
    line-height: calc(2 * var(--lh-ratio));
  }
  .l-22-sp {
    line-height: calc(2.2 * var(--lh-ratio));
  }
}
@media screen and (min-width: 768px) {
  .l-10-tpc {
    line-height: calc(1 * var(--lh-ratio));
  }
  .l-12-tpc {
    line-height: calc(1.2 * var(--lh-ratio));
  }
  .l-15-tpc {
    line-height: calc(1.5 * var(--lh-ratio));
  }
  .l-18-tpc {
    line-height: calc(1.8 * var(--lh-ratio));
  }
  .l-20-tpc {
    line-height: calc(2 * var(--lh-ratio));
  }
  .l-22-tpc {
    line-height: calc(2.2 * var(--lh-ratio));
  }
}
@media screen and (min-width: 1024px) {
  .l-10-pc {
    line-height: calc(1 * var(--lh-ratio));
  }
  .l-12-pc {
    line-height: calc(1.2 * var(--lh-ratio));
  }
  .l-15-pc {
    line-height: calc(1.5 * var(--lh-ratio));
  }
  .l-18-pc {
    line-height: calc(1.8 * var(--lh-ratio));
  }
  .l-20-pc {
    line-height: calc(2 * var(--lh-ratio));
  }
  .l-22-pc {
    line-height: calc(2.2 * var(--lh-ratio));
  }
}

/*
   WIDTH
--------------------------------------------------------------*/
.w-1 {
  width: 1px;
}
.w-2 {
  width: 2px;
}
.w-3 {
  width: 3px;
}
.w-4 {
  width: 4px;
}
.w-5 {
  width: 5px;
}
.w-6 {
  width: 6px;
}
.w-7 {
  width: 7px;
}
.w-8 {
  width: 8px;
}
.w-9 {
  width: 9px;
}
.w-10 {
  width: 10px;
}
.w-15 {
  width: 15px;
}
.w-20 {
  width: 20px;
}
.w-25 {
  width: 25px;
}
.w-30 {
  width: 30px;
}
.w-35 {
  width: 35px;
}
.w-40 {
  width: 40px;
}
.w-45 {
  width: 45px;
}
.w-50 {
  width: 50px;
}
.w-60 {
  width: 60px;
}
.w-70 {
  width: 70px;
}
.w-80 {
  width: 80px;
}
.w-90 {
  width: 90px;
}
.w-100 {
  width: 100px;
}
.w-110 {
  width: 110px;
}
.w-120 {
  width: 120px;
}
.w-130 {
  width: 130px;
}
.w-140 {
  width: 140px;
}
.w-150 {
  width: 150px;
}
.w-160 {
  width: 160px;
}
.w-170 {
  width: 170px;
}
.w-180 {
  width: 180px;
}
.w-190 {
  width: 190px;
}
.w-200 {
  width: 200px;
}
.w-210 {
  width: 210px;
}
.w-220 {
  width: 220px;
}
.w-230 {
  width: 230px;
}
.w-240 {
  width: 240px;
}
.w-250 {
  width: 250px;
}
.w-260 {
  width: 260px;
}
.w-270 {
  width: 270px;
}
.w-280 {
  width: 280px;
}
.w-290 {
  width: 290px;
}
.w-300 {
  width: 300px;
}
.w-400 {
  width: 400px;
}
.w-500 {
  width: 500px;
}
.w-600 {
  width: 600px;
}
.w-700 {
  width: 700px;
}
.w-800 {
  width: 800px;
}
.w-900 {
  width: 900px;
}
.w-1000 {
  width: 1000px;
}

.w-10per {
  width: 10%;
}
.w-15per {
  width: 15%;
}
.w-20per {
  width: 20%;
}
.w-25per {
  width: 25%;
}
.w-30per {
  width: 30%;
}
.w-35per {
  width: 35%;
}
.w-40per {
  width: 40%;
}
.w-45per {
  width: 45%;
}
.w-50per {
  width: 50%;
}
.w-55per {
  width: 55%;
}
.w-60per {
  width: 60%;
}
.w-65per {
  width: 65%;
}
.w-70per {
  width: 70%;
}
.w-75per {
  width: 75%;
}
.w-80per {
  width: 80%;
}
.w-85per {
  width: 85%;
}
.w-90per {
  width: 90%;
}
.w-95per {
  width: 95%;
}
.w-100per {
  width: 100%;
}

.w-1vw {
  width: 1vw;
}
.w-2vw {
  width: 2vw;
}
.w-3vw {
  width: 3vw;
}
.w-4vw {
  width: 4vw;
}
.w-5vw {
  width: 5vw;
}
.w-6vw {
  width: 6vw;
}
.w-7vw {
  width: 7vw;
}
.w-8vw {
  width: 8vw;
}
.w-9vw {
  width: 9vw;
}
.w-10vw {
  width: 10vw;
}
.w-11vw {
  width: 11vw;
}
.w-12vw {
  width: 12vw;
}
.w-13vw {
  width: 13vw;
}
.w-14vw {
  width: 14vw;
}
.w-15vw {
  width: 15vw;
}
.w-20vw {
  width: 20vw;
}
.w-25vw {
  width: 25vw;
}
.w-30vw {
  width: 30vw;
}
.w-35vw {
  width: 35vw;
}
.w-40vw {
  width: 40vw;
}
.w-45vw {
  width: 45vw;
}
.w-50vw {
  width: 50vw;
}
.w-55vw {
  width: 55vw;
}
.w-60vw {
  width: 60vw;
}
.w-65vw {
  width: 65vw;
}
.w-70vw {
  width: 70vw;
}
.w-75vw {
  width: 75vw;
}
.w-80vw {
  width: 80vw;
}
.w-85vw {
  width: 85vw;
}
.w-90vw {
  width: 90vw;
}
.w-95vw {
  width: 95vw;
}
.w-100vw {
  width: 100vw;
}

.w-auto {
  width: auto;
}

@media screen and (max-width: 1023px) {
  .w-1-sp {
    width: 1px;
  }
  .w-2-sp {
    width: 2px;
  }
  .w-3-sp {
    width: 3px;
  }
  .w-4-sp {
    width: 4px;
  }
  .w-5-sp {
    width: 5px;
  }
  .w-6-sp {
    width: 6px;
  }
  .w-7-sp {
    width: 7px;
  }
  .w-8-sp {
    width: 8px;
  }
  .w-9-sp {
    width: 9px;
  }
  .w-10-sp {
    width: 10px;
  }
  .w-15-sp {
    width: 15px;
  }
  .w-20-sp {
    width: 20px;
  }
  .w-25-sp {
    width: 25px;
  }
  .w-30-sp {
    width: 30px;
  }
  .w-35-sp {
    width: 35px;
  }
  .w-40-sp {
    width: 40px;
  }
  .w-45-sp {
    width: 45px;
  }
  .w-50-sp {
    width: 50px;
  }
  .w-60-sp {
    width: 60px;
  }
  .w-70-sp {
    width: 70px;
  }
  .w-80-sp {
    width: 80px;
  }
  .w-90-sp {
    width: 90px;
  }
  .w-100-sp {
    width: 100px;
  }
  .w-110-sp {
    width: 110px;
  }
  .w-120-sp {
    width: 120px;
  }
  .w-130-sp {
    width: 130px;
  }
  .w-140-sp {
    width: 140px;
  }
  .w-150-sp {
    width: 150px;
  }
  .w-160-sp {
    width: 160px;
  }
  .w-170-sp {
    width: 170px;
  }
  .w-180-sp {
    width: 180px;
  }
  .w-190-sp {
    width: 190px;
  }
  .w-200-sp {
    width: 200px;
  }
  .w-210-sp {
    width: 210px;
  }
  .w-220-sp {
    width: 220px;
  }
  .w-230-sp {
    width: 230px;
  }
  .w-240-sp {
    width: 240px;
  }
  .w-250-sp {
    width: 250px;
  }
  .w-260-sp {
    width: 260px;
  }
  .w-270-sp {
    width: 270px;
  }
  .w-280-sp {
    width: 280px;
  }
  .w-290-sp {
    width: 290px;
  }
  .w-300-sp {
    width: 300px;
  }
  .w-400-sp {
    width: 400px;
  }
  .w-500-sp {
    width: 500px;
  }
  .w-600-sp {
    width: 600px;
  }
  .w-700-sp {
    width: 700px;
  }
  .w-800-sp {
    width: 800px;
  }
  .w-900-sp {
    width: 900px;
  }
  .w-1000-sp {
    width: 1000px;
  }
  .w-1100-sp {
    width: 1100px;
  }
  .w-1200-sp {
    width: 1200px;
  }
  .w-1300-sp {
    width: 1300px;
  }
  .w-1400-sp {
    width: 1400px;
  }

  .w-10per-sp {
    width: 10%;
  }
  .w-15per-sp {
    width: 15%;
  }
  .w-20per-sp {
    width: 20%;
  }
  .w-25per-sp {
    width: 25%;
  }
  .w-30per-sp {
    width: 30%;
  }
  .w-35per-sp {
    width: 35%;
  }
  .w-40per-sp {
    width: 40%;
  }
  .w-45per-sp {
    width: 45%;
  }
  .w-50per-sp {
    width: 50%;
  }
  .w-55per-sp {
    width: 55%;
  }
  .w-60per-sp {
    width: 60%;
  }
  .w-65per-sp {
    width: 65%;
  }
  .w-70per-sp {
    width: 70%;
  }
  .w-75per-sp {
    width: 75%;
  }
  .w-80per-sp {
    width: 80%;
  }
  .w-85per-sp {
    width: 85%;
  }
  .w-90per-sp {
    width: 90%;
  }
  .w-95per-sp {
    width: 95%;
  }
  .w-100per-sp {
    width: 100%;
  }

  .w-1vw-sp {
    width: 1vw;
  }
  .w-2vw-sp {
    width: 2vw;
  }
  .w-3vw-sp {
    width: 3vw;
  }
  .w-4vw-sp {
    width: 4vw;
  }
  .w-5vw-sp {
    width: 5vw;
  }
  .w-6vw-sp {
    width: 6vw;
  }
  .w-7vw-sp {
    width: 7vw;
  }
  .w-8vw-sp {
    width: 8vw;
  }
  .w-9vw-sp {
    width: 9vw;
  }
  .w-10vw-sp {
    width: 10vw;
  }
  .w-11vw-sp {
    width: 11vw;
  }
  .w-12vw-sp {
    width: 12vw;
  }
  .w-13vw-sp {
    width: 13vw;
  }
  .w-14vw-sp {
    width: 14vw;
  }
  .w-15vw-sp {
    width: 15vw;
  }
  .w-20vw-sp {
    width: 20vw;
  }
  .w-25vw-sp {
    width: 25vw;
  }
  .w-30vw-sp {
    width: 30vw;
  }
  .w-35vw-sp {
    width: 35vw;
  }
  .w-40vw-sp {
    width: 40vw;
  }
  .w-45vw-sp {
    width: 45vw;
  }
  .w-50vw-sp {
    width: 50vw;
  }
  .w-55vw-sp {
    width: 55vw;
  }
  .w-60vw-sp {
    width: 60vw;
  }
  .w-65vw-sp {
    width: 65vw;
  }
  .w-70vw-sp {
    width: 70vw;
  }
  .w-75vw-sp {
    width: 75vw;
  }
  .w-80vw-sp {
    width: 80vw;
  }
  .w-85vw-sp {
    width: 85vw;
  }
  .w-90vw-sp {
    width: 90vw;
  }
  .w-95vw-sp {
    width: 95vw;
  }
  .w-100vw-sp {
    width: 100vw;
  }

  .w-auto-sp {
    width: auto;
  }
}
@media screen and (min-width: 768px) {
  .w-1-tpc {
    width: 1px;
  }
  .w-2-tpc {
    width: 2px;
  }
  .w-3-tpc {
    width: 3px;
  }
  .w-4-tpc {
    width: 4px;
  }
  .w-5-tpc {
    width: 5px;
  }
  .w-6-tpc {
    width: 6px;
  }
  .w-7-tpc {
    width: 7px;
  }
  .w-8-tpc {
    width: 8px;
  }
  .w-9-tpc {
    width: 9px;
  }
  .w-10-tpc {
    width: 10px;
  }
  .w-15-tpc {
    width: 15px;
  }
  .w-20-tpc {
    width: 20px;
  }
  .w-25-tpc {
    width: 25px;
  }
  .w-30-tpc {
    width: 30px;
  }
  .w-35-tpc {
    width: 35px;
  }
  .w-40-tpc {
    width: 40px;
  }
  .w-45-tpc {
    width: 45px;
  }
  .w-50-tpc {
    width: 50px;
  }
  .w-60-tpc {
    width: 60px;
  }
  .w-70-tpc {
    width: 70px;
  }
  .w-80-tpc {
    width: 80px;
  }
  .w-90-tpc {
    width: 90px;
  }
  .w-100-tpc {
    width: 100px;
  }
  .w-110-tpc {
    width: 110px;
  }
  .w-120-tpc {
    width: 120px;
  }
  .w-130-tpc {
    width: 130px;
  }
  .w-140-tpc {
    width: 140px;
  }
  .w-150-tpc {
    width: 150px;
  }
  .w-160-tpc {
    width: 160px;
  }
  .w-170-tpc {
    width: 170px;
  }
  .w-180-tpc {
    width: 180px;
  }
  .w-190-tpc {
    width: 190px;
  }
  .w-200-tpc {
    width: 200px;
  }
  .w-210-tpc {
    width: 210px;
  }
  .w-220-tpc {
    width: 220px;
  }
  .w-230-tpc {
    width: 230px;
  }
  .w-240-tpc {
    width: 240px;
  }
  .w-250-tpc {
    width: 250px;
  }
  .w-260-tpc {
    width: 260px;
  }
  .w-270-tpc {
    width: 270px;
  }
  .w-280-tpc {
    width: 280px;
  }
  .w-290-tpc {
    width: 290px;
  }
  .w-300-tpc {
    width: 300px;
  }
  .w-400-tpc {
    width: 400px;
  }
  .w-500-tpc {
    width: 500px;
  }
  .w-600-tpc {
    width: 600px;
  }
  .w-700-tpc {
    width: 700px;
  }
  .w-800-tpc {
    width: 800px;
  }
  .w-900-tpc {
    width: 900px;
  }
  .w-1000-tpc {
    width: 1000px;
  }
  .w-1100-tpc {
    width: 1100px;
  }
  .w-1200-tpc {
    width: 1200px;
  }
  .w-1300-tpc {
    width: 1300px;
  }
  .w-1400-tpc {
    width: 1400px;
  }

  .w-10per-tpc {
    width: 10%;
  }
  .w-15per-tpc {
    width: 15%;
  }
  .w-20per-tpc {
    width: 20%;
  }
  .w-25per-tpc {
    width: 25%;
  }
  .w-30per-tpc {
    width: 30%;
  }
  .w-35per-tpc {
    width: 35%;
  }
  .w-40per-tpc {
    width: 40%;
  }
  .w-45per-tpc {
    width: 45%;
  }
  .w-50per-tpc {
    width: 50%;
  }
  .w-55per-tpc {
    width: 55%;
  }
  .w-60per-tpc {
    width: 60%;
  }
  .w-65per-tpc {
    width: 65%;
  }
  .w-70per-tpc {
    width: 70%;
  }
  .w-75per-tpc {
    width: 75%;
  }
  .w-80per-tpc {
    width: 80%;
  }
  .w-85per-tpc {
    width: 85%;
  }
  .w-90per-tpc {
    width: 90%;
  }
  .w-95per-tpc {
    width: 95%;
  }
  .w-100per-tpc {
    width: 100%;
  }

  .w-1vw-tpc {
    width: 1vw;
  }
  .w-2vw-tpc {
    width: 2vw;
  }
  .w-3vw-tpc {
    width: 3vw;
  }
  .w-4vw-tpc {
    width: 4vw;
  }
  .w-5vw-tpc {
    width: 5vw;
  }
  .w-6vw-tpc {
    width: 6vw;
  }
  .w-7vw-tpc {
    width: 7vw;
  }
  .w-8vw-tpc {
    width: 8vw;
  }
  .w-9vw-tpc {
    width: 9vw;
  }
  .w-10vw-tpc {
    width: 10vw;
  }
  .w-11vw-tpc {
    width: 11vw;
  }
  .w-12vw-tpc {
    width: 12vw;
  }
  .w-13vw-tpc {
    width: 13vw;
  }
  .w-14vw-tpc {
    width: 14vw;
  }
  .w-15vw-tpc {
    width: 15vw;
  }
  .w-20vw-tpc {
    width: 20vw;
  }
  .w-25vw-tpc {
    width: 25vw;
  }
  .w-30vw-tpc {
    width: 30vw;
  }
  .w-35vw-tpc {
    width: 35vw;
  }
  .w-40vw-tpc {
    width: 40vw;
  }
  .w-45vw-tpc {
    width: 45vw;
  }
  .w-50vw-tpc {
    width: 50vw;
  }
  .w-55vw-tpc {
    width: 55vw;
  }
  .w-60vw-tpc {
    width: 60vw;
  }
  .w-65vw-tpc {
    width: 65vw;
  }
  .w-70vw-tpc {
    width: 70vw;
  }
  .w-75vw-tpc {
    width: 75vw;
  }
  .w-80vw-tpc {
    width: 80vw;
  }
  .w-85vw-tpc {
    width: 85vw;
  }
  .w-90vw-tpc {
    width: 90vw;
  }
  .w-95vw-tpc {
    width: 95vw;
  }
  .w-100vw-tpc {
    width: 100vw;
  }

  .w-auto-tpc {
    width: auto;
  }
}
@media screen and (min-width: 1024px) {
  .w-1-pc {
    width: 1px;
  }
  .w-2-pc {
    width: 2px;
  }
  .w-3-pc {
    width: 3px;
  }
  .w-4-pc {
    width: 4px;
  }
  .w-5-pc {
    width: 5px;
  }
  .w-6-pc {
    width: 6px;
  }
  .w-7-pc {
    width: 7px;
  }
  .w-8-pc {
    width: 8px;
  }
  .w-9-pc {
    width: 9px;
  }
  .w-10-pc {
    width: 10px;
  }
  .w-25-pc {
    width: 15px;
  }
  .w-20-pc {
    width: 20px;
  }
  .w-25-pc {
    width: 25px;
  }
  .w-30-pc {
    width: 30px;
  }
  .w-35-pc {
    width: 35px;
  }
  .w-40-pc {
    width: 40px;
  }
  .w-45-pc {
    width: 45px;
  }
  .w-50-pc {
    width: 50px;
  }
  .w-60-pc {
    width: 60px;
  }
  .w-70-pc {
    width: 70px;
  }
  .w-80-pc {
    width: 80px;
  }
  .w-90-pc {
    width: 90px;
  }
  .w-100-pc {
    width: 100px;
  }
  .w-110-pc {
    width: 110px;
  }
  .w-120-pc {
    width: 120px;
  }
  .w-130-pc {
    width: 130px;
  }
  .w-140-pc {
    width: 140px;
  }
  .w-150-pc {
    width: 150px;
  }
  .w-160-pc {
    width: 160px;
  }
  .w-170-pc {
    width: 170px;
  }
  .w-180-pc {
    width: 180px;
  }
  .w-190-pc {
    width: 190px;
  }
  .w-200-pc {
    width: 200px;
  }
  .w-210-pc {
    width: 210px;
  }
  .w-220-pc {
    width: 220px;
  }
  .w-230-pc {
    width: 230px;
  }
  .w-240-pc {
    width: 240px;
  }
  .w-250-pc {
    width: 250px;
  }
  .w-260-pc {
    width: 260px;
  }
  .w-270-pc {
    width: 270px;
  }
  .w-280-pc {
    width: 280px;
  }
  .w-290-pc {
    width: 290px;
  }
  .w-300-pc {
    width: 300px;
  }
  .w-400-pc {
    width: 400px;
  }
  .w-500-pc {
    width: 500px;
  }
  .w-600-pc {
    width: 600px;
  }
  .w-700-pc {
    width: 700px;
  }
  .w-800-pc {
    width: 800px;
  }
  .w-900-pc {
    width: 900px;
  }
  .w-1000-pc {
    width: 1000px;
  }
  .w-1100-pc {
    width: 1100px;
  }
  .w-1200-pc {
    width: 1200px;
  }
  .w-1300-pc {
    width: 1300px;
  }
  .w-1400-pc {
    width: 1400px;
  }

  .w-10per-pc {
    width: 10%;
  }
  .w-15per-pc {
    width: 15%;
  }
  .w-20per-pc {
    width: 20%;
  }
  .w-25per-pc {
    width: 25%;
  }
  .w-30per-pc {
    width: 30%;
  }
  .w-35per-pc {
    width: 35%;
  }
  .w-40per-pc {
    width: 40%;
  }
  .w-45per-pc {
    width: 45%;
  }
  .w-50per-pc {
    width: 50%;
  }
  .w-55per-pc {
    width: 55%;
  }
  .w-60per-pc {
    width: 60%;
  }
  .w-65per-pc {
    width: 65%;
  }
  .w-70per-pc {
    width: 70%;
  }
  .w-75per-pc {
    width: 75%;
  }
  .w-80per-pc {
    width: 80%;
  }
  .w-85per-pc {
    width: 85%;
  }
  .w-90per-pc {
    width: 90%;
  }
  .w-95per-pc {
    width: 95%;
  }
  .w-100per-pc {
    width: 100%;
  }

  .w-1vw-pc {
    width: 1vw;
  }
  .w-2vw-pc {
    width: 2vw;
  }
  .w-3vw-pc {
    width: 3vw;
  }
  .w-4vw-pc {
    width: 4vw;
  }
  .w-5vw-pc {
    width: 5vw;
  }
  .w-6vw-pc {
    width: 6vw;
  }
  .w-7vw-pc {
    width: 7vw;
  }
  .w-8vw-pc {
    width: 8vw;
  }
  .w-9vw-pc {
    width: 9vw;
  }
  .w-10vw-pc {
    width: 10vw;
  }
  .w-11vw-pc {
    width: 11vw;
  }
  .w-12vw-pc {
    width: 12vw;
  }
  .w-13vw-pc {
    width: 13vw;
  }
  .w-14vw-pc {
    width: 14vw;
  }
  .w-15vw-pc {
    width: 15vw;
  }
  .w-20vw-pc {
    width: 20vw;
  }
  .w-25vw-pc {
    width: 25vw;
  }
  .w-30vw-pc {
    width: 30vw;
  }
  .w-35vw-pc {
    width: 35vw;
  }
  .w-40vw-pc {
    width: 40vw;
  }
  .w-45vw-pc {
    width: 45vw;
  }
  .w-50vw-pc {
    width: 50vw;
  }
  .w-55vw-pc {
    width: 55vw;
  }
  .w-60vw-pc {
    width: 60vw;
  }
  .w-65vw-pc {
    width: 65vw;
  }
  .w-70vw-pc {
    width: 70vw;
  }
  .w-75vw-pc {
    width: 75vw;
  }
  .w-80vw-pc {
    width: 80vw;
  }
  .w-85vw-pc {
    width: 85vw;
  }
  .w-90vw-pc {
    width: 90vw;
  }
  .w-95vw-pc {
    width: 95vw;
  }
  .w-100vw-pc {
    width: 100vw;
  }

  .w-auto-pc {
    width: auto;
  }
}
/*
   MAX WIDTH
--------------------------------------------------------------*/
.w-max100 {
  max-width: 100px;
}
.w-max150 {
  max-width: 150px;
}
.w-max200 {
  max-width: 200px;
}
.w-max250 {
  max-width: 250px;
}
.w-max300 {
  max-width: 300px;
}
.w-max350 {
  max-width: 350px;
}
.w-max400 {
  max-width: 400px;
}
.w-max450 {
  max-width: 450px;
}
.w-max500 {
  max-width: 500px;
}
.w-max550 {
  max-width: 550px;
}
.w-max600 {
  max-width: 600px;
}
.w-max650 {
  max-width: 650px;
}
.w-max700 {
  max-width: 700px;
}
.w-max750 {
  max-width: 750px;
}
.w-max800 {
  max-width: 800px;
}
.w-max850 {
  max-width: 850px;
}
.w-max900 {
  max-width: 900px;
}
.w-max950 {
  max-width: 950px;
}
.w-max1000 {
  max-width: 1000px;
}
.w-max1100 {
  max-width: 1100px;
}
.w-max1200 {
  max-width: 1200px;
}
.w-max1300 {
  max-width: 1300px;
}
.w-max1400 {
  max-width: 1400px;
}
@media screen and (max-width: 1023px) {
  .w-max100-sp {
    max-width: 100px;
  }
  .w-max150-sp {
    max-width: 150px;
  }
  .w-max200-sp {
    max-width: 200px;
  }
  .w-max250-sp {
    max-width: 250px;
  }
  .w-max300-sp {
    max-width: 300px;
  }
  .w-max350-sp {
    max-width: 350px;
  }
  .w-max400-sp {
    max-width: 400px;
  }
  .w-max450-sp {
    max-width: 450px;
  }
  .w-max500-sp {
    max-width: 500px;
  }
  .w-max550-sp {
    max-width: 550px;
  }
  .w-max600-sp {
    max-width: 600px;
  }
  .w-max650-sp {
    max-width: 650px;
  }
  .w-max700-sp {
    max-width: 700px;
  }
  .w-max750-sp {
    max-width: 750px;
  }
  .w-max800-sp {
    max-width: 800px;
  }
  .w-max850-sp {
    max-width: 850px;
  }
  .w-max900-sp {
    max-width: 900px;
  }
  .w-max950-sp {
    max-width: 950px;
  }
  .w-max1000-sp {
    max-width: 1000px;
  }
  .w-max1100-sp {
    max-width: 1100px;
  }
  .w-max1200-sp {
    max-width: 1200px;
  }
  .w-max1300-sp {
    max-width: 1300px;
  }
  .w-max1400-sp {
    max-width: 1400px;
  }
}
@media screen and (min-width: 768px) {
  .w-max100-tpc {
    max-width: 100px;
  }
  .w-max150-tpc {
    max-width: 150px;
  }
  .w-max200-tpc {
    max-width: 200px;
  }
  .w-max250-tpc {
    max-width: 250px;
  }
  .w-max300-tpc {
    max-width: 300px;
  }
  .w-max350-tpc {
    max-width: 350px;
  }
  .w-max400-tpc {
    max-width: 400px;
  }
  .w-max450-tpc {
    max-width: 450px;
  }
  .w-max500-tpc {
    max-width: 500px;
  }
  .w-max550-tpc {
    max-width: 550px;
  }
  .w-max600-tpc {
    max-width: 600px;
  }
  .w-max650-tpc {
    max-width: 650px;
  }
  .w-max700-tpc {
    max-width: 700px;
  }
  .w-max750-tpc {
    max-width: 750px;
  }
  .w-max800-tpc {
    max-width: 800px;
  }
  .w-max850-tpc {
    max-width: 850px;
  }
  .w-max900-tpc {
    max-width: 900px;
  }
  .w-max950-tpc {
    max-width: 950px;
  }
  .w-max1000-tpc {
    max-width: 1000px;
  }
  .w-max1100-tpc {
    max-width: 1100px;
  }
  .w-max1200-tpc {
    max-width: 1200px;
  }
  .w-max1300-tpc {
    max-width: 1300px;
  }
  .w-max1400-tpc {
    max-width: 1400px;
  }
}
@media screen and (min-width: 1024px) {
  .w-max100-pc {
    max-width: 100px;
  }
  .w-max150-pc {
    max-width: 150px;
  }
  .w-max200-pc {
    max-width: 200px;
  }
  .w-max250-pc {
    max-width: 250px;
  }
  .w-max300-pc {
    max-width: 300px;
  }
  .w-max350-pc {
    max-width: 350px;
  }
  .w-max400-pc {
    max-width: 400px;
  }
  .w-max450-pc {
    max-width: 450px;
  }
  .w-max500-pc {
    max-width: 500px;
  }
  .w-max550-pc {
    max-width: 550px;
  }
  .w-max600-pc {
    max-width: 600px;
  }
  .w-max650-pc {
    max-width: 650px;
  }
  .w-max700-pc {
    max-width: 700px;
  }
  .w-max750-pc {
    max-width: 750px;
  }
  .w-max800-pc {
    max-width: 800px;
  }
  .w-max850-pc {
    max-width: 850px;
  }
  .w-max900-pc {
    max-width: 900px;
  }
  .w-max950-pc {
    max-width: 950px;
  }
  .w-max1000-pc {
    max-width: 1000px;
  }
  .w-max1100-pc {
    max-width: 1100px;
  }
  .w-max1200-pc {
    max-width: 1200px;
  }
  .w-max1300-pc {
    max-width: 1300px;
  }
  .w-max1400-pc {
    max-width: 1400px;
  }
}

/*
   MAX HEIGHT
--------------------------------------------------------------*/
.h-1 {
  height: 1px;
}
.h-2 {
  height: 2px;
}
.h-3 {
  height: 3px;
}
.h-4 {
  height: 4px;
}
.h-5 {
  height: 5px;
}
.h-6 {
  height: 6px;
}
.h-7 {
  height: 7px;
}
.h-8 {
  height: 8px;
}
.h-9 {
  height: 9px;
}
.h-10 {
  height: 10px;
}
.h-15 {
  height: 15px;
}
.h-20 {
  height: 20px;
}
.h-25 {
  height: 25px;
}
.h-30 {
  height: 30px;
}
.h-35 {
  height: 35px;
}
.h-40 {
  height: 40px;
}
.h-45 {
  height: 45px;
}
.h-50 {
  height: 50px;
}
.h-60 {
  height: 60px;
}
.h-70 {
  height: 70px;
}
.h-80 {
  height: 80px;
}
.h-90 {
  height: 90px;
}
.h-100 {
  height: 100px;
}
.h-110 {
  height: 110px;
}
.h-120 {
  height: 120px;
}
.h-130 {
  height: 130px;
}
.h-140 {
  height: 140px;
}
.h-150 {
  height: 150px;
}
.h-160 {
  height: 160px;
}
.h-170 {
  height: 170px;
}
.h-180 {
  height: 180px;
}
.h-190 {
  height: 190px;
}
.h-200 {
  height: 200px;
}
.h-210 {
  height: 210px;
}
.h-220 {
  height: 220px;
}
.h-230 {
  height: 230px;
}
.h-240 {
  height: 240px;
}
.h-250 {
  height: 250px;
}
.h-260 {
  height: 260px;
}
.h-270 {
  height: 270px;
}
.h-280 {
  height: 280px;
}
.h-290 {
  height: 290px;
}
.h-300 {
  height: 300px;
}
.h-400 {
  height: 400px;
}
.h-500 {
  height: 500px;
}
.h-600 {
  height: 600px;
}
.h-700 {
  height: 700px;
}
.h-800 {
  height: 800px;
}
.h-900 {
  height: 900px;
}
.h-1000 {
  height: 1000px;
}

.h-100per {
  height: 100%;
}

.h-1vw {
  height: 1vw;
}
.h-2vw {
  height: 2vw;
}
.h-3vw {
  height: 3vw;
}
.h-4vw {
  height: 4vw;
}
.h-5vw {
  height: 5vw;
}
.h-6vw {
  height: 6vw;
}
.h-7vw {
  height: 7vw;
}
.h-8vw {
  height: 8vw;
}
.h-9vw {
  height: 9vw;
}
.h-10vw {
  height: 10vw;
}
.h-11vw {
  height: 11vw;
}
.h-12vw {
  height: 12vw;
}
.h-13vw {
  height: 13vw;
}
.h-14vw {
  height: 14vw;
}
.h-15vw {
  height: 15vw;
}
.h-20vw {
  height: 20vw;
}
.h-25vw {
  height: 25vw;
}
.h-30vw {
  height: 30vw;
}
.h-35vw {
  height: 35vw;
}
.h-40vw {
  height: 40vw;
}
.h-45vw {
  height: 45vw;
}
.h-50vw {
  height: 50vw;
}
.h-55vw {
  height: 55vw;
}
.h-60vw {
  height: 60vw;
}
.h-65vw {
  height: 65vw;
}
.h-70vw {
  height: 70vw;
}
.h-75vw {
  height: 75vw;
}
.h-80vw {
  height: 80vw;
}
.h-85vw {
  height: 85vw;
}
.h-90vw {
  height: 90vw;
}
.h-95vw {
  height: 95vw;
}
.h-100vw {
  height: 100vw;
}

.h-10vh {
  height: 10vh;
}
.h-20vh {
  height: 20vh;
}
.h-30vh {
  height: 30vh;
}
.h-40vh {
  height: 40vh;
}
.h-50vh {
  height: 50vh;
}
.h-60vh {
  height: 60vh;
}
.h-70vh {
  height: 70vh;
}
.h-80vh {
  height: 80vh;
}
.h-90vh {
  height: 90vh;
}
.h-100vh {
  height: 100vh;
}

.h-100svh {
  height: 100svh;
}
.h-100lvh {
  height: 100lvh;
}
.h-100dvh {
  height: 100dvh;
}

.h-auto-sp {
  height: auto;
}

@media screen and (max-width: 1023px) {
  .h-1-sp {
    height: 1px;
  }
  .h-2-sp {
    height: 2px;
  }
  .h-3-sp {
    height: 3px;
  }
  .h-4-sp {
    height: 4px;
  }
  .h-5-sp {
    height: 5px;
  }
  .h-6-sp {
    height: 6px;
  }
  .h-7-sp {
    height: 7px;
  }
  .h-8-sp {
    height: 8px;
  }
  .h-9-sp {
    height: 9px;
  }
  .h-10-sp {
    height: 10px;
  }
  .h-15-sp {
    height: 15px;
  }
  .h-20-sp {
    height: 20px;
  }
  .h-25-sp {
    height: 25px;
  }
  .h-30-sp {
    height: 30px;
  }
  .h-35-sp {
    height: 35px;
  }
  .h-40-sp {
    height: 40px;
  }
  .h-45-sp {
    height: 45px;
  }
  .h-50-sp {
    height: 50px;
  }
  .h-60-sp {
    height: 60px;
  }
  .h-70-sp {
    height: 70px;
  }
  .h-80-sp {
    height: 80px;
  }
  .h-90-sp {
    height: 90px;
  }
  .h-100-sp {
    height: 100px;
  }
  .h-110-sp {
    height: 110px;
  }
  .h-120-sp {
    height: 120px;
  }
  .h-130-sp {
    height: 130px;
  }
  .h-140-sp {
    height: 140px;
  }
  .h-150-sp {
    height: 150px;
  }
  .h-160-sp {
    height: 160px;
  }
  .h-170-sp {
    height: 170px;
  }
  .h-180-sp {
    height: 180px;
  }
  .h-190-sp {
    height: 190px;
  }
  .h-200-sp {
    height: 200px;
  }
  .h-210-sp {
    height: 210px;
  }
  .h-220-sp {
    height: 220px;
  }
  .h-230-sp {
    height: 230px;
  }
  .h-240-sp {
    height: 240px;
  }
  .h-250-sp {
    height: 250px;
  }
  .h-260-sp {
    height: 260px;
  }
  .h-270-sp {
    height: 270px;
  }
  .h-280-sp {
    height: 280px;
  }
  .h-290-sp {
    height: 290px;
  }
  .h-300-sp {
    height: 300px;
  }
  .h-400-sp {
    height: 400px;
  }
  .h-500-sp {
    height: 500px;
  }
  .h-600-sp {
    height: 600px;
  }
  .h-700-sp {
    height: 700px;
  }
  .h-800-sp {
    height: 800px;
  }
  .h-900-sp {
    height: 900px;
  }
  .h-1000-sp {
    height: 1000px;
  }

  .h-100per-sp {
    height: 100%;
  }

  .h-1vw-sp {
    height: 1vw;
  }
  .h-2vw-sp {
    height: 2vw;
  }
  .h-3vw-sp {
    height: 3vw;
  }
  .h-4vw-sp {
    height: 4vw;
  }
  .h-5vw-sp {
    height: 5vw;
  }
  .h-6vw-sp {
    height: 6vw;
  }
  .h-7vw-sp {
    height: 7vw;
  }
  .h-8vw-sp {
    height: 8vw;
  }
  .h-9vw-sp {
    height: 9vw;
  }
  .h-10vw-sp {
    height: 10vw;
  }
  .h-11vw-sp {
    height: 11vw;
  }
  .h-12vw-sp {
    height: 12vw;
  }
  .h-13vw-sp {
    height: 13vw;
  }
  .h-14vw-sp {
    height: 14vw;
  }
  .h-15vw-sp {
    height: 15vw;
  }
  .h-20vw-sp {
    height: 20vw;
  }
  .h-25vw-sp {
    height: 25vw;
  }
  .h-30vw-sp {
    height: 30vw;
  }
  .h-35vw-sp {
    height: 35vw;
  }
  .h-40vw-sp {
    height: 40vw;
  }
  .h-45vw-sp {
    height: 45vw;
  }
  .h-50vw-sp {
    height: 50vw;
  }
  .h-55vw-sp {
    height: 55vw;
  }
  .h-60vw-sp {
    height: 60vw;
  }
  .h-65vw-sp {
    height: 65vw;
  }
  .h-70vw-sp {
    height: 70vw;
  }
  .h-75vw-sp {
    height: 75vw;
  }
  .h-80vw-sp {
    height: 80vw;
  }
  .h-85vw-sp {
    height: 85vw;
  }
  .h-90vw-sp {
    height: 90vw;
  }
  .h-95vw-sp {
    height: 95vw;
  }
  .h-100vw-sp {
    height: 100vw;
  }

  .h-10vh-sp {
    height: 10vh;
  }
  .h-20vh-sp {
    height: 20vh;
  }
  .h-30vh-sp {
    height: 30vh;
  }
  .h-40vh-sp {
    height: 40vh;
  }
  .h-50vh-sp {
    height: 50vh;
  }
  .h-60vh-sp {
    height: 60vh;
  }
  .h-70vh-sp {
    height: 70vh;
  }
  .h-80vh-sp {
    height: 80vh;
  }
  .h-90vh-sp {
    height: 90vh;
  }
  .h-100vh-sp {
    height: 100vh;
  }

  .h-100svh-sp {
    height: 100svh;
  }
  .h-100lvh-sp {
    height: 100lvh;
  }
  .h-100dvh-sp {
    height: 100dvh;
  }

  .h-auto-sp {
    height: auto;
  }
}
@media screen and (min-width: 768px) {
  .h-1-tpc {
    height: 1px;
  }
  .h-2-tpc {
    height: 2px;
  }
  .h-3-tpc {
    height: 3px;
  }
  .h-4-tpc {
    height: 4px;
  }
  .h-5-tpc {
    height: 5px;
  }
  .h-6-tpc {
    height: 6px;
  }
  .h-7-tpc {
    height: 7px;
  }
  .h-8-tpc {
    height: 8px;
  }
  .h-9-tpc {
    height: 9px;
  }
  .h-10-tpc {
    height: 10px;
  }
  .h-15-tpc {
    height: 15px;
  }
  .h-20-tpc {
    height: 20px;
  }
  .h-25-tpc {
    height: 25px;
  }
  .h-30-tpc {
    height: 30px;
  }
  .h-35-tpc {
    height: 35px;
  }
  .h-40-tpc {
    height: 40px;
  }
  .h-45-tpc {
    height: 45px;
  }
  .h-50-tpc {
    height: 50px;
  }
  .h-60-tpc {
    height: 60px;
  }
  .h-70-tpc {
    height: 70px;
  }
  .h-80-tpc {
    height: 80px;
  }
  .h-90-tpc {
    height: 90px;
  }
  .h-100-tpc {
    height: 100px;
  }
  .h-110-tpc {
    height: 110px;
  }
  .h-120-tpc {
    height: 120px;
  }
  .h-130-tpc {
    height: 130px;
  }
  .h-140-tpc {
    height: 140px;
  }
  .h-150-tpc {
    height: 150px;
  }
  .h-160-tpc {
    height: 160px;
  }
  .h-170-tpc {
    height: 170px;
  }
  .h-180-tpc {
    height: 180px;
  }
  .h-190-tpc {
    height: 190px;
  }
  .h-200-tpc {
    height: 200px;
  }
  .h-210-tpc {
    height: 210px;
  }
  .h-220-tpc {
    height: 220px;
  }
  .h-230-tpc {
    height: 230px;
  }
  .h-240-tpc {
    height: 240px;
  }
  .h-250-tpc {
    height: 250px;
  }
  .h-260-tpc {
    height: 260px;
  }
  .h-270-tpc {
    height: 270px;
  }
  .h-280-tpc {
    height: 280px;
  }
  .h-290-tpc {
    height: 290px;
  }
  .h-300-tpc {
    height: 300px;
  }
  .h-400-tpc {
    height: 400px;
  }
  .h-500-tpc {
    height: 500px;
  }
  .h-600-tpc {
    height: 600px;
  }
  .h-700-tpc {
    height: 700px;
  }
  .h-800-tpc {
    height: 800px;
  }
  .h-900-tpc {
    height: 900px;
  }
  .h-1000-tpc {
    height: 1000px;
  }

  .h-100per-tpc {
    height: 100%;
  }

  .h-1vw-tpc {
    height: 1vw;
  }
  .h-2vw-tpc {
    height: 2vw;
  }
  .h-3vw-tpc {
    height: 3vw;
  }
  .h-4vw-tpc {
    height: 4vw;
  }
  .h-5vw-tpc {
    height: 5vw;
  }
  .h-6vw-tpc {
    height: 6vw;
  }
  .h-7vw-tpc {
    height: 7vw;
  }
  .h-8vw-tpc {
    height: 8vw;
  }
  .h-9vw-tpc {
    height: 9vw;
  }
  .h-10vw-tpc {
    height: 10vw;
  }
  .h-11vw-tpc {
    height: 11vw;
  }
  .h-12vw-tpc {
    height: 12vw;
  }
  .h-13vw-tpc {
    height: 13vw;
  }
  .h-14vw-tpc {
    height: 14vw;
  }
  .h-15vw-tpc {
    height: 15vw;
  }
  .h-20vw-tpc {
    height: 20vw;
  }
  .h-25vw-tpc {
    height: 25vw;
  }
  .h-30vw-tpc {
    height: 30vw;
  }
  .h-35vw-tpc {
    height: 35vw;
  }
  .h-40vw-tpc {
    height: 40vw;
  }
  .h-45vw-tpc {
    height: 45vw;
  }
  .h-50vw-tpc {
    height: 50vw;
  }
  .h-55vw-tpc {
    height: 55vw;
  }
  .h-60vw-tpc {
    height: 60vw;
  }
  .h-65vw-tpc {
    height: 65vw;
  }
  .h-70vw-tpc {
    height: 70vw;
  }
  .h-75vw-tpc {
    height: 75vw;
  }
  .h-80vw-tpc {
    height: 80vw;
  }
  .h-85vw-tpc {
    height: 85vw;
  }
  .h-90vw-tpc {
    height: 90vw;
  }
  .h-95vw-tpc {
    height: 95vw;
  }
  .h-100vw-tpc {
    height: 100vw;
  }

  .h-10vh-tpc {
    height: 10vh;
  }
  .h-20vh-tpc {
    height: 20vh;
  }
  .h-30vh-tpc {
    height: 30vh;
  }
  .h-40vh-tpc {
    height: 40vh;
  }
  .h-50vh-tpc {
    height: 50vh;
  }
  .h-60vh-tpc {
    height: 60vh;
  }
  .h-70vh-tpc {
    height: 70vh;
  }
  .h-80vh-tpc {
    height: 80vh;
  }
  .h-90vh-tpc {
    height: 90vh;
  }
  .h-100vh-tpc {
    height: 100vh;
  }

  .h-100svh-tpc {
    height: 100svh;
  }
  .h-100lvh-tpc {
    height: 100lvh;
  }
  .h-100dvh-tpc {
    height: 100dvh;
  }

  .h-auto-tpc {
    height: auto;
  }
}
@media screen and (min-width: 1024px) {
  .h-1-pc {
    height: 1px;
  }
  .h-2-pc {
    height: 2px;
  }
  .h-3-pc {
    height: 3px;
  }
  .h-4-pc {
    height: 4px;
  }
  .h-5-pc {
    height: 5px;
  }
  .h-6-pc {
    height: 6px;
  }
  .h-7-pc {
    height: 7px;
  }
  .h-8-pc {
    height: 8px;
  }
  .h-9-pc {
    height: 9px;
  }
  .h-10-pc {
    height: 10px;
  }
  .h-15-pc {
    height: 15px;
  }
  .h-25-pc {
    height: 25px;
  }
  .h-20-pc {
    height: 20px;
  }
  .h-25-pc {
    height: 25px;
  }
  .h-30-pc {
    height: 30px;
  }
  .h-35-pc {
    height: 35px;
  }
  .h-40-pc {
    height: 40px;
  }
  .h-45-pc {
    height: 45px;
  }
  .h-50-pc {
    height: 50px;
  }
  .h-60-pc {
    height: 60px;
  }
  .h-70-pc {
    height: 70px;
  }
  .h-80-pc {
    height: 80px;
  }
  .h-90-pc {
    height: 90px;
  }
  .h-100-pc {
    height: 100px;
  }
  .h-110-pc {
    height: 110px;
  }
  .h-120-pc {
    height: 120px;
  }
  .h-130-pc {
    height: 130px;
  }
  .h-140-pc {
    height: 140px;
  }
  .h-150-pc {
    height: 150px;
  }
  .h-160-pc {
    height: 160px;
  }
  .h-170-pc {
    height: 170px;
  }
  .h-180-pc {
    height: 180px;
  }
  .h-190-pc {
    height: 190px;
  }
  .h-200-pc {
    height: 200px;
  }
  .h-210-pc {
    height: 210px;
  }
  .h-220-pc {
    height: 220px;
  }
  .h-230-pc {
    height: 230px;
  }
  .h-240-pc {
    height: 240px;
  }
  .h-250-pc {
    height: 250px;
  }
  .h-260-pc {
    height: 260px;
  }
  .h-270-pc {
    height: 270px;
  }
  .h-280-pc {
    height: 280px;
  }
  .h-290-pc {
    height: 290px;
  }
  .h-300-pc {
    height: 300px;
  }
  .h-400-pc {
    height: 400px;
  }
  .h-500-pc {
    height: 500px;
  }
  .h-600-pc {
    height: 600px;
  }
  .h-700-pc {
    height: 700px;
  }
  .h-800-pc {
    height: 800px;
  }
  .h-900-pc {
    height: 900px;
  }
  .h-1000-pc {
    height: 1000px;
  }

  .h-100per-pc {
    height: 100%;
  }

  .h-1vw-pc {
    height: 1vw;
  }
  .h-2vw-pc {
    height: 2vw;
  }
  .h-3vw-pc {
    height: 3vw;
  }
  .h-4vw-pc {
    height: 4vw;
  }
  .h-5vw-pc {
    height: 5vw;
  }
  .h-6vw-pc {
    height: 6vw;
  }
  .h-7vw-pc {
    height: 7vw;
  }
  .h-8vw-pc {
    height: 8vw;
  }
  .h-9vw-pc {
    height: 9vw;
  }
  .h-10vw-pc {
    height: 10vw;
  }
  .h-11vw-pc {
    height: 11vw;
  }
  .h-12vw-pc {
    height: 12vw;
  }
  .h-13vw-pc {
    height: 13vw;
  }
  .h-14vw-pc {
    height: 14vw;
  }
  .h-15vw-pc {
    height: 15vw;
  }
  .h-20vw-pc {
    height: 20vw;
  }
  .h-25vw-pc {
    height: 25vw;
  }
  .h-30vw-pc {
    height: 30vw;
  }
  .h-35vw-pc {
    height: 35vw;
  }
  .h-40vw-pc {
    height: 40vw;
  }
  .h-45vw-pc {
    height: 45vw;
  }
  .h-50vw-pc {
    height: 50vw;
  }
  .h-55vw-pc {
    height: 55vw;
  }
  .h-60vw-pc {
    height: 60vw;
  }
  .h-65vw-pc {
    height: 65vw;
  }
  .h-70vw-pc {
    height: 70vw;
  }
  .h-75vw-pc {
    height: 75vw;
  }
  .h-80vw-pc {
    height: 80vw;
  }
  .h-85vw-pc {
    height: 85vw;
  }
  .h-90vw-pc {
    height: 90vw;
  }
  .h-95vw-pc {
    height: 95vw;
  }
  .h-100vw-pc {
    height: 100vw;
  }

  .h-10vh-pc {
    height: 10vh;
  }
  .h-20vh-pc {
    height: 20vh;
  }
  .h-30vh-pc {
    height: 30vh;
  }
  .h-40vh-pc {
    height: 40vh;
  }
  .h-50vh-pc {
    height: 50vh;
  }
  .h-60vh-pc {
    height: 60vh;
  }
  .h-70vh-pc {
    height: 70vh;
  }
  .h-80vh-pc {
    height: 80vh;
  }
  .h-90vh-pc {
    height: 90vh;
  }
  .h-100vh-pc {
    height: 100vh;
  }

  .h-100svh-pc {
    height: 100svh;
  }
  .h-100lvh-pc {
    height: 100lvh;
  }
  .h-100dvh-pc {
    height: 100dvh;
  }

  .h-auto-pc {
    height: auto;
  }
}
/*
   MAX HEIGHT
--------------------------------------------------------------*/
.h-max100 {
  max-height: 100px;
}
.h-max150 {
  max-height: 150px;
}
.h-max200 {
  max-height: 200px;
}
.h-max250 {
  max-height: 250px;
}
.h-max300 {
  max-height: 300px;
}
.h-max350 {
  max-height: 350px;
}
.h-max400 {
  max-height: 400px;
}
.h-max450 {
  max-height: 450px;
}
.h-max500 {
  max-height: 500px;
}
.h-max550 {
  max-height: 550px;
}
.h-max600 {
  max-height: 600px;
}
.h-max650 {
  max-height: 650px;
}
.h-max700 {
  max-height: 700px;
}
.h-max750 {
  max-height: 750px;
}
.h-max800 {
  max-height: 800px;
}

.h-max100vh {
  max-height: 100vh;
}
@media screen and (max-width: 1023px) {
  .h-max100-sp {
    max-height: 100px;
  }
  .h-max150-sp {
    max-height: 150px;
  }
  .h-max200-sp {
    max-height: 200px;
  }
  .h-max250-sp {
    max-height: 250px;
  }
  .h-max300-sp {
    max-height: 300px;
  }
  .h-max350-sp {
    max-height: 350px;
  }
  .h-max400-sp {
    max-height: 400px;
  }
  .h-max450-sp {
    max-height: 450px;
  }
  .h-max500-sp {
    max-height: 500px;
  }
  .h-max550-sp {
    max-height: 550px;
  }
  .h-max600-sp {
    max-height: 600px;
  }
  .h-max650-sp {
    max-height: 650px;
  }
  .h-max700-sp {
    max-height: 700px;
  }
  .h-max750-sp {
    max-height: 750px;
  }
  .h-max800-sp {
    max-height: 800px;
  }

  .h-max100vh-sp {
    max-height: 100vh;
  }
}
@media screen and (min-width: 768px) {
  .h-max100-tpc {
    max-height: 100px;
  }
  .h-max150-tpc {
    max-height: 150px;
  }
  .h-max200-tpc {
    max-height: 200px;
  }
  .h-max250-tpc {
    max-height: 250px;
  }
  .h-max300-tpc {
    max-height: 300px;
  }
  .h-max350-tpc {
    max-height: 350px;
  }
  .h-max400-tpc {
    max-height: 400px;
  }
  .h-max450-tpc {
    max-height: 450px;
  }
  .h-max500-tpc {
    max-height: 500px;
  }
  .h-max550-tpc {
    max-height: 550px;
  }
  .h-max600-tpc {
    max-height: 600px;
  }
  .h-max650-tpc {
    max-height: 650px;
  }
  .h-max700-tpc {
    max-height: 700px;
  }
  .h-max750-tpc {
    max-height: 750px;
  }
  .h-max800-tpc {
    max-height: 800px;
  }

  .h-max100vh-tpc {
    max-height: 100vh;
  }
}
@media screen and (min-width: 1024px) {
  .h-max100-pc {
    max-height: 100px;
  }
  .h-max150-pc {
    max-height: 150px;
  }
  .h-max200-pc {
    max-height: 200px;
  }
  .h-max250-pc {
    max-height: 250px;
  }
  .h-max300-pc {
    max-height: 300px;
  }
  .h-max350-pc {
    max-height: 350px;
  }
  .h-max400-pc {
    max-height: 400px;
  }
  .h-max450-pc {
    max-height: 450px;
  }
  .h-max500-pc {
    max-height: 500px;
  }
  .h-max550-pc {
    max-height: 550px;
  }
  .h-max600-pc {
    max-height: 600px;
  }
  .h-max650-pc {
    max-height: 650px;
  }
  .h-max700-pc {
    max-height: 700px;
  }
  .h-max750-pc {
    max-height: 750px;
  }
  .h-max800-pc {
    max-height: 800px;
  }

  .h-max100vh-pc {
    max-height: 100vh;
  }
}
/*
   PADDING
--------------------------------------------------------------*/
.p-5 {
  padding: calc(5px * var(--space-ratio));
}
.p-8 {
  padding: calc(8px * var(--space-ratio));
}
.p-10 {
  padding: calc(10px * var(--space-ratio));
}
.p-15 {
  padding: calc(15px * var(--space-ratio));
}
.p-20 {
  padding: calc(20px * var(--space-ratio));
}
.p-25 {
  padding: calc(25px * var(--space-ratio));
}
.p-30 {
  padding: calc(30px * var(--space-ratio));
}
.p-35 {
  padding: calc(35px * var(--space-ratio));
}
.p-40 {
  padding: calc(40px * var(--space-ratio));
}
.p-45 {
  padding: calc(45px * var(--space-ratio));
}
.p-50 {
  padding: calc(50px * var(--space-ratio));
}
.p-60 {
  padding: calc(60px * var(--space-ratio));
}
.p-70 {
  padding: calc(70px * var(--space-ratio));
}
.p-80 {
  padding: calc(80px * var(--space-ratio));
}
.p-90 {
  padding: calc(90px * var(--space-ratio));
}
.p-100 {
  padding: calc(100px * var(--space-ratio));
}
.p-110 {
  padding: calc(110px * var(--space-ratio));
}
.p-120 {
  padding: calc(120px * var(--space-ratio));
}
.p-130 {
  padding: calc(130px * var(--space-ratio));
}
.p-140 {
  padding: calc(140px * var(--space-ratio));
}
.p-150 {
  padding: calc(150px * var(--space-ratio));
}
.p-160 {
  padding: calc(160px * var(--space-ratio));
}
.p-170 {
  padding: calc(170px * var(--space-ratio));
}
.p-180 {
  padding: calc(180px * var(--space-ratio));
}
.p-190 {
  padding: calc(190px * var(--space-ratio));
}
.p-200 {
  padding: calc(200px * var(--space-ratio));
}

.p-1vw {
  padding: 1vw;
}
.p-2vw {
  padding: 2vw;
}
.p-3vw {
  padding: 3vw;
}
.p-4vw {
  padding: 4vw;
}
.p-5vw {
  padding: 5vw;
}
.p-6vw {
  padding: 6vw;
}
.p-7vw {
  padding: 7vw;
}
.p-8vw {
  padding: 8vw;
}
.p-9vw {
  padding: 9vw;
}
.p-10vw {
  padding: 10vw;
}
.p-11vw {
  padding: 11vw;
}
.p-12vw {
  padding: 12vw;
}
.p-13vw {
  padding: 13vw;
}
.p-14vw {
  padding: 14vw;
}
.p-15vw {
  padding: 15vw;
}

@media screen and (max-width: 1023px) {
  .p-5-sp {
    padding: 5px;
  }
  .p-8-sp {
    padding: 8px;
  }
  .p-10-sp {
    padding: 10px;
  }
  .p-15-sp {
    padding: 15px;
  }
  .p-20-sp {
    padding: 20px;
  }
  .p-25-sp {
    padding: 25px;
  }
  .p-30-sp {
    padding: 35px;
  }
  .p-35-sp {
    padding: 30px;
  }
  .p-40-sp {
    padding: 40px;
  }
  .p-45-sp {
    padding: 45px;
  }
  .p-50-sp {
    padding: 50px;
  }
  .p-60-sp {
    padding: 60px;
  }
  .p-70-sp {
    padding: 70px;
  }
  .p-80-sp {
    padding: 80px;
  }
  .p-90-sp {
    padding: 90px;
  }
  .p-100-sp {
    padding: 100px;
  }
  .p-110-sp {
    padding: 110px;
  }
  .p-120-sp {
    padding: 120px;
  }
  .p-130-sp {
    padding: 130px;
  }
  .p-140-sp {
    padding: 140px;
  }
  .p-150-sp {
    padding: 150px;
  }
  .p-160-sp {
    padding: 160px;
  }
  .p-170-sp {
    padding: 170px;
  }
  .p-180-sp {
    padding: 180px;
  }
  .p-190-sp {
    padding: 190px;
  }
  .p-200-sp {
    padding: 200px;
  }

  .p-1vw-sp {
    padding: 1vw;
  }
  .p-2vw-sp {
    padding: 2vw;
  }
  .p-3vw-sp {
    padding: 3vw;
  }
  .p-4vw-sp {
    padding: 4vw;
  }
  .p-5vw-sp {
    padding: 5vw;
  }
  .p-6vw-sp {
    padding: 6vw;
  }
  .p-7vw-sp {
    padding: 7vw;
  }
  .p-8vw-sp {
    padding: 8vw;
  }
  .p-9vw-sp {
    padding: 9vw;
  }
  .p-10vw-sp {
    padding: 10vw;
  }
  .p-11vw-sp {
    padding: 11vw;
  }
  .p-12vw-sp {
    padding: 12vw;
  }
  .p-13vw-sp {
    padding: 13vw;
  }
  .p-14vw-sp {
    padding: 14vw;
  }
  .p-15vw-sp {
    padding: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .p-5-tpc {
    padding: 5px;
  }
  .p-8-tpc {
    padding: 8px;
  }
  .p-10-tpc {
    padding: 10px;
  }
  .p-15-tpc {
    padding: 15px;
  }
  .p-20-tpc {
    padding: 20px;
  }
  .p-25-tpc {
    padding: 25px;
  }
  .p-30-tpc {
    padding: 30px;
  }
  .p-35-tpc {
    padding: 35px;
  }
  .p-40-tpc {
    padding: 40px;
  }
  .p-45-tpc {
    padding: 45px;
  }
  .p-50-tpc {
    padding: 50px;
  }
  .p-60-tpc {
    padding: 60px;
  }
  .p-70-tpc {
    padding: 70px;
  }
  .p-80-tpc {
    padding: 80px;
  }
  .p-90-tpc {
    padding: 90px;
  }
  .p-100-tpc {
    padding: 100px;
  }
  .p-110-tpc {
    padding: 110px;
  }
  .p-120-tpc {
    padding: 120px;
  }
  .p-130-tpc {
    padding: 130px;
  }
  .p-140-tpc {
    padding: 140px;
  }
  .p-150-tpc {
    padding: 150px;
  }
  .p-160-tpc {
    padding: 160px;
  }
  .p-170-tpc {
    padding: 170px;
  }
  .p-180-tpc {
    padding: 180px;
  }
  .p-190-tpc {
    padding: 190px;
  }
  .p-200-tpc {
    padding: 200px;
  }

  .p-1vw-tpc {
    padding: 1vw;
  }
  .p-2vw-tpc {
    padding: 2vw;
  }
  .p-3vw-tpc {
    padding: 3vw;
  }
  .p-4vw-tpc {
    padding: 4vw;
  }
  .p-5vw-tpc {
    padding: 5vw;
  }
  .p-6vw-tpc {
    padding: 6vw;
  }
  .p-7vw-tpc {
    padding: 7vw;
  }
  .p-8vw-tpc {
    padding: 8vw;
  }
  .p-9vw-tpc {
    padding: 9vw;
  }
  .p-10vw-tpc {
    padding: 10vw;
  }
  .p-11vw-tpc {
    padding: 11vw;
  }
  .p-12vw-tpc {
    padding: 12vw;
  }
  .p-13vw-tpc {
    padding: 13vw;
  }
  .p-14vw-tpc {
    padding: 14vw;
  }
  .p-15vw-tpc {
    padding: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .p-5-pc {
    padding: 5px;
  }
  .p-8-pc {
    padding: 8px;
  }
  .p-10-pc {
    padding: 10px;
  }
  .p-15-pc {
    padding: 15px;
  }
  .p-20-pc {
    padding: 20px;
  }
  .p-25-pc {
    padding: 25px;
  }
  .p-30-pc {
    padding: 30px;
  }
  .p-35-pc {
    padding: 35px;
  }
  .p-40-pc {
    padding: 40px;
  }
  .p-45-pc {
    padding: 45px;
  }
  .p-50-pc {
    padding: 50px;
  }
  .p-60-pc {
    padding: 60px;
  }
  .p-70-pc {
    padding: 70px;
  }
  .p-80-pc {
    padding: 80px;
  }
  .p-90-pc {
    padding: 90px;
  }
  .p-100-pc {
    padding: 100px;
  }
  .p-110-pc {
    padding: 110px;
  }
  .p-120-pc {
    padding: 120px;
  }
  .p-130-pc {
    padding: 130px;
  }
  .p-140-pc {
    padding: 140px;
  }
  .p-150-pc {
    padding: 150px;
  }
  .p-160-pc {
    padding: 160px;
  }
  .p-170-pc {
    padding: 170px;
  }
  .p-180-pc {
    padding: 180px;
  }
  .p-190-pc {
    padding: 190px;
  }
  .p-200-pc {
    padding: 200px;
  }

  .p-1vw-pc {
    padding: 1vw;
  }
  .p-2vw-pc {
    padding: 2vw;
  }
  .p-3vw-pc {
    padding: 3vw;
  }
  .p-4vw-pc {
    padding: 4vw;
  }
  .p-5vw-pc {
    padding: 5vw;
  }
  .p-6vw-pc {
    padding: 6vw;
  }
  .p-7vw-pc {
    padding: 7vw;
  }
  .p-8vw-pc {
    padding: 8vw;
  }
  .p-9vw-pc {
    padding: 9vw;
  }
  .p-10vw-pc {
    padding: 10vw;
  }
  .p-11vw-pc {
    padding: 11vw;
  }
  .p-12vw-pc {
    padding: 12vw;
  }
  .p-13vw-pc {
    padding: 13vw;
  }
  .p-14vw-pc {
    padding: 14vw;
  }
  .p-15vw-pc {
    padding: 15vw;
  }
}

/*padding top bottom*/
.ptb-5 {
  padding-top: calc(5px * var(--space-ratio));
  padding-bottom: calc(5px * var(--space-ratio));
}
.ptb-8 {
  padding-top: calc(8px * var(--space-ratio));
  padding-bottom: calc(8px * var(--space-ratio));
}
.ptb-10 {
  padding-top: calc(10px * var(--space-ratio));
  padding-bottom: calc(10px * var(--space-ratio));
}
.ptb-15 {
  padding-top: calc(15px * var(--space-ratio));
  padding-bottom: calc(15px * var(--space-ratio));
}
.ptb-20 {
  padding-top: calc(20px * var(--space-ratio));
  padding-bottom: calc(20px * var(--space-ratio));
}
.ptb-25 {
  padding-top: calc(25px * var(--space-ratio));
  padding-bottom: calc(25px * var(--space-ratio));
}
.ptb-30 {
  padding-top: calc(30px * var(--space-ratio));
  padding-bottom: calc(30px * var(--space-ratio));
}
.ptb-35 {
  padding-top: calc(35px * var(--space-ratio));
  padding-bottom: calc(35px * var(--space-ratio));
}
.ptb-40 {
  padding-top: calc(40px * var(--space-ratio));
  padding-bottom: calc(40px * var(--space-ratio));
}
.ptb-45 {
  padding-top: calc(45px * var(--space-ratio));
  padding-bottom: calc(45px * var(--space-ratio));
}
.ptb-50 {
  padding-top: calc(50px * var(--space-ratio));
  padding-bottom: calc(50px * var(--space-ratio));
}
.ptb-60 {
  padding-top: calc(60px * var(--space-ratio));
  padding-bottom: calc(60px * var(--space-ratio));
}
.ptb-70 {
  padding-top: calc(70px * var(--space-ratio));
  padding-bottom: calc(70px * var(--space-ratio));
}
.ptb-80 {
  padding-top: calc(80px * var(--space-ratio));
  padding-bottom: calc(80px * var(--space-ratio));
}
.ptb-90 {
  padding-top: calc(90px * var(--space-ratio));
  padding-bottom: calc(90px * var(--space-ratio));
}
.ptb-100 {
  padding-top: calc(100px * var(--space-ratio));
  padding-bottom: calc(100px * var(--space-ratio));
}
.ptb-110 {
  padding-top: calc(110px * var(--space-ratio));
  padding-bottom: calc(110px * var(--space-ratio));
}
.ptb-120 {
  padding-top: calc(120px * var(--space-ratio));
  padding-bottom: calc(120px * var(--space-ratio));
}
.ptb-130 {
  padding-top: calc(130px * var(--space-ratio));
  padding-bottom: calc(130px * var(--space-ratio));
}
.ptb-140 {
  padding-top: calc(140px * var(--space-ratio));
  padding-bottom: calc(140px * var(--space-ratio));
}
.ptb-150 {
  padding-top: calc(150px * var(--space-ratio));
  padding-bottom: calc(150px * var(--space-ratio));
}
.ptb-160 {
  padding-top: calc(160px * var(--space-ratio));
  padding-bottom: calc(160px * var(--space-ratio));
}
.ptb-170 {
  padding-top: calc(170px * var(--space-ratio));
  padding-bottom: calc(170px * var(--space-ratio));
}
.ptb-180 {
  padding-top: calc(180px * var(--space-ratio));
  padding-bottom: calc(180px * var(--space-ratio));
}
.ptb-190 {
  padding-top: calc(190px * var(--space-ratio));
  padding-bottom: calc(190px * var(--space-ratio));
}
.ptb-200 {
  padding-top: calc(200px * var(--space-ratio));
  padding-bottom: calc(200px * var(--space-ratio));
}

.ptb-1vw {
  padding-top: 1vw;
  padding-bottom: 1vw;
}
.ptb-2vw {
  padding-top: 2vw;
  padding-bottom: 2vw;
}
.ptb-3vw {
  padding-top: 3vw;
  padding-bottom: 3vw;
}
.ptb-4vw {
  padding-top: 4vw;
  padding-bottom: 4vw;
}
.ptb-5vw {
  padding-top: 5vw;
  padding-bottom: 5vw;
}
.ptb-6vw {
  padding-top: 6vw;
  padding-bottom: 6vw;
}
.ptb-7vw {
  padding-top: 7vw;
  padding-bottom: 7vw;
}
.ptb-8vw {
  padding-top: 8vw;
  padding-bottom: 8vw;
}
.ptb-9vw {
  padding-top: 9vw;
  padding-bottom: 9vw;
}
.ptb-10vw {
  padding-top: 10vw;
  padding-bottom: 10vw;
}
.ptb-11vw {
  padding-top: 11vw;
  padding-bottom: 11vw;
}
.ptb-12vw {
  padding-top: 12vw;
  padding-bottom: 12vw;
}
.ptb-13vw {
  padding-top: 13vw;
  padding-bottom: 13vw;
}
.ptb-14vw {
  padding-top: 14vw;
  padding-bottom: 14vw;
}
.ptb-15vw {
  padding-top: 15vw;
  padding-bottom: 15vw;
}

@media screen and (max-width: 1023px) {
  .ptb-5-sp {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .ptb-8-sp {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .ptb-10-sp {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .ptb-15-sp {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .ptb-20-sp {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .ptb-25-sp {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .ptb-30-sp {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .ptb-35-sp {
    padding-top: 35px;
    padding-bottom: 35px;
  }
  .ptb-40-sp {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .ptb-45-sp {
    padding-top: 45px;
    padding-bottom: 45px;
  }
  .ptb-50-sp {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .ptb-60-sp {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .ptb-70-sp {
    padding-top: 70px;
    padding-bottom: 70px;
  }
  .ptb-80-sp {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .ptb-90-sp {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .ptb-100-sp {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .ptb-110-sp {
    padding-top: 110px;
    padding-bottom: 110px;
  }
  .ptb-120-sp {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .ptb-130-sp {
    padding-top: 130px;
    padding-bottom: 130px;
  }
  .ptb-140-sp {
    padding-top: 140px;
    padding-bottom: 140px;
  }
  .ptb-150-sp {
    padding-top: 150px;
    padding-bottom: 150px;
  }
  .ptb-160-sp {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .ptb-170-sp {
    padding-top: 170px;
    padding-bottom: 170px;
  }
  .ptb-180-sp {
    padding-top: 180px;
    padding-bottom: 180px;
  }
  .ptb-190-sp {
    padding-top: 190px;
    padding-bottom: 190px;
  }
  .ptb-200-sp {
    padding-top: 200px;
    padding-bottom: 200px;
  }

  .ptb-1vw-sp {
    padding-top: 1vw;
    padding-bottom: 1vw;
  }
  .ptb-2vw-sp {
    padding-top: 2vw;
    padding-bottom: 2vw;
  }
  .ptb-3vw-sp {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }
  .ptb-4vw-sp {
    padding-top: 4vw;
    padding-bottom: 4vw;
  }
  .ptb-5vw-sp {
    padding-top: 5vw;
    padding-bottom: 5vw;
  }
  .ptb-6vw-sp {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  .ptb-7vw-sp {
    padding-top: 7vw;
    padding-bottom: 7vw;
  }
  .ptb-8vw-sp {
    padding-top: 8vw;
    padding-bottom: 8vw;
  }
  .ptb-9vw-sp {
    padding-top: 9vw;
    padding-bottom: 9vw;
  }
  .ptb-10vw-sp {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
  .ptb-11vw-sp {
    padding-top: 11vw;
    padding-bottom: 11vw;
  }
  .ptb-12vw-sp {
    padding-top: 12vw;
    padding-bottom: 12vw;
  }
  .ptb-13vw-sp {
    padding-top: 13vw;
    padding-bottom: 13vw;
  }
  .ptb-14vw-sp {
    padding-top: 14vw;
    padding-bottom: 14vw;
  }
  .ptb-15vw-sp {
    padding-top: 15vw;
    padding-bottom: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .ptb-5-tpc {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .ptb-8-tpc {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .ptb-10-tpc {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .ptb-15-tpc {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .ptb-20-tpc {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .ptb-25-tpc {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .ptb-30-tpc {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .ptb-35-tpc {
    padding-top: 35px;
    padding-bottom: 35px;
  }
  .ptb-40-tpc {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .ptb-45-tpc {
    padding-top: 45px;
    padding-bottom: 45px;
  }
  .ptb-50-tpc {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .ptb-60-tpc {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .ptb-70-tpc {
    padding-top: 70px;
    padding-bottom: 70px;
  }
  .ptb-80-tpc {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .ptb-90-tpc {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .ptb-100-tpc {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .ptb-110-tpc {
    padding-top: 110px;
    padding-bottom: 110px;
  }
  .ptb-120-tpc {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .ptb-130-tpc {
    padding-top: 130px;
    padding-bottom: 130px;
  }
  .ptb-140-tpc {
    padding-top: 140px;
    padding-bottom: 140px;
  }
  .ptb-150-tpc {
    padding-top: 150px;
    padding-bottom: 150px;
  }
  .ptb-160-tpc {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .ptb-170-tpc {
    padding-top: 170px;
    padding-bottom: 170px;
  }
  .ptb-180-tpc {
    padding-top: 180px;
    padding-bottom: 180px;
  }
  .ptb-190-tpc {
    padding-top: 190px;
    padding-bottom: 190px;
  }
  .ptb-200-tpc {
    padding-top: 200px;
    padding-bottom: 200px;
  }

  .ptb-1vw-tpc {
    padding-top: 1vw;
    padding-bottom: 1vw;
  }
  .ptb-2vw-tpc {
    padding-top: 2vw;
    padding-bottom: 2vw;
  }
  .ptb-3vw-tpc {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }
  .ptb-4vw-tpc {
    padding-top: 4vw;
    padding-bottom: 4vw;
  }
  .ptb-5vw-tpc {
    padding-top: 5vw;
    padding-bottom: 5vw;
  }
  .ptb-6vw-tpc {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  .ptb-7vw-tpc {
    padding-top: 7vw;
    padding-bottom: 7vw;
  }
  .ptb-8vw-tpc {
    padding-top: 8vw;
    padding-bottom: 8vw;
  }
  .ptb-9vw-tpc {
    padding-top: 9vw;
    padding-bottom: 9vw;
  }
  .ptb-10vw-tpc {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
  .ptb-11vw-tpc {
    padding-top: 11vw;
    padding-bottom: 11vw;
  }
  .ptb-12vw-tpc {
    padding-top: 12vw;
    padding-bottom: 12vw;
  }
  .ptb-13vw-tpc {
    padding-top: 13vw;
    padding-bottom: 13vw;
  }
  .ptb-14vw-tpc {
    padding-top: 14vw;
    padding-bottom: 14vw;
  }
  .ptb-15vw-tpc {
    padding-top: 15vw;
    padding-bottom: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .ptb-5-pc {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .ptb-8-pc {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .ptb-10-pc {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .ptb-15-pc {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .ptb-20-pc {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .ptb-25-pc {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .ptb-30-pc {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .ptb-35-pc {
    padding-top: 35px;
    padding-bottom: 35px;
  }
  .ptb-40-pc {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .ptb-45-pc {
    padding-top: 45px;
    padding-bottom: 45px;
  }
  .ptb-50-pc {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .ptb-60-pc {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .ptb-70-pc {
    padding-top: 70px;
    padding-bottom: 70px;
  }
  .ptb-80-pc {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .ptb-90-pc {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .ptb-100-pc {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .ptb-110-pc {
    padding-top: 110px;
    padding-bottom: 110px;
  }
  .ptb-120-pc {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .ptb-130-pc {
    padding-top: 130px;
    padding-bottom: 130px;
  }
  .ptb-140-pc {
    padding-top: 140px;
    padding-bottom: 140px;
  }
  .ptb-150-pc {
    padding-top: 150px;
    padding-bottom: 150px;
  }
  .ptb-160-pc {
    padding-top: 160px;
    padding-bottom: 160px;
  }
  .ptb-170-pc {
    padding-top: 170px;
    padding-bottom: 170px;
  }
  .ptb-180-pc {
    padding-top: 180px;
    padding-bottom: 180px;
  }
  .ptb-190-pc {
    padding-top: 190px;
    padding-bottom: 190px;
  }
  .ptb-200-pc {
    padding-top: 200px;
    padding-bottom: 200px;
  }

  .ptb-1vw-pc {
    padding-top: 1vw;
    padding-bottom: 1vw;
  }
  .ptb-2vw-pc {
    padding-top: 2vw;
    padding-bottom: 2vw;
  }
  .ptb-3vw-pc {
    padding-top: 3vw;
    padding-bottom: 3vw;
  }
  .ptb-4vw-pc {
    padding-top: 4vw;
    padding-bottom: 4vw;
  }
  .ptb-5vw-pc {
    padding-top: 5vw;
    padding-bottom: 5vw;
  }
  .ptb-6vw-pc {
    padding-top: 6vw;
    padding-bottom: 6vw;
  }
  .ptb-7vw-pc {
    padding-top: 7vw;
    padding-bottom: 7vw;
  }
  .ptb-8vw-pc {
    padding-top: 8vw;
    padding-bottom: 8vw;
  }
  .ptb-9vw-pc {
    padding-top: 9vw;
    padding-bottom: 9vw;
  }
  .ptb-10vw-pc {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
  .ptb-11vw-pc {
    padding-top: 11vw;
    padding-bottom: 11vw;
  }
  .ptb-12vw-pc {
    padding-top: 12vw;
    padding-bottom: 12vw;
  }
  .ptb-13vw-pc {
    padding-top: 13vw;
    padding-bottom: 13vw;
  }
  .ptb-14vw-pc {
    padding-top: 14vw;
    padding-bottom: 14vw;
  }
  .ptb-15vw-pc {
    padding-top: 15vw;
    padding-bottom: 15vw;
  }
}

/*padding right left*/
.prl-5 {
  padding-right: calc(5px * var(--space-ratio));
  padding-left: calc(5px * var(--space-ratio));
}
.prl-8 {
  padding-right: calc(8px * var(--space-ratio));
  padding-left: calc(8px * var(--space-ratio));
}
.prl-10 {
  padding-right: calc(10px * var(--space-ratio));
  padding-left: calc(10px * var(--space-ratio));
}
.prl-15 {
  padding-right: calc(15px * var(--space-ratio));
  padding-left: calc(15px * var(--space-ratio));
}
.prl-20 {
  padding-right: calc(20px * var(--space-ratio));
  padding-left: calc(20px * var(--space-ratio));
}
.prl-25 {
  padding-right: calc(25px * var(--space-ratio));
  padding-left: calc(25px * var(--space-ratio));
}
.prl-30 {
  padding-right: calc(30px * var(--space-ratio));
  padding-left: calc(30px * var(--space-ratio));
}
.prl-35 {
  padding-right: calc(30px * var(--space-ratio));
  padding-left: calc(35px * var(--space-ratio));
}
.prl-40 {
  padding-right: calc(40px * var(--space-ratio));
  padding-left: calc(40px * var(--space-ratio));
}
.prl-45 {
  padding-right: calc(45px * var(--space-ratio));
  padding-left: calc(45px * var(--space-ratio));
}
.prl-50 {
  padding-right: calc(50px * var(--space-ratio));
  padding-left: calc(50px * var(--space-ratio));
}
.prl-60 {
  padding-right: calc(60px * var(--space-ratio));
  padding-left: calc(60px * var(--space-ratio));
}
.prl-70 {
  padding-right: calc(70px * var(--space-ratio));
  padding-left: calc(70px * var(--space-ratio));
}
.prl-80 {
  padding-right: calc(80px * var(--space-ratio));
  padding-left: calc(80px * var(--space-ratio));
}
.prl-90 {
  padding-right: calc(90px * var(--space-ratio));
  padding-left: calc(90px * var(--space-ratio));
}
.prl-100 {
  padding-right: calc(100px * var(--space-ratio));
  padding-left: calc(100px * var(--space-ratio));
}
.prl-110 {
  padding-right: calc(110px * var(--space-ratio));
  padding-left: calc(110px * var(--space-ratio));
}
.prl-120 {
  padding-right: calc(120px * var(--space-ratio));
  padding-left: calc(120px * var(--space-ratio));
}
.prl-130 {
  padding-right: calc(130px * var(--space-ratio));
  padding-left: calc(130px * var(--space-ratio));
}
.prl-140 {
  padding-right: calc(140px * var(--space-ratio));
  padding-left: calc(140px * var(--space-ratio));
}
.prl-150 {
  padding-right: calc(150px * var(--space-ratio));
  padding-left: calc(150px * var(--space-ratio));
}
.prl-160 {
  padding-right: calc(160px * var(--space-ratio));
  padding-left: calc(160px * var(--space-ratio));
}
.prl-170 {
  padding-right: calc(170px * var(--space-ratio));
  padding-left: calc(170px * var(--space-ratio));
}
.prl-180 {
  padding-right: calc(180px * var(--space-ratio));
  padding-left: calc(180px * var(--space-ratio));
}
.prl-190 {
  padding-right: calc(190px * var(--space-ratio));
  padding-left: calc(190px * var(--space-ratio));
}
.prl-200 {
  padding-right: calc(200px * var(--space-ratio));
  padding-left: calc(200px * var(--space-ratio));
}

.prl-1vw {
  padding-right: 1vw;
  padding-left: 1vw;
}
.prl-2vw {
  padding-right: 2vw;
  padding-left: 2vw;
}
.prl-3vw {
  padding-right: 3vw;
  padding-left: 3vw;
}
.prl-4vw {
  padding-right: 4vw;
  padding-left: 4vw;
}
.prl-5vw {
  padding-right: 5vw;
  padding-left: 5vw;
}
.prl-6vw {
  padding-right: 6vw;
  padding-left: 6vw;
}
.prl-7vw {
  padding-right: 7vw;
  padding-left: 7vw;
}
.prl-8vw {
  padding-right: 8vw;
  padding-left: 8vw;
}
.prl-9vw {
  padding-right: 9vw;
  padding-left: 9vw;
}
.prl-10vw {
  padding-right: 10vw;
  padding-left: 10vw;
}
.prl-11vw {
  padding-right: 11vw;
  padding-left: 11vw;
}
.prl-12vw {
  padding-right: 12vw;
  padding-left: 12vw;
}
.prl-13vw {
  padding-right: 13vw;
  padding-left: 13vw;
}
.prl-14vw {
  padding-right: 14vw;
  padding-left: 14vw;
}
.prl-15vw {
  padding-right: 15vw;
  padding-left: 15vw;
}

.prl-s {
  padding-right: var(--space-s);
  padding-left: var(--space-s);
}
.prl-m {
  padding-right: var(--space-m);
  padding-left: var(--space-m);
}
.prl-l {
  padding-right: var(--space-l);
  padding-left: var(--space-l);
}

@media screen and (max-width: 1023px) {
  .prl-5-sp {
    padding-right: 5px;
    padding-left: 5px;
  }
  .prl-8-sp {
    padding-right: 8px;
    padding-left: 8px;
  }
  .prl-10-sp {
    padding-right: 10px;
    padding-left: 10px;
  }
  .prl-15-sp {
    padding-right: 15px;
    padding-left: 15px;
  }
  .prl-20-sp {
    padding-right: 20px;
    padding-left: 20px;
  }
  .prl-25-sp {
    padding-right: 25px;
    padding-left: 25px;
  }
  .prl-30-sp {
    padding-right: 30px;
    padding-left: 30px;
  }
  .prl-35-sp {
    padding-right: 35px;
    padding-left: 35px;
  }
  .prl-40-sp {
    padding-right: 40px;
    padding-left: 40px;
  }
  .prl-45-sp {
    padding-right: 45px;
    padding-left: 45px;
  }
  .prl-50-sp {
    padding-right: 50px;
    padding-left: 50px;
  }
  .prl-60-sp {
    padding-right: 60px;
    padding-left: 60px;
  }
  .prl-70-sp {
    padding-right: 70px;
    padding-left: 70px;
  }
  .prl-80-sp {
    padding-right: 80px;
    padding-left: 80px;
  }
  .prl-90-sp {
    padding-right: 90px;
    padding-left: 90px;
  }
  .prl-100-sp {
    padding-right: 100px;
    padding-left: 100px;
  }
  .prl-110-sp {
    padding-right: 110px;
    padding-left: 110px;
  }
  .prl-120-sp {
    padding-right: 120px;
    padding-left: 120px;
  }
  .prl-130-sp {
    padding-right: 130px;
    padding-left: 130px;
  }
  .prl-140-sp {
    padding-right: 140px;
    padding-left: 140px;
  }
  .prl-150-sp {
    padding-right: 150px;
    padding-left: 150px;
  }
  .prl-160-sp {
    padding-right: 160px;
    padding-left: 160px;
  }
  .prl-170-sp {
    padding-right: 170px;
    padding-left: 170px;
  }
  .prl-180-sp {
    padding-right: 180px;
    padding-left: 180px;
  }
  .prl-190-sp {
    padding-right: 190px;
    padding-left: 190px;
  }
  .prl-200-sp {
    padding-right: 200px;
    padding-left: 200px;
  }

  .prl-1vw-sp {
    padding-right: 1vw;
    padding-left: 1vw;
  }
  .prl-2vw-sp {
    padding-right: 2vw;
    padding-left: 2vw;
  }
  .prl-3vw-sp {
    padding-right: 3vw;
    padding-left: 3vw;
  }
  .prl-4vw-sp {
    padding-right: 4vw;
    padding-left: 4vw;
  }
  .prl-5vw-sp {
    padding-right: 5vw;
    padding-left: 5vw;
  }
  .prl-6vw-sp {
    padding-right: 6vw;
    padding-left: 6vw;
  }
  .prl-7vw-sp {
    padding-right: 7vw;
    padding-left: 7vw;
  }
  .prl-8vw-sp {
    padding-right: 8vw;
    padding-left: 8vw;
  }
  .prl-9vw-sp {
    padding-right: 9vw;
    padding-left: 9vw;
  }
  .prl-10vw-sp {
    padding-right: 10vw;
    padding-left: 10vw;
  }
  .prl-11vw-sp {
    padding-right: 11vw;
    padding-left: 11vw;
  }
  .prl-12vw-sp {
    padding-right: 12vw;
    padding-left: 12vw;
  }
  .prl-13vw-sp {
    padding-right: 13vw;
    padding-left: 13vw;
  }
  .prl-14vw-sp {
    padding-right: 14vw;
    padding-left: 14vw;
  }
  .prl-15vw-sp {
    padding-right: 15vw;
    padding-left: 15vw;
  }

  .prl-s-sp {
    padding-right: var(--space-s);
    padding-left: var(--space-s);
  }
  .prl-m-sp {
    padding-right: var(--space-m);
    padding-left: var(--space-m);
  }
  .prl-l-sp {
    padding-right: var(--space-l);
    padding-left: var(--space-l);
  }
}
@media screen and (min-width: 768px) {
  .prl-5-tpc {
    padding-right: 5px;
    padding-left: 5px;
  }
  .prl-8-tpc {
    padding-right: 8px;
    padding-left: 8px;
  }
  .prl-10-tpc {
    padding-right: 10px;
    padding-left: 10px;
  }
  .prl-15-tpc {
    padding-right: 15px;
    padding-left: 15px;
  }
  .prl-20-tpc {
    padding-right: 20px;
    padding-left: 20px;
  }
  .prl-25-tpc {
    padding-right: 25px;
    padding-left: 25px;
  }
  .prl-30-tpc {
    padding-right: 30px;
    padding-left: 30px;
  }
  .prl-35-tpc {
    padding-right: 35px;
    padding-left: 35px;
  }
  .prl-40-tpc {
    padding-right: 40px;
    padding-left: 40px;
  }
  .prl-45-tpc {
    padding-right: 45px;
    padding-left: 45px;
  }
  .prl-50-tpc {
    padding-right: 50px;
    padding-left: 50px;
  }
  .prl-60-tpc {
    padding-right: 60px;
    padding-left: 60px;
  }
  .prl-70-tpc {
    padding-right: 70px;
    padding-left: 70px;
  }
  .prl-80-tpc {
    padding-right: 80px;
    padding-left: 80px;
  }
  .prl-90-tpc {
    padding-right: 90px;
    padding-left: 90px;
  }
  .prl-100-tpc {
    padding-right: 100px;
    padding-left: 100px;
  }
  .prl-110-tpc {
    padding-right: 110px;
    padding-left: 110px;
  }
  .prl-120-tpc {
    padding-right: 120px;
    padding-left: 120px;
  }
  .prl-130-tpc {
    padding-right: 130px;
    padding-left: 130px;
  }
  .prl-140-tpc {
    padding-right: 140px;
    padding-left: 140px;
  }
  .prl-150-tpc {
    padding-right: 150px;
    padding-left: 150px;
  }
  .prl-160-tpc {
    padding-right: 160px;
    padding-left: 160px;
  }
  .prl-170-tpc {
    padding-right: 170px;
    padding-left: 170px;
  }
  .prl-180-tpc {
    padding-right: 180px;
    padding-left: 180px;
  }
  .prl-190-tpc {
    padding-right: 190px;
    padding-left: 190px;
  }
  .prl-200-tpc {
    padding-right: 200px;
    padding-left: 200px;
  }

  .prl-1vw-tpc {
    padding-right: 1vw;
    padding-left: 1vw;
  }
  .prl-2vw-tpc {
    padding-right: 2vw;
    padding-left: 2vw;
  }
  .prl-3vw-tpc {
    padding-right: 3vw;
    padding-left: 3vw;
  }
  .prl-4vw-tpc {
    padding-right: 4vw;
    padding-left: 4vw;
  }
  .prl-5vw-tpc {
    padding-right: 5vw;
    padding-left: 5vw;
  }
  .prl-6vw-tpc {
    padding-right: 6vw;
    padding-left: 6vw;
  }
  .prl-7vw-tpc {
    padding-right: 7vw;
    padding-left: 7vw;
  }
  .prl-8vw-tpc {
    padding-right: 8vw;
    padding-left: 8vw;
  }
  .prl-9vw-tpc {
    padding-right: 9vw;
    padding-left: 9vw;
  }
  .prl-10vw-tpc {
    padding-right: 10vw;
    padding-left: 10vw;
  }
  .prl-11vw-tpc {
    padding-right: 11vw;
    padding-left: 11vw;
  }
  .prl-12vw-tpc {
    padding-right: 12vw;
    padding-left: 12vw;
  }
  .prl-13vw-tpc {
    padding-right: 13vw;
    padding-left: 13vw;
  }
  .prl-14vw-tpc {
    padding-right: 14vw;
    padding-left: 14vw;
  }
  .prl-15vw-tpc {
    padding-right: 15vw;
    padding-left: 15vw;
  }

  .prl-s-tpc {
    padding-right: var(--space-s);
    padding-left: var(--space-s);
  }
  .prl-m-tpc {
    padding-right: var(--space-m);
    padding-left: var(--space-m);
  }
  .prl-l-tpc {
    padding-right: var(--space-l);
    padding-left: var(--space-l);
  }
}
@media screen and (min-width: 1024px) {
  .prl-5-pc {
    padding-right: 5px;
    padding-left: 5px;
  }
  .prl-8-pc {
    padding-right: 8px;
    padding-left: 8px;
  }
  .prl-10-pc {
    padding-right: 10px;
    padding-left: 10px;
  }
  .prl-15-pc {
    padding-right: 15px;
    padding-left: 15px;
  }
  .prl-20-pc {
    padding-right: 20px;
    padding-left: 20px;
  }
  .prl-25-pc {
    padding-right: 25px;
    padding-left: 25px;
  }
  .prl-30-pc {
    padding-right: 30px;
    padding-left: 30px;
  }
  .prl-35-pc {
    padding-right: 35px;
    padding-left: 35px;
  }
  .prl-40-pc {
    padding-right: 40px;
    padding-left: 40px;
  }
  .prl-45-pc {
    padding-right: 45px;
    padding-left: 45px;
  }
  .prl-50-pc {
    padding-right: 50px;
    padding-left: 50px;
  }
  .prl-60-pc {
    padding-right: 60px;
    padding-left: 60px;
  }
  .prl-70-pc {
    padding-right: 70px;
    padding-left: 70px;
  }
  .prl-80-pc {
    padding-right: 80px;
    padding-left: 80px;
  }
  .prl-90-pc {
    padding-right: 90px;
    padding-left: 90px;
  }
  .prl-100-pc {
    padding-right: 100px;
    padding-left: 100px;
  }
  .prl-110-pc {
    padding-right: 110px;
    padding-left: 110px;
  }
  .prl-120-pc {
    padding-right: 120px;
    padding-left: 120px;
  }
  .prl-130-pc {
    padding-right: 130px;
    padding-left: 130px;
  }
  .prl-140-pc {
    padding-right: 140px;
    padding-left: 140px;
  }
  .prl-150-pc {
    padding-right: 150px;
    padding-left: 150px;
  }
  .prl-160-pc {
    padding-right: 160px;
    padding-left: 160px;
  }
  .prl-170-pc {
    padding-right: 170px;
    padding-left: 170px;
  }
  .prl-180-pc {
    padding-right: 180px;
    padding-left: 180px;
  }
  .prl-190-pc {
    padding-right: 190px;
    padding-left: 190px;
  }
  .prl-200-pc {
    padding-right: 200px;
    padding-left: 200px;
  }

  .prl-1vw-pc {
    padding-right: 1vw;
    padding-left: 1vw;
  }
  .prl-2vw-pc {
    padding-right: 2vw;
    padding-left: 2vw;
  }
  .prl-3vw-pc {
    padding-right: 3vw;
    padding-left: 3vw;
  }
  .prl-4vw-pc {
    padding-right: 4vw;
    padding-left: 4vw;
  }
  .prl-5vw-pc {
    padding-right: 5vw;
    padding-left: 5vw;
  }
  .prl-6vw-pc {
    padding-right: 6vw;
    padding-left: 6vw;
  }
  .prl-7vw-pc {
    padding-right: 7vw;
    padding-left: 7vw;
  }
  .prl-8vw-pc {
    padding-right: 8vw;
    padding-left: 8vw;
  }
  .prl-9vw-pc {
    padding-right: 9vw;
    padding-left: 9vw;
  }
  .prl-10vw-pc {
    padding-right: 10vw;
    padding-left: 10vw;
  }
  .prl-11vw-pc {
    padding-right: 11vw;
    padding-left: 11vw;
  }
  .prl-12vw-pc {
    padding-right: 12vw;
    padding-left: 12vw;
  }
  .prl-13vw-pc {
    padding-right: 13vw;
    padding-left: 13vw;
  }
  .prl-14vw-pc {
    padding-right: 14vw;
    padding-left: 14vw;
  }
  .prl-15vw-pc {
    padding-right: 15vw;
    padding-left: 15vw;
  }

  .prl-s-pc {
    padding-right: var(--space-s);
    padding-left: var(--space-s);
  }
  .prl-m-pc {
    padding-right: var(--space-m);
    padding-left: var(--space-m);
  }
  .prl-l-pc {
    padding-right: var(--space-l);
    padding-left: var(--space-l);
  }
}

/*padding top*/
.pt-5 {
  padding-top: calc(5px * var(--space-ratio));
}
.pt-8 {
  padding-top: calc(8px * var(--space-ratio));
}
.pt-10 {
  padding-top: calc(10px * var(--space-ratio));
}
.pt-15 {
  padding-top: calc(15px * var(--space-ratio));
}
.pt-20 {
  padding-top: calc(20px * var(--space-ratio));
}
.pt-25 {
  padding-top: calc(25px * var(--space-ratio));
}
.pt-30 {
  padding-top: calc(35px * var(--space-ratio));
}
.pt-35 {
  padding-top: calc(30px * var(--space-ratio));
}
.pt-40 {
  padding-top: calc(40px * var(--space-ratio));
}
.pt-45 {
  padding-top: calc(45px * var(--space-ratio));
}
.pt-50 {
  padding-top: calc(50px * var(--space-ratio));
}
.pt-60 {
  padding-top: calc(60px * var(--space-ratio));
}
.pt-70 {
  padding-top: calc(70px * var(--space-ratio));
}
.pt-80 {
  padding-top: calc(80px * var(--space-ratio));
}
.pt-90 {
  padding-top: calc(90px * var(--space-ratio));
}
.pt-100 {
  padding-top: calc(100px * var(--space-ratio));
}
.pt-110 {
  padding-top: calc(110px * var(--space-ratio));
}
.pt-120 {
  padding-top: calc(120px * var(--space-ratio));
}
.pt-130 {
  padding-top: calc(130px * var(--space-ratio));
}
.pt-140 {
  padding-top: calc(140px * var(--space-ratio));
}
.pt-150 {
  padding-top: calc(150px * var(--space-ratio));
}
.pt-160 {
  padding-top: calc(160px * var(--space-ratio));
}
.pt-170 {
  padding-top: calc(170px * var(--space-ratio));
}
.pt-180 {
  padding-top: calc(180px * var(--space-ratio));
}
.pt-190 {
  padding-top: calc(190px * var(--space-ratio));
}
.pt-200 {
  padding-top: calc(200px * var(--space-ratio));
}

.pt-1vw {
  padding-top: 1vw;
}
.pt-2vw {
  padding-top: 2vw;
}
.pt-3vw {
  padding-top: 3vw;
}
.pt-4vw {
  padding-top: 4vw;
}
.pt-5vw {
  padding-top: 5vw;
}
.pt-6vw {
  padding-top: 6vw;
}
.pt-7vw {
  padding-top: 7vw;
}
.pt-8vw {
  padding-top: 8vw;
}
.pt-9vw {
  padding-top: 9vw;
}
.pt-10vw {
  padding-top: 10vw;
}
.pt-11vw {
  padding-top: 11vw;
}
.pt-12vw {
  padding-top: 12vw;
}
.pt-13vw {
  padding-top: 13vw;
}
.pt-14vw {
  padding-top: 14vw;
}
.pt-15vw {
  padding-top: 15vw;
}

@media screen and (max-width: 1023px) {
  .pt-5-sp {
    padding-top: 5px;
  }
  .pt-8-sp {
    padding-top: 8px;
  }
  .pt-10-sp {
    padding-top: 10px;
  }
  .pt-15-sp {
    padding-top: 15px;
  }
  .pt-20-sp {
    padding-top: 20px;
  }
  .pt-25-sp {
    padding-top: 25px;
  }
  .pt-30-sp {
    padding-top: 30px;
  }
  .pt-35-sp {
    padding-top: 35px;
  }
  .pt-40-sp {
    padding-top: 40px;
  }
  .pt-45-sp {
    padding-top: 45px;
  }
  .pt-50-sp {
    padding-top: 50px;
  }
  .pt-60-sp {
    padding-top: 60px;
  }
  .pt-70-sp {
    padding-top: 70px;
  }
  .pt-80-sp {
    padding-top: 80px;
  }
  .pt-90-sp {
    padding-top: 90px;
  }
  .pt-100-sp {
    padding-top: 100px;
  }
  .pt-110-sp {
    padding-top: 110px;
  }
  .pt-120-sp {
    padding-top: 120px;
  }
  .pt-130-sp {
    padding-top: 130px;
  }
  .pt-140-sp {
    padding-top: 140px;
  }
  .pt-150-sp {
    padding-top: 150px;
  }
  .pt-160-sp {
    padding-top: 160px;
  }
  .pt-170-sp {
    padding-top: 170px;
  }
  .pt-180-sp {
    padding-top: 180px;
  }
  .pt-190-sp {
    padding-top: 190px;
  }
  .pt-200-sp {
    padding-top: 200px;
  }

  .pt-1vw-sp {
    padding-top: 1vw;
  }
  .pt-2vw-sp {
    padding-top: 2vw;
  }
  .pt-3vw-sp {
    padding-top: 3vw;
  }
  .pt-4vw-sp {
    padding-top: 4vw;
  }
  .pt-5vw-sp {
    padding-top: 5vw;
  }
  .pt-6vw-sp {
    padding-top: 6vw;
  }
  .pt-7vw-sp {
    padding-top: 7vw;
  }
  .pt-8vw-sp {
    padding-top: 8vw;
  }
  .pt-9vw-sp {
    padding-top: 9vw;
  }
  .pt-10vw-sp {
    padding-top: 10vw;
  }
  .pt-11vw-sp {
    padding-top: 11vw;
  }
  .pt-12vw-sp {
    padding-top: 12vw;
  }
  .pt-13vw-sp {
    padding-top: 13vw;
  }
  .pt-14vw-sp {
    padding-top: 14vw;
  }
  .pt-15vw-sp {
    padding-top: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .pt-5-tpc {
    padding-top: 5px;
  }
  .pt-8-tpc {
    padding-top: 8px;
  }
  .pt-10-tpc {
    padding-top: 10px;
  }
  .pt-15-tpc {
    padding-top: 15px;
  }
  .pt-20-tpc {
    padding-top: 20px;
  }
  .pt-25-tpc {
    padding-top: 25px;
  }
  .pt-30-tpc {
    padding-top: 30px;
  }
  .pt-35-tpc {
    padding-top: 35px;
  }
  .pt-40-tpc {
    padding-top: 40px;
  }
  .pt-45-tpc {
    padding-top: 45px;
  }
  .pt-50-tpc {
    padding-top: 50px;
  }
  .pt-60-tpc {
    padding-top: 60px;
  }
  .pt-70-tpc {
    padding-top: 70px;
  }
  .pt-80-tpc {
    padding-top: 80px;
  }
  .pt-90-tpc {
    padding-top: 90px;
  }
  .pt-100-tpc {
    padding-top: 100px;
  }
  .pt-110-tpc {
    padding-top: 110px;
  }
  .pt-120-tpc {
    padding-top: 120px;
  }
  .pt-130-tpc {
    padding-top: 130px;
  }
  .pt-140-tpc {
    padding-top: 140px;
  }
  .pt-150-tpc {
    padding-top: 150px;
  }
  .pt-160-tpc {
    padding-top: 160px;
  }
  .pt-170-tpc {
    padding-top: 170px;
  }
  .pt-180-tpc {
    padding-top: 180px;
  }
  .pt-190-tpc {
    padding-top: 190px;
  }
  .pt-200-tpc {
    padding-top: 200px;
  }

  .pt-1vw-tpc {
    padding-top: 1vw;
  }
  .pt-2vw-tpc {
    padding-top: 2vw;
  }
  .pt-3vw-tpc {
    padding-top: 3vw;
  }
  .pt-4vw-tpc {
    padding-top: 4vw;
  }
  .pt-5vw-tpc {
    padding-top: 5vw;
  }
  .pt-6vw-tpc {
    padding-top: 6vw;
  }
  .pt-7vw-tpc {
    padding-top: 7vw;
  }
  .pt-8vw-tpc {
    padding-top: 8vw;
  }
  .pt-9vw-tpc {
    padding-top: 9vw;
  }
  .pt-10vw-tpc {
    padding-top: 10vw;
  }
  .pt-11vw-tpc {
    padding-top: 11vw;
  }
  .pt-12vw-tpc {
    padding-top: 12vw;
  }
  .pt-13vw-tpc {
    padding-top: 13vw;
  }
  .pt-14vw-tpc {
    padding-top: 14vw;
  }
  .pt-15vw-tpc {
    padding-top: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .pt-5-pc {
    padding-top: 5px;
  }
  .pt-8-pc {
    padding-top: 8px;
  }
  .pt-10-pc {
    padding-top: 10px;
  }
  .pt-15-pc {
    padding-top: 15px;
  }
  .pt-20-pc {
    padding-top: 20px;
  }
  .pt-25-pc {
    padding-top: 25px;
  }
  .pt-30-pc {
    padding-top: 30px;
  }
  .pt-35-pc {
    padding-top: 35px;
  }
  .pt-40-pc {
    padding-top: 40px;
  }
  .pt-45-pc {
    padding-top: 45px;
  }
  .pt-50-pc {
    padding-top: 50px;
  }
  .pt-60-pc {
    padding-top: 60px;
  }
  .pt-70-pc {
    padding-top: 70px;
  }
  .pt-80-pc {
    padding-top: 80px;
  }
  .pt-90-pc {
    padding-top: 90px;
  }
  .pt-100-pc {
    padding-top: 100px;
  }
  .pt-110-pc {
    padding-top: 110px;
  }
  .pt-120-pc {
    padding-top: 120px;
  }
  .pt-130-pc {
    padding-top: 130px;
  }
  .pt-140-pc {
    padding-top: 140px;
  }
  .pt-150-pc {
    padding-top: 150px;
  }
  .pt-160-pc {
    padding-top: 160px;
  }
  .pt-170-pc {
    padding-top: 170px;
  }
  .pt-180-pc {
    padding-top: 180px;
  }
  .pt-190-pc {
    padding-top: 190px;
  }
  .pt-200-pc {
    padding-top: 200px;
  }

  .pt-1vw-pc {
    padding-top: 1vw;
  }
  .pt-2vw-pc {
    padding-top: 2vw;
  }
  .pt-3vw-pc {
    padding-top: 3vw;
  }
  .pt-4vw-pc {
    padding-top: 4vw;
  }
  .pt-5vw-pc {
    padding-top: 5vw;
  }
  .pt-6vw-pc {
    padding-top: 6vw;
  }
  .pt-7vw-pc {
    padding-top: 7vw;
  }
  .pt-8vw-pc {
    padding-top: 8vw;
  }
  .pt-9vw-pc {
    padding-top: 9vw;
  }
  .pt-10vw-pc {
    padding-top: 10vw;
  }
  .pt-11vw-pc {
    padding-top: 11vw;
  }
  .pt-12vw-pc {
    padding-top: 12vw;
  }
  .pt-13vw-pc {
    padding-top: 13vw;
  }
  .pt-14vw-pc {
    padding-top: 14vw;
  }
  .pt-15vw-pc {
    padding-top: 15vw;
  }
}
/*padding right*/
.pr-5 {
  padding-right: calc(5px * var(--space-ratio));
}
.pr-8 {
  padding-right: calc(8px * var(--space-ratio));
}
.pr-10 {
  padding-right: calc(10px * var(--space-ratio));
}
.pr-15 {
  padding-right: calc(15px * var(--space-ratio));
}
.pr-20 {
  padding-right: calc(20px * var(--space-ratio));
}
.pr-25 {
  padding-right: calc(25px * var(--space-ratio));
}
.pr-30 {
  padding-right: calc(30px * var(--space-ratio));
}
.pr-35 {
  padding-right: calc(35px * var(--space-ratio));
}
.pr-40 {
  padding-right: calc(45px * var(--space-ratio));
}
.pr-45 {
  padding-right: calc(40px * var(--space-ratio));
}
.pr-50 {
  padding-right: calc(50px * var(--space-ratio));
}
.pr-60 {
  padding-right: calc(60px * var(--space-ratio));
}
.pr-70 {
  padding-right: calc(70px * var(--space-ratio));
}
.pr-80 {
  padding-right: calc(80px * var(--space-ratio));
}
.pr-90 {
  padding-right: calc(90px * var(--space-ratio));
}
.pr-100 {
  padding-right: calc(100px * var(--space-ratio));
}
.pr-110 {
  padding-right: calc(110px * var(--space-ratio));
}
.pr-120 {
  padding-right: calc(120px * var(--space-ratio));
}
.pr-130 {
  padding-right: calc(130px * var(--space-ratio));
}
.pr-140 {
  padding-right: calc(140px * var(--space-ratio));
}
.pr-150 {
  padding-right: calc(150px * var(--space-ratio));
}
.pr-160 {
  padding-right: calc(160px * var(--space-ratio));
}
.pr-170 {
  padding-right: calc(170px * var(--space-ratio));
}
.pr-180 {
  padding-right: calc(180px * var(--space-ratio));
}
.pr-190 {
  padding-right: calc(190px * var(--space-ratio));
}
.pr-200 {
  padding-right: calc(200px * var(--space-ratio));
}

.pr-1vw {
  padding-right: 1vw;
}
.pr-2vw {
  padding-right: 2vw;
}
.pr-3vw {
  padding-right: 3vw;
}
.pr-4vw {
  padding-right: 4vw;
}
.pr-5vw {
  padding-right: 5vw;
}
.pr-6vw {
  padding-right: 6vw;
}
.pr-7vw {
  padding-right: 7vw;
}
.pr-8vw {
  padding-right: 8vw;
}
.pr-9vw {
  padding-right: 9vw;
}
.pr-10vw {
  padding-right: 10vw;
}
.pr-11vw {
  padding-right: 11vw;
}
.pr-12vw {
  padding-right: 12vw;
}
.pr-13vw {
  padding-right: 13vw;
}
.pr-14vw {
  padding-right: 14vw;
}
.pr-15vw {
  padding-right: 15vw;
}

.pr-s {
  padding-right: var(--space-s);
}
.pr-m {
  padding-right: var(--space-m);
}
.pr-l {
  padding-right: var(--space-l);
}

@media screen and (max-width: 1023px) {
  .pr-5-sp {
    padding-right: 5px;
  }
  .pr-8-sp {
    padding-right: 8px;
  }
  .pr-10-sp {
    padding-right: 10px;
  }
  .pr-15-sp {
    padding-right: 15px;
  }
  .pr-20-sp {
    padding-right: 20px;
  }
  .pr-25-sp {
    padding-right: 25px;
  }
  .pr-30-sp {
    padding-right: 30px;
  }
  .pr-35-sp {
    padding-right: 35px;
  }
  .pr-40-sp {
    padding-right: 40px;
  }
  .pr-45-sp {
    padding-right: 45px;
  }
  .pr-50-sp {
    padding-right: 50px;
  }
  .pr-60-sp {
    padding-right: 60px;
  }
  .pr-70-sp {
    padding-right: 70px;
  }
  .pr-80-sp {
    padding-right: 80px;
  }
  .pr-90-sp {
    padding-right: 90px;
  }
  .pr-100-sp {
    padding-right: 100px;
  }
  .pr-110-sp {
    padding-right: 110px;
  }
  .pr-120-sp {
    padding-right: 120px;
  }
  .pr-130-sp {
    padding-right: 130px;
  }
  .pr-140-sp {
    padding-right: 140px;
  }
  .pr-150-sp {
    padding-right: 150px;
  }
  .pr-160-sp {
    padding-right: 160px;
  }
  .pr-170-sp {
    padding-right: 170px;
  }
  .pr-180-sp {
    padding-right: 180px;
  }
  .pr-190-sp {
    padding-right: 190px;
  }
  .pr-200-sp {
    padding-right: 200px;
  }

  .pr-1vw-sp {
    padding-right: 1vw;
  }
  .pr-2vw-sp {
    padding-right: 2vw;
  }
  .pr-3vw-sp {
    padding-right: 3vw;
  }
  .pr-4vw-sp {
    padding-right: 4vw;
  }
  .pr-5vw-sp {
    padding-right: 5vw;
  }
  .pr-6vw-sp {
    padding-right: 6vw;
  }
  .pr-7vw-sp {
    padding-right: 7vw;
  }
  .pr-8vw-sp {
    padding-right: 8vw;
  }
  .pr-9vw-sp {
    padding-right: 9vw;
  }
  .pr-10vw-sp {
    padding-right: 10vw;
  }
  .pr-11vw-sp {
    padding-right: 11vw;
  }
  .pr-12vw-sp {
    padding-right: 12vw;
  }
  .pr-13vw-sp {
    padding-right: 13vw;
  }
  .pr-14vw-sp {
    padding-right: 14vw;
  }
  .pr-15vw-sp {
    padding-right: 15vw;
  }

  .pr-s-sp {
    padding-right: var(--space-s);
  }
  .pr-m-sp {
    padding-right: var(--space-m);
  }
  .pr-l-sp {
    padding-right: var(--space-l);
  }
}
@media screen and (min-width: 768px) {
  .pr-5-tpc {
    padding-right: 5px;
  }
  .pr-8-tpc {
    padding-right: 8px;
  }
  .pr-10-tpc {
    padding-right: 10px;
  }
  .pr-15-tpc {
    padding-right: 15px;
  }
  .pr-20-tpc {
    padding-right: 20px;
  }
  .pr-25-tpc {
    padding-right: 25px;
  }
  .pr-30-tpc {
    padding-right: 30px;
  }
  .pr-35-tpc {
    padding-right: 35px;
  }
  .pr-40-tpc {
    padding-right: 40px;
  }
  .pr-45-tpc {
    padding-right: 45px;
  }
  .pr-50-tpc {
    padding-right: 50px;
  }
  .pr-60-tpc {
    padding-right: 60px;
  }
  .pr-70-tpc {
    padding-right: 70px;
  }
  .pr-80-tpc {
    padding-right: 80px;
  }
  .pr-90-tpc {
    padding-right: 90px;
  }
  .pr-100-tpc {
    padding-right: 100px;
  }
  .pr-110-tpc {
    padding-right: 110px;
  }
  .pr-120-tpc {
    padding-right: 120px;
  }
  .pr-130-tpc {
    padding-right: 130px;
  }
  .pr-140-tpc {
    padding-right: 140px;
  }
  .pr-150-tpc {
    padding-right: 150px;
  }
  .pr-160-tpc {
    padding-right: 160px;
  }
  .pr-170-tpc {
    padding-right: 170px;
  }
  .pr-180-tpc {
    padding-right: 180px;
  }
  .pr-190-tpc {
    padding-right: 190px;
  }
  .pr-200-tpc {
    padding-right: 200px;
  }

  .pr-1vw-tpc {
    padding-right: 1vw;
  }
  .pr-2vw-tpc {
    padding-right: 2vw;
  }
  .pr-3vw-tpc {
    padding-right: 3vw;
  }
  .pr-4vw-tpc {
    padding-right: 4vw;
  }
  .pr-5vw-tpc {
    padding-right: 5vw;
  }
  .pr-6vw-tpc {
    padding-right: 6vw;
  }
  .pr-7vw-tpc {
    padding-right: 7vw;
  }
  .pr-8vw-tpc {
    padding-right: 8vw;
  }
  .pr-9vw-tpc {
    padding-right: 9vw;
  }
  .pr-10vw-tpc {
    padding-right: 10vw;
  }
  .pr-11vw-tpc {
    padding-right: 11vw;
  }
  .pr-12vw-tpc {
    padding-right: 12vw;
  }
  .pr-13vw-tpc {
    padding-right: 13vw;
  }
  .pr-14vw-tpc {
    padding-right: 14vw;
  }
  .pr-15vw-tpc {
    padding-right: 15vw;
  }

  .pr-s-tpc {
    padding-right: var(--space-s);
  }
  .pr-m-tpc {
    padding-right: var(--space-m);
  }
  .pr-l-tpc {
    padding-right: var(--space-l);
  }
}
@media screen and (min-width: 1024px) {
  .pr-5-pc {
    padding-right: 5px;
  }
  .pr-8-pc {
    padding-right: 8px;
  }
  .pr-10-pc {
    padding-right: 10px;
  }
  .pr-15-pc {
    padding-right: 15px;
  }
  .pr-20-pc {
    padding-right: 20px;
  }
  .pr-25-pc {
    padding-right: 25px;
  }
  .pr-30-pc {
    padding-right: 30px;
  }
  .pr-35-pc {
    padding-right: 35px;
  }
  .pr-40-pc {
    padding-right: 40px;
  }
  .pr-45-pc {
    padding-right: 45px;
  }
  .pr-50-pc {
    padding-right: 50px;
  }
  .pr-60-pc {
    padding-right: 60px;
  }
  .pr-70-pc {
    padding-right: 70px;
  }
  .pr-80-pc {
    padding-right: 80px;
  }
  .pr-90-pc {
    padding-right: 90px;
  }
  .pr-100-pc {
    padding-right: 100px;
  }
  .pr-110-pc {
    padding-right: 110px;
  }
  .pr-120-pc {
    padding-right: 120px;
  }
  .pr-130-pc {
    padding-right: 130px;
  }
  .pr-140-pc {
    padding-right: 140px;
  }
  .pr-150-pc {
    padding-right: 150px;
  }
  .pr-160-pc {
    padding-right: 160px;
  }
  .pr-170-pc {
    padding-right: 170px;
  }
  .pr-180-pc {
    padding-right: 180px;
  }
  .pr-190-pc {
    padding-right: 190px;
  }
  .pr-200-pc {
    padding-right: 200px;
  }

  .pr-1vw-pc {
    padding-right: 1vw;
  }
  .pr-2vw-pc {
    padding-right: 2vw;
  }
  .pr-3vw-pc {
    padding-right: 3vw;
  }
  .pr-4vw-pc {
    padding-right: 4vw;
  }
  .pr-5vw-pc {
    padding-right: 5vw;
  }
  .pr-6vw-pc {
    padding-right: 6vw;
  }
  .pr-7vw-pc {
    padding-right: 7vw;
  }
  .pr-8vw-pc {
    padding-right: 8vw;
  }
  .pr-9vw-pc {
    padding-right: 9vw;
  }
  .pr-10vw-pc {
    padding-right: 10vw;
  }
  .pr-11vw-pc {
    padding-right: 11vw;
  }
  .pr-12vw-pc {
    padding-right: 12vw;
  }
  .pr-13vw-pc {
    padding-right: 13vw;
  }
  .pr-14vw-pc {
    padding-right: 14vw;
  }
  .pr-15vw-pc {
    padding-right: 15vw;
  }

  .pr-s-pc {
    padding-right: var(--space-s);
  }
  .pr-m-pc {
    padding-right: var(--space-m);
  }
  .pr-l-pc {
    padding-right: var(--space-l);
  }
}
/*padding bottom*/
.pb-5 {
  padding-bottom: calc(5px * var(--space-ratio));
}
.pb-8 {
  padding-bottom: calc(8px * var(--space-ratio));
}
.pb-10 {
  padding-bottom: calc(10px * var(--space-ratio));
}
.pb-15 {
  padding-bottom: calc(15px * var(--space-ratio));
}
.pb-20 {
  padding-bottom: calc(20px * var(--space-ratio));
}
.pb-25 {
  padding-bottom: calc(25px * var(--space-ratio));
}
.pb-30 {
  padding-bottom: calc(30px * var(--space-ratio));
}
.pb-35 {
  padding-bottom: calc(35px * var(--space-ratio));
}
.pb-40 {
  padding-bottom: calc(40px * var(--space-ratio));
}
.pb-45 {
  padding-bottom: calc(45px * var(--space-ratio));
}
.pb-50 {
  padding-bottom: calc(50px * var(--space-ratio));
}
.pb-60 {
  padding-bottom: calc(60px * var(--space-ratio));
}
.pb-70 {
  padding-bottom: calc(70px * var(--space-ratio));
}
.pb-80 {
  padding-bottom: calc(80px * var(--space-ratio));
}
.pb-90 {
  padding-bottom: calc(90px * var(--space-ratio));
}
.pb-100 {
  padding-bottom: calc(100px * var(--space-ratio));
}
.pb-110 {
  padding-bottom: calc(110px * var(--space-ratio));
}
.pb-120 {
  padding-bottom: calc(120px * var(--space-ratio));
}
.pb-130 {
  padding-bottom: calc(130px * var(--space-ratio));
}
.pb-140 {
  padding-bottom: calc(140px * var(--space-ratio));
}
.pb-150 {
  padding-bottom: calc(150px * var(--space-ratio));
}
.pb-160 {
  padding-bottom: calc(160px * var(--space-ratio));
}
.pb-170 {
  padding-bottom: calc(170px * var(--space-ratio));
}
.pb-180 {
  padding-bottom: calc(180px * var(--space-ratio));
}
.pb-190 {
  padding-bottom: calc(190px * var(--space-ratio));
}
.pb-200 {
  padding-bottom: calc(200px * var(--space-ratio));
}

.pb-1vw {
  padding-bottom: 1vw;
}
.pb-2vw {
  padding-bottom: 2vw;
}
.pb-3vw {
  padding-bottom: 3vw;
}
.pb-4vw {
  padding-bottom: 4vw;
}
.pb-5vw {
  padding-bottom: 5vw;
}
.pb-6vw {
  padding-bottom: 6vw;
}
.pb-7vw {
  padding-bottom: 7vw;
}
.pb-8vw {
  padding-bottom: 8vw;
}
.pb-9vw {
  padding-bottom: 9vw;
}
.pb-10vw {
  padding-bottom: 10vw;
}
.pb-11vw {
  padding-bottom: 11vw;
}
.pb-12vw {
  padding-bottom: 12vw;
}
.pb-13vw {
  padding-bottom: 13vw;
}
.pb-14vw {
  padding-bottom: 14vw;
}
.pb-15vw {
  padding-bottom: 15vw;
}

@media screen and (max-width: 1023px) {
  .pb-5-sp {
    padding-bottom: 5px;
  }
  .pb-8-sp {
    padding-bottom: 8px;
  }
  .pb-10-sp {
    padding-bottom: 10px;
  }
  .pb-15-sp {
    padding-bottom: 15px;
  }
  .pb-20-sp {
    padding-bottom: 20px;
  }
  .pb-25-sp {
    padding-bottom: 25px;
  }
  .pb-30-sp {
    padding-bottom: 30px;
  }
  .pb-35-sp {
    padding-bottom: 35px;
  }
  .pb-40-sp {
    padding-bottom: 40px;
  }
  .pb-45-sp {
    padding-bottom: 45px;
  }
  .pb-50-sp {
    padding-bottom: 50px;
  }
  .pb-60-sp {
    padding-bottom: 60px;
  }
  .pb-70-sp {
    padding-bottom: 70px;
  }
  .pb-80-sp {
    padding-bottom: 80px;
  }
  .pb-90-sp {
    padding-bottom: 90px;
  }
  .pb-100-sp {
    padding-bottom: 100px;
  }
  .pb-110-sp {
    padding-bottom: 110px;
  }
  .pb-120-sp {
    padding-bottom: 120px;
  }
  .pb-130-sp {
    padding-bottom: 130px;
  }
  .pb-140-sp {
    padding-bottom: 140px;
  }
  .pb-150-sp {
    padding-bottom: 150px;
  }
  .pb-160-sp {
    padding-bottom: 160px;
  }
  .pb-170-sp {
    padding-bottom: 170px;
  }
  .pb-180-sp {
    padding-bottom: 180px;
  }
  .pb-190-sp {
    padding-bottom: 190px;
  }
  .pb-200-sp {
    padding-bottom: 200px;
  }

  .pb-1vw-sp {
    padding-bottom: 1vw;
  }
  .pb-2vw-sp {
    padding-bottom: 2vw;
  }
  .pb-3vw-sp {
    padding-bottom: 3vw;
  }
  .pb-4vw-sp {
    padding-bottom: 4vw;
  }
  .pb-5vw-sp {
    padding-bottom: 5vw;
  }
  .pb-6vw-sp {
    padding-bottom: 6vw;
  }
  .pb-7vw-sp {
    padding-bottom: 7vw;
  }
  .pb-8vw-sp {
    padding-bottom: 8vw;
  }
  .pb-9vw-sp {
    padding-bottom: 9vw;
  }
  .pb-10vw-sp {
    padding-bottom: 10vw;
  }
  .pb-11vw-sp {
    padding-bottom: 11vw;
  }
  .pb-12vw-sp {
    padding-bottom: 12vw;
  }
  .pb-13vw-sp {
    padding-bottom: 13vw;
  }
  .pb-14vw-sp {
    padding-bottom: 14vw;
  }
  .pb-15vw-sp {
    padding-bottom: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .pb-5-tpc {
    padding-bottom: 5px;
  }
  .pb-8-tpc {
    padding-bottom: 8px;
  }
  .pb-10-tpc {
    padding-bottom: 10px;
  }
  .pb-15-tpc {
    padding-bottom: 15px;
  }
  .pb-20-tpc {
    padding-bottom: 20px;
  }
  .pb-25-tpc {
    padding-bottom: 25px;
  }
  .pb-30-tpc {
    padding-bottom: 30px;
  }
  .pb-35-tpc {
    padding-bottom: 35px;
  }
  .pb-40-tpc {
    padding-bottom: 40px;
  }
  .pb-45-tpc {
    padding-bottom: 45px;
  }
  .pb-50-tpc {
    padding-bottom: 50px;
  }
  .pb-60-tpc {
    padding-bottom: 60px;
  }
  .pb-70-tpc {
    padding-bottom: 70px;
  }
  .pb-80-tpc {
    padding-bottom: 80px;
  }
  .pb-90-tpc {
    padding-bottom: 90px;
  }
  .pb-100-tpc {
    padding-bottom: 100px;
  }
  .pb-110-tpc {
    padding-bottom: 110px;
  }
  .pb-120-tpc {
    padding-bottom: 120px;
  }
  .pb-130-tpc {
    padding-bottom: 130px;
  }
  .pb-140-tpc {
    padding-bottom: 140px;
  }
  .pb-150-tpc {
    padding-bottom: 150px;
  }
  .pb-160-tpc {
    padding-bottom: 160px;
  }
  .pb-170-tpc {
    padding-bottom: 170px;
  }
  .pb-180-tpc {
    padding-bottom: 180px;
  }
  .pb-190-tpc {
    padding-bottom: 190px;
  }
  .pb-200-tpc {
    padding-bottom: 200px;
  }

  .pb-1vw-tpc {
    padding-bottom: 1vw;
  }
  .pb-2vw-tpc {
    padding-bottom: 2vw;
  }
  .pb-3vw-tpc {
    padding-bottom: 3vw;
  }
  .pb-4vw-tpc {
    padding-bottom: 4vw;
  }
  .pb-5vw-tpc {
    padding-bottom: 5vw;
  }
  .pb-6vw-tpc {
    padding-bottom: 6vw;
  }
  .pb-7vw-tpc {
    padding-bottom: 7vw;
  }
  .pb-8vw-tpc {
    padding-bottom: 8vw;
  }
  .pb-9vw-tpc {
    padding-bottom: 9vw;
  }
  .pb-10vw-tpc {
    padding-bottom: 10vw;
  }
  .pb-11vw-tpc {
    padding-bottom: 11vw;
  }
  .pb-12vw-tpc {
    padding-bottom: 12vw;
  }
  .pb-13vw-tpc {
    padding-bottom: 13vw;
  }
  .pb-14vw-tpc {
    padding-bottom: 14vw;
  }
  .pb-15vw-tpc {
    padding-bottom: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .pb-5-pc {
    padding-bottom: 5px;
  }
  .pb-8-pc {
    padding-bottom: 8px;
  }
  .pb-10-pc {
    padding-bottom: 10px;
  }
  .pb-15-pc {
    padding-bottom: 15px;
  }
  .pb-20-pc {
    padding-bottom: 20px;
  }
  .pb-25-pc {
    padding-bottom: 25px;
  }
  .pb-30-pc {
    padding-bottom: 30px;
  }
  .pb-35-pc {
    padding-bottom: 35px;
  }
  .pb-40-pc {
    padding-bottom: 40px;
  }
  .pb-45-pc {
    padding-bottom: 45px;
  }
  .pb-50-pc {
    padding-bottom: 50px;
  }
  .pb-60-pc {
    padding-bottom: 60px;
  }
  .pb-70-pc {
    padding-bottom: 70px;
  }
  .pb-80-pc {
    padding-bottom: 80px;
  }
  .pb-90-pc {
    padding-bottom: 90px;
  }
  .pb-100-pc {
    padding-bottom: 100px;
  }
  .pb-110-pc {
    padding-bottom: 110px;
  }
  .pb-120-pc {
    padding-bottom: 120px;
  }
  .pb-130-pc {
    padding-bottom: 130px;
  }
  .pb-140-pc {
    padding-bottom: 140px;
  }
  .pb-150-pc {
    padding-bottom: 150px;
  }
  .pb-160-pc {
    padding-bottom: 160px;
  }
  .pb-170-pc {
    padding-bottom: 170px;
  }
  .pb-180-pc {
    padding-bottom: 180px;
  }
  .pb-190-pc {
    padding-bottom: 190px;
  }
  .pb-200-pc {
    padding-bottom: 200px;
  }

  .pb-1vw-pc {
    padding-bottom: 1vw;
  }
  .pb-2vw-pc {
    padding-bottom: 2vw;
  }
  .pb-3vw-pc {
    padding-bottom: 3vw;
  }
  .pb-4vw-pc {
    padding-bottom: 4vw;
  }
  .pb-5vw-pc {
    padding-bottom: 5vw;
  }
  .pb-6vw-pc {
    padding-bottom: 6vw;
  }
  .pb-7vw-pc {
    padding-bottom: 7vw;
  }
  .pb-8vw-pc {
    padding-bottom: 8vw;
  }
  .pb-9vw-pc {
    padding-bottom: 9vw;
  }
  .pb-10vw-pc {
    padding-bottom: 10vw;
  }
  .pb-11vw-pc {
    padding-bottom: 11vw;
  }
  .pb-12vw-pc {
    padding-bottom: 12vw;
  }
  .pb-13vw-pc {
    padding-bottom: 13vw;
  }
  .pb-14vw-pc {
    padding-bottom: 14vw;
  }
  .pb-15vw-pc {
    padding-bottom: 15vw;
  }
}
/*padding left*/
.pl-5 {
  padding-left: calc(5px * var(--space-ratio));
}
.pl-8 {
  padding-left: calc(8px * var(--space-ratio));
}
.pl-10 {
  padding-left: calc(10px * var(--space-ratio));
}
.pl-15 {
  padding-left: calc(15px * var(--space-ratio));
}
.pl-20 {
  padding-left: calc(20px * var(--space-ratio));
}
.pl-25 {
  padding-left: calc(25px * var(--space-ratio));
}
.pl-30 {
  padding-left: calc(30px * var(--space-ratio));
}
.pl-35 {
  padding-left: calc(35px * var(--space-ratio));
}
.pl-40 {
  padding-left: calc(40px * var(--space-ratio));
}
.pl-45 {
  padding-left: calc(45px * var(--space-ratio));
}
.pl-50 {
  padding-left: calc(50px * var(--space-ratio));
}
.pl-60 {
  padding-left: calc(60px * var(--space-ratio));
}
.pl-70 {
  padding-left: calc(70px * var(--space-ratio));
}
.pl-80 {
  padding-left: calc(80px * var(--space-ratio));
}
.pl-90 {
  padding-left: calc(90px * var(--space-ratio));
}
.pl-100 {
  padding-left: calc(100px * var(--space-ratio));
}
.pl-110 {
  padding-left: calc(110px * var(--space-ratio));
}
.pl-120 {
  padding-left: calc(120px * var(--space-ratio));
}
.pl-130 {
  padding-left: calc(130px * var(--space-ratio));
}
.pl-140 {
  padding-left: calc(140px * var(--space-ratio));
}
.pl-150 {
  padding-left: calc(150px * var(--space-ratio));
}
.pl-160 {
  padding-left: calc(160px * var(--space-ratio));
}
.pl-170 {
  padding-left: calc(170px * var(--space-ratio));
}
.pl-180 {
  padding-left: calc(180px * var(--space-ratio));
}
.pl-190 {
  padding-left: calc(190px * var(--space-ratio));
}
.pl-200 {
  padding-left: calc(200px * var(--space-ratio));
}

.pl-1vw {
  padding-left: 1vw;
}
.pl-2vw {
  padding-left: 2vw;
}
.pl-3vw {
  padding-left: 3vw;
}
.pl-4vw {
  padding-left: 4vw;
}
.pl-5vw {
  padding-left: 5vw;
}
.pl-6vw {
  padding-left: 6vw;
}
.pl-7vw {
  padding-left: 7vw;
}
.pl-8vw {
  padding-left: 8vw;
}
.pl-9vw {
  padding-left: 9vw;
}
.pl-10vw {
  padding-left: 10vw;
}
.pl-11vw {
  padding-left: 11vw;
}
.pl-12vw {
  padding-left: 12vw;
}
.pl-13vw {
  padding-left: 13vw;
}
.pl-14vw {
  padding-left: 14vw;
}
.pl-15vw {
  padding-left: 15vw;
}

.pl-s {
  padding-left: var(--space-s);
}
.pl-m {
  padding-left: var(--space-m);
}
.pl-l {
  padding-left: var(--space-l);
}

@media screen and (max-width: 1023px) {
  .pl-5-sp {
    padding-left: 5px;
  }
  .pl-8-sp {
    padding-left: 8px;
  }
  .pl-10-sp {
    padding-left: 10px;
  }
  .pl-15-sp {
    padding-left: 15px;
  }
  .pl-20-sp {
    padding-left: 20px;
  }
  .pl-25-sp {
    padding-left: 25px;
  }
  .pl-30-sp {
    padding-left: 30px;
  }
  .pl-35-sp {
    padding-left: 35px;
  }
  .pl-40-sp {
    padding-left: 40px;
  }
  .pl-45-sp {
    padding-left: 45px;
  }
  .pl-50-sp {
    padding-left: 50px;
  }
  .pl-60-sp {
    padding-left: 60px;
  }
  .pl-70-sp {
    padding-left: 70px;
  }
  .pl-80-sp {
    padding-left: 80px;
  }
  .pl-90-sp {
    padding-left: 90px;
  }
  .pl-100-sp {
    padding-left: 100px;
  }
  .pl-110-sp {
    padding-left: 110px;
  }
  .pl-120-sp {
    padding-left: 120px;
  }
  .pl-130-sp {
    padding-left: 130px;
  }
  .pl-140-sp {
    padding-left: 140px;
  }
  .pl-150-sp {
    padding-left: 150px;
  }
  .pl-160-sp {
    padding-left: 160px;
  }
  .pl-170-sp {
    padding-left: 170px;
  }
  .pl-180-sp {
    padding-left: 180px;
  }
  .pl-190-sp {
    padding-left: 190px;
  }
  .pl-200-sp {
    padding-left: 200px;
  }

  .pl-1vw-sp {
    padding-left: 1vw;
  }
  .pl-2vw-sp {
    padding-left: 2vw;
  }
  .pl-3vw-sp {
    padding-left: 3vw;
  }
  .pl-4vw-sp {
    padding-left: 4vw;
  }
  .pl-5vw-sp {
    padding-left: 5vw;
  }
  .pl-6vw-sp {
    padding-left: 6vw;
  }
  .pl-7vw-sp {
    padding-left: 7vw;
  }
  .pl-8vw-sp {
    padding-left: 8vw;
  }
  .pl-9vw-sp {
    padding-left: 9vw;
  }
  .pl-10vw-sp {
    padding-left: 10vw;
  }
  .pl-11vw-sp {
    padding-left: 11vw;
  }
  .pl-12vw-sp {
    padding-left: 12vw;
  }
  .pl-13vw-sp {
    padding-left: 13vw;
  }
  .pl-14vw-sp {
    padding-left: 14vw;
  }
  .pl-15vw-sp {
    padding-left: 15vw;
  }

  .pl-s-sp {
    padding-left: var(--space-s);
  }
  .pl-m-sp {
    padding-left: var(--space-m);
  }
  .pl-l-sp {
    padding-left: var(--space-l);
  }
}
@media screen and (min-width: 768px) {
  .pl-5-tpc {
    padding-left: 5px;
  }
  .pl-8-tpc {
    padding-left: 8px;
  }
  .pl-10-tpc {
    padding-left: 10px;
  }
  .pl-15-tpc {
    padding-left: 15px;
  }
  .pl-20-tpc {
    padding-left: 20px;
  }
  .pl-25-tpc {
    padding-left: 25px;
  }
  .pl-30-tpc {
    padding-left: 30px;
  }
  .pl-35-tpc {
    padding-left: 35px;
  }
  .pl-40-tpc {
    padding-left: 40px;
  }
  .pl-45-tpc {
    padding-left: 45px;
  }
  .pl-50-tpc {
    padding-left: 50px;
  }
  .pl-60-tpc {
    padding-left: 60px;
  }
  .pl-70-tpc {
    padding-left: 70px;
  }
  .pl-80-tpc {
    padding-left: 80px;
  }
  .pl-90-tpc {
    padding-left: 90px;
  }
  .pl-100-tpc {
    padding-left: 100px;
  }
  .pl-110-tpc {
    padding-left: 110px;
  }
  .pl-120-tpc {
    padding-left: 120px;
  }
  .pl-130-tpc {
    padding-left: 130px;
  }
  .pl-140-tpc {
    padding-left: 140px;
  }
  .pl-150-tpc {
    padding-left: 150px;
  }
  .pl-160-tpc {
    padding-left: 160px;
  }
  .pl-170-tpc {
    padding-left: 170px;
  }
  .pl-180-tpc {
    padding-left: 180px;
  }
  .pl-190-tpc {
    padding-left: 190px;
  }
  .pl-200-tpc {
    padding-left: 200px;
  }

  .pl-1vw-tpc {
    padding-left: 1vw;
  }
  .pl-2vw-tpc {
    padding-left: 2vw;
  }
  .pl-3vw-tpc {
    padding-left: 3vw;
  }
  .pl-4vw-tpc {
    padding-left: 4vw;
  }
  .pl-5vw-tpc {
    padding-left: 5vw;
  }
  .pl-6vw-tpc {
    padding-left: 6vw;
  }
  .pl-7vw-tpc {
    padding-left: 7vw;
  }
  .pl-8vw-tpc {
    padding-left: 8vw;
  }
  .pl-9vw-tpc {
    padding-left: 9vw;
  }
  .pl-10vw-tpc {
    padding-left: 10vw;
  }
  .pl-11vw-tpc {
    padding-left: 11vw;
  }
  .pl-12vw-tpc {
    padding-left: 12vw;
  }
  .pl-13vw-tpc {
    padding-left: 13vw;
  }
  .pl-14vw-tpc {
    padding-left: 14vw;
  }
  .pl-15vw-tpc {
    padding-left: 15vw;
  }

  .pl-s-tpc {
    padding-left: var(--space-s);
  }
  .pl-m-tpc {
    padding-left: var(--space-m);
  }
  .pl-l-tpc {
    padding-left: var(--space-l);
  }
}
@media screen and (min-width: 1024px) {
  .pl-5-pc {
    padding-left: 5px;
  }
  .pl-8-pc {
    padding-left: 8px;
  }
  .pl-10-pc {
    padding-left: 10px;
  }
  .pl-15-pc {
    padding-left: 15px;
  }
  .pl-20-pc {
    padding-left: 20px;
  }
  .pl-25-pc {
    padding-left: 25px;
  }
  .pl-30-pc {
    padding-left: 30px;
  }
  .pl-35-pc {
    padding-left: 35px;
  }
  .pl-40-pc {
    padding-left: 40px;
  }
  .pl-45-pc {
    padding-left: 45px;
  }
  .pl-50-pc {
    padding-left: 50px;
  }
  .pl-60-pc {
    padding-left: 60px;
  }
  .pl-70-pc {
    padding-left: 70px;
  }
  .pl-80-pc {
    padding-left: 80px;
  }
  .pl-90-pc {
    padding-left: 90px;
  }
  .pl-100-pc {
    padding-left: 100px;
  }
  .pl-110-pc {
    padding-left: 110px;
  }
  .pl-120-pc {
    padding-left: 120px;
  }
  .pl-130-pc {
    padding-left: 130px;
  }
  .pl-140-pc {
    padding-left: 140px;
  }
  .pl-150-pc {
    padding-left: 150px;
  }
  .pl-160-pc {
    padding-left: 160px;
  }
  .pl-170-pc {
    padding-left: 170px;
  }
  .pl-180-pc {
    padding-left: 180px;
  }
  .pl-190-pc {
    padding-left: 190px;
  }
  .pl-200-pc {
    padding-left: 200px;
  }

  .pl-1vw-pc {
    padding-left: 1vw;
  }
  .pl-2vw-pc {
    padding-left: 2vw;
  }
  .pl-3vw-pc {
    padding-left: 3vw;
  }
  .pl-4vw-pc {
    padding-left: 4vw;
  }
  .pl-5vw-pc {
    padding-left: 5vw;
  }
  .pl-6vw-pc {
    padding-left: 6vw;
  }
  .pl-7vw-pc {
    padding-left: 7vw;
  }
  .pl-8vw-pc {
    padding-left: 8vw;
  }
  .pl-9vw-pc {
    padding-left: 9vw;
  }
  .pl-10vw-pc {
    padding-left: 10vw;
  }
  .pl-11vw-pc {
    padding-left: 11vw;
  }
  .pl-12vw-pc {
    padding-left: 12vw;
  }
  .pl-13vw-pc {
    padding-left: 13vw;
  }
  .pl-14vw-pc {
    padding-left: 14vw;
  }
  .pl-15vw-pc {
    padding-left: 15vw;
  }

  .pl-s-pc {
    padding-left: var(--space-s);
  }
  .pl-m-pc {
    padding-left: var(--space-m);
  }
  .pl-l-pc {
    padding-left: var(--space-l);
  }
}

/*
   margin
--------------------------------------------------------------*/
.m-5 {
  margin: calc(5px * var(--space-ratio));
}
.m-8 {
  margin: calc(8px * var(--space-ratio));
}
.m-10 {
  margin: calc(10px * var(--space-ratio));
}
.m-15 {
  margin: calc(15px * var(--space-ratio));
}
.m-20 {
  margin: calc(20px * var(--space-ratio));
}
.m-25 {
  margin: calc(25px * var(--space-ratio));
}
.m-30 {
  margin: calc(30px * var(--space-ratio));
}
.m-35 {
  margin: calc(35px * var(--space-ratio));
}
.m-40 {
  margin: calc(40px * var(--space-ratio));
}
.m-45 {
  margin: calc(45px * var(--space-ratio));
}
.m-50 {
  margin: calc(50px * var(--space-ratio));
}
.m-60 {
  margin: calc(60px * var(--space-ratio));
}
.m-70 {
  margin: calc(70px * var(--space-ratio));
}
.m-80 {
  margin: calc(80px * var(--space-ratio));
}
.m-90 {
  margin: calc(90px * var(--space-ratio));
}
.m-100 {
  margin: calc(100px * var(--space-ratio));
}
.m-110 {
  margin: calc(110px * var(--space-ratio));
}
.m-120 {
  margin: calc(120px * var(--space-ratio));
}
.m-130 {
  margin: calc(130px * var(--space-ratio));
}
.m-140 {
  margin: calc(140px * var(--space-ratio));
}
.m-150 {
  margin: calc(150px * var(--space-ratio));
}
.m-160 {
  margin: calc(160px * var(--space-ratio));
}
.m-170 {
  margin: calc(170px * var(--space-ratio));
}
.m-180 {
  margin: calc(180px * var(--space-ratio));
}
.m-190 {
  margin: calc(190px * var(--space-ratio));
}
.m-200 {
  margin: calc(200px * var(--space-ratio));
}

.m-1vw {
  margin: 1vw;
}
.m-2vw {
  margin: 2vw;
}
.m-3vw {
  margin: 3vw;
}
.m-4vw {
  margin: 4vw;
}
.m-5vw {
  margin: 5vw;
}
.m-6vw {
  margin: 6vw;
}
.m-7vw {
  margin: 7vw;
}
.m-8vw {
  margin: 8vw;
}
.m-9vw {
  margin: 9vw;
}
.m-10vw {
  margin: 10vw;
}
.m-11vw {
  margin: 11vw;
}
.m-12vw {
  margin: 12vw;
}
.m-13vw {
  margin: 13vw;
}
.m-14vw {
  margin: 14vw;
}
.m-15vw {
  margin: 15vw;
}

@media screen and (max-width: 1023px) {
  .m-5-sp {
    margin: 5px;
  }
  .m-8-sp {
    margin: 8px;
  }
  .m-10-sp {
    margin: 10px;
  }
  .m-15-sp {
    margin: 15px;
  }
  .m-20-sp {
    margin: 20px;
  }
  .m-25-sp {
    margin: 25px;
  }
  .m-30-sp {
    margin: 35px;
  }
  .m-35-sp {
    margin: 30px;
  }
  .m-40-sp {
    margin: 40px;
  }
  .m-45-sp {
    margin: 45px;
  }
  .m-50-sp {
    margin: 50px;
  }
  .m-60-sp {
    margin: 60px;
  }
  .m-70-sp {
    margin: 70px;
  }
  .m-80-sp {
    margin: 80px;
  }
  .m-90-sp {
    margin: 90px;
  }
  .m-100-sp {
    margin: 100px;
  }
  .m-110-sp {
    margin: 110px;
  }
  .m-120-sp {
    margin: 120px;
  }
  .m-130-sp {
    margin: 130px;
  }
  .m-140-sp {
    margin: 140px;
  }
  .m-150-sp {
    margin: 150px;
  }
  .m-160-sp {
    margin: 160px;
  }
  .m-170-sp {
    margin: 170px;
  }
  .m-180-sp {
    margin: 180px;
  }
  .m-190-sp {
    margin: 190px;
  }
  .m-200-sp {
    margin: 200px;
  }

  .m-1vw-sp {
    margin: 1vw;
  }
  .m-2vw-sp {
    margin: 2vw;
  }
  .m-3vw-sp {
    margin: 3vw;
  }
  .m-4vw-sp {
    margin: 4vw;
  }
  .m-5vw-sp {
    margin: 5vw;
  }
  .m-6vw-sp {
    margin: 6vw;
  }
  .m-7vw-sp {
    margin: 7vw;
  }
  .m-8vw-sp {
    margin: 8vw;
  }
  .m-9vw-sp {
    margin: 9vw;
  }
  .m-10vw-sp {
    margin: 10vw;
  }
  .m-11vw-sp {
    margin: 11vw;
  }
  .m-12vw-sp {
    margin: 12vw;
  }
  .m-13vw-sp {
    margin: 13vw;
  }
  .m-14vw-sp {
    margin: 14vw;
  }
  .m-15vw-sp {
    margin: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .m-5-tpc {
    margin: 5px;
  }
  .m-8-tpc {
    margin: 8px;
  }
  .m-10-tpc {
    margin: 10px;
  }
  .m-15-tpc {
    margin: 15px;
  }
  .m-20-tpc {
    margin: 20px;
  }
  .m-25-tpc {
    margin: 25px;
  }
  .m-30-tpc {
    margin: 30px;
  }
  .m-35-tpc {
    margin: 35px;
  }
  .m-40-tpc {
    margin: 40px;
  }
  .m-45-tpc {
    margin: 45px;
  }
  .m-50-tpc {
    margin: 50px;
  }
  .m-60-tpc {
    margin: 60px;
  }
  .m-70-tpc {
    margin: 70px;
  }
  .m-80-tpc {
    margin: 80px;
  }
  .m-90-tpc {
    margin: 90px;
  }
  .m-100-tpc {
    margin: 100px;
  }
  .m-110-tpc {
    margin: 110px;
  }
  .m-120-tpc {
    margin: 120px;
  }
  .m-130-tpc {
    margin: 130px;
  }
  .m-140-tpc {
    margin: 140px;
  }
  .m-150-tpc {
    margin: 150px;
  }
  .m-160-tpc {
    margin: 160px;
  }
  .m-170-tpc {
    margin: 170px;
  }
  .m-180-tpc {
    margin: 180px;
  }
  .m-190-tpc {
    margin: 190px;
  }
  .m-200-tpc {
    margin: 200px;
  }

  .m-1vw-tpc {
    margin: 1vw;
  }
  .m-2vw-tpc {
    margin: 2vw;
  }
  .m-3vw-tpc {
    margin: 3vw;
  }
  .m-4vw-tpc {
    margin: 4vw;
  }
  .m-5vw-tpc {
    margin: 5vw;
  }
  .m-6vw-tpc {
    margin: 6vw;
  }
  .m-7vw-tpc {
    margin: 7vw;
  }
  .m-8vw-tpc {
    margin: 8vw;
  }
  .m-9vw-tpc {
    margin: 9vw;
  }
  .m-10vw-tpc {
    margin: 10vw;
  }
  .m-11vw-tpc {
    margin: 11vw;
  }
  .m-12vw-tpc {
    margin: 12vw;
  }
  .m-13vw-tpc {
    margin: 13vw;
  }
  .m-14vw-tpc {
    margin: 14vw;
  }
  .m-15vw-tpc {
    margin: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .m-5-pc {
    margin: 5px;
  }
  .m-8-pc {
    margin: 8px;
  }
  .m-10-pc {
    margin: 10px;
  }
  .m-15-pc {
    margin: 15px;
  }
  .m-20-pc {
    margin: 20px;
  }
  .m-25-pc {
    margin: 25px;
  }
  .m-30-pc {
    margin: 30px;
  }
  .m-35-pc {
    margin: 35px;
  }
  .m-40-pc {
    margin: 40px;
  }
  .m-45-pc {
    margin: 45px;
  }
  .m-50-pc {
    margin: 50px;
  }
  .m-60-pc {
    margin: 60px;
  }
  .m-70-pc {
    margin: 70px;
  }
  .m-80-pc {
    margin: 80px;
  }
  .m-90-pc {
    margin: 90px;
  }
  .m-100-pc {
    margin: 100px;
  }
  .m-110-pc {
    margin: 110px;
  }
  .m-120-pc {
    margin: 120px;
  }
  .m-130-pc {
    margin: 130px;
  }
  .m-140-pc {
    margin: 140px;
  }
  .m-150-pc {
    margin: 150px;
  }
  .m-160-pc {
    margin: 160px;
  }
  .m-170-pc {
    margin: 170px;
  }
  .m-180-pc {
    margin: 180px;
  }
  .m-190-pc {
    margin: 190px;
  }
  .m-200-pc {
    margin: 200px;
  }

  .m-1vw-pc {
    margin: 1vw;
  }
  .m-2vw-pc {
    margin: 2vw;
  }
  .m-3vw-pc {
    margin: 3vw;
  }
  .m-4vw-pc {
    margin: 4vw;
  }
  .m-5vw-pc {
    margin: 5vw;
  }
  .m-6vw-pc {
    margin: 6vw;
  }
  .m-7vw-pc {
    margin: 7vw;
  }
  .m-8vw-pc {
    margin: 8vw;
  }
  .m-9vw-pc {
    margin: 9vw;
  }
  .m-10vw-pc {
    margin: 10vw;
  }
  .m-11vw-pc {
    margin: 11vw;
  }
  .m-12vw-pc {
    margin: 12vw;
  }
  .m-13vw-pc {
    margin: 13vw;
  }
  .m-14vw-pc {
    margin: 14vw;
  }
  .m-15vw-pc {
    margin: 15vw;
  }
}

/*margin top bottom*/
.mtb-5 {
  margin-top: calc(5px * var(--space-ratio));
  margin-bottom: calc(5px * var(--space-ratio));
}
.mtb-8 {
  margin-top: calc(8px * var(--space-ratio));
  margin-bottom: calc(8px * var(--space-ratio));
}
.mtb-10 {
  margin-top: calc(10px * var(--space-ratio));
  margin-bottom: calc(10px * var(--space-ratio));
}
.mtb-15 {
  margin-top: calc(15px * var(--space-ratio));
  margin-bottom: calc(15px * var(--space-ratio));
}
.mtb-20 {
  margin-top: calc(20px * var(--space-ratio));
  margin-bottom: calc(20px * var(--space-ratio));
}
.mtb-25 {
  margin-top: calc(25px * var(--space-ratio));
  margin-bottom: calc(25px * var(--space-ratio));
}
.mtb-30 {
  margin-top: calc(30px * var(--space-ratio));
  margin-bottom: calc(30px * var(--space-ratio));
}
.mtb-35 {
  margin-top: calc(35px * var(--space-ratio));
  margin-bottom: calc(35px * var(--space-ratio));
}
.mtb-40 {
  margin-top: calc(40px * var(--space-ratio));
  margin-bottom: calc(40px * var(--space-ratio));
}
.mtb-45 {
  margin-top: calc(45px * var(--space-ratio));
  margin-bottom: calc(45px * var(--space-ratio));
}
.mtb-50 {
  margin-top: calc(50px * var(--space-ratio));
  margin-bottom: calc(50px * var(--space-ratio));
}
.mtb-60 {
  margin-top: calc(60px * var(--space-ratio));
  margin-bottom: calc(60px * var(--space-ratio));
}
.mtb-70 {
  margin-top: calc(70px * var(--space-ratio));
  margin-bottom: calc(70px * var(--space-ratio));
}
.mtb-80 {
  margin-top: calc(80px * var(--space-ratio));
  margin-bottom: calc(80px * var(--space-ratio));
}
.mtb-90 {
  margin-top: calc(90px * var(--space-ratio));
  margin-bottom: calc(90px * var(--space-ratio));
}
.mtb-100 {
  margin-top: calc(100px * var(--space-ratio));
  margin-bottom: calc(100px * var(--space-ratio));
}
.mtb-110 {
  margin-top: calc(110px * var(--space-ratio));
  margin-bottom: calc(110px * var(--space-ratio));
}
.mtb-120 {
  margin-top: calc(120px * var(--space-ratio));
  margin-bottom: calc(120px * var(--space-ratio));
}
.mtb-130 {
  margin-top: calc(130px * var(--space-ratio));
  margin-bottom: calc(130px * var(--space-ratio));
}
.mtb-140 {
  margin-top: calc(140px * var(--space-ratio));
  margin-bottom: calc(140px * var(--space-ratio));
}
.mtb-150 {
  margin-top: calc(150px * var(--space-ratio));
  margin-bottom: calc(150px * var(--space-ratio));
}
.mtb-160 {
  margin-top: calc(160px * var(--space-ratio));
  margin-bottom: calc(160px * var(--space-ratio));
}
.mtb-170 {
  margin-top: calc(170px * var(--space-ratio));
  margin-bottom: calc(170px * var(--space-ratio));
}
.mtb-180 {
  margin-top: calc(180px * var(--space-ratio));
  margin-bottom: calc(180px * var(--space-ratio));
}
.mtb-190 {
  margin-top: calc(190px * var(--space-ratio));
  margin-bottom: calc(190px * var(--space-ratio));
}
.mtb-200 {
  margin-top: calc(200px * var(--space-ratio));
  margin-bottom: calc(200px * var(--space-ratio));
}

.mtb-1vw {
  margin-top: 1vw;
  margin-bottom: 1vw;
}
.mtb-2vw {
  margin-top: 2vw;
  margin-bottom: 2vw;
}
.mtb-3vw {
  margin-top: 3vw;
  margin-bottom: 3vw;
}
.mtb-4vw {
  margin-top: 4vw;
  margin-bottom: 4vw;
}
.mtb-5vw {
  margin-top: 5vw;
  margin-bottom: 5vw;
}
.mtb-6vw {
  margin-top: 6vw;
  margin-bottom: 6vw;
}
.mtb-7vw {
  margin-top: 7vw;
  margin-bottom: 7vw;
}
.mtb-8vw {
  margin-top: 8vw;
  margin-bottom: 8vw;
}
.mtb-9vw {
  margin-top: 9vw;
  margin-bottom: 9vw;
}
.mtb-10vw {
  margin-top: 10vw;
  margin-bottom: 10vw;
}
.mtb-11vw {
  margin-top: 11vw;
  margin-bottom: 11vw;
}
.mtb-12vw {
  margin-top: 12vw;
  margin-bottom: 12vw;
}
.mtb-13vw {
  margin-top: 13vw;
  margin-bottom: 13vw;
}
.mtb-14vw {
  margin-top: 14vw;
  margin-bottom: 14vw;
}
.mtb-15vw {
  margin-top: 15vw;
  margin-bottom: 15vw;
}

@media screen and (max-width: 1023px) {
  .mtb-5-sp {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mtb-8-sp {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mtb-10-sp {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mtb-15-sp {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .mtb-20-sp {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mtb-25-sp {
    margin-top: 25px;
    margin-bottom: 25px;
  }
  .mtb-30-sp {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .mtb-35-sp {
    margin-top: 35px;
    margin-bottom: 35px;
  }
  .mtb-40-sp {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mtb-45-sp {
    margin-top: 45px;
    margin-bottom: 45px;
  }
  .mtb-50-sp {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  .mtb-60-sp {
    margin-top: 60px;
    margin-bottom: 60px;
  }
  .mtb-70-sp {
    margin-top: 70px;
    margin-bottom: 70px;
  }
  .mtb-80-sp {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mtb-90-sp {
    margin-top: 90px;
    margin-bottom: 90px;
  }
  .mtb-100-sp {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .mtb-110-sp {
    margin-top: 110px;
    margin-bottom: 110px;
  }
  .mtb-120-sp {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .mtb-130-sp {
    margin-top: 130px;
    margin-bottom: 130px;
  }
  .mtb-140-sp {
    margin-top: 140px;
    margin-bottom: 140px;
  }
  .mtb-150-sp {
    margin-top: 150px;
    margin-bottom: 150px;
  }
  .mtb-160-sp {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mtb-170-sp {
    margin-top: 170px;
    margin-bottom: 170px;
  }
  .mtb-180-sp {
    margin-top: 180px;
    margin-bottom: 180px;
  }
  .mtb-190-sp {
    margin-top: 190px;
    margin-bottom: 190px;
  }
  .mtb-200-sp {
    margin-top: 200px;
    margin-bottom: 200px;
  }

  .mtb-1vw-sp {
    margin-top: 1vw;
    margin-bottom: 1vw;
  }
  .mtb-2vw-sp {
    margin-top: 2vw;
    margin-bottom: 2vw;
  }
  .mtb-3vw-sp {
    margin-top: 3vw;
    margin-bottom: 3vw;
  }
  .mtb-4vw-sp {
    margin-top: 4vw;
    margin-bottom: 4vw;
  }
  .mtb-5vw-sp {
    margin-top: 5vw;
    margin-bottom: 5vw;
  }
  .mtb-6vw-sp {
    margin-top: 6vw;
    margin-bottom: 6vw;
  }
  .mtb-7vw-sp {
    margin-top: 7vw;
    margin-bottom: 7vw;
  }
  .mtb-8vw-sp {
    margin-top: 8vw;
    margin-bottom: 8vw;
  }
  .mtb-9vw-sp {
    margin-top: 9vw;
    margin-bottom: 9vw;
  }
  .mtb-10vw-sp {
    margin-top: 10vw;
    margin-bottom: 10vw;
  }
  .mtb-11vw-sp {
    margin-top: 11vw;
    margin-bottom: 11vw;
  }
  .mtb-12vw-sp {
    margin-top: 12vw;
    margin-bottom: 12vw;
  }
  .mtb-13vw-sp {
    margin-top: 13vw;
    margin-bottom: 13vw;
  }
  .mtb-14vw-sp {
    margin-top: 14vw;
    margin-bottom: 14vw;
  }
  .mtb-15vw-sp {
    margin-top: 15vw;
    margin-bottom: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .mtb-5-tpc {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mtb-8-tpc {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mtb-10-tpc {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mtb-15-tpc {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .mtb-20-tpc {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mtb-25-tpc {
    margin-top: 25px;
    margin-bottom: 25px;
  }
  .mtb-30-tpc {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .mtb-35-tpc {
    margin-top: 35px;
    margin-bottom: 35px;
  }
  .mtb-40-tpc {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mtb-45-tpc {
    margin-top: 45px;
    margin-bottom: 45px;
  }
  .mtb-50-tpc {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  .mtb-60-tpc {
    margin-top: 60px;
    margin-bottom: 60px;
  }
  .mtb-70-tpc {
    margin-top: 70px;
    margin-bottom: 70px;
  }
  .mtb-80-tpc {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mtb-90-tpc {
    margin-top: 90px;
    margin-bottom: 90px;
  }
  .mtb-100-tpc {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .mtb-110-tpc {
    margin-top: 110px;
    margin-bottom: 110px;
  }
  .mtb-120-tpc {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .mtb-130-tpc {
    margin-top: 130px;
    margin-bottom: 130px;
  }
  .mtb-140-tpc {
    margin-top: 140px;
    margin-bottom: 140px;
  }
  .mtb-150-tpc {
    margin-top: 150px;
    margin-bottom: 150px;
  }
  .mtb-160-tpc {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mtb-170-tpc {
    margin-top: 170px;
    margin-bottom: 170px;
  }
  .mtb-180-tpc {
    margin-top: 180px;
    margin-bottom: 180px;
  }
  .mtb-190-tpc {
    margin-top: 190px;
    margin-bottom: 190px;
  }
  .mtb-200-tpc {
    margin-top: 200px;
    margin-bottom: 200px;
  }

  .mtb-1vw-tpc {
    margin-top: 1vw;
    margin-bottom: 1vw;
  }
  .mtb-2vw-tpc {
    margin-top: 2vw;
    margin-bottom: 2vw;
  }
  .mtb-3vw-tpc {
    margin-top: 3vw;
    margin-bottom: 3vw;
  }
  .mtb-4vw-tpc {
    margin-top: 4vw;
    margin-bottom: 4vw;
  }
  .mtb-5vw-tpc {
    margin-top: 5vw;
    margin-bottom: 5vw;
  }
  .mtb-6vw-tpc {
    margin-top: 6vw;
    margin-bottom: 6vw;
  }
  .mtb-7vw-tpc {
    margin-top: 7vw;
    margin-bottom: 7vw;
  }
  .mtb-8vw-tpc {
    margin-top: 8vw;
    margin-bottom: 8vw;
  }
  .mtb-9vw-tpc {
    margin-top: 9vw;
    margin-bottom: 9vw;
  }
  .mtb-10vw-tpc {
    margin-top: 10vw;
    margin-bottom: 10vw;
  }
  .mtb-11vw-tpc {
    margin-top: 11vw;
    margin-bottom: 11vw;
  }
  .mtb-12vw-tpc {
    margin-top: 12vw;
    margin-bottom: 12vw;
  }
  .mtb-13vw-tpc {
    margin-top: 13vw;
    margin-bottom: 13vw;
  }
  .mtb-14vw-tpc {
    margin-top: 14vw;
    margin-bottom: 14vw;
  }
  .mtb-15vw-tpc {
    margin-top: 15vw;
    margin-bottom: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .mtb-5-pc {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .mtb-8-pc {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .mtb-10-pc {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .mtb-15-pc {
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .mtb-20-pc {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .mtb-25-pc {
    margin-top: 25px;
    margin-bottom: 25px;
  }
  .mtb-30-pc {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .mtb-35-pc {
    margin-top: 35px;
    margin-bottom: 35px;
  }
  .mtb-40-pc {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .mtb-45-pc {
    margin-top: 45px;
    margin-bottom: 45px;
  }
  .mtb-50-pc {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  .mtb-60-pc {
    margin-top: 60px;
    margin-bottom: 60px;
  }
  .mtb-70-pc {
    margin-top: 70px;
    margin-bottom: 70px;
  }
  .mtb-80-pc {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .mtb-90-pc {
    margin-top: 90px;
    margin-bottom: 90px;
  }
  .mtb-100-pc {
    margin-top: 100px;
    margin-bottom: 100px;
  }
  .mtb-110-pc {
    margin-top: 110px;
    margin-bottom: 110px;
  }
  .mtb-120-pc {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .mtb-130-pc {
    margin-top: 130px;
    margin-bottom: 130px;
  }
  .mtb-140-pc {
    margin-top: 140px;
    margin-bottom: 140px;
  }
  .mtb-150-pc {
    margin-top: 150px;
    margin-bottom: 150px;
  }
  .mtb-160-pc {
    margin-top: 160px;
    margin-bottom: 160px;
  }
  .mtb-170-pc {
    margin-top: 170px;
    margin-bottom: 170px;
  }
  .mtb-180-pc {
    margin-top: 180px;
    margin-bottom: 180px;
  }
  .mtb-190-pc {
    margin-top: 190px;
    margin-bottom: 190px;
  }
  .mtb-200-pc {
    margin-top: 200px;
    margin-bottom: 200px;
  }

  .mtb-1vw-pc {
    margin-top: 1vw;
    margin-bottom: 1vw;
  }
  .mtb-2vw-pc {
    margin-top: 2vw;
    margin-bottom: 2vw;
  }
  .mtb-3vw-pc {
    margin-top: 3vw;
    margin-bottom: 3vw;
  }
  .mtb-4vw-pc {
    margin-top: 4vw;
    margin-bottom: 4vw;
  }
  .mtb-5vw-pc {
    margin-top: 5vw;
    margin-bottom: 5vw;
  }
  .mtb-6vw-pc {
    margin-top: 6vw;
    margin-bottom: 6vw;
  }
  .mtb-7vw-pc {
    margin-top: 7vw;
    margin-bottom: 7vw;
  }
  .mtb-8vw-pc {
    margin-top: 8vw;
    margin-bottom: 8vw;
  }
  .mtb-9vw-pc {
    margin-top: 9vw;
    margin-bottom: 9vw;
  }
  .mtb-10vw-pc {
    margin-top: 10vw;
    margin-bottom: 10vw;
  }
  .mtb-11vw-pc {
    margin-top: 11vw;
    margin-bottom: 11vw;
  }
  .mtb-12vw-pc {
    margin-top: 12vw;
    margin-bottom: 12vw;
  }
  .mtb-13vw-pc {
    margin-top: 13vw;
    margin-bottom: 13vw;
  }
  .mtb-14vw-pc {
    margin-top: 14vw;
    margin-bottom: 14vw;
  }
  .mtb-15vw-pc {
    margin-top: 15vw;
    margin-bottom: 15vw;
  }
}

/*margin right left*/
.mrl-5 {
  margin-right: calc(5px * var(--space-ratio));
  margin-left: calc(5px * var(--space-ratio));
}
.mrl-8 {
  margin-right: calc(8px * var(--space-ratio));
  margin-left: calc(8px * var(--space-ratio));
}
.mrl-10 {
  margin-right: calc(10px * var(--space-ratio));
  margin-left: calc(10px * var(--space-ratio));
}
.mrl-15 {
  margin-right: calc(15px * var(--space-ratio));
  margin-left: calc(15px * var(--space-ratio));
}
.mrl-20 {
  margin-right: calc(20px * var(--space-ratio));
  margin-left: calc(20px * var(--space-ratio));
}
.mrl-25 {
  margin-right: calc(25px * var(--space-ratio));
  margin-left: calc(25px * var(--space-ratio));
}
.mrl-30 {
  margin-right: calc(30px * var(--space-ratio));
  margin-left: calc(30px * var(--space-ratio));
}
.mrl-35 {
  margin-right: calc(30px * var(--space-ratio));
  margin-left: calc(35px * var(--space-ratio));
}
.mrl-40 {
  margin-right: calc(40px * var(--space-ratio));
  margin-left: calc(40px * var(--space-ratio));
}
.mrl-45 {
  margin-right: calc(45px * var(--space-ratio));
  margin-left: calc(45px * var(--space-ratio));
}
.mrl-50 {
  margin-right: calc(50px * var(--space-ratio));
  margin-left: calc(50px * var(--space-ratio));
}
.mrl-60 {
  margin-right: calc(60px * var(--space-ratio));
  margin-left: calc(60px * var(--space-ratio));
}
.mrl-70 {
  margin-right: calc(70px * var(--space-ratio));
  margin-left: calc(70px * var(--space-ratio));
}
.mrl-80 {
  margin-right: calc(80px * var(--space-ratio));
  margin-left: calc(80px * var(--space-ratio));
}
.mrl-90 {
  margin-right: calc(90px * var(--space-ratio));
  margin-left: calc(90px * var(--space-ratio));
}
.mrl-100 {
  margin-right: calc(100px * var(--space-ratio));
  margin-left: calc(100px * var(--space-ratio));
}
.mrl-110 {
  margin-right: calc(110px * var(--space-ratio));
  margin-left: calc(110px * var(--space-ratio));
}
.mrl-120 {
  margin-right: calc(120px * var(--space-ratio));
  margin-left: calc(120px * var(--space-ratio));
}
.mrl-130 {
  margin-right: calc(130px * var(--space-ratio));
  margin-left: calc(130px * var(--space-ratio));
}
.mrl-140 {
  margin-right: calc(140px * var(--space-ratio));
  margin-left: calc(140px * var(--space-ratio));
}
.mrl-150 {
  margin-right: calc(150px * var(--space-ratio));
  margin-left: calc(150px * var(--space-ratio));
}
.mrl-160 {
  margin-right: calc(160px * var(--space-ratio));
  margin-left: calc(160px * var(--space-ratio));
}
.mrl-170 {
  margin-right: calc(170px * var(--space-ratio));
  margin-left: calc(170px * var(--space-ratio));
}
.mrl-180 {
  margin-right: calc(180px * var(--space-ratio));
  margin-left: calc(180px * var(--space-ratio));
}
.mrl-190 {
  margin-right: calc(190px * var(--space-ratio));
  margin-left: calc(190px * var(--space-ratio));
}
.mrl-200 {
  margin-right: calc(200px * var(--space-ratio));
  margin-left: calc(200px * var(--space-ratio));
}

.mrl-1vw {
  margin-right: 1vw;
  margin-left: 1vw;
}
.mrl-2vw {
  margin-right: 2vw;
  margin-left: 2vw;
}
.mrl-3vw {
  margin-right: 3vw;
  margin-left: 3vw;
}
.mrl-4vw {
  margin-right: 4vw;
  margin-left: 4vw;
}
.mrl-5vw {
  margin-right: 5vw;
  margin-left: 5vw;
}
.mrl-6vw {
  margin-right: 6vw;
  margin-left: 6vw;
}
.mrl-7vw {
  margin-right: 7vw;
  margin-left: 7vw;
}
.mrl-8vw {
  margin-right: 8vw;
  margin-left: 8vw;
}
.mrl-9vw {
  margin-right: 9vw;
  margin-left: 9vw;
}
.mrl-10vw {
  margin-right: 10vw;
  margin-left: 10vw;
}
.mrl-11vw {
  margin-right: 11vw;
  margin-left: 11vw;
}
.mrl-12vw {
  margin-right: 12vw;
  margin-left: 12vw;
}
.mrl-13vw {
  margin-right: 13vw;
  margin-left: 13vw;
}
.mrl-14vw {
  margin-right: 14vw;
  margin-left: 14vw;
}
.mrl-15vw {
  margin-right: 15vw;
  margin-left: 15vw;
}

.mrl-s {
  margin-right: var(--space-s);
  margin-left: var(--space-s);
}
.mrl-m {
  margin-right: var(--space-m);
  margin-left: var(--space-m);
}
.mrl-l {
  margin-right: var(--space-l);
  margin-left: var(--space-l);
}

.mrl-auto {
  margin-right: auto;
  margin-left: auto;
}

@media screen and (max-width: 1023px) {
  .mrl-5-sp {
    margin-right: 5px;
    margin-left: 5px;
  }
  .mrl-8-sp {
    margin-right: 8px;
    margin-left: 8px;
  }
  .mrl-10-sp {
    margin-right: 10px;
    margin-left: 10px;
  }
  .mrl-15-sp {
    margin-right: 15px;
    margin-left: 15px;
  }
  .mrl-20-sp {
    margin-right: 20px;
    margin-left: 20px;
  }
  .mrl-25-sp {
    margin-right: 25px;
    margin-left: 25px;
  }
  .mrl-30-sp {
    margin-right: 30px;
    margin-left: 30px;
  }
  .mrl-35-sp {
    margin-right: 35px;
    margin-left: 35px;
  }
  .mrl-40-sp {
    margin-right: 40px;
    margin-left: 40px;
  }
  .mrl-45-sp {
    margin-right: 45px;
    margin-left: 45px;
  }
  .mrl-50-sp {
    margin-right: 50px;
    margin-left: 50px;
  }
  .mrl-60-sp {
    margin-right: 60px;
    margin-left: 60px;
  }
  .mrl-70-sp {
    margin-right: 70px;
    margin-left: 70px;
  }
  .mrl-80-sp {
    margin-right: 80px;
    margin-left: 80px;
  }
  .mrl-90-sp {
    margin-right: 90px;
    margin-left: 90px;
  }
  .mrl-100-sp {
    margin-right: 100px;
    margin-left: 100px;
  }
  .mrl-110-sp {
    margin-right: 110px;
    margin-left: 110px;
  }
  .mrl-120-sp {
    margin-right: 120px;
    margin-left: 120px;
  }
  .mrl-130-sp {
    margin-right: 130px;
    margin-left: 130px;
  }
  .mrl-140-sp {
    margin-right: 140px;
    margin-left: 140px;
  }
  .mrl-150-sp {
    margin-right: 150px;
    margin-left: 150px;
  }
  .mrl-160-sp {
    margin-right: 160px;
    margin-left: 160px;
  }
  .mrl-170-sp {
    margin-right: 170px;
    margin-left: 170px;
  }
  .mrl-180-sp {
    margin-right: 180px;
    margin-left: 180px;
  }
  .mrl-190-sp {
    margin-right: 190px;
    margin-left: 190px;
  }
  .mrl-200-sp {
    margin-right: 200px;
    margin-left: 200px;
  }

  .mrl-1vw-sp {
    margin-right: 1vw;
    margin-left: 1vw;
  }
  .mrl-2vw-sp {
    margin-right: 2vw;
    margin-left: 2vw;
  }
  .mrl-3vw-sp {
    margin-right: 3vw;
    margin-left: 3vw;
  }
  .mrl-4vw-sp {
    margin-right: 4vw;
    margin-left: 4vw;
  }
  .mrl-5vw-sp {
    margin-right: 5vw;
    margin-left: 5vw;
  }
  .mrl-6vw-sp {
    margin-right: 6vw;
    margin-left: 6vw;
  }
  .mrl-7vw-sp {
    margin-right: 7vw;
    margin-left: 7vw;
  }
  .mrl-8vw-sp {
    margin-right: 8vw;
    margin-left: 8vw;
  }
  .mrl-9vw-sp {
    margin-right: 9vw;
    margin-left: 9vw;
  }
  .mrl-10vw-sp {
    margin-right: 10vw;
    margin-left: 10vw;
  }
  .mrl-11vw-sp {
    margin-right: 11vw;
    margin-left: 11vw;
  }
  .mrl-12vw-sp {
    margin-right: 12vw;
    margin-left: 12vw;
  }
  .mrl-13vw-sp {
    margin-right: 13vw;
    margin-left: 13vw;
  }
  .mrl-14vw-sp {
    margin-right: 14vw;
    margin-left: 14vw;
  }
  .mrl-15vw-sp {
    margin-right: 15vw;
    margin-left: 15vw;
  }

  .mrl-s-sp {
    margin-right: var(--space-s);
    margin-left: var(--space-s);
  }
  .mrl-m-sp {
    margin-right: var(--space-m);
    margin-left: var(--space-m);
  }
  .mrl-l-sp {
    margin-right: var(--space-l);
    margin-left: var(--space-l);
  }

  .mrl-auto-sp {
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 768px) {
  .mrl-5-tpc {
    margin-right: 5px;
    margin-left: 5px;
  }
  .mrl-8-tpc {
    margin-right: 8px;
    margin-left: 8px;
  }
  .mrl-10-tpc {
    margin-right: 10px;
    margin-left: 10px;
  }
  .mrl-15-tpc {
    margin-right: 15px;
    margin-left: 15px;
  }
  .mrl-20-tpc {
    margin-right: 20px;
    margin-left: 20px;
  }
  .mrl-25-tpc {
    margin-right: 25px;
    margin-left: 25px;
  }
  .mrl-30-tpc {
    margin-right: 30px;
    margin-left: 30px;
  }
  .mrl-35-tpc {
    margin-right: 35px;
    margin-left: 35px;
  }
  .mrl-40-tpc {
    margin-right: 40px;
    margin-left: 40px;
  }
  .mrl-45-tpc {
    margin-right: 45px;
    margin-left: 45px;
  }
  .mrl-50-tpc {
    margin-right: 50px;
    margin-left: 50px;
  }
  .mrl-60-tpc {
    margin-right: 60px;
    margin-left: 60px;
  }
  .mrl-70-tpc {
    margin-right: 70px;
    margin-left: 70px;
  }
  .mrl-80-tpc {
    margin-right: 80px;
    margin-left: 80px;
  }
  .mrl-90-tpc {
    margin-right: 90px;
    margin-left: 90px;
  }
  .mrl-100-tpc {
    margin-right: 100px;
    margin-left: 100px;
  }
  .mrl-110-tpc {
    margin-right: 110px;
    margin-left: 110px;
  }
  .mrl-120-tpc {
    margin-right: 120px;
    margin-left: 120px;
  }
  .mrl-130-tpc {
    margin-right: 130px;
    margin-left: 130px;
  }
  .mrl-140-tpc {
    margin-right: 140px;
    margin-left: 140px;
  }
  .mrl-150-tpc {
    margin-right: 150px;
    margin-left: 150px;
  }
  .mrl-160-tpc {
    margin-right: 160px;
    margin-left: 160px;
  }
  .mrl-170-tpc {
    margin-right: 170px;
    margin-left: 170px;
  }
  .mrl-180-tpc {
    margin-right: 180px;
    margin-left: 180px;
  }
  .mrl-190-tpc {
    margin-right: 190px;
    margin-left: 190px;
  }
  .mrl-200-tpc {
    margin-right: 200px;
    margin-left: 200px;
  }

  .mrl-1vw-tpc {
    margin-right: 1vw;
    margin-left: 1vw;
  }
  .mrl-2vw-tpc {
    margin-right: 2vw;
    margin-left: 2vw;
  }
  .mrl-3vw-tpc {
    margin-right: 3vw;
    margin-left: 3vw;
  }
  .mrl-4vw-tpc {
    margin-right: 4vw;
    margin-left: 4vw;
  }
  .mrl-5vw-tpc {
    margin-right: 5vw;
    margin-left: 5vw;
  }
  .mrl-6vw-tpc {
    margin-right: 6vw;
    margin-left: 6vw;
  }
  .mrl-7vw-tpc {
    margin-right: 7vw;
    margin-left: 7vw;
  }
  .mrl-8vw-tpc {
    margin-right: 8vw;
    margin-left: 8vw;
  }
  .mrl-9vw-tpc {
    margin-right: 9vw;
    margin-left: 9vw;
  }
  .mrl-10vw-tpc {
    margin-right: 10vw;
    margin-left: 10vw;
  }
  .mrl-11vw-tpc {
    margin-right: 11vw;
    margin-left: 11vw;
  }
  .mrl-12vw-tpc {
    margin-right: 12vw;
    margin-left: 12vw;
  }
  .mrl-13vw-tpc {
    margin-right: 13vw;
    margin-left: 13vw;
  }
  .mrl-14vw-tpc {
    margin-right: 14vw;
    margin-left: 14vw;
  }
  .mrl-15vw-tpc {
    margin-right: 15vw;
    margin-left: 15vw;
  }

  .mrl-s-tpc {
    margin-right: var(--space-s);
    margin-left: var(--space-s);
  }
  .mrl-m-tpc {
    margin-right: var(--space-m);
    margin-left: var(--space-m);
  }
  .mrl-l-tpc {
    margin-right: var(--space-l);
    margin-left: var(--space-l);
  }

  .mrl-auto-tpc {
    margin-right: auto;
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .mrl-5-pc {
    margin-right: 5px;
    margin-left: 5px;
  }
  .mrl-8-pc {
    margin-right: 8px;
    margin-left: 8px;
  }
  .mrl-10-pc {
    margin-right: 10px;
    margin-left: 10px;
  }
  .mrl-15-pc {
    margin-right: 15px;
    margin-left: 15px;
  }
  .mrl-20-pc {
    margin-right: 20px;
    margin-left: 20px;
  }
  .mrl-25-pc {
    margin-right: 25px;
    margin-left: 25px;
  }
  .mrl-30-pc {
    margin-right: 30px;
    margin-left: 30px;
  }
  .mrl-35-pc {
    margin-right: 35px;
    margin-left: 35px;
  }
  .mrl-40-pc {
    margin-right: 40px;
    margin-left: 40px;
  }
  .mrl-45-pc {
    margin-right: 45px;
    margin-left: 45px;
  }
  .mrl-50-pc {
    margin-right: 50px;
    margin-left: 50px;
  }
  .mrl-60-pc {
    margin-right: 60px;
    margin-left: 60px;
  }
  .mrl-70-pc {
    margin-right: 70px;
    margin-left: 70px;
  }
  .mrl-80-pc {
    margin-right: 80px;
    margin-left: 80px;
  }
  .mrl-90-pc {
    margin-right: 90px;
    margin-left: 90px;
  }
  .mrl-100-pc {
    margin-right: 100px;
    margin-left: 100px;
  }
  .mrl-110-pc {
    margin-right: 110px;
    margin-left: 110px;
  }
  .mrl-120-pc {
    margin-right: 120px;
    margin-left: 120px;
  }
  .mrl-130-pc {
    margin-right: 130px;
    margin-left: 130px;
  }
  .mrl-140-pc {
    margin-right: 140px;
    margin-left: 140px;
  }
  .mrl-150-pc {
    margin-right: 150px;
    margin-left: 150px;
  }
  .mrl-160-pc {
    margin-right: 160px;
    margin-left: 160px;
  }
  .mrl-170-pc {
    margin-right: 170px;
    margin-left: 170px;
  }
  .mrl-180-pc {
    margin-right: 180px;
    margin-left: 180px;
  }
  .mrl-190-pc {
    margin-right: 190px;
    margin-left: 190px;
  }
  .mrl-200-pc {
    margin-right: 200px;
    margin-left: 200px;
  }

  .mrl-1vw-pc {
    margin-right: 1vw;
    margin-left: 1vw;
  }
  .mrl-2vw-pc {
    margin-right: 2vw;
    margin-left: 2vw;
  }
  .mrl-3vw-pc {
    margin-right: 3vw;
    margin-left: 3vw;
  }
  .mrl-4vw-pc {
    margin-right: 4vw;
    margin-left: 4vw;
  }
  .mrl-5vw-pc {
    margin-right: 5vw;
    margin-left: 5vw;
  }
  .mrl-6vw-pc {
    margin-right: 6vw;
    margin-left: 6vw;
  }
  .mrl-7vw-pc {
    margin-right: 7vw;
    margin-left: 7vw;
  }
  .mrl-8vw-pc {
    margin-right: 8vw;
    margin-left: 8vw;
  }
  .mrl-9vw-pc {
    margin-right: 9vw;
    margin-left: 9vw;
  }
  .mrl-10vw-pc {
    margin-right: 10vw;
    margin-left: 10vw;
  }
  .mrl-11vw-pc {
    margin-right: 11vw;
    margin-left: 11vw;
  }
  .mrl-12vw-pc {
    margin-right: 12vw;
    margin-left: 12vw;
  }
  .mrl-13vw-pc {
    margin-right: 13vw;
    margin-left: 13vw;
  }
  .mrl-14vw-pc {
    margin-right: 14vw;
    margin-left: 14vw;
  }
  .mrl-15vw-pc {
    margin-right: 15vw;
    margin-left: 15vw;
  }

  .mrl-s-pc {
    margin-right: var(--space-s);
    margin-left: var(--space-s);
  }
  .mrl-m-pc {
    margin-right: var(--space-m);
    margin-left: var(--space-m);
  }
  .mrl-l-pc {
    margin-right: var(--space-l);
    margin-left: var(--space-l);
  }

  .mrl-auto-pc {
    margin-right: auto;
    margin-left: auto;
  }
}

/*margin top*/
.mt-5 {
  margin-top: calc(5px * var(--space-ratio));
}
.mt-8 {
  margin-top: calc(8px * var(--space-ratio));
}
.mt-10 {
  margin-top: calc(10px * var(--space-ratio));
}
.mt-15 {
  margin-top: calc(15px * var(--space-ratio));
}
.mt-20 {
  margin-top: calc(20px * var(--space-ratio));
}
.mt-25 {
  margin-top: calc(25px * var(--space-ratio));
}
.mt-30 {
  margin-top: calc(35px * var(--space-ratio));
}
.mt-35 {
  margin-top: calc(30px * var(--space-ratio));
}
.mt-40 {
  margin-top: calc(40px * var(--space-ratio));
}
.mt-45 {
  margin-top: calc(45px * var(--space-ratio));
}
.mt-50 {
  margin-top: calc(50px * var(--space-ratio));
}
.mt-60 {
  margin-top: calc(60px * var(--space-ratio));
}
.mt-70 {
  margin-top: calc(70px * var(--space-ratio));
}
.mt-80 {
  margin-top: calc(80px * var(--space-ratio));
}
.mt-90 {
  margin-top: calc(90px * var(--space-ratio));
}
.mt-100 {
  margin-top: calc(100px * var(--space-ratio));
}
.mt-110 {
  margin-top: calc(110px * var(--space-ratio));
}
.mt-120 {
  margin-top: calc(120px * var(--space-ratio));
}
.mt-130 {
  margin-top: calc(130px * var(--space-ratio));
}
.mt-140 {
  margin-top: calc(140px * var(--space-ratio));
}
.mt-150 {
  margin-top: calc(150px * var(--space-ratio));
}
.mt-160 {
  margin-top: calc(160px * var(--space-ratio));
}
.mt-170 {
  margin-top: calc(170px * var(--space-ratio));
}
.mt-180 {
  margin-top: calc(180px * var(--space-ratio));
}
.mt-190 {
  margin-top: calc(190px * var(--space-ratio));
}
.mt-200 {
  margin-top: calc(200px * var(--space-ratio));
}

.mt-1vw {
  margin-top: 1vw;
}
.mt-2vw {
  margin-top: 2vw;
}
.mt-3vw {
  margin-top: 3vw;
}
.mt-4vw {
  margin-top: 4vw;
}
.mt-5vw {
  margin-top: 5vw;
}
.mt-6vw {
  margin-top: 6vw;
}
.mt-7vw {
  margin-top: 7vw;
}
.mt-8vw {
  margin-top: 8vw;
}
.mt-9vw {
  margin-top: 9vw;
}
.mt-10vw {
  margin-top: 10vw;
}
.mt-11vw {
  margin-top: 11vw;
}
.mt-12vw {
  margin-top: 12vw;
}
.mt-13vw {
  margin-top: 13vw;
}
.mt-14vw {
  margin-top: 14vw;
}
.mt-15vw {
  margin-top: 15vw;
}

@media screen and (max-width: 1023px) {
  .mt-5-sp {
    margin-top: 5px;
  }
  .mt-8-sp {
    margin-top: 8px;
  }
  .mt-10-sp {
    margin-top: 10px;
  }
  .mt-15-sp {
    margin-top: 15px;
  }
  .mt-20-sp {
    margin-top: 20px;
  }
  .mt-25-sp {
    margin-top: 25px;
  }
  .mt-30-sp {
    margin-top: 30px;
  }
  .mt-35-sp {
    margin-top: 35px;
  }
  .mt-40-sp {
    margin-top: 40px;
  }
  .mt-45-sp {
    margin-top: 45px;
  }
  .mt-50-sp {
    margin-top: 50px;
  }
  .mt-60-sp {
    margin-top: 60px;
  }
  .mt-70-sp {
    margin-top: 70px;
  }
  .mt-80-sp {
    margin-top: 80px;
  }
  .mt-90-sp {
    margin-top: 90px;
  }
  .mt-100-sp {
    margin-top: 100px;
  }
  .mt-110-sp {
    margin-top: 110px;
  }
  .mt-120-sp {
    margin-top: 120px;
  }
  .mt-130-sp {
    margin-top: 130px;
  }
  .mt-140-sp {
    margin-top: 140px;
  }
  .mt-150-sp {
    margin-top: 150px;
  }
  .mt-160-sp {
    margin-top: 160px;
  }
  .mt-170-sp {
    margin-top: 170px;
  }
  .mt-180-sp {
    margin-top: 180px;
  }
  .mt-190-sp {
    margin-top: 190px;
  }
  .mt-200-sp {
    margin-top: 200px;
  }

  .mt-1vw-sp {
    margin-top: 1vw;
  }
  .mt-2vw-sp {
    margin-top: 2vw;
  }
  .mt-3vw-sp {
    margin-top: 3vw;
  }
  .mt-4vw-sp {
    margin-top: 4vw;
  }
  .mt-5vw-sp {
    margin-top: 5vw;
  }
  .mt-6vw-sp {
    margin-top: 6vw;
  }
  .mt-7vw-sp {
    margin-top: 7vw;
  }
  .mt-8vw-sp {
    margin-top: 8vw;
  }
  .mt-9vw-sp {
    margin-top: 9vw;
  }
  .mt-10vw-sp {
    margin-top: 10vw;
  }
  .mt-11vw-sp {
    margin-top: 11vw;
  }
  .mt-12vw-sp {
    margin-top: 12vw;
  }
  .mt-13vw-sp {
    margin-top: 13vw;
  }
  .mt-14vw-sp {
    margin-top: 14vw;
  }
  .mt-15vw-sp {
    margin-top: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .mt-5-tpc {
    margin-top: 5px;
  }
  .mt-8-tpc {
    margin-top: 8px;
  }
  .mt-10-tpc {
    margin-top: 10px;
  }
  .mt-15-tpc {
    margin-top: 15px;
  }
  .mt-20-tpc {
    margin-top: 20px;
  }
  .mt-25-tpc {
    margin-top: 25px;
  }
  .mt-30-tpc {
    margin-top: 30px;
  }
  .mt-35-tpc {
    margin-top: 35px;
  }
  .mt-40-tpc {
    margin-top: 40px;
  }
  .mt-45-tpc {
    margin-top: 45px;
  }
  .mt-50-tpc {
    margin-top: 50px;
  }
  .mt-60-tpc {
    margin-top: 60px;
  }
  .mt-70-tpc {
    margin-top: 70px;
  }
  .mt-80-tpc {
    margin-top: 80px;
  }
  .mt-90-tpc {
    margin-top: 90px;
  }
  .mt-100-tpc {
    margin-top: 100px;
  }
  .mt-110-tpc {
    margin-top: 110px;
  }
  .mt-120-tpc {
    margin-top: 120px;
  }
  .mt-130-tpc {
    margin-top: 130px;
  }
  .mt-140-tpc {
    margin-top: 140px;
  }
  .mt-150-tpc {
    margin-top: 150px;
  }
  .mt-160-tpc {
    margin-top: 160px;
  }
  .mt-170-tpc {
    margin-top: 170px;
  }
  .mt-180-tpc {
    margin-top: 180px;
  }
  .mt-190-tpc {
    margin-top: 190px;
  }
  .mt-200-tpc {
    margin-top: 200px;
  }

  .mt-1vw-tpc {
    margin-top: 1vw;
  }
  .mt-2vw-tpc {
    margin-top: 2vw;
  }
  .mt-3vw-tpc {
    margin-top: 3vw;
  }
  .mt-4vw-tpc {
    margin-top: 4vw;
  }
  .mt-5vw-tpc {
    margin-top: 5vw;
  }
  .mt-6vw-tpc {
    margin-top: 6vw;
  }
  .mt-7vw-tpc {
    margin-top: 7vw;
  }
  .mt-8vw-tpc {
    margin-top: 8vw;
  }
  .mt-9vw-tpc {
    margin-top: 9vw;
  }
  .mt-10vw-tpc {
    margin-top: 10vw;
  }
  .mt-11vw-tpc {
    margin-top: 11vw;
  }
  .mt-12vw-tpc {
    margin-top: 12vw;
  }
  .mt-13vw-tpc {
    margin-top: 13vw;
  }
  .mt-14vw-tpc {
    margin-top: 14vw;
  }
  .mt-15vw-tpc {
    margin-top: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .mt-5-pc {
    margin-top: 5px;
  }
  .mt-8-pc {
    margin-top: 8px;
  }
  .mt-10-pc {
    margin-top: 10px;
  }
  .mt-15-pc {
    margin-top: 15px;
  }
  .mt-20-pc {
    margin-top: 20px;
  }
  .mt-25-pc {
    margin-top: 25px;
  }
  .mt-30-pc {
    margin-top: 30px;
  }
  .mt-35-pc {
    margin-top: 35px;
  }
  .mt-40-pc {
    margin-top: 40px;
  }
  .mt-45-pc {
    margin-top: 45px;
  }
  .mt-50-pc {
    margin-top: 50px;
  }
  .mt-60-pc {
    margin-top: 60px;
  }
  .mt-70-pc {
    margin-top: 70px;
  }
  .mt-80-pc {
    margin-top: 80px;
  }
  .mt-90-pc {
    margin-top: 90px;
  }
  .mt-100-pc {
    margin-top: 100px;
  }
  .mt-110-pc {
    margin-top: 110px;
  }
  .mt-120-pc {
    margin-top: 120px;
  }
  .mt-130-pc {
    margin-top: 130px;
  }
  .mt-140-pc {
    margin-top: 140px;
  }
  .mt-150-pc {
    margin-top: 150px;
  }
  .mt-160-pc {
    margin-top: 160px;
  }
  .mt-170-pc {
    margin-top: 170px;
  }
  .mt-180-pc {
    margin-top: 180px;
  }
  .mt-190-pc {
    margin-top: 190px;
  }
  .mt-200-pc {
    margin-top: 200px;
  }

  .mt-1vw-pc {
    margin-top: 1vw;
  }
  .mt-2vw-pc {
    margin-top: 2vw;
  }
  .mt-3vw-pc {
    margin-top: 3vw;
  }
  .mt-4vw-pc {
    margin-top: 4vw;
  }
  .mt-5vw-pc {
    margin-top: 5vw;
  }
  .mt-6vw-pc {
    margin-top: 6vw;
  }
  .mt-7vw-pc {
    margin-top: 7vw;
  }
  .mt-8vw-pc {
    margin-top: 8vw;
  }
  .mt-9vw-pc {
    margin-top: 9vw;
  }
  .mt-10vw-pc {
    margin-top: 10vw;
  }
  .mt-11vw-pc {
    margin-top: 11vw;
  }
  .mt-12vw-pc {
    margin-top: 12vw;
  }
  .mt-13vw-pc {
    margin-top: 13vw;
  }
  .mt-14vw-pc {
    margin-top: 14vw;
  }
  .mt-15vw-pc {
    margin-top: 15vw;
  }
}

/*margin right*/
.mr-5 {
  margin-right: calc(5px * var(--space-ratio));
}
.mr-8 {
  margin-right: calc(8px * var(--space-ratio));
}
.mr-10 {
  margin-right: calc(10px * var(--space-ratio));
}
.mr-15 {
  margin-right: calc(15px * var(--space-ratio));
}
.mr-20 {
  margin-right: calc(20px * var(--space-ratio));
}
.mr-25 {
  margin-right: calc(25px * var(--space-ratio));
}
.mr-30 {
  margin-right: calc(30px * var(--space-ratio));
}
.mr-35 {
  margin-right: calc(35px * var(--space-ratio));
}
.mr-40 {
  margin-right: calc(45px * var(--space-ratio));
}
.mr-45 {
  margin-right: calc(40px * var(--space-ratio));
}
.mr-50 {
  margin-right: calc(50px * var(--space-ratio));
}
.mr-60 {
  margin-right: calc(60px * var(--space-ratio));
}
.mr-70 {
  margin-right: calc(70px * var(--space-ratio));
}
.mr-80 {
  margin-right: calc(80px * var(--space-ratio));
}
.mr-90 {
  margin-right: calc(90px * var(--space-ratio));
}
.mr-100 {
  margin-right: calc(100px * var(--space-ratio));
}
.mr-110 {
  margin-right: calc(110px * var(--space-ratio));
}
.mr-120 {
  margin-right: calc(120px * var(--space-ratio));
}
.mr-130 {
  margin-right: calc(130px * var(--space-ratio));
}
.mr-140 {
  margin-right: calc(140px * var(--space-ratio));
}
.mr-150 {
  margin-right: calc(150px * var(--space-ratio));
}
.mr-160 {
  margin-right: calc(160px * var(--space-ratio));
}
.mr-170 {
  margin-right: calc(170px * var(--space-ratio));
}
.mr-180 {
  margin-right: calc(180px * var(--space-ratio));
}
.mr-190 {
  margin-right: calc(190px * var(--space-ratio));
}
.mr-200 {
  margin-right: calc(200px * var(--space-ratio));
}

.mr-1vw {
  margin-right: 1vw;
}
.mr-2vw {
  margin-right: 2vw;
}
.mr-3vw {
  margin-right: 3vw;
}
.mr-4vw {
  margin-right: 4vw;
}
.mr-5vw {
  margin-right: 5vw;
}
.mr-6vw {
  margin-right: 6vw;
}
.mr-7vw {
  margin-right: 7vw;
}
.mr-8vw {
  margin-right: 8vw;
}
.mr-9vw {
  margin-right: 9vw;
}
.mr-10vw {
  margin-right: 10vw;
}
.mr-11vw {
  margin-right: 11vw;
}
.mr-12vw {
  margin-right: 12vw;
}
.mr-13vw {
  margin-right: 13vw;
}
.mr-14vw {
  margin-right: 14vw;
}
.mr-15vw {
  margin-right: 15vw;
}

.mr-s {
  margin-right: var(--space-s);
}
.mr-m {
  margin-right: var(--space-m);
}
.mr-l {
  margin-right: var(--space-l);
}

.mr-auto {
  margin-right: auto;
}

@media screen and (max-width: 1023px) {
  .mr-5-sp {
    margin-right: 5px;
  }
  .mr-8-sp {
    margin-right: 8px;
  }
  .mr-10-sp {
    margin-right: 10px;
  }
  .mr-15-sp {
    margin-right: 15px;
  }
  .mr-20-sp {
    margin-right: 20px;
  }
  .mr-25-sp {
    margin-right: 25px;
  }
  .mr-30-sp {
    margin-right: 30px;
  }
  .mr-35-sp {
    margin-right: 35px;
  }
  .mr-40-sp {
    margin-right: 40px;
  }
  .mr-45-sp {
    margin-right: 45px;
  }
  .mr-50-sp {
    margin-right: 50px;
  }
  .mr-60-sp {
    margin-right: 60px;
  }
  .mr-70-sp {
    margin-right: 70px;
  }
  .mr-80-sp {
    margin-right: 80px;
  }
  .mr-90-sp {
    margin-right: 90px;
  }
  .mr-100-sp {
    margin-right: 100px;
  }
  .mr-110-sp {
    margin-right: 110px;
  }
  .mr-120-sp {
    margin-right: 120px;
  }
  .mr-130-sp {
    margin-right: 130px;
  }
  .mr-140-sp {
    margin-right: 140px;
  }
  .mr-150-sp {
    margin-right: 150px;
  }
  .mr-160-sp {
    margin-right: 160px;
  }
  .mr-170-sp {
    margin-right: 170px;
  }
  .mr-180-sp {
    margin-right: 180px;
  }
  .mr-190-sp {
    margin-right: 190px;
  }
  .mr-200-sp {
    margin-right: 200px;
  }

  .mr-1vw-sp {
    margin-right: 1vw;
  }
  .mr-2vw-sp {
    margin-right: 2vw;
  }
  .mr-3vw-sp {
    margin-right: 3vw;
  }
  .mr-4vw-sp {
    margin-right: 4vw;
  }
  .mr-5vw-sp {
    margin-right: 5vw;
  }
  .mr-6vw-sp {
    margin-right: 6vw;
  }
  .mr-7vw-sp {
    margin-right: 7vw;
  }
  .mr-8vw-sp {
    margin-right: 8vw;
  }
  .mr-9vw-sp {
    margin-right: 9vw;
  }
  .mr-10vw-sp {
    margin-right: 10vw;
  }
  .mr-11vw-sp {
    margin-right: 11vw;
  }
  .mr-12vw-sp {
    margin-right: 12vw;
  }
  .mr-13vw-sp {
    margin-right: 13vw;
  }
  .mr-14vw-sp {
    margin-right: 14vw;
  }
  .mr-15vw-sp {
    margin-right: 15vw;
  }

  .mr-s-sp {
    margin-right: var(--space-s);
  }
  .mr-m-sp {
    margin-right: var(--space-m);
  }
  .mr-l-sp {
    margin-right: var(--space-l);
  }

  .mr-auto-sp {
    margin-right: auto;
  }
}
@media screen and (min-width: 768px) {
  .mr-5-tpc {
    margin-right: 5px;
  }
  .mr-8-tpc {
    margin-right: 8px;
  }
  .mr-10-tpc {
    margin-right: 10px;
  }
  .mr-15-tpc {
    margin-right: 15px;
  }
  .mr-20-tpc {
    margin-right: 20px;
  }
  .mr-25-tpc {
    margin-right: 25px;
  }
  .mr-30-tpc {
    margin-right: 30px;
  }
  .mr-35-tpc {
    margin-right: 35px;
  }
  .mr-40-tpc {
    margin-right: 40px;
  }
  .mr-45-tpc {
    margin-right: 45px;
  }
  .mr-50-tpc {
    margin-right: 50px;
  }
  .mr-60-tpc {
    margin-right: 60px;
  }
  .mr-70-tpc {
    margin-right: 70px;
  }
  .mr-80-tpc {
    margin-right: 80px;
  }
  .mr-90-tpc {
    margin-right: 90px;
  }
  .mr-100-tpc {
    margin-right: 100px;
  }
  .mr-110-tpc {
    margin-right: 110px;
  }
  .mr-120-tpc {
    margin-right: 120px;
  }
  .mr-130-tpc {
    margin-right: 130px;
  }
  .mr-140-tpc {
    margin-right: 140px;
  }
  .mr-150-tpc {
    margin-right: 150px;
  }
  .mr-160-tpc {
    margin-right: 160px;
  }
  .mr-170-tpc {
    margin-right: 170px;
  }
  .mr-180-tpc {
    margin-right: 180px;
  }
  .mr-190-tpc {
    margin-right: 190px;
  }
  .mr-200-tpc {
    margin-right: 200px;
  }

  .mr-1vw-tpc {
    margin-right: 1vw;
  }
  .mr-2vw-tpc {
    margin-right: 2vw;
  }
  .mr-3vw-tpc {
    margin-right: 3vw;
  }
  .mr-4vw-tpc {
    margin-right: 4vw;
  }
  .mr-5vw-tpc {
    margin-right: 5vw;
  }
  .mr-6vw-tpc {
    margin-right: 6vw;
  }
  .mr-7vw-tpc {
    margin-right: 7vw;
  }
  .mr-8vw-tpc {
    margin-right: 8vw;
  }
  .mr-9vw-tpc {
    margin-right: 9vw;
  }
  .mr-10vw-tpc {
    margin-right: 10vw;
  }
  .mr-11vw-tpc {
    margin-right: 11vw;
  }
  .mr-12vw-tpc {
    margin-right: 12vw;
  }
  .mr-13vw-tpc {
    margin-right: 13vw;
  }
  .mr-14vw-tpc {
    margin-right: 14vw;
  }
  .mr-15vw-tpc {
    margin-right: 15vw;
  }

  .mr-s-tpc {
    margin-right: var(--space-s);
  }
  .mr-m-tpc {
    margin-right: var(--space-m);
  }
  .mr-l-tpc {
    margin-right: var(--space-l);
  }

  .mr-auto-tpc {
    margin-right: auto;
  }
}
@media screen and (min-width: 1024px) {
  .mr-5-pc {
    margin-right: 5px;
  }
  .mr-8-pc {
    margin-right: 8px;
  }
  .mr-10-pc {
    margin-right: 10px;
  }
  .mr-15-pc {
    margin-right: 15px;
  }
  .mr-20-pc {
    margin-right: 20px;
  }
  .mr-25-pc {
    margin-right: 25px;
  }
  .mr-30-pc {
    margin-right: 30px;
  }
  .mr-35-pc {
    margin-right: 35px;
  }
  .mr-40-pc {
    margin-right: 40px;
  }
  .mr-45-pc {
    margin-right: 45px;
  }
  .mr-50-pc {
    margin-right: 50px;
  }
  .mr-60-pc {
    margin-right: 60px;
  }
  .mr-70-pc {
    margin-right: 70px;
  }
  .mr-80-pc {
    margin-right: 80px;
  }
  .mr-90-pc {
    margin-right: 90px;
  }
  .mr-100-pc {
    margin-right: 100px;
  }
  .mr-110-pc {
    margin-right: 110px;
  }
  .mr-120-pc {
    margin-right: 120px;
  }
  .mr-130-pc {
    margin-right: 130px;
  }
  .mr-140-pc {
    margin-right: 140px;
  }
  .mr-150-pc {
    margin-right: 150px;
  }
  .mr-160-pc {
    margin-right: 160px;
  }
  .mr-170-pc {
    margin-right: 170px;
  }
  .mr-180-pc {
    margin-right: 180px;
  }
  .mr-190-pc {
    margin-right: 190px;
  }
  .mr-200-pc {
    margin-right: 200px;
  }

  .mr-1vw-pc {
    margin-right: 1vw;
  }
  .mr-2vw-pc {
    margin-right: 2vw;
  }
  .mr-3vw-pc {
    margin-right: 3vw;
  }
  .mr-4vw-pc {
    margin-right: 4vw;
  }
  .mr-5vw-pc {
    margin-right: 5vw;
  }
  .mr-6vw-pc {
    margin-right: 6vw;
  }
  .mr-7vw-pc {
    margin-right: 7vw;
  }
  .mr-8vw-pc {
    margin-right: 8vw;
  }
  .mr-9vw-pc {
    margin-right: 9vw;
  }
  .mr-10vw-pc {
    margin-right: 10vw;
  }
  .mr-11vw-pc {
    margin-right: 11vw;
  }
  .mr-12vw-pc {
    margin-right: 12vw;
  }
  .mr-13vw-pc {
    margin-right: 13vw;
  }
  .mr-14vw-pc {
    margin-right: 14vw;
  }
  .mr-15vw-pc {
    margin-right: 15vw;
  }

  .mr-s-pc {
    margin-right: var(--space-s);
  }
  .mr-m-pc {
    margin-right: var(--space-m);
  }
  .mr-l-pc {
    margin-right: var(--space-l);
  }

  .mr-auto-pc {
    margin-right: auto;
  }
}

/*margin bottom*/
.mb-5 {
  margin-bottom: calc(5px * var(--space-ratio));
}
.mb-8 {
  margin-bottom: calc(8px * var(--space-ratio));
}
.mb-10 {
  margin-bottom: calc(10px * var(--space-ratio));
}
.mb-15 {
  margin-bottom: calc(15px * var(--space-ratio));
}
.mb-20 {
  margin-bottom: calc(20px * var(--space-ratio));
}
.mb-25 {
  margin-bottom: calc(25px * var(--space-ratio));
}
.mb-30 {
  margin-bottom: calc(30px * var(--space-ratio));
}
.mb-35 {
  margin-bottom: calc(35px * var(--space-ratio));
}
.mb-40 {
  margin-bottom: calc(40px * var(--space-ratio));
}
.mb-45 {
  margin-bottom: calc(45px * var(--space-ratio));
}
.mb-50 {
  margin-bottom: calc(50px * var(--space-ratio));
}
.mb-60 {
  margin-bottom: calc(60px * var(--space-ratio));
}
.mb-70 {
  margin-bottom: calc(70px * var(--space-ratio));
}
.mb-80 {
  margin-bottom: calc(80px * var(--space-ratio));
}
.mb-90 {
  margin-bottom: calc(90px * var(--space-ratio));
}
.mb-100 {
  margin-bottom: calc(100px * var(--space-ratio));
}
.mb-110 {
  margin-bottom: calc(110px * var(--space-ratio));
}
.mb-120 {
  margin-bottom: calc(120px * var(--space-ratio));
}
.mb-130 {
  margin-bottom: calc(130px * var(--space-ratio));
}
.mb-140 {
  margin-bottom: calc(140px * var(--space-ratio));
}
.mb-150 {
  margin-bottom: calc(150px * var(--space-ratio));
}
.mb-160 {
  margin-bottom: calc(160px * var(--space-ratio));
}
.mb-170 {
  margin-bottom: calc(170px * var(--space-ratio));
}
.mb-180 {
  margin-bottom: calc(180px * var(--space-ratio));
}
.mb-190 {
  margin-bottom: calc(190px * var(--space-ratio));
}
.mb-200 {
  margin-bottom: calc(200px * var(--space-ratio));
}

.mb-1vw {
  margin-bottom: 1vw;
}
.mb-2vw {
  margin-bottom: 2vw;
}
.mb-3vw {
  margin-bottom: 3vw;
}
.mb-4vw {
  margin-bottom: 4vw;
}
.mb-5vw {
  margin-bottom: 5vw;
}
.mb-6vw {
  margin-bottom: 6vw;
}
.mb-7vw {
  margin-bottom: 7vw;
}
.mb-8vw {
  margin-bottom: 8vw;
}
.mb-9vw {
  margin-bottom: 9vw;
}
.mb-10vw {
  margin-bottom: 10vw;
}
.mb-11vw {
  margin-bottom: 11vw;
}
.mb-12vw {
  margin-bottom: 12vw;
}
.mb-13vw {
  margin-bottom: 13vw;
}
.mb-14vw {
  margin-bottom: 14vw;
}
.mb-15vw {
  margin-bottom: 15vw;
}

@media screen and (max-width: 1023px) {
  .mb-5-sp {
    margin-bottom: 5px;
  }
  .mb-8-sp {
    margin-bottom: 8px;
  }
  .mb-10-sp {
    margin-bottom: 10px;
  }
  .mb-15-sp {
    margin-bottom: 15px;
  }
  .mb-20-sp {
    margin-bottom: 20px;
  }
  .mb-25-sp {
    margin-bottom: 25px;
  }
  .mb-30-sp {
    margin-bottom: 30px;
  }
  .mb-35-sp {
    margin-bottom: 35px;
  }
  .mb-40-sp {
    margin-bottom: 40px;
  }
  .mb-45-sp {
    margin-bottom: 45px;
  }
  .mb-50-sp {
    margin-bottom: 50px;
  }
  .mb-60-sp {
    margin-bottom: 60px;
  }
  .mb-70-sp {
    margin-bottom: 70px;
  }
  .mb-80-sp {
    margin-bottom: 80px;
  }
  .mb-90-sp {
    margin-bottom: 90px;
  }
  .mb-100-sp {
    margin-bottom: 100px;
  }
  .mb-110-sp {
    margin-bottom: 110px;
  }
  .mb-120-sp {
    margin-bottom: 120px;
  }
  .mb-130-sp {
    margin-bottom: 130px;
  }
  .mb-140-sp {
    margin-bottom: 140px;
  }
  .mb-150-sp {
    margin-bottom: 150px;
  }
  .mb-160-sp {
    margin-bottom: 160px;
  }
  .mb-170-sp {
    margin-bottom: 170px;
  }
  .mb-180-sp {
    margin-bottom: 180px;
  }
  .mb-190-sp {
    margin-bottom: 190px;
  }
  .mb-200-sp {
    margin-bottom: 200px;
  }

  .mb-1vw-sp {
    margin-bottom: 1vw;
  }
  .mb-2vw-sp {
    margin-bottom: 2vw;
  }
  .mb-3vw-sp {
    margin-bottom: 3vw;
  }
  .mb-4vw-sp {
    margin-bottom: 4vw;
  }
  .mb-5vw-sp {
    margin-bottom: 5vw;
  }
  .mb-6vw-sp {
    margin-bottom: 6vw;
  }
  .mb-7vw-sp {
    margin-bottom: 7vw;
  }
  .mb-8vw-sp {
    margin-bottom: 8vw;
  }
  .mb-9vw-sp {
    margin-bottom: 9vw;
  }
  .mb-10vw-sp {
    margin-bottom: 10vw;
  }
  .mb-11vw-sp {
    margin-bottom: 11vw;
  }
  .mb-12vw-sp {
    margin-bottom: 12vw;
  }
  .mb-13vw-sp {
    margin-bottom: 13vw;
  }
  .mb-14vw-sp {
    margin-bottom: 14vw;
  }
  .mb-15vw-sp {
    margin-bottom: 15vw;
  }
}
@media screen and (min-width: 768px) {
  .mb-5-tpc {
    margin-bottom: 5px;
  }
  .mb-8-tpc {
    margin-bottom: 8px;
  }
  .mb-10-tpc {
    margin-bottom: 10px;
  }
  .mb-15-tpc {
    margin-bottom: 15px;
  }
  .mb-20-tpc {
    margin-bottom: 20px;
  }
  .mb-25-tpc {
    margin-bottom: 25px;
  }
  .mb-30-tpc {
    margin-bottom: 30px;
  }
  .mb-35-tpc {
    margin-bottom: 35px;
  }
  .mb-40-tpc {
    margin-bottom: 40px;
  }
  .mb-45-tpc {
    margin-bottom: 45px;
  }
  .mb-50-tpc {
    margin-bottom: 50px;
  }
  .mb-60-tpc {
    margin-bottom: 60px;
  }
  .mb-70-tpc {
    margin-bottom: 70px;
  }
  .mb-80-tpc {
    margin-bottom: 80px;
  }
  .mb-90-tpc {
    margin-bottom: 90px;
  }
  .mb-100-tpc {
    margin-bottom: 100px;
  }
  .mb-110-tpc {
    margin-bottom: 110px;
  }
  .mb-120-tpc {
    margin-bottom: 120px;
  }
  .mb-130-tpc {
    margin-bottom: 130px;
  }
  .mb-140-tpc {
    margin-bottom: 140px;
  }
  .mb-150-tpc {
    margin-bottom: 150px;
  }
  .mb-160-tpc {
    margin-bottom: 160px;
  }
  .mb-170-tpc {
    margin-bottom: 170px;
  }
  .mb-180-tpc {
    margin-bottom: 180px;
  }
  .mb-190-tpc {
    margin-bottom: 190px;
  }
  .mb-200-tpc {
    margin-bottom: 200px;
  }

  .mb-1vw-tpc {
    margin-bottom: 1vw;
  }
  .mb-2vw-tpc {
    margin-bottom: 2vw;
  }
  .mb-3vw-tpc {
    margin-bottom: 3vw;
  }
  .mb-4vw-tpc {
    margin-bottom: 4vw;
  }
  .mb-5vw-tpc {
    margin-bottom: 5vw;
  }
  .mb-6vw-tpc {
    margin-bottom: 6vw;
  }
  .mb-7vw-tpc {
    margin-bottom: 7vw;
  }
  .mb-8vw-tpc {
    margin-bottom: 8vw;
  }
  .mb-9vw-tpc {
    margin-bottom: 9vw;
  }
  .mb-10vw-tpc {
    margin-bottom: 10vw;
  }
  .mb-11vw-tpc {
    margin-bottom: 11vw;
  }
  .mb-12vw-tpc {
    margin-bottom: 12vw;
  }
  .mb-13vw-tpc {
    margin-bottom: 13vw;
  }
  .mb-14vw-tpc {
    margin-bottom: 14vw;
  }
  .mb-15vw-tpc {
    margin-bottom: 15vw;
  }
}
@media screen and (min-width: 1024px) {
  .mb-5-pc {
    margin-bottom: 5px;
  }
  .mb-8-pc {
    margin-bottom: 8px;
  }
  .mb-10-pc {
    margin-bottom: 10px;
  }
  .mb-15-pc {
    margin-bottom: 15px;
  }
  .mb-20-pc {
    margin-bottom: 20px;
  }
  .mb-25-pc {
    margin-bottom: 25px;
  }
  .mb-30-pc {
    margin-bottom: 30px;
  }
  .mb-35-pc {
    margin-bottom: 35px;
  }
  .mb-40-pc {
    margin-bottom: 40px;
  }
  .mb-45-pc {
    margin-bottom: 45px;
  }
  .mb-50-pc {
    margin-bottom: 50px;
  }
  .mb-60-pc {
    margin-bottom: 60px;
  }
  .mb-70-pc {
    margin-bottom: 70px;
  }
  .mb-80-pc {
    margin-bottom: 80px;
  }
  .mb-90-pc {
    margin-bottom: 90px;
  }
  .mb-100-pc {
    margin-bottom: 100px;
  }
  .mb-110-pc {
    margin-bottom: 110px;
  }
  .mb-120-pc {
    margin-bottom: 120px;
  }
  .mb-130-pc {
    margin-bottom: 130px;
  }
  .mb-140-pc {
    margin-bottom: 140px;
  }
  .mb-150-pc {
    margin-bottom: 150px;
  }
  .mb-160-pc {
    margin-bottom: 160px;
  }
  .mb-170-pc {
    margin-bottom: 170px;
  }
  .mb-180-pc {
    margin-bottom: 180px;
  }
  .mb-190-pc {
    margin-bottom: 190px;
  }
  .mb-200-pc {
    margin-bottom: 200px;
  }

  .mb-1vw-pc {
    margin-bottom: 1vw;
  }
  .mb-2vw-pc {
    margin-bottom: 2vw;
  }
  .mb-3vw-pc {
    margin-bottom: 3vw;
  }
  .mb-4vw-pc {
    margin-bottom: 4vw;
  }
  .mb-5vw-pc {
    margin-bottom: 5vw;
  }
  .mb-6vw-pc {
    margin-bottom: 6vw;
  }
  .mb-7vw-pc {
    margin-bottom: 7vw;
  }
  .mb-8vw-pc {
    margin-bottom: 8vw;
  }
  .mb-9vw-pc {
    margin-bottom: 9vw;
  }
  .mb-10vw-pc {
    margin-bottom: 10vw;
  }
  .mb-11vw-pc {
    margin-bottom: 11vw;
  }
  .mb-12vw-pc {
    margin-bottom: 12vw;
  }
  .mb-13vw-pc {
    margin-bottom: 13vw;
  }
  .mb-14vw-pc {
    margin-bottom: 14vw;
  }
  .mb-15vw-pc {
    margin-bottom: 15vw;
  }
}
/*margin left*/
.ml-5 {
  margin-left: calc(5px * var(--space-ratio));
}
.ml-8 {
  margin-left: calc(8px * var(--space-ratio));
}
.ml-10 {
  margin-left: calc(10px * var(--space-ratio));
}
.ml-15 {
  margin-left: calc(15px * var(--space-ratio));
}
.ml-20 {
  margin-left: calc(20px * var(--space-ratio));
}
.ml-25 {
  margin-left: calc(25px * var(--space-ratio));
}
.ml-30 {
  margin-left: calc(30px * var(--space-ratio));
}
.ml-35 {
  margin-left: calc(35px * var(--space-ratio));
}
.ml-40 {
  margin-left: calc(40px * var(--space-ratio));
}
.ml-45 {
  margin-left: calc(45px * var(--space-ratio));
}
.ml-50 {
  margin-left: calc(50px * var(--space-ratio));
}
.ml-60 {
  margin-left: calc(60px * var(--space-ratio));
}
.ml-70 {
  margin-left: calc(70px * var(--space-ratio));
}
.ml-80 {
  margin-left: calc(80px * var(--space-ratio));
}
.ml-90 {
  margin-left: calc(90px * var(--space-ratio));
}
.ml-100 {
  margin-left: calc(100px * var(--space-ratio));
}
.ml-110 {
  margin-left: calc(110px * var(--space-ratio));
}
.ml-120 {
  margin-left: calc(120px * var(--space-ratio));
}
.ml-130 {
  margin-left: calc(130px * var(--space-ratio));
}
.ml-140 {
  margin-left: calc(140px * var(--space-ratio));
}
.ml-150 {
  margin-left: calc(150px * var(--space-ratio));
}
.ml-160 {
  margin-left: calc(160px * var(--space-ratio));
}
.ml-170 {
  margin-left: calc(170px * var(--space-ratio));
}
.ml-180 {
  margin-left: calc(180px * var(--space-ratio));
}
.ml-190 {
  margin-left: calc(190px * var(--space-ratio));
}
.ml-200 {
  margin-left: calc(200px * var(--space-ratio));
}

.ml-1vw {
  margin-left: 1vw;
}
.ml-2vw {
  margin-left: 2vw;
}
.ml-3vw {
  margin-left: 3vw;
}
.ml-4vw {
  margin-left: 4vw;
}
.ml-5vw {
  margin-left: 5vw;
}
.ml-6vw {
  margin-left: 6vw;
}
.ml-7vw {
  margin-left: 7vw;
}
.ml-8vw {
  margin-left: 8vw;
}
.ml-9vw {
  margin-left: 9vw;
}
.ml-10vw {
  margin-left: 10vw;
}
.ml-11vw {
  margin-left: 11vw;
}
.ml-12vw {
  margin-left: 12vw;
}
.ml-13vw {
  margin-left: 13vw;
}
.ml-14vw {
  margin-left: 14vw;
}
.ml-15vw {
  margin-left: 15vw;
}

.ml-s {
  margin-left: var(--space-s);
}
.ml-m {
  margin-left: var(--space-m);
}
.ml-l {
  margin-left: var(--space-l);
}

.ml-auto {
  margin-left: auto;
}

@media screen and (max-width: 1023px) {
  .ml-5-sp {
    margin-left: 5px;
  }
  .ml-8-sp {
    margin-left: 8px;
  }
  .ml-10-sp {
    margin-left: 10px;
  }
  .ml-15-sp {
    margin-left: 15px;
  }
  .ml-20-sp {
    margin-left: 20px;
  }
  .ml-25-sp {
    margin-left: 25px;
  }
  .ml-30-sp {
    margin-left: 30px;
  }
  .ml-35-sp {
    margin-left: 35px;
  }
  .ml-40-sp {
    margin-left: 40px;
  }
  .ml-45-sp {
    margin-left: 45px;
  }
  .ml-50-sp {
    margin-left: 50px;
  }
  .ml-60-sp {
    margin-left: 60px;
  }
  .ml-70-sp {
    margin-left: 70px;
  }
  .ml-80-sp {
    margin-left: 80px;
  }
  .ml-90-sp {
    margin-left: 90px;
  }
  .ml-100-sp {
    margin-left: 100px;
  }
  .ml-110-sp {
    margin-left: 110px;
  }
  .ml-120-sp {
    margin-left: 120px;
  }
  .ml-130-sp {
    margin-left: 130px;
  }
  .ml-140-sp {
    margin-left: 140px;
  }
  .ml-150-sp {
    margin-left: 150px;
  }
  .ml-160-sp {
    margin-left: 160px;
  }
  .ml-170-sp {
    margin-left: 170px;
  }
  .ml-180-sp {
    margin-left: 180px;
  }
  .ml-190-sp {
    margin-left: 190px;
  }
  .ml-200-sp {
    margin-left: 200px;
  }

  .ml-1vw-sp {
    margin-left: 1vw;
  }
  .ml-2vw-sp {
    margin-left: 2vw;
  }
  .ml-3vw-sp {
    margin-left: 3vw;
  }
  .ml-4vw-sp {
    margin-left: 4vw;
  }
  .ml-5vw-sp {
    margin-left: 5vw;
  }
  .ml-6vw-sp {
    margin-left: 6vw;
  }
  .ml-7vw-sp {
    margin-left: 7vw;
  }
  .ml-8vw-sp {
    margin-left: 8vw;
  }
  .ml-9vw-sp {
    margin-left: 9vw;
  }
  .ml-10vw-sp {
    margin-left: 10vw;
  }
  .ml-11vw-sp {
    margin-left: 11vw;
  }
  .ml-12vw-sp {
    margin-left: 12vw;
  }
  .ml-13vw-sp {
    margin-left: 13vw;
  }
  .ml-14vw-sp {
    margin-left: 14vw;
  }
  .ml-15vw-sp {
    margin-left: 15vw;
  }

  .ml-s-sp {
    margin-left: var(--space-s);
  }
  .ml-m-sp {
    margin-left: var(--space-m);
  }
  .ml-l-sp {
    margin-left: var(--space-l);
  }

  .ml-auto-sp {
    margin-left: auto;
  }
}
@media screen and (min-width: 768px) {
  .ml-5-tpc {
    margin-left: 5px;
  }
  .ml-8-tpc {
    margin-left: 8px;
  }
  .ml-10-tpc {
    margin-left: 10px;
  }
  .ml-15-tpc {
    margin-left: 15px;
  }
  .ml-20-tpc {
    margin-left: 20px;
  }
  .ml-25-tpc {
    margin-left: 25px;
  }
  .ml-30-tpc {
    margin-left: 30px;
  }
  .ml-35-tpc {
    margin-left: 35px;
  }
  .ml-40-tpc {
    margin-left: 40px;
  }
  .ml-45-tpc {
    margin-left: 45px;
  }
  .ml-50-tpc {
    margin-left: 50px;
  }
  .ml-60-tpc {
    margin-left: 60px;
  }
  .ml-70-tpc {
    margin-left: 70px;
  }
  .ml-80-tpc {
    margin-left: 80px;
  }
  .ml-90-tpc {
    margin-left: 90px;
  }
  .ml-100-tpc {
    margin-left: 100px;
  }
  .ml-110-tpc {
    margin-left: 110px;
  }
  .ml-120-tpc {
    margin-left: 120px;
  }
  .ml-130-tpc {
    margin-left: 130px;
  }
  .ml-140-tpc {
    margin-left: 140px;
  }
  .ml-150-tpc {
    margin-left: 150px;
  }
  .ml-160-tpc {
    margin-left: 160px;
  }
  .ml-170-tpc {
    margin-left: 170px;
  }
  .ml-180-tpc {
    margin-left: 180px;
  }
  .ml-190-tpc {
    margin-left: 190px;
  }
  .ml-200-tpc {
    margin-left: 200px;
  }

  .ml-1vw-tpc {
    margin-left: 1vw;
  }
  .ml-2vw-tpc {
    margin-left: 2vw;
  }
  .ml-3vw-tpc {
    margin-left: 3vw;
  }
  .ml-4vw-tpc {
    margin-left: 4vw;
  }
  .ml-5vw-tpc {
    margin-left: 5vw;
  }
  .ml-6vw-tpc {
    margin-left: 6vw;
  }
  .ml-7vw-tpc {
    margin-left: 7vw;
  }
  .ml-8vw-tpc {
    margin-left: 8vw;
  }
  .ml-9vw-tpc {
    margin-left: 9vw;
  }
  .ml-10vw-tpc {
    margin-left: 10vw;
  }
  .ml-11vw-tpc {
    margin-left: 11vw;
  }
  .ml-12vw-tpc {
    margin-left: 12vw;
  }
  .ml-13vw-tpc {
    margin-left: 13vw;
  }
  .ml-14vw-tpc {
    margin-left: 14vw;
  }
  .ml-15vw-tpc {
    margin-left: 15vw;
  }

  .ml-s-tpc {
    margin-left: var(--space-s);
  }
  .ml-m-tpc {
    margin-left: var(--space-m);
  }
  .ml-l-tpc {
    margin-left: var(--space-l);
  }

  .ml-auto-tpc {
    margin-left: auto;
  }
}
@media screen and (min-width: 1024px) {
  .ml-5-pc {
    margin-left: 5px;
  }
  .ml-8-pc {
    margin-left: 8px;
  }
  .ml-10-pc {
    margin-left: 10px;
  }
  .ml-15-pc {
    margin-left: 15px;
  }
  .ml-20-pc {
    margin-left: 20px;
  }
  .ml-25-pc {
    margin-left: 25px;
  }
  .ml-30-pc {
    margin-left: 30px;
  }
  .ml-35-pc {
    margin-left: 35px;
  }
  .ml-40-pc {
    margin-left: 40px;
  }
  .ml-45-pc {
    margin-left: 45px;
  }
  .ml-50-pc {
    margin-left: 50px;
  }
  .ml-60-pc {
    margin-left: 60px;
  }
  .ml-70-pc {
    margin-left: 70px;
  }
  .ml-80-pc {
    margin-left: 80px;
  }
  .ml-90-pc {
    margin-left: 90px;
  }
  .ml-100-pc {
    margin-left: 100px;
  }
  .ml-110-pc {
    margin-left: 110px;
  }
  .ml-120-pc {
    margin-left: 120px;
  }
  .ml-130-pc {
    margin-left: 130px;
  }
  .ml-140-pc {
    margin-left: 140px;
  }
  .ml-150-pc {
    margin-left: 150px;
  }
  .ml-160-pc {
    margin-left: 160px;
  }
  .ml-170-pc {
    margin-left: 170px;
  }
  .ml-180-pc {
    margin-left: 180px;
  }
  .ml-190-pc {
    margin-left: 190px;
  }
  .ml-200-pc {
    margin-left: 200px;
  }

  .ml-1vw-pc {
    margin-left: 1vw;
  }
  .ml-2vw-pc {
    margin-left: 2vw;
  }
  .ml-3vw-pc {
    margin-left: 3vw;
  }
  .ml-4vw-pc {
    margin-left: 4vw;
  }
  .ml-5vw-pc {
    margin-left: 5vw;
  }
  .ml-6vw-pc {
    margin-left: 6vw;
  }
  .ml-7vw-pc {
    margin-left: 7vw;
  }
  .ml-8vw-pc {
    margin-left: 8vw;
  }
  .ml-9vw-pc {
    margin-left: 9vw;
  }
  .ml-10vw-pc {
    margin-left: 10vw;
  }
  .ml-11vw-pc {
    margin-left: 11vw;
  }
  .ml-12vw-pc {
    margin-left: 12vw;
  }
  .ml-13vw-pc {
    margin-left: 13vw;
  }
  .ml-14vw-pc {
    margin-left: 14vw;
  }
  .ml-15vw-pc {
    margin-left: 15vw;
  }

  .ml-s-pc {
    margin-left: var(--space-s);
  }
  .ml-m-pc {
    margin-left: var(--space-m);
  }
  .ml-l-pc {
    margin-left: var(--space-l);
  }

  .ml-auto-pc {
    margin-left: auto;
  }
}

/* FLEX BOX

   <使用用途>
   - 異なるサイズの要素を柔軟に配置する。
   - 要素の大きさや数が変化しても均等に配置する。

-------------------------------------------------------------- */
.f-container {
  display: flex;
}
.fi-container {
  display: inline-flex; /* 複数のリンクリストなどをインラインで配置 */
}

.f-item {
  flex-grow: 1;
  flex-basis: 0; /* 残りの空間を均等に分ける */
}
.fs {
  flex-shrink: 0; /*縮小させない*/
}

.fw {
  flex-wrap: wrap; /* アイテムがコンテナ幅を超えたら折り返す */
}
.f-row-reverse {
  flex-direction: row-reverse; /* アイテムの順番を逆にする */
}
.f-column {
  flex-direction: column; /* アイテム縦並びにする */
}

@media screen and (max-width: 1023px) {
  .f-container-sp {
    display: flex;
  }
  .fi-container-sp {
    display: inline-flex;
  }

  .f-item-sp {
    flex-grow: 1;
    flex-basis: 0;
  }
  .fs-sp {
    flex-shrink: 0;
  }

  .fw-sp {
    flex-wrap: wrap;
  }
  .f-row-reverse-sp {
    flex-direction: row-reverse;
  }
  .f-column-sp {
    flex-direction: column;
  }
}
@media screen and (min-width: 768px) {
  .f-container-tpc {
    display: flex;
  }
  .fi-container-tpc {
    display: inline-flex;
  }

  .f-item-tpc {
    flex-grow: 1;
    flex-basis: 0;
  }
  .fs-tpc {
    flex-shrink: 0;
  }

  .fw-tpc {
    flex-wrap: wrap;
  }
  .f-row-reverse-tpc {
    flex-direction: row-reverse;
  }
  .f-column-tpc {
    flex-direction: column;
  }
}
@media screen and (min-width: 1024px) {
  .f-container-pc {
    display: flex;
  }
  .fi-container-pc {
    display: inline-flex;
  }

  .f-item-pc {
    flex-grow: 1;
    flex-basis: 0;
  }
  .fs-pc {
    flex-shrink: 0;
  }

  .fw-pc {
    flex-wrap: wrap;
  }
  .f-row-reverse-pc {
    flex-direction: row-reverse;
  }
  .f-column-pc {
    flex-direction: column;
  }
}

/* CSS GRID

   <使用用途>
   - カード型レイアウト
   - 同じレイアウトが繰り返される

-------------------------------------------------------------- */
.g-container {
  display: grid;
  grid-auto-rows: min-content;
}

.g-container-1 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(1, 1fr);
}
.g-container-2 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(2, 1fr);
}
.g-container-3 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(3, 1fr);
}
.g-container-4 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(4, 1fr);
}
.g-container-5 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(5, 1fr);
}
.g-container-6 {
  display: grid;
  grid-auto-rows: min-content;
  grid-template-columns: repeat(6, 1fr);
}

@media screen and (max-width: 1023px) {
  .g-container-sp {
    display: grid;
    grid-auto-rows: min-content;
  }

  .g-container-1-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(1, 1fr);
  }
  .g-container-2-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(2, 1fr);
  }
  .g-container-3-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(3, 1fr);
  }
  .g-container-4-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(4, 1fr);
  }
  .g-container-5-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(5, 1fr);
  }
  .g-container-6-sp {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(6, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .g-container-tpc {
    display: grid;
    grid-auto-rows: min-content;
  }

  .g-container-1-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(1, 1fr);
  }
  .g-container-2-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(2, 1fr);
  }
  .g-container-3-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(3, 1fr);
  }
  .g-container-4-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(4, 1fr);
  }
  .g-container-5-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(5, 1fr);
  }
  .g-container-6-tpc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(6, 1fr);
  }
}
@media screen and (min-width: 1024px) {
  .g-container-pc {
    display: grid;
    grid-auto-rows: min-content;
  }

  .g-container-1-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(1, 1fr);
  }
  .g-container-2-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(2, 1fr);
  }
  .g-container-3-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(3, 1fr);
  }
  .g-container-4-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(4, 1fr);
  }
  .g-container-5-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(5, 1fr);
  }
  .g-container-6-pc {
    display: grid;
    grid-auto-rows: min-content;
    grid-template-columns: repeat(6, 1fr);
  }
}

/* FLEX BOX & CSS GRIDで使用可能な配置プロパティ
-------------------------------------------------------------- */

.a-c {
  align-items: center; /* アイテムを上下中央に配置 */
}
.a-start {
  align-items: start; /* アイテムをコンテナの上部に配置 */
}
.a-end {
  align-items: end; /* アイテムをコンテナの下部に配置 */
}

.a-stretch {
  align-items: stretch; /* アイテムの高さをコンテナに合わせて伸ばす */
}

@media screen and (max-width: 1023px) {
  .a-c-sp {
    align-items: center;
  }
  .a-start-sp {
    align-items: start;
  }
  .a-end-sp {
    align-items: end;
  }

  .a-stretch-sp {
    align-items: stretch;
  }
}
@media screen and (min-width: 768px) {
  .a-c-tpc {
    align-items: center;
  }
  .a-start-tpc {
    align-items: start;
  }
  .a-end-tpc {
    align-items: end;
  }

  .a-stretch-tpc {
    align-items: stretch;
  }
}
@media screen and (min-width: 1024px) {
  .a-c-pc {
    align-items: center;
  }
  .a-start-pc {
    align-items: start;
  }
  .a-end-pc {
    align-items: end;
  }

  .a-stretch-pc {
    align-items: stretch;
  }
}

.j-c {
  justify-content: center; /* アイテムを水平中央に配置 */
}
.j-start {
  justify-content: start; /* アイテムをコンテナの左(先頭)に配置 */
}
.j-end {
  justify-content: end; /* アイテムをコンテナの右(末尾)に配置 */
}
.j-sb {
  justify-content: space-between; /* アイテム間に等間隔をあけて配置 */
}
.jc-around {
  justify-content: space-around;
}

@media screen and (max-width: 1023px) {
  .j-c-sp {
    justify-content: center;
  }
  .j-start-sp {
    justify-content: start;
  }
  .j-end-sp {
    justify-content: end;
  }
  .j-sb-sp {
    justify-content: space-between;
  }
}
@media screen and (min-width: 768px) {
  .j-c-tpc {
    justify-content: center;
  }
  .j-start-tpc {
    justify-content: start;
  }
  .j-end-tpc {
    justify-content: end;
  }
  .j-sb-tpc {
    justify-content: space-between;
  }
}
@media screen and (min-width: 1024px) {
  .j-c-pc {
    justify-content: center;
  }
  .j-start-pc {
    justify-content: start;
  }
  .j-end-pc {
    justify-content: end;
  }
  .j-sb-pc {
    justify-content: space-between;
  }
}

/* FLEX BOX & CSS GRIDで使用可能なギャップ(間隔)
-------------------------------------------------------------- */
.g-5 {
  gap: calc(5px * var(--space-ratio));
}
.g-8 {
  gap: calc(8px * var(--space-ratio));
}
.g-10 {
  gap: calc(10px * var(--space-ratio));
}
.g-15 {
  gap: calc(15px * var(--space-ratio));
}
.g-20 {
  gap: calc(20px * var(--space-ratio));
}
.g-25 {
  gap: calc(25px * var(--space-ratio));
}
.g-30 {
  gap: calc(30px * var(--space-ratio));
}
.g-35 {
  gap: calc(35px * var(--space-ratio));
}
.g-40 {
  gap: calc(40px * var(--space-ratio));
}
.g-50 {
  gap: calc(50px * var(--space-ratio));
}
.g-60 {
  gap: calc(60px * var(--space-ratio));
}
.g-70 {
  gap: calc(70px * var(--space-ratio));
}
.g-80 {
  gap: calc(80px * var(--space-ratio));
}
.g-90 {
  gap: calc(90px * var(--space-ratio));
}
.g-100 {
  gap: calc(100px * var(--space-ratio));
}
.g-110 {
  gap: calc(110px * var(--space-ratio));
}
.g-120 {
  gap: calc(120px * var(--space-ratio));
}
.g-130 {
  gap: calc(130px * var(--space-ratio));
}
.g-140 {
  gap: calc(140px * var(--space-ratio));
}
.g-150 {
  gap: calc(150px * var(--space-ratio));
}
.g-160 {
  gap: calc(160px * var(--space-ratio));
}
.g-170 {
  gap: calc(170px * var(--space-ratio));
}
.g-180 {
  gap: calc(180px * var(--space-ratio));
}
.g-190 {
  gap: calc(190px * var(--space-ratio));
}
.g-200 {
  gap: calc(200px * var(--space-ratio));
}

.g-c-5 {
  column-gap: calc(5px * var(--space-ratio));
}
.g-c-8 {
  column-gap: calc(8px * var(--space-ratio));
}
.g-c-10 {
  column-gap: calc(10px * var(--space-ratio));
}
.g-c-15 {
  column-gap: calc(15px * var(--space-ratio));
}
.g-c-20 {
  column-gap: calc(20px * var(--space-ratio));
}
.g-c-25 {
  column-gap: calc(25px * var(--space-ratio));
}
.g-c-30 {
  column-gap: calc(30px * var(--space-ratio));
}
.g-c-35 {
  column-gap: calc(35px * var(--space-ratio));
}
.g-c-40 {
  column-gap: calc(40px * var(--space-ratio));
}
.g-c-50 {
  column-gap: calc(50px * var(--space-ratio));
}
.g-c-60 {
  column-gap: calc(60px * var(--space-ratio));
}
.g-c-70 {
  column-gap: calc(70px * var(--space-ratio));
}
.g-c-80 {
  column-gap: calc(80px * var(--space-ratio));
}
.g-c-90 {
  column-gap: calc(90px * var(--space-ratio));
}
.g-c-100 {
  column-gap: calc(100px * var(--space-ratio));
}
.g-c-110 {
  column-gap: calc(110px * var(--space-ratio));
}
.g-c-120 {
  column-gap: calc(120px * var(--space-ratio));
}
.g-c-130 {
  column-gap: calc(130px * var(--space-ratio));
}
.g-c-140 {
  column-gap: calc(140px * var(--space-ratio));
}
.g-c-150 {
  column-gap: calc(150px * var(--space-ratio));
}
.g-c-160 {
  column-gap: calc(160px * var(--space-ratio));
}
.g-c-170 {
  column-gap: calc(170px * var(--space-ratio));
}
.g-c-180 {
  column-gap: calc(180px * var(--space-ratio));
}
.g-c-190 {
  column-gap: calc(190px * var(--space-ratio));
}
.g-c-200 {
  column-gap: calc(200px * var(--space-ratio));
}

.g-r-5 {
  row-gap: calc(5px * var(--space-ratio));
}
.g-r-8 {
  row-gap: calc(8px * var(--space-ratio));
}
.g-r-10 {
  row-gap: calc(10px * var(--space-ratio));
}
.g-r-15 {
  row-gap: calc(15px * var(--space-ratio));
}
.g-r-20 {
  row-gap: calc(20px * var(--space-ratio));
}
.g-r-25 {
  row-gap: calc(25px * var(--space-ratio));
}
.g-r-30 {
  row-gap: calc(30px * var(--space-ratio));
}
.g-r-35 {
  row-gap: calc(35px * var(--space-ratio));
}
.g-r-40 {
  row-gap: calc(40px * var(--space-ratio));
}
.g-r-50 {
  row-gap: calc(50px * var(--space-ratio));
}
.g-r-60 {
  row-gap: calc(60px * var(--space-ratio));
}
.g-r-70 {
  row-gap: calc(70px * var(--space-ratio));
}
.g-r-80 {
  row-gap: calc(80px * var(--space-ratio));
}
.g-r-90 {
  row-gap: calc(90px * var(--space-ratio));
}
.g-r-100 {
  row-gap: calc(100px * var(--space-ratio));
}
.g-r-110 {
  row-gap: calc(110px * var(--space-ratio));
}
.g-r-120 {
  row-gap: calc(120px * var(--space-ratio));
}
.g-r-130 {
  row-gap: calc(130px * var(--space-ratio));
}
.g-r-140 {
  row-gap: calc(140px * var(--space-ratio));
}
.g-r-150 {
  row-gap: calc(150px * var(--space-ratio));
}
.g-r-160 {
  row-gap: calc(160px * var(--space-ratio));
}
.g-r-170 {
  row-gap: calc(170px * var(--space-ratio));
}
.g-r-180 {
  row-gap: calc(180px * var(--space-ratio));
}
.g-r-190 {
  row-gap: calc(190px * var(--space-ratio));
}
.g-r-200 {
  row-gap: calc(200px * var(--space-ratio));
}

@media screen and (max-width: 1023px) {
  .g-5-sp {
    gap: calc(5px * var(--space-ratio));
  }
  .g-8-sp {
    gap: calc(8px * var(--space-ratio));
  }
  .g-10-sp {
    gap: calc(10px * var(--space-ratio));
  }
  .g-15-sp {
    gap: calc(15px * var(--space-ratio));
  }
  .g-20-sp {
    gap: calc(20px * var(--space-ratio));
  }
  .g-25-sp {
    gap: calc(25px * var(--space-ratio));
  }
  .g-30-sp {
    gap: calc(30px * var(--space-ratio));
  }
  .g-35-sp {
    gap: calc(35px * var(--space-ratio));
  }
  .g-40-sp {
    gap: calc(40px * var(--space-ratio));
  }
  .g-50-sp {
    gap: calc(50px * var(--space-ratio));
  }
  .g-60-sp {
    gap: calc(60px * var(--space-ratio));
  }
  .g-70-sp {
    gap: calc(70px * var(--space-ratio));
  }
  .g-80-sp {
    gap: calc(80px * var(--space-ratio));
  }
  .g-90-sp {
    gap: calc(90px * var(--space-ratio));
  }
  .g-100-sp {
    gap: calc(100px * var(--space-ratio));
  }
  .g-110-sp {
    gap: calc(110px * var(--space-ratio));
  }
  .g-120-sp {
    gap: calc(120px * var(--space-ratio));
  }
  .g-130-sp {
    gap: calc(130px * var(--space-ratio));
  }
  .g-140-sp {
    gap: calc(140px * var(--space-ratio));
  }
  .g-150-sp {
    gap: calc(150px * var(--space-ratio));
  }
  .g-160-sp {
    gap: calc(160px * var(--space-ratio));
  }
  .g-170-sp {
    gap: calc(170px * var(--space-ratio));
  }
  .g-180-sp {
    gap: calc(180px * var(--space-ratio));
  }
  .g-190-sp {
    gap: calc(190px * var(--space-ratio));
  }
  .g-200-sp {
    gap: calc(200px * var(--space-ratio));
  }

  .g-c-5-sp {
    column-gap: calc(5px * var(--space-ratio));
  }
  .g-c-8-sp {
    column-gap: calc(8px * var(--space-ratio));
  }
  .g-c-10-sp {
    column-gap: calc(10px * var(--space-ratio));
  }
  .g-c-15-sp {
    column-gap: calc(15px * var(--space-ratio));
  }
  .g-c-20-sp {
    column-gap: calc(20px * var(--space-ratio));
  }
  .g-c-25-sp {
    column-gap: calc(25px * var(--space-ratio));
  }
  .g-c-30-sp {
    column-gap: calc(30px * var(--space-ratio));
  }
  .g-c-35-sp {
    column-gap: calc(35px * var(--space-ratio));
  }
  .g-c-40-sp {
    column-gap: calc(40px * var(--space-ratio));
  }
  .g-c-50-sp {
    column-gap: calc(50px * var(--space-ratio));
  }
  .g-c-60-sp {
    column-gap: calc(60px * var(--space-ratio));
  }
  .g-c-70-sp {
    column-gap: calc(70px * var(--space-ratio));
  }
  .g-c-80-sp {
    column-gap: calc(80px * var(--space-ratio));
  }
  .g-c-90-sp {
    column-gap: calc(90px * var(--space-ratio));
  }
  .g-c-100-sp {
    column-gap: calc(100px * var(--space-ratio));
  }
  .g-c-110-sp {
    column-gap: calc(110px * var(--space-ratio));
  }
  .g-c-120-sp {
    column-gap: calc(120px * var(--space-ratio));
  }
  .g-c-130-sp {
    column-gap: calc(130px * var(--space-ratio));
  }
  .g-c-140-sp {
    column-gap: calc(140px * var(--space-ratio));
  }
  .g-c-150-sp {
    column-gap: calc(150px * var(--space-ratio));
  }
  .g-c-160-sp {
    column-gap: calc(160px * var(--space-ratio));
  }
  .g-c-170-sp {
    column-gap: calc(170px * var(--space-ratio));
  }
  .g-c-180-sp {
    column-gap: calc(180px * var(--space-ratio));
  }
  .g-c-190-sp {
    column-gap: calc(190px * var(--space-ratio));
  }
  .g-c-200-sp {
    column-gap: calc(200px * var(--space-ratio));
  }

  .g-r-5-sp {
    row-gap: calc(5px * var(--space-ratio));
  }
  .g-r-8-sp {
    row-gap: calc(8px * var(--space-ratio));
  }
  .g-r-10-sp {
    row-gap: calc(10px * var(--space-ratio));
  }
  .g-r-15-sp {
    row-gap: calc(15px * var(--space-ratio));
  }
  .g-r-20-sp {
    row-gap: calc(20px * var(--space-ratio));
  }
  .g-r-25-sp {
    row-gap: calc(25px * var(--space-ratio));
  }
  .g-r-30-sp {
    row-gap: calc(30px * var(--space-ratio));
  }
  .g-r-35-sp {
    row-gap: calc(35px * var(--space-ratio));
  }
  .g-r-40-sp {
    row-gap: calc(40px * var(--space-ratio));
  }
  .g-r-50-sp {
    row-gap: calc(50px * var(--space-ratio));
  }
  .g-r-60-sp {
    row-gap: calc(60px * var(--space-ratio));
  }
  .g-r-70-sp {
    row-gap: calc(70px * var(--space-ratio));
  }
  .g-r-80-sp {
    row-gap: calc(80px * var(--space-ratio));
  }
  .g-r-90-sp {
    row-gap: calc(90px * var(--space-ratio));
  }
  .g-r-100-sp {
    row-gap: calc(100px * var(--space-ratio));
  }
  .g-r-110-sp {
    row-gap: calc(110px * var(--space-ratio));
  }
  .g-r-120-sp {
    row-gap: calc(120px * var(--space-ratio));
  }
  .g-r-130-sp {
    row-gap: calc(130px * var(--space-ratio));
  }
  .g-r-140-sp {
    row-gap: calc(140px * var(--space-ratio));
  }
  .g-r-150-sp {
    row-gap: calc(150px * var(--space-ratio));
  }
  .g-r-160-sp {
    row-gap: calc(160px * var(--space-ratio));
  }
  .g-r-170-sp {
    row-gap: calc(170px * var(--space-ratio));
  }
  .g-r-180-sp {
    row-gap: calc(180px * var(--space-ratio));
  }
  .g-r-190-sp {
    row-gap: calc(190px * var(--space-ratio));
  }
  .g-r-200-sp {
    row-gap: calc(200px * var(--space-ratio));
  }
}
@media screen and (min-width: 768px) {
  .g-5-tpc {
    gap: calc(5px * var(--space-ratio));
  }
  .g-8-tpc {
    gap: calc(8px * var(--space-ratio));
  }
  .g-10-tpc {
    gap: calc(10px * var(--space-ratio));
  }
  .g-15-tpc {
    gap: calc(15px * var(--space-ratio));
  }
  .g-20-tpc {
    gap: calc(20px * var(--space-ratio));
  }
  .g-25-tpc {
    gap: calc(25px * var(--space-ratio));
  }
  .g-30-tpc {
    gap: calc(30px * var(--space-ratio));
  }
  .g-35-tpc {
    gap: calc(35px * var(--space-ratio));
  }
  .g-40-tpc {
    gap: calc(40px * var(--space-ratio));
  }
  .g-50-tpc {
    gap: calc(50px * var(--space-ratio));
  }
  .g-60-tpc {
    gap: calc(60px * var(--space-ratio));
  }
  .g-70-tpc {
    gap: calc(70px * var(--space-ratio));
  }
  .g-80-tpc {
    gap: calc(80px * var(--space-ratio));
  }
  .g-90-tpc {
    gap: calc(90px * var(--space-ratio));
  }
  .g-100-tpc {
    gap: calc(100px * var(--space-ratio));
  }
  .g-110-tpc {
    gap: calc(110px * var(--space-ratio));
  }
  .g-120-tpc {
    gap: calc(120px * var(--space-ratio));
  }
  .g-130-tpc {
    gap: calc(130px * var(--space-ratio));
  }
  .g-140-tpc {
    gap: calc(140px * var(--space-ratio));
  }
  .g-150-tpc {
    gap: calc(150px * var(--space-ratio));
  }
  .g-160-tpc {
    gap: calc(160px * var(--space-ratio));
  }
  .g-170-tpc {
    gap: calc(170px * var(--space-ratio));
  }
  .g-180-tpc {
    gap: calc(180px * var(--space-ratio));
  }
  .g-190-tpc {
    gap: calc(190px * var(--space-ratio));
  }
  .g-200-tpc {
    gap: calc(200px * var(--space-ratio));
  }

  .g-c-5-tpc {
    column-gap: calc(5px * var(--space-ratio));
  }
  .g-c-8-tpc {
    column-gap: calc(8px * var(--space-ratio));
  }
  .g-c-10-tpc {
    column-gap: calc(10px * var(--space-ratio));
  }
  .g-c-15-tpc {
    column-gap: calc(15px * var(--space-ratio));
  }
  .g-c-20-tpc {
    column-gap: calc(20px * var(--space-ratio));
  }
  .g-c-25-tpc {
    column-gap: calc(25px * var(--space-ratio));
  }
  .g-c-30-tpc {
    column-gap: calc(30px * var(--space-ratio));
  }
  .g-c-35-tpc {
    column-gap: calc(35px * var(--space-ratio));
  }
  .g-c-40-tpc {
    column-gap: calc(40px * var(--space-ratio));
  }
  .g-c-50-tpc {
    column-gap: calc(50px * var(--space-ratio));
  }
  .g-c-60-tpc {
    column-gap: calc(60px * var(--space-ratio));
  }
  .g-c-70-tpc {
    column-gap: calc(70px * var(--space-ratio));
  }
  .g-c-80-tpc {
    column-gap: calc(80px * var(--space-ratio));
  }
  .g-c-90-tpc {
    column-gap: calc(90px * var(--space-ratio));
  }
  .g-c-100-tpc {
    column-gap: calc(100px * var(--space-ratio));
  }
  .g-c-110-tpc {
    column-gap: calc(110px * var(--space-ratio));
  }
  .g-c-120-tpc {
    column-gap: calc(120px * var(--space-ratio));
  }
  .g-c-130-tpc {
    column-gap: calc(130px * var(--space-ratio));
  }
  .g-c-140-tpc {
    column-gap: calc(140px * var(--space-ratio));
  }
  .g-c-150-tpc {
    column-gap: calc(150px * var(--space-ratio));
  }
  .g-c-160-tpc {
    column-gap: calc(160px * var(--space-ratio));
  }
  .g-c-170-tpc {
    column-gap: calc(170px * var(--space-ratio));
  }
  .g-c-180-tpc {
    column-gap: calc(180px * var(--space-ratio));
  }
  .g-c-190-tpc {
    column-gap: calc(190px * var(--space-ratio));
  }
  .g-c-200-tpc {
    column-gap: calc(200px * var(--space-ratio));
  }

  .g-r-5-tpc {
    row-gap: calc(5px * var(--space-ratio));
  }
  .g-r-8-tpc {
    row-gap: calc(8px * var(--space-ratio));
  }
  .g-r-10-tpc {
    row-gap: calc(10px * var(--space-ratio));
  }
  .g-r-15-tpc {
    row-gap: calc(15px * var(--space-ratio));
  }
  .g-r-20-tpc {
    row-gap: calc(20px * var(--space-ratio));
  }
  .g-r-25-tpc {
    row-gap: calc(25px * var(--space-ratio));
  }
  .g-r-30-tpc {
    row-gap: calc(30px * var(--space-ratio));
  }
  .g-r-35-tpc {
    row-gap: calc(35px * var(--space-ratio));
  }
  .g-r-40-tpc {
    row-gap: calc(40px * var(--space-ratio));
  }
  .g-r-50-tpc {
    row-gap: calc(50px * var(--space-ratio));
  }
  .g-r-60-tpc {
    row-gap: calc(60px * var(--space-ratio));
  }
  .g-r-70-tpc {
    row-gap: calc(70px * var(--space-ratio));
  }
  .g-r-80-tpc {
    row-gap: calc(80px * var(--space-ratio));
  }
  .g-r-90-tpc {
    row-gap: calc(90px * var(--space-ratio));
  }
  .g-r-100-tpc {
    row-gap: calc(100px * var(--space-ratio));
  }
  .g-r-110-tpc {
    row-gap: calc(110px * var(--space-ratio));
  }
  .g-r-120-tpc {
    row-gap: calc(120px * var(--space-ratio));
  }
  .g-r-130-tpc {
    row-gap: calc(130px * var(--space-ratio));
  }
  .g-r-140-tpc {
    row-gap: calc(140px * var(--space-ratio));
  }
  .g-r-150-tpc {
    row-gap: calc(150px * var(--space-ratio));
  }
  .g-r-160-tpc {
    row-gap: calc(160px * var(--space-ratio));
  }
  .g-r-170-tpc {
    row-gap: calc(170px * var(--space-ratio));
  }
  .g-r-180-tpc {
    row-gap: calc(180px * var(--space-ratio));
  }
  .g-r-190-tpc {
    row-gap: calc(190px * var(--space-ratio));
  }
  .g-r-200-tpc {
    row-gap: calc(200px * var(--space-ratio));
  }
}
@media screen and (min-width: 1024px) {
  .g-5-pc {
    gap: calc(5px * var(--space-ratio));
  }
  .g-8-pc {
    gap: calc(8px * var(--space-ratio));
  }
  .g-10-pc {
    gap: calc(10px * var(--space-ratio));
  }
  .g-15-pc {
    gap: calc(15px * var(--space-ratio));
  }
  .g-20-pc {
    gap: calc(20px * var(--space-ratio));
  }
  .g-25-pc {
    gap: calc(25px * var(--space-ratio));
  }
  .g-30-pc {
    gap: calc(30px * var(--space-ratio));
  }
  .g-35-pc {
    gap: calc(35px * var(--space-ratio));
  }
  .g-40-pc {
    gap: calc(40px * var(--space-ratio));
  }
  .g-50-pc {
    gap: calc(50px * var(--space-ratio));
  }
  .g-60-pc {
    gap: calc(60px * var(--space-ratio));
  }
  .g-70-pc {
    gap: calc(70px * var(--space-ratio));
  }
  .g-80-pc {
    gap: calc(80px * var(--space-ratio));
  }
  .g-90-pc {
    gap: calc(90px * var(--space-ratio));
  }
  .g-100-pc {
    gap: calc(100px * var(--space-ratio));
  }
  .g-110-pc {
    gap: calc(110px * var(--space-ratio));
  }
  .g-120-pc {
    gap: calc(120px * var(--space-ratio));
  }
  .g-130-pc {
    gap: calc(130px * var(--space-ratio));
  }
  .g-140-pc {
    gap: calc(140px * var(--space-ratio));
  }
  .g-150-pc {
    gap: calc(150px * var(--space-ratio));
  }
  .g-160-pc {
    gap: calc(160px * var(--space-ratio));
  }
  .g-170-pc {
    gap: calc(170px * var(--space-ratio));
  }
  .g-180-pc {
    gap: calc(180px * var(--space-ratio));
  }
  .g-190-pc {
    gap: calc(190px * var(--space-ratio));
  }
  .g-200-pc {
    gap: calc(200px * var(--space-ratio));
  }

  .g-c-5-pc {
    column-gap: calc(5px * var(--space-ratio));
  }
  .g-c-8-pc {
    column-gap: calc(8px * var(--space-ratio));
  }
  .g-c-10-pc {
    column-gap: calc(10px * var(--space-ratio));
  }
  .g-c-15-pc {
    column-gap: calc(15px * var(--space-ratio));
  }
  .g-c-20-pc {
    column-gap: calc(20px * var(--space-ratio));
  }
  .g-c-25-pc {
    column-gap: calc(25px * var(--space-ratio));
  }
  .g-c-30-pc {
    column-gap: calc(30px * var(--space-ratio));
  }
  .g-c-35-pc {
    column-gap: calc(35px * var(--space-ratio));
  }
  .g-c-40-pc {
    column-gap: calc(40px * var(--space-ratio));
  }
  .g-c-50-pc {
    column-gap: calc(50px * var(--space-ratio));
  }
  .g-c-60-pc {
    column-gap: calc(60px * var(--space-ratio));
  }
  .g-c-70-pc {
    column-gap: calc(70px * var(--space-ratio));
  }
  .g-c-80-pc {
    column-gap: calc(80px * var(--space-ratio));
  }
  .g-c-90-pc {
    column-gap: calc(90px * var(--space-ratio));
  }
  .g-c-100-pc {
    column-gap: calc(100px * var(--space-ratio));
  }
  .g-c-110-pc {
    column-gap: calc(110px * var(--space-ratio));
  }
  .g-c-120-pc {
    column-gap: calc(120px * var(--space-ratio));
  }
  .g-c-130-pc {
    column-gap: calc(130px * var(--space-ratio));
  }
  .g-c-140-pc {
    column-gap: calc(140px * var(--space-ratio));
  }
  .g-c-150-pc {
    column-gap: calc(150px * var(--space-ratio));
  }
  .g-c-160-pc {
    column-gap: calc(160px * var(--space-ratio));
  }
  .g-c-170-pc {
    column-gap: calc(170px * var(--space-ratio));
  }
  .g-c-180-pc {
    column-gap: calc(180px * var(--space-ratio));
  }
  .g-c-190-pc {
    column-gap: calc(190px * var(--space-ratio));
  }
  .g-c-200-pc {
    column-gap: calc(200px * var(--space-ratio));
  }

  .g-r-5-pc {
    row-gap: calc(5px * var(--space-ratio));
  }
  .g-r-8-pc {
    row-gap: calc(8px * var(--space-ratio));
  }
  .g-r-10-pc {
    row-gap: calc(10px * var(--space-ratio));
  }
  .g-r-15-pc {
    row-gap: calc(15px * var(--space-ratio));
  }
  .g-r-20-pc {
    row-gap: calc(20px * var(--space-ratio));
  }
  .g-r-25-pc {
    row-gap: calc(25px * var(--space-ratio));
  }
  .g-r-30-pc {
    row-gap: calc(30px * var(--space-ratio));
  }
  .g-r-35-pc {
    row-gap: calc(35px * var(--space-ratio));
  }
  .g-r-40-pc {
    row-gap: calc(40px * var(--space-ratio));
  }
  .g-r-50-pc {
    row-gap: calc(50px * var(--space-ratio));
  }
  .g-r-60-pc {
    row-gap: calc(60px * var(--space-ratio));
  }
  .g-r-70-pc {
    row-gap: calc(70px * var(--space-ratio));
  }
  .g-r-80-pc {
    row-gap: calc(80px * var(--space-ratio));
  }
  .g-r-90-pc {
    row-gap: calc(90px * var(--space-ratio));
  }
  .g-r-100-pc {
    row-gap: calc(100px * var(--space-ratio));
  }
  .g-r-110-pc {
    row-gap: calc(110px * var(--space-ratio));
  }
  .g-r-120-pc {
    row-gap: calc(120px * var(--space-ratio));
  }
  .g-r-130-pc {
    row-gap: calc(130px * var(--space-ratio));
  }
  .g-r-140-pc {
    row-gap: calc(140px * var(--space-ratio));
  }
  .g-r-150-pc {
    row-gap: calc(150px * var(--space-ratio));
  }
  .g-r-160-pc {
    row-gap: calc(160px * var(--space-ratio));
  }
  .g-r-170-pc {
    row-gap: calc(170px * var(--space-ratio));
  }
  .g-r-180-pc {
    row-gap: calc(180px * var(--space-ratio));
  }
  .g-r-190-pc {
    row-gap: calc(190px * var(--space-ratio));
  }
  .g-r-200-pc {
    row-gap: calc(200px * var(--space-ratio));
  }
}

/* BORDER
-------------------------------------------------------------- */
.bs-1 {
  border-style: solid;
  border-width: 1px;
}
.bs-2 {
  border-style: solid;
  border-width: 2px;
}
.bs-3 {
  border-style: solid;
  border-width: 3px;
}
.bs-4 {
  border-style: solid;
  border-width: 4px;
}
.bs-5 {
  border-style: solid;
  border-width: 5px;
}
.bs-6 {
  border-style: solid;
  border-width: 6px;
}
.bs-7 {
  border-style: solid;
  border-width: 7px;
}
.bs-8 {
  border-style: solid;
  border-width: 8px;
}
.bs-9 {
  border-style: solid;
  border-width: 9px;
}
.bs-10 {
  border-style: solid;
  border-width: 10px;
}

.bd-1 {
  border-style: dotted;
  border-width: 1px;
}
.bd-2 {
  border-style: dotted;
  border-width: 2px;
}
.bd-3 {
  border-style: dotted;
  border-width: 3px;
}
.bd-4 {
  border-style: dotted;
  border-width: 4px;
}
.bd-5 {
  border-style: dotted;
  border-width: 5px;
}
.bd-6 {
  border-style: dotted;
  border-width: 6px;
}
.bd-7 {
  border-style: dotted;
  border-width: 7px;
}
.bd-8 {
  border-style: dotted;
  border-width: 8px;
}
.bd-9 {
  border-style: dotted;
  border-width: 9px;
}
.bd-10 {
  border-style: dotted;
  border-width: 10px;
}

.bs-t-1 {
  border-top-style: solid;
  border-top-width: 1px;
}
.bs-t-2 {
  border-top-style: solid;
  border-top-width: 2px;
}
.bs-t-3 {
  border-top-style: solid;
  border-top-width: 3px;
}
.bs-t-4 {
  border-top-style: solid;
  border-top-width: 4px;
}
.bs-t-5 {
  border-top-style: solid;
  border-top-width: 5px;
}
.bs-t-6 {
  border-top-style: solid;
  border-top-width: 6px;
}
.bs-t-7 {
  border-top-style: solid;
  border-top-width: 7px;
}
.bs-t-8 {
  border-top-style: solid;
  border-top-width: 8px;
}
.bs-t-9 {
  border-top-style: solid;
  border-top-width: 9px;
}
.bs-t-10 {
  border-top-style: solid;
  border-top-width: 10px;
}

.bs-r-1 {
  border-right-style: solid;
  border-right-width: 1px;
}
.bs-r-2 {
  border-right-style: solid;
  border-right-width: 2px;
}
.bs-r-3 {
  border-right-style: solid;
  border-right-width: 3px;
}
.bs-r-4 {
  border-right-style: solid;
  border-right-width: 4px;
}
.bs-r-5 {
  border-right-style: solid;
  border-right-width: 5px;
}
.bs-r-6 {
  border-right-style: solid;
  border-right-width: 6px;
}
.bs-r-7 {
  border-right-style: solid;
  border-right-width: 7px;
}
.bs-r-8 {
  border-right-style: solid;
  border-right-width: 8px;
}
.bs-r-9 {
  border-right-style: solid;
  border-right-width: 9px;
}
.bs-r-10 {
  border-right-style: solid;
  border-right-width: 10px;
}

.bs-l-1 {
  border-left-style: solid;
  border-left-width: 1px;
}
.bs-l-2 {
  border-left-style: solid;
  border-left-width: 2px;
}
.bs-l-3 {
  border-left-style: solid;
  border-left-width: 3px;
}
.bs-l-4 {
  border-left-style: solid;
  border-left-width: 4px;
}
.bs-l-5 {
  border-left-style: solid;
  border-left-width: 5px;
}
.bs-l-6 {
  border-left-style: solid;
  border-left-width: 6px;
}
.bs-l-7 {
  border-left-style: solid;
  border-left-width: 7px;
}
.bs-l-8 {
  border-left-style: solid;
  border-left-width: 8px;
}
.bs-l-9 {
  border-left-style: solid;
  border-left-width: 9px;
}
.bs-l-10 {
  border-left-style: solid;
  border-left-width: 10px;
}

.bs-b-1 {
  border-bottom-style: solid;
  border-bottom-width: 1px;
}
.bs-b-2 {
  border-bottom-style: solid;
  border-bottom-width: 2px;
}
.bs-b-3 {
  border-bottom-style: solid;
  border-bottom-width: 3px;
}
.bs-b-4 {
  border-bottom-style: solid;
  border-bottom-width: 4px;
}
.bs-b-5 {
  border-bottom-style: solid;
  border-bottom-width: 5px;
}
.bs-b-6 {
  border-bottom-style: solid;
  border-bottom-width: 6px;
}
.bs-b-7 {
  border-bottom-style: solid;
  border-bottom-width: 7px;
}
.bs-b-8 {
  border-bottom-style: solid;
  border-bottom-width: 8px;
}
.bs-b-9 {
  border-bottom-style: solid;
  border-bottom-width: 9px;
}
.bs-b-10 {
  border-bottom-style: solid;
  border-bottom-width: 10px;
}

.bd-t-1 {
  border-top-style: dotted;
  border-top-width: 1px;
}
.bd-t-2 {
  border-top-style: dotted;
  border-top-width: 2px;
}
.bd-t-3 {
  border-top-style: dotted;
  border-top-width: 3px;
}
.bd-t-4 {
  border-top-style: dotted;
  border-top-width: 4px;
}
.bd-t-5 {
  border-top-style: dotted;
  border-top-width: 5px;
}
.bd-t-6 {
  border-top-style: dotted;
  border-top-width: 6px;
}
.bd-t-7 {
  border-top-style: dotted;
  border-top-width: 7px;
}
.bd-t-8 {
  border-top-style: dotted;
  border-top-width: 8px;
}
.bd-t-9 {
  border-top-style: dotted;
  border-top-width: 9px;
}
.bd-t-10 {
  border-top-style: dotted;
  border-top-width: 10px;
}

.bd-r-1 {
  border-right-style: dotted;
  border-right-width: 1px;
}
.bd-r-2 {
  border-right-style: dotted;
  border-right-width: 2px;
}
.bd-r-3 {
  border-right-style: dotted;
  border-right-width: 3px;
}
.bd-r-4 {
  border-right-style: dotted;
  border-right-width: 4px;
}
.bd-r-5 {
  border-right-style: dotted;
  border-right-width: 5px;
}
.bd-r-6 {
  border-right-style: dotted;
  border-right-width: 6px;
}
.bd-r-7 {
  border-right-style: dotted;
  border-right-width: 7px;
}
.bd-r-8 {
  border-right-style: dotted;
  border-right-width: 8px;
}
.bd-r-9 {
  border-right-style: dotted;
  border-right-width: 9px;
}
.bd-r-10 {
  border-right-style: dotted;
  border-right-width: 10px;
}

.bd-l-1 {
  border-left-style: dotted;
  border-left-width: 1px;
}
.bd-l-2 {
  border-left-style: dotted;
  border-left-width: 2px;
}
.bd-l-3 {
  border-left-style: dotted;
  border-left-width: 3px;
}
.bd-l-4 {
  border-left-style: dotted;
  border-left-width: 4px;
}
.bd-l-5 {
  border-left-style: dotted;
  border-left-width: 5px;
}
.bd-l-6 {
  border-left-style: dotted;
  border-left-width: 6px;
}
.bd-l-7 {
  border-left-style: dotted;
  border-left-width: 7px;
}
.bd-l-8 {
  border-left-style: dotted;
  border-left-width: 8px;
}
.bd-l-9 {
  border-left-style: dotted;
  border-left-width: 9px;
}
.bd-l-10 {
  border-left-style: dotted;
  border-left-width: 10px;
}

.bd-b-1 {
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}
.bd-b-2 {
  border-bottom-style: dotted;
  border-bottom-width: 2px;
}
.bd-b-3 {
  border-bottom-style: dotted;
  border-bottom-width: 3px;
}
.bd-b-4 {
  border-bottom-style: dotted;
  border-bottom-width: 4px;
}
.bd-b-5 {
  border-bottom-style: dotted;
  border-bottom-width: 5px;
}
.bd-b-6 {
  border-bottom-style: dotted;
  border-bottom-width: 6px;
}
.bd-b-7 {
  border-bottom-style: dotted;
  border-bottom-width: 7px;
}
.bd-b-8 {
  border-bottom-style: dotted;
  border-bottom-width: 8px;
}
.bd-b-9 {
  border-bottom-style: dotted;
  border-bottom-width: 9px;
}
.bd-b-10 {
  border-bottom-style: dotted;
  border-bottom-width: 10px;
}

@media screen and (max-width: 1023px) {
  .bs-1-sp {
    border-style: solid;
    border-width: 1px;
  }
  .bs-2-sp {
    border-style: solid;
    border-width: 2px;
  }
  .bs-3-sp {
    border-style: solid;
    border-width: 3px;
  }
  .bs-4-sp {
    border-style: solid;
    border-width: 4px;
  }
  .bs-5-sp {
    border-style: solid;
    border-width: 5px;
  }
  .bs-6-sp {
    border-style: solid;
    border-width: 6px;
  }
  .bs-7-sp {
    border-style: solid;
    border-width: 7px;
  }
  .bs-8-sp {
    border-style: solid;
    border-width: 8px;
  }
  .bs-9-sp {
    border-style: solid;
    border-width: 9px;
  }
  .bs-10-sp {
    border-style: solid;
    border-width: 10px;
  }

  .bd-1-sp {
    border-style: dotted;
    border-width: 1px;
  }
  .bd-2-sp {
    border-style: dotted;
    border-width: 2px;
  }
  .bd-3-sp {
    border-style: dotted;
    border-width: 3px;
  }
  .bd-4-sp {
    border-style: dotted;
    border-width: 4px;
  }
  .bd-5-sp {
    border-style: dotted;
    border-width: 5px;
  }
  .bd-6-sp {
    border-style: dotted;
    border-width: 6px;
  }
  .bd-7-sp {
    border-style: dotted;
    border-width: 7px;
  }
  .bd-8-sp {
    border-style: dotted;
    border-width: 8px;
  }
  .bd-9-sp {
    border-style: dotted;
    border-width: 9px;
  }
  .bd-10-sp {
    border-style: dotted;
    border-width: 10px;
  }

  .bs-t-1-sp {
    border-top-style: solid;
    border-top-width: 1px;
  }
  .bs-t-2-sp {
    border-top-style: solid;
    border-top-width: 2px;
  }
  .bs-t-3-sp {
    border-top-style: solid;
    border-top-width: 3px;
  }
  .bs-t-4-sp {
    border-top-style: solid;
    border-top-width: 4px;
  }
  .bs-t-5-sp {
    border-top-style: solid;
    border-top-width: 5px;
  }
  .bs-t-6-sp {
    border-top-style: solid;
    border-top-width: 6px;
  }
  .bs-t-7-sp {
    border-top-style: solid;
    border-top-width: 7px;
  }
  .bs-t-8-sp {
    border-top-style: solid;
    border-top-width: 8px;
  }
  .bs-t-9-sp {
    border-top-style: solid;
    border-top-width: 9px;
  }
  .bs-t-10-sp {
    border-top-style: solid;
    border-top-width: 10px;
  }

  .bs-r-1-sp {
    border-right-style: solid;
    border-right-width: 1px;
  }
  .bs-r-2-sp {
    border-right-style: solid;
    border-right-width: 2px;
  }
  .bs-r-3-sp {
    border-right-style: solid;
    border-right-width: 3px;
  }
  .bs-r-4-sp {
    border-right-style: solid;
    border-right-width: 4px;
  }
  .bs-r-5-sp {
    border-right-style: solid;
    border-right-width: 5px;
  }
  .bs-r-6-sp {
    border-right-style: solid;
    border-right-width: 6px;
  }
  .bs-r-7-sp {
    border-right-style: solid;
    border-right-width: 7px;
  }
  .bs-r-8-sp {
    border-right-style: solid;
    border-right-width: 8px;
  }
  .bs-r-9-sp {
    border-right-style: solid;
    border-right-width: 9px;
  }
  .bs-r-10-sp {
    border-right-style: solid;
    border-right-width: 10px;
  }

  .bs-l-1-sp {
    border-left-style: solid;
    border-left-width: 1px;
  }
  .bs-l-2-sp {
    border-left-style: solid;
    border-left-width: 2px;
  }
  .bs-l-3-sp {
    border-left-style: solid;
    border-left-width: 3px;
  }
  .bs-l-4-sp {
    border-left-style: solid;
    border-left-width: 4px;
  }
  .bs-l-5-sp {
    border-left-style: solid;
    border-left-width: 5px;
  }
  .bs-l-6-sp {
    border-left-style: solid;
    border-left-width: 6px;
  }
  .bs-l-7-sp {
    border-left-style: solid;
    border-left-width: 7px;
  }
  .bs-l-8-sp {
    border-left-style: solid;
    border-left-width: 8px;
  }
  .bs-l-9-sp {
    border-left-style: solid;
    border-left-width: 9px;
  }
  .bs-l-10-sp {
    border-left-style: solid;
    border-left-width: 10px;
  }

  .bs-b-1-sp {
    border-bottom-style: solid;
    border-bottom-width: 1px;
  }
  .bs-b-2-sp {
    border-bottom-style: solid;
    border-bottom-width: 2px;
  }
  .bs-b-3-sp {
    border-bottom-style: solid;
    border-bottom-width: 3px;
  }
  .bs-b-4-sp {
    border-bottom-style: solid;
    border-bottom-width: 4px;
  }
  .bs-b-5-sp {
    border-bottom-style: solid;
    border-bottom-width: 5px;
  }
  .bs-b-6-sp {
    border-bottom-style: solid;
    border-bottom-width: 6px;
  }
  .bs-b-7-sp {
    border-bottom-style: solid;
    border-bottom-width: 7px;
  }
  .bs-b-8-sp {
    border-bottom-style: solid;
    border-bottom-width: 8px;
  }
  .bs-b-9-sp {
    border-bottom-style: solid;
    border-bottom-width: 9px;
  }
  .bs-b-10-sp {
    border-bottom-style: solid;
    border-bottom-width: 10px;
  }

  .bd-t-1-sp {
    border-top-style: dotted;
    border-top-width: 1px;
  }
  .bd-t-2-sp {
    border-top-style: dotted;
    border-top-width: 2px;
  }
  .bd-t-3-sp {
    border-top-style: dotted;
    border-top-width: 3px;
  }
  .bd-t-4-sp {
    border-top-style: dotted;
    border-top-width: 4px;
  }
  .bd-t-5-sp {
    border-top-style: dotted;
    border-top-width: 5px;
  }
  .bd-t-6-sp {
    border-top-style: dotted;
    border-top-width: 6px;
  }
  .bd-t-7-sp {
    border-top-style: dotted;
    border-top-width: 7px;
  }
  .bd-t-8-sp {
    border-top-style: dotted;
    border-top-width: 8px;
  }
  .bd-t-9-sp {
    border-top-style: dotted;
    border-top-width: 9px;
  }
  .bd-t-10-sp {
    border-top-style: dotted;
    border-top-width: 10px;
  }

  .bd-r-1-sp {
    border-right-style: dotted;
    border-right-width: 1px;
  }
  .bd-r-2-sp {
    border-right-style: dotted;
    border-right-width: 2px;
  }
  .bd-r-3-sp {
    border-right-style: dotted;
    border-right-width: 3px;
  }
  .bd-r-4-sp {
    border-right-style: dotted;
    border-right-width: 4px;
  }
  .bd-r-5-sp {
    border-right-style: dotted;
    border-right-width: 5px;
  }
  .bd-r-6-sp {
    border-right-style: dotted;
    border-right-width: 6px;
  }
  .bd-r-7-sp {
    border-right-style: dotted;
    border-right-width: 7px;
  }
  .bd-r-8-sp {
    border-right-style: dotted;
    border-right-width: 8px;
  }
  .bd-r-9-sp {
    border-right-style: dotted;
    border-right-width: 9px;
  }
  .bd-r-10-sp {
    border-right-style: dotted;
    border-right-width: 10px;
  }

  .bd-l-1-sp {
    border-left-style: dotted;
    border-left-width: 1px;
  }
  .bd-l-2-sp {
    border-left-style: dotted;
    border-left-width: 2px;
  }
  .bd-l-3-sp {
    border-left-style: dotted;
    border-left-width: 3px;
  }
  .bd-l-4-sp {
    border-left-style: dotted;
    border-left-width: 4px;
  }
  .bd-l-5-sp {
    border-left-style: dotted;
    border-left-width: 5px;
  }
  .bd-l-6-sp {
    border-left-style: dotted;
    border-left-width: 6px;
  }
  .bd-l-7-sp {
    border-left-style: dotted;
    border-left-width: 7px;
  }
  .bd-l-8-sp {
    border-left-style: dotted;
    border-left-width: 8px;
  }
  .bd-l-9-sp {
    border-left-style: dotted;
    border-left-width: 9px;
  }
  .bd-l-10-sp {
    border-left-style: dotted;
    border-left-width: 10px;
  }

  .bd-b-1-sp {
    border-bottom-style: dotted;
    border-bottom-width: 1px;
  }
  .bd-b-2-sp {
    border-bottom-style: dotted;
    border-bottom-width: 2px;
  }
  .bd-b-3-sp {
    border-bottom-style: dotted;
    border-bottom-width: 3px;
  }
  .bd-b-4-sp {
    border-bottom-style: dotted;
    border-bottom-width: 4px;
  }
  .bd-b-5-sp {
    border-bottom-style: dotted;
    border-bottom-width: 5px;
  }
  .bd-b-6-sp {
    border-bottom-style: dotted;
    border-bottom-width: 6px;
  }
  .bd-b-7-sp {
    border-bottom-style: dotted;
    border-bottom-width: 7px;
  }
  .bd-b-8-sp {
    border-bottom-style: dotted;
    border-bottom-width: 8px;
  }
  .bd-b-9-sp {
    border-bottom-style: dotted;
    border-bottom-width: 9px;
  }
  .bd-b-10-sp {
    border-bottom-style: dotted;
    border-bottom-width: 10px;
  }
}
@media screen and (min-width: 768px) {
  .bs-1-tpc {
    border-style: solid;
    border-width: 1px;
  }
  .bs-2-tpc {
    border-style: solid;
    border-width: 2px;
  }
  .bs-3-tpc {
    border-style: solid;
    border-width: 3px;
  }
  .bs-4-tpc {
    border-style: solid;
    border-width: 4px;
  }
  .bs-5-tpc {
    border-style: solid;
    border-width: 5px;
  }
  .bs-6-tpc {
    border-style: solid;
    border-width: 6px;
  }
  .bs-7-tpc {
    border-style: solid;
    border-width: 7px;
  }
  .bs-8-tpc {
    border-style: solid;
    border-width: 8px;
  }
  .bs-9-tpc {
    border-style: solid;
    border-width: 9px;
  }
  .bs-10-tpc {
    border-style: solid;
    border-width: 10px;
  }

  .bd-1-tpc {
    border-style: dotted;
    border-width: 1px;
  }
  .bd-2-tpc {
    border-style: dotted;
    border-width: 2px;
  }
  .bd-3-tpc {
    border-style: dotted;
    border-width: 3px;
  }
  .bd-4-tpc {
    border-style: dotted;
    border-width: 4px;
  }
  .bd-5-tpc {
    border-style: dotted;
    border-width: 5px;
  }
  .bd-6-tpc {
    border-style: dotted;
    border-width: 6px;
  }
  .bd-7-tpc {
    border-style: dotted;
    border-width: 7px;
  }
  .bd-8-tpc {
    border-style: dotted;
    border-width: 8px;
  }
  .bd-9-tpc {
    border-style: dotted;
    border-width: 9px;
  }
  .bd-10-tpc {
    border-style: dotted;
    border-width: 10px;
  }

  .bs-t-1-tpc {
    border-top-style: solid;
    border-top-width: 1px;
  }
  .bs-t-2-tpc {
    border-top-style: solid;
    border-top-width: 2px;
  }
  .bs-t-3-tpc {
    border-top-style: solid;
    border-top-width: 3px;
  }
  .bs-t-4-tpc {
    border-top-style: solid;
    border-top-width: 4px;
  }
  .bs-t-5-tpc {
    border-top-style: solid;
    border-top-width: 5px;
  }
  .bs-t-6-tpc {
    border-top-style: solid;
    border-top-width: 6px;
  }
  .bs-t-7-tpc {
    border-top-style: solid;
    border-top-width: 7px;
  }
  .bs-t-8-tpc {
    border-top-style: solid;
    border-top-width: 8px;
  }
  .bs-t-9-tpc {
    border-top-style: solid;
    border-top-width: 9px;
  }
  .bs-t-10-tpc {
    border-top-style: solid;
    border-top-width: 10px;
  }

  .bs-r-1-tpc {
    border-right-style: solid;
    border-right-width: 1px;
  }
  .bs-r-2-tpc {
    border-right-style: solid;
    border-right-width: 2px;
  }
  .bs-r-3-tpc {
    border-right-style: solid;
    border-right-width: 3px;
  }
  .bs-r-4-tpc {
    border-right-style: solid;
    border-right-width: 4px;
  }
  .bs-r-5-tpc {
    border-right-style: solid;
    border-right-width: 5px;
  }
  .bs-r-6-tpc {
    border-right-style: solid;
    border-right-width: 6px;
  }
  .bs-r-7-tpc {
    border-right-style: solid;
    border-right-width: 7px;
  }
  .bs-r-8-tpc {
    border-right-style: solid;
    border-right-width: 8px;
  }
  .bs-r-9-tpc {
    border-right-style: solid;
    border-right-width: 9px;
  }
  .bs-r-10-tpc {
    border-right-style: solid;
    border-right-width: 10px;
  }

  .bs-l-1-tpc {
    border-left-style: solid;
    border-left-width: 1px;
  }
  .bs-l-2-tpc {
    border-left-style: solid;
    border-left-width: 2px;
  }
  .bs-l-3-tpc {
    border-left-style: solid;
    border-left-width: 3px;
  }
  .bs-l-4-tpc {
    border-left-style: solid;
    border-left-width: 4px;
  }
  .bs-l-5-tpc {
    border-left-style: solid;
    border-left-width: 5px;
  }
  .bs-l-6-tpc {
    border-left-style: solid;
    border-left-width: 6px;
  }
  .bs-l-7-tpc {
    border-left-style: solid;
    border-left-width: 7px;
  }
  .bs-l-8-tpc {
    border-left-style: solid;
    border-left-width: 8px;
  }
  .bs-l-9-tpc {
    border-left-style: solid;
    border-left-width: 9px;
  }
  .bs-l-10-tpc {
    border-left-style: solid;
    border-left-width: 10px;
  }

  .bs-b-1-tpc {
    border-bottom-style: solid;
    border-bottom-width: 1px;
  }
  .bs-b-2-tpc {
    border-bottom-style: solid;
    border-bottom-width: 2px;
  }
  .bs-b-3-tpc {
    border-bottom-style: solid;
    border-bottom-width: 3px;
  }
  .bs-b-4-tpc {
    border-bottom-style: solid;
    border-bottom-width: 4px;
  }
  .bs-b-5-tpc {
    border-bottom-style: solid;
    border-bottom-width: 5px;
  }
  .bs-b-6-tpc {
    border-bottom-style: solid;
    border-bottom-width: 6px;
  }
  .bs-b-7-tpc {
    border-bottom-style: solid;
    border-bottom-width: 7px;
  }
  .bs-b-8-tpc {
    border-bottom-style: solid;
    border-bottom-width: 8px;
  }
  .bs-b-9-tpc {
    border-bottom-style: solid;
    border-bottom-width: 9px;
  }
  .bs-b-10-tpc {
    border-bottom-style: solid;
    border-bottom-width: 10px;
  }

  .bd-t-1-tpc {
    border-top-style: dotted;
    border-top-width: 1px;
  }
  .bd-t-2-tpc {
    border-top-style: dotted;
    border-top-width: 2px;
  }
  .bd-t-3-tpc {
    border-top-style: dotted;
    border-top-width: 3px;
  }
  .bd-t-4-tpc {
    border-top-style: dotted;
    border-top-width: 4px;
  }
  .bd-t-5-tpc {
    border-top-style: dotted;
    border-top-width: 5px;
  }
  .bd-t-6-tpc {
    border-top-style: dotted;
    border-top-width: 6px;
  }
  .bd-t-7-tpc {
    border-top-style: dotted;
    border-top-width: 7px;
  }
  .bd-t-8-tpc {
    border-top-style: dotted;
    border-top-width: 8px;
  }
  .bd-t-9-tpc {
    border-top-style: dotted;
    border-top-width: 9px;
  }
  .bd-t-10-tpc {
    border-top-style: dotted;
    border-top-width: 10px;
  }

  .bd-r-1-tpc {
    border-right-style: dotted;
    border-right-width: 1px;
  }
  .bd-r-2-tpc {
    border-right-style: dotted;
    border-right-width: 2px;
  }
  .bd-r-3-tpc {
    border-right-style: dotted;
    border-right-width: 3px;
  }
  .bd-r-4-tpc {
    border-right-style: dotted;
    border-right-width: 4px;
  }
  .bd-r-5-tpc {
    border-right-style: dotted;
    border-right-width: 5px;
  }
  .bd-r-6-tpc {
    border-right-style: dotted;
    border-right-width: 6px;
  }
  .bd-r-7-tpc {
    border-right-style: dotted;
    border-right-width: 7px;
  }
  .bd-r-8-tpc {
    border-right-style: dotted;
    border-right-width: 8px;
  }
  .bd-r-9-tpc {
    border-right-style: dotted;
    border-right-width: 9px;
  }
  .bd-r-10-tpc {
    border-right-style: dotted;
    border-right-width: 10px;
  }

  .bd-l-1-tpc {
    border-left-style: dotted;
    border-left-width: 1px;
  }
  .bd-l-2-tpc {
    border-left-style: dotted;
    border-left-width: 2px;
  }
  .bd-l-3-tpc {
    border-left-style: dotted;
    border-left-width: 3px;
  }
  .bd-l-4-tpc {
    border-left-style: dotted;
    border-left-width: 4px;
  }
  .bd-l-5-tpc {
    border-left-style: dotted;
    border-left-width: 5px;
  }
  .bd-l-6-tpc {
    border-left-style: dotted;
    border-left-width: 6px;
  }
  .bd-l-7-tpc {
    border-left-style: dotted;
    border-left-width: 7px;
  }
  .bd-l-8-tpc {
    border-left-style: dotted;
    border-left-width: 8px;
  }
  .bd-l-9-tpc {
    border-left-style: dotted;
    border-left-width: 9px;
  }
  .bd-l-10-tpc {
    border-left-style: dotted;
    border-left-width: 10px;
  }

  .bd-b-1-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 1px;
  }
  .bd-b-2-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 2px;
  }
  .bd-b-3-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 3px;
  }
  .bd-b-4-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 4px;
  }
  .bd-b-5-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 5px;
  }
  .bd-b-6-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 6px;
  }
  .bd-b-7-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 7px;
  }
  .bd-b-8-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 8px;
  }
  .bd-b-9-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 9px;
  }
  .bd-b-10-tpc {
    border-bottom-style: dotted;
    border-bottom-width: 10px;
  }
}
@media screen and (min-width: 1024px) {
  .bs-1-pc {
    border-style: solid;
    border-width: 1px;
  }
  .bs-2-pc {
    border-style: solid;
    border-width: 2px;
  }
  .bs-3-pc {
    border-style: solid;
    border-width: 3px;
  }
  .bs-4-pc {
    border-style: solid;
    border-width: 4px;
  }
  .bs-5-pc {
    border-style: solid;
    border-width: 5px;
  }
  .bs-6-pc {
    border-style: solid;
    border-width: 6px;
  }
  .bs-7-pc {
    border-style: solid;
    border-width: 7px;
  }
  .bs-8-pc {
    border-style: solid;
    border-width: 8px;
  }
  .bs-9-pc {
    border-style: solid;
    border-width: 9px;
  }
  .bs-10-pc {
    border-style: solid;
    border-width: 10px;
  }

  .bd-1-pc {
    border-style: dotted;
    border-width: 1px;
  }
  .bd-2-pc {
    border-style: dotted;
    border-width: 2px;
  }
  .bd-3-pc {
    border-style: dotted;
    border-width: 3px;
  }
  .bd-4-pc {
    border-style: dotted;
    border-width: 4px;
  }
  .bd-5-pc {
    border-style: dotted;
    border-width: 5px;
  }
  .bd-6-pc {
    border-style: dotted;
    border-width: 6px;
  }
  .bd-7-pc {
    border-style: dotted;
    border-width: 7px;
  }
  .bd-8-pc {
    border-style: dotted;
    border-width: 8px;
  }
  .bd-9-pc {
    border-style: dotted;
    border-width: 9px;
  }
  .bd-10-pc {
    border-style: dotted;
    border-width: 10px;
  }

  .bs-t-1-pc {
    border-top-style: solid;
    border-top-width: 1px;
  }
  .bs-t-2-pc {
    border-top-style: solid;
    border-top-width: 2px;
  }
  .bs-t-3-pc {
    border-top-style: solid;
    border-top-width: 3px;
  }
  .bs-t-4-pc {
    border-top-style: solid;
    border-top-width: 4px;
  }
  .bs-t-5-pc {
    border-top-style: solid;
    border-top-width: 5px;
  }
  .bs-t-6-pc {
    border-top-style: solid;
    border-top-width: 6px;
  }
  .bs-t-7-pc {
    border-top-style: solid;
    border-top-width: 7px;
  }
  .bs-t-8-pc {
    border-top-style: solid;
    border-top-width: 8px;
  }
  .bs-t-9-pc {
    border-top-style: solid;
    border-top-width: 9px;
  }
  .bs-t-10-pc {
    border-top-style: solid;
    border-top-width: 10px;
  }

  .bs-r-1-pc {
    border-right-style: solid;
    border-right-width: 1px;
  }
  .bs-r-2-pc {
    border-right-style: solid;
    border-right-width: 2px;
  }
  .bs-r-3-pc {
    border-right-style: solid;
    border-right-width: 3px;
  }
  .bs-r-4-pc {
    border-right-style: solid;
    border-right-width: 4px;
  }
  .bs-r-5-pc {
    border-right-style: solid;
    border-right-width: 5px;
  }
  .bs-r-6-pc {
    border-right-style: solid;
    border-right-width: 6px;
  }
  .bs-r-7-pc {
    border-right-style: solid;
    border-right-width: 7px;
  }
  .bs-r-8-pc {
    border-right-style: solid;
    border-right-width: 8px;
  }
  .bs-r-9-pc {
    border-right-style: solid;
    border-right-width: 9px;
  }
  .bs-r-10-pc {
    border-right-style: solid;
    border-right-width: 10px;
  }

  .bs-l-1-pc {
    border-left-style: solid;
    border-left-width: 1px;
  }
  .bs-l-2-pc {
    border-left-style: solid;
    border-left-width: 2px;
  }
  .bs-l-3-pc {
    border-left-style: solid;
    border-left-width: 3px;
  }
  .bs-l-4-pc {
    border-left-style: solid;
    border-left-width: 4px;
  }
  .bs-l-5-pc {
    border-left-style: solid;
    border-left-width: 5px;
  }
  .bs-l-6-pc {
    border-left-style: solid;
    border-left-width: 6px;
  }
  .bs-l-7-pc {
    border-left-style: solid;
    border-left-width: 7px;
  }
  .bs-l-8-pc {
    border-left-style: solid;
    border-left-width: 8px;
  }
  .bs-l-9-pc {
    border-left-style: solid;
    border-left-width: 9px;
  }
  .bs-l-10-pc {
    border-left-style: solid;
    border-left-width: 10px;
  }

  .bs-b-1-pc {
    border-bottom-style: solid;
    border-bottom-width: 1px;
  }
  .bs-b-2-pc {
    border-bottom-style: solid;
    border-bottom-width: 2px;
  }
  .bs-b-3-pc {
    border-bottom-style: solid;
    border-bottom-width: 3px;
  }
  .bs-b-4-pc {
    border-bottom-style: solid;
    border-bottom-width: 4px;
  }
  .bs-b-5-pc {
    border-bottom-style: solid;
    border-bottom-width: 5px;
  }
  .bs-b-6-pc {
    border-bottom-style: solid;
    border-bottom-width: 6px;
  }
  .bs-b-7-pc {
    border-bottom-style: solid;
    border-bottom-width: 7px;
  }
  .bs-b-8-pc {
    border-bottom-style: solid;
    border-bottom-width: 8px;
  }
  .bs-b-9-pc {
    border-bottom-style: solid;
    border-bottom-width: 9px;
  }
  .bs-b-10-pc {
    border-bottom-style: solid;
    border-bottom-width: 10px;
  }

  .bd-t-1-pc {
    border-top-style: dotted;
    border-top-width: 1px;
  }
  .bd-t-2-pc {
    border-top-style: dotted;
    border-top-width: 2px;
  }
  .bd-t-3-pc {
    border-top-style: dotted;
    border-top-width: 3px;
  }
  .bd-t-4-pc {
    border-top-style: dotted;
    border-top-width: 4px;
  }
  .bd-t-5-pc {
    border-top-style: dotted;
    border-top-width: 5px;
  }
  .bd-t-6-pc {
    border-top-style: dotted;
    border-top-width: 6px;
  }
  .bd-t-7-pc {
    border-top-style: dotted;
    border-top-width: 7px;
  }
  .bd-t-8-pc {
    border-top-style: dotted;
    border-top-width: 8px;
  }
  .bd-t-9-pc {
    border-top-style: dotted;
    border-top-width: 9px;
  }
  .bd-t-10-pc {
    border-top-style: dotted;
    border-top-width: 10px;
  }

  .bd-r-1-pc {
    border-right-style: dotted;
    border-right-width: 1px;
  }
  .bd-r-2-pc {
    border-right-style: dotted;
    border-right-width: 2px;
  }
  .bd-r-3-pc {
    border-right-style: dotted;
    border-right-width: 3px;
  }
  .bd-r-4-pc {
    border-right-style: dotted;
    border-right-width: 4px;
  }
  .bd-r-5-pc {
    border-right-style: dotted;
    border-right-width: 5px;
  }
  .bd-r-6-pc {
    border-right-style: dotted;
    border-right-width: 6px;
  }
  .bd-r-7-pc {
    border-right-style: dotted;
    border-right-width: 7px;
  }
  .bd-r-8-pc {
    border-right-style: dotted;
    border-right-width: 8px;
  }
  .bd-r-9-pc {
    border-right-style: dotted;
    border-right-width: 9px;
  }
  .bd-r-10-pc {
    border-right-style: dotted;
    border-right-width: 10px;
  }

  .bd-l-1-pc {
    border-left-style: dotted;
    border-left-width: 1px;
  }
  .bd-l-2-pc {
    border-left-style: dotted;
    border-left-width: 2px;
  }
  .bd-l-3-pc {
    border-left-style: dotted;
    border-left-width: 3px;
  }
  .bd-l-4-pc {
    border-left-style: dotted;
    border-left-width: 4px;
  }
  .bd-l-5-pc {
    border-left-style: dotted;
    border-left-width: 5px;
  }
  .bd-l-6-pc {
    border-left-style: dotted;
    border-left-width: 6px;
  }
  .bd-l-7-pc {
    border-left-style: dotted;
    border-left-width: 7px;
  }
  .bd-l-8-pc {
    border-left-style: dotted;
    border-left-width: 8px;
  }
  .bd-l-9-pc {
    border-left-style: dotted;
    border-left-width: 9px;
  }
  .bd-l-10-pc {
    border-left-style: dotted;
    border-left-width: 10px;
  }

  .bd-b-1-pc {
    border-bottom-style: dotted;
    border-bottom-width: 1px;
  }
  .bd-b-2-pc {
    border-bottom-style: dotted;
    border-bottom-width: 2px;
  }
  .bd-b-3-pc {
    border-bottom-style: dotted;
    border-bottom-width: 3px;
  }
  .bd-b-4-pc {
    border-bottom-style: dotted;
    border-bottom-width: 4px;
  }
  .bd-b-5-pc {
    border-bottom-style: dotted;
    border-bottom-width: 5px;
  }
  .bd-b-6-pc {
    border-bottom-style: dotted;
    border-bottom-width: 6px;
  }
  .bd-b-7-pc {
    border-bottom-style: dotted;
    border-bottom-width: 7px;
  }
  .bd-b-8-pc {
    border-bottom-style: dotted;
    border-bottom-width: 8px;
  }
  .bd-b-9-pc {
    border-bottom-style: dotted;
    border-bottom-width: 9px;
  }
  .bd-b-10-pc {
    border-bottom-style: dotted;
    border-bottom-width: 10px;
  }
}

/* 
   BORDER RADIUS
-------------------------------------------------------------- */
.br-3 {
  border-radius: 3px;
}
.br-5 {
  border-radius: 5px;
}
.br-8 {
  border-radius: 8px;
}
.br-10 {
  border-radius: 10px;
}
.br-15 {
  border-radius: 15px;
}
.br-20 {
  border-radius: 20px;
}

.br-circle {
  border-radius: 1000px;
}

@media screen and (max-width: 1023px) {
  .br-3-sp {
    border-radius: 3px;
  }
  .br-5-sp {
    border-radius: 5px;
  }
  .br-8-sp {
    border-radius: 8px;
  }
  .br-10-sp {
    border-radius: 10px;
  }
  .br-15-sp {
    border-radius: 15px;
  }
  .br-20-sp {
    border-radius: 20px;
  }

  .br-circle-sp {
    border-radius: 1000px;
  }
}
@media screen and (min-width: 768px) {
  .br-3-tpc {
    border-radius: 3px;
  }
  .br-5-tpc {
    border-radius: 5px;
  }
  .br-8-tpc {
    border-radius: 8px;
  }
  .br-10-tpc {
    border-radius: 10px;
  }
  .br-15-tpc {
    border-radius: 15px;
  }
  .br-20-tpc {
    border-radius: 20px;
  }

  .br-circle-tpc {
    border-radius: 1000px;
  }
}
@media screen and (min-width: 1024px) {
  .br-3-pc {
    border-radius: 3px;
  }
  .br-5-pc {
    border-radius: 5px;
  }
  .br-8-pc {
    border-radius: 8px;
  }
  .br-10-pc {
    border-radius: 10px;
  }
  .br-15-pc {
    border-radius: 15px;
  }
  .br-20-pc {
    border-radius: 20px;
  }

  .br-circle-pc {
    border-radius: 1000px;
  }
}

/*
   コンテンツ幅
--------------------------------------------------------------*/
.w-s {
  padding-left: var(--space-l);
  padding-right: var(--space-l);
}
.w-m {
  padding-left: var(--space-m);
  padding-right: var(--space-m);
}
.w-l {
  padding-left: var(--space-s);
  padding-right: var(--space-s);
}

@media screen and (max-width: 1023px) {
  .w-s-sp {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
  }
  .w-m-sp {
    padding-left: var(--space-m);
    padding-right: var(--space-m);
  }
  .w-l-sp {
    padding-left: var(--space-s);
    padding-right: var(--space-s);
  }
}
@media screen and (min-width: 768px) {
  .w-s-tpc {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
  }
  .w-m-tpc {
    padding-left: var(--space-m);
    padding-right: var(--space-m);
  }
  .w-l-tpc {
    padding-left: var(--space-s);
    padding-right: var(--space-s);
  }
}
@media screen and (min-width: 1024px) {
  .w-s-pc {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
  }
  .w-m-pc {
    padding-left: var(--space-m);
    padding-right: var(--space-m);
  }
  .w-l-pc {
    padding-left: var(--space-s);
    padding-right: var(--space-s);
  }
}

/*
   画像の大きさ
--------------------------------------------------------------*/
.img-square {
  aspect-ratio: 1 / 1;
}
.img-silver {
  aspect-ratio: 10 / 7.072;
}
.img-gold {
  aspect-ratio: 10 / 6.18;
}
.img-platina {
  aspect-ratio: 10 / 5.774;
}
.img-4-3 {
  aspect-ratio: 4 / 3;
}
.img-3-4 {
  aspect-ratio: 3 / 4;
}
.img-movie {
  aspect-ratio: 16 / 9;
}

@media screen and (max-width: 1023px) {
  .img-square-sp {
    aspect-ratio: 1 / 1;
  }
  .img-silver-sp {
    aspect-ratio: 10 / 7.072;
  }
  .img-gold-sp {
    aspect-ratio: 10 / 6.18;
  }
  .img-platina-sp {
    aspect-ratio: 10 / 5.774;
  }
  .img-4-3-sp {
    aspect-ratio: 4 / 3;
  }
  .img-3-4-sp {
    aspect-ratio: 3 / 4;
  }
  .img-movie-sp {
    aspect-ratio: 16 / 9;
  }
}
@media screen and (min-width: 768px) {
  .img-square-tpc {
    aspect-ratio: 1 / 1;
  }
  .img-silver-tpc {
    aspect-ratio: 10 / 7.072;
  }
  .img-gold-tpc {
    aspect-ratio: 10 / 6.18;
  }
  .img-platina-tpc {
    aspect-ratio: 10 / 5.774;
  }
  .img-4-3-tpc {
    aspect-ratio: 4 / 3;
  }
  .img-3-4-tpc {
    aspect-ratio: 3 / 4;
  }
  .img-movie-tpc {
    aspect-ratio: 16 / 9;
  }
}
@media screen and (min-width: 1024px) {
  .img-square-pc {
    aspect-ratio: 1 / 1;
  }
  .img-silver-pc {
    aspect-ratio: 10 / 7.072;
  }
  .img-gold-pc {
    aspect-ratio: 10 / 6.18;
  }
  .img-platina-pc {
    aspect-ratio: 10 / 5.774;
  }
  .img-4-3-pc {
    aspect-ratio: 4 / 3;
  }
  .img-3-4-pc {
    aspect-ratio: 3 / 4;
  }
  .img-movie-pc {
    aspect-ratio: 16 / 9;
  }
}

/*
   要素を中央寄せにする
--------------------------------------------------------------*/
.p-container {
  position: relative;
}
:where(.p-container) .p-item-c {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 1023px) {
  .p-container-sp {
    position: relative;
  }
  :where(.p-container-sp) .p-item-c {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}
@media screen and (min-width: 768px) {
  .p-container-tpc {
    position: relative;
  }
  :where(.p-container-tpc) .p-item-c {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}
@media screen and (min-width: 1024px) {
  .p-container-sp {
    position: relative;
  }
  :where(.p-container-sp) .p-item-c {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}

/*
   丸・三角
--------------------------------------------------------------*/
.clip-circle {
  clip-path: circle(50% at 50% 50%);
}
.clip-arrow-t {
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.clip-arrow-r {
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.clip-arrow-b {
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.clip-arrow-l {
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
}

@media screen and (max-width: 1023px) {
  .clip-circle-sp {
    clip-path: circle(50% at 50% 50%);
  }
  .clip-arrow-t-sp {
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }
  .clip-arrow-r-sp {
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  .clip-arrow-b-sp {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .clip-arrow-l-sp {
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
  }
}
@media screen and (min-width: 768px) {
  .clip-circle-tpc {
    clip-path: circle(50% at 50% 50%);
  }
  .clip-arrow-t-tpc {
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }
  .clip-arrow-r-tpc {
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  .clip-arrow-b-tpc {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .clip-arrow-l-tpc {
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
  }
}
@media screen and (min-width: 1024px) {
  .clip-circle-pc {
    clip-path: circle(50% at 50% 50%);
  }
  .clip-arrow-t-pc {
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }
  .clip-arrow-r-pc {
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
  .clip-arrow-b-pc {
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
  .clip-arrow-l-pc {
    clip-path: polygon(0 50%, 100% 0, 100% 100%);
  }
}
/*
   Z-INDEX
--------------------------------------------------------------*/
.z-0 {
  z-index: 0;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-60 {
  z-index: 60;
}
.z-70 {
  z-index: 70;
}
.z-80 {
  z-index: 80;
}
.z-90 {
  z-index: 90;
}
.z-100 {
  z-index: 100;
}
.z-110 {
  z-index: 110;
}
.z-120 {
  z-index: 120;
}
.z-130 {
  z-index: 130;
}
.z-140 {
  z-index: 140;
}
.z-150 {
  z-index: 150;
}
.z-160 {
  z-index: 160;
}
.z-170 {
  z-index: 170;
}
.z-180 {
  z-index: 180;
}
.z-190 {
  z-index: 190;
}
.z-200 {
  z-index: 200;
}
.z-210 {
  z-index: 210;
}
.z-220 {
  z-index: 220;
}
.z-230 {
  z-index: 230;
}
.z-240 {
  z-index: 240;
}
.z-250 {
  z-index: 250;
}
.z-260 {
  z-index: 260;
}
.z-270 {
  z-index: 270;
}
.z-280 {
  z-index: 280;
}
.z-290 {
  z-index: 290;
}
.z-300 {
  z-index: 300;
}
.z-310 {
  z-index: 310;
}
.z-320 {
  z-index: 320;
}
.z-330 {
  z-index: 330;
}
.z-340 {
  z-index: 340;
}
.z-350 {
  z-index: 350;
}
.z-360 {
  z-index: 360;
}
.z-370 {
  z-index: 370;
}
.z-380 {
  z-index: 380;
}
.z-390 {
  z-index: 390;
}
.z-400 {
  z-index: 400;
}
.z-410 {
  z-index: 410;
}
.z-420 {
  z-index: 420;
}
.z-430 {
  z-index: 430;
}
.z-440 {
  z-index: 440;
}
.z-450 {
  z-index: 450;
}
.z-460 {
  z-index: 460;
}
.z-470 {
  z-index: 470;
}
.z-480 {
  z-index: 480;
}
.z-490 {
  z-index: 490;
}
.z-500 {
  z-index: 500;
}

@media screen and (max-width: 1023px) {
  .z-0-sp {
    z-index: 0;
  }
  .z-10-sp {
    z-index: 10;
  }
  .z-20-sp {
    z-index: 20;
  }
  .z-30-sp {
    z-index: 30;
  }
  .z-40-sp {
    z-index: 40;
  }
  .z-50-sp {
    z-index: 50;
  }
  .z-60-sp {
    z-index: 60;
  }
  .z-70-sp {
    z-index: 70;
  }
  .z-80-sp {
    z-index: 80;
  }
  .z-90-sp {
    z-index: 90;
  }
  .z-100-sp {
    z-index: 100;
  }
  .z-110-sp {
    z-index: 110;
  }
  .z-120-sp {
    z-index: 120;
  }
  .z-130-sp {
    z-index: 130;
  }
  .z-140-sp {
    z-index: 140;
  }
  .z-150-sp {
    z-index: 150;
  }
  .z-160-sp {
    z-index: 160;
  }
  .z-170-sp {
    z-index: 170;
  }
  .z-180-sp {
    z-index: 180;
  }
  .z-190-sp {
    z-index: 190;
  }
  .z-200-sp {
    z-index: 200;
  }
  .z-210-sp {
    z-index: 210;
  }
  .z-220-sp {
    z-index: 220;
  }
  .z-230-sp {
    z-index: 230;
  }
  .z-240-sp {
    z-index: 240;
  }
  .z-250-sp {
    z-index: 250;
  }
  .z-260-sp {
    z-index: 260;
  }
  .z-270-sp {
    z-index: 270;
  }
  .z-280-sp {
    z-index: 280;
  }
  .z-290-sp {
    z-index: 290;
  }
  .z-300-sp {
    z-index: 300;
  }
  .z-310-sp {
    z-index: 310;
  }
  .z-320-sp {
    z-index: 320;
  }
  .z-330-sp {
    z-index: 330;
  }
  .z-340-sp {
    z-index: 340;
  }
  .z-350-sp {
    z-index: 350;
  }
  .z-360-sp {
    z-index: 360;
  }
  .z-370-sp {
    z-index: 370;
  }
  .z-380-sp {
    z-index: 380;
  }
  .z-390-sp {
    z-index: 390;
  }
  .z-400-sp {
    z-index: 400;
  }
  .z-410-sp {
    z-index: 410;
  }
  .z-420-sp {
    z-index: 420;
  }
  .z-430-sp {
    z-index: 430;
  }
  .z-440-sp {
    z-index: 440;
  }
  .z-450-sp {
    z-index: 450;
  }
  .z-460-sp {
    z-index: 460;
  }
  .z-470-sp {
    z-index: 470;
  }
  .z-480-sp {
    z-index: 480;
  }
  .z-490-sp {
    z-index: 490;
  }
  .z-500-sp {
    z-index: 500;
  }
}
@media screen and (min-width: 768px) {
  .z-0-tpc {
    z-index: 0;
  }
  .z-10-tpc {
    z-index: 10;
  }
  .z-20-tpc {
    z-index: 20;
  }
  .z-30-tpc {
    z-index: 30;
  }
  .z-40-tpc {
    z-index: 40;
  }
  .z-50-tpc {
    z-index: 50;
  }
  .z-60-tpc {
    z-index: 60;
  }
  .z-70-tpc {
    z-index: 70;
  }
  .z-80-tpc {
    z-index: 80;
  }
  .z-90-tpc {
    z-index: 90;
  }
  .z-100-tpc {
    z-index: 100;
  }
  .z-110-tpc {
    z-index: 110;
  }
  .z-120-tpc {
    z-index: 120;
  }
  .z-130-tpc {
    z-index: 130;
  }
  .z-140-tpc {
    z-index: 140;
  }
  .z-150-tpc {
    z-index: 150;
  }
  .z-160-tpc {
    z-index: 160;
  }
  .z-170-tpc {
    z-index: 170;
  }
  .z-180-tpc {
    z-index: 180;
  }
  .z-190-tpc {
    z-index: 190;
  }
  .z-200-tpc {
    z-index: 200;
  }
  .z-210-tpc {
    z-index: 210;
  }
  .z-220-tpc {
    z-index: 220;
  }
  .z-230-tpc {
    z-index: 230;
  }
  .z-240-tpc {
    z-index: 240;
  }
  .z-250-tpc {
    z-index: 250;
  }
  .z-260-tpc {
    z-index: 260;
  }
  .z-270-tpc {
    z-index: 270;
  }
  .z-280-tpc {
    z-index: 280;
  }
  .z-290-tpc {
    z-index: 290;
  }
  .z-300-tpc {
    z-index: 300;
  }
  .z-310-tpc {
    z-index: 310;
  }
  .z-320-tpc {
    z-index: 320;
  }
  .z-330-tpc {
    z-index: 330;
  }
  .z-340-tpc {
    z-index: 340;
  }
  .z-350-tpc {
    z-index: 350;
  }
  .z-360-tpc {
    z-index: 360;
  }
  .z-370-tpc {
    z-index: 370;
  }
  .z-380-tpc {
    z-index: 380;
  }
  .z-390-tpc {
    z-index: 390;
  }
  .z-400-tpc {
    z-index: 400;
  }
  .z-410-tpc {
    z-index: 410;
  }
  .z-420-tpc {
    z-index: 420;
  }
  .z-430-tpc {
    z-index: 430;
  }
  .z-440-tpc {
    z-index: 440;
  }
  .z-450-tpc {
    z-index: 450;
  }
  .z-460-tpc {
    z-index: 460;
  }
  .z-470-tpc {
    z-index: 470;
  }
  .z-480-tpc {
    z-index: 480;
  }
  .z-490-tpc {
    z-index: 490;
  }
  .z-500-tpc {
    z-index: 500;
  }
}
@media screen and (min-width: 1024px) {
  .z-0-pc {
    z-index: 0;
  }
  .z-10-pc {
    z-index: 10;
  }
  .z-20-pc {
    z-index: 20;
  }
  .z-30-pc {
    z-index: 30;
  }
  .z-40-pc {
    z-index: 40;
  }
  .z-50-pc {
    z-index: 50;
  }
  .z-60-pc {
    z-index: 60;
  }
  .z-70-pc {
    z-index: 70;
  }
  .z-80-pc {
    z-index: 80;
  }
  .z-90-pc {
    z-index: 90;
  }
  .z-100-pc {
    z-index: 100;
  }
  .z-110-pc {
    z-index: 110;
  }
  .z-120-pc {
    z-index: 120;
  }
  .z-130-pc {
    z-index: 130;
  }
  .z-140-pc {
    z-index: 140;
  }
  .z-150-pc {
    z-index: 150;
  }
  .z-160-pc {
    z-index: 160;
  }
  .z-170-pc {
    z-index: 170;
  }
  .z-180-pc {
    z-index: 180;
  }
  .z-190-pc {
    z-index: 190;
  }
  .z-200-pc {
    z-index: 200;
  }
  .z-210-pc {
    z-index: 210;
  }
  .z-220-pc {
    z-index: 220;
  }
  .z-230-pc {
    z-index: 230;
  }
  .z-240-pc {
    z-index: 240;
  }
  .z-250-pc {
    z-index: 250;
  }
  .z-260-pc {
    z-index: 260;
  }
  .z-270-pc {
    z-index: 270;
  }
  .z-280-pc {
    z-index: 280;
  }
  .z-290-pc {
    z-index: 290;
  }
  .z-300-pc {
    z-index: 300;
  }
  .z-310-pc {
    z-index: 310;
  }
  .z-320-pc {
    z-index: 320;
  }
  .z-330-pc {
    z-index: 330;
  }
  .z-340-pc {
    z-index: 340;
  }
  .z-350-pc {
    z-index: 350;
  }
  .z-360-pc {
    z-index: 360;
  }
  .z-370-pc {
    z-index: 370;
  }
  .z-380-pc {
    z-index: 380;
  }
  .z-390-pc {
    z-index: 390;
  }
  .z-400-pc {
    z-index: 400;
  }
  .z-410-pc {
    z-index: 410;
  }
  .z-420-pc {
    z-index: 420;
  }
  .z-430-pc {
    z-index: 430;
  }
  .z-440-pc {
    z-index: 440;
  }
  .z-450-pc {
    z-index: 450;
  }
  .z-460-pc {
    z-index: 460;
  }
  .z-470-pc {
    z-index: 470;
  }
  .z-480-pc {
    z-index: 480;
  }
  .z-490-pc {
    z-index: 490;
  }
  .z-500-pc {
    z-index: 500;
  }
}

/*
   その他
--------------------------------------------------------------*/
.db {
  display: block;
}
.di {
  display: inline-block;
}
.nw {
  white-space: nowrap;
}

.p-r {
  position: relative;
}
.p-a {
  position: absolute;
}
.p-f {
  position: fixed;
}

.p-initial {
  top: 0;
  left: 0;
}

:where(.pc, .tpc) {
  display: none;
}

@media screen and (max-width: 1023px) {
  .db-sp {
    display: block;
  }
  .di-sp {
    display: inline-block;
  }
  .nw-sp {
    white-space: nowrap;
  }

  .p-r-sp {
    position: relative;
  }
  .p-a-sp {
    position: absolute;
  }
  .p-f-sp {
    position: fixed;
  }

  .p-initial-sp {
    top: 0;
    left: 0;
  }
}
@media screen and (min-width: 768px) {
  .db-tpc {
    display: block;
  }
  .di-tpc {
    display: inline-block;
  }
  .nw-tpc {
    white-space: nowrap;
  }

  .p-r-tpc {
    position: relative;
  }
  .p-a-tpc {
    position: absolute;
  }
  .p-f-tpc {
    position: fixed;
  }

  .p-initial-tpc {
    top: 0;
    left: 0;
  }
}
@media screen and (min-width: 1024px) {
  .db-pc {
    display: block;
  }
  .di-pc {
    display: inline-block;
  }
  .nw-pc {
    white-space: nowrap;
  }

  .p-r-pc {
    position: relative;
  }
  .p-a-pc {
    position: absolute;
  }
  .p-f-pc {
    position: fixed;
  }

  .p-initial-pc {
    top: 0;
    left: 0;
  }
}

/*
   OVERFLOW
--------------------------------------------------------------*/
.of-hidden {
  overflow: hidden;
}
.of-x-hidden {
  overflow-x: hidden;
}
.of-y-hidden {
  overflow-y: hidden;
}
.of-x-scroll {
  overflow-x: scroll;
}
.of-y-scroll {
  overflow-y: scroll;
}
.of-x-scroll::-webkit-scrollbar {
  height: 8px;
}
.of-y-scroll::-webkit-scrollbar {
  width: 8px;
}
.of-x-scroll::-webkit-scrollbar-track,
.of-y-scroll::-webkit-scrollbar-track {
  background-color: transparent;
}
.of-x-scroll::-webkit-scrollbar-thumb,
.of-y-scroll::-webkit-scrollbar-thumb {
  background-color: var(--color-base1);
  border-radius: 10px;
}
.scrollbar-none::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 1023px) {
  .of-hidden-sp {
    overflow: hidden;
  }
  .of-x-hidden-sp {
    overflow-x: hidden;
  }
  .of-y-hidden-sp {
    overflow-y: hidden;
  }
  .of-x-scroll-sp {
    overflow-x: scroll;
  }
  .of-y-scroll-sp {
    overflow-y: scroll;
  }
  .of-x-scroll-sp::-webkit-scrollbar {
    height: 8px;
  }
  .of-y-scroll-sp::-webkit-scrollbar {
    width: 8px;
  }
  .of-x-scroll-sp::-webkit-scrollbar-track,
  .of-y-scroll-sp::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .of-x-scroll-sp::-webkit-scrollbar-thumb,
  .of-y-scroll-sp::-webkit-scrollbar-thumb {
    background-color: var(--color-base1);
    border-radius: 10px;
  }
  .scrollbar-none-sp::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .of-hidden-tpc {
    overflow: hidden;
  }
  .of-x-hidden-tpc {
    overflow-x: hidden;
  }
  .of-y-hidden-tpc {
    overflow-y: hidden;
  }
  .of-x-scroll-tpc {
    overflow-x: scroll;
  }
  .of-y-scroll-tpc {
    overflow-y: scroll;
  }
  .of-x-scroll-tpc::-webkit-scrollbar {
    height: 8px;
  }
  .of-y-scroll-tpc::-webkit-scrollbar {
    width: 8px;
  }
  .of-x-scroll-tpc::-webkit-scrollbar-track,
  .of-y-scroll-tpc::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .of-x-scroll-tpc::-webkit-scrollbar-thumb,
  .of-y-scroll-tpc::-webkit-scrollbar-thumb {
    background-color: var(--color-base1);
    border-radius: 10px;
  }
  .scrollbar-none-tpc::-webkit-scrollbar {
    display: none;
  }
}
@media screen and (min-width: 1024px) {
  .of-hidden-pc {
    overflow: hidden;
  }
  .of-x-hidden-pc {
    overflow-x: hidden;
  }
  .of-y-hidden-pc {
    overflow-y: hidden;
  }
  .of-x-scroll-pc {
    overflow-x: scroll;
  }
  .of-y-scroll-pc {
    overflow-y: scroll;
  }
  .of-x-scroll-pc::-webkit-scrollbar {
    width: 8px;
  }
  .of-y-scroll-pc::-webkit-scrollbar {
    height: 8px;
  }
  .of-x-scroll-pc::-webkit-scrollbar-track,
  .of-y-scroll-pc::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .of-x-scroll-pc::-webkit-scrollbar-thumb,
  .of-y-scroll-pc::-webkit-scrollbar-thumb {
    background-color: var(--color-base2);
    border-radius: 10px;
  }
  .scrollbar-none-pc::-webkit-scrollbar {
    display: none;
  }
}

/*
   NONE or ONLY
--------------------------------------------------------------*/

@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }
  .tpc {
    display: none;
  }
  .sp {
    display: block;
  }
  .only-pc {
    display: none;
  }
  .only-tpc {
    display: none;
  }
  .only-sp {
    display: block;
  }
  .none-sp {
    display: none !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .tpc {
    display: block;
  }
  .only-sp {
    display: none;
  }
  .only-pc {
    display: none;
  }
  .only-tpc {
    display: block;
  }
  .none-tpc {
    display: none !important;
  }
}

@media screen and (min-width: 1024px) {
  .sp {
    display: none;
  }
  .tpc {
    display: block;
  }
  .pc {
    display: block;
  }
  .only-sp {
    display: none;
  }
  .only-tpc {
    display: none;
  }
  .only-pc {
    display: block;
  }
  .none-pc {
    display: none !important;
  }
}

/*
   Cancellation
--------------------------------------------------------------*/
.p-0 {
  padding: 0;
}
.ptb-0 {
  padding-top: 0;
  padding-bottom: 0;
}
.prl-0 {
  padding-right: 0;
  padding-left: 0;
}
.pt-0 {
  padding-top: 0;
}
.pr-0 {
  padding-right: 0;
}
.pl-0 {
  padding-left: 0;
}
.pb-0 {
  padding-bottom: 0;
}

.m-0 {
  margin: 0;
}
.mtb-0 {
  margin-top: 0;
  margin-bottom: 0;
}
.mrl-0 {
  margin-right: 0;
  margin-left: 0;
}
.mt-0 {
  margin-top: 0;
}
.mr-0 {
  margin-right: 0;
}
.ml-0 {
  margin-left: 0;
}
.mb-0 {
  margin-bottom: 0;
}

.l-0 {
  line-height: 0;
}

.g-0 {
  gap: 0;
}
.g-c-0 {
  column-gap: 0;
}
.g-r-0 {
  row-gap: 0;
}

.bs-0 {
  border: none;
}
.bd-0 {
  border: none;
}
@media screen and (max-width: 1023px) {
  .p-0-sp {
    padding: 0;
  }
  .ptb-0-sp {
    padding-top: 0;
    padding-bottom: 0;
  }
  .prl-0-sp {
    padding-right: 0;
    padding-left: 0;
  }
  .pt-0-sp {
    padding-top: 0;
  }
  .pr-0-sp {
    padding-right: 0;
  }
  .pl-0-sp {
    padding-left: 0;
  }
  .pb-0-sp {
    padding-bottom: 0;
  }

  .m-0-sp {
    margin: 0;
  }
  .mtb-0-sp {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mrl-0-sp {
    margin-right: 0;
    margin-left: 0;
  }
  .mt-0-sp {
    margin-top: 0;
  }
  .mr-0-sp {
    margin-right: 0;
  }
  .ml-0-sp {
    margin-left: 0;
  }
  .mb-0-sp {
    margin-bottom: 0;
  }

  .l-0-sp {
    line-height: 0;
  }

  .g-0-sp {
    gap: 0;
  }
  .g-c-0-sp {
    column-gap: 0;
  }
  .g-r-0-sp {
    row-gap: 0;
  }

  .bs-0-sp {
    border: none;
  }
  .bd-0-sp {
    border: none;
  }
}
@media screen and (min-width: 768px) {
  .p-0-tpc {
    padding: 0;
  }
  .ptb-0-tpc {
    padding-top: 0;
    padding-bottom: 0;
  }
  .prl-0-tpc {
    padding-right: 0;
    padding-left: 0;
  }
  .pt-0-tpc {
    padding-top: 0;
  }
  .pr-0-tpc {
    padding-right: 0;
  }
  .pl-0-tpc {
    padding-left: 0;
  }
  .pb-0-tpc {
    padding-bottom: 0;
  }

  .m-0-tpc {
    margin: 0;
  }
  .mtb-0-tpc {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mrl-0-tpc {
    margin-right: 0;
    margin-left: 0;
  }
  .mt-0-tpc {
    margin-top: 0;
  }
  .mr-0-tpc {
    margin-right: 0;
  }
  .ml-0-tpc {
    margin-left: 0;
  }
  .mb-0-tpc {
    margin-bottom: 0;
  }

  .l-0-tpc {
    line-height: 0;
  }

  .g-0-tpc {
    gap: 0;
  }
  .g-c-0-tpc {
    column-gap: 0;
  }
  .g-r-0-tpc {
    row-gap: 0;
  }

  .bs-0-tpc {
    border: none;
  }
  .bd-0-tpc {
    border: none;
  }
}
@media screen and (min-width: 1024px) {
  .p-0-pc {
    padding: 0;
  }
  .ptb-0-pc {
    padding-top: 0;
    padding-bottom: 0;
  }
  .prl-0-pc {
    padding-right: 0;
    padding-left: 0;
  }
  .pt-0-pc {
    padding-top: 0;
  }
  .pr-0-pc {
    padding-right: 0;
  }
  .pl-0-pc {
    padding-left: 0;
  }
  .pb-0-pc {
    padding-bottom: 0;
  }

  .m-0-pc {
    margin: 0;
  }
  .mtb-0-pc {
    margin-top: 0;
    margin-bottom: 0;
  }
  .mrl-0-pc {
    margin-right: 0;
    margin-left: 0;
  }
  .mt-0-pc {
    margin-top: 0;
  }
  .mr-0-pc {
    margin-right: 0;
  }
  .ml-0-pc {
    margin-left: 0;
  }
  .mb-0-pc {
    margin-bottom: 0;
  }

  .l-0-pc {
    line-height: 0;
  }

  .g-0-pc {
    gap: 0;
  }
  .g-c-0-pc {
    column-gap: 0;
  }
  .g-r-0-pc {
    row-gap: 0;
  }

  .bs-0-pc {
    border: none;
  }
  .bd-0-pc {
    border: none;
  }
}

.td-01 {
  transition-delay: 0.1s;
}
.td-02 {
  transition-delay: 0.2s;
}
.td-03 {
  transition-delay: 0.3s;
}
.td-04 {
  transition-delay: 0.4s;
}
.td-05 {
  transition-delay: 0.5s;
}
.td-06 {
  transition-delay: 0.6s;
}
.td-07 {
  transition-delay: 0.7s;
}
.td-08 {
  transition-delay: 0.8s;
}
.td-09 {
  transition-delay: 0.9s;
}
.td-10 {
  transition-delay: 1s;
}

@media screen and (max-width: 1023px) {
  .td-01-sp {
    transition-delay: 0.1s;
  }
  .td-02-sp {
    transition-delay: 0.2s;
  }
  .td-03-sp {
    transition-delay: 0.3s;
  }
  .td-04-sp {
    transition-delay: 0.4s;
  }
  .td-05-sp {
    transition-delay: 0.5s;
  }
  .td-06-sp {
    transition-delay: 0.6s;
  }
  .td-07-sp {
    transition-delay: 0.7s;
  }
  .td-08-sp {
    transition-delay: 0.8s;
  }
  .td-09-sp {
    transition-delay: 0.9s;
  }
  .td-10-sp {
    transition-delay: 1s;
  }
}

@media screen and (min-width: 768px) {
  .td-01-tpc {
    transition-delay: 0.1s;
  }
  .td-02-tpc {
    transition-delay: 0.2s;
  }
  .td-03-tpc {
    transition-delay: 0.3s;
  }
  .td-04-tpc {
    transition-delay: 0.4s;
  }
  .td-05-tpc {
    transition-delay: 0.5s;
  }
  .td-06-tpc {
    transition-delay: 0.6s;
  }
  .td-07-tpc {
    transition-delay: 0.7s;
  }
  .td-08-tpc {
    transition-delay: 0.8s;
  }
  .td-09-tpc {
    transition-delay: 0.9s;
  }
  .td-10-tpc {
    transition-delay: 1s;
  }
}

@media screen and (min-width: 1024px) {
  .td-01-pc {
    transition-delay: 0.1s;
  }
  .td-02-pc {
    transition-delay: 0.2s;
  }
  .td-03-pc {
    transition-delay: 0.3s;
  }
  .td-04-pc {
    transition-delay: 0.4s;
  }
  .td-05-pc {
    transition-delay: 0.5s;
  }
  .td-06-pc {
    transition-delay: 0.6s;
  }
  .td-07-pc {
    transition-delay: 0.7s;
  }
  .td-08-pc {
    transition-delay: 0.8s;
  }
  .td-09-pc {
    transition-delay: 0.9s;
  }
  .td-10-pc {
    transition-delay: 1s;
  }
}