@charset "utf-8";

/* CSS Document */
/*-------------------------------------------*/
/**** index ****/
/*
・初期設定
・基本共通設定
・共通：装飾・レイアウト・デザイン
・共通：追加スタイル
・header
・innerなど、サイズ設定
・TOP
・下層
・下層見出し
・基本投稿設定
・ページネーション
・common-contact(CTA)
・common-bnr
・footer
・ページトップ
*/
/*svg スプライト
svgはエディタで開いてください
*/
/*-------------------------------------------*/

/*-------------------------------------------*/
/*	初期設定
/*-------------------------------------------*/
:root {
    --root-font-size: 16;
    /*メインテキストカラー#444444(カラーパレットに反映させるため、theme.jasonにて定義)*/
    --color-main-text: var(--wp--preset--color--text-color);
    /*メインテキストカラーrgb*/
    --color-main-texttrans: 68, 68, 68;
    /*メインカラー#932e49(カラーパレットに反映させるため、theme.jasonにて定義)*/
    --color-main: var(--wp--preset--color--main-color);
    /*メインカラーrgb*/
    --color-maintrans: 147, 46, 73;
    /*メインカラー80%*/
    --color-main80: #a8576d;
    /*メインカラー60%*/
    --color-main60: #be8191;
    /*メインカラー40%*/
    --color-main40: #d3abb6;
    /*メインカラー20%*/
    --color-main20: #e9d5da;
    /*メインカラー10%*/
    --color-main10: #f4eaec;
    --color-red: #b70000;
    --color-black: #000;
    --color-blacktrans: 0, 0, 0;
    --color-white: #fff;
    --color-whitetrans: 255, 255, 255;
    --color-gray-dark: #747376;
    --color-gray-darktrans: 116, 115, 118;
    --color-gray: #eee;
    --color-pinkgray: #ebe6e2;
    --color-pinkgray-light: #f7f5f3;
    --color-pinkgray-dark: #e1d9d3;
    --round-main: 10px;
    --round-s: 5px;
    --round-ss: 2px;
    --round-l: 20px;
    --font-jp-sub: "Noto Sans JP", sans-serif;
    --font-eng-main: "Poppins", sans-serif;
    --font-eng-second: "Roboto Condensed", sans-serif;
    --font13: 0.8125rem;
    /*font-size13px*/
    --font14: 0.875rem;
    /*font-size14px*/
    --font15: 0.9375rem;
    /*font-size15px*/
    --font16: 1rem;
    /*font-size16px*/
    --font18: 1.125rem;
    /*font-size18px*/
    --font20: 1.25rem;
    /*font-size20px*/
    --font22: 1.375rem;
    /*font-size22px*/
    --font24: 1.5rem;
    /*font-size24px*/
    --font26: 1.625rem;
    /*font-size26px*/
    --font28: 1.75rem;
    /*font-size28px*/
    --font30: 1.875rem;
    /*font-size30px*/
    --font34: 2.125rem;
    /*font-size34px*/
    --font40: 2.5rem;
    /*font-size40px*/
    --font-sub-eng: clamp(50px, 6vw, 72px);
    --font-page-sub-eng: clamp(40px, 5vw, 60px);
    --font-page-lead: clamp(20px, 2.5vw, 30px);
    --space-res: calc(0.5em + 4.1%);
    --space-main: clamp(54px, 8.333333333333332vw, 100px);
    --space-3s: 0.5rem;
    --space-ss: 1rem;
    --space-s: 2rem;
    --space-m: 4rem;
    --space-ml: 6rem;
    --space-l: 8rem;
    --gap-main: 10px;
    --easing: cubic-bezier(0.2, 1, 0.2, 1);
    --transition: 0.8s var(--easing);
}
/* 画面全体の横スクロール（ガタつき）を防止する */
html, body {
  overflow-x: hidden;
}
html {
    font-family:
        YuGothic, "Yu Gothic", 游ゴシック体, "游ゴシック", "ヒラギノ角ゴ ProN W3",
        "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3",
        "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS ゴシック", "MS Gothic",
        sans-serif;
}

body {
    position: relative;
    font-size: calc(16 / var(--root-font-size) * 1rem);
    line-height: 1.9;
    color: var(--color-main-text);
    overflow-wrap: anywhere;
    word-break: normal;
    line-break: strict;
    font-feature-settings: "palt";
}

/*-------------------------------------------*/
/*	基本共通設定
/*-------------------------------------------*/
img {
    width: 100%;
    max-width: 100%;
    height: auto;
}

a img {
    transition: all 0.5s;
}

a {
    color: var(--color-main);
    transition: all 0.5s;
}

a:hover {
    text-decoration: none;
}

a:not(.wp-block-button__link):hover,
a:not(.wp-block-button__link):active {
    color: var(--color-main-text);
}
/*ulリスト(何もクラスがない場合)*/
ul:not([class]) {
    padding-left: 1em;
    list-style: disc;
}
ul:not([class]) li {
    list-style-type: disc;
}

ul,
ul.list-nodeco,
.btn-base-block ul,
.staff-profile-block ul,
#sitemap ul,
.footer-l ul,
.foot-sns ul {
    margin: 0;
    padding: 0;
}

ul li,
ul.list-nodeco li,
.btn-base-block ul li,
.staff-profile-block ul li,
#sitemap ul li,
.footer-l ul li,
.foot-sns ul li {
    list-style-type: none;
}


i,
em {
    font-style: normal;
}

/*--見出し基本設定--*/
p,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.3em;
}

/* サイズ */
/* 間隔 */
.pd-0-t {
    padding-top: 0 !important;
}

.pd-0-b {
    padding-bottom: 0 !important;
}
.pd-res-t {
    padding-top: var(--space-res);
}

.pd-res-b {
    padding-bottom: var(--space-res);
}

.pd-main-t {
    padding-top: var(--space-main);
}

.pd-main-b {
    padding-bottom: var(--space-main);
}

.pd-3s-t {
    padding-top: var(--space-3s);
}

.pd-3s-b {
    padding-bottom: var(--space-3s);
}

.pd-ss-t {
    padding-top: var(--space-ss);
}

.pd-ss-b {
    padding-bottom: var(--space-ss);
}

.pd-s-t {
    padding-top: var(--space-s);
}

.pd-s-b {
    padding-bottom: var(--space-s);
}

.pd-m-t {
    padding-top: var(--space-m);
}

.pd-m-b {
    padding-bottom: var(--space-m);
}

.pd-ml-t {
    padding-top: var(--space-ml);
}

.pd-ml-b {
    padding-bottom: var(--space-ml);
}

.pd-l-t {
    padding-top: var(--space-l);
}

.pd-l-b {
    padding-bottom: var(--space-l);
}

/* margin */
/* wp標準marginより優先度を上げるためbody付与 */
body .mar-0-t {
    margin-top: 0 !important;
}

body .mar-0-b {
    margin-bottom: 0 !important;
}
body .mar-res-t {
    margin-top: var(--space-res);
}

body .mar-res-b {
    margin-bottom: var(--space-res);
}

body .mar-main-t {
    margin-top: var(--space-main);
}

body .mar-main-b {
    margin-bottom: var(--space-main);
}

body .mar-3s-t {
    margin-top: var(--space-3s);
}

body .mar-3s-b {
    margin-bottom: var(--space-3s);
}

body .mar-ss-t {
    margin-top: var(--space-ss);
}

body .mar-ss-b {
    margin-bottom: var(--space-ss);
}

body .mar-s-t {
    margin-top: var(--space-s);
}

body .mar-s-b {
    margin-bottom: var(--space-s);
}

body .mar-m-t {
    margin-top: var(--space-m);
}

body .mar-m-b {
    margin-bottom: var(--space-m);
}

body .mar-ml-t {
    margin-top: var(--space-ml);
}

body .mar-ml-b {
    margin-bottom: var(--space-ml);
}

body .mar-l-t {
    margin-top: var(--space-l);
}

body .mar-l-b {
    margin-bottom: var(--space-l);
}

#content-wrap {
    padding: 0px;
    margin-bottom: 0px;
}

body.home #content-wrap {
    margin-bottom: 0px;
}

#content {
    padding: 60px 0 80px;
}

body.home #content {
    padding: 0;
}

/*-------------------------------------------*/
/*	共通設定
/*-------------------------------------------*/
/*　文字　*/

/*　カラー　*/
.col-main {
    color: var(--color-main);
}

.col-red {
    color: var(--color-red);
}

/*　レイアウト関連　*/
.adjust {
    text-indent: -0.5em;
    display: inline-block;
}

.text-c {
    text-align: center;
}

.text-r {
    text-align: right;
}

/*　フォントサイズ　*/
.font-13 {
    font-size: var(--font13);
}

.font-14 {
    font-size: var(--font14);
}

.font-15 {
    font-size: var(--font15);
}

.font-16 {
    font-size: var(--font16);
}

.font-18 {
    font-size: var(--font18);
}

.font-20 {
    font-size: var(--font20);
}

.font-22 {
    font-size: var(--font22);
}

.font-24 {
    font-size: var(--font24);
}

.font-26 {
    font-size: var(--font26);
}

.font-28 {
    font-size: var(--font28);
}

.font-30 {
    font-size: var(--font30);
}

.font-34 {
    font-size: var(--font34);
}

.font-40 {
    font-size: var(--font40);
}

/*--文字揃え--*/
.text-cl-1199,
.text-cl-969,
.text-cl-800,
.text-cl-769,
.text-cl-660,
.text-cl-480,
.text-cl-370 {
    text-align: center;
}

/*--表示、非表示--*/
.sp-display-1199,
.sp-display-969,
.sp-display-800,
.sp-display-769,
.sp-display-660,
.sp-display-480,
.sp-display-370 {
    display: none;
}

.pc-display {
    display: block;
}

/*--テーブル設定--*/
table {
    border-top: 1px solid rgba(var(--color-blacktrans), 0.1);
    width: 100%;
}

table tr th,
table tr td {
    border-bottom: 1px solid rgba(var(--color-blacktrans), 0.1);
    padding: 10px 3px;
    text-align: center;
    vertical-align: middle;
    line-height: 1.6;
}

/*--dl設定--*/
dl {
    margin-top: 0;
    margin-bottom: 0;
}

dl dt {
    font-weight: bold;
    position: relative;
    padding-left: 1rem;
}

dl dt:before {
    content: "";
    position: absolute;
    background-color: var(--color-main);
    width: 0.5em;
    height: 0.5em;
    left: 0px;
    top: 0.65rem;
    border-radius: 50%;
}

dl dd {
    margin: 0;
}

/*--border-radius--*/
.b-r-main {
    border-radius: var(--round-main);
}

.b-r-s {
    border-radius: var(--round-s);
}

.b-r-ss {
    border-radius: var(--round-ss);
}

.b-r-l {
    border-radius: var(--round-l);
}

