/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
/*******************************************/
/*캐싱 후 live part 만 다시 표시하는 과정에서, 최초 캐싱 데이터 중 숨길 부분을 지정함.
/*******************************************/
/*헤더 상단 로그인 정보 표시 부분, 숨김 후 로그인 상태에 따라 표시 여부 결정*/
#linkboo_auth_1, #linkboo_auth_2, #linkboo_auth_3, #linkboo_auth_4, #linkboo_auth_5  {
  display: none;
}
/*로그인 여부에 따른 Dynamic visibility 설정, 숨김 후 로그인 상태에 따라 표시 여부 결정*/
#linkboo_logged_in, #linkboo_logged_out,#linkboo_logged_in_1, #linkboo_logged_out_1, #linkboo_logged_in_2, #linkboo_logged_out_2, #linkboo_logged_in_3, #linkboo_logged_out_3, #linkboo_ing_1, #linkboo_ing_2, #linkboo_ing_3 {
  display: none;
}
#linkboo_point, #reward_point {
  display: none;
}
.linkboo_refresh_hide {
  display: none;
}
/*crocoblock 에서 리스팅 표시 전에 숨김처리 하는 부분*/
body:not(.elementor-editor-active) .hide-listing {
    /*visibility: hidden;*/
    display: none; /* display: none; 사용 시, 요소가 완전히 제거되어 레이아웃에 영향을 줄 수 있음 => 참고로 기록해둠*/
    /*position: absolute;*/ /* 요소를 화면에서 보이지 않게 하지만, 공간은 차지 않도록 함 ==> 참고로 기록해둠*/
    height: 0;
}

/*******************************************/
/*ai-blog 에서 제목에 대한 스타일을 지정하는 부분*/
/*******************************************/
.single-ai-blog .linkboo_blog_content h1 {
    margin-bottom: 50px;
    font-weight: bold;
}

.single-ai-blog .linkboo_blog_content .jet-popup h2 {
    font-size: 24px; /* 제목 크기 조정 */
    /*line-height: 1.5; /* 줄 높이 조정 */
    padding-top: 30px; /* 앞 단락 사이에 간격 추가 */
    padding-bottom: 30px;
    background-color: #f3e6f7; /* 옅은 보라색 */
    font-weight: bold;
    margin-top: 80px; /* 기존보다 여백 정돈 */
    border-radius: 5px; /* 부드러운 모서리 */    
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 그림자 효과 */
    /*text-align: center; /* 제목을 중앙 정렬 */
    color: #8D21AA; /* 제목 색상 */
    /*border-left: 5px solid #8D21AA; /* 왼쪽에 보라색 선 추가 */
    padding-left: 20px; /* 왼쪽 여백 추가 */
    padding-right: 20px; /* 오른쪽 여백 추가 */
    margin-top: 100px; /* 기존보다 여백 정돈 */
    margin-bottom: 50px; /* 제목과 본문 사이에 간격 추가 */
    /*font-family: 'Arial', sans-serif; /* 글꼴 변경 */
    text-transform: uppercase; /* 제목을 대문자로 변환 */
    letter-spacing: 1px; /* 글자 간격 조정 */
    transition: background-color 0.3s ease; /* 배경색 전환 효과 */
}
.single-ai-blog .linkboo_blog_content h2:hover {
    background-color: #e0c6f0; /* 마우스 오버 시 배경색 변경 */
}


.single-ai-blog .linkboo_blog_content h3 {
    padding-top: 50px; /* 앞 단락 사이에 간격 추가 */
    padding-bottom: 20px;
    font-weight: bold !important; 
    color: #8D21AA; /* 제목 색상 */
}

.single-ai-blog .linkboo_blog_content h3::before {
    padding-top: 50px; /* 글자가 중간에 위치하도록 h3 에 지정된 글자크기와 height 값과 함께 적절히 조절 */
    content: "";
    display: inline-block;
    width: 8px;  /* 막대 너비 */
    height: 1.2em; /* 막대 높이 (글자 크기에 맞춤) */
    background-color: #8D21AA; /* 막대 색상 */
    margin-right: 15px; /* 기존보다 넓은 간격 추가 */
    vertical-align: middle;
}

.single-ai-blog .linkboo_blog_content h4 {
    padding-top: 20px; /* 앞 단락 사이에 간격 추가 */
    padding-left: 10px; /* 좌 여백 10px */
    font-weight: bold !important; 
}

.single-ai-blog .linkboo_blog_content h5{
    font-size: 16px;
    padding-left: 20px; /* 좌 여백 20px */
}

.single-ai-blog .linkboo_blog_content img {
    display: block;
    border-radius: 5px; /* 이미지 모서리를 부드럽게 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 이미지에 그림자 효과 추가 */
    /*이미지 좌우 여백을 추가하여 중앙 정렬*/
    margin-left: 20px; /* 좌 여백 20px */
    margin-right: 10px; /* 우 여백 10px */
    max-width: calc(100% - 40px); /* 이미지가 컨테이너를 넘지 않도록 설정 */
    /*상하여백 20px 추가*/
    margin-top: 50px; /* 상단 여백 20px */
    margin-bottom: 50px; /* 하단 여백 20px */
}

.single-ai-blog .linkboo_blog_content figcaption {
    text-align: center;
    font-size: 12px;
    color: grey;
    margin-top: 5px;
}

/*linkboo_blog_content 클래스, data-id 속성값이 daa98ed 인 컨테이너 내 p 태그에 대한 스타일 지정*/
.single-ai-blog .linkboo_blog_content p {
    padding-left: 20px; /* 좌 여백 20px */
    padding-right: 10px; /* 우 여백 10px */
    line-height: 1.6; /* 줄 높이 조정 */
    font-size: 18px; /* 글자 크기 조정 */
    margin-top: 20px; /* 문단 간격 추가 */
    /*color: #8D21AA; /* 글자 색상 ==> 테스트 목적으로 사용 */
}