@charset "UTF-8";
/********************************************************************
	top
********************************************************************/
#sobaside251225 #top{
	background-image:
	url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__bg.jpg");
	background-repeat: no-repeat;
}

#sobaside251225 #top .top__wrap{
	margin: 0 auto;
	width: 550px;
}

/*カウントbox*/
#sobaside251225 #top .top__count-box{
	padding: 20px 20px 20px 20px;
	border: solid 5px #d2ae56;
	background: #fff;
	background-image:
	url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__countbox-bg--top-left.png"),      /* 左上 */
	url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__countbox-bg--top-right.png"),     /* 右上 */
	url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__countbox-bg--bottom-right.png"),  /* 右下 */
	url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__countbox-bg--bottom-left.png");   /* 左下 */
	background-position:
	left top,
	right 7% top 10%,
	right bottom 10%,
	left 5% bottom 30%;
	background-repeat: no-repeat;
	border-radius: 20px;
}

#sobaside251225 #top .top__count-box .top__count-box--bg-orange,
#sobaside251225 #top .top__count-box .top__count-box--bg-lightblue{
	padding: 5px 5px 0px 5px;
	font-size: 4rem;
	color: #fff;
	border-radius: 5px;
}

#sobaside251225 #top .top__count-box .top__count-box--bg-orange{
	background: #ea5505;
}

#sobaside251225 #top .top__count-box .top__count-box--bg-lightblue{
	background: #2fb4bb;
}

/********************************************************************
	書影共通
********************************************************************/
/*背景色*/
#sobaside251225 #toshikoshi-soba{background: #ea5505;}
#sobaside251225 #wanko-soba{background: #2fb4bb;}

/*セクション共通*/
#sobaside251225 #toshikoshi-soba,
#sobaside251225 #wanko-soba{
	padding: 20px 0 40px 0;	
}

#sobaside251225 .contents__wrap{
	margin: 0 auto;
	width: 700px;
}

#sobaside251225 .contents__box{
	padding: 30px 30px 30px 30px;
	background: #fbf7ee;
	border-radius: 20px;
	column-gap: 2%;
	row-gap: 30px;
}

#sobaside251225 .contents__box li{
	box-sizing: border-box;
	flex: 0 0 calc((100% - 2% * 3) / 4);
	/* flex: 0 0 calc(...) の意味
	- 最初の 0 → flex-grow: 0（余白があっても広がらない）
	- 次の 0 → flex-shrink: 0（狭くなっても縮まらない）
	- calc(...) → flex-basis（アイテムの基本幅を指定）
	→ 「伸びない・縮まない・この幅で固定」という設定
	*/
}

/********************************************************************
	bottom
********************************************************************/
#sobaside251225 #bottom{
	padding: 60px 0 60px 0;
	margin: 0 auto;
	width: 770px;
	background:  url("/auto/images/fix/feature/251225_sobaside/pcc/campaign__bg.jpg");
	background-repeat: no-repeat;
}