/*
Theme Name: OLTANA-004 Child
Version: 1.0.0
Template: oltana-004
Author: CROOVER inc.
Author URI: https://croover.co.jp
*/


/* ヘッダー */
header#olHeader {
    background-color: #ffffff;
}

/* 固定ページの幅広テンプレート時にarticleコンテンツを全幅化 */
 .page-template-template-wide .ol-article__content {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* 固定ページアイキャッチ */
.page h1.ol-article__title {
    position: relative;
    z-index: 1;
    top: -35px;
}
.page .ol-article__thumbnail {
    height: 130px;
    transform: translateY(0) !important;
    opacity: 1 !important;
}
.page img.attachment-large_size.size-large_size.wp-post-image {
    height: 300px;
    margin-left: 16vw;
    display: block;
    width: calc(100vw - 16vw); /* = 84vw、ビューポート基準で右端まで */
    max-width: calc(100vw - 16vw);
    object-fit: cover;
    object-position: center;
}
@media screen and (max-width: 639px) {
    .page img.attachment-large_size.size-large_size.wp-post-image {
        height: 200px;
        margin-left: 8vw;              /* ← お好みの余白に調整 */
        width: calc(100vw - 8vw);      /* ← margin-leftと同じ値 */
        max-width: calc(100vw - 15vw);
    }
}
.page .ol-article__thumbnail::after {
    content: "";
    display: block;
    width: 60%;
    height: 290px;
    background-color: #F7F7F7;
    position: absolute;
    bottom: -200px;
    left: calc(50% - 50vw);
    z-index: -1;
}
@media screen and (max-width: 639px) {
    .page h1.ol-article__title {
        top: -75px;
    }
    .page img.attachment-large_size.size-large_size.wp-post-image {
        height: 200px;
    }
    .page .ol-article__thumbnail::after {
        width: 70%;
        height: 190px;
        bottom: -100px;
        left: -50px;
    }
    .wp-block-snow-monkey-blocks-section.smb-section.smb-section--fit:first-of-type {
        padding-top: 0;
    }
}
 .margin-none p, p.margin-none {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
 }

/* タイトル */
.page h1.ol-article__title {
    text-shadow: 2px 2px 2px rgba(255, 255, 255, 1);
}
.page h1.ol-article__title::before {
  text-shadow: none;
}
.ol-firstview__title {
    text-shadow: 2px 3px 7px rgba(0, 0, 0, 0.4);
}

@media (max-width: 640px) {
    .ol-firstview__image-inner .ol-firstview__item video, .ol-firstview__image-inner .ol-firstview__item img, .ol-firstview__image-inner .splide__slide video, .ol-firstview__image-inner .splide__slide img {
        height: calc(96svh - 120px);
    }
}

/* サブタイトル */
#oltanaPostTitle::before {
  display: block;
  margin-bottom: 4px;
  font-size: 0.9rem;
  letter-spacing: 0.15em;
  color: #0084CD;
  line-height: 1;
}
.page-id-2 #oltanaPostTitle::before {
  content: "information";
}
.page-id-144 #oltanaPostTitle::before {
  content: "contents";
}
.page-id-146 #oltanaPostTitle::before {
  content: "recruit";
}
.page-id-148 #oltanaPostTitle::before {
  content: "free lance";
}
.page-id-150 #oltanaPostTitle::before {
  content: "contact";
}

@media screen and (max-width: 639px) {
    #oltanaPostTitle::before {
        margin-bottom: 2px;
        font-size: 0.7rem;
    }
}

/* ボタン矢印 */
.btn-arrow .smb-btn {
  position: relative;
  padding-right: 30px; /* 画像と文字が重ならないよう余白 */
}

.btn-arrow .smb-btn::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;   /* 画像サイズ */
  height: 30px;
  background-image: url('../oltana-004-child/img/arrow.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

/* セクション余白 */
.section-undernone {
    padding-bottom: 0;
}
.section-topnone {
    padding-top: 0;
}

/* アンカーリンク */
.anchor-link .wp-block-columns.is-not-stacked-on-mobile.is-layout-flex.wp-container-core-columns-is-layout-9d6595d7.wp-block-columns-is-layout-flex{
    margin-bottom: 0;
}
@media screen and (max-width: 639px) {
    .anchor-link {
        font-size: 0.7rem;
        letter-spacing: 0;
    }
    .btn-arrow .smb-btn::after {
        width: 20px;
        height: 20px;
    }
    .anchor-link .wp-block-columns.is-not-stacked-on-mobile.is-layout-flex.wp-container-core-columns-is-layout-9d6595d7.wp-block-columns-is-layout-flex {
		gap: 0.7em;
	}
	.btn-arrow .smb-btn {
	  padding-right: 27px; /* 画像と文字が重ならないよう余白 */
	}
}
.smb-media-text__body.is-layout-constrained.wp-block-snow-monkey-blocks-media-text-is-layout-constrained {
    padding-left: 10px;
    padding-right: 10px;
}
/* 事業内容背景 */
.ol-bgcolor-theme .ol-product__section.ol-fullwidth::before, .ol-bgcolor-theme .ol-product__content {
    background: #0084CD !important;
}

/* 見出し */
.under-line h3.wp-block-heading.under-line {
  margin-top: revert;
  margin-bottom: revert;
  font-size: revert;
  font-weight: revert;
  line-height: revert;
  letter-spacing: revert;
  padding-left: revert;
  padding-top: revert;
  padding-bottom: revert;
  box-sizing: revert;
  position: revert;
}
.under-line h3.wp-block-heading.under-line::before {
  position: revert;
  content: revert;
  top: revert;
  transform: revert;
  height: revert;
  width: revert;
  left: revert;
}

.under-line h2,.under-line h3.wp-block-heading.under-line  {
  border-bottom: solid 1px #D6D8E3;
  position: relative;
  padding-bottom: 10px;
}

.under-line h2:after,.under-line h3.wp-block-heading.under-line:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 1px #0084CD;
  width: 2rem;
  bottom: -1px;
}

