@charset "UTF-8";
/********************************************************************************

common-sp.css

********************************************************************************/
/*============================================================
 css変数
*============================================================*/
:root {
	--common-inner-max-width: 100%;           /* 通常サイト幅 */
	--common-inner-max-width-wide: 100%;      /* ワイドサイト幅 */
	--common-inner-padding: 24px;               /* 通常サイト幅内余白 */
	--common-inner-padding-wide: 24px;          /* ワイドサイト幅内余白 */
}

/*============================================================
 system
*============================================================*/
/* pc-sp display switch
---------------------------------------- */
.forPC {
    display: none;
}
.forSP {
    display: inherit;
}

/*============================================================
 format
*============================================================*/
/* ベース
---------------------------------------- */
body {
}

/* レイアウト
---------------------------------------- */
#main-contents {
    padding-bottom: 72px;
}

/* コンテンツ内
---------------------------------------- */
h1.page-title {
    font-size: 36px;
    line-height: 150%;
}
h2.sec-title {
    font-size: 24px;
    line-height: 160%;
}

/*============================================================
 メインビジュアル(下層)
*============================================================*/
.page-lower #mainvisual {
    padding: 32px 0;
}

/*============================================================
 アイキャッチ(第2階層)
*============================================================*/
#sec-eyecatch .eyecatch {
    height: 160px;
}

/*============================================================
 コンテンツ共通
*============================================================*/
/* 要素幅超スクロール
---------------------------------------- */
.block-wscroll-sp {
    width: calc(var(--common-vw) - ((var(--common-vw) - 100%) / 2));
    overflow-x: auto;
}
.block-wscroll-sp .block-wscroll-inner {
    width: max-content;
    padding: 0 var(--inner-padding) 16px 0;
}
.block-wscroll-sp .block-wscroll-inner > * {
    width: auto;
    /* white-space: nowrap; */
}

/* カード
---------------------------------------- */
.block-card {
    flex-direction: column;
    width: fit-content;
    margin: 0 auto;
}
.block-card .item {
    width: 343px;
}

/* サポート一覧（カード）
---------------------------------------- */
.block-card-support {
    flex-direction: column;
    gap: 24px;
}
.block-card-support .item {
    width: 100%;
} 

/* 事例一覧（カード）
---------------------------------------- */
.block-card-cases {
    gap: 24px;
}
.block-card-cases .item {
    padding: 16px;
    flex-direction: column;
    align-items: unset;
}
.block-card-cases .item .info {
    flex: unset;
}
.block-card-cases .item .info .title {
    font-size: 20px;
    line-height: 140%;
}
.block-card-cases .item .info .party-list .party {
    min-width: 146px;
}
.block-card-cases .item .benefit .economic-benefit {
    width: 100%;
    min-width: unset;
    padding: 8px 40px 8px 16px;
    font-size: 16px;
    line-height: 100%;
}
.block-card-cases .item .benefit .economic-benefit::before {
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
}


/* 特集一覧（カード）
---------------------------------------- */
.block-card-feature {
    align-items: center;
}
.block-card-feature .item {
    flex-direction: column;
    max-width: 360px;
}
.block-card-feature .item .info {
    padding: 16px
}
.block-card-feature .item .info .title {
    margin-bottom: 16px;
}

/* お知らせ一覧（リスト）
---------------------------------------- */
.block-list-news .item {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 24px 0;
    border-bottom: solid 1px #D6D3C1;
}

/* コラム一覧
---------------------------------------- */
.block-card-column {
    gap: 24px;
}
.block-card-column .item {
    width: 100%;
}
.block-card-column .item .info .title {
    width: 100%;
    height: auto;
    font-size: 20px;
    line-height: 170%;
} 

/* よくある質問一覧（非アコーディオン）
---------------------------------------- */
.block-card-faq {
    --icon-size: 40px;
}
.block-card-faq .item .question {
    gap: 20px;
}
.block-card-faq .item .answer {
    gap: 20px;
}


/*============================================================
 CTA
*============================================================*/
/* CTA お問い合わせ(画面下部追従)
---------------------------------------- */
#fixed-cta-contact {
    padding: 8px;
    border-radius: 24px 24px 0 0;
}
#fixed-cta-contact > .parts-boxes {
    gap: 8px;
}


/*============================================================
 記事本文ブロック
*============================================================*/
/* 見出し
---------------------------------------- */
.block-post-content h2 {
    font-size: 24px;
}

/*============================================================
 footer
*============================================================*/
#site-footer {
}

/* Annotation Bar
---------------------------------------- */
#site-footer .annotation-bar {
    padding: 8px 0;
}

/* contents
---------------------------------------- */
#site-footer {
    padding: 0 0 128px 0;
}
#site-footer .box-info {
    width: fit-content;
    margin: 0 auto;
}
#site-footer .footer-info {
    gap: 32px 0;
}
#site-footer .footer-info .box-cta {
    flex-direction: column;
    gap: 24px 0;
}
#site-footer .footer-info .box-info {
    flex-direction: column;
    align-items: flex-start;
    gap: 32px 0;
}
#site-footer .footer-info .fnav {
    max-width: unset;
}
#site-footer .footer-info .fnav .menu-list {
    justify-content: flex-start;
    gap: 24px 32px;
}

/* Copyright
---------------------------------------- */
#site-footer #copyright {
    text-align: center;
}