/* CSS Document */

#wrapper-fla{
	width:900px;
}

#product-list{
	width:860px;
	background:url(../../img/bg_commodity.gif) repeat-y;
	padding:0px 20px 0px 20px;
	margin:0px;
}

#product-list li{
	list-style-type:none;
}

#item-area1{
	display: block;
	float: left;
	width: 130px;
	margin: 0 0 5px 0;
	padding: 0px;
	line-height: 100%;
}
#item-area1 ul{
	list-style-type: none;
}

#item-area1 li{
	margin: 0px;
	width: 120px;
	height:20px;
	padding: 0px;
	display:block;
	float: left;
	line-height: 17px;
}

#item-area1 li a{
	display:block;
	height:20px;
	width: 121px;
	margin: 0px;
	color: #39C6FF;
	
}

#item-area2{
	display: block;
	float: left;
	width: 120px;
	margin: 0 0 5px 0;
	padding: 0px;
	line-height: 100%;
}
#item-area2 ul{
	list-style-type: none;
}

#item-area2 li{
	margin: 0px;
	width: 110px;
	height:20px;
	padding: 0px;
	display:block;
	float: left;
	line-height: 17px;
}

#item-area2 li a{
	display:block;
	height:20px;
	width: 110px;
	margin: 0px;
	color: #39C6FF;
	
}
#item-area3{
	display: block;
	float: left;
	width: 110px;
	margin: 0 0 5px 0;
	padding: 0px;
	line-height: 100%;
}
#item-area3 ul{
	list-style-type: none;
}

#item-area3 li{
	margin: 0px;
	width: 100px;
	height:20px;
	padding: 0px;
	display:block;
	float: left;
	line-height: 17px;
}

#item-area3 li a{
	display:block;
	height:20px;
	width: 100px;
	margin: 0px;
	color: #39C6FF;
	
}
#item-area4{
	display: block;
	float: left;
	width: 260px;
	margin: 0 0 5px 0;
	padding: 0px;
	line-height: 100%;
}
#item-area4 ul{
	list-style-type: none;
}

#item-area4 li{
	margin: 0px;
	width: 260px;
	height:20px;
	padding: 0px;
	display:block;
	float: left;
	line-height: 17px;
}

#item-area4 li a{
	display: block;
	height:20px;
	width: 150px;
	margin: 0px;
	color: #39C6FF;
	
}

#item-area5{
	display: block;
	float: left;
	width: 150px;
	margin: 0 0 5px 0;
	padding: 0px;
	line-height: 100%;
}
#item-area5 ul{
	list-style-type: none;
}

#item-area5 li{
	margin: 0px;
	width: 140px;
	height: 20px;
	padding: 0px;
	display: block;
	float: left;
	line-height: 17px;
}

#item-area5 li a{
	display: block;
	height:20px;
	width: 140px;
	margin: 0px;
	color: #39C6FF;
	
}

.item01{background: url(../../img/list_com01.gif) no-repeat;}
.item02{background: url(../../img/list_com02.gif) no-repeat;}
.item03{background: url(../../img/list_com03.gif) no-repeat;}
.item04{background: url(../../img/list_com04.gif) no-repeat;}
.item05{background: url(../../img/list_com05.gif) no-repeat;}
.item06{background: url(../../img/list_com06.gif) no-repeat;}
.item07{background: url(../../img/list_com07.gif) no-repeat;}
.item08{background: url(../../img/list_com08.gif) no-repeat;}
.item09{background: url(../../img/list_com09.gif) no-repeat;}
.item10{background: url(../../img/list_com10.gif) no-repeat;}
.item11{background: url(../../img/list_com11.gif) no-repeat;}
.item12{background: url(../../img/list_com12.gif) no-repeat;}
.item13{background: url(../../img/list_com13.gif) no-repeat;}
.item14{background: url(../../img/list_com14.gif) no-repeat;}
.item15{background: url(../../img/list_com15.gif) no-repeat;}
.item16{background: url(../../img/list_com16.gif) no-repeat;}
.item17{background: url(../../img/list_com17.gif) no-repeat;}
.item18{background: url(../../img/list_com18.gif) no-repeat;}
.item19{background: url(../../img/list_com19.gif) no-repeat;}
.item20{background: url(../../img/list_com20.gif) no-repeat;}
.item21{background: url(../../img/list_com21.gif) no-repeat;}
.item22{background: url(../../img/list_com22.gif) no-repeat;}
.item23{background: url(../../img/list_com23.gif) no-repeat;}
.item24{background: url(../../img/list_com24.gif) no-repeat;}
.item25{background: url(../../img/list_com25.gif) no-repeat;}


/* 全体のスタイル */
.news-area {
	background-color: #f9f9f9;
	padding: 32px;
	border-radius: 8px;
	box-shadow: 0 0px 4px rgba(0, 0, 0, 0.2);
  }
  
  .news-area h2 {
	color: #333;
	border-bottom: 2px solid #0078d4;
	padding-bottom: 4px;
	margin-bottom: 16px;
  }
  
  .news-area__con {
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-height: 320px;
	overflow: auto;
  }
  
  .news-area__con dl {
	display: flex;
	flex-direction: column;
	margin: 0px;
	gap: 8px;
  }
  
  .news-area__con dt {
	color: #666;
  }
  
  .news-area__con dd,
  .news-area__con dd h3{
	margin: 0;
  }
  
  .news-area__con dd h3 a {
	text-decoration: none;
	color: #0078d4;
	transition: color 0.3s ease;
  }
  
  .news-area__con dd h3 a:hover {
	color: #005bb5;
	text-decoration: underline;
  }
/* 各お知らせの項目に余白と色を追加 */
	.news-area__con dl {
	padding: 16px;
	border-left: 4px solid #0078d4;
	background-color: #fff;
	transition: background-color 0.3s ease;
  }