#AI_companion_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #f8f9fa;
    padding-bottom: 48px;
}
.AI_companion_box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top: 40px;
    max-width: 1000px;
    width: 100%;
}
.AI_companion_box > .main_title_box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 40px;
}
.AI_companion_box > .main_title_box > .main_title {
    font-family: "Jalnan";
    font-size: 24px;
    font-weight: 700;
    line-height: 30px; /* 125% */
}
.AI_companion_box > .main_title_box > button {
    display: flex;
    padding: 12px 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 100px;
    background: var(--Primary, #FF820F);

    color: var(--White, #FFF);
    font-size: 16px;
    font-weight: 800;
    line-height: 24px; /* 150% */
}
.AI_companion_box > .search_box {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
}
.AI_companion_box > .search_box > .title {
    font-size: 24px;
    font-weight: 800;
    line-height: 30px; /* 125% */
}
.AI_companion_box > .search_box > .search {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.AI_companion_box > .search_box > .search > form {
    width: 70%;
}
.AI_companion_box > .search_box > .search > form > input[type="text"] {
    border-radius: 4px;
    border: 1px solid var(--Grey_D, #DDD);
    max-width: 500px;
    width: 100%;
    height: 44px;
    padding: 0px 36px 0 12px;
    background: url(../z_images/zoo_img/hd-sch.svg) no-repeat center right 12px;
}
.AI_companion_box > .search_box > .search > p {
    display: flex;
    align-items: center;
    font-size: 12px;
    gap: 8px;
    cursor: pointer;
}
.AI_companion_box > .AI_chat_list_box {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 40px;
}
.AI_companion_box > .AI_chat_list_box > .paging_area02 {
    padding: 12px 0;
    margin-top: 20px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list {
    padding: 20px 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    border-bottom: 1px solid var(--Grey_E, #EEE);
    cursor: pointer;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 8px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .title {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .title > p {
    font-size: 16px;
    font-weight: 800;
    line-height: 24px; /* 150% */

    max-width: 850px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .title > b {
    font-size: 12px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .title > b > span {
    color: var(--Grey_6, #666);
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .content_state {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--Primary, #FF820F);
    font-size: 10px;
    line-height: 14px; /* 140% */
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .content_state > img {
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box > .text_box {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box > .text_box > p {
    border-radius: 100px;
    display: flex;
    padding: 4px 12px;
    justify-content: center;
    align-items: center;

    color: var(--White, #FFF);
    font-size: 12px;
    font-weight: 800;
    line-height: 16px; /* 133.333% */
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box > .text_box > div {
    line-height: 20px; /* 142.857% */
    width: calc(100% - 55px);

    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box > .text_box.ask > p {
    background: var(--Grey_C, #CCC);
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .AI_ask_box > .text_box.answer > p {
    background: var(--Dark, #212121);
}
.community_detail_popup_area.AI_chat_detail {
    max-width: 600px;
    width: 100%;
}
.community_detail_popup_area.AI_chat_detail > .popup_title {
    box-shadow: unset;
    padding: 20px;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area {
    padding: 0;
    padding-bottom: 51px;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_profiles {
    padding: 20px 20px 0px 20px;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > div.info1 {
    padding: 0 20px 20px 20px;
    border-bottom: 1px solid #ddd;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > div.info1 > p {
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 4px;
    background: var(--Sub, #FFDED1);

    color: var(--Primary, #FF820F);
    font-size: 10px;
    font-weight: 800;
    line-height: 14px; /* 140% */
    margin-left: 8px;
    cursor: pointer;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box {
    display: flex;
    flex-direction: column;
    height: 380px;
    overflow: auto;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI {
    display: flex;
    flex-direction: column;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 20px;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box.ask {
    border-top: 1px solid #ddd;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI:nth-of-type(1) > .text_box.ask:nth-of-type(1) {
    border-top: none;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box.answer {
    background: var(--Grey_F1, #F1F1F1);
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box > .chat_content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box > .chat_content > b {
    font-weight: 800;
    line-height: 20px; /* 142.857% */
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box > .chat_content > b > span {
    color: var(--Grey_6, #666);
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
}
.community_detail_popup_area.AI_chat_detail > div.popup_contents_area > .popup_content_AI_list_box > .popup_content_AI > .text_box > .chat_content > div {
    line-height: 20px; /* 142.857% */

    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.AI_write_box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding-top: 40px;
    max-width: 1000px;
    width: 100%;
}
.AI_write_box > .input_box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.AI_write_box > .input_box > .title {
    font-weight: 800;
    line-height: 20px; /* 142.857% */
}
.AI_write_box > .input_box > div > input[type="text"] {
    display: flex;
    align-items: center;
    min-height: unset;
    height: 44px;
    padding: 0 12px;
    line-height: normal;
    border-radius: 4px;
    border: 1px solid var(--Grey_D, #DDD);
    background: var(--White, #FFF);
}
.AI_write_box > .input_box > .input_box2 {
    display: flex;
    align-items: center;
    gap: 4px;
}
.AI_write_box > .input_box > .input_box2 > input[type="text"] {
    width: calc(100% - 48px);
}
.AI_write_box > .input_box > .input_box2 > div {
    display: flex;
    width: 44px;
    height: 44px;
    justify-content: center;
    align-items: center;
    background: var(--Primary, #FF820F);
    cursor: pointer;
}
.write_AI_list_box{
    display: flex;
    flex-direction: column;
    height: 570px;
    overflow: auto;
}
.write_AI_list_box > .write_content_AI {
    display: flex;
    flex-direction: column;
}
.write_AI_list_box > .write_content_AI > .text_box {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 20px;
}
.write_AI_list_box > .write_content_AI > .text_box.ask {
    border: 1px solid #ddd;
    border-bottom: none;
}
.write_AI_list_box > .write_content_AI > .text_box.answer {
    background: var(--Grey_F1, #F1F1F1);
}
.write_AI_list_box > .write_content_AI > .text_box > .chat_content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.write_AI_list_box > .write_content_AI > .text_box > .chat_content > b {
    font-weight: 800;
    line-height: 20px; /* 142.857% */
}
.write_AI_list_box > .write_content_AI > .text_box > .chat_content > b > span {
    color: var(--Grey_6, #666);
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
}
.write_AI_list_box > .write_content_AI > .text_box > .chat_content > div {
    line-height: 20px; /* 142.857% */

    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


/* 반려지식으로 페이지 교체 */
.AI_companion_box {
    max-width: 1280px;
}
.AI_companion_box > .main_title_box.sch {
    padding: 0;
}
/* 2026.03.16 주석
#companion_searchForm {
    width: 100%;
    display: flex;
    justify-content: center;
}
.companion_sch {
    max-width: 560px;
    width: 100%;
	height: 44px;
	padding: 0px 36px 0 46px;
	border-radius: 100px;
	border: 1px solid var(--Grey_C, #CCC);
	background-color: #F5F4F9;
	background-image: url(../z_images/zoo_img/hd-sch.svg);
	background-position: 12px;
	background-repeat: no-repeat;
    position: relative;
}
*/
.categoryselect.companion > div.select > select {
    background-color: white;
}
.AI_companion_box > .AI_chat_list_box {
    flex-direction: unset;
    flex-wrap: wrap;
    gap: 12px;
}
.AI_companion_box > .paging_area02 {
    width: 100%;
    margin: 0;
}
.AI_chat_list_box > .AI_chat_list {
    width: calc((100% / 3) - 8px);
    padding: 12px !important;
    border: 1px solid var(--Grey_D, #DDD);
    border-radius: 8px;
}
.AI_chat_list_box > .AI_chat_list > .chat_list_back {
    aspect-ratio: 1/1;
    max-width: 120px;
    width: 100%;
    border-radius: 8px;
    cursor: pointer;
    min-width: 70px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list {
    gap: 20px;
    cursor: unset;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .title {
    font-size: 20px;
    font-weight: 800;
    line-height: 28px; /* 140% */
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .like_box {
    display: flex;
    align-items: center;
    gap: 4px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .title_box > .like_box > img {
    cursor: pointer;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .animal_info_box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .animal_info_box > .info {
    display: flex;
    align-items: center;
    gap: 12px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .animal_info_box > .info > .info_sub {
    display: flex;
    align-items: center;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .animal_info_box > .info > .info_sub > p {
    font-size: 12px;
    line-height: 16px; /* 133.333% */
    width: 60px;
}
.AI_companion_box > .AI_chat_list_box > .AI_chat_list > .chat_content > .animal_info_box > .info > .info_sub > span {
    border-radius: 100px;
    background: var(--Grey_E, #EEE);
    width: 65px;
    padding: 4px 8px;
    color: var(--Grey_6, #666);
    text-align: center;

    font-size: 12px;
    font-weight: 800;
    line-height: 16px; /* 133.333% */
}


.community_detail_popup_area.AI_chat_detail > div.popup_contents_area {
    padding-bottom: 0;
}
.AI_chat_detail > .popup_contents_area > .pageinfo_box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 20px;
}
.AI_chat_detail > .popup_contents_area > .pageinfo_box > .pageinfo {
    color: var(--Grey_6, #666);
    font-size: 14px;
    line-height: 20px; /* 142.857% */
}
.AI_chat_detail > .popup_contents_area > .pageinfo_box > .title {
    font-size: 24px;
    font-weight: 800;
    line-height: 30px; /* 125% */
}
.swiper.companion_slide {
    padding: 0 12px;
}
.swiper.companion_slide.other {
    padding: 0 20px;
}
.swiper.companion_slide > .swiper-wrapper {
    max-height: 128px;
}
.swiper.companion_slide > .swiper-wrapper > .swiper-slide {
    aspect-ratio: 128/128;
    max-width: 128px;
    border-radius: 8px;
    width: 100% !important;
}
.popup_content_companion_info_box_back {
    padding: 20px;
    border-bottom: 1px solid rgba(238, 238, 238, 1);
}
.popup_content_companion_info_box {
    display: flex;
    flex-direction: column;
}

.popup_content_companion_info_box > .info_box {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 0;
}
.popup_content_companion_info_box > .info_box > p {
    width: 92px;
    color: var(--Grey_6, #666);
    line-height: 20px; /* 142.857% */
}
.popup_content_companion_info_box > .info_box > div {
    line-height: 20px; /* 142.857% */
    width: calc(100% - 100px);
}
.popup_content_companion_info_box > .info_box > div > .long_box {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.popup_content_companion_info_box > .info_box > div > .long_box.set {
    -webkit-line-clamp: unset;
}
.popup_content_companion_info_box > .info_box > div > .long_other {
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.companion_slide_box.sub > .sub_title {
    font-size: 16px;
    font-weight: 800;
    line-height: 24px; /* 150% */
    padding: 20px 20px 12px 20px;
}
.companion_slide_box.sub {
    padding-bottom: 20px;
}
.AI_chat_detail > .popup_contents_area > .other_btn_box {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.AI_chat_detail > .popup_contents_area > .other_btn_box > .img_box {
    display: flex;
    align-items: center;
    gap: 20px;
}
.AI_chat_detail > .popup_contents_area > .other_btn_box > .img_box > img {
    width: 24px;
    height: 24px;
    cursor: pointer;
}
.AI_chat_detail > .popup_contents_area > .other_btn_box > button {
    border-radius: 8px;
    background: var(--Dark, #212121);
    padding: 8px 20px;
    color: var(--White, #FFF);
    font-size: 12px;
    font-weight: 800;
    line-height: 16px; /* 133.333% */
}
.swiper.companion_slide.other > .swiper-wrapper {
    max-height: 100px;
}
.swiper.companion_slide.other > .swiper-wrapper > .swiper-slide {
    aspect-ratio: 100/100;
    max-width: 100px;
    border-radius: 8px;
    width: 100% !important;
}


.AI_companion_box .categoryselect.companion { width: 100% !important;  margin-bottom: 15px !important; display: block !important; }
.AI_companion_box .d-ai-tab-container { display: flex !important; flex-direction: row !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; gap: 10px !important; }
.AI_companion_box .normalradioarea2.d-ai-tabs { display: flex !important; flex-direction: row !important; align-items: center !important; border: none !important; padding: 0 !important; margin: 0 !important; gap: 8px !important; width: auto !important; min-height: unset !important; }
.AI_companion_box .normalradioarea2.d-ai-tabs > label { display: flex !important; align-items: center !important; justify-content: center !important; min-height: unset !important; height: 44px !important; min-width: 80px !important; max-width: 120px !important; width: auto !important; padding: 0 15px !important; margin: 0 !important; border-radius: 50px !important; white-space: nowrap !important; cursor: pointer !important; flex: none !important; }
.AI_companion_box .normalradioarea2.d-ai-tabs > input.normalradio2 { display: none !important; }

@media (max-width: 768px) {
.AI_companion_box .categoryselect.companion { margin-bottom: 0px !important;}
}



/* 반려지식 탑배너  */
.d-knowledge-banner { position: relative; flex: none; width: 100%; max-width: 1280px; height: 160px; margin: 24px auto 0px; border-radius: 40px; padding: 0 64px; background: linear-gradient(to right, #4f46e5, #7c3aed); color: #fff; box-shadow: 0 10px 40px -10px rgba(79, 70, 229, 0.3); overflow: hidden; box-sizing: border-box; transition: all 0.3s ease; }
.d-knowledge-bg-pattern { position: absolute; inset: 0; opacity: 0.1; background-image: radial-gradient(#ffffff 1.5px, transparent 1.5px); background-size: 20px 20px; pointer-events: none; z-index: 0; }
.d-knowledge-blur-1 { display: block; position: absolute; right: -80px; top: -80px; width: 320px; height: 320px; background: #ffffff; opacity: 0.05; border-radius: 50%; filter: blur(48px); z-index: 0; }
.d-knowledge-blur-2 { display: block; position: absolute; left: -40px; bottom: -80px; width: 256px; height: 256px; background: #a5b4fc; opacity: 0.2; border-radius: 50%; filter: blur(48px); mix-blend-mode: overlay; z-index: 0; }
.d-knowledge-inner { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; height: 100%; box-sizing: border-box; }
.d-knowledge-icon-box { order: 2; width: 96px; height: 96px; background: rgba(255,255,255,0.1); border-radius: 16px; backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.2); box-shadow: inset 0 0 20px rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); transform: rotate(6deg); }
.d-knowledge-icon-box:hover { transform: rotate(0deg); }
.d-knowledge-icon-box svg { width: 40px; height: 40px; color: #fff; fill: rgba(255,255,255,0.2); transition: all 0.3s ease; }
.d-knowledge-badge { display: flex; position: absolute; top: -8px; right: -8px; width: 32px; height: 32px; background: #fff; color: #4f46e5; border-radius: 50%; align-items: center; justify-content: center; font-weight: 800; font-size: 14px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); }
.d-knowledge-text-box { order: 1; display: flex; flex-direction: column; justify-content: center; transition: all 0.3s ease; }
.d-knowledge-tag { display: inline-block; padding: 2px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.3); font-size: 12px; font-weight: 700; background: rgba(255,255,255,0.1); backdrop-filter: blur(4px); margin-bottom: 4px; width: max-content; color: #fff; }
.d-knowledge-title { font-size: 36px; font-weight: 900; line-height: 1; margin: 0 0 4px; text-shadow: 0 1px 2px rgba(0,0,0,0.1); letter-spacing: -0.025em; transition: all 0.3s ease; color: #fff; }
.d-knowledge-desc { font-size: 18px; color: #e0e7ff; opacity: 1; font-weight: 500; margin: 0; word-break: keep-all; letter-spacing: -0.025em; transition: all 0.3s ease; }
.d-pc-only { display: block; }
.d-mobile-only { display: none; }

@media (max-width: 1280px) {
	.d-knowledge-banner { width: calc(100% - 32px); }
}

@media (max-width: 1024px) {
	.d-knowledge-banner { padding: 0 32px; }
	.d-knowledge-title { font-size: 28px; }
	.d-knowledge-desc { font-size: 15px; }
	.d-knowledge-icon-box { width: 80px; height: 80px; }
	.d-knowledge-icon-box svg { width: 32px; height: 32px; }
}

@media (max-width: 767px) {
	.d-knowledge-banner { width: 100%; max-width: none; height: auto; flex: none; align-self: flex-start; margin: 0; padding: 24px 20px; border-radius: 0; background: linear-gradient(to right, #4f46e5, #7c3aed); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); }
	.d-knowledge-inner { justify-content: flex-start; height: auto; gap: 16px; }
	.d-knowledge-icon-box { order: 1; width: 44px; height: 44px; border-radius: 12px; transform: rotate(0deg); box-shadow: none; border: 1px solid rgba(255,255,255,0.1); backdrop-filter: blur(4px); background: rgba(255,255,255,0.2); }
	.d-knowledge-icon-box:hover { transform: rotate(0deg); }
	.d-knowledge-icon-box svg { width: 24px; height: 24px; fill: rgba(255,255,255,0.1); }
	.d-knowledge-badge { display: none; }
	.d-knowledge-text-box { order: 2; }
	.d-knowledge-tag { display: none; }
	.d-knowledge-title { font-size: 20px; letter-spacing: normal; }
	.d-knowledge-desc { font-size: 12px; color: #fff; opacity: 0.9; letter-spacing: normal; }
	.d-pc-only { display: none; }
	.d-mobile-only { display: block; }
	.d-knowledge-blur-1, .d-knowledge-blur-2 { display: none; }
}















/* 20260316 신규  css 추가 */

/*.knowledge_innerbox{max-width: 1280px; min-width: 360px; width:100%; margin: 0 auto; padding: 0 32px; }*/

.knowledge_innerbox{max-width: 1280px; min-width: 360px; width:100%; margin: 0 auto; padding: 0 32px; margin-bottom:48px; }/* 20260323 수정*/ 




/* 컨텐츠 상단(타이틀, 필터 등) */
.knowledge_list_top{display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom:32px}
.knowledge_list_top .total{color: #64748b; font-weight: 500; font-size: 14px; line-height: 20px;}
.knowledge_list_top .total strong{color: #4f46e5; }
.knowledge_list_top .filter { display: flex; flex-direction: row; align-items: center; border: none; padding: 0; margin: 0; gap: 8px; width: auto; min-height: unset; }
.knowledge_list_top .filter > label { display: flex; align-items: center; justify-content: center; min-height: unset; height: 44px ; min-width: 90px ; max-width: 120px ; width: auto ; padding: 0 15px ; margin: 0 ; border-radius: 50px ; white-space: nowrap ; cursor: pointer ; flex: none ; }
.knowledge_list_top .filter > input.normalradio2 { display: none; }




.knowledge_list_top_left{}
.knowledge_list_top_right{display: flex; gap: 5px; align-items: center;}

.knowledge_search_wrap{ max-width: 768px; margin:32px auto 40px; }
.knowledge_search_inner{ position: relative;}
.knowledge_search_inner svg{position: absolute; left: 24px; top:50%;     transform: translateY(-50%);}
.knowledge_search_inner input[type=text]{width:100%; font-size: 18px;   outline: 0; font-weight: 500; color: #1e293b;
 background: #fff; overflow: hidden;  padding: 0 32px 0 56px; height: 56px; border: 2px solid #f1f5f9;  border-radius: 9999px;
  box-shadow: 
    var(--tw-ring-offset-shadow, 0 0 #0000), 
    var(--tw-ring-shadow, 0 0 #0000), 
    0 1px 2px 0 rgb(0 0 0 / 0.05);

}

/*260323추가*/
.knowledge_search_inner input[type="text"]::placeholder { color: #94a3b8; opacity: 1; } 
.knowledge_search_inner svg { stroke: #94a3b8 !important; transition: stroke 0.15s ease-in-out !important; }
.knowledge_search_inner:hover svg { stroke: #6366f1 !important; }

.knowledge_search_inner input[type=text]:hover{
    border:2px solid rgb(203 213 225);
}
.knowledge_search_inner input[type=text]:focus{box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1); border: 2px solid transparent;}

  
.knowledge_list_wrap{display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr));}

.knowledge_box{display: flex; gap: 16px; align-items: flex-start; background: #fff; padding: 20px; border: 1px solid #f1f5f9; border-radius: 20px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
}
.knowledge_box:hover{
    transform: translateY(-4px);
    box-shadow: 0 12px 30px -10px rgba(99, 102, 241, 0.15); /* Indigo Shadow */
    border-color: #a5b4fc; /* Indigo-300 */
}



.knowledge_box:hover .txt .name strong{
   color : #4f46e5
}

.knowledge_box:hover .photo img{
     transform: scale(1.05);

}



.knowledge_box .photo{width: 110px; height: 110px; border-radius: 16px; overflow: hidden;}
.knowledge_box .photo img{object-fit: cover; width: 100%; height: 100%;    transition: transform 0.25s ease, box-shadow 0.25s ease;}
.knowledge_box .txt{flex: 1;}
.knowledge_box .txt .name{display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px;}
.knowledge_box .txt .name strong{color: #1e293b; font-weight: 700; font-size: 18px;}
.knowledge_box .txt .name .likebox{position: relative;    transform: scale(1);    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer;}
.knowledge_box .txt .name .likebox:hover{transform: scale(1.1);}
.knowledge_box .txt .name .likebox svg{fill: #ec4899; stroke: #ec4899; width: 32px; height: 32px; pointer-events: auto; }
.knowledge_box .txt .name .likebox span{ font-size: 8px; display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff;}
.knowledge_box .txt .name .likebox svg.on{fill:#fff; stroke:#1e293b;  stroke-width : 1;}
.knowledge_box .txt .name .likebox svg.on + span{color: #1e293b;}


.knowledge_box .txt .ability{padding: 12px; border: 1px solid #f1f5f980; background: #f1f5f980; width: 100%; margin-top: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; column-gap: 16px; border-radius:12px; }
.knowledge_box .txt .ability > div{display: flex; align-items: center; justify-content: space-between; }
.knowledge_box .txt .ability > div > span{font-size: 11px; letter-spacing: -0.025em; color: #475569; font-weight: 500; word-break: keep-all;}
.knowledge_box .txt .ability > div > .bar_wrap{display: flex; gap: 2px; align-items: flex-end;}
.knowledge_box .txt .ability > div > .bar_wrap .bar{width: 4px; border-radius: 2px; background: rgba(0, 0, 0, 0.05); }
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar1{ height: 6px;}
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar2{ height: 10px;}
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar3{ height: 14px;}
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar1.on{background: rgb(129 140 248);}
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar2.on{background: rgb(99 102 241);}
.knowledge_box .txt .ability > div > .bar_wrap .bar.bar3.on{background: rgb(79 70 229);}



@media (max-width: 1024px) {
	.knowledge_innerbox{padding:0 16px}
	.knowledge_search_wrap{max-width:100%}
      .knowledge_list_wrap {grid-template-columns: repeat(2, minmax(0, 1fr)); }
}




@media (max-width: 768px) {
	.knowledge_innerbox{padding: 0 16px; }
    .knowledge_list_wrap {grid-template-columns: repeat(1, minmax(0, 1fr)); }
	.knowledge_search_wrap{margin:24px 0 20px;}
	.knowledge_list_top{margin-bottom:20px;}
}


@media (max-width: 640px) {
      .knowledge_box .txt .ability > div > span{font-size: 10px;}
}


@media screen and (max-width: 480px) {
	  .knowledge_search_inner input[type=text] {padding: 8px 24px 8px 56px; font-size: 15px; height:48px;}
	  .knowledge_box .txt .ability  {padding: 10px !important; column-gap: 8px; }
	  .knowledge_list_top .filter > label { min-width: 74px ;  padding: 0 6px ;  }

	  
}	  

