@charset "utf-8";

body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  color: #333333;
  background-color: white;
  text-align: center;
}

.container {
  max-width: auto;
  margin: 0 auto;
}

/* -------------------------------------------------- */
/* inner */
/* -------------------------------------------------- */

.l-inner-wide {
  max-width: calc(1440px + calc(24px * 2));
  margin-right: auto;
  margin-left: auto;
  padding-right: 24px;
  padding-left: 24px;
}

.l-inner {
  max-width: calc(1200px + calc(24px * 2));
  margin-right: auto;
  margin-left: auto;
  padding-right: 24px;
  padding-left: 24px;
}

.l-inner-narrow {
  max-width: calc(968px + calc(24px * 2));
  margin-right: auto;
  margin-left: auto;
  padding-right: 24px;
  padding-left: 24px;
}

/* -------------------------------------------------- */
/* heading */
/* -------------------------------------------------- */

.c-headingLv1-jbt{
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #000000;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 10px #E61F19;/*左線*/
}

.c-headingLv2-jbt {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  /* margin-top: 120px;
  padding-top: 32px; */
  /*  */
  /* position: relative; */
  color: #E61F19;
  margin: 50px 0;
}

.c-headingLv2-jbt:before {
  content: "";
  position: absolute;
  background: #C5D3E4;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: -1;
}

.c-headingLv3-jbt:first-child {
  margin-top: 0;
}

.c-headingLv3-jbt {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 40px;
  padding-top: 24px;
  position: relative;
  display: inline-block;
  padding: 0 45px;
  color: #4C4948;
}

.c-headingLv3-jbt::before,
.c-headingLv3-jbt::after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 44px;
  height: 2px;
  background-color: #4C4948;
  -webkit-transform: rotate(-60deg);
  transform: rotate(-60deg);
}

.c-headingLv3-jbt::before {
  left: 0;
}

.c-headingLv3-jbt::after {
  right: 0;
}

.c-headingLv4-jbt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.75;
  margin-top: 24px;
  padding: 0.25em 0.5em; /* 上下-左右 */
  color: #494949;
  border-left: solid 5px #047B6E;
  text-align: left; 
}

.c-headingLv4-jbt:first-child {
  margin-top: 0
}


h1-ddddd {
  padding: 0.25em 0.5em;
  color: #494949;
  background: transparent;
  border-left: solid 5px #7db4e6;
}

.c-text {
  margin-top: 24px;
}

.c-text:first-child {
  margin-top: 0;
}

/* -------------------------------------------------- */
/* box */
/* -------------------------------------------------- */

.b-box {
  display: flex;
  align-items: center; /* 垂直 */
  justify-content: center; /* 水平 */
  margin: 0 auto; /* 要素を中央配置 */
  text-align: center;
}

.b-box .icon-image {
  margin-right: 10px;
  height: 1.5em; /* 画像の高さ*/
  width: auto;
}

.b-box p {
  margin: 0;
  color: #047B6E;
  font-size: 14px;
}

/* -------------------------------------------------- */
/* image */
/* -------------------------------------------------- */

.c-img {
  display: inline-block;
  width: 100%;
  margin-top: 24px
}

.c-img:first-child {
  margin-top: 0
}

.c-img>img {
  width: 100%;
  height: auto;
  vertical-align: bottom
}

.c-imgAuto {
  display: inline-block;
  max-width: 100%
}

.c-imgAuto>img {
  width: auto;
  max-width: 100%;
  vertical-align: bottom
}

/* -------------------------------------------------- */
/* first view*/
/* -------------------------------------------------- */

.main-visual {
  background-image: url('../image/megane_p_main.jpg');
  background-size: cover;
  height: 500px;
  background-position: center;
  background-repeat: no-repeat;
  padding: 100px 0;
  position: relative;
}

 .visual-text {
  position: absolute;
  top: 100;
  left: 80%;
  transform: translateX(-20%);
  text-align: center;
}

.text-line {
  color: rgb(0, 0, 0);
  font-size: 1.5em;
  font-weight: bold;
  white-space: nowrap;
  text-orientation: upright;
  writing-mode: vertical-rl;
  text-align: start;
  background-color: rgba(255, 255, 255, 0.5); /* 半透明の黒色背景 */
  padding: 10px; /* 背景とテキストの間にスペースを追加 */
  border-radius: 5px; /* 角を少し丸める */
}