/*--検索--*/
.search-form-style {
    position: relative;
    border: 1px solid;
    width: 100%;
}

.search-form-style #s.form-text {
    padding: 10px;
    width: calc(100% - 40px);
    border: none;
}

.search-form-style .search-btn {
    border: none;
    background-color: var(--color-main-text);
    color: #fff;
    height: 100%;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
}

.search-form-style .search-btn:hover {
    opacity: 0.9;
}

.search-form-style .search-btn svg {
    display: block;
    padding: 2px;
}

/*　reCAPTCHA設定　*/
.grecaptcha-badge {
    visibility: hidden;
}

/*　youtube（アスペクト比保持）*/
.youtube-adjust {
    width: 100%;
    aspect-ratio: 16 / 9;
}

.youtube-adjust iframe {
    width: 100%;
    height: 100%;
}

/*-------------------------------------------*/
/*	共通：装飾・レイアウト・デザイン
/*-------------------------------------------*/
/*	ボタン
/*-------------------------------------------*/
.btn a {
    position: relative;
    display: inline-block;
    background-color: rgba(var(--color-maintrans),1.0);
    padding: 17px 2.5em 17px 2em;
    color: var(--color-white);
    border-radius: var(--round-s);
    line-height: 1.3em;
    min-width: 230px;
    text-align: center;
    text-decoration: none;
}
.btn a:hover {
color: var(--color-white);
background-color: rgba(var(--color-maintrans),0.8);
}
.btn a:before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--color-white);
    border-right: 2px solid var(--color-white);
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: calc(50% - 2px);
    right: 15px;
}
.btn a:hover:before {
border-color: var(--color-white);
}
/*----blankLink---*/
a span.blank-link {
    word-break: break-all;
}
a span.blank-link:after {
    content: '';
    width: 0.65em;
    height: 0.65em;
    display: inline-block;
    -webkit-mask-image: url(/images/common/arrow-blank-gray.png);
    mask-image: url(/images/common/arrow-blank-gray.png);
    -webkit-mask-position: right bottom;
    mask-position: right bottom;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 0.65em;
    mask-size: 0.65em;
    background-color: var(--color-main);
    margin: 0 2px 0 0px;
}

a:hover span.blank-link:after {
background-color: var(--color-main-text);
}

/*	色背景・ボーダー共通
/*-------------------------------------------*/
.frame-bg-main,
.frame-bg-gray,
.frame-bg-white,
.frame-border-main,
.frame-border-white,
.frame-border-gray,
.frame-square-gray,
.frame-dot-gray {
    padding-top: calc(1em + 4.2%);
    padding-bottom: calc(1em + 4.2%);
    padding-left: calc(0.5em + 4.2%);
    padding-right: calc(0.5em + 4.2%);
    border-radius: var(--round-main);
}

.flex-bg-main,
.flex-bg-gray,
.flex-bg-white,
.flex-border-main,
.flex-border-gray,
.flex-border-white,
.flex-square-gray,
.flex-dot-gray {
    padding: calc(1.34% + 10px);
    border-radius: var(--round-s);
}

.full-bg-main,
.full-bg-gray,
.full-bg-white,
.full-square-gray,
.full-dot-gray {
    border-radius: 0px;
}

/*----色背景---*/
.full-bg-main,
.frame-bg-main,
.flex-bg-main {
    background-color: var(--color-main10);
}

.full-bg-gray,
.frame-bg-gray,
.flex-bg-gray {
    background-color: rgba(var(--color-blacktrans), 0.04);
}

.full-bg-white,
.frame-bg-white,
.flex-bg-white {
    background-color: rgba(255, 255, 255, 0.8);
}

/*----ボーダー---*/
.frame-border-main,
.flex-border-main {
    border: 1px solid var(--color-main);
}

.frame-border-white,
.flex-border-white {
    border: 1px solid rgba(255, 255, 255, 0.8);
}

.frame-border-gray,
.flex-border-gray {
    border: 1px solid #e0e0e0;
}

/*----ベーシックな柄背景---*/
.full-square-gray,
.frame-square-gray,
.flex-square-gray {
    background-image: url(/images/common/bg-square-gray.png);
    background-position: left top;
    background-repeat: repeat;
    background-size: 60px;
}

.full-dot-gray,
.frame-dot-gray,
.flex-dot-gray {
    background-image: url(/images/common/bg-dot-gray.png);
    background-position: left top;
    background-repeat: repeat;
    background-size: 8px;
}

/*	リストメニュー
/*-------------------------------------------*/
/*	flex-menu
/*-------------------------------------------*/
.flex-menu {
display: flex;
flex-wrap: wrap;
gap: var(--gap-main); 
}

/*	circle-menu、square-menu
/*-------------------------------------------*/
ul.circle-menu > li,
ul.square-menu > li {
    padding: 20px 10px 20px 1rem;
    line-height: 1.3em;
    position: relative; 
border-bottom: 1px solid rgba(var(--color-blacktrans),0.2);
}

ul.circle-menu > li:before,
ul.square-menu > li:before {
content: '';
position: absolute;
width: 0.5rem;
height: 0.5rem;
top: 1.6rem;
left: 0em;
background-color: var(--color-main);
}
ul.circle-menu > li:before {
border-radius: 50%;
}
/*---下にボーダーなし---*/
ul.circle-menu.menu-bd-none > li,
ul.square-menu.menu-bd-none > li {
border: none;
padding: 3px 10px 3px 1rem;
}
ul.circle-menu.menu-bd-none > li:before,
ul.square-menu.menu-bd-none > li:before {
top: 0.6rem;
}
/*	テキストとイメージ
/*-------------------------------------------*/
/*----テキストとイメージ---*/
.text-img-2col,
.text-img-2col-s {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.text-img-2col-ws {
width: 45%;
}
.text-img-2col-wl {
width: 52%;
}
.text-img-2col-s-ws {
width: 300px;
}
.text-img-2col-s-wl {
width: calc(100% - 320px);
}

/*----テキストとイメージの左右どちらかをイメージだけで構成し、高さを揃える場合---*/
.text-img-2colfitimg img {
object-fit: cover;
width: 100%;
height: 100%;
}
/*----テキストとイメージ(alignright)---*/
img.alignright {
display: inline;
float: right;
margin-left: 20px;
margin-top: 4px;
}
img.alignright.w35 {
width: 350px;
}

/*	追加スタイル
/*-------------------------------------------*/
/*	svg-arrowボタン
/*-------------------------------------------*/
.btn-base-block {
    margin-top: 30px;
}
.btn-base {
    position: relative;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 20rem;
    padding: 1.25rem 1.5rem 1.25rem 2rem;
    overflow: hidden;
    color: var(--color-white);
    background-color: var(--color-main-text);
    border-radius: var(--round-s);
    -webkit-transition: background-color 0.4s cubic-bezier(0.33, 1, 0.68, 1);
    transition: background-color 0.4s cubic-bezier(0.33, 1, 0.68, 1);
    will-change: background-color;
    text-decoration: none;
}

.btn-base[data-width="100%"] {
    width: 100%;
    min-width: initial;
    max-width: 380px;
}

/*--colorバリエーション--*/
/*ボタン背景白*/
a.btn-base[data-color="white"] {
    color: var(--color-main-text);
    background-color: rgba(var(--color-whitetrans), 0.9);
}

/*ボタン背景黒*/
a.btn-base[data-color="black"] {
    color: var(--color-white);
    background-color: var(--color-main-text);
}

/*ボタンテキスト*/
.btn-base-label {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.05em;
    padding-right: 1.25rem;
    position: relative;
    z-index: 1;
    font-weight: bold;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    transition: -webkit-transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    transition:
        transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
        -webkit-transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/*ボタン矢印*/
.btn-base-icon {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    width: fit-content;
    height: 1.5rem;
    padding-left: 1.25rem;
    overflow: hidden;
}

.btn-base-icon:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 1px;
    height: 100%;
    background-color: currentcolor;
    opacity: 0.3;
}

.btn-base-icon-item {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.btn-base-icon-item svg {
    fill: currentcolor;
}

.svg-arrow-left,
.svg-arrow-right {
    width: 1.0625rem;
    height: 0.4375rem;
}

.svg-arrow-up,
.svg-arrow-down {
    width: 0.4375rem;
    height: 1.0625rem;
}

/*--入力デバイスのいずれかにhoverに対応している入力デバイスが含まれる場合--*/
@media (any-hover: hover) {

    /*--ホバーテキスト--*/
    .btn-base-label:hover,
    a:hover .btn-base-label {
        -webkit-transform: translateX(0.5rem);
        transform: translateX(0.5rem);
    }

    /*--ホバーcolorバリエーション--*/
    /*背景グレーにする*/
    a.btn-base[data-hovcolor="gray"]:hover {
        color: var(--color-white);
        background-color: rgba(var(--color-blacktrans), 0.5);
    }

    /*背景メインカラーにする*/
    a.btn-base[data-hovcolor="red"]:hover {
        color: var(--color-white);
        background-color: var(--color-main);
    }

    /*--ホバー矢印関連--*/
    a:hover .btn-base-icon-item svg {
        -webkit-animation: arrow-anim 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
        animation: arrow-anim 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
}

/*--ホバー矢印アニメーション--*/
@keyframes arrow-anim {
    0% {
        transform: translate(0%, 0%);
    }

    30% {
        /*transform: translate(110%, 0px);*/
        transform: translate(200%, 0px);
    }

    30.1% {
        /*transform: translate(-110%, 0px);*/
        transform: translate(-200%, 0px);
    }

    100% {
        transform: translate(0%, 0%);
    }
}


/*-------------------------------------------*/
/*	背景パーティクル
/*-------------------------------------------*/
#particles-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(to bottom,
            var(--color-pinkgray) 0%,
            var(--color-pinkgray-light) 25%);
    z-index: -1;
}

#top-service #particles-bg {
    background: linear-gradient(to top,
            var(--color-pinkgray-dark) 0%,
            var(--color-pinkgray) 10%,
            var(--color-white) 100%);
}
/*-------------------------------------------*/
/*	flex設定
/*-------------------------------------------*/
.flex,
.flex-sb,
.flex-sa,
.flex-ce {
    display: flex;
    flex-wrap: wrap;
}

.flex-sb {
    justify-content: space-between;
}

.flex-sa {
    justify-content: space-around;
}

.flex-ce {
    justify-content: center;
}

.flex100 {
width: 100%;
}
.flex50 {
width: 50%;
}
.flex33 {
width: calc(100% / 3);
}
.flex25 {
width: 25%;
}
.flex20 {
width: 20%;
}
/*flexの親に設定*/
.flex-gap-main {
    gap: var(--gap-main);
}

.flex1 {
    width: 100%;
}

.flex2-g-main {
    width: calc((100% - var(--gap-main)) / 2);
}

.flex3-g-main {
    width: calc((100% - (var(--gap-main) * 2)) / 3);
}

