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

common-sp.css

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

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

/*============================================================
 format
*============================================================*/
/* コンテンツ内
---------------------------------------- */
h1.page-title {
    font-size: 32px;
    line-height: 140%;
}
h2.sec-title {
    font-size: 24px;
    margin-bottom: 24px;
}
h3.block-title {
    font-size: 20px;
    margin-bottom: 16px;
}

/*============================================================
 コンテンツ共通
*============================================================*/
/* 要素幅超スクロール
---------------------------------------- */
.block-wscroll-sp {
    width: calc(100vw - ((100vw - 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 {
    max-width: 343px;
    width: 100%;
}

/* dlリスト
---------------------------------------- */
.block-dl-list .item  {
    flex-direction: column;
}
.block-dl-list .item dt,
.block-dl-list .item dd {
    width: 100%;
}
/* 【サービス共通】　カードリスト
--------------------------------------- */
.block-card-service {
    --col: 1;
    --col-highlight: 1;
    --item-gap: 16px;
    --icon-size: 48px;
    --icon-size-highlight: 48px;
}

/* 【カード画像リスト】
---------------------------------------- */
.block-card-image {
    --col: 1;
}
.block-card-image .item {
}

/* カードリスト（アイコン）
---------------------------------------- */
.block-card-service {
    gap: var(--gap) 0;
}
.block-card-service .item {
    padding: 20px;
    flex-direction: column;
}
.block-card-service .item .info {
    flex-direction: column;
}

/* ハイライトカード */
.block-card-service .item.highlight {
	width: calc(100% / var(--col-highlight));
    padding: 20px;
}
.block-card-service .item.highlight .title {
    font-size: 20px;
}
.block-card-service .item.highlight .text {
    font-size: 16px;
}


/* 画像リスト
---------------------------------------- */
.block-image-list {
    --col: 1;
}


/* 画像リスト（数字付き）
---------------------------------------- */
.block-image-num-list {
    gap: 40px;
}
.block-image-num-list .item {
    gap:24px;
}
.block-image-num-list .item .image {
    width: 100%;
    height: auto;
}
.block-image-num-list .item .image img {
    width: 100%;
}
.block-image-num-list .item .info .title {
    font-size: 20px;
}
.block-image-num-list .item .info .title::before {
    width: 40px;
    height: 40px;
    font-size: 20px;
}

/*============================================================
 メインビジュアル(下層)
*============================================================*/
.page-lower #mainvisual {
    height: 300px;
    padding-top: calc( var(--common-header-height) + 32px);
}
.page-lower #mainvisual .excerpt {
    font-size: 14px;
    margin-top: 16px;
}
.page-child.page-lower #mainvisual {
    height: 400px;
    padding-top: calc( var(--common-header-height) + 70px);
}

/*============================================================
 パンくずリスト
*============================================================*/
#breadcrumb {
    margin-bottom: 8px;
}
#breadcrumb ul {
    font-size: 14px;
}

/*============================================================
 CTA
*============================================================*/
/* お問い合わせ
---------------------------------------- */

/*============================================================
 記事本文ブロック
*============================================================*/
/* 見出し
---------------------------------------- */

/*============================================================
 footer
*============================================================*/
#site-footer #fnav {
    height: auto;
    flex-direction: column;
    gap: 36px;
}
/* ロゴ */
#site-footer #fnav .logo {
    margin-bottom: 16px;
}
#site-footer #fnav .addr {
   font-size: 14px;
}

/* メニューリスト
---------------------------------------- */
#site-footer #fnav .menu-list {
    width: 260px;
    row-gap: 14px;
}
#site-footer #fnav .menu-list li {
    width: 100px;
    font-size: 14px;
}

/* お問い合わせ
---------------------------------------- */
#site-footer #fnav .contact .title {
    font-size: 16px;
    margin-bottom: 16px;
}
#site-footer #fnav .contact p {
    font-size: 12px;
}
