@font-face {
  font-family: 'NEXA Light';
  src: url("../fonts/Nexa-Light.woff2") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'NEXA Bold';
  src: url("../fonts/Nexa-Bold.woff2") format("opentype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'NEXA Bold cyr';
  src: url("../fonts/Nexa-Bold5.otf") format("opentype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Noah Regular Italic';
  src: url("../fonts/Noah-RegularItalic.otf") format("opentype"), url("../fonts/Noah-RegularItalic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'Noah Bold Italic';
  src: url("../fonts/Noah-BoldItalic.otf") format("opentype"), url("../fonts/Noah-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: 'Noah Regular';
  src: url("../fonts/Noah-Regular.otf") format("opentype"), url("../fonts/Noah-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Noah Bold';
  src: url("../fonts/Noah-Bold.otf") format("opentype"), url("../fonts/Noah-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
/* line 2, ../sass/service-post/service-post-top.scss */
.header:not(.white) .hLogo, .header:not(.white) .hMenu {
  filter: invert(1) brightness(2);
}
/* line 6, ../sass/service-post/service-post-top.scss */
.header:not(.white) .hNav > ul > li > a {
  filter: invert(1) brightness(2);
}
/* line 11, ../sass/service-post/service-post-top.scss */
.header:not(.white) .hLang .polylang--list {
  background: transparent;
  border: 1px solid #fff;
  color: #fff;
}

/* line 19, ../sass/service-post/service-post-top.scss */
.ServicePostTop {
  position: relative;
  color: #fff;
}
/* line 23, ../sass/service-post/service-post-top.scss */
.ServicePostTop .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* line 30, ../sass/service-post/service-post-top.scss */
.ServicePostTop .bg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* line 37, ../sass/service-post/service-post-top.scss */
.ServicePostTop .bg:after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.5;
}
/* line 50, ../sass/service-post/service-post-top.scss */
.ServicePostTop .container {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  justify-content: space-between;
  padding-top: var(--header-height);
  min-height: clamp(432px, 100vh, 1080px);
  padding-bottom: 30px;
}
@media (orientation: portrait) {
  /* line 50, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .container {
    min-height: calc(100vw * 11 /16);
  }
}
/* line 71, ../sass/service-post/service-post-top.scss */
.ServicePostTop .top {
  position: relative;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-top: calc(5.57vw * 16 / 9);
}
/* line 87, ../sass/service-post/service-post-top.scss */
.ServicePostTop .left {
  position: relative;
  width: 50%;
}
/* line 92, ../sass/service-post/service-post-top.scss */
.ServicePostTop .right {
  position: relative;
  width: 49%;
}
/* line 97, ../sass/service-post/service-post-top.scss */
.ServicePostTop .bot {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-end;
}
/* line 106, ../sass/service-post/service-post-top.scss */
.ServicePostTop .site-text {
  width: 390px;
  max-width: 100%;
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 115, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .container {
    min-height: 100vw;
    height: calc(var(--vh, 1vh) * 100);
    padding-bottom: 15px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) and (orientation: portrait) {
  /* line 115, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .container {
    min-height: 100vw;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 125, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .top {
    padding-top: 50%;
  }
  /* line 129, ../sass/service-post/service-post-top.scss */
  .ServicePostTop h1.site-title {
    font-size: 22px;
    margin-bottom: 20px;
  }
  /* line 134, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .left {
    width: 100%;
  }
  /* line 138, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .right {
    width: 100%;
  }
  /* line 142, ../sass/service-post/service-post-top.scss */
  .ServicePostTop .site-text {
    width: 100%;
  }
}
/* line 1, ../sass/service-post/service-post-desc.scss */
.ServicePostDesc {
  position: relative;
}
/* line 4, ../sass/service-post/service-post-desc.scss */
.ServicePostDesc .site-title {
  width: 916px;
  max-width: 100%;
}
/* line 9, ../sass/service-post/service-post-desc.scss */
.ServicePostDesc .content {
  position: relative;
  width: 500px;
  margin-left: 46%;
  margin-top: calc(5.2vw * 16 / 9);
}
/* line 16, ../sass/service-post/service-post-desc.scss */
.ServicePostDesc .site-text {
  margin-bottom: calc(0.9vw * 16 / 9);
}
/* line 19, ../sass/service-post/service-post-desc.scss */
.ServicePostDesc .site-text:nth-last-child(1) {
  margin-bottom: 0;
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /* line 28, ../sass/service-post/service-post-desc.scss */
  .ServicePostDesc .content {
    width: 440px;
    margin-left: 25%;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 39, ../sass/service-post/service-post-desc.scss */
  .ServicePostDesc .content {
    width: 100%;
    margin-left: 0%;
    margin-top: calc(5.2vw * 16 / 9);
  }
  /* line 45, ../sass/service-post/service-post-desc.scss */
  .ServicePostDesc .site-text {
    margin-bottom: 15px;
  }
  /* line 48, ../sass/service-post/service-post-desc.scss */
  .ServicePostDesc .site-text:nth-last-child(1) {
    margin-bottom: 0;
  }
}
/* line 1, ../sass/service-post/service-post-gal.scss */
.ServicePostGal {
  position: relative;
  overflow: hidden;
}
/* line 5, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .site-title {
  max-width: calc(100% - 100px);
  min-height: 34px;
}
@media (hover: hover) {
  /* line 5, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .site-title {
    min-height: initial;
  }
}
/* line 14, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .arrows {
  position: absolute;
  top: 0;
  right: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
/* line 25, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-button-prev, .ServicePostGal .swiper-button-next {
  display: none;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
  position: relative;
  left: auto;
  top: auto;
  right: auto;
  margin: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #2c3c4c;
}
/* line 40, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-button-prev:before, .ServicePostGal .swiper-button-next:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  background: #fff;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  transition: 0.3s ease all;
}
/* line 54, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-button-prev:after, .ServicePostGal .swiper-button-next:after {
  position: relative;
  transition: 0.3s ease all;
  z-index: 2;
  color: #fff;
  font-size: 16px;
}
@media (hover: hover) {
  /* line 64, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-button-prev:hover:before, .ServicePostGal .swiper-button-next:hover:before {
    transform: translate(-50%, -50%) scale(1);
  }
  /* line 68, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-button-prev:hover:after, .ServicePostGal .swiper-button-next:hover:after {
    color: #2c3c4c;
  }
}
/* line 75, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-pagination {
  position: relative;
  bottom: auto;
  margin-top: 15px;
}
/* line 81, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #263247;
}
/* line 87, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-button-next {
  margin-left: 15px;
}
/* line 91, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper {
  overflow: visible;
  margin-top: calc(0.9vw * 16 / 9);
}
/* line 96, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-slide {
  width: 42vw;
  max-width: 800px;
}
/* line 100, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-slide .img {
  display: block;
  height: calc(42vw * 12 / 16);
  margin-bottom: 15px;
}
/* line 105, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-slide .img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* line 113, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-slide.ShopTPL {
  width: 21vw;
  max-width: 400px;
}
/* line 117, ../sass/service-post/service-post-gal.scss */
.ServicePostGal .swiper-slide.ShopTPL .img {
  height: calc(21vw * 12 / 16);
}
@media (hover: hover) {
  /* line 126, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-button-prev, .ServicePostGal .swiper-button-next {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
  }
  /* line 134, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-pagination {
    display: none;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 143, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-slide {
    width: 100%;
  }
  /* line 146, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-slide .img {
    display: block;
    height: calc(calc(100vw - 30px) * 12 / 16);
  }
  /* line 151, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-slide.ShopTPL {
    width: 345px;
    max-width: calc(100vw - 45px);
  }
  /* line 155, ../sass/service-post/service-post-gal.scss */
  .ServicePostGal .swiper-slide.ShopTPL .img {
    height: calc(calc(100vw - 30px) * 9 / 16);
  }
}
/* line 1, ../sass/service-post/service-post-how.scss */
.ServicePostHow {
  position: relative;
}
/* line 4, ../sass/service-post/service-post-how.scss */
.ServicePostHow .result {
  position: relative;
  counter-reset: section;
  margin-top: calc(1.3vw * 16 / 9);
}
/* line 10, ../sass/service-post/service-post-how.scss */
.ServicePostHow .row {
  position: relative;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #000;
  padding-top: 10px;
  padding-bottom: 15px;
}
/* line 22, ../sass/service-post/service-post-how.scss */
.ServicePostHow .row:before {
  counter-increment: section;
  content: counter(section);
  color: #263247;
  line-height: 0.8;
  font-size: calc(4.4vw * 16 / 9);
}
/* line 31, ../sass/service-post/service-post-how.scss */
.ServicePostHow .content {
  position: relative;
  width: 400px;
  min-width: 54%;
}
/* line 36, ../sass/service-post/service-post-how.scss */
.ServicePostHow .content .site-text {
  width: 400px;
  max-width: 100%;
  margin-bottom: 25px;
}
/* line 41, ../sass/service-post/service-post-how.scss */
.ServicePostHow .content .site-text.fz20 {
  margin-bottom: 0;
}
/* line 46, ../sass/service-post/service-post-how.scss */
.ServicePostHow .content .over {
  margin-bottom: 20px;
}

@media only screen and (min-width: 1024px) and (max-width: 1479px) {
  /* line 56, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .content .site-text {
    margin-bottom: 20px;
  }
  /* line 60, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .content .over {
    margin-bottom: 15px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 71, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .row {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  /* line 78, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .row:before {
    font-size: 56px;
    margin-bottom: 20px;
  }
  /* line 84, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .content {
    width: 100%;
    min-width: 100%;
  }
  /* line 88, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .content .site-text {
    width: 100%;
    margin-bottom: 20px;
  }
  /* line 93, ../sass/service-post/service-post-how.scss */
  .ServicePostHow .content .over {
    margin-bottom: 15px;
  }
}
/* line 1, ../sass/service-post/service-post-proj.scss */
.ServicePostProj {
  position: relative;
}
/* line 4, ../sass/service-post/service-post-proj.scss */
.ServicePostProj .result {
  position: relative;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
}

/* line 20, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB {
  position: relative;
  width: 800px;
  max-width: calc((100% - 20px) / 2);
  margin-bottom: calc(2.35vw * 16 / 9);
}
/* line 26, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB:nth-last-child(1) {
  margin-bottom: 0;
  width: 100%;
  max-width: 100%;
}
/* line 32, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB:nth-last-child(1) .img img {
  max-height: initial;
}
/* line 38, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB:nth-child(2) {
  margin-left: 0;
}
/* line 42, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB .img {
  display: block;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
/* line 48, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB .img img {
  display: block;
  object-fit: cover;
  transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  width: 100%;
  aspect-ratio: 16/9;
  max-height: 450px;
}
/* line 58, ../sass/service-post/service-post-proj.scss */
.ServicePostProjB .info {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
}
@media (hover: hover) {
  /* line 71, ../sass/service-post/service-post-proj.scss */
  .ServicePostProjB:hover .img img {
    transform: scale(1.1);
  }
  /* line 76, ../sass/service-post/service-post-proj.scss */
  .ServicePostProjB:hover .site-text {
    text-decoration: underline;
  }
}

@media only screen and (min-width: 0px) and (max-width: 767px) {
  /* line 85, ../sass/service-post/service-post-proj.scss */
  .ServicePostProjB {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }
  /* line 90, ../sass/service-post/service-post-proj.scss */
  .ServicePostProjB .info {
    margin-top: 10px;
  }
}
/* line 13, ../sass/service-post.scss */
body {
  padding-top: 0;
}