@charset "utf-8";

/* 共通のCSS======================================================= */

/* h3のデザインを変更する
----------------------------*/

h3 {
    padding: 1rem;
    margin-bottom: 0.5rem;
    border-radius: 0.5rem;
    background-color: #e6d9cf;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
	line-height: 2.5; /* 数値のみの指定がおすすめ（フォントサイズの2.5倍） */
}

/* 行間を詰めるクラス 
---------------------------*/
.tight-line {
    line-height: 1.3; /* 数値のみの指定がおすすめ（フォントサイズの1.3倍） */
}

/* 文字サイズを大きくするクラス 
-----------------------------------*/
.text-bigger12 {
    font-size: 1.2rem; /* 元のサイズの1.2倍 */
}

/* 文字の色を変え、太字にするクラス 
----------------------------------------*/
.text-red {
  color: red; /* 色の指定 */
  font-weight: bold; /* 太字 */
}

/* 共通のCSS　ここまで　=========================================== */


/* =============================================================================
   以下、Builder で選択したパーツのCSS（自動連結）
   ========================================================================== */

/* ---- 横長レイアウト（list-yoko3-border） (list-yoko3-border) ------------- */
/*list-yoko3-border-parts（カラムブロック）
------------------------------------------------------------------------------*/
.list-yoko3-border-parts * {margin: 0;padding: 0;}

/*ボックス全体を囲むブロック*/
.list-yoko3-border-parts {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;		/*ボックス同士の間に空けるスペース。2文字分。*/
}

/*ボックス１個あたり*/
.list-yoko3-border-parts .list-parts {
	display: flex;
	align-items: top;
	gap: 1rem;	/*画像とテキストブロックの間に空けるスペース。0.5文字分。*/
	border: 1px solid #cccccc;	/*枠線の幅、線種、色の指定*/
	padding: 1rem;	/*ボックス内の余白。1文字分。*/
}
/*bg1-light-parts上の線色*/
.bg1-light-parts .list-yoko3-border-parts .list-parts {
	border-color: #cccccc;
}
/*bg1-parts上の線色*/
.bg1-parts .list-yoko3-border-parts .list-parts {
	border-color: #cccccc;
}
/*bg1-primary-parts上の線色*/
.bg1-primary-parts .list-yoko3-border-parts .list-parts {
	border-color: #cccccc;
}
/*bg1-accent-parts上の線色*/
.bg1-accent-parts .list-yoko3-border-parts .list-parts {
	border-color: #cccccc;
}

/*左右逆向き用スタイル*/
.list-yoko3-border-parts .list-parts.reverse {
	flex-direction: row-reverse;
}

/*画像の幅*/
.list-yoko3-border-parts .list-parts figure {
	width: 40%;
}

/*テキストを囲むブロック*/
.list-yoko3-border-parts .list-parts .text-parts {
	flex: 1;
}

/*段落（p）*/
.list-yoko3-border-parts .list-parts .text-parts p {
	font-size: 0.9rem;	/*文字サイズ90%*/
	line-height: 1.5;	/*行間を少し狭く*/
}
.list-yoko3-border-parts .list-parts .text-parts p + p {
	margin-top: 0.5rem;
}