@charset "utf-8";

#main-wrap {
	width: 600px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.books-section-title {
	width: 100%;
	background-color: #BBCDB9;
	color: #262626;
	padding: 6px 0px;
	text-align: center;
	/* 隠れてしまった分を戻し、微調整します */
	margin-top: 18px; 
	margin-bottom: 12px;
	box-sizing: border-box;
}

.new {
	color: #D92B2B;
	font-size: 105%;
	font-weight: bold;
}

.books-card-container {
	display: flex;
	flex-direction: column;
	gap: 15px;
	box-sizing: border-box;
}

.book-card {
	display: flex;
	align-items: flex-start;
	background-color: #FFFFFF;
	border: solid 2px #BBCDB9;
	padding: 15px 15px 10px 15px;
	box-sizing: border-box;
}

.book-thumb {
	width: 160px;
	flex-shrink: 0;
	text-align: center;
	padding-right: 15px;
	box-sizing: border-box;
}

.book-thumb img {
	width: 120px;
	max-width: 100%;
	border: 1px solid #C7C7C7;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    margin: 0 auto;
}

.book-info {
	flex-grow: 1;
	line-height: 1.6;
	box-sizing: border-box;
}

.book-info a {
	font-weight: bold;
	font-size: 105%;
	color: #006a80;
}

.book-info p {
	margin: 0 0 8px 0;
}

@media (max-width: 768px) {
  #main-wrap {
    width: 100% !important;
    margin-top: 0 !important;
  }

  .books-section-title {
    width: 100% !important;
  }

  .book-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 15px 10px;
  }

  .book-thumb {
    width: 100%;
    padding-right: 0;
    margin-bottom: 12px;
  }

  .book-info {
    width: 100%;
    text-align: center;
  }
}