.flex4-g-main {
    width: calc((100% - (var(--gap-main) * 3)) / 4);
}

.flex5-g-main {
    width: calc((100% - (var(--gap-main) * 4)) / 5);
}
/*-------------------------------------------*/
/*	リンク設定(ヘッダー追従の場合の高さ対策)
/*-------------------------------------------*/
.page-link {
    margin-top: -60px;
    padding-top: 60px;
}

/*-------------------------------------------*/
/*	header
/*-------------------------------------------*/
header {
    position: absolute;
    z-index: 9999;
    left: 0;
    right: 0;
}

header #header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* height: 100px;*/
    padding: 10px 0 15px;
    width: calc(100% - 150px);
    max-width: 1800px !important;
    max-width: 95% !important;
}

header #logo,
header #logo-fixed {
    width: 220px;
    align-self: center;
    padding-top: 5px;
}

header #logo-fixed {
    width: 180px;
    display: none;
}

header #logo a,
header #logo a img {
    display: block;
}

/*-------------------------------------------*/
/*	グローバルナビ(PC、SP共通)
/*-------------------------------------------*/
/*----ヘッダー問い合わせ---*/
.contact_btn {
    display: flex;
    margin-left: 10px;
}

.contact_btn a {
    display: flex;
    background-color: var(--color-main);
    color: var(--color-white);
    padding: 5px 20px 5px calc(2em + 10px);
    font-size: 15px;
    border-radius: var(--round-s);
    align-self: center;
    min-width: initial;
    column-gap: 0.5rem;
    background-image: url(/images/icon/icon-letter.png);
    background-position: left 10px center;
    background-repeat: no-repeat;
    background-size: 1.25em;
    text-decoration: none;
}

.contact_btn a:hover {
    color: var(--color-white);
    background-color: rgba(var(--color-blacktrans), 0.7);
}

/*----ヘッダー固定---*/
.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.fixed header {
    background-color: rgba(255, 255, 255, 0.9);
}

.fixed header #header-inner {
    padding: 8px 0 12px;
}

/*
.fixed header #header-inner {
height: 70px;
}
*/
.fixed header #logo {
    display: none;
}

.fixed header #logo-fixed {
    padding-top: 0;
    display: block;
}

/*-------------------------------------------*/
/*	innerなど、サイズ設定
/*-------------------------------------------*/
/*--共通inner--*/
.common-inner-setting,
.common-inner {
    width: calc(100% - 200px);
    max-width: 1200px !important;
    margin-left: auto;
    margin-right: auto;
}

/*--フルサイズ(幅100%)--*/
.alignfull,/* ブロックエディタ用(管理画面にて独自にpaddingを設定した時点でpaddingの優先度が下がる)*/
.full,
body .is-layout-constrained .full {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw;
    padding-left: calc(50vw - 50%);
    padding-right: calc(50vw - 50%);
    max-width: initial !important;
}
/*--100vwに対してwindowsスクロールバー対策--*/
#content-inner {
    position: relative;
    overflow: hidden;
}

/*-------------------------------------------*/
/*	MV
/*-------------------------------------------*/
#top-mv {
    position: relative;
    overflow: hidden;
}

#top-mv .mv-media {
    /*ここでスライドの高さ調整*/
    height: 100vh;
    /* フォールバック（古いブラウザ用） */
    height: 100dvh;
    /* アドレスバーの表示・非表示に合わせて変化 [4, 6] */
    position: relative;
}

#top-mv .mv-media:before,
#top-mv .mv-media:after {
    content: "";
    position: absolute;
}

#top-mv .mv-media:before {
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(var(--color-blacktrans), 0.5);
}

#top-mv .mv-media:after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: repeat center center url(/images/movie/ami.png);
    background-size: 20px;
}

#top-mv .mv-media video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

/*---MVテキスト(h2)---*/
#top-mv .mv-text {
    font-weight: normal;
    line-height: 1.6;
    position: absolute;
    color: #fff;
    left: 5rem;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

#top-mv .mv-text h2 {
    /*font-size: 4rem;*/
    font-size: clamp(34px, 5.2vw, 64px);
    padding: 0;
    margin-bottom: 1em;
    opacity: 0;
}
#top-mv .mv-text.io-active h2 {
    -webkit-animation: mv01-fadeIn 2s 0.5s var(--easing) both;
    animation: mv01-fadeIn 2s 0.5s var(--easing) both;
}
#top-mv .mv-text h2:before {
    content: none;
}
/*--MVテキストアニメーション(h2)--*/
@keyframes mv01-fadeIn {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
        opacity: 0;
        -webkit-filter: blur(300px);
        filter: blur(300px);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
        -webkit-filter: blur(0);
        filter: blur(0);
    }
}

/*---MVテキストループ---*/
.mv-looptext-container {
    font-family: var(--font-eng-main);
    font-weight: 500;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    z-index: 1;
}

.mv-looptext-wrap {
    display: flex;
    animation: loop-text 60s linear infinite;
}

.mv-looptext {
    display: inline-block;
    font-size: 12rem;
    line-height: 0.8em;
    white-space: nowrap;
    mix-blend-mode: overlay;
    color: rgba(var(--color-whitetrans), 0.1);
}

@keyframes loop-text {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}

/*--MVエリアの投稿表示--*/
#mv-posted-block {
    position: absolute;
    width: 550px;
    right: 5%;
    bottom: 10%;
    z-index: 1;
}

#mv-posted-block ul.mv-posted-list li a {
    width: 100%;
    background-color: rgba(var(--color-whitetrans), 0.8);
    padding: 18px 23px 18px 18px;
    /*background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" ><path fill="%23666" d="M3.64,8.95c-.12,0-.25-.05-.34-.15-.18-.19-.17-.49.02-.67l3.28-3.13L3.31,1.87c-.19-.18-.2-.48-.02-.67.18-.19.48-.2.67-.02l3.64,3.48c.09.09.15.21.15.34s-.05.25-.15.34l-3.64,3.48c-.09.09-.21.13-.33.13Z" /></svg>');
background-position: right 5px center;
background-repeat: no-repeat;
background-size: 10px 8px;*/
    border-radius: var(--round-s);
    text-decoration: none;
}

#mv-posted-block ul.mv-posted-list li a:hover {
    background-color: rgba(var(--color-whitetrans), 1);
    color: var(--color-main);
}

#mv-posted-block ul.mv-posted-list li a .mv-posted-list-inner {
    display: flex;
}

#mv-posted-block ul.mv-posted-list li a .btn-base-label {
    letter-spacing: 0;
    width: calc(100% - 40px);
}

#mv-posted-block ul.mv-posted-list li a .btn-base-icon:before {
    content: none;
}

#mv-posted-block ul.mv-posted-list li a .posted-date {
    font-weight: normal;
}

#mv-posted-block ul.mv-posted-list li a .posted-date,
#mv-posted-block ul.mv-posted-list li a .term-list {
    font-size: 14px;
    line-height: 1.3em;
}

#mv-posted-block ul.mv-posted-list li a .term-list {
    background-color: var(--color-main);
    color: var(--color-white);
    padding: 0 15px;
    margin: 0 5px;
    border-radius: 9999px;
}

#mv-posted-block ul.mv-posted-list li a h3 {
    /*width: calc(100% - 120px);*/
    font-size: 15px;
    width: 100%;
    margin-top: 5px;
}

/*-------------------------------------------*/
/*	TOP
/*-------------------------------------------*/
body.home h2 {
    position: relative;
    display: flex;
    align-items: center;
    font-size: var(--font18);
    padding-left: 1em;
    margin-bottom: 30px;
}

body.home h2::before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    left: 0;
    background-color: var(--color-main);
    border-radius: 50%;
}

body.home h2.h2white::before {
    background-color: var(--color-white);
}
.sub-eng {
    font-size: var(--font40);
    font-family: var(--font-eng-main);
    font-weight: 500;
    font-style: normal;
    font-size: var(--font-sub-eng);
    line-height: 1em;
    margin-bottom: 10px;
}
body.home .copy-main {
    font-size: var(--font22);
    line-height: 1.3em;
    margin-bottom: 30px;
    font-weight: bold;
}

.copy-text p:not(first-of-type) {
    margin-top: 20px;
}

/*	#top-about
/*-------------------------------------------*/
#top-about {
    position: relative;
    overflow: hidden;
}

#top-about .top-about-bgimg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -2;
}

#top-about .top-about-bgimg .top-about-bgimg-item {
    width: 100%;
    height: 100%;
    background-image: url(/images/top/top-about01.png);
    background-position: calc(50% - 120px) center;
    background-repeat: no-repeat;
    background-size: auto 100%;
}

#top-about::before,
#top-about::after {
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
}

#top-about::before {
    top: 0;
    height: 100%;
    /*    background-color: #76838b;*/
    background: linear-gradient(to right, #76838b, #9aabb3);
    z-index: -3;
}

#top-about::after {
    height: 100px;
    bottom: 0;
    background-color: var(--color-gray-dark);
    z-index: -1;
}

#top-about .about-text-block {
    width: 50%;
    margin-right: 0;
    margin-left: auto;
    color: var(--color-white);
    /*    padding: 100px 0;*/
    padding: 10rem 0 3rem;
}

#top-about .copy-text {
    text-shadow: 0 0 7px rgba(var(--color-blacktrans), 0.5);
}

#top-about .about-deco-img img {
    border-radius: var(--round-main);
}

#top-about .about-deco-img img.top-about-img02 {
    display: block;
    position: relative;
    margin-left: auto;
    border-radius: var(--round-main) 0 0 var(--round-main);
    overflow: hidden;
    z-index: 1;
    width: 400px;
}

/*	#top-philosophy
右のテキストの高さ優先(右の画像横並べぎり1700px)
/*-------------------------------------------*/
#top-philosophy {
    position: relative;
    padding-bottom: 18.625rem;
    /*philosophy-deco-imgの画像の高さ分確保*/
}

#top-philosophy:after {
    content: "";
    position: absolute;
    width: 100%;
    height: calc(100% - 35px);
    left: 0;
    top: 0;
    background-color: #747376;
    z-index: -1;
}

#top-philosophy .philosophy-wrap {
    position: relative;
}

#top-philosophy .philosophy-img-block {
    position: absolute;
    /*absoluteで高さ解除(テキストの高さに準じるようにする)*/
    left: 0;
    top: 0;
    width: 42%;
    height: calc(100% + 120px);
    /*absoluteで右のテキストに合わせてそこからどれくらい画像の高さをおおきくするか。
    右のdecoimageが250pxくらいなのでバランスとる*/
    border-radius: var(--round-main);
    overflow: hidden;
}

#top-philosophy .philosophy-img-block img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    /*height: calc(100% - 100px);左のテキストに
    paddingbottom100を付与しているのでその分引く*/
}