@media screen and (max-width: 767px) {
  .main-visual {
    background-image: url('../image/megane_m_main.jpg');
    background-size: cover;
    height: 500px;
    background-position: center;
    background-repeat: no-repeat;
    padding: 100px 0;
    position: relative;
  }

  .visual-text {
    position: absolute;
    top: 50;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
  }

  .text-line {
    color: rgb(0, 0, 0);
    font-size: 1.5em;
    white-space: nowrap;
    text-orientation: upright;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    text-align: start;
    background-color: rgba(255, 255, 255, 0.5); /* 半透明の黒色背景 */
    padding: 10px; /* 背景とテキストの間にスペースを追加 */
    border-radius: 5px; /* 角を少し丸める */
  }
}
/* -------------------------------------------------- */
/* video */
/* -------------------------------------------------- */
.iframe-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 アスペクト比の場合 */
  height: 0;
  overflow: hidden;
  max-width: 100%;
  background: #000;
}

.iframe-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* -------------------------------------------------- */
/* toc */
/* -------------------------------------------------- */

.toc-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px;
  margin-bottom: 80px;
}

.toc-item {
  flex: 0 0 calc(20% - 10px);
  max-width: 300px;
}

.toc-item img {
  width: 80%;
  height: auto;
  transition: opacity 0.3s ease;
}

.toc-item img:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .toc-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5px;
    margin-bottom: 40px;
    /* 80px */
  }

  .toc-item {
    flex: 0 0 calc(50% - 10px);
    /* 2列 */
    max-width: 100%;
  }

  .toc-item img {
    width: 100%;
    height: auto;
    transition: opacity 0.3s ease;
  }

  .toc-item img:active {
    opacity: 0.5;
    /* 不透明度を下げる */
  }
}

/* -------------------------------------------------- */
/* conts */
/* -------------------------------------------------- */

.contents-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.contents-item-50per{
  width: calc(100% / 2 - 10px);
}

.contents-img{
  width: 100%;
  transition: opacity 0.3s ease;
}

.contents-item img:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .contents-item-50per{
  width: 100%;
}
}

/* -------------------------------------------------- */
.conts-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px;
  margin-bottom: 80px;
}

.conts-item {
  flex: 0 0 calc(50% - 10px); /* 2列に並ぶように設定 */
  max-width: 300px;
}

.conts-item img {
  width: 80%;
  height: auto;
  transition: opacity 0.3s ease;
}

.conts-item img:hover {
  opacity: 0.5;
}

@media screen and (max-width: 767px) {
  .conts-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    margin-bottom: 40px;
  }

  .conts-item {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .conts-item img {
    width: 100%;
    height: auto;
    transition: opacity 0.3s ease;
  }

  .conts-item img:active {
    opacity: 0.5;
  }
}
/* -------------------------------------------------- */
/* boxes */
/* -------------------------------------------------- */

.box1 {
  position: relative;
  margin: 2em 0;
  padding: 0.5em 1em;
  border: solid 3px #ff0000;
}
.box1 .box-title {
  position: absolute;
  display: inline-block;
  top: -27px;
  left: -3px;
  padding: 0 9px;
  height: 25px;
  line-height: 25px;
  font-size: 17px;
  background: #ff0000;
  color: #ffffff;
  font-weight: bold;
  border-radius: 5px 5px 0 0;
}
.box1 p {
  margin: 0; 
  padding: 0;
}
.box2 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #2c2c2f;
  background: #eceaea;/*背景色*/
}

.box3 {
  padding: 0.5em 1em;
  margin: 2em 0;
  color: #ffffff;
  background: #ff0000;/*背景色*/
  border-radius: 10px;/*角の丸み*/
}
.box3 p {
  margin: 0; 
  padding: 0;
}

/* -------------------------------------------------- */
/* buttons */
/* -------------------------------------------------- */

