/**
Theme Name: astra-wpdesign
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-wpdesign
Template: astra
*/
/* ROOT START */
.root-width {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 12px !important;
    box-sizing: border-box;
}

main {
    width: 100%;
}

.mySwiper_main {
    position: relative;
    z-index: 1;
}

.main-header-bar .main-header-bar-navigation .sub-menu {
    padding: 25px;
}

.ast-site-title-wrap .site-title a {
    font-size: 14px;
}

.band-img-in {
    position: absolute !important;
    width: 170px !important;
    right: 10px !important;
    top: 0 !important;
}

.wrap-band-img-in {
    max-width: 1140px !important;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 10px 45px;
}

.review-card {
    margin: 10px;
    font-size: 18px;
    display: flex;
    color: #666;
    min-height: 240px;
    padding: 25px 20px;
    position: relative;
    border:1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.01), 0 2px 8px rgba(0, 0, 0, 0.0);
    transition: border-color 0.2s ease, box-shadow 0.35s ease;
    border-radius: 8px !important;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    background: #fff;
}
.wrap-card1 .review-card {
    min-height:320px;
}
.card-title{
    font-size: 20px;
    color: #000;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 10px;
}
.review-card .card-footer{
    margin-top:15px;
}
.status-badge{
    font-weight:600;
    color:#012851;
    padding-left:5px;
}
.refund-amount{
    padding-left:5px;
    color:#0055ff;
}
.wrap-card .swiper-slide-image{
    display:none;
}
.review-card:hover {
    border-color: rgba(0, 0, 0, 0.38);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
}
.wrap-price .elementor-button-link{
    width:100%;
}
.customer_h4 span {
    color: #006aff !important;
}

.qa-main .elementor-accordion {
    gap: 10px;
    display: flex;
    text-align: start;
    flex-direction: column;
}

.card-body-foot img {
    max-height: 120px;
    width: auto !important;
}

.review-left {
    padding: 14px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
}

.wrap-youtube {
    margin: 0 -180px;
    width: calc(100% + 360px) !important;
    overflow: hidden;
}

.form1 .ff-el-tooltip::before {
    content: "내용보기";
    font-size: 14px;
    vertical-align: text-top;
}

.form-button {
    width: 100%;
}

.quick-form {
    position: fixed;
    right: 15px;
    bottom: 25px;
    background: #ed31be;
    padding: 8px;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    z-index: 9999;
}

.quick-form img {
    width: 100%;
}

.page .entry-header h1 {
    display: none;
}

.scroll-down-icon {
    margin-top: -24px;
    animation: scroll-wiggle 5.8s cubic-bezier(0.37, 0.01, 0.2, 1) infinite;
    will-change: transform;
}

.custom-list ul li {
    padding: 4px 14px !important;
    background: #f5f6f9;
    border-radius: 50px;
}

/* .e-con,
.elementor-container,
.elementor-section,
.elementor-column,
.elementor-widget-container {
    overflow: visible !important;
    transform: none !important;
}

.e-con > .e-con-inner {
    overflow: inherit !important;
} */

/* Sticky full width */
.benefit-tabs-sticky {
    background: #fff;
    border-bottom: 1px solid #e5e8eb;
}

.sticky-tab {
    position: sticky;
    top: 0px;
    z-index: 9999;
}

/* Wrapper 1024px */
.benefit-tabs-wrapper {
    width: 1240px;
    margin: 0 auto;
    position: relative;
}

/* Tabs layout */
.benefit-tabs {
    display: flex;
    justify-content: center;
    gap: 120px;
    padding-top: 16px;
    position: relative;
}

.benefit-tabs .tab {
    font-size: 20px;
    font-weight: 600;
    padding-top: 20px;
    padding-bottom: 22px;
    color: #333;
    cursor: pointer;
    text-align: center;
}

.benefit-tabs .tab1 {
    width: 50%;
}

.benefit-tabs .tab2 {
    width: 33%;
}

.benefit-tabs .tab.active {
    color: #006aff;
}

/* Underline inside 1024px wrapper */
.benefit-underline {
    height: 2px;
    background: #006aff;
    width: 0;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: 0.25s ease;
}

.custom-tab button {
    flex: 1 !important;
}

.benefit-table-wrap {
    max-width: 100%;
}

.benefit-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    overflow: hidden;
    font-size: 14px;
    margin: 0 !important;
}

.benefit-table th,
.benefit-table td {
    padding: 16px 18px;
    border-bottom: 1px solid #e5e7eb;
    border-right: 1px solid #e5e7eb;
    text-align: center;
    color: #4b5563;
}

.benefit-table th:last-child,
.benefit-table td:last-child {
    border-right: none;
}

.benefit-table thead th {
    background: #f9fafb;
    font-weight: 700;
    color: #6a7585;
}

.benefit-total {
    text-align: center;
    padding: 20px;
    font-size: 16px;
    font-weight: 600;
    color: #374151;
}

.benefit-total span {
    color: #0066ff;
    font-weight: 700;
    margin-left: 6px;
}


.benefit-table .total strong {
    color: #0066ff;
}