#top-philosophy .philosophy-text-block {
    /*これが主体で高さ決まる(左の画像はそれに応じて可変)*/
    width: 50%;
    color: var(--color-white);
    order: 2;
    margin-left: auto;
    /* padding-bottom: 140px; */
}

#top-philosophy .philosophy-deco-img {
    width: 250px;
    height: 250px;
    margin-left: auto;
    position: absolute;
    bottom: -50px;
    left: calc(50% + 400px);
    border-radius: var(--round-main);
    overflow: hidden;
    z-index: 1;
}

#top-philosophy .philosophy-deco-img img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/*	#top-service
/*-------------------------------------------*/
#top-service {
    position: relative;
    z-index: 0;
}

#top-service:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--color-white);
    z-index: -2;
}

#top-service .top-service-movie-wrap {
    position: relative;
    z-index: 1;
}

#top-service .top-service-movie {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    z-index: -1;
}

#top-service .top-service-movie video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

#top-service .service-img-block {
    width: 100%;
    max-width: 1920px;
    padding: 0 100px;
    margin: 0 auto;
}

#top-service .service-img-block .service-img-block-wrap {
    border-radius: var(--round-l);
    overflow: hidden;
}

#top-service .service-img-block img {
    width: 50%;
}

#top-service .top-service-wrap {
    align-items: flex-end;
}

#top-service .service-text-block {
    width: calc(100% - 600px);
    order: 2;
    margin-bottom: 20px;
}

#top-service .diagram {
    width: fit-content;
}

#top-service .diagram>ul {
    display: flex;
    padding-top: 180px;
}

#top-service .diagram>ul>li {
    width: 280px;
    height: 280px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0px 20px;
    color: #fff;
    background: linear-gradient(40deg,
            rgba(var(--color-maintrans), 0.8) 5%,
            rgba(var(--color-maintrans), 0.7) 50%,
            rgba(var(--color-maintrans), 0.1));
}

#top-service .diagram>ul>li:nth-of-type(2) {
    position: relative;
    margin: -204px -157px 0;
}

#top-service .diagram>ul>li h3 {
    text-align: center;
    margin-bottom: 10px;
    font-size: var(--font22);
}

#top-service .diagram>ul ul {
    width: fit-content;
    margin: 0 auto;
    padding-left: 1em;
}

#top-service .diagram>ul ul li {
    line-height: 1.3em;
    list-style-type: disc;
}

/*--top-service-bnr--*/
#top-service .top-service-bnr {
    margin: 60px auto 80px;
    max-width: 100%;
}

#top-service .top-service-bnr ul li {
    width: 33.3333%;
    padding: 0 5px;
}

/*--top-service-bnr--*/

#top-service .top-service-bnr ul li a {
    text-decoration: none;
    color: var(--color-main-text);
    position: relative;
    border-top: 1px solid var(--color-main-text);
    border-left: 1px solid var(--color-main-text);
    padding: 20px 30px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    transition: all 0.3s;
}

#top-service .top-service-bnr ul li a:before,
#top-service .top-service-bnr ul li a:after {
    position: absolute;
    content: "";
    top: -1px;
    right: -1px;
    bottom: -1px;
    left: -1px;
    opacity: 0;
    -webkit-transition:
        opacity 0.5s,
        -webkit-transform 0.5s;
    transition:
        opacity 0.5s,
        transform 0.5s;
}

#top-service .top-service-bnr ul li a:before {
    border-top: 1px solid var(--color-main);
    border-bottom: 1px solid var(--color-main);
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

#top-service .top-service-bnr ul li a:after {
    border-right: 1px solid var(--color-main);
    border-left: 1px solid var(--color-main);
    -webkit-transform: scale(1, 0);
    transform: scale(1, 0);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

#top-service .top-service-bnr ul li a:hover:before,
#top-service .top-service-bnr ul li a:hover:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#top-service .top-service-bnr ul li a:hover {
    color: var(--color-main-text);
    border: 1px solid transparent;
    background: linear-gradient(-45deg,
            rgba(var(--color-maintrans), 0),
            rgba(var(--color-maintrans), 0.1));
    border-color: var(--color-main);
}

#top-service .top-service-bnr ul li a .deco-eng {
    position: relative;
    padding-left: 1em;
    line-height: 1em;
    color: var(--color-main);
    font-family: var(--font-eng-second);
    font-weight: 500;
    margin-bottom: 4px;
}

#top-service .top-service-bnr ul li a .deco-eng:before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    top: 0.25em;
    left: 0;
    background-color: var(--color-main);
    border-radius: 50%;
}

#top-service .loop-infinite .item img {
    border-radius: var(--round-s);
}

/*	#top-results
/*-------------------------------------------*/
#top-results {
    overflow: hidden;
    background-image: url(/images/common/bg-deco02-graytrans.png);
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-color: var(--color-main);
    color: var(--color-white);
}

#top-results .top-results-wrap {
    overflow: hidden;
    width: 90%;
    margin-left: auto;
}

#top-results .results-text-block {
    width: 40%;
    padding-right: 5%;
}

#top-results .results-loop-block {
    width: 60%;
    overflow: hidden;
}

/*	#top-interview
/*-------------------------------------------*/
#top-interview {
    overflow: hidden;
    background-image: url(/images/common/bg-deco02-graytrans02.png);
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-color: #747376;
    color: var(--color-white);
}

#top-interview .interview-text-block {
    width: 60%;
    padding: 13.525rem 0 13.525rem 6.2rem;
    order: 2;
}

/* #top-interview .interview-text-block-l {
width: 40%;
}
#top-interview .interview-text-block-r {
width: 50%;
} */

#top-interview .interview-loop-block {
    width: 40%;
    display: flex;
    justify-content: space-between;
    overflow: hidden;
}

#top-interview .interview-loop-block .loop-infinite-tate {
    width: 48%;
    position: relative;
}

#top-interview .interview-loop-block .loop-infinite-tate .swiper {
    position: absolute !important;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

#top-interview .interview-loop-block .loop-infinite-tate .swiper .swiper-slide img {
    height: 100%;
    width: 100%;
    max-width: none;
    object-fit: cover;
}

/*	#top-blog、#top-news
/*-------------------------------------------*/
#top-blog h2,
#top-news h2 {
    margin-bottom: 0px;
}
.post-ttle-link {
    position: relative;
    margin-top: 15px;
    margin-bottom: 35px;
}

.post-ttle-link:before {
    content: "";
    position: absolute;
    width: calc(100% - 18em);
    height: 1px;
    top: 50%;
    left: 6.5em;
    background-color: rgba(var(--color-blacktrans), 0.2);
}

.post-ttle-link a {
    color: var(--color-main-text);
    display: block;
    padding: 5px 30px;
    border: 1px solid var(--color-main-text);
    border-radius: var(--round-l);
    text-decoration: none;
}

/*--入力デバイスのいずれかにhoverに対応している入力デバイスが含まれる場合--*/
@media (any-hover: hover) {
    .post-ttle-link a:hover {
        border-color: var(--color-main);
        background-color: var(--color-main);
        color: var(--color-white);
    }

    .post-ttle-link a:hover span::before {
        background-color: var(--color-white);
    }
}

.post-ttle-link a span {
    position: relative;
    padding-left: 1em;
    font-size: var(--font14);
}

.post-ttle-link a span::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    background-color: rgba(var(--color-maintrans), 1);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.3s;
}

/*	#top-blog
/*-------------------------------------------*/
#top-blog {
    background-color: var(--color-white);
    padding-bottom: calc(var(--space-main) - 35px);
}
#top-blog .posted-list-card ul.posted-list li {
    width: 25%;
}

/*	#top-news
/*-------------------------------------------*/
#top-news {
    background-color: var(--color-pinkgray);
}

/*-------------------------------------------*/
/*	下層
/*-------------------------------------------*/
/*--固定ページ共通--*/
.body-page-common {
    background-color: var(--color-pinkgray-light);
}
/*	固定ページ共通ナビ(ページリンク部分)
/*-------------------------------------------*/
.page-nav {
    position: relative;
}

.page-nav:after {
    border-bottom: 1px solid rgba(var(--color-blacktrans), 0.5);
    bottom: 12px;
    content: "";
    display: block;
    height: 0;
    left: 0;
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    animation-name: navborder-anim;
    animation-duration: 0.5s;
    animation-timing-function: ease-in-out;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    z-index: -1;
}

/*page-navの線のアニメーション*/
@keyframes navborder-anim {
    0% {
        transform-origin: left;
        transform: scaleX(0);
    }

    100% {
        transform-origin: left;
        transform: scaleX(1);
    }
}

.page-nav ul {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    justify-content: center;
}

.page-nav ul li {
    font-weight: bold;
    display: flex;
}

.page-nav ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    text-decoration: none;
    color: var(--color-main-text);
    padding-bottom: 45px;
    position: relative;
    text-align: center;
    transition: all 0.3s;
    line-height: 1.3em;
}

.page-nav ul li a:before,
.page-nav ul li a:after {
    content: "";
    position: absolute;
    display: block;
    transition: all 0.3s;
}

.page-nav ul li a:before {
    width: 26px;
    height: 26px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color: var(--color-main-text);
    border-radius: 50%;
    z-index: 2;
}

.page-nav ul li a:after {
    width: 6px;
    height: 6px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    bottom: 10px;
    left: calc(50% - 4px);
    transform: rotate(45deg);
    z-index: 2;
}

.page-nav ul li a:hover {
    color: var(--color-main);
}

.page-nav ul li a:hover:before {
    background-color: var(--color-main);
}

.page-nav ul li.nav-arrow-btm a:hover:after {
    transform-origin: center;
    transform: rotate(135deg);
    left: calc(50% - 3px);
}

.page-lead {
    font-size: var(--font-page-lead);
    line-height: 1.8;
    font-weight: 600;
}
/*	下層タイトル周り
/*-------------------------------------------*/
/*--写真がある場合(文字がホワイト)--*/
#page-ttl {
    position: relative;
    z-index: 0;
    padding: 230px 50px 180px;
    color: var(--color-white);
}
/*--写真がない場合--*/
body.body-post-particles-common #page-ttl {
    padding: 10.5rem 50px 6rem;
    color: var(--color-main-text);
}


#page-ttl:before {
    content: "";
    position: absolute;
    width: calc(100% - 200px);
    max-width: 1200px !important;
    height: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-bottom: 1px solid rgba(var(--color-blacktrans), 0.2);
    z-index: -2;
}

#page-ttl img {
    position: absolute;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
    left: 0;
    top: 0;
    z-index: -1;
}

.page-ttl-text {
    position: relative;
    font-size: 1.25rem;
    font-weight: bold;
    -webkit-font-smoothing: antialiased;
    display: flex;
    align-items: center;
    padding-left: 1em;
}

.page-ttl-text:before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    left: 0;
    background-color: var(--color-main);
    border-radius: 50%;
}

