@charset "utf-8";

/* 
=================================================================================

▼▼▼　テンプレJS用のCSS。不要なものは削除　▼▼▼

=================================================================================
*/
html {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: normal;
  line-height: 1.2;
  color: #000;
}
h1, h2, h3, h4, h5 {
  line-height: 1.2;
}
@media screen and (min-width: 769px) {
  /* PC用 */
  html {
    font-size: 10px;
  }
  .inner {
    position: relative;
    max-width: 100%;
    display: block;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  /* SP用 */
  html {
    font-size: calc(10vw / 500 * 100); /* 最大値768px、文字サイズ10pxの場合 */
  }
  .inner {
    width: 100%;
    padding: 0 5rem;
    max-width: 100%;
    margin: auto;
  }
}


/* 
=================================================================================

▼▼▼　文字　▼▼▼

=================================================================================
*/
.go {
  font-family: "Noto Sans JP", sans-serif;
}
.pop {
  font-family: "Poppins", sans-serif;
}
.b {
  font-weight: bold;
}
.m {
  font-weight: 500;
}
/* googleマテリアルアイコン */
body .material-icons-outlined {
  font-size: inherit;
}
/* 
=================================================================================

▼▼▼　ちらつき対策（CSS）　▼▼▼

=================================================================================
*/

.loading {
  position: fixed;
  background: #fff;
  z-index: 9999;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 1s all;
  opacity: 1;
  pointer-events: all;
}

/* 
=================================================================================

▼▼▼　SP用フローティングメニュー　▼▼▼

=================================================================================
*/

.floatig_menu {
  position: sticky;
  bottom: 0;
  left: 0;
  padding: 3rem;
  width: 100%;
  background: #000;
  color: #fff;
  z-index: 9;
  transition: 1s all;
}
/* 
=================================================================================

▼▼▼　先頭へ戻る　▼▼▼

=================================================================================
*/

.go_head {
  border-radius: 50%;
  position: fixed;
  z-index:5;
  right: 5rem;
  bottom: -5rem;
  overflow: hidden;
  transition: 1s all;
  opacity: 0;
  filter: alpha(opacity=0);
}
.nav_active .go_head {
  bottom: 5rem;
  opacity: 1;
  filter: alpha(opacity=100);
}
.go_head > a {
  width: 3em;
  height: 3em;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  color: #fff;
}
.go_head > a:before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #000;
  pointer-events: none;
  border-radius: 50%;
  transition: 1s all;
  z-index: -1;
}
.go_head > a:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #C30D23;
  pointer-events: none;
  border-radius: 50%;
  transform: scale(0);
  transition: 1s all;
  animation: go_head_remove 0.5s 1 forwards;
}
@keyframes go_head_remove {
  0% { transform: scale(1); }
  40% { transform: scale(0.4); }
  50% { transform: scale(0.6); }
  100% { transform: scale(0); }
}
.go_head:hover > a:after {
  animation: go_head_move 0.5s 1 forwards;
}
@keyframes go_head_move {
  0% { transform: scale(0); }
  40% { transform: scale(0.6); }
  50% { transform: scale(0.4); }
  100% { transform: scale(1); }
}
.go_head > a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.go_head > a .content {
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {/* SP用 */
  .nav_active .go_head {
    bottom: 30vw;
  }
}

body {
  width: 100%;
}

.wrapper {
  width: 100%;
  overflow: hidden;
  overflow: clip;
  position: relative;
}

/* ID登録用 */
i[id] {
  font-size: 0;
  display: block;
}

/* 文字とアイコン */
.tpbox {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
}

.tpbox img {
  vertical-align: baseline;
}

/* 
=================================================================================

▼▼▼　カラー　▼▼▼

=================================================================================
*/
.bg_green{
  background-color: rgba(224, 245, 246, 1);
}
.bg_green-curel{
  background-color: rgba(0, 176, 185, 1);
}
.bg_white{
  background-color: rgba(255, 255, 255, 1);
}
.bg_alice_blue{
  background-color: rgba(228, 243, 255, 1);
}
/* 
=================================================================================

▼▼▼　カスタム　▼▼▼

=================================================================================
*/

main{
  position: relative;
}
.welcia_inner{
  max-width: 50rem;
  margin: auto;
  padding: 2rem;
  background-color: #ffffff;
}
.welcia_box{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.welcia_logo{
  width: 11rem;
}
.welcia_text1{
  font-size: 2.6rem;
  color: rgba(11, 49, 143, 1);
  font-weight: 700;
}
.welcia_text2{
  font-size: 1.4rem;
  color: rgba(11, 49, 143, 0.7);
  font-weight: 700;
  margin-top: 1rem;
}
.main_inner{
  max-width: 50rem;
  margin: auto;
  background-color: #ffffff;
}
.sec_inner{
  max-width: 42rem;
  margin: auto;
  padding: 2rem 0 4rem;
}
.sec_title01{
  font-size: 2.6rem;
  color: rgba(51, 51, 51, 1);
  font-weight: 700;
  text-align: center;
  padding: 2rem 0;
  margin-top: 4rem;
  background-color: rgba(247, 239, 255, 1);
  border-top: solid 0.4rem rgba(231, 90, 153, 1);
  border-bottom: solid 0.4rem rgba(231, 90, 153, 1);
}
.sec_title01 span{
  font-size: 2rem;
}
.img_t2{
  margin-top: 2rem;
}
.img_t4{
  margin-top: 4rem;
}
.product01_box{
  text-align: center;
  padding: 4rem;
}
.product01_top{
  font-size: 2.6rem;
  color: rgba(255, 255, 255, 1);
  text-align: center;
  padding: 2rem 0;
  font-weight: 700;
}
.product01_pad{
  width: 28rem;
  margin: auto;
  padding: 3rem 0;
}
.product01_img{
  width: 22rem;
  margin: auto;
}
.product01_img2{
  width: 18rem;
  margin: auto;
}
.product01_text01{
  margin-top: 2rem;
}
.product01_text01 p{
  width: 100%;
  height: 4.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: rgba(0, 120, 126, 1);
}
.product01_text02{
  font-size: 1.4rem;
  color: rgba(0, 120, 126, 1);
  font-weight: 400;
  margin-top: 0.5rem;
  line-height: 1.8;
}
.product01_text02_02{
  text-align: center;
  margin: 2rem 0;
}
.product01_text02 span{
  border: solid 0.1rem rgba(0, 120, 126, 1);
  padding: 0.2rem 0.5rem;
  margin-right: 1rem;
}
.product01_text03{
  font-size: 2.6rem;
  color: rgba(0, 176, 185, 1);
  font-weight: 700;
  margin-top: 2rem;
  padding-bottom: 3rem;
}
.about01_box{
  padding: 2rem 4rem;
}
.about01_title_box{
  font-size: 2.6rem;
  font-weight: 700;
  color: rgba(0, 176, 185, 1);
  padding: 0 2.2rem 1rem;
  border-bottom: solid 0.2rem rgba(0, 176, 185, 1);
  display: flex;
  align-items: center;
}
.about01_title_box img{
  width: 6.4rem;
}
.about01_inner{
  max-width: 34rem;
  margin: auto;
}
.about01_img_box{
  font-size: 1.4rem;
  font-weight: 400;
  margin-top: 2rem;
}
.about01_img_box p{
  margin-top: 1rem;
}
.line_up_top{
  border-top: solid rgba(0, 176, 185, 1) 3rem;
}
.line_up_inner{
  width: 46rem;
  margin: auto;
  padding-top: 3rem ;
}
.line_up_title{
  font-size: 2.6rem;
  color: rgba(0, 176, 185, 1);
  font-weight: 700;
  text-align: center;
  padding-bottom: 1rem;
  border-bottom: solid rgba(0, 176, 185, 1) 0.2rem;
}
.line_up_text{
  text-align: center;
  margin-top: 3rem;
}
.line_up_text h3{
  font-size: 2.3rem;
  font-weight: 700;
  color: rgba(0, 120, 126, 1);
}
.line_up_text p{
  font-size: 1.8rem;
  font-weight: 400;
  color: rgba(0, 120, 126, 1);
  margin-top: 1rem;
}
.line_up_list{
  display: flex;
  align-items: start;
  justify-content: space-between;
  margin-top: 3rem;
  flex-wrap: wrap;
  gap: 4rem 0;
}
.line_up_list li{
  width: 49%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.line_up_link{
  font-size: 1.4rem;
  color: rgba(0, 120, 126, 1);
  font-weight: 400;
  text-decoration: underline;
}
.line_up_list_text{
  font-size: 1.4rem;
  color: rgba(51, 51, 51, 1);
  font-weight: 400;
  line-height: 1.5;
}
.line_up_list_text span{
  font-size: 1rem;
}
.footer_inner{
  max-width: 50rem;
  margin: auto;
  background-color: #ffffff;
}
.footer_box01{
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 2rem;
  padding: 2rem 4rem 4rem 4rem;
}
.footer_logo{
  width: 10rem;
}
.footer_text{
  font-size: 2.3rem;
  color: rgba(11, 49, 143, 1);
  font-weight: 700;
  text-align: center;
}
.footer_text span{
  font-size: 1.4rem;
}
.footer_box02{
  background-color: rgba(102, 102, 102, 1);
  padding: 4rem;
  color: rgba(255, 255, 255, 1);
  text-align: center;
}
.foot_contact01{
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}
.foot_contact02{
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  margin-top: 2rem;
  text-indent: -1rem;
  padding-left: 1rem;
}

.txt-md{
  font-size: 1.4rem;
  line-height: 1.5;
}
.txt_c{
  text-align: center;
}
.flex_c{
  display: flex;
  align-items: center;
  justify-content: center;
}

.l_back{
  position: fixed;
  right: calc(50% + 33rem);
  top: calc(50% - 7.5rem);
  width: 32rem;
  z-index: 1;
}
.r_back{
  position: fixed;
  left: calc(50% + 33rem);
  top: calc(50% - 25rem);
  width: 38.5rem;
  z-index: 1;
}

.ripple{
  position: fixed;
  background-color: rgba(224, 245, 246, 1);
  width: 100%;
  height: 100%;
  background-position: center center;
  top: 0%;
  left: 0%;
  z-index: -1;
}
#ripple{
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.ripple_bg{
  position: fixed;
  width: 100%;
  height: 100%;
  background-position: center center;
  top: 0%;
  left: 0%;
  z-index: 1;
}
/* .ripple{
  position: relative;
  width: 100vw;
  height: 100vh;
}

.ripple_bg{
  position: fixed;
  background-color: rgba(224, 245, 246, 1);
  width: 100%;
  height: 100%;
  background-position: center center;
  top: 0%;
  left: 0%;
  z-index: -1;
}
.ripple_animation{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
} */



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
　▼▼　以降SP用　▼▼
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@media screen and (max-width: 768px) {/* SP用 */
  :root {
    --res-font-size: 1; /* SP文字サイズの一括調整倍率 */
    --res-margin-size: 1; /* SP余白の一括調整倍率 */
  }
  /* SP版文字サイズ */
  .fs0 { font-size: calc(0rem * var(--res-font-size)) !important; }
  .fs8 { font-size: calc(0.8rem * var(--res-font-size)) !important; }
  .fs9 { font-size: calc(0.9rem * var(--res-font-size)) !important; }
  .fs10 { font-size: calc(1rem * var(--res-font-size)) !important; }
  .fs11 { font-size: calc(1.1rem * var(--res-font-size)) !important; }
  .fs12 { font-size: calc(1.2rem * var(--res-font-size)) !important; }
  .fs13 { font-size: calc(1.3rem * var(--res-font-size)) !important; }
  .fs14 { font-size: calc(1.4rem * var(--res-font-size)) !important; }
  .fs15 { font-size: calc(1.5rem * var(--res-font-size)) !important; }
  .fs16 { font-size: calc(1.6rem * var(--res-font-size)) !important; }
  .fs17 { font-size: calc(1.7rem * var(--res-font-size)) !important; }
  .fs18 { font-size: calc(1.8rem * var(--res-font-size)) !important; }
  .fs19 { font-size: calc(1.9rem * var(--res-font-size)) !important; }
  .fs20 { font-size: calc(2rem * var(--res-font-size)) !important; }
  .fs21 { font-size: calc(2.1rem * var(--res-font-size)) !important; }
  .fs22 { font-size: calc(2.2rem * var(--res-font-size)) !important; }
  .fs23 { font-size: calc(2.3rem * var(--res-font-size)) !important; }
  .fs24 { font-size: calc(2.4rem * var(--res-font-size)) !important; }
  .fs25 { font-size: calc(2.5rem * var(--res-font-size)) !important; }
  .fs26 { font-size: calc(2.6rem * var(--res-font-size)) !important; }
  .fs27 { font-size: calc(2.7rem * var(--res-font-size)) !important; }
  .fs28 { font-size: calc(2.8rem * var(--res-font-size)) !important; }
  .fs29 { font-size: calc(2.9rem * var(--res-font-size)) !important; }
  .fs30 { font-size: calc(3rem * var(--res-font-size)) !important; }
  .fs31 { font-size: calc(3.1rem * var(--res-font-size)) !important; }
  .fs32 { font-size: calc(3.2rem * var(--res-font-size)) !important; }
  .fs33 { font-size: calc(3.3rem * var(--res-font-size)) !important; }
  .fs34 { font-size: calc(3.4rem * var(--res-font-size)) !important; }
  .fs35 { font-size: calc(3.5rem * var(--res-font-size)) !important; }
  .fs36 { font-size: calc(3.6rem * var(--res-font-size)) !important; }
  .fs37 { font-size: calc(3.7rem * var(--res-font-size)) !important; }
  .fs38 { font-size: calc(3.8rem * var(--res-font-size)) !important; }
  .fs39 { font-size: calc(3.9rem * var(--res-font-size)) !important; }
  .fs40 { font-size: calc(4rem * var(--res-font-size)) !important; }
  .fs41 { font-size: calc(4.1rem * var(--res-font-size)) !important; }
  .fs42 { font-size: calc(4.2rem * var(--res-font-size)) !important; }
  .fs43 { font-size: calc(4.3rem * var(--res-font-size)) !important; }
  .fs44 { font-size: calc(4.4rem * var(--res-font-size)) !important; }
  .fs45 { font-size: calc(4.5rem * var(--res-font-size)) !important; }
  .fs46 { font-size: calc(4.6rem * var(--res-font-size)) !important; }
  .fs47 { font-size: calc(4.7rem * var(--res-font-size)) !important; }
  .fs48 { font-size: calc(4.8rem * var(--res-font-size)) !important; }
  .fs49 { font-size: calc(4.9rem * var(--res-font-size)) !important; }
  .fs50 { font-size: calc(5rem * var(--res-font-size)) !important; }
  .fs51 { font-size: calc(5.1rem * var(--res-font-size)) !important; }
  .fs52 { font-size: calc(5.2rem * var(--res-font-size)) !important; }
  .fs53 { font-size: calc(5.3rem * var(--res-font-size)) !important; }
  .fs54 { font-size: calc(5.4rem * var(--res-font-size)) !important; }
  .fs55 { font-size: calc(5.5rem * var(--res-font-size)) !important; }
  .fs56 { font-size: calc(5.6rem * var(--res-font-size)) !important; }
  .fs57 { font-size: calc(5.7rem * var(--res-font-size)) !important; }
  .fs58 { font-size: calc(5.8rem * var(--res-font-size)) !important; }
  .fs59 { font-size: calc(5.9rem * var(--res-font-size)) !important; }
  .fs60 { font-size: calc(6rem * var(--res-font-size)) !important; }
  .fs61 { font-size: calc(6.1rem * var(--res-font-size)) !important; }
  .fs62 { font-size: calc(6.2rem * var(--res-font-size)) !important; }
  .fs63 { font-size: calc(6.3rem * var(--res-font-size)) !important; }
  .fs64 { font-size: calc(6.4rem * var(--res-font-size)) !important; }
  .fs65 { font-size: calc(6.5rem * var(--res-font-size)) !important; }
  .fs66 { font-size: calc(6.6rem * var(--res-font-size)) !important; }
  .fs67 { font-size: calc(6.7rem * var(--res-font-size)) !important; }
  .fs68 { font-size: calc(6.8rem * var(--res-font-size)) !important; }
  .fs69 { font-size: calc(6.9rem * var(--res-font-size)) !important; }
  .fs70 { font-size: calc(7rem * var(--res-font-size)) !important; }
  .fs71 { font-size: calc(7.1rem * var(--res-font-size)) !important; }
  .fs72 { font-size: calc(7.2rem * var(--res-font-size)) !important; }
  .fs73 { font-size: calc(7.3rem * var(--res-font-size)) !important; }
  .fs74 { font-size: calc(7.4rem * var(--res-font-size)) !important; }
  .fs75 { font-size: calc(7.5rem * var(--res-font-size)) !important; }
  .fs76 { font-size: calc(7.6rem * var(--res-font-size)) !important; }
  .fs77 { font-size: calc(7.7rem * var(--res-font-size)) !important; }
  .fs78 { font-size: calc(7.8rem * var(--res-font-size)) !important; }
  .fs79 { font-size: calc(7.9rem * var(--res-font-size)) !important; }
  .fs80 { font-size: calc(8rem * var(--res-font-size)) !important; }
  .fs81 { font-size: calc(8.1rem * var(--res-font-size)) !important; }
  .fs82 { font-size: calc(8.2rem * var(--res-font-size)) !important; }
  .fs83 { font-size: calc(8.3rem * var(--res-font-size)) !important; }
  .fs84 { font-size: calc(8.4rem * var(--res-font-size)) !important; }
  .fs85 { font-size: calc(8.5rem * var(--res-font-size)) !important; }
  .fs86 { font-size: calc(8.6rem * var(--res-font-size)) !important; }
  .fs87 { font-size: calc(8.7rem * var(--res-font-size)) !important; }
  .fs88 { font-size: calc(8.8rem * var(--res-font-size)) !important; }
  .fs89 { font-size: calc(8.9rem * var(--res-font-size)) !important; }
  .fs90 { font-size: calc(9rem * var(--res-font-size)) !important; }
  .fs91 { font-size: calc(9.1rem * var(--res-font-size)) !important; }
  .fs92 { font-size: calc(9.2rem * var(--res-font-size)) !important; }
  .fs93 { font-size: calc(9.3rem * var(--res-font-size)) !important; }
  .fs94 { font-size: calc(9.4rem * var(--res-font-size)) !important; }
  .fs95 { font-size: calc(9.5rem * var(--res-font-size)) !important; }
  .fs96 { font-size: calc(9.6rem * var(--res-font-size)) !important; }
  .fs97 { font-size: calc(9.7rem * var(--res-font-size)) !important; }
  .fs98 { font-size: calc(9.8rem * var(--res-font-size)) !important; }
  .fs99 { font-size: calc(9.9rem * var(--res-font-size)) !important; }
  .fs100 { font-size: calc(10rem * var(--res-font-size)) !important; }
  /* SP版余白 */
  .p0 { padding: calc(0 * var(--res-margin-size)) !important; }
  .phem { padding: calc(.5em * var(--res-margin-size)) !important; }
  .p1em { padding: calc(1em * var(--res-margin-size)) !important; }
  .p1hem { padding: calc(1.5em * var(--res-margin-size)) !important; }
  .p2em { padding: calc(2em * var(--res-margin-size)) !important; }
  .p2hem { padding: calc(2.5em * var(--res-margin-size)) !important; }
  .p3em { padding: calc(3em * var(--res-margin-size)) !important; }
  .p3hem { padding: calc(3.5em * var(--res-margin-size)) !important; }
  .p4em { padding: calc(4em * var(--res-margin-size)) !important; }
  .p4hem { padding: calc(4.5em * var(--res-margin-size)) !important; }
  .p5em { padding: calc(5em * var(--res-margin-size)) !important; }
  .p5 { padding: calc(0.5rem * var(--res-margin-size)) !important; }
  .p10 { padding: calc(1rem * var(--res-margin-size)) !important; }
  .p15 { padding: calc(1.5rem * var(--res-margin-size)) !important; }
  .p20 { padding: calc(2rem * var(--res-margin-size)) !important; }
  .p25 { padding: calc(2.5rem * var(--res-margin-size)) !important; }
  .p30 { padding: calc(3rem * var(--res-margin-size)) !important; }
  .p35 { padding: calc(3.5rem * var(--res-margin-size)) !important; }
  .p40 { padding: calc(4rem * var(--res-margin-size)) !important; }
  .p45 { padding: calc(4.5rem * var(--res-margin-size)) !important; }
  .p50 { padding: calc(5rem * var(--res-margin-size)) !important; }
  .p55 { padding: calc(5.5rem * var(--res-margin-size)) !important; }
  .p60 { padding: calc(6rem * var(--res-margin-size)) !important; }
  .p65 { padding: calc(6.5rem * var(--res-margin-size)) !important; }
  .p70 { padding: calc(7rem * var(--res-margin-size)) !important; }
  .p75 { padding: calc(7.5rem * var(--res-margin-size)) !important; }
  .p80 { padding: calc(8rem * var(--res-margin-size)) !important; }
  .p85 { padding: calc(8.5rem * var(--res-margin-size)) !important; }
  .p90 { padding: calc(9rem * var(--res-margin-size)) !important; }
  .p95 { padding: calc(9.5rem * var(--res-margin-size)) !important; }
  .p100 { padding: calc(10rem * var(--res-margin-size)) !important; }
  .pt0 { padding-top: calc(0 * var(--res-margin-size)) !important; }
  .pthem { padding-top: calc(.5em * var(--res-margin-size)) !important; }
  .pt1em { padding-top: calc(1em * var(--res-margin-size)) !important; }
  .pt1hem { padding-top: calc(1.5em * var(--res-margin-size)) !important; }
  .pt2em { padding-top: calc(2em * var(--res-margin-size)) !important; }
  .pt2hem { padding-top: calc(2.5em * var(--res-margin-size)) !important; }
  .pt3em { padding-top: calc(3em * var(--res-margin-size)) !important; }
  .pt3hem { padding-top: calc(3.5em * var(--res-margin-size)) !important; }
  .pt4em { padding-top: calc(4em * var(--res-margin-size)) !important; }
  .pt4hem { padding-top: calc(4.5em * var(--res-margin-size)) !important; }
  .pt5em { padding-top: calc(5em * var(--res-margin-size)) !important; }
  .pt5 { padding-top: calc(0.5rem * var(--res-margin-size)) !important; }
  .pt10 { padding-top: calc(1rem * var(--res-margin-size)) !important; }
  .pt15 { padding-top: calc(1.5rem * var(--res-margin-size)) !important; }
  .pt20 { padding-top: calc(2rem * var(--res-margin-size)) !important; }
  .pt25 { padding-top: calc(2.5rem * var(--res-margin-size)) !important; }
  .pt30 { padding-top: calc(3rem * var(--res-margin-size)) !important; }
  .pt35 { padding-top: calc(3.5rem * var(--res-margin-size)) !important; }
  .pt40 { padding-top: calc(4rem * var(--res-margin-size)) !important; }
  .pt45 { padding-top: calc(4.5rem * var(--res-margin-size)) !important; }
  .pt50 { padding-top: calc(5rem * var(--res-margin-size)) !important; }
  .pt55 { padding-top: calc(5.5rem * var(--res-margin-size)) !important; }
  .pt60 { padding-top: calc(6rem * var(--res-margin-size)) !important; }
  .pt65 { padding-top: calc(6.5rem * var(--res-margin-size)) !important; }
  .pt70 { padding-top: calc(7rem * var(--res-margin-size)) !important; }
  .pt75 { padding-top: calc(7.5rem * var(--res-margin-size)) !important; }
  .pt80 { padding-top: calc(8rem * var(--res-margin-size)) !important; }
  .pt85 { padding-top: calc(8.5rem * var(--res-margin-size)) !important; }
  .pt90 { padding-top: calc(9rem * var(--res-margin-size)) !important; }
  .pt95 { padding-top: calc(9.5rem * var(--res-margin-size)) !important; }
  .pt100 { padding-top: calc(10rem * var(--res-margin-size)) !important; }
  .pr0 { padding-right: calc(0 * var(--res-margin-size)) !important; }
  .prhem { padding-right: calc(.5em * var(--res-margin-size)) !important; }
  .pr1em { padding-right: calc(1em * var(--res-margin-size)) !important; }
  .pr1hem { padding-right: calc(1.5em * var(--res-margin-size)) !important; }
  .pr2em { padding-right: calc(2em * var(--res-margin-size)) !important; }
  .pr2hem { padding-right: calc(2.5em * var(--res-margin-size)) !important; }
  .pr3em { padding-right: calc(3em * var(--res-margin-size)) !important; }
  .pr3hem { padding-right: calc(3.5em * var(--res-margin-size)) !important; }
  .pr4em { padding-right: calc(4em * var(--res-margin-size)) !important; }
  .pr4hem { padding-right: calc(4.5em * var(--res-margin-size)) !important; }
  .pr5em { padding-right: calc(5em * var(--res-margin-size)) !important; }
  .pr5 { padding-right: calc(0.5rem * var(--res-margin-size)) !important; }
  .pr10 { padding-right: calc(1rem * var(--res-margin-size)) !important; }
  .pr15 { padding-right: calc(1.5rem * var(--res-margin-size)) !important; }
  .pr20 { padding-right: calc(2rem * var(--res-margin-size)) !important; }
  .pr25 { padding-right: calc(2.5rem * var(--res-margin-size)) !important; }
  .pr30 { padding-right: calc(3rem * var(--res-margin-size)) !important; }
  .pr35 { padding-right: calc(3.5rem * var(--res-margin-size)) !important; }
  .pr40 { padding-right: calc(4rem * var(--res-margin-size)) !important; }
  .pr45 { padding-right: calc(4.5rem * var(--res-margin-size)) !important; }
  .pr50 { padding-right: calc(5rem * var(--res-margin-size)) !important; }
  .pr55 { padding-right: calc(5.5rem * var(--res-margin-size)) !important; }
  .pr60 { padding-right: calc(6rem * var(--res-margin-size)) !important; }
  .pr65 { padding-right: calc(6.5rem * var(--res-margin-size)) !important; }
  .pr70 { padding-right: calc(7rem * var(--res-margin-size)) !important; }
  .pr75 { padding-right: calc(7.5rem * var(--res-margin-size)) !important; }
  .pr80 { padding-right: calc(8rem * var(--res-margin-size)) !important; }
  .pr85 { padding-right: calc(8.5rem * var(--res-margin-size)) !important; }
  .pr90 { padding-right: calc(9rem * var(--res-margin-size)) !important; }
  .pr95 { padding-right: calc(9.5rem * var(--res-margin-size)) !important; }
  .pr100 { padding-right: calc(10rem * var(--res-margin-size)) !important; }
  .pl0 { padding-left: calc(0 * var(--res-margin-size)) !important; }
  .plhem { padding-left: calc(.5em * var(--res-margin-size)) !important; }
  .pl1em { padding-left: calc(1em * var(--res-margin-size)) !important; }
  .pl1hem { padding-left: calc(1.5em * var(--res-margin-size)) !important; }
  .pl2em { padding-left: calc(2em * var(--res-margin-size)) !important; }
  .pl2hem { padding-left: calc(2.5em * var(--res-margin-size)) !important; }
  .pl3em { padding-left: calc(3em * var(--res-margin-size)) !important; }
  .pl3hem { padding-left: calc(3.5em * var(--res-margin-size)) !important; }
  .pl4em { padding-left: calc(4em * var(--res-margin-size)) !important; }
  .pl4hem { padding-left: calc(4.5em * var(--res-margin-size)) !important; }
  .pl5em { padding-left: calc(5em * var(--res-margin-size)) !important; }
  .pl5 { padding-left: calc(0.5rem * var(--res-margin-size)) !important; }
  .pl10 { padding-left: calc(1rem * var(--res-margin-size)) !important; }
  .pl15 { padding-left: calc(1.5rem * var(--res-margin-size)) !important; }
  .pl20 { padding-left: calc(2rem * var(--res-margin-size)) !important; }
  .pl25 { padding-left: calc(2.5rem * var(--res-margin-size)) !important; }
  .pl30 { padding-left: calc(3rem * var(--res-margin-size)) !important; }
  .pl35 { padding-left: calc(3.5rem * var(--res-margin-size)) !important; }
  .pl40 { padding-left: calc(4rem * var(--res-margin-size)) !important; }
  .pl45 { padding-left: calc(4.5rem * var(--res-margin-size)) !important; }
  .pl50 { padding-left: calc(5rem * var(--res-margin-size)) !important; }
  .pl55 { padding-left: calc(5.5rem * var(--res-margin-size)) !important; }
  .pl60 { padding-left: calc(6rem * var(--res-margin-size)) !important; }
  .pl65 { padding-left: calc(6.5rem * var(--res-margin-size)) !important; }
  .pl70 { padding-left: calc(7rem * var(--res-margin-size)) !important; }
  .pl75 { padding-left: calc(7.5rem * var(--res-margin-size)) !important; }
  .pl80 { padding-left: calc(8rem * var(--res-margin-size)) !important; }
  .pl85 { padding-left: calc(8.5rem * var(--res-margin-size)) !important; }
  .pl90 { padding-left: calc(9rem * var(--res-margin-size)) !important; }
  .pl95 { padding-left: calc(9.5rem * var(--res-margin-size)) !important; }
  .pl100 { padding-left: calc(10rem * var(--res-margin-size)) !important; }
  .pb0 { padding-bottom: calc(0 * var(--res-margin-size)) !important; }
  .pbhem { padding-bottom: calc(.5em * var(--res-margin-size)) !important; }
  .pb1em { padding-bottom: calc(1em * var(--res-margin-size)) !important; }
  .pb1hem { padding-bottom: calc(1.5em * var(--res-margin-size)) !important; }
  .pb2em { padding-bottom: calc(2em * var(--res-margin-size)) !important; }
  .pb2hem { padding-bottom: calc(2.5em * var(--res-margin-size)) !important; }
  .pb3em { padding-bottom: calc(3em * var(--res-margin-size)) !important; }
  .pb3hem { padding-bottom: calc(3.5em * var(--res-margin-size)) !important; }
  .pb4em { padding-bottom: calc(4em * var(--res-margin-size)) !important; }
  .pb4hem { padding-bottom: calc(4.5em * var(--res-margin-size)) !important; }
  .pb5em { padding-bottom: calc(5em * var(--res-margin-size)) !important; }
  .pb5 { padding-bottom: calc(0.5rem * var(--res-margin-size)) !important; }
  .pb10 { padding-bottom: calc(1rem * var(--res-margin-size)) !important; }
  .pb15 { padding-bottom: calc(1.5rem * var(--res-margin-size)) !important; }
  .pb20 { padding-bottom: calc(2rem * var(--res-margin-size)) !important; }
  .pb25 { padding-bottom: calc(2.5rem * var(--res-margin-size)) !important; }
  .pb30 { padding-bottom: calc(3rem * var(--res-margin-size)) !important; }
  .pb35 { padding-bottom: calc(3.5rem * var(--res-margin-size)) !important; }
  .pb40 { padding-bottom: calc(4rem * var(--res-margin-size)) !important; }
  .pb45 { padding-bottom: calc(4.5rem * var(--res-margin-size)) !important; }
  .pb50 { padding-bottom: calc(5rem * var(--res-margin-size)) !important; }
  .pb55 { padding-bottom: calc(5.5rem * var(--res-margin-size)) !important; }
  .pb60 { padding-bottom: calc(6rem * var(--res-margin-size)) !important; }
  .pb65 { padding-bottom: calc(6.5rem * var(--res-margin-size)) !important; }
  .pb70 { padding-bottom: calc(7rem * var(--res-margin-size)) !important; }
  .pb75 { padding-bottom: calc(7.5rem * var(--res-margin-size)) !important; }
  .pb80 { padding-bottom: calc(8rem * var(--res-margin-size)) !important; }
  .pb85 { padding-bottom: calc(8.5rem * var(--res-margin-size)) !important; }
  .pb90 { padding-bottom: calc(9rem * var(--res-margin-size)) !important; }
  .pb95 { padding-bottom: calc(9.5rem * var(--res-margin-size)) !important; }
  .pb100 { padding-bottom: calc(10rem * var(--res-margin-size)) !important; }
  .m0 { margin: calc(0 * var(--res-margin-size)) !important; }
  .mhem { margin: calc(.5em * var(--res-margin-size)) !important; }
  .m1em { margin: calc(1em * var(--res-margin-size)) !important; }
  .m1hem { margin: calc(1.5em * var(--res-margin-size)) !important; }
  .m2em { margin: calc(2em * var(--res-margin-size)) !important; }
  .m2hem { margin: calc(2.5em * var(--res-margin-size)) !important; }
  .m3em { margin: calc(3em * var(--res-margin-size)) !important; }
  .m3hem { margin: calc(3.5em * var(--res-margin-size)) !important; }
  .m4em { margin: calc(4em * var(--res-margin-size)) !important; }
  .m4hem { margin: calc(4.5em * var(--res-margin-size)) !important; }
  .m5em { margin: calc(5em * var(--res-margin-size)) !important; }
  .m5 { margin: calc(0.5rem * var(--res-margin-size)) !important; }
  .m10 { margin: calc(1rem * var(--res-margin-size)) !important; }
  .m15 { margin: calc(1.5rem * var(--res-margin-size)) !important; }
  .m20 { margin: calc(2rem * var(--res-margin-size)) !important; }
  .m25 { margin: calc(2.5rem * var(--res-margin-size)) !important; }
  .m30 { margin: calc(3rem * var(--res-margin-size)) !important; }
  .m35 { margin: calc(3.5rem * var(--res-margin-size)) !important; }
  .m40 { margin: calc(4rem * var(--res-margin-size)) !important; }
  .m45 { margin: calc(4.5rem * var(--res-margin-size)) !important; }
  .m50 { margin: calc(5rem * var(--res-margin-size)) !important; }
  .m55 { margin: calc(5.5rem * var(--res-margin-size)) !important; }
  .m60 { margin: calc(6rem * var(--res-margin-size)) !important; }
  .m65 { margin: calc(6.5rem * var(--res-margin-size)) !important; }
  .m70 { margin: calc(7rem * var(--res-margin-size)) !important; }
  .m75 { margin: calc(7.5rem * var(--res-margin-size)) !important; }
  .m80 { margin: calc(8rem * var(--res-margin-size)) !important; }
  .m85 { margin: calc(8.5rem * var(--res-margin-size)) !important; }
  .m90 { margin: calc(9rem * var(--res-margin-size)) !important; }
  .m95 { margin: calc(9.5rem * var(--res-margin-size)) !important; }
  .m100 { margin: calc(10rem * var(--res-margin-size)) !important; }
  .mt0 { margin-top: calc(0 * var(--res-margin-size)) !important; }
  .mthem { margin-top: calc(.5em * var(--res-margin-size)) !important; }
  .mt1em { margin-top: calc(1em * var(--res-margin-size)) !important; }
  .mt1hem { margin-top: calc(1.5em * var(--res-margin-size)) !important; }
  .mt2em { margin-top: calc(2em * var(--res-margin-size)) !important; }
  .mt2hem { margin-top: calc(2.5em * var(--res-margin-size)) !important; }
  .mt3em { margin-top: calc(3em * var(--res-margin-size)) !important; }
  .mt3hem { margin-top: calc(3.5em * var(--res-margin-size)) !important; }
  .mt4em { margin-top: calc(4em * var(--res-margin-size)) !important; }
  .mt4hem { margin-top: calc(4.5em * var(--res-margin-size)) !important; }
  .mt5em { margin-top: calc(5em * var(--res-margin-size)) !important; }
  .mt5 { margin-top: calc(0.5rem * var(--res-margin-size)) !important; }
  .mt10 { margin-top: calc(1rem * var(--res-margin-size)) !important; }
  .mt15 { margin-top: calc(1.5rem * var(--res-margin-size)) !important; }
  .mt20 { margin-top: calc(2rem * var(--res-margin-size)) !important; }
  .mt25 { margin-top: calc(2.5rem * var(--res-margin-size)) !important; }
  .mt30 { margin-top: calc(3rem * var(--res-margin-size)) !important; }
  .mt35 { margin-top: calc(3.5rem * var(--res-margin-size)) !important; }
  .mt40 { margin-top: calc(4rem * var(--res-margin-size)) !important; }
  .mt45 { margin-top: calc(4.5rem * var(--res-margin-size)) !important; }
  .mt50 { margin-top: calc(5rem * var(--res-margin-size)) !important; }
  .mt55 { margin-top: calc(5.5rem * var(--res-margin-size)) !important; }
  .mt60 { margin-top: calc(6rem * var(--res-margin-size)) !important; }
  .mt65 { margin-top: calc(6.5rem * var(--res-margin-size)) !important; }
  .mt70 { margin-top: calc(7rem * var(--res-margin-size)) !important; }
  .mt75 { margin-top: calc(7.5rem * var(--res-margin-size)) !important; }
  .mt80 { margin-top: calc(8rem * var(--res-margin-size)) !important; }
  .mt85 { margin-top: calc(8.5rem * var(--res-margin-size)) !important; }
  .mt90 { margin-top: calc(9rem * var(--res-margin-size)) !important; }
  .mt95 { margin-top: calc(9.5rem * var(--res-margin-size)) !important; }
  .mt100 { margin-top: calc(10rem * var(--res-margin-size)) !important; }
  .mr0 { margin-right: calc(0 * var(--res-margin-size)) !important; }
  .mrhem { margin-right: calc(.5em * var(--res-margin-size)) !important; }
  .mr1em { margin-right: calc(1em * var(--res-margin-size)) !important; }
  .mr1hem { margin-right: calc(1.5em * var(--res-margin-size)) !important; }
  .mr2em { margin-right: calc(2em * var(--res-margin-size)) !important; }
  .mr2hem { margin-right: calc(2.5em * var(--res-margin-size)) !important; }
  .mr3em { margin-right: calc(3em * var(--res-margin-size)) !important; }
  .mr3hem { margin-right: calc(3.5em * var(--res-margin-size)) !important; }
  .mr4em { margin-right: calc(4em * var(--res-margin-size)) !important; }
  .mr4hem { margin-right: calc(4.5em * var(--res-margin-size)) !important; }
  .mr5em { margin-right: calc(5em * var(--res-margin-size)) !important; }
  .mr5 { margin-right: calc(0.5rem * var(--res-margin-size)) !important; }
  .mr10 { margin-right: calc(1rem * var(--res-margin-size)) !important; }
  .mr15 { margin-right: calc(1.5rem * var(--res-margin-size)) !important; }
  .mr20 { margin-right: calc(2rem * var(--res-margin-size)) !important; }
  .mr25 { margin-right: calc(2.5rem * var(--res-margin-size)) !important; }
  .mr30 { margin-right: calc(3rem * var(--res-margin-size)) !important; }
  .mr35 { margin-right: calc(3.5rem * var(--res-margin-size)) !important; }
  .mr40 { margin-right: calc(4rem * var(--res-margin-size)) !important; }
  .mr45 { margin-right: calc(4.5rem * var(--res-margin-size)) !important; }
  .mr50 { margin-right: calc(5rem * var(--res-margin-size)) !important; }
  .mr55 { margin-right: calc(5.5rem * var(--res-margin-size)) !important; }
  .mr60 { margin-right: calc(6rem * var(--res-margin-size)) !important; }
  .mr65 { margin-right: calc(6.5rem * var(--res-margin-size)) !important; }
  .mr70 { margin-right: calc(7rem * var(--res-margin-size)) !important; }
  .mr75 { margin-right: calc(7.5rem * var(--res-margin-size)) !important; }
  .mr80 { margin-right: calc(8rem * var(--res-margin-size)) !important; }
  .mr85 { margin-right: calc(8.5rem * var(--res-margin-size)) !important; }
  .mr90 { margin-right: calc(9rem * var(--res-margin-size)) !important; }
  .mr95 { margin-right: calc(9.5rem * var(--res-margin-size)) !important; }
  .mr100 { margin-right: calc(10rem * var(--res-margin-size)) !important; }
  .ml0 { margin-left: calc(0 * var(--res-margin-size)) !important; }
  .mlhem { margin-left: calc(.5em * var(--res-margin-size)) !important; }
  .ml1em { margin-left: calc(1em * var(--res-margin-size)) !important; }
  .ml1hem { margin-left: calc(1.5em * var(--res-margin-size)) !important; }
  .ml2em { margin-left: calc(2em * var(--res-margin-size)) !important; }
  .ml2hem { margin-left: calc(2.5em * var(--res-margin-size)) !important; }
  .ml3em { margin-left: calc(3em * var(--res-margin-size)) !important; }
  .ml3hem { margin-left: calc(3.5em * var(--res-margin-size)) !important; }
  .ml4em { margin-left: calc(4em * var(--res-margin-size)) !important; }
  .ml4hem { margin-left: calc(4.5em * var(--res-margin-size)) !important; }
  .ml5em { margin-left: calc(5em * var(--res-margin-size)) !important; }
  .ml5 { margin-left: calc(0.5rem * var(--res-margin-size)) !important; }
  .ml10 { margin-left: calc(1rem * var(--res-margin-size)) !important; }
  .ml15 { margin-left: calc(1.5rem * var(--res-margin-size)) !important; }
  .ml20 { margin-left: calc(2rem * var(--res-margin-size)) !important; }
  .ml25 { margin-left: calc(2.5rem * var(--res-margin-size)) !important; }
  .ml30 { margin-left: calc(3rem * var(--res-margin-size)) !important; }
  .ml35 { margin-left: calc(3.5rem * var(--res-margin-size)) !important; }
  .ml40 { margin-left: calc(4rem * var(--res-margin-size)) !important; }
  .ml45 { margin-left: calc(4.5rem * var(--res-margin-size)) !important; }
  .ml50 { margin-left: calc(5rem * var(--res-margin-size)) !important; }
  .ml55 { margin-left: calc(5.5rem * var(--res-margin-size)) !important; }
  .ml60 { margin-left: calc(6rem * var(--res-margin-size)) !important; }
  .ml65 { margin-left: calc(6.5rem * var(--res-margin-size)) !important; }
  .ml70 { margin-left: calc(7rem * var(--res-margin-size)) !important; }
  .ml75 { margin-left: calc(7.5rem * var(--res-margin-size)) !important; }
  .ml80 { margin-left: calc(8rem * var(--res-margin-size)) !important; }
  .ml85 { margin-left: calc(8.5rem * var(--res-margin-size)) !important; }
  .ml90 { margin-left: calc(9rem * var(--res-margin-size)) !important; }
  .ml95 { margin-left: calc(9.5rem * var(--res-margin-size)) !important; }
  .ml100 { margin-left: calc(10rem * var(--res-margin-size)) !important; }
  .mb0 { margin-bottom: calc(0 * var(--res-margin-size)) !important; }
  .mbhem { margin-bottom: calc(.5em * var(--res-margin-size)) !important; }
  .mb1em { margin-bottom: calc(1em * var(--res-margin-size)) !important; }
  .mb1hem { margin-bottom: calc(1.5em * var(--res-margin-size)) !important; }
  .mb2em { margin-bottom: calc(2em * var(--res-margin-size)) !important; }
  .mb2hem { margin-bottom: calc(2.5em * var(--res-margin-size)) !important; }
  .mb3em { margin-bottom: calc(3em * var(--res-margin-size)) !important; }
  .mb3hem { margin-bottom: calc(3.5em * var(--res-margin-size)) !important; }
  .mb4em { margin-bottom: calc(4em * var(--res-margin-size)) !important; }
  .mb4hem { margin-bottom: calc(4.5em * var(--res-margin-size)) !important; }
  .mb5em { margin-bottom: calc(5em * var(--res-margin-size)) !important; }
  .mb5 { margin-bottom: calc(0.5rem * var(--res-margin-size)) !important; }
  .mb10 { margin-bottom: calc(1rem * var(--res-margin-size)) !important; }
  .mb15 { margin-bottom: calc(1.5rem * var(--res-margin-size)) !important; }
  .mb20 { margin-bottom: calc(2rem * var(--res-margin-size)) !important; }
  .mb25 { margin-bottom: calc(2.5rem * var(--res-margin-size)) !important; }
  .mb30 { margin-bottom: calc(3rem * var(--res-margin-size)) !important; }
  .mb35 { margin-bottom: calc(3.5rem * var(--res-margin-size)) !important; }
  .mb40 { margin-bottom: calc(4rem * var(--res-margin-size)) !important; }
  .mb45 { margin-bottom: calc(4.5rem * var(--res-margin-size)) !important; }
  .mb50 { margin-bottom: calc(5rem * var(--res-margin-size)) !important; }
  .mb55 { margin-bottom: calc(5.5rem * var(--res-margin-size)) !important; }
  .mb60 { margin-bottom: calc(6rem * var(--res-margin-size)) !important; }
  .mb65 { margin-bottom: calc(6.5rem * var(--res-margin-size)) !important; }
  .mb70 { margin-bottom: calc(7rem * var(--res-margin-size)) !important; }
  .mb75 { margin-bottom: calc(7.5rem * var(--res-margin-size)) !important; }
  .mb80 { margin-bottom: calc(8rem * var(--res-margin-size)) !important; }
  .mb85 { margin-bottom: calc(8.5rem * var(--res-margin-size)) !important; }
  .mb90 { margin-bottom: calc(9rem * var(--res-margin-size)) !important; }
  .mb95 { margin-bottom: calc(9.5rem * var(--res-margin-size)) !important; }
  .mb100 { margin-bottom: calc(10rem * var(--res-margin-size)) !important; }
}