@layer project {
  @layer parts;
  @layer content;
}
@layer project {
  :root {
    --color-main: #44ACD3;
    --color-main-on: white;
    --color-sub: #FFE749;
    --color-sub-on: #0D0D0D;
    --grad-main: linear-gradient(to right, rgba(135, 246, 240, 0.2) 0%, rgba(142, 159, 233, 0.2) 100%), -webkit-linear-gradient(left, rgba(135, 246, 240, 0.2) 0%, rgba(142, 159, 233, 0.2) 100%);
    --translucent-main: rgba(68, 172, 211, 0.2);
    --color-border-main: rgba(68, 172, 211, 0.5);
    --color-border-sub: rgba(255, 231, 73, 0.5);
    --border-main: 1px solid var(--color-border-main);
    --border-sub: 1px solid var(--color-border-sub);
    /* be adjust */
  }
  @layer parts {
    /* font */
    @font-face {
      font-family: "Poppins", sans-serif;
      font-weight: 600;
      font-display: swap;
      src: url("/font/Poppins.woff2") format("woff2");
    }
    /* common */
    /* .p */
    h2.p {
      display: -webkit-flex;
      -webkit-flex-wrap: wrap;
      -webkit-align-items: center;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 1em;
    }
    h2.p i {
      font-size: 2em;
      color: var(--color-main);
    }
    h2.p b::before {
      content: "-";
      margin-right: 0.5em;
    }
    h2.p b::after {
      content: "-";
      margin-left: 0.5em;
    }
    .p-caseForm {
      background-color: var(--color-main);
      padding: 3em 1em;
    }
    .p-caseForm .flex {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      display: -webkit-flex;
      -webkit-flex-wrap: wrap;
      -webkit-justify-content: center;
      -webkit-align-items: center;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 0.5em;
    }
    .p-caseForm .flex span {
      display: block;
      font-size: 0.9em;
      text-align: center;
      padding: 0.5em;
    }
    @container _container (max-width: 600px) {
      .p-caseForm .flex span {
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
        max-width: 100%;
      }
    }
    .p-caseForm .flex dl.keyword input {
      width: min(10em, 30cqw);
    }
    .p-caseForm .flex dt {
      display: none;
    }
    /* js */
    /* m */
    /* form */
    /* util */
    /* embed */
    .e-content {
      border: var(--border-main);
      border-radius: 0;
      padding: 0.5em;
    }
    .e-content .img {
      height: 12em;
    }
    .e-content .e-user {
      padding: 0;
    }
    .e-content .e-user em {
      max-width: initial;
    }
    .e-content .texts {
      padding: 0.5em;
    }
    .e-overlayMenu {
      padding-top: 7em;
    }
    .e-overlayMenu .header {
      max-width: var(--width-max-s);
    }
    .e-overlayMenu .contents {
      max-width: var(--width-max-s);
      margin-right: auto;
      margin-left: auto;
    }
    .e-overlayMenu .contents nav {
      padding: 2.5vh padding(m);
    }
    .e-overlayMenu .contents h2 {
      margin-bottom: 1em;
    }
    .e-overlayMenu .contents a {
      display: block;
      color: black;
      background-color: rgba(255, 255, 255, 0.9);
      padding: 1em;
      margin-top: 0.5em;
    }
    .e-overlayMenu .contents a::before {
      font-family: "FontAwesome solid";
      content: "\f138";
      vertical-align: baseline;
      margin-right: 0.35em;
      color: var(--color-main);
    }
    .e-user img {
      background-color: white;
      object-fit: contain;
      border: 1px solid rgba(211, 211, 211, 0.25);
    }
    /* tpl */
    .t-siteFooter {
      color: var(--initial-color);
      background-color: white;
    }
    .t-siteFooter img {
      width: 200px;
    }
    .t-siteHeader h1 a {
      width: min(100px, 20cqw);
    }
    .t-siteHeader a {
      font-weight: normal;
    }
    @container _container (max-width: 700px) {
      .t-siteHeader a:where([href*="/login"], [href*="/logout"]) {
        display: none;
      }
    }
    @container _container (max-width: 550px) {
      .t-siteHeader a:where([href*="/register/new"], [href*="/inquiry"]) {
        font-size: 0;
      }
    }
    .t-siteHeader a:where([href*="/register/new"], [href*="/inquiry"])::before {
      font-size: 1.25rem;
    }
    .t-siteHeader a[href*="/register/new"]::before {
      font-family: "FontAwesome solid";
      content: "\f234";
      vertical-align: baseline;
      margin-right: 0.35em;
    }
    .t-siteHeader a[href*="/inquiry"]::before {
      font-family: "FontAwesome solid";
      content: "\f0e0";
      vertical-align: baseline;
      margin-right: 0.35em;
    }
    .t-siteHeader a[href*="/logout"]::before {
      font-family: "FontAwesome solid";
      content: "\f08b";
      vertical-align: baseline;
    }
    .t-siteHeader .e-user {
      max-width: initial;
    }
    .t-siteHeader .e-user em {
      max-width: initial;
    }
    /* _component */
  }
  @layer content {
    /* freespace */
    /* _backend */
    /* _area */
    /* _auth */
    /* _bank */
    /* _blog */
    /* _blog/_blogpost */
    /* _blog/_blogmanage */
    /* _community */
    /* _community/_community */
    /* _community/_topic */
    /* _community/_event */
    /* _community/_member */
    /* _community/_comment */
    /* _community/_communitymanage */
    /* _earnings */
    /* _event */
    /* _event/_event */
    /* _event/_eventmanage */
    /* _knowledge */
    /* _knowledge/_knowledge */
    /* _knowledge/_knowledgemanage */
    /* _mypage */
    /* _mypage/_config */
    /* _notification */
    /* _purchase */
    /* _purchase/_cart */
    /* _purchase/_purchasemanage */
    /* _questionnaire */
    /* _register */
    /* _reset_password */
    /* _sale */
    /* _stc */
    /* _stc/_case */
    ._stc._case._embed_content .img {
      height: 12em;
    }
    ._stc._case._embed_content [src*=noImage] {
      padding: 20%;
    }
    ._stc._case._embed_content .imployment {
      display: inline-block;
      font-size: 0.8em;
      color: var(--color-main-on);
      background-color: var(--color-main);
      padding: 0.25em 0.75em;
      position: absolute;
      top: 60cqw;
      right: 0;
    }
    ._stc._case._embed_content footer {
      font-size: 0.9em;
      overflow: hidden;
    }
    ._stc._case._embed_content dl {
      display: -webkit-flex;
      -webkit-align-items: baseline;
      display: flex;
      align-items: baseline;
      gap: 0.75em;
      padding: 0.25em 0;
      white-space: nowrap;
    }
    ._stc._case._embed_content dt {
      font-size: 0.9em;
      color: var(--color-main);
    }
    ._stc._case._embed_content dd {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    ._stc._case._index::before {
      content: "";
      display: block;
      width: 100%;
      height: 50vh;
      background: var(--grad-main);
      position: absolute;
      top: 75vh;
    }
    ._stc._case._index ._d {
      color: white;
      background-color: var(--color-gray-dark);
      padding: 5vh 1em;
    }
    ._stc._case._index ._d ._embed_contentHeader {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._stc._case._index ._efg {
      width: 100%;
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._stc._case._index ._f {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._stc._case._index ._f .content {
      padding-top: 5vh;
    }
    ._stc._case._index ._f .data h4 {
      color: var(--color-main);
      background-color: var(--translucent-main);
      padding: 0.5em 1em;
    }
    ._stc._case._index ._f iframe {
      width: 100%;
      aspect-ratio: 16/9;
    }
    ._stc._case._ownerCaseList ._b {
      background-color: #FFF;
    }
    ._stc._case._ownerCaseList ._b .e-user {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      padding: 1em;
    }
    ._stc._case._ownerCaseList ._b .e-user .userImg {
      border: 1px solid rgba(211, 211, 211, 0.5);
    }
    ._stc._case._ownerCaseList ._b .e-user em {
      max-width: none;
    }
    ._stc._case._search :where(._c, ._i) {
      display: none;
    }
    ._stc._case._search ._j {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._stc._case._search ._j .more {
      display: none;
    }
    ._stc._case._search ._j .swiper-slide {
      max-width: 300px;
      height: auto;
      padding: 0.5em;
    }
    ._stc._case._search ._d {
      background-color: var(--color-gray-light);
    }
    ._stc._case._search ._d section {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      padding-top: 2.5vh;
    }
    ._stc._case._search ._d .flex {
      display: -webkit-flex;
      display: flex;
      gap: 1em;
    }
    ._stc._case._search ._d dl {
      margin: 0.5em 0;
    }
    ._stc._case._search ._d dt {
      font-size: 0.9em;
    }
    ._stc._case._search ._d dd {
      font-size: 0.9em;
    }
    ._stc._case._search ._d [type=text] {
      width: 100%;
    }
    ._stc._case._search ._f {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      padding-top: 5vh;
    }
    ._stc._case._search ._j {
      padding: 5vh 1em;
    }
    /* _stc/_casemanage */
    ._stc._casemanage._conf ._f .u-mediaDatas {
      gap: 0.75em;
    }
    ._stc._casemanage._conf ._f .u-mediaDatas .image {
      width: min(15cqw, 5.5em);
    }
    /* _stp */
    /* _stp/_product */
    /* _stp/_productmanage */
    /* _str */
    /* _str/_reserve */
    /* _str/_reservemanage */
    /* _shipping */
    /* _sitetop */
    /* _sitetop/_index */
    ._sitetop._index ._k {
      margin-top: 0;
    }
    ._sitetop._index ._d ._mv {
      background-image: url(/image/project/mv.bg.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
    }
    ._sitetop._index ._d ._mv ._container {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    @container _container (max-width: 1000px) {
      ._sitetop._index ._d ._mv ._container {
        padding: 5vh 5vw;
      }
    }
    @container _container (min-width: 1001px) {
      ._sitetop._index ._d ._mv ._container {
        padding: 20vh 5vw;
      }
    }
    @container _container (max-width: 1000px) {
      ._sitetop._index ._d ._mv ._grid {
        text-align: center;
      }
    }
    @container _container (min-width: 1001px) {
      ._sitetop._index ._d ._mv ._grid {
        display: grid;
        grid-template: "h1  persons" auto;
        grid-template-columns: minmax(10cqw, 300px) 1fr;
        gap: 1em;
      }
    }
    ._sitetop._index ._d ._mv h1 {
      grid-area: h1;
      text-align: center;
      padding: 2em 1em;
    }
    ._sitetop._index ._d ._mv h1 img {
      padding: 1em;
    }
    @container _container (max-width: 1000px) {
      ._sitetop._index ._d ._mv h1 img {
        width: 100%;
        max-width: 300px;
      }
    }
    ._sitetop._index ._d ._mv .persons {
      grid-area: persons;
      width: 100%;
    }
    @container _container (max-width: 1000px) {
      ._sitetop._index ._d ._mv .persons {
        max-width: 500px;
      }
    }
    ._sitetop._index ._d ._belt {
      background-color: var(--color-main);
      padding: 3em 1em;
    }
    ._sitetop._index ._d ._belt .flex {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      display: -webkit-flex;
      -webkit-flex-wrap: wrap;
      -webkit-justify-content: center;
      -webkit-align-items: center;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 0.5em;
    }
    ._sitetop._index ._d ._belt .flex span {
      display: block;
      font-size: 0.9em;
      text-align: center;
      padding: 0.5em;
    }
    @container _container (max-width: 600px) {
      ._sitetop._index ._d ._belt .flex span {
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
        max-width: 100%;
      }
    }
    ._sitetop._index ._d ._belt .flex dl.keyword input {
      width: min(10em, 30cqw);
    }
    ._sitetop._index ._d ._belt .flex dt {
      display: none;
    }
    ._sitetop._index ._f {
      background-color: white;
    }
    ._sitetop._index ._f :where(.contents > section)::before {
      display: none;
    }
    ._sitetop._index ._f :where(.contents > section)::after {
      display: none;
    }
    ._sitetop._index ._f :where(.news, .about, .recommend, .latest, .blog) {
      padding: 10vh min(2em, 5cqw);
    }
    ._sitetop._index ._f :where(.news, .recommend, .blog) {
      background: var(--grad-main);
    }
    ._sitetop._index ._f :where(.c) {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._sitetop._index ._f :where(h2.p) {
      padding: 1em;
    }
    ._sitetop._index ._f :where(.swiper-slide) {
      padding: 0.5em;
    }
    ._sitetop._index ._f .news h2 {
      text-align: left;
    }
    ._sitetop._index ._f .news h2 i {
      display: block;
      font-size: 2em;
      color: var(--color-main);
    }
    ._sitetop._index ._f .news h2 span {
      font-weight: normal;
      font-size: 1rem;
    }
    ._sitetop._index ._f .news ._container {
      padding: 0;
    }
    ._sitetop._index ._f .news ._container ._grid {
      gap: 5cqw;
    }
    ._sitetop._index ._f .about h2 {
      padding: 5cqw;
    }
    ._sitetop._index ._f .about ul {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      display: -webkit-flex;
      -webkit-flex-wrap: wrap;
      -webkit-justify-content: center;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 5cqw;
    }
    ._sitetop._index ._f .about li {
      -webkit-flex: 0 1 auto;
      flex: 0 1 auto;
      width: 21em;
      display: -webkit-flex;
      -webkit-flex-direction: column;
      -webkit-align-items: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.5em;
    }
    ._sitetop._index ._f .about li img {
      width: 20em;
    }
    ._sitetop._index ._f .about li i {
      font-weight: bold;
      font-size: 4em;
      color: var(--color-sub);
      line-height: 1;
    }
    ._sitetop._index ._f .about li dt {
      font-size: 1.15em;
      font-weight: bold;
      text-align: center;
      margin-bottom: 0.5em;
    }
    ._sitetop._index ._f .about li dd {
      line-height: 1.7;
    }
    /* _special */
    ._special._index.company ._f {
      padding: 0;
    }
    ._special._index.company ._f :where(p) {
      word-break: keep-all;
    }
    ._special._index.company ._f .pageHeader {
      color: white;
      background-color: var(--color-gray-dark);
      padding: 10vh 1em;
    }
    ._special._index.company ._f h2 {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      font-size: 1.25em;
    }
    ._special._index.company ._f h2 span::before {
      content: "-";
      margin-right: 0.5em;
    }
    ._special._index.company ._f h2 span::after {
      content: "-";
      margin-left: 0.5em;
    }
    ._special._index.company ._f .overview {
      display: grid;
      grid-template: "logo texts   ." auto "logo texts   ." auto ".    persons ." auto;
      grid-template-columns: 1fr clamp(300px, 100%, var(--width-max-m)) 1fr;
      background-image: url(/image/project/about/mv.bg.png);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
    }
    ._special._index.company ._f .overview .logo {
      grid-area: logo;
      -webkit-align-self: center;
      align-self: center;
      -webkit-justify-self: end;
      justify-self: end;
      height: 50cqh;
    }
    ._special._index.company ._f .overview .texts {
      grid-area: texts;
      font-size: 1.1em;
      padding: 15vh 1em;
      position: relative;
    }
    ._special._index.company ._f .overview .texts p {
      font-weight: bold;
      line-height: 2.5;
      margin: 3em 0;
    }
    ._special._index.company ._f .overview .persons {
      grid-area: persons;
      width: 75%;
      position: absolute;
      right: 1em;
      bottom: 0;
      translate: 0 50%;
    }
    ._special._index.company ._f .solutions {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      padding: 20vh max(5cqw, 1em);
    }
    @container _container (max-width: 600px) {
      ._special._index.company ._f .solutions h3 {
        text-align: center;
      }
    }
    ._special._index.company ._f .solutions h3 i {
      font-size: 2em;
      color: var(--color-main);
    }
    ._special._index.company ._f .solutions h3 span {
      display: block;
    }
    ._special._index.company ._f .solutions li {
      box-shadow: 0 0 5px lightgray;
      padding: 2em 1em;
      margin: 2em 0;
    }
    @container _container (max-width: 600px) {
      ._special._index.company ._f .solutions li {
        display: -webkit-flex;
        -webkit-flex-direction: column;
        -webkit-justify-content: center;
        -webkit-align-items: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }
    }
    @container _container (min-width: 601px) {
      ._special._index.company ._f .solutions li {
        display: -webkit-flex;
        -webkit-align-items: center;
        display: flex;
        align-items: center;
        gap: 2em;
      }
    }
    ._special._index.company ._f .solutions img {
      width: 150px;
    }
    ._special._index.company ._f .solutions i {
      font-weight: bold;
      font-size: 3em;
      color: var(--color-sub);
    }
    @container _container (max-width: 600px) {
      ._special._index.company ._f .solutions i {
        display: block;
        text-align: center;
      }
    }
    ._special._index.company ._f .solutions dt {
      font-weight: bold;
      font-size: 1.25em;
      margin-bottom: 0.5em;
    }
    ._special._index.company ._f .solutions dd {
      line-height: 1.75;
    }
    ._special._index.company ._f .solutions footer {
      max-width: var(--width-max-s);
      margin-right: auto;
      margin-left: auto;
      text-align: center;
      padding: 7.5vh 1em;
    }
    ._special._index.company ._f .solutions footer p {
      display: inline;
      font-weight: bold;
      font-size: min(1.5em, 5cqw);
      background: linear-gradient(to bottom, transparent 70%, var(--color-sub) 90%), -webkit-linear-gradient(top, transparent 70%, var(--color-sub) 90%);
      line-height: 3;
    }
    ._special._index.company ._f .pr {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
      padding: 10vh 1em 5vh;
      position: relative;
    }
    ._special._index.company ._f .pr::before {
      content: "";
      display: block;
      background: var(--grad-main);
      height: 80%;
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      z-index: -1;
    }
    ._special._index.company ._f .pr h3 {
      font-size: 1.5em;
      text-align: center;
      margin-bottom: 1.5em;
    }
    ._special._index.company ._f .pr p {
      max-width: var(--width-max-s);
      margin-top: 5vh;
      margin-bottom: 5vh;
      margin-right: auto;
      margin-left: auto;
      font-size: 1.1em;
      line-height: 2.5;
      text-align: center;
    }
    ._special._index.company ._f .pr .images {
      display: -webkit-flex;
      -webkit-justify-content: center;
      -webkit-align-items: center;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 2em;
      margin-top: 5vh;
    }
    ._special._index.company ._f .pr .images img {
      width: min(200px, 48%);
      aspect-ratio: 1;
      border-radius: 100%;
    }
    ._special._index.company ._f .outside {
      max-width: var(--width-max-s);
      margin-right: auto;
      margin-left: auto;
      font-size: 1.1em;
      line-height: 2.5;
      text-align: center;
      margin-bottom: 5vh;
    }
    ._special._index.company ._f .pageFooter {
      background: var(--grad-main);
      padding: 10vh 1em;
    }
    ._special._index.company ._f .pageFooter .c {
      max-width: 1200px;
      margin-right: auto;
      margin-left: auto;
    }
    ._special._index.company ._f .pageFooter p {
      line-height: 3;
      text-align: center;
      padding: 5vh 5cqw;
    }
    ._special._index.company ._f .pageFooter .snss {
      display: -webkit-flex;
      -webkit-justify-content: center;
      -webkit-align-items: center;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 1em;
      margin-top: 5vh;
    }
    ._special._index.company ._f .pageFooter .snss a {
      display: inline-block;
    }
    ._special._index.company ._f .pageFooter .snss img {
      height: 4em;
    }
    /* _user */
    ._user._embed_showProfile .pageHeader {
      width: 100%;
      margin-bottom: 1em;
    }
    ._user._embed_showProfile .e-user .above {
      display: -webkit-flex;
      -webkit-flex-wrap: wrap;
      -webkit-align-items: baseline;
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 0 1em;
      font-size: 0.9em;
      margin-bottom: 0.25em;
    }
    ._user._embed_showProfile .e-user .above dl {
      -webkit-flex: 0 0 auto;
      flex: 0 0 auto;
      display: -webkit-flex;
      -webkit-align-items: baseline;
      display: flex;
      align-items: baseline;
      gap: 0.5em;
    }
    ._user._embed_showProfile .e-user .above dt {
      font-size: 0.8em;
      color: var(--color-main);
    }
    ._user._embed_showProfile .e-user em {
      max-width: unset;
      white-space: normal;
      line-height: 1.5;
    }
    ._user._embed_showProfile .e-user nav {
      margin-left: auto;
    }
    ._user._embed_showProfile [href*="/offer"] {
      margin: 2.5vh;
    }
    ._user._embed_showProfile [href*="/offer"]::before {
      font-family: "FontAwesome solid";
      content: "\f14a";
      vertical-align: baseline;
    }
    ._user._embed_showProfile iframe {
      display: block;
      width: 100%;
      aspect-ratio: 4/3;
      margin: 5vh 0;
    }
    ._user._embed_showProfile .hp {
      display: table;
      font-size: 1.15em;
      color: var(--color-a);
      margin: 2.5vh 0;
    }
    ._user._embed_showProfile .hp::before {
      font-family: "FontAwesome solid";
      content: "\f08e";
      vertical-align: baseline;
      margin-right: 0.35em;
    }
    ._user._embed_showProfile .e-switchContents {
      margin-top: 5vh;
    }
    ._user._embed_showProfile .e-switchContents [data-target="1"] {
      padding: 0;
    }
    ._user._info.partner ._f .swiper-slide img {
      width: 100%;
    }
    ._user._search ._d .u-searchForm ._flex {
      -webkit-justify-content: center;
      justify-content: center;
    }
    @container _container (min-width: 601px) {
      ._user._search ._d .u-searchForm .date dd {
        display: -webkit-flex;
        -webkit-align-items: center;
        display: flex;
        align-items: center;
      }
    }
    @container _container (min-width: 801px) {
      ._user._search ._f .userList {
        display: -webkit-flex;
        -webkit-flex-wrap: wrap;
        display: flex;
        flex-wrap: wrap;
        gap: 1em;
      }
    }
    ._user._search ._f .user {
      background-color: white;
      border-radius: var(--radius-m);
    }
    @container _container (max-width: 800px) {
      ._user._search ._f .user {
        margin-top: 1em;
      }
    }
    @container _container (min-width: 801px) {
      ._user._search ._f .user {
        -webkit-flex: 0 0 auto;
        flex: 0 0 auto;
        width: calc(50% - 0.5em);
      }
    }
    ._user._search ._f .user .e-user ._grid {
      position: relative;
      z-index: 1;
      padding: max(2.5cqw, 1em);
    }
    ._user._search ._f .user .e-user ._grid:hover {
      opacity: 1;
    }
    ._user._search ._f .user .e-user ._grid:hover::before {
      width: 100%;
      opacity: 1;
    }
    ._user._search ._f .user .e-user ._grid::before {
      content: "";
      display: block;
      width: 0;
      background: var(--grad-main);
      opacity: 0;
      transition: 0.25s;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      z-index: -1;
    }
    ._user._search ._f .user .e-user .above {
      font-size: 0.8em;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    ._user._search ._f .user .e-user .above span {
      margin-right: 0.5em;
    }
    ._user._search ._f .user .e-user em {
      max-width: unset;
      font-size: 1.25em;
    }
    ._user._search ._f .user .props {
      padding: max(2.5cqw, 1em);
      padding-top: 0;
      margin-top: 1em;
    }
    ._user._search ._f .user dl {
      display: -webkit-flex;
      -webkit-align-items: center;
      display: flex;
      align-items: center;
      gap: 0.75em;
      font-size: 0.9em;
      padding: 0.25em 0;
    }
    ._user._search ._f .user dl:not(:last-of-type) {
      border-bottom: 1px solid var(--color-border-gray);
    }
    ._user._search ._f .user dt {
      -webkit-flex: 0 0 12em;
      flex: 0 0 12em;
      max-width: 12em;
      font-size: 0.9em;
      color: var(--color-main);
    }
  }
}