.button-container {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.btn-cat {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 25px;
  text-decoration: none;
  color: #047B6E;
  background: #ECECEC;
  transition: .4s;
  width: 10vw;
  margin-bottom: 10px;
  text-align: center;
}

.btn-cat:hover {
  background: #047B6E;
  color: white;
}

@media screen and (max-width: 767px) {
  .button-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .btn-cat {
    position: relative;
    display: inline-block;
    font-weight: bold;
    padding: 12px 20px;
    border-radius: 10px;
    text-decoration: none;
    color: #047B6E;
    background: #ECECEC;
    transition: .4s;
    width: calc(40% - 10px);
    /* 2つのボタンの間にgapが10pxあるため */
    margin-bottom: 15px;
    /* ボタン間の垂直間隔 */
    text-align: center;
  }

  .btn-cat:hover {
    background: #047B6E;
    color: white;
  }

  .btn-cat:active {
    background: #047B6E;
    color: white;
    opacity: 0.7;
  }
}

.btn-flat-vertical-border {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 0.5em 1em;
  text-decoration: none;
  border-left: solid 4px #ff0000;
  border-right: solid 4px #ff0000;
  color: #ffffff;
  background: #000000;
  transition: .4s;
}

.btn-flat-vertical-border:hover {
  background: #EA535E;
  color: #FFF;
}

/* -------------------------------------------------- */
/* bubbles */
/* -------------------------------------------------- */

.bubble {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 1em;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
  background: #f7f3bb;
  border-radius: 15px;
}

.bubble:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #f7f3bb;
}

.bubble p {
  margin: 0;
  padding: 0;
}

@media screen and (max-width: 767px) {
  .bubble {
    position: relative;
    display: inline-block;
    margin: 1.5em auto;
    /* 上下マージン維持、左右マージンauto */
    padding: 1em;
    width: calc(100% - 2em);
    /* paddingを考慮 */
    min-width: 120px;
    max-width: calc(100% - 2em);
    color: #555;
    font-size: 16px;
    background: #f7f3bb;
    border-radius: 15px;
    box-sizing: border-box;
  }

  .bubble:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-top: 15px solid #f7f3bb;
  }

  .bubble p {
    margin: 0;
    padding: 0;
  }
}

/* -------------------------------------------------- */
/* ichioshi */
/* -------------------------------------------------- */

.responsive-row .col {
  width: 50%;
  margin: 0 auto;
}

.responsive-row .col img {
  width: 100%;
  height: auto;
}

@media (max-width: 768px) {

  .bubble,
  .responsive-row .col {
    width: 100%;
    margin: 0;
  }

  .responsive-row .col img {
    width: 100%;
    height: auto;
  }
}

/* -------------------------------------------------- */
/* cards */
/* -------------------------------------------------- */