.page-sub-ttl {
    font-family: var(--font-eng-main);
    font-weight: 500;
    font-style: normal;
    font-size: var(--font-sub-eng);
    line-height: 1em;
    position: relative;
    display: block;
    margin-bottom: 15px;
}
/*	下層見出し
/*-------------------------------------------*/
/*--h2からh3まではクラス付与でスタイルを適宜選択---*/
/*--ttl-left-border--*/
.ttl-left-border {
text-align: left;
position: relative;
padding-left: 5.2vw;
padding-bottom: 0;
}
.ttl-left-border:before {
content: '';
display: block;
position: absolute;
width: 3.8vw;
height: 1px;
background-color: var(--color-main);
top: 50%;
left: 0;
}
.ttl-left-border:after {
content: none;
}
/*--ttl-left-border-s--*/
.ttl-left-border-s {
position: relative;
border-bottom: 1px solid;
padding: 0px 0px 1rem 1.7rem;
margin-bottom: 20px;  
}
.ttl-left-border-s:before {
content: '';
position: absolute;
text-indent: -1.5em;
background-color: var(--color-main);
width: 0.9rem;
height: 0.2rem;
left: 4px;
top: 0.6rem;
border-radius: var(--round-ss);
}
/*--ttl-sand-border--*/
.ttl-sand-border {
position: relative;
text-align: center;
padding: 0 3em;
width: fit-content;
margin-left: auto;
margin-right: auto;
}
.ttl-sand-border:before,
.ttl-sand-border:after {
content: '';
position: absolute;
border-bottom: 1px solid;
width: 2em;
height: 1px;
top: 50%;
}
.ttl-sand-border:before {
left: 0;
}
.ttl-sand-border:after {
right: 0;
}
/*--ttl-kakko-hook--*/
.ttl-kakko-hook {
position: relative;
width: fit-content;
padding: 1rem 2rem;
margin: 0 auto;
}
.ttl-kakko-hook:before,
.ttl-kakko-hook:after { 
content:'';
width: 15px;
height: 15px;
position: absolute;
display: inline-block;
}
.ttl-kakko-hook:before {
border-left: solid 2px;
border-top: solid 2px;
top:0;
left: 0;
}
.ttl-kakko-hook:after {
border-right: solid 2px;
border-bottom: solid 2px;
bottom:0;
left: initial;
right: 0;
}
/*--ttl-left-circle--*/
.ttl-left-circle {
position: relative;
padding: 0px 0px 1rem 1.7rem;
border-bottom: 1px dashed rgba(var(--color-blacktrans),0.3);
margin-bottom: 20px;
}
    
.ttl-left-circle:before {
content: '';
position: absolute;
width: 0.65rem;
height: 0.65rem;
left: 4px;
top: 0.4rem;
background-color: var(--color-main);
border-radius: 50%;
}
/*--ttl-bd-none--*/
.ttl-bd-none {
    border: none;
    padding-bottom: 0;
}


/*--h4---*/
.page-content h4 {
    position: relative;
    padding: 0px 0px 14px 30px;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.3);
    font-size: 17px;
    margin-bottom: 20px;
}

.page-content h4:before {
    content: "⚫︎";
    position: absolute;
    color: var(--color-main);
    width: 0.9em;
    height: 0.2em;
    left: 4px;
    top: 0px;
}

/*--h5---*/
.page-content h5 {
    font-size: 16px;
    border-bottom: 2px dotted rgba(var(--color-blacktrans),0.3);
    padding: 0 0 10px;
    margin-bottom: 15px;
}

/*--h6---*/
.page-content h6 {
    font-size: 15px;
    border-bottom: 1px solid rgba(var(--color-blacktrans),0.1);
    padding: 0 0 10px;
    margin-bottom: 15px;
}

/*--ぱんくずリスト--*/
#breadcrumb {
    padding: 10px 0;
}

#breadcrumb .fbc-page .fbc-wrap .fbc-items {
    background-color: transparent;
    line-height: 1.3em;
}

#breadcrumb .fbc-page .fbc-wrap .fbc-items li {
    padding: 0px 2px;
}

#breadcrumb .fbc-page .fbc-wrap .fbc-items li:first-child {
    padding-left: 0;
}

#breadcrumb .fbc-page .fbc-wrap .fbc-items {
    float: right;
}

#breadcrumb .fbc-page .fbc-wrap .fbc-items li a:hover {
    color: var(--color-main);
}

/*-------------------------------------------*/
/*	固定ページ共通(body-page-common)
/*-------------------------------------------*/
.body-page-common .sub-eng {
    font-size: 4rem;
    line-height: 1em;
    color: var(--color-main);
    position: relative;
    display: block;
    margin-bottom: 15px;
    font-size: var(--font-page-sub-eng);
}

/*-------------------------------------------*/
/*	固定ページ共通アニメーション
/*-------------------------------------------*/
/*--ブラーアニメーション--*/
.business-head.io-active img,
.staff-intro-block-r.io-active img {
    opacity: 0;
    -webkit-animation: bluranim 2s 0.5s var(--easing) both;
    animation: bluranim 2s 0.5s var(--easing) both;
}

.business-head.fadein.io-active .business-head-l.fadein-item img,
.staff-intro-block-r.io-active .staff-intro-block-l {
    animation-delay: 0.2s;
}

.business-head.fadein.io-active .business-head-r-img01.fadein-item img,
.staff-intro-block-r.io-active .staff-intro-img01.fadein-item img {
    animation-delay: 0.4s;
}

.business-head.fadein.io-active .business-head-r-img02.fadein-item img,
.staff-intro-block-r.io-active .staff-intro-img02.fadein-item img {
    animation-delay: 0.6s;
}

@keyframes bluranim {
    0% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
        opacity: 0;
        -webkit-filter: blur(50px);
        filter: blur(50px);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
        -webkit-filter: blur(0);
        filter: blur(0);
    }
}

/*-------------------------------------------*/
/*	会社案内(page-company)
/*-------------------------------------------*/
/*代表挨拶*/
#company-maessage .message-l {
    width: 62%;
}

#company-maessage .message-l p {
    line-height: 2em;
}

#company-maessage .message-r {
    width: 32%;
}

/*代表名前*/
#company-maessage .massage-name {
    margin-top: 30px;
    line-height: 1.8em;
}

#company-maessage .massage-name span.massage-name01 {
    display: block;
}

#company-maessage .massage-name strong {
    font-size: var(--font22);
    letter-spacing: 0.1em;
}

#company-maessage .massage-name strong .massage-name-position {
    font-size: var(--font16);
    padding-right: 1em;
}

/*代表プロフィール*/
#company-maessage .prof {
    padding: 50px 15px;
    border-top: 1px solid rgba(var(--color-blacktrans), 0.5);
    border-bottom: 1px solid rgba(var(--color-blacktrans), 0.5);
}

#company-maessage .prof01 {
    padding: 10px;
    width: 10rem;
}

#company-maessage .prof02 {
    width: calc(100% - 15rem);
}

#company-maessage .prof03 {
    margin-top: 30px;
    background-color: rgba(var(--color-blacktrans), 0.04);
    padding: var(--space-res);
}

/*会社概要*/
#company-info table {
    width: 80%;
    margin-top: var(--space-main);
    margin-left: auto;
}

#company-info table tr th,
#company-info table tr td {
    padding: 30px;
}

#company-info table tr th {
    font-weight: normal;
    color: rgba(var(--color-blacktrans), 0.6);
}

#company-info table tr td {
    text-align: left;
    font-weight: bold;
}

/*-------------------------------------------*/
/*	スタッフ紹介(page-staff)
/*-------------------------------------------*/
#page-staff #content {
    padding-bottom: 0;
}
/*	スタッフ紹介イントロ(#staff-intro)
/*-------------------------------------------*/
#staff-intro {
    position: relative;
    z-index: 1;
}

#staff-intro .staff-intro-block-l {
    width: 45%;
}

#staff-intro .staff-intro-block-r {
    width: 48%;
}

#staff-intro .page-lead {
    margin: 2rem 0 1rem;
    line-height: 1.5em;
}

#staff-intro .staff-intro-text {
    line-height: 2em;
}

#staff-intro .staff-intro-block-r {
    padding-top: 2rem;
}

#staff-intro .staff-intro-img {
    border-radius: var(--round-main);
    overflow: hidden;
}

#staff-intro .staff-intro-img01 {
    width: 68%;
    margin-left: auto;
}

#staff-intro .staff-intro-img02 {
    width: 60%;
    margin-top: -2rem;
}

/*	スタッフ紹介(Staff Introduction)
/*-------------------------------------------*/
#staff-introduction {
    margin-top: -80px;
    padding-top: calc(var(--space-main) + 80px);
}
/*--タイトル周り--*/
#staff-introduction .staff-ttl-block {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    margin-bottom: var(--space-ml);
}

#staff-introduction .staff-ttl-block p.sub-eng.ttl-sand-border {
    width: 100%;
    font-size: var(--font40);
    margin-bottom: 5px;
}

#staff-introduction .staff-ttl-block p.sub-eng.ttl-sand-border:before,
#staff-introduction .staff-ttl-block p.sub-eng.ttl-sand-border:after {
    width: calc(100% - 20em) !important;
}

#staff-introduction .staff-ttl-block h2 {
    text-align: center;
    font-size: var(--font20);
}
/*--写真有無共通--*/
.staff-p-block,
.staff-nop-block {
margin-bottom: var(--space-m);
}

.staff-lead .staff-lead-num span,
.staff-lead .staff-lead-num strong,
.staff-profile-block strong {
font-family: var(--font-jp-sub);
font-weight: 550;
}

.staff-lead .staff-lead-num span,
.staff-profile-block strong {
/* font-family: var(--font-eng-main); */
display: block;
font-size: var(--font15);
position: relative;
padding-left: 1em;
line-height: 1em;
}

.staff-profile-block strong {
    margin-bottom: 5px;
}
.staff-lead .staff-lead-num span:before,
.staff-profile-block strong:before {
content: "";
position: absolute;
width: 0.5em;
height: 0.5em;
top: 0.25em;
left: 0.25em;
background-color: var(--color-main);
border-radius: 50%;
}
.staff-lead .page-lead {
width: calc(100% - 6rem);
}
/*--staff-lead--*/
.staff-lead {
display: flex;
}
.staff-lead .staff-lead-num {
margin-right: 1rem;
width: 5rem;
}

.staff-lead .staff-lead-num strong {
display: block;
font-size: 3.8rem;
line-height: 1em;
color: var(--color-main);
}

/*--staff-name-block--*/
.staff-name-block {
position: relative;
display: flex;
justify-content: flex-end;
margin-top: var(--space-ss);
}

.staff-name-block:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
top: 50%;
left: 0;
background-color: var(--color-main);
}

.staff-name-block p {
position: relative;
z-index: 1;
display: inline-block;
padding-left: 1.5rem;
color: var(--color-main-text);
font-family: var(--font-jp-sub);
font-weight: 500;
}

