@charset "utf-8";

:root {
    --main_color01:linear-gradient(135deg, #C40051, #0044BD) ;
    --main_color02:#48fde2;
    --main_color03:#ced9db;
    --main_color04:#2259cc;
}

.ai_wrap {padding:50px;border-radius: 30px;background: #F4F7FF;font-family: 'Pretendard', sans-serif;}
.ai_tit_area {display:flex;gap:10px;align-items: center;}
.ai_tit_area::after {content: '';width: 60px; height: 44px;background:url("../images/ai_search/chevron-up.svg") center center no-repeat;margin-left: auto;}
.ai_tit_area h2 img {width:76px;height:auto;}
.ai_tit_area .tit_big {font-size:50px;color:#0044BD;font-weight:700;}
.ai_tit_area .tit_ex {font-size:18px;font-weight: 500; color:#111;line-height:130%;padding-left:10px;letter-spacing:0;}
.ai_search_wrap {margin-top:30px;display:flex;border-radius:999px;border: 2px solid #0044BD;padding:15px 30px;background-color:#fff;}
.ai_search_wrap input {width:100%;background-color:transparent !important;font-size:22px;font-weight:500;color:#333;border: none;}
.ai_search_wrap input:-webkit-autofill,
.ai_search_wrap input:-webkit-autofill:hover,
.ai_search_wrap input:-webkit-autofill:focus,
.ai_search_wrap input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #333 !important;
}
.ai_search_wrap input::placeholder {font-size:22px;font-weight:500;color:#777676;}
.ai_search_wrap button {padding:0;}
.ai_search_bottom {margin-top:10px;padding-right:25px;display:flex;justify-content: end;align-items: center;gap:15px;}
.ai_search_bottom p {font-size:14px;color: #1f1f1f;}
.search_result {display:none;}
.search_result_section {position:relative;padding:30px 30px;background-color:#fff;border-radius:30px;margin-top:20px;line-height:130%;}
.search_result_section * {letter-spacing: 0;}
.search_result_section ol > li > p > strong {font-weight:700;color:#222;}
.search_result_section ol > li > p {padding-bottom:0;}
.search_result_tit {font-size:24px;font-weight:700;color:#000;padding:60px 20px 30px;}

.bg_white_box {background-color:#fff;padding:30px;border-radius:30px;}
.bg_white_box .btn_toggle:first-child {border-top:none;}
.bg_white_box .btn_toggle {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;word-break: break-all;border-top:1px solid #ddd;width:100%;text-align:left;position:relative;font-size:20px;color:#1e1e1e;font-weight:600;padding:20px 20px 20px 50px;background:url("../images/ai_search/bull_q.svg") left center no-repeat;}
.bg_white_box .btn_toggle::before {position:absolute;right:0;top:25px; content:"";width:14px;height:8px;background:url("../images/ai_search/chevron-up.svg") right center no-repeat;}
.bg_white_box .btn_toggle.on {border-bottom:none;}
.bg_white_box .btn_toggle.on::before {transform: rotate(180deg);}
.bg_white_box .toggle_con {display:none;border-bottom:1px solid #1e1e1e;padding:20px 20px 30px;padding-left:50px;font-size:18px;line-height:150%;background:url("../images/ai_search/bull_a.svg") left 25px no-repeat;}

.questionSwiper.swiper {padding-bottom:30px;}
.questionSwiper .swiper-scrollbar {opacity:1 !important;border-radius:0;background-color:#ffffff80;}
.questionSwiper .swiper-scrollbar-drag {background-color:#fff;border-radius:0;}
.questionSwiper .swiper-slide {padding:75px 0 50px;border-radius:30px;background:#fff url("../images/ai_search/bull_q.svg") 30px 30px no-repeat;}
.questionSwiper button {text-align:left;padding:0 30px;font-size:20px;font-weight:500;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-all;
    height:84px;
}

.search_result_bottom {}
#hide_result,
.typing-txt {display:none;}
#hide_result .w100 {width:100%;}
.total-rslt .rslt-box.w100 {width:100%;}


/* 테그 */
.search_result_section h1 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section h2 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section h3 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section h4 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section h5 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section h6 {font-size:20px;line-height:130%;font-weight:700;padding-top:20px;padding-bottom:10px;}
.search_result_section p {font-size:18px;line-height:130%;padding:20px 0;color:#333;}
.search_result_section hr{margin-bottom: 20px;}

.search_result_section a {display:inline-block;font-size:18px;color:#8b2163;text-decoration: underline;padding-right:20px;background:url("../images/ai_search/bull_new_link.png") right center no-repeat;}
.search_result_section p + p {padding-top:0;}
.search_result_section dl dt {font-size:24px;font-weight:700;color:#333;}
.search_result_section dl dd {font-size:20px;margin-top:20px;line-height:150%;color:#333;}
.search_result_section > ol {padding:0px 0 20px;}
.search_result_section > ul {padding:0px 0 20px;}
.search_result_section > ul p {padding:0px;}
.search_result_section > ul > li {font-size:18px;}
.search_result_section > ul > li + li {margin-top:10px;}

.search_result_section > ul > li {padding-left:13px;position:relative;}
.search_result_section > ul > li:before {position:absolute;left:0;top:9px;content:"";width:6px;height:2px;background-color:#222;}
.search_result_section > ul > li > p {padding-top: 0px;}

.search_result_section > ul > li > ul {margin:12px 0 15px;}
.search_result_section > ul > li > ul > li {padding-left:10px;position:relative;margin-top:7px;}
.search_result_section > ul > li > ul > li > p {padding-top: 0px;}
.search_result_section > ul > li > ul > li:first-child {margin-top:0px;}
.search_result_section > ul > li > ul > li:before {position:absolute;left:0;top:9px;content:"";width:3px;height:3px;background-color:#333;border-radius: 5px;}

.search_result_section > ol {position: relative;}
.search_result_section > ol > li > ul {padding:15px 5px;}
.search_result_section > ol > li > ul > li {padding-left:13px;position:relative;margin-top: 5px;}
.search_result_section > ol > li > ul > li:first-child {margin-top:0px;}
.search_result_section > ol > li > ul > li:before {position:absolute;left:0;top:9px;content:"";width:6px;height:2px;background-color:#222;}
.search_result_section > ol > li > p {padding-left:25px;}
.search_result_section > ol > li > p:before {position:absolute;left:10px;top:30px;content:"";width:5px;height:5px;background-color:#222;border-radius: 5px;}

.search_result_section > ol > li {font-size:18px;color:#333;}
.search_result_section > ol > li + li {margin-top:10px;}
.search_result_section > ol ul {padding:12px 0;}
.search_result_section > ol ul li {position:relative;padding-left:10px;}
.search_result_section > ol ul li:before {position:absolute;left:0;top:9px;content:"";width:3px;height:3px;background-color:#666;border-radius: 5px;}
.search_result_section > ol > li ul > li {margin-top:7px;color:#333;}
.search_result_section > ol > li ul > li:first-child {margin-top:0px;}

.search_result_section > ol > li > ol {padding:15px 5px;counter-reset: number 0;}
.search_result_section > ol > li > ol > li {position:relative;padding-left:20px;margin-top:7px;color:#333;}
.search_result_section > ol > li > ol > li:first-child {margin-top:0px;}
.search_result_section > ol > li > ol > li:before {counter-increment: number ;content:counter(number) ".";position:absolute;left:0;top:0;}

.search_result_section table {width:100%;margin-bottom:20px;}
.search_result_section table {transition: all 0.5s;border-top:1px solid #ededed}
.search_result_section table th {text-align:center;font-size:18px;font-weight:700;}
.search_result_section table td {font-size:18px;text-align:left;}
.search_result_section table th {position:relative;border-bottom:1px solid #ededed;padding:10px 0;background-color:#fafafa;}
.search_result_section table th:before {content:"";width:1px;height:20px;background-color:#ededed;position:absolute;left:0;top:50%;transform:translateY(-50%);}
.search_result_section table th:first-child::before {display:none;}
.search_result_section table td {position:relative;border-bottom:1px solid #ededed;padding:10px 20px;}
.search_result_section table td:before {content:"";width:1px;height:20px;background-color:#ededed;position:absolute;left:0;top:50%;transform:translateY(-50%);}
.search_result_section table td:first-child::before {display:none;}

#link {color: #E45635;display:block;font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;text-align:center; text-decoration: none;}
#link:hover {color: #CCCCCC}
#link, #link:hover {-webkit-transition: color 0.5s ease-out;-moz-transition: color 0.5s ease-out;-ms-transition: color 0.5s ease-out;-o-transition: color 0.5s ease-out;transition: color 0.5s ease-out;}

/* loading */
.loading_wrap {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 20;
    background-color: #ffffff90;
}

.loading_area {
    position: relative;
}

.bar-loader {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px;
    position: relative;
}

.bar-loader span {
    display: block;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 4px solid #0044BD;
    /* 흰색 배경에 파랑색 테두리 */
    animation: expandCircle 2s ease-out infinite;
    border-radius: 50%;
    position: absolute;
}

.bar-loader span:nth-child(1) {
    animation-delay: 0s;
}

.bar-loader span:nth-child(2) {
    display: none;
}

.bar-loader span:nth-child(3) {
    display: none;
}

.bar-loader span:nth-child(4) {
    display: none;
}

.bar-loader span:nth-child(5) {
    display: none;
}

@keyframes expandCircle {
    0% {
        width: 20px;
        height: 20px;
        background-color: #fff;
        border-color: #0044BD;
        opacity: 1;
        /* 작고 진한 파랑색 테두리 */
    }
    
    100% {
        width: 80px;
        height: 80px;
        background-color: #fff;
        border-color: #0044BD;
        opacity: 0;
        /* 크고 하늘색 테두리로 변하면서 사라짐 */
    }
}


@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}