.cards {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.card {
  width: 15vw;
  height: 100%;
  position: relative;
  cursor: pointer;
}

.card::before {
  content: "";
  display: block;
  padding-top: 170%;
}

.card img {
  width: 100%;
}

.card .back,
.card .front {
  transition: all 0.6s;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  backface-visibility: hidden;
}

.card .front {
  transform: rotateY(-180deg);
}

.card:hover .back {
  transform: rotateY(180deg);
}

.card:hover .front {
  transform: rotateY(0);
}

@media screen and (max-width: 767px) {
  .cards {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
    height: auto;
  }

  .card {
    width: calc(50% - 10px);
    position: relative;
    cursor: pointer;
  }

  .card img {
    width: 100%;
  }

  .card .back,
  .card .front {
    transition: all 0.6s;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
  }

  .card .front {
    transform: rotateY(-180deg);
  }

  .card:hover .back {
    transform: rotateY(180deg);
  }

  .card:hover .front {
    transform: rotateY(0);
  }
}

/* -------------------------------------------------- */
/* others */
/* -------------------------------------------------- */

.small-image {
  width: 250px !important;
  height: auto !important;
}

.small-image2 {
  width: 250px !important;
  height: auto !important;
  display: block;
  margin: 0 auto;
}


.flex-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.flex-item,
.flex-item.reverse {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 80px;
}

.flex-item img,
.flex-item.reverse img {
  width: 40%;
  max-width: 100%;
  height: auto;
}

.flex-item p,
.flex-item.reverse p {
  width: 40%;
  margin: 0;
}

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

.flex-item.reverse img {
  margin-left: 20px;
  margin-right: 0;
}

.flex-item.reverse p {
  margin-right: 20px;
  margin-left: 0;
}

@media screen and (max-width: 767px) {
  .flex-container {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .flex-item,
  .flex-item.reverse {
    display: flex;
    flex-direction: column;
    /* 縦に並べる */
    align-items: center;
    justify-content: flex-start;
    margin-top: 40px;
  }

  .flex-item img,
  .flex-item.reverse img {
    width: 80%;
    max-width: 100%;
    height: auto;
    margin-left: 0;
    margin-right: 0;
  }

  .flex-item p,
  .flex-item.reverse p {
    width: 80%;
    margin-top: 20px;
  }

  /* .reverse スタイルはモバイルでは不要になるためリセット */
  .flex-item.reverse {
    flex-direction: column;
  }

  .flex-item.reverse img {
    margin-left: 0;
    margin-right: 0;
  }

  .flex-item.reverse p {
    margin-right: 0;
    margin-left: 0;
  }
}


/* -------------------------------------------------- */
/* フッター関連 */
/* -------------------------------------------------- */

.l-footer {
  padding: 32px 0;
  background: grey;
  color: #FFF;
}

/* -------------------------------------------------- */
/* その他 */
/* -------------------------------------------------- */

html {
  scroll-behavior: smooth;
}

.back-to-top {
  padding: auto;
  width: 82px;
  height: 82px;
  position: fixed;
  bottom: 5px;
  right: 5px;
  background-color: #000000;
  color: #ffffff;
  border-radius: 50px;
  text-decoration: none;
  opacity: 0.7;
  transition: opacity 0.3s;
  display: none;
}

.show {
  display: block;
}

.back-to-top span {
  position: absolute;
  top: 40%;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.back-to-top:hover {
  opacity: 1;
}

/* -------------------------------------------------- */
/* separator */
/* -------------------------------------------------- */

.l-separator-x0 {
  margin-top: 0
}

.l-separator-x0-imp {
  margin-top: 0 !important
}

.l-separator-x1 {
  margin-top: 8px
}

.l-separator-x1-imp {
  margin-top: 8px !important
}

.l-separator-x2 {
  margin-top: 16px
}

.l-separator-x2-imp {
  margin-top: 16px !important
}

.l-separator-x3 {
  margin-top: 24px
}

.l-separator-x3-imp {
  margin-top: 24px !important
}

.l-separator-x4 {
  margin-top: 32px
}

.l-separator-x4-imp {
  margin-top: 32px !important
}

.l-separator-x5 {
  margin-top: 40px
}

.l-separator-x5-imp {
  margin-top: 40px !important
}

.l-separator-x6 {
  margin-top: 48px
}

.l-separator-x6-imp {
  margin-top: 48px !important
}

.l-separator-x7 {
  margin-top: 56px
}

.l-separator-x7-imp {
  margin-top: 56px !important
}

.l-separator-x8 {
  margin-top: 64px
}

.l-separator-x8-imp {
  margin-top: 64px !important
}

.l-separator-x9 {
  margin-top: 72px
}

.l-separator-x9-imp {
  margin-top: 72px !important
}

.l-separator-x10 {
  margin-top: 80px
}

.l-separator-x10-imp {
  margin-top: 80px !important
}

.l-separator-x11 {
  margin-top: 88px
}

.l-separator-x11-imp {
  margin-top: 88px !important
}

.l-separator-x12 {
  margin-top: 96px
}

.l-separator-x12-imp {
  margin-top: 96px !important
}

.l-separator-x13 {
  margin-top: 104px
}

.l-separator-x13-imp {
  margin-top: 104px !important
}

.l-separator-x14 {
  margin-top: 112px
}

.l-separator-x14-imp {
  margin-top: 112px !important
}

.l-separator-x15 {
  margin-top: 120px
}

.l-separator-x15-imp {
  margin-top: 120px !important
}

.l-separator-x16 {
  margin-top: 128px
}

.l-separator-x16-imp {
  margin-top: 128px !important
}

.l-separator-x17 {
  margin-top: 136px
}

.l-separator-x17-imp {
  margin-top: 136px !important
}

.l-separator-x18 {
  margin-top: 144px
}

.l-separator-x18-imp {
  margin-top: 144px !important
}

.l-separator-x19 {
  margin-top: 152px
}

.l-separator-x19-imp {
  margin-top: 152px !important
}

.l-separator-x20 {
  margin-top: 160px
}

.l-separator-x20-imp {
  margin-top: 160px !important
}

.l-separator-x21 {
  margin-top: 168px
}

.l-separator-x21-imp {
  margin-top: 168px !important
}

.l-separator-x22 {
  margin-top: 176px
}

.l-separator-x22-imp {
  margin-top: 176px !important
}

.l-separator-x23 {
  margin-top: 184px
}

.l-separator-x23-imp {
  margin-top: 184px !important
}

.l-separator-x24 {
  margin-top: 192px
}

.l-separator-x24-imp {
  margin-top: 192px !important
}

.l-separator-x25 {
  margin-top: 200px
}

.l-separator-x25-imp {
  margin-top: 200px !important
}

.l-separator-x26 {
  margin-top: 208px
}

.l-separator-x26-imp {
  margin-top: 208px !important
}

.l-separator-x27 {
  margin-top: 216px
}

.l-separator-x27-imp {
  margin-top: 216px !important
}

.l-separator-x28 {
  margin-top: 224px
}

.l-separator-x28-imp {
  margin-top: 224px !important
}

.l-separator-x29 {
  margin-top: 232px
}

.l-separator-x29-imp {
  margin-top: 232px !important
}

.l-separator-x30 {
  margin-top: 240px
}

.l-separator-x30-imp {
  margin-top: 240px !important
}

.l-separator-x0_5 {
  margin-top: 4px
}

.l-separator-x0_5-imp {
  margin-top: 4px !important
}

.l-separator-x1_5 {
  margin-top: 12px
}

.l-separator-x1_5-imp {
  margin-top: 12px !important
}

.l-separator-x2_5 {
  margin-top: 20px
}

.l-separator-x2_5-imp {
  margin-top: 20px !important
}

.l-separator-x3_5 {
  margin-top: 28px
}

.l-separator-x3_5-imp {
  margin-top: 28px !important
}

.l-separator-x4_5 {
  margin-top: 36px
}

.l-separator-x4_5-imp {
  margin-top: 36px !important
}

.l-separator-x5_5 {
  margin-top: 44px
}

.l-separator-x5_5-imp {
  margin-top: 44px !important
}

.l-separator-x6_5 {
  margin-top: 52px
}

.l-separator-x6_5-imp {
  margin-top: 52px !important
}

.l-separator-x7_5 {
  margin-top: 60px
}

.l-separator-x7_5-imp {
  margin-top: 60px !important
}

.l-separator-x8_5 {
  margin-top: 68px
}

.l-separator-x8_5-imp {
  margin-top: 68px !important
}

.l-separator-x9_5 {
  margin-top: 76px
}

.l-separator-x9_5-imp {
  margin-top: 76px !important
}

.l-separator-x10_5 {
  margin-top: 84px
}

.l-separator-x10_5-imp {
  margin-top: 84px !important
}

.l-separator-x11_5 {
  margin-top: 92px
}

.l-separator-x11_5-imp {
  margin-top: 92px !important
}

.l-separator-x12_5 {
  margin-top: 100px
}

.l-separator-x12_5-imp {
  margin-top: 100px !important
}

.l-separator-x13_5 {
  margin-top: 108px
}

.l-separator-x13_5-imp {
  margin-top: 108px !important
}

.l-separator-x14_5 {
  margin-top: 116px
}

.l-separator-x14_5-imp {
  margin-top: 116px !important
}

.l-separator-x15_5 {
  margin-top: 124px
}

.l-separator-x15_5-imp {
  margin-top: 124px !important
}

.l-separator-x16_5 {
  margin-top: 132px
}

.l-separator-x16_5-imp {
  margin-top: 132px !important
}

.l-separator-x17_5 {
  margin-top: 140px
}

.l-separator-x17_5-imp {
  margin-top: 140px !important
}

.l-separator-x18_5 {
  margin-top: 148px
}

.l-separator-x18_5-imp {
  margin-top: 148px !important
}

.l-separator-x19_5 {
  margin-top: 156px
}

.l-separator-x19_5-imp {
  margin-top: 156px !important
}

.l-separator-x20_5 {
  margin-top: 164px
}

.l-separator-x20_5-imp {
  margin-top: 164px !important
}

.l-separator-x21_5 {
  margin-top: 172px
}

.l-separator-x21_5-imp {
  margin-top: 172px !important
}

.l-separator-x22_5 {
  margin-top: 180px
}

.l-separator-x22_5-imp {
  margin-top: 180px !important
}

.l-separator-x23_5 {
  margin-top: 188px
}

.l-separator-x23_5-imp {
  margin-top: 188px !important
}

.l-separator-x24_5 {
  margin-top: 196px
}

.l-separator-x24_5-imp {
  margin-top: 196px !important
}

.l-separator-x25_5 {
  margin-top: 204px
}

.l-separator-x25_5-imp {
  margin-top: 204px !important
}

.l-separator-x26_5 {
  margin-top: 212px
}

.l-separator-x26_5-imp {
  margin-top: 212px !important
}

.l-separator-x27_5 {
  margin-top: 220px
}

.l-separator-x27_5-imp {
  margin-top: 220px !important
}

.l-separator-x28_5 {
  margin-top: 228px
}

.l-separator-x28_5-imp {
  margin-top: 228px !important
}

.l-separator-x29_5 {
  margin-top: 236px
}

.l-separator-x29_5-imp {
  margin-top: 236px !important
}

.l-separator-x30_5 {
  margin-top: 244px
}

.l-separator-x30_5-imp {
  margin-top: 244px !important
}

.l-separator-x0m {
  margin-top: 0
}

.l-separator-x0m-imp {
  margin-top: 0 !important
}

.l-separator-x1m {
  margin-top: -8px
}

.l-separator-x1m-imp {
  margin-top: -8px !important
}

.l-separator-x2m {
  margin-top: -16px
}

.l-separator-x2m-imp {
  margin-top: -16px !important
}

.l-separator-x3m {
  margin-top: -24px
}

.l-separator-x3m-imp {
  margin-top: -24px !important
}

.l-separator-x4m {
  margin-top: -32px
}

.l-separator-x4m-imp {
  margin-top: -32px !important
}

.l-separator-x5m {
  margin-top: -40px
}

.l-separator-x5m-imp {
  margin-top: -40px !important
}

.l-separator-x6m {
  margin-top: -48px
}

.l-separator-x6m-imp {
  margin-top: -48px !important
}

.l-separator-x7m {
  margin-top: -56px
}

.l-separator-x7m-imp {
  margin-top: -56px !important
}

.l-separator-x8m {
  margin-top: -64px
}

.l-separator-x8m-imp {
  margin-top: -64px !important
}

.l-separator-x9m {
  margin-top: -72px
}

.l-separator-x9m-imp {
  margin-top: -72px !important
}

.l-separator-x10m {
  margin-top: -80px
}

.l-separator-x10m-imp {
  margin-top: -80px !important
}

.l-separator-x11m {
  margin-top: -88px
}

.l-separator-x11m-imp {
  margin-top: -88px !important
}

.l-separator-x12m {
  margin-top: -96px
}

.l-separator-x12m-imp {
  margin-top: -96px !important
}

.l-separator-x13m {
  margin-top: -104px
}

.l-separator-x13m-imp {
  margin-top: -104px !important
}

.l-separator-x14m {
  margin-top: -112px
}

.l-separator-x14m-imp {
  margin-top: -112px !important
}

.l-separator-x15m {
  margin-top: -120px
}

.l-separator-x15m-imp {
  margin-top: -120px !important
}

.l-separator-x16m {
  margin-top: -128px
}

.l-separator-x16m-imp {
  margin-top: -128px !important
}

.l-separator-x17m {
  margin-top: -136px
}

.l-separator-x17m-imp {
  margin-top: -136px !important
}

.l-separator-x18m {
  margin-top: -144px
}

.l-separator-x18m-imp {
  margin-top: -144px !important
}

.l-separator-x19m {
  margin-top: -152px
}

.l-separator-x19m-imp {
  margin-top: -152px !important
}

.l-separator-x20m {
  margin-top: -160px
}

.l-separator-x20m-imp {
  margin-top: -160px !important
}

.l-separator-x21m {
  margin-top: -168px
}

.l-separator-x21m-imp {
  margin-top: -168px !important
}

.l-separator-x22m {
  margin-top: -176px
}

.l-separator-x22m-imp {
  margin-top: -176px !important
}

.l-separator-x23m {
  margin-top: -184px
}

.l-separator-x23m-imp {
  margin-top: -184px !important
}

.l-separator-x24m {
  margin-top: -192px
}

.l-separator-x24m-imp {
  margin-top: -192px !important
}

.l-separator-x25m {
  margin-top: -200px
}

.l-separator-x25m-imp {
  margin-top: -200px !important
}

.l-separator-x26m {
  margin-top: -208px
}

.l-separator-x26m-imp {
  margin-top: -208px !important
}

.l-separator-x27m {
  margin-top: -216px
}

.l-separator-x27m-imp {
  margin-top: -216px !important
}

.l-separator-x28m {
  margin-top: -224px
}

.l-separator-x28m-imp {
  margin-top: -224px !important
}

.l-separator-x29m {
  margin-top: -232px
}

.l-separator-x29m-imp {
  margin-top: -232px !important
}

.l-separator-x30m {
  margin-top: -240px
}

.l-separator-x30m-imp {
  margin-top: -240px !important
}

.l-separator-x0_5m {
  margin-top: -4px
}

.l-separator-x0_5m-imp {
  margin-top: -4px !important
}

.l-separator-x1_5m {
  margin-top: -12px
}

.l-separator-x1_5m-imp {
  margin-top: -12px !important
}

.l-separator-x2_5m {
  margin-top: -20px
}

.l-separator-x2_5m-imp {
  margin-top: -20px !important
}

.l-separator-x3_5m {
  margin-top: -28px
}

.l-separator-x3_5m-imp {
  margin-top: -28px !important
}

.l-separator-x4_5m {
  margin-top: -36px
}

.l-separator-x4_5m-imp {
  margin-top: -36px !important
}

.l-separator-x5_5m {
  margin-top: -44px
}

.l-separator-x5_5m-imp {
  margin-top: -44px !important
}

.l-separator-x6_5m {
  margin-top: -52px
}

.l-separator-x6_5m-imp {
  margin-top: -52px !important
}

.l-separator-x7_5m {
  margin-top: -60px
}

.l-separator-x7_5m-imp {
  margin-top: -60px !important
}

.l-separator-x8_5m {
  margin-top: -68px
}

.l-separator-x8_5m-imp {
  margin-top: -68px !important
}

.l-separator-x9_5m {
  margin-top: -76px
}

.l-separator-x9_5m-imp {
  margin-top: -76px !important
}

.l-separator-x10_5m {
  margin-top: -84px
}

.l-separator-x10_5m-imp {
  margin-top: -84px !important
}

.l-separator-x11_5m {
  margin-top: -92px
}

.l-separator-x11_5m-imp {
  margin-top: -92px !important
}

.l-separator-x12_5m {
  margin-top: -100px
}

.l-separator-x12_5m-imp {
  margin-top: -100px !important
}

.l-separator-x13_5m {
  margin-top: -108px
}

.l-separator-x13_5m-imp {
  margin-top: -108px !important
}

.l-separator-x14_5m {
  margin-top: -116px
}

.l-separator-x14_5m-imp {
  margin-top: -116px !important
}

.l-separator-x15_5m {
  margin-top: -124px
}

.l-separator-x15_5m-imp {
  margin-top: -124px !important
}

.l-separator-x16_5m {
  margin-top: -132px
}

.l-separator-x16_5m-imp {
  margin-top: -132px !important
}

.l-separator-x17_5m {
  margin-top: -140px
}

.l-separator-x17_5m-imp {
  margin-top: -140px !important
}

.l-separator-x18_5m {
  margin-top: -148px
}

.l-separator-x18_5m-imp {
  margin-top: -148px !important
}

.l-separator-x19_5m {
  margin-top: -156px
}

.l-separator-x19_5m-imp {
  margin-top: -156px !important
}

.l-separator-x20_5m {
  margin-top: -164px
}

.l-separator-x20_5m-imp {
  margin-top: -164px !important
}

.l-separator-x21_5m {
  margin-top: -172px
}

.l-separator-x21_5m-imp {
  margin-top: -172px !important
}

.l-separator-x22_5m {
  margin-top: -180px
}

.l-separator-x22_5m-imp {
  margin-top: -180px !important
}

.l-separator-x23_5m {
  margin-top: -188px
}

.l-separator-x23_5m-imp {
  margin-top: -188px !important
}

.l-separator-x24_5m {
  margin-top: -196px
}

.l-separator-x24_5m-imp {
  margin-top: -196px !important
}

.l-separator-x25_5m {
  margin-top: -204px
}

.l-separator-x25_5m-imp {
  margin-top: -204px !important
}

.l-separator-x26_5m {
  margin-top: -212px
}

.l-separator-x26_5m-imp {
  margin-top: -212px !important
}

.l-separator-x27_5m {
  margin-top: -220px
}

.l-separator-x27_5m-imp {
  margin-top: -220px !important
}

.l-separator-x28_5m {
  margin-top: -228px
}

.l-separator-x28_5m-imp {
  margin-top: -228px !important
}

.l-separator-x29_5m {
  margin-top: -236px
}

.l-separator-x29_5m-imp {
  margin-top: -236px !important
}

.l-separator-x30_5m {
  margin-top: -244px
}

.l-separator-x30_5m-imp {
  margin-top: -244px !important
}