.under-line .smb-section__contents-wrapper--center h2:after, h3.wp-block-heading.under-line.has-text-align-center:after  {
    display: none;
}

/* サブタイトル下 */
.under-line .smb-section__subtitle {
    font-weight: 300;
}

@media screen and (max-width: 639px) {
    .under-line .smb-section__subtitle .sme-font-size{
        font-size: 0.9rem !important;
    }
    .under-line span.sme-font-size.has-sm-5-xl-font-size, .under-line h2, h3.wp-block-heading.under-line{
        font-size: 1.4rem !important;
    }
}

/* ------------------
    お問い合わせ
------------------ */
/* 必須フィールドのラベルスタイル */
.wpcf7-form .required {
background-color: #ed0707e8; /* レッド */
color: #ffffff;
padding: 2px 5px;
border-radius: 3px;
margin-left: 10px;
font-size: 12px;
}

.p-sentence-scroll__inner {
    margin: 0 auto;
    height: 140px;
    overflow: auto;
    padding: 25px;
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    line-height: 1.5;
    margin-top: 0 !important;
}
.page-id-150 .wp-block-snow-monkey-blocks-section.smb-section.smb-section--fit {
    padding-bottom: 0;
}
.wpcf7 p {
    padding-bottom: 0;
    padding-top: 0;
}
span.consent-text {
    margin-top: 0;
    display: flex;
    justify-content: center;
}

/* ===== CF7 ポップアップ オーバーレイ ===== */
.cf7-popup-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.cf7-popup-overlay.is-active {
  display: flex;
  animation: cf7-fadein 0.2s ease;
}
@keyframes cf7-fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ポップアップ本体 */
.cf7-popup-box {
  background: #fff;
  border-radius: 16px;
  padding: 2rem;
  width: min(360px, 90vw);
  text-align: center;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
  animation: cf7-slidein 0.2s ease;
}
@keyframes cf7-slidein {
  from { transform: translateY(12px) scale(0.97); opacity: 0; }
  to   { transform: translateY(0) scale(1); opacity: 1; }
}

/* アイコン */
.cf7-popup-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  margin: 0 auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cf7-popup-icon svg { width: 24px; height: 24px; }

/* タイトル */
.cf7-popup-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
  color: #111;
}

/* メッセージ（wpcf7-response-output の内容を移す） */
.cf7-popup-msg {
  font-size: 14px;
  color: #555;
  line-height: 1.65;
  margin-bottom: 1.5rem;
}

