@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
*============================================================*/
/* コンテンツ内
---------------------------------------- */
body {
	font-size: 18px;
}
.inner {
	max-width: 592px;
}
.section {
	margin-bottom: 64px;
}
h1.page-title {
	font-size: 36px;
	line-height: 1.3;
}

.page-lower #mainvisual {
	padding-top: calc( var(--common-header-height) + 57px);
	padding-bottom: 57px;
}

#breadcrumb {
	margin-bottom: 32px;
}

/*============================================================
 コンテンツ共通
*============================================================*/
/* 要素幅超スクロール
---------------------------------------- */
.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 {
    width: 343px;
}

.page-lower .sec-title {
	margin-bottom: 32px;
}
.page-lower .block-title span.accent {
	display: block;
	width: 116px;
	margin: 8px auto 0;
}
.page-lower .block-title span.accent.bad {
	display: block;
	width: 136px;
	margin: 8px auto 0;
}

.page-lower .basic-block {
	gap: 24px;
}
.page-lower .basic-block .image {
	width: 100%;
}
.page-lower .basic-block .info {
	width: 100%;
}
.page-lower .basic-block.pt2 {
	gap: 24px;
}
.page-lower .basic-block.pt2 .image {
	width: 100%;
}
.page-lower .basic-block.pt2 .info {
	width: 100%;
}

.page-lower .bg-pink-block {
	padding: 32px 0 48px;
}

.page-lower .block.list ul {
	gap: 0;
	flex-direction: column;
}

.page-lower dl.data dt {
	float: none;
	margin-bottom: 4px;
}
.page-lower dl.data dd {
	margin-left: 0;
}

.page-lower .list-block.col2 .item {
	width: 100%;
}
.page-lower .list-block.col3 .item {
	width: 100%;
}
.page-lower .list-block.col4 .item {
	width: 155px;
	min-width: initial;
}
.page-lower .list-block.col4.flow .item:before {
	left: -16px;
}

.page-lower .flow-block .item {
	flex-direction: column;
	gap: 16px;
}
.page-lower .flow-block .item .info {
	width: 100%;
}
.page-lower .flow-block .item .info h3 {
	text-align: center;
}

#sec-menu-link .list {
	gap: 16px;
}
#sec-menu-link .item {
	width: 47%;
	padding: 16px 0;
}
#sec-menu-link .item h3 {
	font-size: 19px;
}
#sec-menu-link .item .image {
	width: 48px;
	margin: 0 auto;
}


#sec-note-jihi .sec-title {
	font-size: 24px;
	padding-top: 100px;
}
#sec-note-jihi .sec-title:before {
	width: 80px;
	height: 80px;
}
#sec-note-jihi .sec-title span {
	display: inline-block;
	line-height: 1.4;
}
#sec-note-jihi .sec-title span:first-child {
	margin-bottom: 20px;
}
#sec-note-jihi .sec-title span:before {
	background-image: url(../images/common/note-title-line-01-sp.svg);
	bottom: -16px;
}
#sec-note-jihi .sec-title span:last-child:before {
	background-image: url(../images/common/note-title-line-02-sp.svg);
}

.block-post-content h2 {
	font-size: 32px;
}
.block-post-content h3 {
	font-size: 24px;
}
.block-post-content ul {
	padding-left: 28px;
}
.block-post-content ol {
	padding-left: 28px;
}

/*============================================================
 CTA
*============================================================*/
/* お問い合わせ
---------------------------------------- */
#cta-contact .inner:before {
	width: 120px;
	height: 120px;
}
#cta-contact .inner:after {
	width: 62px;
	height: 85px;
	right: -5px;
	top: -92px;
}
#cta-contact .info {
	gap: 8px;
}
#cta-contact .info .icon {
	width: 64px;
}

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

/*============================================================
 footer
*============================================================*/
#site-footer {
}
#site-footer .menu-list {
	gap: 24px;
	justify-content: flex-start;
}

@media screen and (max-width: 480px) {
	.page-lower .bg-white-block {
		padding: 32px 16px;
	}
	.page-lower .list-block.col4 {
		gap: 16px;
	}
	

}

@media screen and (max-width: 375px) {
	.page-lower .list-block.col4 .item {
		width: 147px;
	}
	
}