@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: 24px;
    line-height: 180%;
}


/*============================================================
 コンテンツ共通
*============================================================*/
/* 要素幅超スクロール
---------------------------------------- */
.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;
    gap: 16px;
	width: fit-content;
	margin: 0 auto 24px auto;
}


/*============================================================
 記事本文ブロック
*============================================================*/
/* 見出し
---------------------------------------- */
.block-post-content h2 {
    font-size: 20px;
    line-height: 140%;
    margin: 40px 0 16px 0;
}
.block-post-content h3 {    
    font-size: 18px;
    line-height: 140%;
    margin: 24px 0 16px 0;
}

/*============================================================
 CTA
*============================================================*/
/* お問い合わせ(パープル)
---------------------------------------- */
.cta-inquiry1 {
    padding: 40px 0;
}
.cta-inquiry1 .inner {
    padding: 0 16px;
}
.cta-inquiry1 .box-container {
	flex-direction: column;
}
.cta-inquiry1 .box-container .item {
    width: 100%;
}
.cta-inquiry1 .box-container .image {
    height: 296px;
    background-image: url(../images/top/cta-bg-sp.png);
    background-position: bottom center;
    background-size: 524px auto;
}
.cta-inquiry1 .box-container .info {
    padding: 16px 0;
}
.cta-inquiry1 .box-container .info .block {
	margin: 0 auto;
}
.cta-inquiry1 .box-container .info .block .btn-inquiry {
    --width: 247px;
}

/* お問い合わせ(ブルー)
---------------------------------------- */
.cta-inquiry2 {
    height: 302px;
    background-image: url(../images/top/cta2-character.png), url(../images/top/cta2-bg-sp.jpg);
    background-position: top 76px right calc(50vw + 26px), top center;
    background-size: 160px auto, 767px auto;
    position: relative;
}
.cta-inquiry2 .inner {
    max-width: 375px;
}
.cta-inquiry2 .info  {
    margin-left: auto;
	padding-top: 28px;
}
.cta-inquiry2 .info .cta-lead {
    font-size: 16px;
    line-height: 140%;
    margin-bottom: 8px;
	text-align: center;
}
.cta-inquiry2 .info .cta-title {
    font-weight: 900;
    font-size: 24px;
    line-height: 140%;
	text-align: left;
	width: fit-content;
	margin: 0 auto 24px auto;
}
.cta-inquiry2 .info .btn-inquiry {
    --width: 215px;
}


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

/* メニューリスト
---------------------------------------- */
#site-footer #fnav .menu-list {
	flex-direction: column;
    text-align: center;
}