/* =================================================
   1. CONTENT BASE & META (제목 및 기본 설정)
   ================================================== */
.entry-title {
    font-size: 25px !important; 
    font-weight: 700 !important;
    line-height: 1.2 !important;
	margin-top: -38px !important; /* 제목 위 로고 사이 간격  */
    margin-bottom: -5px !important;
    color: #1a202c !important;
    border: none !important; /* 제목 주변 선 제거 */
}

/* 불필요한 메타 정보 숨김 */
.entry-meta, .post-meta, .entry-date, .author, .cat-links, .tags-links {
    display: none !important;
}

/* ==================================================
   2. CONTENT CONTAINER (본문 레이아웃)
   ================================================== */
.geo-content {
    max-width: 780px;
    margin: -20px auto 0;
    padding: 0 15px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    color: #222;
    line-height: 1.7;
}

/* H2: 파란색 강조선 유지 (제목 구분용) */
.geo-content h2 {
    display: flex;
    align-items: center;
    font-size: 24px;
    font-weight: 700;
    color: #1a202c;
    margin: 48px 0 16px;
    padding: 2px 0 2px 16px;
    border-left: 5px solid #1a73e8 !important; 
}

/* 🔥 [수정] 모든 문단 및 요소의 좌측 회색 바 박멸 */
.geo-content p, .entry-content p, .entry-content ul, .entry-content ol, .entry-content li {
    border-left: none !important; 
    padding-left: 0 !important;
    margin-left: 0 !important;
}


/* ==================================================
   NEW FAQ SECTION (PC 답변 미출력 완벽 해결)
   ================================================== */

/* 1. FAQ 전체 컨테이너 */
.geo-content .geo-faq-box {
    background: #ffffff !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 16px !important;
    margin: 25px 0 !important;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
    cursor: pointer !important;
    transition: all 0.3s ease;
}

/* 2. 질문(Q) 스타일 */
.geo-content .geo-faq-box h3 {
    color: #1a73e8 !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    padding: 0 0 5px 0 !important;
    line-height: 1.4 !important;
    border: none !important;
}

/* 3. 답변(A) - 기본 상태 (강제 숨김 제거) */
/* !important를 빼서 JS가 클래스를 붙였을 때 바로 나타나게 합니다. */
.geo-content .geo-faq-box p {
    display: none; 
    margin: 15px 0 0 0 !important;
    padding: 10px 0 10px 32px !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #475569 !important;
    position: relative !important;
    border-top: 1px dashed #eee !important; /* 질문과 답변 구분선 */
}

