/* 활성화된 메뉴의 글자 색상 변경 */
.primary-menu .menu-item.current .menu-link div {
    color: #642fe6 !important; /* 원하는 포인트 색상으로 변경 */
	
	
	/* ==========================================================
       카페24 웹사이트용 챗봇 위젯 스타일 (왼쪽 하단 고정)
       ========================================================== */
    #cafe24-chatbot-root {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      font-size: 14px;
      line-height: 1.5;
      color: #1f2937;
      box-sizing: border-box;
    }
    #cafe24-chatbot-root * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    /* 1. 왼쪽 하단 플로팅 버튼 */
    .chatbot-toggle-btn {
      position: fixed;
      bottom: 24px;
      left: 24px;
      z-index: 999999;
      width: 60px;
      height: 60px;
      border-radius: 30px;
      background: linear-gradient(135deg, #4f46e5 0%, #3b82f6 100%);
      color: #ffffff;
      border: none;
      box-shadow: 0 10px 25px -5px rgba(79, 70, 229, 0.4), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.25s ease;
    }
    .chatbot-toggle-btn:hover {
      transform: scale(1.08);
      box-shadow: 0 14px 28px -4px rgba(79, 70, 229, 0.5);
    }
    .chatbot-toggle-btn svg {
      width: 28px;
      height: 28px;
      fill: currentColor;
    }

    /* 알림 배지 */
    .chatbot-badge {
      position: absolute;
      top: 2px;
      right: 2px;
      width: 14px;
      height: 14px;
      background-color: #ef4444;
      border: 2px solid #ffffff;
      border-radius: 50%;
    }

    /* 2. 챗봇 팝업 윈도우 (왼쪽 하단 고정) */
    .chatbot-window {
      position: fixed;
      bottom: 96px;
      left: 24px;
      z-index: 999999;
      width: 370px;
      max-width: calc(100vw - 48px);
      height: 520px;
      max-height: calc(100vh - 120px);
      background-color: #ffffff;
      border-radius: 20px;
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.05);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      opacity: 0;
      visibility: hidden;
      transform: translateY(20px) scale(0.95);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .chatbot-window.open {
      opacity: 1;
      visibility: visible;
      transform: translateY(0) scale(1);
    }

    /* 헤더 */
    .chatbot-header {
      background: linear-gradient(135deg, #4f46e5 0%, #3b82f6 100%);
      color: #ffffff;
      padding: 16px 20px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .chatbot-header-info {
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .chatbot-avatar {
      width: 36px;
      height: 36px;
      background-color: rgba(255, 255, 255, 0.2);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
    }
    .chatbot-title-box h3 {
      font-size: 15px;
      font-weight: 600;
      color: #ffffff;
    }
    .chatbot-status {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      color: rgba(255, 255, 255, 0.85);
    }
    .status-dot {
      width: 8px;
      height: 8px;
      background-color: #22c55e;
      border-radius: 50%;
      box-shadow: 0 0 8px #22c55e;
    }
    .chatbot-close-btn {
      background: none;
      border: none;
      color: #ffffff;
      opacity: 0.8;
      cursor: pointer;
      padding: 4px;
      border-radius: 6px;
      transition: opacity 0.2s;
    }
    .chatbot-close-btn:hover {
      opacity: 1;
    }

    /* 대화 영역 */
    .chatbot-messages {
      flex: 1;
      padding: 16px;
      overflow-y: auto;
      background-color: #f9fafb;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .chat-bubble {
      max-width: 82%;
      padding: 10px 14px;
      border-radius: 16px;
      font-size: 13.5px;
      line-height: 1.5;
      word-break: break-word;
      white-space: pre-wrap;
    }

    .chat-bubble.bot {
      align-self: flex-start;
      background-color: #ffffff;
      color: #1f2937;
      border: 1px solid #e5e7eb;
      border-bottom-left-radius: 4px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    }

    .chat-bubble.user {
      align-self: flex-end;
      background-color: #4f46e5;
      color: #ffffff;
      border-bottom-right-radius: 4px;
    }

    /* 로딩 애니메이션 */
    .typing-indicator {
      display: flex;
      gap: 4px;
      padding: 6px 10px;
    }
    .typing-dot {
      width: 6px;
      height: 6px;
      background-color: #9ca3af;
      border-radius: 50%;
      animation: typingBounce 1.4s infinite ease-in-out both;
    }
    .typing-dot:nth-child(1) { animation-delay: -0.32s; }
    .typing-dot:nth-child(2) { animation-delay: -0.16s; }

    @keyframes typingBounce {
      0%, 80%, 100% { transform: scale(0); }
      40% { transform: scale(1); }
    }

    /* 추천 질문 칩 */
    .chatbot-suggestions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 4px;
    }
    .suggestion-chip {
      background-color: #eef2ff;
      color: #4f46e5;
      border: 1px solid #c7d2fe;
      padding: 6px 10px;
      border-radius: 20px;
      font-size: 12px;
      cursor: pointer;
      transition: all 0.2s;
    }
    .suggestion-chip:hover {
      background-color: #4f46e5;
      color: #ffffff;
    }

    /* 입력 하단바 */
    .chatbot-input-area {
      padding: 12px 16px;
      background-color: #ffffff;
      border-top: 1px solid #f3f4f6;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .chatbot-input {
      flex: 1;
      border: 1px solid #e5e7eb;
      border-radius: 24px;
      padding: 10px 16px;
      font-size: 13.5px;
      outline: none;
      transition: border-color 0.2s;
    }
    .chatbot-input:focus {
      border-color: #4f46e5;
    }
    .chatbot-send-btn {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background-color: #4f46e5;
      color: #ffffff;
      border: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background-color 0.2s, transform 0.1s;
    }
    .chatbot-send-btn:hover {
      background-color: #4338ca;
    }
    .chatbot-send-btn:active {
      transform: scale(0.95);
    }
    .chatbot-send-btn svg {
      width: 18px;
      height: 18px;
      fill: currentColor;
    }

    /* 반응형 스타일 */
    @media (max-width: 480px) {
      .chatbot-toggle-btn {
        left: 16px;
        bottom: 16px;
      }
      .chatbot-window {
        left: 16px;
        bottom: 84px;
        width: calc(100vw - 32px);
        height: 480px;
      }
    }


.table {}
.table tr th { padding:10px 4px; }
.table tr td { padding:10px 4px; }
.table tr th.th-width { font-size:14px; max-width:70px !important; min-width:70px !important; width:70px !important;  }
}

.form-check .form-check-label { font-size:14px !important; margin-bottom:0px !important;}
.form-check .form-check-label1 { font-size:17px !important; margin-bottom:0px !important;}

@media (max-width: 1024px) {
    .side-panel-trigger.header-misc-icon {
        display: block !important;
    }
}


/* ── Reveal polish ── */
[data-animate] { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
	.cc-stickybar { transition: none; }
}


.section {
	margin-top: 0;
	margin-bottom: 0;
}

/* 색상변경 */

.bg-overlay-bg {
    background-color: rgba(250, 90, 20, 0.8) !important; 
}


/* floating 을 해제하기 위한 클래스 추가, 의미없는 clear만 있는 gabage source 제거 */
.clearfix:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix {display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix {height: 1px; }
.clearfix {display: block;}
/* End hide from IE-mac */

.letter_spacing-0 { letter-spacing:0px !important; }
.letter_spacing-1 { letter-spacing:-1px !important; }
.letter_spacing-2 { letter-spacing:-0.08em !important; }
.letter_spacing-3 { letter-spacing:-3px !important; }
.letter_spacing-4 { letter-spacing:-4px !important; }

.lineheight14 { line-height:14px !important; }
.lineheight15 { line-height:15px !important; }
.lineheight16 { line-height:16px !important; }
.lineheight17 { line-height:17px !important; }
.lineheight18 { line-height:18px !important; }
.lineheight19 { line-height:19px !important; }
.lineheight20 { line-height:20px !important; }
.lineheight21 { line-height:21px !important; }
.lineheight22 { line-height:22px !important; }
.lineheight23 { line-height:23px !important; }
.lineheight24 { line-height:24px !important; }
.lineheight25 { line-height:25px !important; }
.lineheight26 { line-height:26px !important; }
.lineheight27 { line-height:27px !important; }
.lineheight28 { line-height:28px !important; }
.lineheight29 { line-height:29px !important; }
.lineheight30 { line-height:30px !important; }
.lineheight31 { line-height:31px !important; }
.lineheight32 { line-height:32px !important; }

.lineheight40 { line-height:40px !important; }
.lineheight46 { line-height:46px !important; }
.lineheight50 { line-height:50px !important; }
.lineheight60 { line-height:60px !important; }
.lineheight66 { line-height:66px !important; }

.opacity1 { opacity: 0.1 !important; }
.opacity2 { opacity: 0.2 !important; }
.opacity3 { opacity: 0.3 !important; }
.opacity4 { opacity: 0.4 !important; }
.opacity5 { opacity: 0.5 !important; }
.opacity6 { opacity: 0.6 !important; }
.opacity7 { opacity: 0.7 !important; }
.opacity8 { opacity: 0.8 !important; }
.opacity9 { opacity: 0.9 !important; }
.opacity10 { opacity: 1 !important; }


.bgcolor_gray { background:#e9ecef !important;}
.bgcolor_gray1 { background:#f1f1f1 !important;}
.bgcolor_gray2 { background:#f5f5f5 !important;}
.bgcolor_blue { background:#e7f2f7 !important;}
.bgcolor_yellow { background:#fcf8e3 !important;}
.bgcolor_yellow1 { background:#f3f0e4 !important;}
.bgcolor_main { background:#0b339c !important;}
.bgcolor_white { background:#ffffff !important;}
.bgcolor_com { background:#F3EDE4 !important;}

.border-radius-0 { border-radius:0px !important;}
.border-radius-1 { border-radius:1px !important;}
.border-radius-2 { border-radius:2px !important;}
.border-radius-3 { border-radius:3px !important;}
.border-radius-4 { border-radius:4px !important;}
.border-radius-5 { border-radius:5px !important;}
.border-radius-10 { border-radius:10px !important;}

.border1 { border:1px solid #ddd;}

.radius-left-none { border-radius: 0px 10px 10px 0px !important;}
.radius-right-none { border-radius: 10px 0px 0px 10px !important;}
.radius-none { border-radius: 0 !important;}

.t300 { font-weight: 300 !important; }
.t400 { font-weight: 400 !important; }
.t500 { font-weight: 500 !important; }
.t600 { font-weight: 600 !important; }
.t700 { font-weight: 700 !important; }

.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-center { text-align: center !important; }

.text-over { display: block; overflow:hidden;white-space:nowrap;text-overflow:ellipsis; width: 100%;}
.text-over1 { overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;line-height:1.5em;max-height:1.5em}
.text-over2 { overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.5em;min-height:3em}
.text-over3 { overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;line-height:1.5em;min-height:4.5em}

.text-short100 {width:100px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.text-short200 {width:200px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.text-short300 {width:300px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.text-short400 {width:400px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.text-short500 {width:500px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.text-short600 {width:600px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}

.width10 { width:10% !important;}
.width15 { width:15% !important;}
.width16 { width:16.666666666666% !important;}
.width17 { width:17.5% !important;}
.width20 { width:20% !important;}
.width24 { width:24.3% !important;}
.width25 { width:25% !important;}
.width30 { width:30% !important;}
.width40 { width:40% !important;}
.width50 { width:50% !important;}
.width60 { width:60% !important;}
.width70 { width:70% !important;}
.width80 { width:80% !important;}
.width90 { width:90% !important;}
.width100 { width:100% !important;}

.height5 { height:5px !important;}
.height10 { height:10px !important;}
.height20 { height:20px !important;}
.height30 { height:30px !important;}
.height40 { height:40px !important;}
.height50 { height:50px !important;}
.height60 { height:60px !important;}
.height70 { height:70px !important;}
.height80 { height:80px !important;}
.height90 { height:90px !important;}
.height100 { height:100px !important;}

.w50 { width:50px !important; }
.w60 { width:60px !important; }
.w70 { width:70px !important; }
.w80 { width:80px !important; }
.w90 { width:90px !important; }
.w100 { width:100px !important; }
.w110 { width:110px !important; }
.w120 { width:120px !important; }
.w130 { width:130px !important; }
.w140 { width:140px !important; }
.w150 { width:150px !important; }
.w160 { width:160px !important; }
.w170 { width:170px !important; }
.w180 { width:180px !important; }
.w190 { width:190px !important; }
.w200 { width:200px !important; }
.w210 { width:210px !important; }
.w220 { width:220px !important; }
.w230 { width:230px !important; }
.w240 { width:240px !important; }
.w250 { width:250px !important; }
.w260 { width:260px !important; }
.w270 { width:270px !important; }
.w280 { width:280px !important; }
.w290 { width:290px !important; }
.w300 { width:300px !important; }
.w310 { width:310px !important; }
.w320 { width:320px !important; }
.w330 { width:330px !important; }
.w340 { width:340px !important; }
.w350 { width:350px !important; }
.w360 { width:360px !important; }
.w370 { width:370px !important; }
.w380 { width:380px !important; }
.w390 { width:390px !important; }
.w400 { width:400px !important; }
.w500 { width:500px !important; }
.w600 { width:600px !important; }


.mw10 { min-width:10px !important; }
.mw20 { min-width:20px !important; }
.mw30 { min-width:30px !important; }
.mw40 { min-width:40px !important; }
.mw50 { min-width:50px !important; }
.mw60 { min-width:60px !important; }
.mw70 { min-width:70px !important; }
.mw80 { min-width:80px !important; }
.mw90 { min-width:90px !important; }
.mw100 { min-width:100px !important; }
.mw110 { min-width:110px !important; }
.mw120 { min-width:120px !important; }
.mw130 { min-width:130px !important; }
.mw140 { min-width:140px !important; }
.mw150 { min-width:150px !important; }
.mw160 { min-width:160px !important; }
.mw170 { min-width:170px !important; }
.mw180 { min-width:180px !important; }
.mw190 { min-width:190px !important; }
.mw200 { min-width:200px !important; }
.mw210 { min-width:210px !important; }
.mw220 { min-width:220px !important; }
.mw230 { min-width:230px !important; }
.mw240 { min-width:240px !important; }
.mw250 { min-width:250px !important; }
.mw260 { min-width:260px !important; }
.mw270 { min-width:270px !important; }
.mw280 { min-width:280px !important; }
.mw290 { min-width:290px !important; }
.mw300 { min-width:300px !important; }
.mw310 { min-width:310px !important; }
.mw320 { min-width:320px !important; }
.mw330 { min-width:330px !important; }
.mw340 { min-width:340px !important; }
.mw350 { min-width:350px !important; }
.mw360 { min-width:360px !important; }
.mw370 { min-width:370px !important; }
.mw380 { min-width:380px !important; }
.mw390 { min-width:390px !important; }
.mw400 { min-width:400px !important; }
.mw500 { min-width:500px !important; }
.mw600 { min-width:600px !important; }


.padding2 {padding: 2px 2px 2px 2px !important;}
.padding5 {padding: 10px 5px 10px 5px !important;}
.padding10 {padding: 10px !important;}
.padding15 {padding: 15px !important;}
.padding20 {padding: 20px !important;}
.padding30 {padding: 30px !important;}
.padding40 {padding: 40px !important;}
.padding50 {padding: 50px !important;}

.paddingtop0 {padding-top: 0px !important;}
.paddingtop5 {padding-top: 5px !important;}
.paddingtop8 {padding-top: 8px !important;}
.paddingtop9 {padding-top: 9px !important;}
.paddingtop10 {padding-top: 10px !important;}
.paddingtop15 {padding-top: 15px !important;}
.paddingtop20 {padding-top: 20px !important;}
.paddingtop30 {padding-top: 30px !important;}
.paddingtop40 {padding-top: 40px !important;}
.paddingtop50 {padding-top: 50px !important;}

.paddingbot5 {padding-bottom: 5px !important;}
.paddingbot8 {padding-bottom: 8px !important;}
.paddingbot10 {padding-bottom: 10px !important;}
.paddingbot15 {padding-bottom: 15px !important;}
.paddingbot20 {padding-bottom: 20px !important;}
.paddingbot30 {padding-bottom: 30px !important;}
.paddingbot40 {padding-bottom: 40px !important;}
.paddingbot50 {padding-bottom: 50px !important;}
.paddingbot60 {padding-bottom: 60px !important;}
.paddingbot70 {padding-bottom: 70px !important;}
.paddingbot80 {padding-bottom: 80px !important;}
.paddingbot90 {padding-bottom: 90px !important;}

.clear-paddingleft {padding-left:0px !important;}
.clear-paddingright {padding-right:0px !important;}
.clear-paddingtop {padding-top:0px !important;}
.clear-paddingbot {padding-bottom:0px !important;}

.paddingleft2 {padding-left:2px !important;}
.paddingleft5 {padding-left:5px !important;}
.paddingleft10 {padding-left:10px !important;}
.paddingleft15 {padding-left:15px !important;}
.paddingleft20 {padding-left:20px !important;}

.paddingright2 {padding-right:2px !important;}
.paddingright5 {padding-right:5px !important;}
.paddingright10 {padding-right:10px !important;}
.paddingright15 {padding-right:15px !important;}
.paddingright20 {padding-right:20px !important;}
.paddingright100 {padding-right:100px !important;}

.clear-marginbot{ margin-bottom:0 !important;}

.margin5 { margin-top:5px !important; margin-bottom:5px !important; margin-left:10px !important; margin-right:10px !important;}

.marginbot0{	margin-bottom:0px !important;}
.marginbot5{	margin-bottom:5px !important;}
.marginbot10{ margin-bottom:10px !important;}
.marginbot15{ margin-bottom:15px !important;}
.marginbot20{ margin-bottom:20px !important;}
.marginbot25{ margin-bottom:25px !important;}
.marginbot30{ margin-bottom:30px !important;}
.marginbot35{ margin-bottom:35px !important;}
.marginbot40{ margin-bottom:40px !important;}
.marginbot45{ margin-bottom:45px !important;}
.marginbot50{ margin-bottom:50px !important;}
.marginbot55{ margin-bottom:55px !important;}
.marginbot100{ margin-bottom:50px !important;}

.clear-margintop{ margin-top:0 !important;}
.margintop0{	margin-top:0px !important;}
.margintop3{	margin-top:3px !important;}
.margintop5{	margin-top:5px !important;}
.margintop7{ margin-top:7px !important;}
.margintop8{ margin-top:8px !important;}
.margintop10{ margin-top:10px !important;}
.margintop15{ margin-top:15px !important;}
.margintop16{ margin-top:16px !important;}
.margintop17{ margin-top:17px !important;}
.margintop18{ margin-top:18px !important;}
.margintop19{ margin-top:19px !important;}
.margintop20{ margin-top:20px !important;}
.margintop30{ margin-top:30px !important;}
.margintop40{ margin-top:40px !important;}
.margintop50{ margin-top:50px !important;}
.margintop100{ margin-top:100px !important;}

.clear-marginleft { margin-left:0 !important;}
.marginleft0{ margin-left:0px !important;}
.marginleft5{ margin-left:5px !important;}
.marginleft10{ margin-left:10px !important;}
.marginleft15{ margin-left:15px !important;}
.marginleft20{ margin-left:20px !important;}
.marginleft25{ margin-left:25px !important;}
.marginleft30{ margin-left:30px !important;}
.marginleft35{ margin-left:35px !important;}
.marginleft40{ margin-left:40px !important;}
.marginleft45{ margin-left:45px !important;}
.marginleft50{ margin-left:50px !important;}
.marginleft55{ margin-left:55px !important;}
.marginleft120{ margin-left:120px !important;}

.clear-marginright {margin-right:0 !important;}
.marginright0	{margin-right:0px !important;}
.marginright5	{margin-right:5px !important;}
.marginright10	{margin-right:10px !important;}
.marginright15	{margin-right:15px !important;}
.marginright20	{margin-right:20px !important;}
.marginright25	{margin-right:25px !important;}
.marginright30	{margin-right:30px !important;}
.marginright35	{margin-right:35px !important;}
.marginright40	{margin-right:40px !important;}
.marginright45	{margin-right:45px !important;}
.marginright50	{margin-right:50px !important;}
.marginright55	{margin-right:55px !important;}

.fontsize8 {font-size:8px !important;}
.fontsize9 {font-size:9px !important;}
.fontsize10 {font-size:10px !important;}
.fontsize11 {font-size:11px !important;}
.fontsize12 {font-size:12px !important;}
.fontsize13 {font-size:13px !important;}
.fontsize14 {font-size:14px !important;}
.fontsize15 {font-size:15px !important;}
.fontsize16 {font-size:16px !important;}
.fontsize17 {font-size:17px !important;}
.fontsize18 {font-size:18px !important;}
.fontsize19 {font-size:19px !important;}
.fontsize20 {font-size:20px !important;}
.fontsize21 {font-size:21px !important;}
.fontsize22 {font-size:22px !important;}
.fontsize23 {font-size:23px !important;}
.fontsize24 {font-size:24px !important;}
.fontsize25 {font-size:25px !important;}
.fontsize26 {font-size:26px !important;}
.fontsize27 {font-size:27px !important;}
.fontsize28 {font-size:28px !important;}
.fontsize29 {font-size:29px !important;}
.fontsize30 {font-size:30px !important;}
.fontsize31 {font-size:31px !important;}
.fontsize32 {font-size:32px !important;}
.fontsize33 {font-size:33px !important;}
.fontsize34 {font-size:34px !important;}
.fontsize35 {font-size:35px !important;}
.fontsize36 {font-size:36px !important;}
.fontsize37 {font-size:37px !important;}
.fontsize38 {font-size:38px !important;}
.fontsize39 {font-size:39px !important;}
.fontsize40 {font-size:40px !important;}
.fontsize41 {font-size:41px !important;}
.fontsize42 {font-size:42px !important;}
.fontsize43 {font-size:43px !important;}
.fontsize44 {font-size:44px !important;}
.fontsize45 {font-size:45px !important;}
.fontsize46 {font-size:46px !important;}
.fontsize47 {font-size:47px !important;}
.fontsize48 {font-size:48px !important;}
.fontsize49 {font-size:49px !important;}
.fontsize50 {font-size:50px !important;}

.fontsize-bold12 {font-size:12px; font-weight:bold !important;}
.fontsize-bold13 {font-size:13px; font-weight:bold !important}
.fontsize-bold14 {font-size:14px; font-weight:bold !important;}
.fontsize-bold15 {font-size:15px; font-weight:bold !important;}
.fontsize-bold16 {font-size:16px; font-weight:bold !important;}
.fontsize-bold17 {font-size:17px; font-weight:bold !important;}
.fontsize-bold18 {font-size:18px; font-weight:bold !important;}
.fontsize-bold19 {font-size:19px; font-weight:bold !important;}
.fontsize-bold20 {font-size:20px; font-weight:bold !important;}
.fontsize-bold21 {font-size:21px; font-weight:bold !important;}
.fontsize-bold22 {font-size:22px; font-weight:bold !important;}
.fontsize-bold23 {font-size:23px; font-weight:bold !important;}
.fontsize-bold24 {font-size:24px; font-weight:bold !important;}
.fontsize-bold25 {font-size:25px; font-weight:bold !important;}


.fontcolor_red {color:#e22113 !important;}
.fontcolor_blue {color:#3675de !important;}
.fontcolor_white {color:#fff !important;}


.fontcolor-default {color:#41200b !important;}
.fontcolor-red {color:#e22113 !important;}
.fontcolor-blue {color:#3675de !important;}
.fontcolor-orange {color:#fa6f13 !important;}
.fontcolor-black {color:#000 !important;}
.fontcolor-white {color:#fff !important;}
.fontcolor-222 {color:#222 !important;}
.fontcolor-gray {color:#666 !important;}
.fontcolor-808080 {color:#808080 !important;}
.fontcolor-666 {color:#666 !important;}
.fontcolor-ddd {color:#ddd !important;}
.fontcolor-bbb {color:#bbbbbb !important;}
.fontcolor-mint1 {color:#19dec3 !important;}
.fontcolor-mint2 {color:#3ab4a5 !important;}
.fontcolor-mint3 {color:#ddd !important;}
.fontcolor-brown {color:#ae817f !important;}
.fontcolor-themedark { color:var(--cc-themedark);}

.fontbold { font-weight:bold;}

.responsive-container-img {
  width: 100%; /* 부모 컨테이너 너비에 따라 크기 조정 */
  aspect-ratio: 16 / 12; /* 원하는 비율 설정 (예: 16:9) */
  overflow: hidden; /* 넘치는 내용 숨기기 */
}

.responsive-container-img img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 비율 유지하며 잘라내기 */
}

.responsive-container-img-square {
  width: 100%; /* 부모 컨테이너 너비에 따라 크기 조정 */
  aspect-ratio: 16 / 16; /* 원하는 비율 설정 (예: 16:9) */
  overflow: hidden; /* 넘치는 내용 숨기기 */
}

.responsive-container-img-square img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 비율 유지하며 잘라내기 */
}

.line10 { clear: both; position: relative; width: 100%; margin: 10px 0; border-top: 1px solid #ddd; }
.line-zero { border: none; height: 1px; background-color: #f37124; margin: 0; padding: 0; }
.line-zero-white { border: none; height: 1px; background-color: #FFF; margin: 0; padding: 0; }
.line-zero-black { border: none; height: 1px; background-color: #000; margin: 0; padding: 0; }

.floatright { float:right; }
.floatleft { float:left; }
.floatnone { float:none; }

.title_line { border-bottom: 1px solid #ddd; font-size: 19px; font-weight: 600; margin:10px 0 10px 0; padding: 0 0 5px; position: relative; letter-spacing:-1px; }
.title_line span { position: absolute; right:0px; margin-top:5px;}


.btn{
    color: #fff;
}
.btn-default{
    background:#2e3092;
    color:#fff !important;
    border:none;
    border-radius:4px;
    transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
}
.btn-default:hover{
    background:#12135f;
    color:#fff !important;
}

.btn-member{
    background:#000;
    color:#fff !important;
    border:none;
    border-radius:4px;
    transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
}
.btn-member:hover{
    background:#393838;
    color:#fff !important;
}

.btn-find{
    background:#5e5d5d;
    color:#fff !important;
    border:none;
    border-radius:4px;
    transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
}
.btn-find:hover{
    background:#7c7c7c;
    color:#fff !important;
}

.btn-list1{
    background:#6e767d;
    color:#fff !important;
    border:none;
    border-radius:2px;
    transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
}
.btn-list1:hover{
    background:#545e66;
    color:#fff !important;
}

.btn-normal1 {
    background-color:#2e3092;
}

.btn-normal2 {
    background-color:#3453a2;
}

.btn-normal3 {
    background-color:#2abbe3;
}

.btn-normal4 {
    background-color:#2abbe3;
}

.btn-normal5 {
    background-color:#2abbe3;
}

.btn-normal6 {
    background-color:#4f4f4f;
}

.btn-normal7 {
    background-color:#e30404;
}

.btn-normal1:hover,
.btn-normal2:hover,
.btn-normal3:hover,
.btn-normal4:hover,
.btn-normal5:hover,
.btn-normal6:hover,
.btn-normal7:hover
{
    background:#333333 !important;
    color:#FFFFFF !important;
}

.btn-login-side {
  color: #000 !important;
  font-size: 16px;
  padding:5px 10px;
  font-weight: 500;
  letter-spacing: -0.05em;
  border-radius: 50px;
  background-color: #FFF;
  border-color: #ddd;
}

.btn-login-side:hover {
  color: #FFF !important;
  background-color: #555555;
  border-color: #555555;
}

.flow-btn {
  background: linear-gradient(270deg, #f37124, #d2570d, #d22e0d, #d2810d);
  background-size: 400% 400%;
  animation: gradientFlow 6s ease infinite;
}

@keyframes gradientFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.flow-btn-orange {
  /* #f37124를 중심으로 한 그라데이션 */
  background: linear-gradient(270deg, #ff8c42, #f37124, #e05e00, #ff4800);
  background-size: 400% 400%;
  animation: gradientFlowOrange 6s ease infinite;
  /* 버튼 텍스트가 잘 보이도록 살짝 그림자 추가 */
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

@keyframes gradientFlowOrange {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


.shimmer-btn-orange {
  position: relative;
  overflow: hidden;
  background-color: #E4572E; 
}

/* 빛 효과 레이어 */
.shimmer-btn-orange::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  /* 투명도가 들어간 하얀색 대각선 그라데이션 */
  background: linear-gradient(
    60deg,
    transparent 30%,
    rgba(255, 255, 255, 0.9) 60%, /* 빛의 밝기 조절 */
    transparent 70%
  );
  transform: rotate(30deg) translateX(-100%);
  animation: shimmerOrange 3s infinite;
}

@keyframes shimmerOrange {
  0% { transform: rotate(30deg) translateX(-100%); }
  50% { transform: rotate(30deg) translateX(100%); }
  100% { transform: rotate(30deg) translateX(100%); }
}


/* board item card */
.board-item {
  border: 0px solid var(--at-neutral-100, #dfdfdf);
  border-radius: 0.5rem;
  min-height: 177px;
  overflow: hidden;
  background: var(--at-neutral-0, #fefefe);
  transition: box-shadow 0.2s ease;
}
.board-item:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}
.board-item__inner {
  padding: 9px 39px;
  min-height: 177px;
}
.board-item__left {
  gap: 29px;
}
.board-item__check-label {
  cursor: pointer;
  flex-shrink: 0;
}
.board-item__check-wrap {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--at-neutral-100, #dfdfdf);
  border-radius: 4px;
  background: var(--at-neutral-0, #fefefe);
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.board-item__check-icon {
  width: 10px;
  height: 9px;
  opacity: 0;
  transition: opacity 0.2s ease;
  -o-object-fit: contain;
     object-fit: contain;
}
.board-item .board-item-check:checked + .board-item__check-wrap {
  background: var(--at-neutral-900, #1d1d1d);
  border-color: var(--at-neutral-900, #1d1d1d);
}
.board-item .board-item-check:checked + .board-item__check-wrap .board-item__check-icon {
  opacity: 1;
  filter: brightness(0) invert(1);
}
.board-item__main {
  gap: 23px;
}
.board-item__img-wrap {
  width: 140px;
  height: 159px;
  flex-shrink: 0;
  border-radius: 8px;
  background: var(--at-neutral-50, #f2f2f2);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.board-item__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.board-item__info {
  display: flex;
  flex-direction: column;
  gap: 13px;
  min-width: 0;
  max-width: 306px;
}
.board-item__title {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -1.2px;
  line-height: 1;
  color: var(--at-neutral-900, #1d1d1d);
  margin: 0;
}
.board-item__meta {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.28px;
  color: var(--at-neutral-500, #585959);
  margin: 0;
}
.board-item__price {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.9px;
  color: var(--at-neutral-900, #1d1d1d);
  margin: 0;
}
.board-item__right {
  width: 298px;
  flex-shrink: 0;
}
.board-item__qty {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 155px;
  height: 50px;
  padding: 0 19.5px;
  border: 1px solid var(--at-neutral-100, #dfdfdf);
  border-radius: 100px;
  background: var(--at-neutral-0, #fefefe);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.36px;
  color: var(--at-neutral-900, #1d1d1d);
}
.board-item-qty-minus, .board-item-qty-plus {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  color: inherit;
  font-size: inherit;
  cursor: pointer;
  transition: opacity 0.2s ease;
  padding: 0;
  line-height: 1;
}
.board-item-qty-minus:hover, .board-item-qty-plus:hover {
  opacity: 0.7;
}
.board-item-qty-val {
  min-width: 24px;
  text-align: center;
}
.board-item-delete {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  color: var(--at-neutral-900, #1d1d1d);
  cursor: pointer;
  padding: 0;
  transition: color 0.2s ease, opacity 0.2s ease;
}
.board-item-delete:hover {
  opacity: 0.7;
  color: var(--at-neutral-700);
}
.board-item-delete i {
  font-size: 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .board-item__inner {
    padding: 16px 20px;
    flex-wrap: wrap;
    gap: 16px;
  }
  .board-item__right {
    width: 100%;
    justify-content: flex-start;
    gap: 16px;
  }
  .board-item__info {
    max-width: 100%;
  }
  .board-item__title {
    font-size: 20px;
  }
}
@media (max-width: 574.98px) {
  .board-item__inner {
    padding: 12px 16px;
  }
  .board-item__img-wrap {
    width: 100px;
    height: 114px;
  }
  .board-item__left {
    gap: 16px;
  }
  .board	-item__main {
    gap: 12px;
  }
}


.terms-box {
height: 200px;
overflow-y: auto;
background-color: #f8f9fa;
border: 1px solid #dee2e6;
padding: 1.25rem;
font-size: 0.9rem;
line-height: 1.6;
}
.terms-box .text-danger {
font-weight: bold;
}

#refresh-indicator {
position: fixed;
top: -50px;
left: 0;
width: 100%;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
background-color: #f1f3f5;
font-size: 14px;
color: #495057;
transition: transform 0.2s ease;
z-index: 999;
}


#toast-message {
    visibility: hidden;
    min-width: 280px;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    padding: 12px;
    position: absolute;
    z-index: 1000;
    left: 50%;
    bottom: 320px;
    transform: translateX(-50%);
    font-size: 13px;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
#toast-message.show {
    visibility: visible;
    opacity: 1;
}