@charset "utf-8";
/*
* css for product index page
*
* @version			0.0.0
* @lastmodified 2014-11-15
* @link					https://www.landcomp.co.jp/
* @copyright		Copyright 2005, LAND COMPUTER Co.,Ltd.All rights reserved.
*------------------------------------------------------------------------- */

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

div.section h2 {
	font-size: 1.5rem;
} 
div.section h3 {
	font-size: 1.25rem;
} 
div.section h4 {
	font-size: 1.125rem;
} 
section + section {
	margin: 3rem 0 0;
}

/* 2024-11-15 */
div.section ul.modbox_product {
	list-style: none;
	margin-left: -1rem;
	padding: 0;
}
ul.modbox_product li {
	padding: 0 0 0 1rem;
	border: none;
}
ul.modbox_product li div.innerbox {
	border: 1px solid #369;
}
ul.modbox_product li div.body {
	padding: 0.75rem 0.75rem;
	background-color: #fff;
}

ul.modbox_product li div.publish {
	float: right;
	color: crimson;
	font-weight: bold;
	margin: -0.125rem -0.125rem 0 0;
	padding: 0.125rem 0.5rem 0;
	border: 1px solid crimson;
}
ul.modbox_product li div.title {
	margin-top: 0.5rem;
}
ul.modbox_product li div.visual {
	margin: 1.5rem 0 0.5rem;
}
ul.modbox_product li div.innerbox {
	__border: 1px solid red;
}
ul.modbox_product li div.model {
	font-size: 1.25rem;
	font-weight: bold;
	padding: 0;
}
ul.modbox_product li div.visual img {
  height: auto;
  width: auto;
  max-width: 100%;
}
ul.modbox_product li div.visual img:hover {
	opacity: 0.75;
}
ul.modbox_product li div.summary {
	padding: 0.75rem 0.75rem;
	background-color: #dfe9ff;
}
ul.modbox_product.lnet li div.summary {
	background-color: #dfe9ff;
}
ul.modbox_product.lnut li div.summary {
  background-color: #C4D4C3;
	background-color: #DBE5DB;
}
ul.modbox_product.ppdv li div.summary {
	background-color: #F2EBE6;
}
ul.modbox_product li div.summary p {
	margin: 0;
}
@media all and (min-width: 640px) {
	div.section ul.modbox_product {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 1rem 0;
		text-align: center;
	}
	ul.modbox_product li {
		__flex: 0 0 calc(50% - 0.5rem);
		flex: 0 0 50%;
		text-align: left;
	}
}
@media all and (min-width: 768px) {
	ul.modbox_product li {
		flex: 0 0 33.33%;
		text-align: left;
	}
}