/*お知らせブロック
---------------------------------------------------------------------------*/
/*記事の下に空ける余白*/
.new dd {
	padding-bottom: 1rem;
}

/*ブロック内のspan。日付の横のアイコン的な部分の共通設定*/
.new dt span {
	display: inline-block;
	text-align: center;
	line-height: 1.8;		/*行間（アイコンの高さ）*/
	border-radius: 2px;		/*角を丸くする指定*/
	padding: 0 1rem;		/*上下、左右へのブロック内の余白*/
	width: 8rem;			/*幅。8文字分。*/
	transform: scale(0.85);	/*85%のサイズに縮小*/
	border: 1px solid #777;	/*枠線の幅、線種、色*/
}

/*icon-bg1。サンプルテンプレートでは「重要」と書いてあるマーク*/
.new .icon-bg1 {
	border-color: transparent;	/*枠線を透明に*/
	background: #cd0000;		/*背景色*/
	color: #fff;				/*文字色*/
}

/*icon-bg2。サンプルテンプレートでは「サービス」と書いてあるマーク*/
.new .icon-bg2 {
	border-color: transparent;				/*枠線を透明に*/
	background: var(--primary-color);		/*背景色。冒頭のprimary-colorを読み込みます。*/
	color: var(--primary-inverse-color);	/*文字色。冒頭のprimary-inverse-colorを読み込みます。*/
}

	/*画面幅700px以上の追加指定*/
	@media screen and (min-width:700px) {

	/*ブロック全体*/
	.new {
		display: grid;	/*gridを使う指定*/
		grid-template-columns: auto 1fr;	/*横並びの指定。日付とアイコン部分の幅は自動で、内容が入るブロックは残り幅一杯とる。*/
	}

	}/*追加指定ここまで*/