.custom-color-485261 {
    color: #485261;
    font-weight: 600;
}
.site-footer{
    border-top: 1px solid #efefef;
}
.site-footer .widget_text h2{
    font-weight:600 !important;
}
.custom-color-89919c {
    color: #89919c !important;
    font-weight: 600;
}
.safe-slide h4 span{
    color:#036478 !important;
    padding-right:5px;
}
.safe-slide.elementor-element .swiper .elementor-swiper-button{
    top:40%;
}
.elementor-counter .elementor-counter-number-wrapper{
    align-items: flex-end;
}
.elementor-counter .elementor-counter-number-suffix{

}
.elementor-element .elementor-counter-title{
    
}
.Scard {
    background-color: #ffffff;
    border: 1px solid #e1e4e8;
    /* 옅은 테두리 */
    border-radius: 12px;
    /* 둥근 모서리 */
    padding: 24px;
    margin-bottom: 12px;
    /* 카드 간 간격 */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 110px;
    /* 최소 높이 설정 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
    /* 아주 은은한 그림자 */
}

/* 카드 제목 */
.Scard-title {
    font-size: 16px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
}

/* 카드 설명 (회색 텍스트) */
.Scard-desc {
    font-size: 14px;
    color: #707070;
    font-weight: 400;
}

/* 카드 금액 (우측 하단 파란색) */
.Scard-amount {
    text-align: right;
    font-size: 16px;
    font-weight: 700;
    color: #2b7bfb;
    /* 포인트 블루 컬러 */
    margin-top: 20px;
    /* 위 텍스트와의 간격 확보 */
}

/* 하단 합계 영역 */
.total-summary {
    text-align: center;
    margin-top: 30px;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
}

/* 합계 금액 강조 */
.total-summary .highlight {
    color: #0055ff;
}

.button-width-100 a {
    width: 100% !important;
}

.custom-container-justify-content {
    justify-content: space-between;
}

.custom-accordion .e-n-accordion-item .e-n-accordion-item-title[aria-expanded="true"] {
    border-radius: 20px 20px 0px 0px;
}

.post-timeline .uael-post__title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.policy-link{
    color: #1a7efb;
}


/* responsive */
@media (max-width: 700px) {
    .benefit-tabs {
        gap: 24px;
    }
}

@keyframes scroll-wiggle {
    0% {
        transform: translateY(0);
    }

    7% {
        transform: translateY(-6px);
    }

    15% {
        transform: translateY(2px);
    }

    24% {
        transform: translateY(-12px);
    }

    33% {
        transform: translateY(4px);
    }

    45% {
        transform: translateY(-9px);
    }

    57% {
        transform: translateY(3px);
    }

    70% {
        transform: translateY(-14px);
    }

    82% {
        transform: translateY(5px);
    }

    92% {
        transform: translateY(-7px);
    }

    100% {
        transform: translateY(0);
    }
}

/* 불규칙한 움직임 애니메이션 정의 */
@keyframes randomFloat {
    0% {
        transform: translateY(0);
    }

    20% {
        transform: translateY(-15px);
    }

    40% {
        transform: translateY(-5px);
    }

    60% {
        transform: translateY(-20px);
    }

    80% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0);
    }
}

/* 해당 요소에 적용 */
.elementor-element-95d70f6 {
    animation: randomFloat 6s ease-in-out infinite;
    /* 6s: 전체 사이클이 6초 (길게 잡아서 패턴이 덜 보이게) */
}
.service-section .elementor-image-box-img {
    margin-bottom:0 !important;
}
@media (prefers-reduced-motion: reduce) {
    .scroll-down-icon {
        animation: none;
    }
}

@media (max-width: 1024px) {
    .wrap-youtube {
        margin: 0 0px;
        width: 100% !important;
        overflow: hidden;
    }
}

@media (min-width: 768px) {
    .pc-none {
        display: none;
    }
}

@media (max-width: 768px) {
    .mo-none {
        display: none;
    }
    .service-section .elementor-image-box-img {
        margin-bottom:20px !important;
    }
}

@media (max-width: 540px) {
    .wrap-table p {
        font-size: 12px;
    }

    .se-tr>.se-cell+.se-cell {
        width: 34% !important;
    }

    .custom-buttom-mb a {
        width: 100% !important;
    }
}

@media (max-width: 1200px) {
    .hide-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hide-pc {
        display: none !important;
    }
}

@media (max-width: 1240px) {
    .benefit-tabs-wrapper {
        width: 100%;
    }
}
   /* 컨테이너 스타일 */
   #refund-toast-wrapper {
    position: fixed;
    bottom:100px;
    left:0;
    z-index:999;
    width: 100%;
    height: 60px; /* 알림창 높이에 맞춰 조절 가능 */
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center; /* 필요시 left 등으로 변경 */
}

/* 알림 박스 스타일 (기존 디자인 참조) */
.refund-toast-item {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: rgba(0, 0, 0, 0.7); /* 배경색 예시 */
    border-radius: 50px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    
    /* 애니메이션 초기 상태 */
    opacity: 0;
    transform: translateY(20px); /* 아래에서 시작 */
    transition: all 0.5s ease-out;
}

/* 알림 활성화 상태 (나타남) */
.refund-toast-item.active {
    opacity: 1;
    transform: translateY(0);
}

/* 텍스트 스타일 */ 
.refund-toast-text {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    white-space: nowrap;
}

/* 아이콘 스타일 */
.refund-toast-icon {
    width: 12px;
    height: 10px;
    display: flex;
}
.right_quick {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 999;
    width: 42px;
}
.right_quick  ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.right_quick  ul li{
    margin-bottom: 10px;
}
.right_quick  ul li a{
    display: block;
    width: 100%;
    height: 100%;
}
.right_quick  ul li img{
    width:100%;
    vertical-align: middle;
    border-radius: 5px;
}