/* ========================================
 回収品目ページ - 全体スタイル
 ======================================== */
.items-page-wrapper {
background: #fafafa;
min-height: 100vh;
}

/* ========================================
 カテゴリーナビゲーション
 ======================================== */
.items-navigation {
background: linear-gradient(135deg, #e6ffda 0%, #b2db9b 100%);
padding: 40px 20px;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
position: relative;
z-index: 100;
}

.items-navigation-container {
max-width: 1200px;
margin: 0 auto;
}

.items-navigation-list {
display: flex;
flex-wrap: wrap;
gap: 15px;
justify-content: center;
list-style: none;
padding: 0;
margin: 0;
}

.items-navigation-item {
margin: 0;
}

.items-navigation-link {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
padding: 15px 20px;
background: #fff;
border: 2px solid #f0f0f0;
border-radius: 12px;
color: #333;
text-decoration: none;
font-size: 0.9rem;
font-weight: 600;
transition: all 0.3s ease;
min-width: 100px;
box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.items-navigation-link:hover {
background: #fff;
border-color: #ff9800;
color: #ff9800;
transform: translateY(-3px);
box-shadow: 0 6px 12px rgba(255, 152, 0, 0.2);
}

.items-navigation-icon {
width: 42px;
height: 47px;
object-fit: contain;
}

/* ========================================
 コンテンツエリア
 ======================================== */
.items-content-wrapper {
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px 80px;
}

/* ========================================
 カテゴリーセクション
 ======================================== */
.items-category-section {
margin-bottom: 50px;
background: #fff;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0,0,0,0.08);
scroll-margin-top: 120px;
}

.items-category-header {
background: linear-gradient(135deg, #9aed6b 0%, #70be44 100%);
padding: 20px 30px;
text-align: center;
}

.items-category-title {
font-size: 1.8rem;
font-weight: 700;
color: #fff;
margin: 0;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.items-category-body {
padding: 40px 30px;
}

/* ========================================
 画像 + テキストエリア
 ======================================== */
.items-intro-section {
display: flex;
gap: 30px;
align-items: flex-start;
margin-bottom: 40px;
}

.items-intro-image {
flex: 0 0 45%;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.items-intro-image img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}

.items-intro-text {
flex: 1;
}

.items-intro-title {
font-size: 1.4rem;
font-weight: 700;
color: #32c417;
margin: 0 0 20px 0;
line-height: 1.6;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

.items-intro-description {
font-size: 0.95rem;
line-height: 1.9;
color: #555;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

/* ========================================
 品目テーブル
 ======================================== */
.items-table {
width: 100%;
border-collapse: separate;
border-spacing: 0;
border: 2px solid #f0f0f0;
border-radius: 8px;
overflow: hidden;
}

.items-table tr {
border-bottom: 1px solid #f0f0f0;
}

.items-table tr:last-child {
border-bottom: none;
}

.items-table-header {
background: linear-gradient(135deg, #f6fff1 0%, #ebffe0 100%);
padding: 20px 25px;
vertical-align: middle;
width: 25%;
border-right: 2px solid #f0f0f0;
}

.items-table-header-content {
display: flex;
align-items: center;
gap: 15px;
}

.items-table-icon {
width: 60px;
height: 60px;
object-fit: contain;
flex-shrink: 0;
}

.items-table-label {
font-size: 1.1rem;
font-weight: 700;
color: #333;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

.items-table-cell {
padding: 20px 25px;
font-size: 0.95rem;
line-height: 1.9;
color: #555;
background: #fff;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

/* ========================================
 注意書きセクション
 ======================================== */
.items-notice-section {
background: linear-gradient(135deg, #fff9e6 0%, #ffe4a3 100%);
padding: 60px 20px;
margin-top: 80px;
}

.items-notice-container {
max-width: 1200px;
margin: 0 auto;
}

.items-notice-heading {
text-align: center;
margin-bottom: 30px;
}

.items-notice-heading-top {
display: block;
font-size: 1.2rem;
color: #666;
margin-bottom: 15px;
font-weight: 600;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

.items-notice-heading-main {
display: block;
font-size: 1.8rem;
font-weight: 700;
color: #ff9800;
padding: 0 40px;
position: relative;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

.items-notice-heading-main::before,
.items-notice-heading-main::after {
content: '';
position: absolute;
top: 50%;
width: 30px;
height: 3px;
background: #ff9800;
}

.items-notice-heading-main::before {
left: 0;
}

.items-notice-heading-main::after {
right: 0;
}

.items-notice-box {
background: #fff;
padding: 30px;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
font-size: 0.9rem;
line-height: 1.9;
color: #555;
font-family: 'Hiragino Sans', 'Yu Gothic', sans-serif;
}

/* ========================================
 レスポンシブ
 ======================================== */
@media (max-width: 768px) {
.items-navigation {
padding: 30px 15px;
position: relative;
}

.items-navigation-list {
gap: 10px;
}

.items-navigation-link {
padding: 12px 15px;
font-size: 0.85rem;
min-width: 80px;
min-height: 44px;
}

.items-navigation-icon {
width: 35px;
height: 40px;
}

.items-content-wrapper {
padding: 40px 15px 60px;
}

.items-category-section {
margin-bottom: 40px;
scroll-margin-top: 100px;
}

.items-category-header {
padding: 15px 20px;
}

.items-category-title {
font-size: 1.4rem;
}

.items-category-body {
padding: 30px 20px;
}

.items-intro-section {
flex-direction: column;
gap: 20px;
}

.items-intro-image {
flex: 0 0 auto;
width: 100%;
}

.items-intro-title {
font-size: 1.2rem;
margin-bottom: 15px;
}

.items-intro-description {
font-size: 0.9rem;
}

.items-table-header {
padding: 15px;
width: 30%;
}

.items-table-header-content {
flex-direction: column;
gap: 8px;
text-align: center;
}

.items-table-icon {
width: 50px;
height: 50px;
}

.items-table-label {
font-size: 0.95rem;
}

.items-table-cell {
padding: 15px;
font-size: 0.85rem;
}

.items-notice-section {
padding: 40px 15px;
margin-top: 60px;
}

.items-notice-heading-top {
font-size: 1.1rem;
}

.items-notice-heading-main {
font-size: 1.4rem;
padding: 0 30px;
}

.items-notice-heading-main::before,
.items-notice-heading-main::after {
width: 20px;
}

.items-notice-box {
padding: 20px;
font-size: 0.85rem;
}
}

@media (max-width: 640px) {
.items-navigation {
padding: 25px 12px;
}

.items-navigation-list {
gap: 8px;
}

.items-navigation-link {
padding: 10px 12px;
font-size: 0.8rem;
min-width: 75px;
min-height: 44px;
gap: 6px;
border-radius: 10px;
}

.items-navigation-icon {
width: 30px;
height: 35px;
}

.items-content-wrapper {
padding: 30px 12px 50px;
}

.items-category-section {
margin-bottom: 30px;
border-radius: 10px;
}

.items-category-header {
padding: 14px 16px;
}

.items-category-title {
font-size: 1.25rem;
}

.items-category-body {
padding: 25px 16px;
}

.items-intro-section {
gap: 16px;
margin-bottom: 30px;
}

.items-intro-title {
font-size: 1.1rem;
margin-bottom: 12px;
}

.items-intro-description {
font-size: 0.88rem;
line-height: 1.85;
}

.items-table-header {
padding: 12px;
width: 28%;
}

.items-table-icon {
width: 42px;
height: 42px;
}

.items-table-label {
font-size: 0.88rem;
}

.items-table-cell {
padding: 12px;
font-size: 0.82rem;
line-height: 1.8;
}

.items-notice-section {
padding: 35px 12px;
margin-top: 50px;
}

.items-notice-heading {
margin-bottom: 22px;
}

.items-notice-heading-top {
font-size: 1rem;
margin-bottom: 12px;
}

.items-notice-heading-main {
font-size: 1.25rem;
padding: 0 25px;
}

.items-notice-heading-main::before,
.items-notice-heading-main::after {
width: 18px;
height: 2px;
}

.items-notice-box {
padding: 18px;
font-size: 0.82rem;
border-radius: 10px;
}
}

@media (max-width: 480px) {
.items-navigation-link {
padding: 10px 12px;
font-size: 0.8rem;
min-width: 70px;
}

.items-category-body {
padding: 25px 15px;
}

.items-table-header {
padding: 12px;
}

.items-table-icon {
width: 40px;
height: 40px;
}

.items-table-label {
font-size: 0.9rem;
}

.items-table-cell {
padding: 12px;
font-size: 0.8rem;
}

.items-notice-heading-main {
font-size: 1.2rem;
padding: 0 25px;
}
}

@media (max-width: 375px) {
.items-navigation {
padding: 18px 8px;
}

.items-navigation-list {
gap: 6px;
}

.items-navigation-link {
padding: 8px 10px;
font-size: 0.75rem;
min-width: 62px;
min-height: 44px;
gap: 5px;
border-radius: 8px;
border-width: 1px;
}

.items-navigation-icon {
width: 26px;
height: 30px;
}

.items-content-wrapper {
padding: 22px 8px 40px;
}

.items-category-section {
margin-bottom: 22px;
border-radius: 8px;
scroll-margin-top: 80px;
}

.items-category-header {
padding: 12px 12px;
}

.items-category-title {
font-size: 1.1rem;
}

.items-category-body {
padding: 18px 12px;
}

.items-intro-section {
gap: 14px;
margin-bottom: 22px;
}

.items-intro-title {
font-size: 1rem;
margin-bottom: 10px;
line-height: 1.5;
}

.items-intro-description {
font-size: 0.82rem;
line-height: 1.8;
}

/* テーブルをブロック表示に切り替え */
.items-table,
.items-table tbody,
.items-table tr,
.items-table-header,
.items-table-cell {
display: block;
width: 100%;
}

.items-table tr {
margin-bottom: 12px;
border: 1px solid #f0f0f0;
border-radius: 8px;
overflow: hidden;
}

.items-table-header {
border-right: none;
border-bottom: 1px solid #f0f0f0;
padding: 10px;
}

.items-table-header-content {
flex-direction: row;
gap: 10px;
text-align: left;
}

.items-table-icon {
width: 32px;
height: 32px;
}

.items-table-label {
font-size: 0.85rem;
}

.items-table-cell {
padding: 10px;
font-size: 0.78rem;
line-height: 1.75;
}

.items-notice-section {
padding: 25px 8px;
margin-top: 35px;
}

.items-notice-heading {
margin-bottom: 18px;
}

.items-notice-heading-top {
font-size: 0.9rem;
margin-bottom: 10px;
}

.items-notice-heading-main {
font-size: 1.05rem;
padding: 0 20px;
}

.items-notice-heading-main::before,
.items-notice-heading-main::after {
width: 15px;
height: 2px;
}

.items-notice-box {
padding: 14px;
font-size: 0.78rem;
line-height: 1.8;
border-radius: 8px;
}
}