.staff-name-block p:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
top: 50%;
left: 0;
background-color: #edebe9;
z-index: -1;
}
.staff-name-block p .staff-name-position {
font-size: var(--font13);
padding-right: 0.5rem;
}

.staff-name-block p .staff-name {
font-size: var(--font22);
}

/*--staff-profile-block--*/
.staff-profile-block {
margin-top: var(--space-ss);
}
/*	写真あり(#staff-photo-area)
/*-------------------------------------------*/
#staff-photo-area {
width: 100%;
max-width: 1100px;
margin: 0 auto;
}
/*--staff-lead--*/
.staff-p-block .staff-lead .ttl-kakko-hook {
    text-align: left;
    left: 0;
    right: initial;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
    line-height: 1.5em;
}

.staff-p-block .staff-lead .ttl-kakko-hook:before,
.staff-p-block .staff-lead .ttl-kakko-hook:after {
    border-color: var(--color-main);
}
/*--staff-img-block--*/
.staff-p-block .staff-img-block img {
border-radius: var(--round-main);
}
/*	写真なし
/*-------------------------------------------*/
#staff-nophoto-area {
padding-top: var(--space-main);
}
#staff-nophoto-area .staff-nop-block {
    width: 47%;
    border-top: 1px solid var(--color-main);
    border-left: 1px solid var(--color-main);
    padding: 40px 20px 20px 40px;
}
#staff-nophoto-area .staff-lead .staff-lead-num strong {
    font-size: 3rem;
}
#staff-nophoto-area .staff-lead .page-lead {
    line-height: 1.3em;
    margin-top: 0.5em;
    align-self: center;
}
#staff-nophoto-area .staff-name-block p:before {
background-color: #e4e1e0;
}
#staff-nophoto-area .staff-block-message {
    margin-top: 10px;
}
#staff-nophoto-area .staff-profile-block {
    background-color: rgba(var(--color-blacktrans), 0.05);
    padding: 20px;
    margin-top: 20px;
}

/*-------------------------------------------*/
/*	事業内容(page-business)
/*-------------------------------------------*/
#page-business .business-head-l {
    width: 55%;
    padding-bottom: 2rem;
}

#page-business .business-head-r {
    width: 42%;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    padding-top: 2rem;
}

#page-business .business-head-img {
    width: 48%;
    border-radius: var(--round-main);
    overflow: hidden;
}

#page-business .business-head-img.business-head-r-img02 {
    margin-top: -50px;
    align-self: flex-start;
}

#page-business .business-lead-sub-text {
    font-family: var(--font-jp-sub);
    line-height: 2.25em;
    font-weight: 500;
    margin-top: var(--space-ss);
}

.business-head-maintext p {
    font-family: var(--font-jp-sub);
    font-weight: 500;
    margin-bottom: 1rem;
}

/*--business-service--*/
#business-service h2 {
    font-size: var(--font18);
    position: relative;
    padding-left: 5.2083333333vw;
}

#business-service h2:before {
    content: "";
    display: block;
    width: 3.8888888889vw;
    height: 1px;
    background-color: var(--color-main);
    position: absolute;
    top: 50%;
    left: 0;
}

#business-service .business-service-sub-eng {
    line-height: 1.1em;
}

#business-service .page-lead {
    font-size: var(--font22);
    line-height: 1.5em;
    margin: 1.75rem 0;
}

#business-service .business-contents:nth-of-type(even) .business-contents-intro {
    flex-direction: row-reverse;
}

#business-service .business-contents-intro-l {
    width: 45%;
}

#business-service .business-contents-intro-r {
    display: flex;
    width: 50%;
    border-radius: var(--round-main);
    overflow: hidden;
}

#business-service .business-contents-intro-r img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/*business-management*/
#business-service #business-management .btn-base-block .btn-base {
    width: 100%;
    max-width: 380px;
}

#business-service #business-management .btn-base-block ul li:first-of-type {
    margin-bottom: 6px;
}

/*-------------------------------------------*/
/*	サイトマップ
/*-------------------------------------------*/
#sitemap {
    border: 3px solid rgba(0, 0, 0, 0.1);
    padding: calc(0.5em + 4.1%);
}

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

.sitemap-l,
.sitemap-r {
    width: 48%;
}

ul.page-sitemap-list ul {
    margin-left: 0.5em;
}

#sitemap li a {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" ><path fill="%23666" d="M3.64,8.95c-.12,0-.25-.05-.34-.15-.18-.19-.17-.49.02-.67l3.28-3.13L3.31,1.87c-.19-.18-.2-.48-.02-.67.18-.19.48-.2.67-.02l3.64,3.48c.09.09.15.21.15.34s-.05.25-.15.34l-3.64,3.48c-.09.09-.21.13-.33.13Z" /></svg>');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 8px 8px;
    padding-left: 12px;
    color: #666;
    text-decoration: none;
}

#sitemap li a:hover {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" ><path fill="%23999" d="M3.64,8.95c-.12,0-.25-.05-.34-.15-.18-.19-.17-.49.02-.67l3.28-3.13L3.31,1.87c-.19-.18-.2-.48-.02-.67.18-.19.48-.2.67-.02l3.64,3.48c.09.09.15.21.15.34s-.05.25-.15.34l-3.64,3.48c-.09.09-.21.13-.33.13Z" /></svg>');
    color: #999;
}
/*-------------------------------------------*/
/*	基本投稿設定
/*-------------------------------------------*/

/*	投稿設定：アーカイブ
/*-------------------------------------------*/
/*	イメージ付カード式
/*-------------------------------------------*/
.posted-list-card ul.posted-list {
    display: flex;
    flex-wrap: wrap;
}

.posted-list-card ul.posted-list li {
    width: 50%;
    padding: 0rem 2rem;
    margin-bottom: 35px;
}

.posted-list-card ul.posted-list li a {
    text-decoration: none;
    color: var(--color-main-text);
}

.posted-list-card ul.posted-list li a:hover {
    color: var(--color-main-text);
}

.posted-list-card ul.posted-list li h3 {
    font-size: 16px;
    font-weight: 300;
}

.posted-list-card ul.posted-list li .posted-img,
.posted-img {
    position: relative;
    overflow: hidden;
    border-radius: var(--round-s);
    width: 100%;
    aspect-ratio: 1 / 0.725;
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin-bottom: 1rem;
}

.posted-list-card ul.posted-list li .posted-img img,
.posted-img img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.posted-list-card ul.posted-list li a:hover img {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
}

/*カテゴリー欄*/
.posted-list-card ul.posted-list ul.term-list {
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
}

.posted-list-card ul.posted-list ul.term-list li {
    margin: 0;
    width: initial !important;
    text-align: center;
    padding: 0 3px;
    font-size: 11px;
}

.single-posted-cat-list ul li a,
.posted-list-card ul.posted-list ul.term-list li a {
    background-color: rgba(255, 255, 255, 0.8);
    display: block;
    border-radius: var(--round-s);
    border: 1px solid rgba(62, 58, 57, 0.3);
    padding: 0 7px;
    margin-bottom: 3px;
}

.single-posted-cat-list ul li a {
    text-decoration: none;
    color: var(--color-main-text);
}

.single-posted-cat-list ul li a:hover,
.posted-list-card ul.posted-list ul.term-list li a:hover {
    background-color: var(--color-main-text);
    border-color: var(--color-main-text);
    color: rgba(255, 255, 255, 0.8);
}

/*日付*/
.posted-date .date,
.posted-date .modified-date {
    font-size: 13px;
    display: inline-block;
    color: var(--color-gray-dark);
}

.posted-date .modified-date {
    position: relative;
    padding-left: 1.5em;
}
.posted-date .modified-date:after {
    content: '';
    position: absolute;
    width: 1.3em;
    height: 1.3em;
    left: 0;
    top: 3px;
    -webkit-mask-image: url(/images/icon/icon-modified-date.png);
    mask-image: url(/images/icon/icon-modified-date.png);
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 1.3em;
    mask-size: 1.3em;
    background-color: var(--color-gray-dark);
}
/*	イメージなしリスト式
/*-------------------------------------------*/
.posted-list-simple ul.posted-list li:not(:last-of-type) {
    margin-bottom: 10px;
}

.posted-list-simple ul.posted-list li a {
    color: var(--color-main-text);
    text-decoration: none;
    display: block;
    background-color: rgba(var(--color-whitetrans), 1);
    border-radius: var(--round-s);
}

.posted-list-simple ul.posted-list li a:hover {
    background-color: rgba(var(--color-whitetrans), 0.6);
}

.posted-list-simple ul.posted-list li .posted-a-head {
    display: flex;
    width: 250px;
    padding: 30px 0 30px 30px;
}

.posted-list-simple ul.posted-list li h3,
.posted-list-simple ul.posted-list li .posted-date {
    font-size: 16px;
    font-weight: 300;
    line-height: 1.3em;
}

.posted-list-simple ul.posted-list li .term-list {
    align-self: flex-start;
    line-height: 1em;
    width: 110px;
    border: 1px solid;
    padding: 3px 10px;
    border-radius: 9999px;
    font-size: var(--font14);
    display: block;
    text-align: center;
    background-color: var(--color-main-text);
    color: var(--color-white);
}

.posted-list-simple ul.posted-list li .term-list.seminar-info {
    background-color: var(--color-main);
}

/*
.posted-list-simple ul.posted-list li .term-list a {
border: 1px solid;
padding: 3px 10px;
border-radius: 9999px;
font-size: var(--font14);
width: 100%;
display: block;
text-align: center;
}

.posted-list-simple ul.posted-list li .term-list a:hover {
color: var(--color-white);
background-color: var(--color-main-text);
}
*/
.posted-list-simple ul.posted-list li .posted-date {
    width: 110px;
}

.posted-list-simple ul.posted-list li .posted-a-text {
    display: flex;
    padding: 30px 30px 30px 10px;
    width: calc(100% - 270px);
    margin-left: 20px;
}

/*--ボタン--*/
.posted-list-simple ul.posted-list li a .posted-a-text .btn-base-icon-item {
    width: 20px;
}

.posted-list-simple ul.posted-list li a:hover .posted-a-text .btn-base-icon-item {
    color: var(--color-main);
}

.posted-list-simple ul.posted-list li a:hover .posted-a-text .btn-base-icon-item svg {
    animation: none;
}

.posted-list-simple ul.posted-list li .posted-ttl {
    width: calc(100% - 30px);
    line-height: 1.5em;
    font-weight: bold;
}

