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

pattern.css for サイト専用（フリー投稿）用パターン

********************************************************************************/

/*============================================================
 CSS変数
*============================================================*/
:root {
}


/*============================================================
 テーブル
*============================================================*/
/* 基本
---------------------------------------- */
.block-post-content [class*="pattern-table"] * {
	border: unset;
}
.block-post-content [class*="pattern-table"] {
	--header-border: solid 2px #D3C8BD;	/* ヘッダー線 */
	--label-background-color: #FBF9F1;		/* ラベル背景色 */
	--cel-color: #B79069;					/* セルテキスト色 */
	--cell-border: solid 1px #FBF9F1;		/* セル線 */
}
.block-post-content [class*="pattern-table"] thead {
	border-bottom: var(--header-border);
}
.block-post-content [class*="pattern-table"] thead th {
	background-color: var(--label-background-color);
	font-weight: 500;
	font-size: 20px;
	line-height: 140%;
	text-align: center;
	color: var(--cel-color);
}
.block-post-content [class*="pattern-table"] tbody :is(th, td) {
	font-weight: 600;
	font-size: 20px;
	line-height: 140%;
	color: var(--cel-color);
	padding: 12px;
	border-bottom: var(--cell-border);
}
.block-post-content [class*="pattern-table"] tbody td {
	border-right: var(--cell-border);
}
.block-post-content [class*="pattern-table"] tbody td:first-of-type {
	border-left: var(--cell-border);
}

/* ヘッダーラベルがない場合
---------------------------------------- */
.block-post-content [class*="pattern-table"] :not(:has(thead)) tbody {
	border-top: var(--cell-border);
}

/* ラベル列あり
---------------------------------------- */
.block-post-content .pattern-table-label-col thead th:first-of-type {
	width: 20%;
}
.block-post-content .pattern-table-label-col tbody td:first-of-type {
	background-color: var(--label-background-color);
	font-weight: 500;
	font-size: 16px;
	line-height: 140%;
	text-align: right;
	border-color: #fff;
}

/*============================================================
 ポイント・注意点
*============================================================*/
.block-post-content .pattern-attention {
	padding: 16px 24px;
	background-color: #FFF9F4;
	border: solid 1px #E39B86;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.block-post-content .pattern-attention::before {
	display: block;
	content: "";
	width: 25px;
	height: 25px;
	background-image: url(../images/common/icon-exclamation.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 25px auto;
}
.block-post-content .pattern-attention .wp-block-group__inner-container {
	flex: 1;
}
.block-post-content .pattern-attention .wp-block-group__inner-container .title {
	font-weight: 600;
	font-size: 16px;
	line-height: 140%;
	color: #BB583A;
	margin-bottom: 8px;
}
.block-post-content .pattern-attention .wp-block-group__inner-container .lead {
	font-weight: 400;
	font-size: 12px;
	line-height: 160%;
}

/*============================================================
 概要
*============================================================*/
.block-post-content .pattern-box-summary {
	gap: 24px;
}
.block-post-content .pattern-box-summary .title {
	width: 100%;
	font-weight: 400;
	font-size: 24px;
	line-height: normal;
	color: #B79069;
	padding-bottom: 12px;
	border-bottom: solid 1px #B79069;
	margin-bottom: 0;
}

/*============================================================
 ボタンリスト
*============================================================*/
.block-post-content .pattern-btn-list {
    margin: 0;
    gap: 24px;
}
.block-post-content .pattern-btn-list .wp-block-button__link {
    display: block;
    box-sizing: border-box;
    width: fit-content;
    min-width: 240px;
    height: auto;
    min-height: 54px;
    padding: 8px 24px;
    align-content: center;
    background-color: transparent;
    border: solid 1px var(--common-color-main);
    border-radius: 0;
    margin: 0;
    font-weight: 600;
    font-size: var(--rem18px);
    line-height: 20px;
    color: var(--common-color-main);
    text-align: center;
    transition: background-color 0.3s;
	text-decoration: unset;
	position: relative;
}
.block-post-content .pattern-btn-list .wp-block-button__link:hover {
    background-color: #CBBBA9;
    color: #fff;
}
.block-post-content .pattern-btn-list .wp-block-button__link::before {
    position: absolute;
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
	background-image: url(../images/common/icon-link-arrow.svg);
    background-repeat: no-repeat;
    top: 50%;
	right: 16px;
    transform: translatey(-50%);
}
.block-post-content .pattern-btn-list .wp-block-button__link:hover::before {
	background-image: url(../images/common/icon-link-arrow-white.svg);
}

/*============================================================
 定義リスト
*============================================================*/
.block-post-content .pattern-dl * {
	border: unset;
}
.block-post-content .pattern-dl tr {
	border-bottom: solid 1px #D8C6B5;
}
.block-post-content .pattern-dl td {
	padding: 24px 0 16px 0;
	font-weight: 500;
	font-size: 14px;
	line-height: 200%;
	color: #908F8E;
}
.block-post-content .pattern-dl td:first-of-type {
	width: 20%;
	color: #908F8E;
}