/* 🔥 4. [핵심] 답변이 열리는 '유일한' 조건 */
/* JS가 .active 클래스를 넣거나, 인라인 스타일이 block일 때만 출력 */
.geo-content .geo-faq-box.active p,
.geo-content .geo-faq-box.open p,
.geo-content .geo-faq-box p[style*="block"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 답변 A 아이콘 디자인 */
.geo-content .geo-faq-box p::before {
    content: "A.";
    position: absolute;
    left: 0;
    top: 12px;
    font-weight: 800;
    color: #10b981;
    font-size: 18px;
}




/* PC - 오직 카테고리(아카이브) 페이지에서만 간격 줄이기 */
.category .entry-header,
.archive .entry-header {
    margin-bottom: 6px !important;
}

.category .entry-title,
.archive .entry-title {
    margin-bottom: 0 !important;
}

.category .entry-summary,
.archive .entry-summary {
    margin-top: 0 !important;
}








/* ==================================================
   SEARCH RESULTS PAGE (겹침 해결 & 여백 최적화)
   ================================================== */

/* 1. 상단 헤더와 검색 타이틀 사이 간격 조절 및 구분선 제거 */
.search-results .page-header {
    margin: -80px 0 20px !important; /* 상단 여백 10px로 최소화, 하단은 본문과 20px 띄움 */
    padding: 0 !important;
    border: none !important;        /* 모든 테두리 제거 */
    display: block !important;       /* 겹침 방지를 위해 block 속성 강제 */
    position: relative !important;   /* absolute 요소가 있으면 해제 */
}

/* 2. 'Search Results for:' 타이틀 디자인 */
.search-results .page-title {
    font-size: 23px !important;
    font-weight: 700 !important;
    color: #1a73e8 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

/* 3. 본문 컨테이너 위치 정렬 (타이틀과 본문 겹침 방지) */
.search-results #primary, 
.search-results .site-main {
	margin-left: 10px !important;  /* 🔥 전체를 왼쪽으로 18px 강제 이동 */
	margin-right: 15px !important;  /* 🔥 우측 사이드바와의 간격 (숫자가 커질수록 사이드바와 멀어짐) */
	padding-top: 20px !important;
    margin-top: 0 !important;
    clear: both !important; /* 위쪽 요소와 겹치지 않게 밀어냄 */
}

/* 4. 검색 결과 리스트 아이템 사이 구분선까지 제거 */
.search-results article {
    margin-bottom: 20px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important; /* 아이템 사이의 가로줄도 제거 */
}

/* 5. 검색 결과 리스트 제목 스타일 */
.search-results .entry-title {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-top: 0 !important;
    margin-bottom: -30px !important;
    display: block !important;
}

/* 6. 요약문(Excerpt) 디자인 및 크기 조절 */
.search-results .entry-summary p, 
.search-results .entry-content p {
    font-size: 15px !important;      /* 🔥 요약문 글자 크기 추가 */
    color: #4a5568 !important;      /* 가독성 좋은 진한 회색 */
    line-height: 1.4 !important;    /* 줄간격 조절 */
    margin-bottom: 12px !important; /* 요약문과 하단 요소 사이 간격 */
    margin-top: 5px !important;     /* 제목과의 간격 */
    display: block !important;
}

/* 'Read More' 링크가 요약문 바로 뒤에 붙는 경우 스타일 */
.search-results .read-more, 
.search-results .more-link {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1a73e8 !important;
    text-decoration: none !important;
}







/* =================================================
   MOBILE CONTENT VIEW (max-width: 768px)
   ================================================== */
@media screen and (max-width: 768px) {


    /* 1. 제목 영역 (음수 마진 조정 및 크기 최적화) */
    .entry-title {
        font-size: 20px !important; /* 모바일 가독성 크기 */
        line-height: 1.3 !important;
        /* 🔥 PC용 -38px을 모바일에서는 겹치지 않게 -5px~0으로 중화 */
        margin-top: 5px !important; 
        margin-bottom: 2px !important;
        padding: 0 0px !important; /* 좌우 여백 확보 */
        text-align: left !important;
    }

    /* 2. 본문 컨테이너 (여백 정리) */
    .geo-content {
        max-width: 100% !important;
        margin-top: -10 !important; /* 위로 너무 붙지 않게 리셋 */
        padding: 0 0px !important;
        line-height: 1.6 !important;
    }

    /* 3. H2 강조선 디자인 유지 및 크기 축소 */
    .geo-content h2 {
        font-size: 20px !important;
        margin: 0px 0px 0px 0px !important;
        padding: 2px 0 2px 12px !important;
        border-left: 4px solid #1a73e8 !important;
    }

    /* 4. 이미지 및 아이프레임 (모바일 폭 맞춤) */
    .geo-content img, 
    .geo-content iframe {
        max-width: 100% !important;
        height: auto !important;
        border-radius: 12px !important;
    }

    /* 5. FAQ 섹션 모바일 최적화 */
    .geo-content .geo-faq-box {
        margin: 15px 0 !important;
        padding: 15px !important; /* 패딩 약간 축소 */
        border-radius: 12px !important;
    }

    .geo-content .geo-faq-box h3 {
        font-size: 17px !important; /* 질문 크기 조절 */
        line-height: 1.4 !important;
    }

    .geo-content .geo-faq-box p {
        font-size: 15px !important;
        padding: 10px 0 10px 25px !important; /* 좌측 여백 살짝 축소 */
    }

    /* FAQ 'A' 아이콘 위치 조정 */
    .geo-content .geo-faq-box p::before {
        font-size: 16px !important;
        top: 10px !important;
        left: 0 !important;
    }

    /* 6. 문단(p) 간격 축소 */
    .geo-content p {
        margin-bottom: 15px !important;
        font-size: 16px !important;
    }

}


/* ==================================================
   MOBILE SEARCH TOP FIX (메뉴 아이콘 아래 배치)
   ================================================== */
@media screen and (max-width: 768px) {
    /* 1. 본문 컨테이너 상단 여백 (검색창이 들어갈 공간 확보) */
    .site-content, .geo-content-wrap {
        padding-top: 55px !important; /* 이 값을 조절해 본문 제목 위치를 잡으세요 */
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* 2. 사이드바 해체 */
    .sidebar, #secondary {
        display: contents !important; 
    }

    /* 3. [수정] 검색창 위치 제어 - 로고 아래로 내리기 */
    .widget_search {
        display: block !important;
        position: absolute !important;
        /* 🔥 로고와 메뉴 아이콘 아래로 오도록 top 값 조정 */
        top: 100px !important; 
        left: 0 !important;
        right: 0 !important;
        z-index: 10 !important;
        margin: 0 15px !important;
        width: calc(100% - 30px) !important;
    }

    /* 4. 검색창 자체 디자인 살짝 다듬기 */
    .widget_search form {
        background: #fff !important;
        border: 0px solid #ddd !important;
        height: 40px !important;
        border-radius: 20px !important;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
    }



/* ==================================================
   MOBILE SEARCH RESULTS (모바일 전용 최적화)
   ================================================== */

@media screen and (max-width: 768px) {
    /* 1. 상단 간격 정상화 (모바일은 로고 아래에 여유가 있어야 함) */
    .search-results .page-header {
        margin: 10px 0 15px !important; /* 음수 마진 제거하여 로고와 분리 */
        padding: 0px !important;    /* 좌우 화면 끝에서 살짝 띄움 */
    }

    /* 2. 타이틀 크기 조절 (모바일 화면에 맞게 감소) */
    .search-results .page-title {
        font-size: 19px !important;
        line-height: 1.2 !important;
		margin-bottom: -15px !important; /* Search Results for와 하단 타이틀 사이 간격 */
        word-break: break-all;        /* 긴 검색어도 줄바꿈 되도록 설정 */
    }

    /* 3. 본문 컨테이너 여백 조정 */
    .search-results #primary, 
    .search-results .site-main {
        margin-left: 0 !important;    /* PC용 좌측 이동 제거 */
        margin-right: 0 !important;
        padding: 0 15px !important;   /* 모바일 가독성을 위한 좌우 패딩 */
        width: 100% !important;       /* 가로폭 꽉 차게 */
    }

    /* 4. 리스트 아이템 간격 */
    .search-results article {
        margin-bottom: 25px !important;
    }

/* 5. 글 제목 스타일 (모바일용 강제 조정) */
.search-results .entry-title {
    font-size: 17px !important;
    margin-bottom: -30px !important;
    line-height: 1.3 !important;

    /* 🔥 부모의 패딩을 뚫고 왼쪽으로 밀어내기 */
    margin-left: -15px !important;  /* 이 값을 -10px, -20px 등으로 조절하며 위치를 잡으세요 */
    
    /* 혹시 모를 내부 간격 방지 */
    padding-left: 0 !important;
    display: block !important;
    width: calc(100% + 15px) !important; /* 왼쪽으로 민 만큼 가로폭 보정 */
}

    /* 6. 요약문 스타일 (모바일용) */
    .search-results .entry-summary p {
        font-size: 15px !important;   /* 모바일은 14px이 가독성이 좋음 */
        line-height: 1.5 !important;
        margin-top: 1px !important;
		margin-bottom: -20px !important;
    }



    /* 7. 사이드바 검색창 위치 조정 */
    .search-results .widget_search {
        margin: -90px 15px !important;
        width: calc(100% - 30px) !important;
    }
}