.posted-list-simple ul.posted-list li a:hover .posted-ttl {
    color: var(--color-main);
}
/*TOP設定：イメージ付カード式*/
body.home .posted-list-card ul.posted-list li {
    padding: 5px;
}
/*-------------------------------------------*/
/*	ブログアーカイブ
/*-------------------------------------------*/
#blog-cat-list {
background-color: rgba(var(--color-blacktrans), 0.04);
padding: var(--space-res);
margin-bottom: var(--space-m);
}
body #content #blog-cat-list h2 {
display: block;
font-size: var(--font18);
position: relative;
padding: 0;
padding-left: 1em;
line-height: 1em;
font-weight: 500;
font-family: var(--font-eng-main);
margin-bottom: var(--space-ss);
border: none;
}
#blog-cat-list h2:before {
content: '';
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    top: 0.25em;
    left: 0.25em;
    background-color: var(--color-main);
    border-radius: 50%;
}
#blog-cat-list ul {
    display: flex;
    flex-wrap: wrap;
    font-family: var(--font-jp-sub);
    font-size: var(--font14);
    padding-left: 0;
    list-style: none;
}
#blog-cat-list ul li {
    padding: 6px;
    line-height: 1.3em;
    list-style-type: none;
}
#blog-cat-list ul li a {
    display: block;
    color: var(--color-main-text);
    background-color: var(--color-white);
    padding: 8px 10px;
    border-radius: var(--round-s);
    text-decoration: none;
}
#blog-cat-list ul li a:hover {
    background-color: var(--color-main-text);
    color: var(--color-white);
}
/*	採用実績アーカイブ&シングル
/*-------------------------------------------*/
.result-sns-btn a {
    color: var(--color-white);
    background-color: rgba(var(--color-maintrans), 0.8);
    padding: 1.5rem 2rem;
    width: fit-content;
    display: block;
    margin: 15px auto 0;
    font-weight: bold;
    border-radius: 5px;
    background-image: url(/images/common/arrow-blank-white01.png);
    background-position: right 10px bottom 10px;
    background-repeat: no-repeat;
    background-size: 13px;
    transition: all 0.3s;
    font-size: 18px;
    text-decoration: none;
    line-height: 1.3em;
}
.result-sns-btn a span {
    padding: 7px 15px;
    margin-right: 10px;
    background-color: rgba(255, 255, 255, 1.0);
    color: rgba(var(--color-maintrans), 0.8);
    border-radius: 3px;
}
.result-sns-btn a:hover {
color: var(--color-white);
background-color: rgba(var(--color-maintrans), 1.0);
}
.result-sns-btn a:hover span {
    color: rgba(var(--color-maintrans), 1.0);
}
/*	インタビューアーカイブ
/*-------------------------------------------*/
.archive-interview-img {
position: relative;
padding-top: 2rem;
}
.archive-interview-img strong {
    position: absolute;
    font-family: var(--font-eng-main);
    font-size: 3.25rem;
    top: 0;
    left: 0.5rem;
    line-height: 1em;
    font-weight: 500;
    color: var(--color-main);
    z-index: 1;
}
.archive-interview-img strong span {
    font-size: var(--font13);
    display: block;
    line-height: 1em;
    text-align: center;
}
body.post-type-archive-interview .posted-list-card ul.posted-list li h3 {
    font-size: var(--font18);
    font-weight: bold;
    border-bottom: 1px solid rgba(var(--color-blacktrans), 0.3);
    margin-bottom: 0.25rem;
    padding-bottom: 1rem;
}

.archive-interview-clinfo span {
    line-height: 1.3em;
font-family: var(--font-jp-sub);
    font-weight: 500;
    font-size: var(--font14);
}
.archive-interview-clinfo span.archive-interview-clinfo-position {
    display: block;
}
.archive-interview-clinfo span.archive-interview-clinfo-name {
    display: block;
    font-size: var(--font20);
}


/*	投稿設定：シングルページ(single.php--記事詳細ページ)
/*-------------------------------------------*/
/*	シングル見出し装飾
/*-------------------------------------------*/
/*--投稿見出し設定bodyクラスは必須。(body.single等)--*/
/*--single(詳細ページ)の見出し--*/
body.single h1.single-ttl {
    font-size: 1.4375rem;
    text-align: left;
    border-bottom: 1px solid;
    padding: 20px 10px;
    margin-bottom: 10px;
    position: relative;
    margin-bottom: 20px;
}
body.single #content h2 {
text-align: left;
border-top: 1px solid;
border-bottom: 1px solid;
padding: 15px;
font-size: 1.25rem;
margin-bottom: 20px;
}
body.single #content h3 {
position: relative;
padding: 10px 10px 10px 1em;
margin-bottom: 20px;
border-bottom: 1px solid rgba(var(--color-blacktrans), 0.5);
}
body.single #content h3:before {
content: '';
position: absolute;
width: 0.5em;
height: 0.5em;
top: calc(50% - 0.25em);
left: 0;
background-color: var(--color-main);
border-radius: 50%;
}
body.single #content h4 {
position: relative;
padding: 10px 0px 10px 30px;
font-size: 17px;
margin-bottom: 20px;
border-bottom: 1px dashed rgba(var(--color-blacktrans), 0.5);
}
body.single #content h4:before {
content: '';
position: absolute;
text-indent: -1.5em;
background-color: var(--color-main);
width: 0.9em;
height: 0.2em;
left: 4px;
top: calc(10px + 0.65em);
border-radius: var(--round-ss);
}
body.single #content h5 {
border-bottom: 1px solid rgba(var(--color-blacktrans), 0.3);
padding: 10px 0 5px 5px;
font-size: 115%;
margin-bottom: 20px;
}
body.single #content h6 {
border-bottom: 2px dotted rgba(var(--color-blacktrans), 0.3);
padding: 10px 0 5px 5px;
font-size: 110%;
margin-bottom: 20px;
}

body.single .posted-date {
    padding-left: 10px;
}

body.single .single-posted-term-block h3 {
    padding: 5px 5px 0;
    margin-bottom: 5px;
    border: none;
    font-size: 14px;
    border-top: 1px dashed rgba(0, 0, 0, 0.1);
}

.single-posted-cat-list,
.single-posted-tag-list {
    margin: 5px 0;
}

.single-posted-cat-list ul,
.single-posted-tag-list ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 0;
}

.single-posted-cat-list ul li,
.single-posted-tag-list ul li {
    margin: 0;
    width: initial;
    text-align: center;
    padding: 0 3px;
    font-size: 11px;
    list-style-type: none;
}

.single-posted-tag-list ul li a {
    background-color: rgba(0, 0, 0, 0.05);
    display: block;
    border-radius: var(--round-ss);
    padding: 0 7px;
    text-decoration: none;
    color: var(--color-main-text);
}
/*	シングル設定
/*-------------------------------------------*/
.posted-content {
    margin: 4rem 0;
    padding: 0 10px;
    /*overflow: hidden;*/
}
/*リスト*/
.posted-content :where(ul.wp-block-list:not([type])) {
    padding-left: 1em;
    list-style: disc;
}
.posted-content :where(ol.wp-block-list:not([type])) {
    padding-left: 1em;
}
.posted-content :where(ul.wp-block-list:not([type])) li {
    list-style-type: disc;
    line-height: 1.5;
    margin: .25em 0;
    position: relative;
}
/*ボタン*/
#content .wp-block-button__link:hover {
    opacity: 0.7;
}
/*デフォルトボタン
#content .wp-block-button__link {
    background-color: var(--color-main);
}
#content .wp-block-button__link:hover {
    background-color: var(--color-main60);
}
*/
/*-------------------------------------------*/
/*	採用実績シングル
/*-------------------------------------------*/
.results-page-ttl-img {
margin-bottom: 3rem;
border: 1px solid rgba(var(--color-blacktrans),0.1);
border-radius: var(--round-main);
overflow: hidden;
}
/*	インタビューシングル
/*-------------------------------------------*/
body.single.single-interview .posted-date {
    padding-left: 0;
    margin-bottom: 2rem;
}
body.single.single-interview .posted-content {
    margin-top: 0;
}
.interview-head {
    margin-bottom: var(--space-res);
}
.interview-head .interview-head-num {
display: flex;
font-family: var(--font-eng-main);
font-weight: 500;
color: var(--color-main);
}
.interview-head .interview-head-num span {
align-self: center;
line-height: 1em;
}
.interview-head .interview-head-num strong {
    font-weight: 500;
    font-size: 3rem;
line-height: 1em;
}
.interview-head .interview-head-text {
    width: 50%;
    margin-right: -50px;
    background-color: rgba(var(--color-whitetrans), 0.7);
    padding: 2.5rem 0 3rem 3rem;
}
body.single .interview-head .interview-head-text h1.single-ttl {
    font-size: var(--font-page-lead);
    padding: 20px 0;
}
.interview-head-clinfo span {
    display: block;
    line-height: 1.3em;
}
.interview-head-clinfo .interview-head-clinfo-position {
    margin-top: 20px;
}
.interview-head-clinfo .interview-head-clinfo-name {
    font-size: var(--font-page-lead);
    font-family: var(--font-jp-sub);
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0.15em;
}
.interview-head .interview-head-img {
    width: calc(50% + 50px);
}
.interview-head .interview-head-img img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.interview-main-text {
    font-size: var(--font20);
    color: var(--color-main);
    line-height: 1.6;
}

/*--interview-message--*/
.interview-message-l {
    width: 8rem;
}
body.single #content .interview-message-l h3 {
    padding: 0 0 0 1em;
    font-size: var(--font16);
    border: none;
}
.interview-message-r {
    width: calc(100% - 10rem);
border-left: 1px solid rgba(var(--color-blacktrans), 0.3);
padding-left: 3rem;
}

/*-------------------------------------------*/
/*	ページネーション
/*-------------------------------------------*/
/*シングル・アーカイブ共通*/
.pager,
.pager-single {
    margin-top: var(--space-s);
}
/*	archiveページネーション
/*-------------------------------------------*/
.nav-links {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.nav-links span:not(.my-arrow-left, .my-arrow-right),
.nav-links a:not(.next, .prev) {
    width: 3em;
    height: 3em;
    border-radius: 50%;
    line-height: 3em;
    display: inline-block;
    margin: 0 2px;
    color: #fff;
    background-color: var(--color-main-text);
}
.nav-links a {
text-decoration: none;
color: var(--color-main-text);
}
.nav-links a:not(.next, .prev):hover,
.nav-links .current {
    background-color: var(--color-main) !important;
    color: #fff;
}
/*--矢印--*/
.nav-links a.prev,
.nav-links a.next {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
}
.my-arrow-left,
.my-arrow-right {
position: absolute;
display: inline-block;
top: 50%;
}
.my-arrow-left {
left: 2px;
}
.my-arrow-right {
right: 2px;
}
.my-arrow-left:before,
.my-arrow-right:before {
content: '';
position: absolute;
width: 8px;
height: 8px;
border-top: 2px solid var(--color-main-text);
border-right: 2px solid var(--color-main-text);
}
.my-arrow-left:before {
  left: 0; 
transform: rotate(-135deg);
}
.my-arrow-right:before {
    right: 0;
transform: rotate(45deg);
}
/*-------------------------------------------*/
/*	singleページネーション
/*-------------------------------------------*/
.pager-single ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: rgba(0, 0, 0, 0.05);
    padding: 10px 0;
    margin-top: 30px;
    list-style: none;
}