/* 閉じるボタン */
.cf7-popup-close {
  display: inline-block;
  padding: 10px 28px;
  border-radius: 8px;
  border: 1px solid #ddd;
  background: transparent;
  font-size: 14px;
  cursor: pointer;
  color: #333;
  transition: background 0.15s;
}
.cf7-popup-close:hover { background: #f5f5f5; }

/* 状態別カラー */
.cf7-popup-overlay.is-sent    .cf7-popup-icon { background: #EAF3DE; }
.cf7-popup-overlay.is-sent    .cf7-popup-icon svg { stroke: #3B6D11; }
.cf7-popup-overlay.is-invalid .cf7-popup-icon { background: #FAEEDA; }
.cf7-popup-overlay.is-invalid .cf7-popup-icon svg { stroke: #854F0B; }
.cf7-popup-overlay.is-error   .cf7-popup-icon { background: #FCEBEB; }
.cf7-popup-overlay.is-error   .cf7-popup-icon svg { stroke: #A32D2D; }

/* 元の wpcf7-response-output は非表示にする */
.wpcf7-response-output { display: none !important; }


/* ------------------
    採用情報
------------------ */
/* スライダー */
.slider-wrapper {
  overflow: hidden;
  width: 100%;
  padding: 10px 0;
}

.slider-track {
  display: flex;
  align-items: center;
  width: max-content;
  gap: 30px;
  animation: slide 40s linear infinite;
}


@keyframes slide {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.slide-item {
  border-radius: 16px;
  overflow: hidden;
  flex-shrink: 0;
  position: relative;
}

.slide-item.portrait {
  width: 220px;
  height: 360px;
}

.slide-item.landscape {
  width: 420px;
  height: 260px;
}

.slide-item img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* 福利厚生 */
.benefits [class^=oltana-icon-], [class*=" oltana-icon-"]{
    font-size: 1.4rem;
    font-weight: bold !important;
}

.benefits p.has-text-align-center {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.4em;
}

.benefits .smb-panels__item.smb-panels__item--free.has-background {
    border-radius: 8px;
}


/* ------------------
  企業情報
------------------ */

.smb-section__fixed-background {
    border-radius: 0 50px 0 0;
}
.bg-left .smb-section__fixed-background {
    border-radius: 50px 0 0 0;
}

/* 会社概要 */
.wp-block-snow-monkey-blocks-information.smb-information.is-style-information {
    margin-top: 20px;
    margin-bottom: 20px;
}
.is-style-information .smb-information__item {
    margin-top: 0
}

.is-style-information .smb-information__item>.c-row>.c-row__col:first-child {
    padding-top: 1.5rem
}

.is-style-information .smb-information__item>.c-row>.c-row__col:last-child {
    border-bottom: 1px solid #cfcfcf;
    padding-bottom: 1.5rem
}

.is-style-information .smb-information__item__label {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.8
}

.is-style-information .smb-information__item__body>p {
    line-height: 1.8
}

.is-style-infomation[data-sm-split-column=true] .smb-information__item>.c-row>.c-row__col:first-child {
    border-bottom: 1px solid #0085c6;
    padding-bottom: 1.5rem
}

.is-style-infomation[data-sm-split-column=true] .smb-information__item>.c-row>.c-row__col:last-child {
    padding-top: 1.5rem
}

.is-style-information .smb-information__item__body>p {
    margin-top: 0;
    margin-bottom: 0;
}


@media screen and (min-width: 640px) {
    .is-style-information .smb-information__item>.c-row>.c-row__col:first-child {
        border-bottom:1px solid #0084CD;
        padding-bottom: 1.5rem
    }

    .is-style-information .smb-information__item>.c-row>.c-row__col:last-child {
        padding-top: 1.5rem
    }
}

@media screen and (min-width: 640px) and (max-width:1023px) {
    .is-style-information .smb-information__item>.c-row>.c-row__col--md-1-4 {
        flex-basis:22.5%;
        margin-right: 2.5%;
        max-width: 22.5%
    }

    .is-style-information .smb-information__item>.c-row>.c-row__col--md-1-3 {
        flex-basis: 30.8%;
        margin-right: 2.5%;
        max-width: 30.8%
    }
}

@media screen and (min-width: 1024px) {
    .is-style-information .smb-information__item>.c-row>.c-row__col:first-child {
        flex-basis:240px;
        margin-right: 2.5rem;
        max-width: 240px
    }

    .is-style-information .smb-information__item>.c-row>.c-row__col:last-child {
        flex-basis: calc(100% - 280px);
        max-width: calc(100% - 280px)
    }
}

@media screen and (max-width: 1023px) {
    .is-style-information .smb-information__item>.c-row>.c-row__col--1-4 {
        flex-basis:22.5%;
        margin-right: 2.5%;
        max-width: 22.5%
    }

    .is-style-information .smb-information__item>.c-row>.c-row__col--1-3 {
        flex-basis: 30.8%;
        margin-right: 2.5%;
        max-width: 30.8%
    }
}

@media screen and (max-width: 639px) {
    .wp-block-snow-monkey-blocks-box.smb-box {
        padding-left: 10px;
        padding-right: 10px;
    }
    .is-style-information .c-row__col.c-row__col--1-1.c-row__col--md-1-4 {
        margin-bottom: 0;
    }
}


/* 沿革 */
.timeline .smb-spider-contents-slider__item .title {
    border-top: none !important;
    padding-top: 20px;
    background-image: radial-gradient(circle, #c7d6e4 1px, transparent 1px);
    background-size: 10px 2px; /* 横の数値を大きくすると間隔が広がる */
    background-repeat: repeat-x;
    background-position: top left;
}
.timeline .smb-spider-contents-slider__item .title:after {
    content: "";
    display: block;
    left: -4px;
    position: absolute;
    top: 40px;
    background-color: #ffffff;
    border: 3px solid #0084CD;
	border-radius: 100%;
	height: 20px;
	width: 20px;
}
.timeline .smb-spider-contents-slider__item p {
    margin-bottom: 0 !important;
}
.timeline .margin-none {
    margin-top: 0 !important;
}
.timeline .spider>.spider__arrows {
	top: -2%;
	justify-content: flex-end;
}
.timeline .spider__arrow {
    border: 1px solid #0084CD;
	border-radius: 100%;
	margin-right: 20px;
	height: 36px;
	width: 36px;
}
.timeline .spider__arrow:before {
	height: 8px;
	width: 8px;
}
.timeline .spider__arrow[data-direction=prev]:before {
    left: calc(59% - var(--spider--arrow-size) / 2);
    top: calc(51% - var(--spider--arrow-size) / 2);
    border-left: 1px solid #0084CD;
    border-bottom: 1px solid #0084CD
}
.timeline .spider__arrow[data-direction=next]:before {
    top: calc(51% - var(--spider--arrow-size) / 2);
    right: calc(54% - var(--spider--arrow-size) / 2);
    border-right: 1px solid #0084CD;
    border-top: 1px solid #0084CD
}
.timeline .spider__arrow {
    /* background: linear-gradient(120deg, #0084CD 43.79%, #51C5F7 106.21%); */
	border-radius: 100%;

}

/* ドット */
.timeline.smb-spider-slider > .spider__dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2px;
  margin: 40px 0 0;
}
.timeline.smb-spider-slider > .spider__dots .spider__dot {
  margin: 0;
  width: 40px;
  height: 3px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: #cfcfcf;
  font-size: 0;
  line-height: 0;
  color: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
}
.timeline.smb-spider-slider > .spider__dots .spider__dot[aria-current="true"] {
  background: #0084CD;
}
.timeline .spider__canvas {
    padding-left: 10px;
}


/* ------------------
    事業内容
------------------ */

.top-border .smb-box__background {
    border-top: 6px solid #0084CD;
}

/* 背景文字移動 */
.bgtext-move .smb-section__contents-wrapper.smb-section__contents-wrapper--left {
    padding-top: 40px;
}
.bgtext-move .smb-section__background-text {
  overflow: hidden;
  position: relative;
  display: flex;
}

.bgtext-move .smb-section__background-text__text {
  display: inline-block;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 100%;
  animation: bgTextMove 26s linear infinite;
  opacity: 0.05;
  color: #0084cd;
}

.bgtext-move .smb-section__background-text__text:nth-child(2) {
  animation-delay: -13s;
}

@keyframes bgTextMove {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (max-width: 639px) {
    .bgtext-move .smb-section__contents-wrapper.smb-section__contents-wrapper--left {
        padding-top: 0px;
    }
    .bgtext-move .smb-section__background-text__text {
        font-size: 4.5rem;
        top: 20px;
    }
}

/* 実績 */
.achievements h3.wp-block-heading {
    margin-bottom: 6px;
}
.achievements p {
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    padding-left: 2rem;
}
.achievements h3.wp-block-heading::before {
    height: 1.8rem;
    background-color: #0084CD;
}
/* イラスト余白 */
.illust figure.wp-block-image {
    margin-top: 15px;
}

.number-tech.questionnaire .wp-block-columns {
    gap: 1em;
    margin-bottom: 1em;
}

/* ------------------
    アニメーション
------------------ */
.number-tech .wp-block-image {
    margin-top: 20px;
    margin-bottom: 20px;
}
.number-tech p.has-text-align-center {
    margin-bottom: 10px;
    margin-top: 10px;
}
.number-tech :where(.wp-block-columns.is-layout-flex) {
    gap: 1em;
    row-gap: 0;
}
.number-tech-column {
    margin-bottom: 0;
}

/* 数字表示共通 */
.count {
    text-align: center;
    height: 70px;
}

.count-unit {
    font-size: 2rem;
    font-weight: bold;
    color: #0084CD;
}

.employee-countUp,
.average-age-countUp,
.manual-countUp,
.paid-leave-countUp,
.male-countUp,
.female-countUp,
.lunch-bento-countUp,
.lunch-eatingout-countUp,
.lunch-convenience-countUp,
.lunch-other-countUp,
.commute-car-countUp,
.commute-trainbus-countUp,
.commute-walk-countUp,
.owned-kei-countUp,
.owned-minivan-countUp,
.owned-suv-countUp,
.owned-sedan-countUp,
.owned-sportscar-countUp {
    display: inline-block;
    min-width: 2.5ch;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: bold;
    line-height: 1;
    color: #0084CD;
}

/* 大きい数字 */
.employee-countUp,
.average-age-countUp,
.manual-countUp,
.paid-leave-countUp {
    font-size: 4rem;
}

/* 男女比 */
.gender-ratio-count {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
}
.gender-ratio-item {
    text-align: center;
}
.gender-ratio-label {
    display: block;
    font-size: 1rem;
    font-weight: bold;
    color: #0084CD;
    margin-bottom: 0;
}
.gender-ratio-count .count-unit {
    font-size: 1.2rem;
}
.male-countUp,
.female-countUp {
    font-size: 3rem;
}

/* 年齢割合 */
.age-vertical-bar-container {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    justify-content: center;
    height: 172px;
    width: 80%;
    box-sizing: border-box;
    margin: 0 auto 18px;
    padding-top: 20px;
    padding-bottom: 25px;
}
.age-vertical-bar {
    position: relative;
    width: 60px;
    background-color: #0084CD;
    border-radius: 5px;
    height: 0;
    animation: vertical-growBar 1s forwards;
    --height: 50%;
}
.age-vertical-bar:nth-child(1) {
    --height: 46%;
}
.age-vertical-bar:nth-child(2) {
    --height: 88%;
}
.age-vertical-bar:nth-child(3) {
    --height: 50%;
}
.age-vertical-bar:nth-child(4) {
    --height: 16%;
}
@keyframes vertical-growBar {
    from {
        height: 0;
    }
    to {
        height: var(--height);
    }
}
.age-vertical-label {
    position: absolute;
    bottom: -25px;
    width: 100%;
    text-align: center;
    font-size: 0.9rem;
    font-weight: bold;
    color: #0084CD;
}

/* 円グラフ */
.c-circle-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
}
.c-circle {
    width: 210px;
    padding-bottom: 210px;
    position: relative;
    margin: auto;
}
.c-circle__view {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    overflow: visible;
}
.c-circle__1,
.c-circle__2,
.c-circle__3 {
    fill: transparent;
    stroke-width: 31.8309886184;
    stroke-dashoffset: 25;
}
.c-circle__1 {
    animation: one 5s ease-out forwards;
    stroke-dasharray: 45 55 0 0;
    stroke: #0084CD;
}
.c-circle__2 {
    animation: two 5s ease-out forwards;
    stroke-dasharray: 0 45 35 20;
    stroke: #5DBDED;
}
.c-circle__3 {
    animation: three 5s ease-out forwards;
    stroke-dasharray: 0 80 20 0;
    stroke: #bfdbfe;
}
.c-circle__label {
    letter-spacing: 0.05em;
    font-size: 3.4px;
    font-weight: 700;
    fill: #fff;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}
.c-circle__label--dark {
    fill: #0084CD;
}
.c-circle__num {
    letter-spacing: 0.05em;
    font-size: 8px;
    font-weight: 700;
    fill: #fff;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}
.c-circle__num--dark {
    fill: #0084CD;
}
.c-circle__unit {
    font-size: 4px;
    fill: #fff;
}
.c-circle__unit--dark {
    fill: #0084CD;
}
@keyframes one {
    0% { stroke-dasharray: 0 0 0 100; }
    25% { stroke-dasharray: 45 55 0 0; }
}
@keyframes two {
    0% { stroke-dasharray: 0 0 0 100; }
    50% { stroke-dasharray: 0 45 35 20; }
}
@keyframes three {
    0% { stroke-dasharray: 0 0 0 100; }
    50% { stroke-dasharray: 0 80 20 0; }
}
/* ------------------
    スマホ対応
------------------ */

@media screen and (max-width: 980px) {
    .number-tech .wp-block-columns {
        gap: 0.6em;
        margin-bottom: 5px;
    }
    .number-tech p.has-text-align-center .sme-font-size{
        font-size: 1rem !important;
    }
    .count {
        text-align: center;
        height: 45px;
    }

    .number-tech.number-of .aligncenter.size-full.is-resized img{
        height: 60px !important;
        object-fit: contain;
    }

  /* 共通：単位ラベル */
    .count-unit {
    font-size: 1rem;
    height: 50px;
    }

  /* 社員数 */
    .employee-countUp {
    font-size: 2.8rem;
    }

  /* 平均年齢 */
    .average-age-countUp {
    font-size: 2.8rem;
    }

  /* 男女比 */
    .gender-ratio-label {
    font-size: 1rem;
    }
    .male-countUp,
    .female-countUp {
    font-size: 2rem;
    }
	
  /* 年齢割合バーグラフ */
    .age-vertical-bar-container {
    gap: 5px;
    height: 127px;
    width: 95%;
    padding-bottom: 18px;
    }
    .age-vertical-bar {
    width: 42px;
    }
    .age-vertical-label {
    font-size: 0.7rem;
    bottom: -18px;
    }

  /* 円グラフ */
    .c-circle {
    width: 173px;
    padding-bottom: 173px;
    }

  /* マニュアルメーカー数 */
    .manual-countUp {
    font-size: 2.8rem;
    }
    .manual .sme-line-height {
    line-height: 1.1 !important;
    }
  /* 有休消化 */
    .paid-leave-countUp {
    font-size: 2.8rem;
    }
}



/* ------------------
    アンケート
------------------ */

.questionnaire .wp-block-column {
    padding: 16px;
}

/* 事務所の雰囲気 */
.atmosphere .wp-block-column {
    padding: 0;
}
.atmosphere {
    position: relative;
    overflow: hidden;
}
.atmosphere::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 120px;
    height: 120px;
    background-image: url('../oltana-004-child/img/atmosphere-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}

/* 出身地 */
.birthplace {
    position: relative;
    overflow: hidden;
}
.birthplace::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 150px;
    height: 150px;
    background-image: url('../oltana-004-child/img/map-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}
.area.wp-block-group-is-layout-flex {
    gap: 50px;
}

/* ランチ */
.number-tech .lunch .wp-block-image {
    margin-top: 0px;
    margin-bottom: 0px;
}
.number-tech .count-item p {
    line-height: 1.1;
    padding-bottom: 10px;
}
.lunch .count {
    height: 3rem;
}
.lunch-bento-countUp,
.lunch-eatingout-countUp,
.lunch-convenience-countUp,
.lunch-other-countUp {
    display: inline-block;
    min-width: 2.8ch;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 2.6rem;
    font-weight: bold;
    line-height: 1;
    color: #0084CD;
}

/* 趣味 */
.hobby .sme-bg-color,
.reason .sme-bg-color {
    border-radius: 100px;
    padding: 2px 10px;
}
.hobby {
    position: relative;
    overflow: hidden;
}
.hobby::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 50px;
    width: 100px;
    height: 100px;
    background-image: url('../oltana-004-child/img/hobby-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}

/* 住宅 */
.housing {
    position: relative;
    overflow: hidden;
}
.housing::after {
    content: "";
    position: absolute;
    right: 20px;
    bottom: 10px;
    width: 160px;
    height: 160px;
    background-image: url('../oltana-004-child/img/housing-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}
.housing-graph {
    width: min(100%, 760px);
    margin: 0 auto;
}
.housing-graph__item + .housing-graph__item {
    margin-top: 24px;
}
.housing-graph__row {
    display: grid;
    grid-template-columns: 60px 1fr;
    align-items: center;
    gap: 18px;
}
.housing-graph__label {
    font-size: 1rem;
    font-weight: 700;
    color: #0084CD;
    letter-spacing: 0.03em;
}
.housing-graph__track {
    position: relative;
    width: 100%;
    height: 40px;
    border-radius: 6px;
    overflow: visible;
}
.housing-graph__bar {
    position: relative;
    width: 0;
    height: 100%;
    border-radius: 6px;
    background: #0084CD;
    animation: housing-bar-grow 1.2s ease-out forwards;
}
.housing-graph__percent {
    position: absolute;
    top: 50%;
    left: calc(100% + 12px);
    transform: translateY(-50%);
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1;
    color: #0084CD;
    white-space: nowrap;
}
@keyframes housing-bar-grow {
    from {
        width: 0;
    }
    to {
        width: var(--bar-width);
    }
}
@media (max-width: 640px) {
    .housing-graph__row {
        grid-template-columns: 72px 1fr;
        gap: 12px;
    }
    .housing-graph__label {
        font-size: 0.92rem;
    }
    .housing-graph__track {
        height: 20px;
    }
    .housing-graph__percent {
        font-size: 1rem;
        left: calc(100% + 8px);
    }
}

/* 入社理由 */
.reason {
    position: relative;
    overflow: hidden;
}
.reason::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 80px;
    height: 80px;
    background-image: url('../oltana-004-child/img/reason-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}

/* 会社の魅力 */
.wp-block-group.charm-item {
    padding-left: 20px;
}
.charm {
    position: relative;
    overflow: hidden;
}
.charm::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 36%;
    width: 100px;
    height: 100px;
    background-image: url('../oltana-004-child/img/charm-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}

/* 福利厚生 */
.welfare-circle-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
}
.welfare-circle {
    width: 210px;
    padding-bottom: 210px;
    position: relative;
    margin: auto;
}
.welfare-circle__view {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    overflow: visible;
}
.welfare-circle__1,
.welfare-circle__2,
.welfare-circle__3 {
    fill: transparent;
    stroke-width: 31.8309886184;
    stroke-dashoffset: 25;
}
.welfare-circle__1 {
    animation: welfare-one 5s ease-out forwards;
    stroke-dasharray: 50 50 0 0;
    stroke: #0084CD;
}
.welfare-circle__2 {
    animation: welfare-two 5s ease-out forwards;
    stroke-dasharray: 0 50 30 20;
    stroke: #5DBDED;
}
.welfare-circle__3 {
    animation: welfare-three 5s ease-out forwards;
    stroke-dasharray: 0 80 20 0;
    stroke: #bfdbfe;
}
.welfare-circle__label {
    letter-spacing: 0.05em;
    font-size: 3.4px;
    font-weight: 700;
    fill: #fff;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}
.welfare-circle__label--dark {
    fill: #0084CD;
}
.welfare-circle__num {
    letter-spacing: 0.05em;
    font-size: 8px;
    font-weight: 700;
    fill: #fff;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}
.welfare-circle__num--dark {
    fill: #0084CD;
}
.welfare-circle__unit {
    font-size: 4px;
    fill: #fff;
}
.welfare-circle__unit--dark {
    fill: #0084CD;
}
@keyframes welfare-one {
    0% { stroke-dasharray: 0 0 0 100; }
    25% { stroke-dasharray: 50 50 0 0; }
}
@keyframes welfare-two {
    0% { stroke-dasharray: 0 0 0 100; }
    50% { stroke-dasharray: 0 50 30 20; }
}
@keyframes welfare-three {
    0% { stroke-dasharray: 0 0 0 100; }
    50% { stroke-dasharray: 0 80 20 0; }
}
.welfare-icon {
    position: absolute;
    display: block;
    width: 80px;
    height: 80px;
    z-index: 3;
    pointer-events: none;
}
.welfare-icon::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.welfare-icon--lunch {
    top: 70px;
    right: -65px;
}
.welfare-icon--lunch::before {
    background-image: url('../oltana-004-child/img/lunch-img4.webp');
}
.welfare-icon--party {
    top: 160px;
    left: -30px;
}
.welfare-icon--party::before {
    background-image: url('../oltana-004-child/img/drinking-img.webp');
}
.welfare-icon--activity {
    top: -35px;
    left: -15px;
}
.welfare-icon--activity::before {
    background-image: url('../oltana-004-child/img/megaphone-img.webp');
}

/* 通勤手段 */
.number-tech .commute .wp-block-image {
    margin-top: 0px;
    margin-bottom: 0px;
}
.commute .count {
    height: 3rem;
}
.commute-car-countUp,
.commute-trainbus-countUp,
.commute-walk-countUp {
    display: inline-block;
    min-width: 3ch;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 2.6rem;
    font-weight: bold;
    line-height: 1;
    color: #0084CD;
}

/* 所有車 */
.number-tech .owned-car .count-item {
    gap: 40px;
}
.count-item .wp-block-image {
    margin-bottom: 8px;
}
.owned-car .count {
    height: 3rem;
}
.owned-kei-countUp,
.owned-minivan-countUp,
.owned-suv-countUp,
.owned-sedan-countUp,
.owned-sportscar-countUp {
    display: inline-block;
    min-width: 3ch;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 2.6rem;
    font-weight: bold;
    line-height: 1;
    color: #0084CD;
}

/* 働きやすい部分 */
.goodpoint {
    position: relative;
    overflow: hidden;
}
.goodpoint::after {
    content: "";
    position: absolute;
    right: 30px;
    top: 90px;
    width: 180px;
    height: 180px;
    background-image: url('../oltana-004-child/img/good-img.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    pointer-events: none;
}

/* タブレット */
@media screen and (min-width: 782px) and (max-width: 1100px) {
    .questionnaire {
        font-size: 0.7rem;
    }
    .area.wp-block-group-is-layout-flex {
        gap: 40px;
    }
    .hobby .sme-bg-color,
    .reason .sme-bg-color {
        padding: 2px 6px;
        font-size: 10px;
    }
    .hobby .sports-item {
        font-size: 10px !important;
        line-height: 1.3;
    }
    .birthplace::after {
        width: 80px;
        height: 80px;
    }
    .lunch-bento-countUp,
    .lunch-eatingout-countUp,
    .lunch-convenience-countUp,
    .lunch-other-countUp,
    .commute-car-countUp,
    .commute-trainbus-countUp,
    .commute-walk-countUp,
    .owned-kei-countUp,
    .owned-minivan-countUp,
    .owned-suv-countUp,
    .owned-sedan-countUp,
    .owned-sportscar-countUp {
        font-size: 1.6rem;
        min-width: 2ch;
    }
    .lunch .count {
        height: 2rem;
    }
    .count-unit {
        font-size: 0.8rem;
    }
    .housing-graph__row {
        grid-template-columns: 40px 1fr;
        gap: 10px;
    }
    .housing-graph__label {
        font-size: 0.8rem;
    }
    .housing-graph__item + .housing-graph__item {
        margin-top: 10px;
    }
    .welfare-icon {
        width: 60px;
        height: 60px;
    }
    .atmosphere::after {
        right: 6px;
        bottom: 6px;
        width: 8vw;
        height: 8vw;
    }
    .hobby::after {
        right: 0;
        bottom: 27%;
        width: 7vw;
        height: 7vw;
    }
    .housing::after {
        right: 6px;
        bottom: 6px;
        width: 70px;
        height: 70px;
    }
    .reason::after {
        right: 6px;
        bottom: 6px;
        width: 50px;
        height: 50px;
    }
    .charm::after {
        right: 6px;
        bottom: 48%;
        width: 60px;
        height: 60px;
    }
    .welfare-icon--lunch {
        top: 160px;
        right: -20px;
    }
    .welfare-icon--party {
        top: 160px;
        left: -15px;
    }
    .welfare-icon--activity {
        top: -5px;
        left: -20px;
    }
    .owned-car .count {
        height: 1.3rem;
    }
    .goodpoint::after {
        right: 0;
        top: 60px;
        width: 140px;
        height: 140px;
    }
}

/* スマホ */
@media screen and (max-width: 781px) {
    .hobby::after {
        right: 20px;
        bottom: 16px;
        width: 20vw;
        height: 20vw;
    }
    .reason::after {
        right: 20px;
        bottom: 6px;
        width: 25vw;
        height: 25vw;
    }
    .welfare-icon--lunch {
        top: 60px;
        right: -70px;
    }
    .welfare-icon--party {
        top: 140px;
        left: -60px;
    }
    .welfare-icon--activity {
        top: -20px;
        left: -50px;
    }
}

@media screen and (max-width: 575px) {
    .atmosphere::after {
        right: 6px;
        bottom: 6px;
        width: 70px;
        height: 70px;
    }
    .birthplace::after {
        width: 100px;
        height: 100px;
    }
    .hobby::after {
        bottom: 30px;
        right: 20px;
        width: 17vw;
        height: 17vw;
    }
    .housing::after {
        right: 6px;
        bottom: 6px;
        width: 90px;
        height: 90px;
    }
    .reason::after {
        right: 6px;
        bottom: 6px;
        width: 20vw;
        height: 20vw;
    }
    .charm::after {
        bottom: 40%;
        width: 20vw;
        height: 20vw;
    }
    .welfare-icon::before {
        width: 70%;
        height: 70%;
    }
    .welfare-icon--lunch {
        top: 80px;
        right: -70px;
    }
    .welfare-icon--party {
        top: 120px;
        left: -45px;
    }
    .welfare-icon--activity {
        top: 0px;
        left: -20px;
    }
    .goodpoint::after {
        right: 0;
        top: 60px;
        width: 120px;
        height: 120px;
    }

    .questionnaire {
        font-size: 0.7rem;
    }
    .hobby .sme-bg-color,
    .reason .sme-bg-color {
        padding: 2px 6px;
        font-size: 10px;
    }
    .number-tech .owned-car .count-item {
        gap: 10px;
    }
    .owned-kei-countUp, .owned-minivan-countUp, .owned-suv-countUp, .owned-sedan-countUp, .owned-sportscar-countUp {
        font-size: 2rem;
    }
}

@media screen and (max-width: 400px) {
	.gender-ratio-label {
		font-size: 0.8rem;
    }
    .male-countUp,
    .female-countUp {
    font-size: 1.2rem;
    }
	.gender-ratio-count .count-unit {
		font-size: 0.8rem;
	}
	 .age-vertical-label {
        font-size: 0.6rem;
		bottom: -30px;
    }
	.atmosphere::after {
        width: 60px;
        height: 60px;
    }
	.manual-countUp {
        font-size: 2.4rem;
    }
	.wp-block-group.is-nowrap.is-layout-flex.wp-container-core-group-is-layout-ad2f72ca.wp-block-group-is-layout-flex {
		gap: 0.2em;
	}
	.hobby::after {
        bottom: 40px;
        right: 7px;
        width: 13vw;
        height: 13vw;
    }
	.housing::after {
        width: 74px;
        height: 74px;
    }
	.reason::after {
        width: 15vw;
        height: 15vw;
    }
	.charm::after {
        bottom: 60%;
    }
	.area.wp-block-group-is-layout-flex {
		gap: 40px;
	}
	.birthplace::after {
        width: 70px;
        height: 70px;
    }
	.lunch-bento-countUp, .lunch-eatingout-countUp, .lunch-convenience-countUp, .lunch-other-countUp {
		font-size: 1.6rem;
	}
	.lunch .count {
		height: 1.8rem;
	}
	.welfare-icon::before {
        width: 60%;
        height: 60%;
    }
	.welfare-icon--party {
        top: 160px;
        left: -12px;
    }
	.welfare-icon--activity {
        top: -7px;
        left: -16px;
    }
	.commute-car-countUp, .commute-trainbus-countUp, .commute-walk-countUp {
		font-size: 1.6rem;
	}
	.owned-kei-countUp, .owned-minivan-countUp, .owned-suv-countUp, .owned-sedan-countUp, .owned-sportscar-countUp {
        font-size: 1.4rem;
    }
	.number-tech .owned-car .count-item {
        gap: 5px;
    }
	.number-tech .owned-car span.sme-line-height {
		letter-spacing: 0;
	}
	.owned-kei-countUp, .owned-minivan-countUp, .owned-suv-countUp, .owned-sedan-countUp, .owned-sportscar-countUp {
		min-width: 2ch;
	}
	.goodpoint::after {
        top: -10px;
        width: 60px;
        height: 60px;
    }
}
@media screen and (max-width: 300px) {
	.hobby::after {
        bottom: 20px;
	}
	.number-tech p.has-text-align-center .sme-font-size {
        letter-spacing: 0;
    }
	.housing::after {
        width: 48px;
        height: 48px;
    }
}
/* ------------------
   タイトル以外の文章を下から表示
------------------ */

/* まず文章は全部アニメーション対象にする */
.block8 p,
.block8 li,
.block9 p,
.block9 li,
.block11 p,
.block11 li,
.block13 p,
.block13 li,
.block14 p,
.block14 li,
.block18 p,
.block18 li {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.7s ease,
    transform 0.7s ease;
}

/* blockに is-animated が付いたら表示 */
.block8.is-animated p,
.block8.is-animated li,
.block9.is-animated p,
.block9.is-animated li,
.block11.is-animated p,
.block11.is-animated li,
.block13.is-animated p,
.block13.is-animated li,
.block14.is-animated p,
.block14.is-animated li,
.block18.is-animated p,
.block18.is-animated li {
  opacity: 1;
  transform: translateY(0);
}

/* ただし各blockのタイトルだけは最初から表示しておく */
.block8 > p.has-text-align-center,
.block9 > p.has-text-align-center,
.block11 > p.has-text-align-center,
.block13 > p.has-text-align-center,
.block14 > p.has-text-align-center,
.block18 > p.has-text-align-center {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
/* ------------------
   blockごとに発火
------------------ */

/* block1 社員数 */
.block1 .employee-countUp {
  animation-play-state: paused;
}
.block1.is-animated .employee-countUp {
  animation-play-state: running;
}

/* block2 年齢割合 */
.block2 .age-vertical-bar {
  animation-play-state: paused;
}
.block2.is-animated .age-vertical-bar {
  animation-play-state: running;
}

/* block3 平均年齢 */
.block3 .average-age-countUp {
  animation-play-state: paused;
}
.block3.is-animated .average-age-countUp {
  animation-play-state: running;
}

/* block4 男女比 */
.block4 .male-countUp,
.block4 .female-countUp {
  animation-play-state: paused;
}
.block4.is-animated .male-countUp,
.block4.is-animated .female-countUp {
  animation-play-state: running;
}

/* block5 有給休暇消化率 */
.block5 .paid-leave-countUp {
  animation-play-state: paused;
}
.block5.is-animated .paid-leave-countUp {
  animation-play-state: running;
}

/* block6 マニュアルメーカー数 */
.block6 .manual-countUp {
  animation-play-state: paused;
}
.block6.is-animated .manual-countUp {
  animation-play-state: running;
}

/* block7 前職・経歴 円グラフ */
.block7 .c-circle__1,
.block7 .c-circle__2,
.block7 .c-circle__3 {
  animation-play-state: paused;
}
.block7.is-animated .c-circle__1,
.block7.is-animated .c-circle__2,
.block7.is-animated .c-circle__3 {
  animation-play-state: running;
}

/* block10 普段のランチ */
.block10 .lunch-bento-countUp,
.block10 .lunch-eatingout-countUp,
.block10 .lunch-convenience-countUp,
.block10 .lunch-other-countUp {
  animation-play-state: paused;
}
.block10.is-animated .lunch-bento-countUp,
.block10.is-animated .lunch-eatingout-countUp,
.block10.is-animated .lunch-convenience-countUp,
.block10.is-animated .lunch-other-countUp {
  animation-play-state: running;
}

/* block12 住宅 */
.block12 .housing-graph__bar {
  animation-play-state: paused;
}
.block12.is-animated .housing-graph__bar {
  animation-play-state: running;
}

/* block15 福利厚生費の使い方 */
.block15 .welfare-circle__1,
.block15 .welfare-circle__2,
.block15 .welfare-circle__3 {
  animation-play-state: paused;
}
.block15.is-animated .welfare-circle__1,
.block15.is-animated .welfare-circle__2,
.block15.is-animated .welfare-circle__3 {
  animation-play-state: running;
}

/* block16 通勤手段 */
.block16 .commute-car-countUp,
.block16 .commute-trainbus-countUp,
.block16 .commute-walk-countUp {
  animation-play-state: paused;
}
.block16.is-animated .commute-car-countUp,
.block16.is-animated .commute-trainbus-countUp,
.block16.is-animated .commute-walk-countUp {
  animation-play-state: running;
}

/* block17 所有車 */
.block17 .owned-kei-countUp,
.block17 .owned-minivan-countUp,
.block17 .owned-suv-countUp,
.block17 .owned-sedan-countUp,
.block17 .owned-sportscar-countUp {
  animation-play-state: paused;
}
.block17.is-animated .owned-kei-countUp,
.block17.is-animated .owned-minivan-countUp,
.block17.is-animated .owned-suv-countUp,
.block17.is-animated .owned-sedan-countUp,
.block17.is-animated .owned-sportscar-countUp {
  animation-play-state: running;
}



/* ------------------
    吹き出し
------------------ */
.fukidashi-01-13 {
  position: relative;
  background-image: url("data:image/svg+xml,%3Csvg width='757' height='526' viewBox='0 0 757 526' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='3.26501' y1='2.50041' x2='217.356' y2='520.879' stroke='%230084CD' stroke-width='5' stroke-linecap='round'/%3E%3Cline x1='2.5' y1='-2.5' x2='563.349' y2='-2.5' transform='matrix(-0.381727 0.924275 0.924275 0.381727 757 1.14404)' stroke='%230084CD' stroke-width='5' stroke-linecap='round'/%3E%3Cline x1='717.137' y1='247.492' x2='581.348' y2='523.007' stroke='%230084CD' stroke-width='5' stroke-linecap='round'/%3E%3Cline x1='2.5' y1='-2.5' x2='309.66' y2='-2.5' transform='matrix(0.442081 0.896975 0.896975 -0.442081 39 244.144)' stroke='%230084CD' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain; /* または cover */
  background-position: center center;
}


/* フリーランス表 */
.free-lance {
  padding-top: 0;
}

.free-lance .smb-section__body.is-layout-constrained.wp-block-snow-monkey-blocks-section-is-layout-constrained {
  margin-top: 0;
}

.free-lance .smb-information__item__label .sme-font-size {
  font-family: 'Albert Sans', Noto Sans JP, sans-serif;
  font-weight: 100;
  text-align: center;
  color: #0085c6;
}

.free-lance .is-style-infotable .smb-information__item {
  border-bottom: 1px solid #cfcfcf;
}

.free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col:last-child {
  padding-bottom: 1.5rem;
}

@media screen and (min-width: 640px) {
  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col:first-child {
    padding-bottom: 1.5rem;
  }

  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col:last-child {
    padding-top: 1.5rem;
  }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col--md-1-4 {
    flex-basis: 22.5%;
    margin-right: 2.5%;
    max-width: 22.5%;
  }

  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col--md-1-3 {
    flex-basis: 30.8%;
    margin-right: 2.5%;
    max-width: 30.8%;
  }
}

@media screen and (min-width: 1024px) {
  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col:first-child {
    flex-basis: 240px;
    margin-right: 2.5rem;
    max-width: 240px;
  }

  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col:last-child {
    flex-basis: calc(100% - 280px);
    max-width: calc(100% - 280px);
  }
}

@media screen and (max-width: 1023px) {
  .free-lance .smb-information .smb-information__item__label {
    justify-content: flex-start;
  }

  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col--1-4 {
    flex-basis: 22.5%;
    margin-right: 0;
    max-width: 22.5%;
  }

  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col--1-3 {
    flex-basis: 30.8%;
    margin-right: 2.5%;
    max-width: 30.8%;
  }
}

@media screen and (max-width: 639px) {
  .free-lance .is-style-infotable .smb-information__item > .c-row > .c-row__col--1-4 {
    flex-basis: 19%;
  }
  .free-lance .smb-information__item__label span.sme-font-size {
    line-height: 1;
    font-size: 2.4rem !important;
  }
}