/* 양육정보 사용자 페이지 스타일 */
.parenting-info-container {max-width: 1440px;margin: 0 auto;padding: 0px;}
.parenting-info-header {text-align: left;margin-bottom: 40px;padding-bottom: 20px;}
.parenting-info-header h1 {font-size: 24px;font-weight: 600;color: #333;margin-bottom: 12px;line-height: 1.4;}
.parenting-info-header .subtitle {font-size: 18px;color: #333;margin: 0 0 8px 0;font-weight: 500;}
.parenting-info-header .description {font-size: 14px;color: #666;margin: 0;}

/* 카테고리 탭 */
.category-tabs {margin-bottom: 30px;}
.tab-group {display: flex;flex-wrap: wrap;gap: 10px;justify-content: center;}
.category-tab {display: inline-block;padding: 12px 24px;background-color: #f5f5f5;color: #333;text-decoration: none;border-radius: 25px;font-size: 1.2em;font-weight: 500;transition: all 0.3s ease;border: 2px solid transparent;}
.category-tab:hover {background-color: #e0e0e0;text-decoration: none;}
.category-tab.active {background-color: #4a90e2;color: #fff;border-color: #4a90e2;}

/* 카테고리 그리드 */
.category-grid-container {margin-top: 30px;}
.category-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, max-content));gap: 30px;padding: 20px 0;justify-content: center; }
.category-item {text-align: center;}
.category-link {display: block;text-decoration: none;color: #333;transition: transform 0.2s ease;text-align: center;}
.category-link:hover {text-decoration: none;transform: translateY(-5px);}
.category-icon {width: 250px;height: 250px;margin: 0 auto 12px;border-radius: 50%;border: 1px solid #ccc;overflow: hidden;background-color: #ffffff;display: flex;align-items: center;justify-content: center;transition: transform 0.2s ease;}
.category-link:hover .category-icon {transform: scale(1.05);}
.category-icon img {width: 100%;height: 100%;object-fit: cover;}
.icon-placeholder {width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;font-size: 14px;font-weight: 500;color: #fff;background-color: #4a90e2;}
.category-title-box {position: relative;top: -20px;left: calc(50% - 100px);width: 200px;background-color: #ffd700;border-radius: 12px;padding: 10px 12px;min-height: 50px;display: flex;align-items: center;justify-content: center;}
.category-title {font-size: 1.2em;font-weight: 500;color: #333;line-height: 1.4;word-break: keep-all;text-align: center;}
.category-link:hover .category-title-box {background-color: #ffed4e;}
.empty-message {text-align: center;padding: 60px 20px;color: #999;font-size: 16px;}

/* 반응형 디자인 */
@media (max-width: 1024px) {
	.category-grid {grid-template-columns: repeat(auto-fit, minmax(250px, max-content));justify-content: center;}
}

@media (max-width: 768px) {
	.parenting-info-container {}
	.parenting-info-header h1 {font-size: 20px;}
	.parenting-info-header .subtitle {font-size: 16px;}
	.category-grid {grid-template-columns: repeat(auto-fit, minmax(200px, max-content));gap: 25px;justify-content: center;}
	.category-icon {width: 200px;height: 200px;}
	.category-title-box {position: relative;top: -20px;left: calc(50% - 100px);width: 200px;padding: 10px 12px;min-height: 50px;}
	.category-title {font-size: 1.1em;}
	.tab-group {gap: 8px;}
	.category-tab {padding: 10px 18px;font-size: 1.1em;}
}

@media (max-width: 480px) {
.category-grid {grid-template-columns: repeat(auto-fit, minmax(160px, max-content));gap: 10px;justify-content: center;}
.category-icon {width: 160px;height: 160px;margin-bottom: 12px;}
.category-title-box {position: relative;top: -20px;left: calc(50% - 75px);width: 150px;padding: 5px 10px;min-height: 50px;}
.category-title {font-size: 1.1em;}
.category-tab {padding: 8px 14px;font-size: 1.1em;}
}

/* 상세 페이지 스타일 */
.parenting-info-detail-container {max-width: 1440px;margin: 0 auto;padding: 0px;}
.detail-header {position: relative;margin-bottom: 40px;padding-bottom: 20px;}
.detail-header-center {text-align: center;width: 100%;}
.detail-header-right {position: absolute;top: 0;right: 0;}
.detail-category {display: inline-block;padding: 6px 16px;background-color: #ffa500;color: #fff;border-radius: 20px;font-size: 16px;font-weight: 500;margin-bottom: 15px;}
.detail-title {font-size: 36px;font-weight: 600;color: #333;margin: 0;line-height: 1.4;}
.back-to-list-btn-header {display: inline-block;padding: 7px 24px;background-color: #f5f5f5;color: #333;text-decoration: none;border-radius: 25px;font-size: 15px;font-weight: 500;border: 2px solid #e0e0e0;transition: all 0.3s ease;white-space: nowrap;}
.back-to-list-btn-header:hover {background-color: #e0e0e0;border-color: #ccc;text-decoration: none;}
.back-to-list-btn-header:focus {outline: 3px solid #4a90e2;outline-offset: 2px;}

/* 항목 바로가기 */
.detail-quick-nav {margin: 30px 0;}
.quick-nav-wrapper {background: url(../img/sub_top_wp.png) 0 0 repeat;padding: 10px;border-radius: 52px;}
.quick-nav-content {border-radius: 48px;padding: 40px;display: flex;gap: 30px;align-items: flex-start;background-color: #fff;}
.quick-nav-image {flex: 0 0 200px;text-align: center;}
.quick-nav-image img {max-width: 100%;height: auto;border-radius: 8px;}
.quick-nav-list {flex: 1;display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 12px;}
.quick-nav-item {display: flex;align-items: center;gap: 12px;padding: 15px 20px;background-color: #f3f3f3;border-radius: 8px;text-decoration: none;color: #333;transition: all 0.2s ease;cursor: pointer;border-left: 4px solid #4a90e2;}
.quick-nav-item:hover {background-color: #f0f7ff;text-decoration: none;border-left-color: #2d5aa0;transform: translateX(3px);}
.quick-nav-item:focus {outline: 3px solid #4a90e2;outline-offset: 2px;}
.quick-nav-icon {color: #4a90e2;font-size: 12px;flex-shrink: 0;line-height: 1;}
.quick-nav-text {flex: 1;font-size: 16px;font-weight: 500;line-height: 1.5;}
.quick-nav-chevron {font-size: 12px;color: #999;flex-shrink: 0;}

/* 항목 섹션 */
.detail-items-section {margin: 40px 0;}
.items-list {background-color: #f5f5f5;border-radius: 12px;padding: 30px;}
.item-row {display: flex;gap: 30px;margin-bottom: 30px;background-color: #fff;border-radius: 8px;padding: 25px;align-items: flex-start;scroll-margin-top: 20px;}
.item-row:last-child {margin-bottom: 0;}
.item-label {flex: 0 0 200px;font-size: 18px;font-weight: 600;color: #333;line-height: 1.6;padding-right: 20px;border-right: 2px solid #e0e0e0;}
.item-content {flex: 1;line-height: 1.3;color: #555;font-size: 1em;}
.item-content p {margin: 0 0 12px 0;}
.item-content p:last-child {margin-bottom: 0;}
.item-link {color: #4a90e2;text-decoration: underline;word-break: break-all;}
.item-link:hover {color: #2d5aa0;}

/* URL 링크 버튼 스타일 */
.item-link-btn {display: inline-flex;align-items: center;gap: 8px;padding: 12px 20px;background-color: #4a90e2;color: #fff;text-decoration: none;border-radius: 8px;font-size: 15px;font-weight: 500;transition: all 0.3s ease;word-break: break-all;max-width: 100%;}
.item-link-btn:hover {background-color: #2d5aa0;color: #fff;text-decoration: none;transform: translateY(-2px);box-shadow: 0 4px 12px rgba(74, 144, 226, 0.3);}
.item-link-btn:focus {outline: 3px solid #4a90e2;outline-offset: 2px;}
.item-link-btn-text {flex: 1;min-width: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.item-link-btn-icon {flex-shrink: 0;font-size: 16px;line-height: 1;}

/* 출처 */
.detail-source {display: flex;margin: 40px 0;padding: 20px;background-color: #f9f9f9;border-radius: 8px;font-size: 14px;color: #666;line-height: 1.6;}
.detail-source strong {color: #333;margin-right: 8px;}

/* 목록으로 돌아가기 버튼 */
.detail-footer {margin-top: 40px;text-align: center;}
.back-to-list-btn {display: inline-block;padding: 15px 40px;background-color: #f5f5f5;color: #333;text-decoration: none;border-radius: 25px;font-size: 16px;font-weight: 500;border: 2px solid #e0e0e0;transition: all 0.3s ease;}
.back-to-list-btn:hover {background-color: #e0e0e0;border-color: #ccc;text-decoration: none;}
.back-to-list-btn:focus {outline: 3px solid #4a90e2;outline-offset: 2px;}
.no-results {text-align: center;padding: 60px 20px;color: #999;font-size: 16px;}

/* 상세 페이지 반응형 */
@media (max-width: 1024px) {
.parenting-info-detail-container {}
.detail-header {flex-direction: column;align-items: stretch;gap: 15px;}
.detail-header-right {align-self: flex-end;}
.back-to-list-btn-header {padding: 2px 20px;font-size: 14px;}
.detail-title {font-size: 28px;}
.quick-nav-wrapper {flex-direction: column;padding: 10px;gap: 20px;}
.quick-nav-image {flex: none;width: 100%;max-width: 200px;margin: 0 auto;}
.quick-nav-list {width: 100%;}
.quick-nav-item {padding: 12px 18px;}
.quick-nav-text {font-size: 15px;}
.items-list {padding: 20px;}
.item-row {flex-direction: column;gap: 15px;padding: 20px;margin-bottom: 20px;}
.item-label {flex: none;width: 100%;padding-right: 0;border-right: none;border-bottom: 2px solid #e0e0e0;padding-bottom: 15px;font-size: 18px;}
.item-content {font-size: 14px;}
.item-link-btn {padding: 10px 16px;font-size: 14px;}
.item-link-btn-text {white-space: normal;}
.back-to-list-btn {padding: 12px 30px;font-size: 14px;}
}

@media (max-width: 480px) {
.detail-title {font-size: 23px;}
.detail-category {font-size: 14px;padding: 5px 12px;}
.items-list {padding: 15px;}
.item-row {padding: 15px;margin-bottom: 15px;}
.item-label {font-size: 16px;padding-bottom: 12px;}
.item-content {font-size: 1em;}
.item-link-btn {padding: 10px 14px;font-size: 13px;width: 100%;justify-content: center;}
.item-link-btn-text {white-space: normal;text-align: center;}
.item-link-btn-icon {font-size: 14px;}
.quick-nav-wrapper {padding: 10px;gap: 15px;}
.quick-nav-content {padding: 15px;gap: 15px;flex-direction: column;}.quick-nav-image {max-width: 150px;}
.quick-nav-item {padding: 10px 15px;gap: 10px;}
.quick-nav-text {font-size: 14px;}
}