.pager-single ul li {
    text-align: center;
    padding: 0;
    width: 33.333%;
    font-size: var(--font13);
    font-family: var(--font-jp-sub);
    list-style-type: none;
}

.pager-single ul li:nth-of-type(2) {
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.pager-single ul li a {
    position: relative;
    color: var(--color-main-text);
    text-decoration: none;
    padding-left: 1em;
    display: inline-block;
}

.pager-single ul li a:hover {
    color: var(--color-main);
}

.pager-single ul li a:before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    top: calc(50% - 0.25em);
    left: 0;
    background-color: var(--color-main);
    border-radius: 50%;
}

/*-------------------------------------------*/
/*	#common-contact(CTA)
/*-------------------------------------------*/
#common-contact {
    width: 100%;
    height: 100%;
    background-image: url(/images/common/bg-footer.jpg);
    background-size: cover;
    background-color: #222;
    background-blend-mode: soft-light;
    margin-top: 0px;
    color: var(--color-white);
    position: relative;
}

#common-contact .common-contact-l {
    width: 40%;
}

#common-contact .common-contact-r {
    width: 55%;
    display: flex;
}

#common-contact .sub-eng {
    font-family: var(--font-eng-main);
    font-weight: 500;
    font-style: normal;
    font-size: var(--font-sub-eng);
    line-height: 1em;
    margin-bottom: 10px;
    color: var(--color-white);
}

#common-contact h2 {
    position: relative;
    display: flex;
    align-items: center;
    font-size: var(--font18);
    padding-left: 1em;
    margin-bottom: 30px;
}

#common-contact h2::before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    left: 0;
    background-color: var(--color-main);
    border-radius: 50%;
}

#common-contact .common-footinfo-btn {
    display: flex;
    width: 100%;
}

#common-contact .common-footinfo-btn a {
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: var(--color-white);
    border: 1px solid var(--color-white);
    background-color: rgba(var(--color-whitetrans), 0.1);
    overflow: hidden;
    position: relative;
    z-index: 1;
}

#common-contact .common-footinfo-btn a:after {
    content: "";
    position: absolute;
}

#common-contact .common-footinfo-btn a:after {
    background: rgba(var(--color-maintrans), 0.8);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
    z-index: -1;
}

#common-contact .common-footinfo-btn a:hover {
    border-color: transparent;
}

#common-contact .common-footinfo-btn a:hover:after {
    transform: scale(1, 1);
}

#common-contact .common-footinfo-btn a span {
    display: inline-block;
    line-height: 1.3em;
    font-size: var(--font18);
    font-weight: bold;
    padding: 1em 0 1em 3em;
    background-image: url(/images/icon/icon-letter.png);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 2.25em;
}

#common-contact .common-footinfo-btn a .btn-base-icon {
    height: 50px;
    padding: 0;
}

#common-contact .common-footinfo-btn a .btn-base-icon:before {
    content: none;
}

#common-contact .common-footinfo-btn a .btn-base-icon-item {
    border: 1px solid rgba(var(--color-whitetrans), 0.7);
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
/*-------------------------------------------*/
/*	#common-bnr(footer上のバナー)
/*-------------------------------------------*/
#common-bnr {
    background-color: var(--color-main-text);
}

#common-bnr ul li {
    padding: 3px;
}

#common-bnr #common-bnr-top ul li {
    width: 50%;
}

#common-bnr #common-bnr-btm ul li {
    width: 33.333%;
}

#common-bnr ul li a {
    width: 100%;
    height: 100%;
    color: var(--color-main-text);
    text-decoration: none;
    padding: 25px 30px 35px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    min-height: 160px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: var(--round-s);
    overflow: hidden;
}

#common-bnr ul li a h3 {
    margin-bottom: 0;
    z-index: 2;
    font-size: 1.2em;
    width: 100%;
    position: relative;
    font-size: 20px;
    margin-top: 0.5em;
}

#common-bnr ul li a h3 img {
    width: 140px;
    display: block;
    margin-bottom: 12px;
}

#common-bnr ul li a h3 span {
    display: block;
    font-size: var(--font18);
    line-height: 1.3em;
}

#common-bnr ul li a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
    top: 0;
    left: 0;
    transform: scale(1);
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
}

#common-bnr ul li a .common-bnr-arrow {
    position: absolute;
    right: 6px;
    bottom: 6px;
    width: 12px;
    height: 12px;
    z-index: 2;
}

#common-bnr ul li a:hover .bnrBtn {
    background-color: rgba(255, 255, 255, 0.3);
}

#common-bnr ul li a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(var(--color-blacktrans), 1);
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    top: 0;
    left: 0;
    opacity: 0.15;
    z-index: 1;
}

#common-bnr ul li a:hover:after {
    opacity: 0;
}

/*--common-bnr-btm--*/
#common-bnr #common-bnr-btm ul li a {
    padding: 24px 20px 34px;
    min-height: 118px;
    text-decoration: none;
}

#common-bnr #common-bnr-btm ul li a h3 span {
    font-size: var(--font16);
}

/*--#common-bnr画像設定--*/
#common-bnr ul li a:hover:before {
    transform: scale(1.05);
}

#common-bnr ul li.foot-bnr-coda a:before {
    background-image: url(/images/bnr/bnr-coda.jpg);
}

#common-bnr ul li.foot-bnr-youtube a:before {
    background-image: url(/images/bnr/bnr-youtube.jpg);
}

#common-bnr ul li.foot-bnr-new a:before {
    background-image: url(/images/bnr/bnr-new.jpg);
}

#common-bnr ul li.foot-bnr-tc a:before {
    background-image: url(/images/bnr/bnr-tc.jpg);
}

#common-bnr ul li.foot-bnr-recruit a:before {
    background-image: url(/images/bnr/bnr-recruit.jpg);
}
/*-------------------------------------------*/
/*	footer
/*-------------------------------------------*/
footer {
    background-color: var(--color-main-text);
    font-size: var(--font15);
}

/*--footerの文字カラー(#footer-wrapを入れないときかない)--*/
footer #footer-wrap,
footer #footer-wrap a {
    color: var(--color-white);
}

footer #footer-wrap a {
    text-decoration: none;
}

footer #footer-wrap a:hover {
    color: var(--color-white);
    opacity: 0.7;
}

#footer-wrap {
    padding: 60px 0 40px;
}

/*--footer-l--*/
.footer-l {
    width: 30%;
    padding-right: 50px;
}

.footer-l address {
    font-style: normal;
}

.footer-l address .zip {
    display: block;
    line-height: 1.3em;
    margin-top: 10px;
}

.footer-l ul {
    margin-top: 10px;
}

.footer-logo-list li {
    width: 49%;
    margin: 0 0.5%;
}

.footer-logo {
    width: 200px;
}

ul.footer-sub-list li {
    margin-right: 15px;
}

ul.footer-sub-list li:last-of-type {
    margin-right: 0px;
}

ul.footer-sub-list li a,
.footer-bottom .footer-bottom-nav ul li a {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" ><path fill="%23fff" d="M3.64,8.95c-.12,0-.25-.05-.34-.15-.18-.19-.17-.49.02-.67l3.28-3.13L3.31,1.87c-.19-.18-.2-.48-.02-.67.18-.19.48-.2.67-.02l3.64,3.48c.09.09.15.21.15.34s-.05.25-.15.34l-3.64,3.48c-.09.09-.21.13-.33.13Z" /></svg>');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 10px 8px;
    padding: 0 0 0 13px;
}

.foot-sns ul {
    display: flex;
    flex-wrap: wrap;
}

.foot-sns ul li {
    width: fit-content;
    padding: 0 4px;
}

.foot-sns ul li a {
    background-image: url(/images/common/arrow-blank-white01.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 0.7em;
    padding-right: 1em;
}

.foot-sns ul li a img {
    width: 1.25em;
}

.foot-sns ul li a:hover,
.foot-sns ul li a:hover img {
    opacity: 0.7;
}

/*--footer-r--*/
.footer-r {
    width: 70%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.footer-r .foot-nav {
    width: 25%;
}

.footer-r .foot-nav .footer-sub-eng {
    position: relative;
    font-family: var(--font-eng-second);
    font-weight: 500;
    font-size: var(--font13);
    line-height: 1em;
    padding-left: 1em;
    margin-bottom: 15px;
}

.footer-r .foot-nav .footer-sub-eng::before {
    content: "";
    position: absolute;
    width: 0.5em;
    height: 0.5em;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--color-main);
    border-radius: 50%;
}

.footer-r .foot-nav-ul li {
    line-height: 1.1em;
    margin: 10px 0;
    list-style-type: none;
}

.footer-r .foot-nav-ul>li>a {
    display: block;
    padding: 0 1em;
    position: relative;
}

.footer-r .foot-nav-ul>li>a:before {
    content: "";
    position: absolute;
    width: 0.5em;
    top: 50%;
    left: 0;
    border-top: 2px solid var(--color-white);
}
.footer-r .foot-nav-bnrlink ul {
    padding: 0;
    list-style: none;
}
.footer-r .foot-nav-bnrlink ul li {
    list-style-type: none;
}
.footer-r .foot-nav-bnrlink ul li:not(:last-of-type) {
    margin-bottom: 5px;
}

.footer-r .foot-nav-ul li ul.sub-menu li a {
    position: relative;
    padding-left: 0.5em;
}

.footer-r .foot-nav-ul li ul.sub-menu li a:before {
    content: "";
    position: absolute;
    width: 0.25em;
    height: 0.25em;
    left: 0;
    top: 0.3em;
    background-color: var(--color-white);
    border-radius: 50%;
}

/*--footer-bottom--*/
.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.5);
    margin-top: 50px;
    font-size: 13px;
}

.footer-bottom .footer-bottom-nav {
    padding-top: 10px;
    margin-bottom: 20px;
    font-size: 12px;
}

.footer-bottom .footer-bottom-nav ul {
    justify-content: flex-end;
}

.footer-bottom .footer-bottom-nav ul li {
    padding-left: 15px;
}

.footer-bottom .copyright {
    line-height: 1em;
}
/*-------------------------------------------*/
/*	ページトップ
/*-------------------------------------------*/
#page-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 100;
}

#page-top a {
    text-decoration: none;
}

#page-top a:hover {
    background-color: rgba(var(--color-maintrans), 0.7);
}

#page-top a img {
    width: 50px;
    padding: 20px;
    display: block;
    line-height: 40px;
    background-color: rgba(var(--color-maintrans), 0.7);
    border-radius: 50%;
}

#page-top a:hover img {
    background-color: rgba(var(--color-maintrans), 1);
}