@charset "utf-8";

/*
#koujilist_kouji {
	margin: 0; padding: 0; width: 580px; font-size: small; line-height: 110%; overflow: hidden;
}
#koujilist_kouji ul {
	margin: 0; padding: 0;
}
#koujilist_kouji li {
	margin: 0; padding: 0;
	list-style-type: none;
}
#koujilist_kouji h3 {
	margin: 0 0 10px;
}
#koujilist_kouji {
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 8px;
	padding-left: 0px;
}
#koujilist_kouji .head {
	line-height: 1.4; margin-top: 0;
}
#koujilist_kouji a {
	font-weight: normal;
	color: #1D3994;
}
#koujilist_kouji a:link {
	text-decoration: none;
}
#koujilist_kouji a:visited {
	text-decoration: none;
}
#koujilist_kouji a:hover {
	text-decoration: underline;
	color: #810081;
}
#koujilist_kouji a:active {
	text-decoration: none;
}
#koujilist_kouji a img {
	border: none;
}
#koujilist_kouji #new-cover {
	background: url(../img/new-back.gif) repeat-y;
	padding: 5px 0; width: 580px; overflow: hidden;
}
#koujilist_kouji #new-tb {
	width: 580px; font-size: 11px;
}
#koujilist_kouji #new-tb td {
	vertical-align: top; width: 170px;
}
#koujilist_kouji dl, dt, dd {
	margin: 0; padding: 0;
}
#koujilist_kouji dl {
	margin-bottom: 18px;
}
#koujilist_kouji dt {
	margin-bottom: 5px;
}
#koujilist_kouji dt img {
	background: #FFF; border: 1px solid #CCC; padding: 4px;
}
#koujilist_kouji dd.time {
	margin-bottom: 10px;
}
#koujilist_kouji .td1 {
	padding: 0 11px 0px 13px;
}
#koujilist_kouji .td2 {
	padding: 0 11px 0;
}
#koujilist_kouji .td3 {
	padding: 0 13px 0px 11px;
}
#koujilist_kouji h4 {
	margin: 0 0 12px; padding-left: 26px; color: #3B526E;
	background: url(../img/title.jpg) no-repeat; line-height: 24px;
}
#koujilist_kouji .price {
	color: #E105BC; font-size: 1.1em; font-weight: bold;
}
*/

/* ----- カテゴリー別 ----- */
/*
#koujilist_kouji h2 {
	margin: 0 0 12px; padding-left: 26px; color: #3B526E;
	background: url(../img/title2.jpg) no-repeat; line-height: 24px;
	width: 580px; font-size: 1em;
}
#koujilist_kouji #new-cover ul li {
	float: left;
	padding: 5px 11px 0 12px;
	width:170px;
  height: 240px;
}
#koujilist_kouji #new-cover dl {
	width: 170px; font-size: 11px;
}
#koujilist_kouji #new-cover dl img {
	width: 160px; height: 160px; object-fit: cover;
}
*/

.koujilist {

}
.koujilist .head {
    margin-bottom: 10px;
}
.koujilist h2 {
    font-size: .9rem;
    letter-spacing: 0;
}
.koujilist h2,
.koujilist h4 {
    background-color: #ededed;
    border-left: 8px solid #10b7ed;
    border-radius: 4px 0 0 4px;
    padding: 0.4rem 0.6rem;
    margin-bottom: 0.5rem;
}
.koujilist #new-tb,
.koujilist #new-cover {
    margin-bottom: 5px;
    width: 100%;
}
.koujilist ul,
.koujilist tr {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.koujilist ul::after {
    content: '';
    display: block;
    width: 32%;
}
.koujilist li {
    flex-basis: 32%;
}
.koujilist tr::after {
    content: '';
    display: block;
    width: 23%;
}
.koujilist .td1,
.koujilist .td2,
.koujilist .td3,
.koujilist .td4 {
    flex-basis: 23%;
}

.koujilist dl {
    background-color: #f7f7f7;
    border: 1px solid #e1e1e1;
    box-sizing: border-box;
    padding: .6rem .45rem .45rem;
    margin-bottom: 14px;
}

.koujilist dt {
    margin: auto;
    width: 90%;
}
.koujilist dt img {
    max-width: 100% !important;
}
.koujilist dd {
    font-size: .75rem;
    line-height: 1.5;
}
.koujilist dt a {
    display: block;
    margin-bottom: 8px;
}
.koujilist dt a:hover {
    cursor: pointer;
    opacity: .8;
}

/* ----- カテゴリー別 ----- */

/* スマホ用 */
@media screen and (max-width: 560px) {
/*
	#koujilist_kouji, #koujilist_kouji ul, #koujilist_kouji li, #koujilist_kouji dl, #koujilist_kouji dt, #koujilist_kouji dd, #koujilist_kouji p, #koujilist_kouji a, #koujilist_kouji img, #koujilist_kouji h2, #koujilist_kouji .head, #new-cover {
	  margin: 0 !important;
	  padding: 0 !important;
	  background-image: none !important;
	  background: none !important;
	  border: none !important;
	}

	#koujilist_kouji {
	  width: 100% !important;
	}

	#koujilist_kouji .head {
	  padding: 10px !important;
	}

	#koujilist_kouji h2 {
	  width: 100% !important;
	  font-size: 1.25rem !important;
	  font-weight: bold !important;
	  text-align: center !important;
	  color: #333333 !important;
	  background-color: #eeeeee !important;
	  padding: 10px 0 !important;
	  margin: 30px 0 20px !important;
	}

	#koujilist_kouji #new-cover{
	    width: 100% !important;
	}

	#koujilist_kouji #new-cover ul{
	  width: 98% !important;
	}

	#koujilist_kouji #new-cover li{
	  width: 47% !important;
	  padding-left: 3% !important;
	  height: 63vw !important;
	}

	#koujilist_kouji #new-cover li dl{
	  width: 100% !important;
	}

	#koujilist_kouji #new-cover li img{
	  width: 100% !important;
	  object-fit: cover !important;
	}
	#koujilist_kouji .td1,
	#koujilist_kouji .td2,
	#koujilist_kouji .td3,
	#koujilist_kouji .td4 {
    padding: 0 3% 0 0;
	}
*/

.koujilist #new-tb,
.koujilist #new-cover {
    margin-left: auto!important;
    margin-right: auto!important;
    margin-bottom: 0;
}
.koujilist #new-tb {
    width: 98% !important;
}
.koujilist dl {
    padding: 8px 3px 4px;
    height: 8.7rem;
    margin-bottom: 10px;
}
.koujilist dd {
    font-size: .65rem;
    line-height: 1.3;
}
.koujilist dt a {
    margin-bottom: 4px;
}
.koujilist h4 {
    font-size: 3vw;
    padding: 0.2rem 0.4rem;
}
.koujilist #new-tb td img {
    width: 100% !important;
}
.colum-1 .koujilist td {
    flex-basis: 32%;
}
.colum-1 .koujilist td {
    flex-basis: 32%;
}
    
.koujilist .td1,
.koujilist .td2,
.koujilist .td3,
.koujilist .td4 {
    flex-basis: 32%;
}
    
}