@charset "utf-8";

* {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  font-family: "Pretendard Variable", "Noto Sans KR", sans-serif;
}

@font-face {
  font-family:
    "Pretendard Variable",
    Pretendard,
    -apple-system,
    BlinkMacSystemFont,
    system-ui,
    Roboto,
    "Helvetica Neue",
    "Segoe UI",
    "Apple SD Gothic Neo",
    "Noto Sans KR",
    "Malgun Gothic",
    "Apple Color Emoji",
    "Segoe UI Emoji",
    "Segoe UI Symbol",
    sans-serif;
}

*,
:after,
:before {
  box-sizing: border-box;
  flex-shrink: 0;
}

:root {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  cursor: default;
  line-height: 1.5;
  overflow-wrap: break-word;
  -moz-tab-size: 4;
  tab-size: 4;

  /* === Brand concept color === (admin-managed; overridden per-domain by theme-color.jsp) */
  --primary: #306fe1;
  --primary-rgb: 48, 111, 225;

  /* derived shades - auto-computed from --primary via color-mix */
  --primary-btn: color-mix(in srgb, var(--primary) 85%, white);
  --primary-dark: color-mix(in srgb, var(--primary) 82%, black);
  --primary-darker: color-mix(in srgb, var(--primary) 75%, black);
  --primary-light: color-mix(in srgb, var(--primary) 8%, white);
  --primary-light2: color-mix(in srgb, var(--primary) 6%, white);

  /* shadows - reuse --primary-rgb */
  --primary-shadow-xs: rgba(var(--primary-rgb), 0.08);
  --primary-shadow-sm: rgba(var(--primary-rgb), 0.12);
  --primary-shadow: rgba(var(--primary-rgb), 0.15);
  --primary-shadow-md: rgba(var(--primary-rgb), 0.2);
  --primary-shadow-lg: rgba(var(--primary-rgb), 0.22);
  --primary-shadow-hover: rgba(var(--primary-rgb), 0.1);
  --primary-shadow-border: rgba(var(--primary-rgb), 0.25);
  --primary-shadow-pulse: rgba(var(--primary-rgb), 0.6);
  --primary-transparent: rgba(var(--primary-rgb), 0);
}

html,
body {
  height: 100%;
  position: relative;
  font-family: Pretendard Variable;
  color: #1f1f1f;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

canvas {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

button {
  background: none;
  border: 0;
  cursor: pointer;
}

a {
  text-decoration: none;
}

i {
  font-style: normal;
}

dl,
li,
menu,
ol,
ul {
  list-style: none;
}

table {
  border-spacing: 0px;
  border-collapse: separate;
}

select {
  appearance: none;
  background: url("../images/icon/down.svg") no-repeat 98% 50%/15px auto;
  padding-right: 20px;
}

/*--------------------------------------------------------------------------------------
공통
----------------------------------------------------------------------------------------*/
.wrap {
  width: auto;
  height: 100%;
  display: flex;
  flex-direction: row;
}

.pc_wrap {
  width: 360px;
  padding: 20px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pc_head {
  font-size: 15px;
  color: #767676;
}

.pc_head h2 {
  font-size: 28px;
  font-weight: 700;
  color: #000;
  margin-bottom: 5px;
}

.pc_qna {
  background-color: #fff;
  padding: 20px;
  border-radius: 6px;
  margin-top: 20px;
}

.pc_qna .fomr_group .input_group {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}

.pc_qna .fomr_group .input_group label {
  color: #000;
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 6px;
}

.pc_qna .fomr_group .input_group input {
  width: 100%;
  height: 48px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  word-break: keep-all;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
  flex-wrap: wrap;
  color: #3b3b3b;
  background-color: #fff;
}

.pc_qna .form_btn {
  margin-top: 30px;
}

.pc_qna .chk_box {
  display: block;
  position: relative;
  padding-left: 25px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.pc_qna .fomr_group .input_group label.chk_box {
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: #9f9f9f;
  margin-top: 10px;
  font-size: 15px;
}

.pc_qna .chk_box input[type="checkbox"] {
  display: none;
}

.pc_qna .on {
  width: 20px;
  height: 20px;
  background: #e7e8ec;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 3px;
}

.pc_qna .chk_box input[type="checkbox"]:checked + .on {
  background: var(--primary);
}

.pc_qna .on:after {
  content: "";
  position: absolute;
  display: none;
}

.pc_qna .chk_box input[type="checkbox"]:checked + .on:after {
  display: block;
}

.pc_qna .on:after {
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 7px;
  top: 3px;
}

.pc_qna .form_btn button {
  width: 100%;
  border-radius: 12px;
  font-size: 15px;
  padding: 10px;
}

.wrap_contents {
  width: 500px;
  margin: 0 auto;
  height: 100%;
  background-color: #f3f4f7;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

.wrap_contents::-webkit-scrollbar {
  width: 4px;
}

.wrap_contents::-webkit-scrollbar-thumb {
  background: #bbc0c9;
  border-radius: 10px;
}

.wrap_contents::-webkit-scrollbar-track {
  background: rgba(3, 3, 3, 0.1);
}

.pc_qna .m_qna_radio .form_radio_btn label {
  width: 100%;
  justify-content: center;
  font-size: 15px;
  font-weight: 500;
  font-weight: 400;
  color: #a3a3a3;
  margin-bottom: 0;
  border: 1px solid #e1e6ec;
  border-radius: 12px;
  background-color: #fdfdfd;
}

/*컨텐츠*/
section {
  position: relative;
}

main .nav .row {
  position: relative;
  top: 58px;
}

main.normal_b .nav .row {
  top: 0;
  padding-top: 58px;
  position: relative;
  height: 100%;
}

main.normal_b .nav .row .content {
  height: 100%;
  flex-wrap: wrap;
  flex-direction: column;
}

main.normal_b .nav .row .content .write_form {
  flex: 1;
  width: 100%;
}

main .nav .row.n_bg {
  background-color: transparent;
}

main .nav .row .content {
  padding: 20px 15px;
  padding-bottom: 120px;
}

main .nav .row .content.event_wrap {
  padding-bottom: 30px;
}

main .nav .row .content.mypage {
  padding-bottom: 30px;
}

main .nav .row .content.my_qna {
  padding-bottom: 30px;
}

main .nav .row .content.release_del {
  padding-bottom: 170px !important;
}

main .nav .row .content.main_wrap {
  padding-top: 0;
  position: relative;
  top: 20px;
  padding-bottom: 80px;
}

main .nav .row .content.p_0 {
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
}

main .nav .row .content:has(.save_info) {
  padding-bottom: 20px !important;
}

main.normal_b .nav .row .content.p_0 {
  padding-bottom: 0;
}

.wrap_contents .p_b_210:has(> .fix_group_btn) {
  padding-bottom: 120px !important;
}

.middle_title h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
}

.margin_top_10 {
  margin-top: 10px;
}

.margin_top_20 {
  margin-top: 20px;
}

.padding_0 {
  padding: 0 !important;
}

/*--------------------------------------------------------------------------------------
커스텀 라디오 버튼
----------------------------------------------------------------------------------------*/
.form_radio_btn input[type="radio"] {
  display: none;
}

.form_radio_btn input[type="checkbox"] {
  display: none;
}

.form_radio_btn label {
  display: flex;
  width: auto;
  align-items: center;
  height: 48px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  word-break: keep-all;
  border-radius: 8px;
  flex-wrap: wrap;
  color: #3b3b3b;
  background-color: #fff;
  transition: all 0.25s ease;
  border: 1px solid transparent;
  box-sizing: border-box;
}

/* Hover Effect */
.form_radio_btn label:hover {
  background-color: #f8f9fa;
  border-color: var(--primary);
  color: var(--primary);
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(var(--primary-rgb), 0.08);
}

/* radio / checkbox */
.form_radio_btn input[type="radio"]:checked + label,
.form_radio_btn input[type="checkbox"]:checked + label {
  border: 1px solid var(--primary);
  background-color: var(--primary-light);
  font-weight: 700;
  box-sizing: border-box;
  color: var(--primary);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.15);
}

.main_option {
  height: 48px;
  margin-bottom: 15px;
}

.search_option .main_option label img {
  width: 35px;
}

.main_option ul {
  display: flex;
  gap: 4px;
}

.main_option ul.scroll_y {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  box-sizing: border-box;
}

.checkbox_wrap {
  width: 100%;
  white-space: nowrap;
}

.main_option .scroll_y::-webkit-scrollbar {
  height: 0px;
}

.main_option .scroll_y::-webkit-scrollbar-track {
  background-color: #ffffff;
}

.main_option .scroll_y::-webkit-scrollbar-thumb {
  background-color: #e6e6e6;
}

.main_option .scroll_y::-webkit-scrollbar-button {
  display: none;
}

.main_option .ico_all {
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url(../images/icon/ico_all_b.svg);
  background-size: cover;
}

.main_option .scroll_y.checkbox_group input[type="checkbox"]:checked + label i {
  background-image: url(../images/icon/ico_all.svg);
}

.form_radio_btn input[type="radio"]:checked + label .ico_all {
  background-image: url(../images/icon/ico_all.svg);
}

.main_option .checkbox_group li {
  height: 48px;
}

.main_option .scroll_y.checkbox_group {
  width: 100%;
  overflow-y: auto;
  flex-wrap: nowrap;
}

.main_option .checkbox_group input[type="checkbox"] + label {
  padding: 0 10px;
  height: 100%;
  align-items: center;
  font-size: 15px;
}

.sub_option ul {
  display: flex;
  gap: 4px;
  margin-bottom: 6px;
}

.sub_option ul:last-of-type {
  margin-bottom: 0;
}

.sub_option ul li {
  flex: 1 1 33.333333%;
}

.sub_option .form_radio_btn label {
  border-radius: 6px;
  height: 32px;
  justify-content: center;
  align-items: center;
}

/*--------------------------------------------------------------------------------------
햄버거 메뉴
----------------------------------------------------------------------------------------*/
.ham_menu {
  position: relative;
  right: 0;
  top: 0;
  width: 50px;
  height: 100%;
  overflow: hidden;
  margin-left: auto;
}

.overlay.visible {
  opacity: 1;
  visibility: visible;
}

.hamburger_button {
  position: absolute;
  transition: 0.3s ease-in-out;
  width: 20px;
  height: 20px;
  display: block;
  z-index: 1000;
  cursor: pointer;
  right: 0px;
  top: 20px;
}

.hamburger_button span {
  position: absolute;
  height: 1.5px;
  border-radius: 4px;
  width: 100%;
  background-color: #000;
  top: 0;
  transition:
    transform 0.2s ease-in-out,
    opacity 0.2s ease-in-out;
}

.hamburger_button.active span {
  background-color: #fff;
}

.hamburger_button span:nth-child(1) {
  top: 0px;
}

.hamburger_button span:nth-child(2),
.hamburger_button span:nth-child(3) {
  top: 7px;
}

.hamburger_button span:nth-child(4) {
  top: 15px;
}

.hamburger_button.active span:nth-child(1),
.hamburger_button.active span:nth-child(4) {
  opacity: 0;
}

.hamburger_button.active span:nth-child(2) {
  transform: rotate(43deg);
}

.hamburger_button.active span:nth-child(3) {
  transform: rotate(-43deg);
}

.t_menu {
  background-color: var(--primary);
  color: #fff;
  width: 100%;
}

.h_menu {
  height: 57px;
  width: 100%;
  display: flex;
  padding: 15px;
  align-items: center;
}

.h_menu .logo {
  width: 76px;
  height: 20px;
  background-image: url(../images/common/w_main_logo.svg);
  background-repeat: no-repeat;
  background-position: left;
  background-size: contain;
}

.overlay .menu_home {
  width: 30px;
  height: 30px;
  background-image: url(../images/icon/ico_line_home.svg);
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  background-size: contain;
  margin-left: auto;
  padding-left: 90px;
}

.h_url {
  width: 100%;
  display: flex;
  margin-bottom: 30px;
  margin-top: 20px;
  font-size: 14px;
}

.ico_url {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.ico_url i {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin-bottom: 4px;
}

i.ico_ytube {
  background-image: url(../images/icon/ico_w_youtube.svg);
}

i.ico_cafe {
  background-image: url(../images/icon/ico_w_cafe.svg);
}

.ico_url i.ico_kakao {
  background-image: url(../images/icon/ico_w_kakao.svg);
}

.b_menu {
  display: flex;
  flex-direction: column;
  padding: 15px;
  align-items: flex-start;
  font-size: 15px;
  margin-top: 5px;
}

.b_menu li {
  margin-bottom: 30px;
  cursor: pointer;
  font-weight: 500;
  display: flex;
  align-items: center;
  display: none;
}

.b_menu li a {
  display: flex;
  align-items: center;
}

.b_menu li i {
  width: 20px;
  height: 20px;
  margin-right: 8px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

i.ico_car {
  background-image: url(../images/icon/ico_car.svg);
}

i.ico_box {
  background-image: url(../images/icon/ico_box.svg);
}

i.ico_paper {
  background-image: url(../images/icon/ico_paper.svg);
}

i.ico_calculator {
  background-image: url(../images/icon/ico_calculator.svg);
}

i.ico_date {
  background-image: url(../images/icon/ico_date.svg);
}

i.ico_txt {
  background-image: url(../images/icon/ico_txt.svg);
}

i.ico_discount {
  background-image: url(../images/icon/ico_h_discount.svg);
}

i.ico_used {
  background-image: url(../images/icon/ico_used.svg);
}

.overlay {
  position: fixed;
  top: 0;
  right: 50%;
  margin-right: -430px;
  background-color: rgba(0, 0, 0, 0.49);
  display: flex;
  justify-content: flex-end;
  text-align: center;
  width: 500px;
  /* Fixed width */
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s,
    visibility 0.3s;
  /* Transition opacity/visibility only */
  z-index: 999;
}

.overlay .menu {
  width: 60%;
  height: 100%;
  background-color: #fff;
  display: flex;
  flex-direction: column;
}

.overlay.visible {
  opacity: 1;
  visibility: visible;
}

/* Optional: Staggered list item animation */
.overlay.visible li {
  display: block;
  opacity: 0;
  animation: fadeInMenu 0.4s ease forwards;
}

.overlay.visible li:nth-child(1) {
  animation-delay: 0.1s;
}

.overlay.visible li:nth-child(2) {
  animation-delay: 0.15s;
}

.overlay.visible li:nth-child(3) {
  animation-delay: 0.2s;
}

.overlay.visible li:nth-child(4) {
  animation-delay: 0.25s;
}

.overlay.visible li:nth-child(5) {
  animation-delay: 0.3s;
}

.overlay.visible li:nth-child(6) {
  animation-delay: 0.35s;
}

.overlay.visible li:nth-child(7) {
  animation-delay: 0.4s;
}

.overlay.visible li:nth-child(8) {
  animation-delay: 0.45s;
}

@keyframes fadeInMenu {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/*--------------------------------------------------------------------------------------
메인메뉴 - footer_menu
----------------------------------------------------------------------------------------*/
footer {
  width: 500px;
  position: fixed;
  z-index: 85;
  bottom: 0;
  left: 50%;
  margin-left: -70px;
}

.footer_wrap {
  width: 100%;
}

.footer_menu {
  width: 100%;
  height: 82px;
  background-color: #fff;
  border-top: 1px solid #f1f1f1;
}

.footer_menu ul {
  display: flex;
}

.footer_menu ul li {
  display: flex;
  width: 20%;
  height: 82px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  font-size: 11px;
  font-weight: 400;
  color: #b2bdc4;
  cursor: pointer;
  position: relative;
}

.footer_menu ul li.send .menu_text {
  position: relative;
  top: -15px;
  color: var(--primary);
}

.footer_menu ul li.on {
  color: var(--primary);
  font-weight: 600;
}

i.menu_ico {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 24px;
  height: 24px;
  margin-bottom: 5px;
}

.menu_ico.menu_home {
  background-image: url(../images/icon/home.svg);
}

li.on .menu_ico.menu_home {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/home-on.svg) center / contain no-repeat;
  mask: url(../images/icon/home-on.svg) center / contain no-repeat;
}

.menu_ico.menu_self {
  background-image: url(../images/icon/self.svg);
}

li.on .menu_ico.menu_self {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/self-on.svg) center / contain no-repeat;
  mask: url(../images/icon/self-on.svg) center / contain no-repeat;
}

li.on .menu_ico.menu_car {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/search-on.svg) center / contain no-repeat;
  mask: url(../images/icon/search-on.svg) center / contain no-repeat;
}

li.on .menu_ico.menu_message {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/sale-on.svg) center / contain no-repeat;
  mask: url(../images/icon/sale-on.svg) center / contain no-repeat;
}

li.on .menu_ico.menu_user {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/my-on.svg) center / contain no-repeat;
  mask: url(../images/icon/my-on.svg) center / contain no-repeat;
}

.menu_ico.menu_car {
  background-image: url(../images/icon/search.svg);
}

li.on .menu_ico.menu_search {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/search-on.svg) center / contain no-repeat;
  mask: url(../images/icon/search-on.svg) center / contain no-repeat;
}

.menu_ico.car_list {
  background-image: url(../images/icon/list.svg);
}

li.on .menu_ico.car_list {
  background-image: none;
  background-color: var(--primary);
  -webkit-mask: url(../images/icon/list_on.svg) center / contain no-repeat;
  mask: url(../images/icon/list_on.svg) center / contain no-repeat;
}

.menu_ico.menu_send {
  background-image: url(../images/icon/send.svg);
  background-color: aliceblue;
  width: 55px;
  height: 55px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  background-size: 30px;
  position: relative;
  top: -15px;
  box-shadow:
    inset rgba(15, 96, 191, 0.08) -2px -2px 8px,
    rgba(59, 146, 209, 0.2) 0px 0px 4px;
}

li.on .menu_ico.menu_quick {
  background-image: url(../images/icon/quick-on.svg);
}

.menu_ico.menu_message {
  background-image: url(../images/icon/sale.svg);
}

li.on .menu_ico.menu_community {
  background-image: url(../images/icon/community-on.svg);
}

.menu_ico.menu_user {
  background-image: url(../images/icon/my.svg);
}

li.on .menu_ico.menu_mypage {
  background-image: url(../images/icon/mypage-on.svg);
}

/*--------------------------------------------------------------------------------------
고정 하단 버튼
----------------------------------------------------------------------------------------*/
.fix_btn {
  width: 500px;
  position: fixed;
  background-color: #fff;
  bottom: 0;
  left: 50%;
  margin-left: -250px;
  height: 84px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.f_btn_group {
  padding: 0 20px;
  width: 100%;
}

.fix_btn button {
  height: 48px;
  width: 100%;
  border-radius: 12px;
  background-color: #dddddd;
  font-weight: 500;
}

button.btn_main {
  background-color: var(--primary);
  color: #fff;
}

.group_btn {
  width: 100%;
  padding: 25px 0px;
  display: flex;
  gap: 2%;
  border: 0;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
  background-color: #fff;
}

.group_btn button {
  width: calc(100% - 40px);
  height: 56px;
  margin: 0 20px;
  border-radius: 12px;
}

.fix_group_btn {
  position: fixed;
  width: 500px;
  position: fixed;
  z-index: 8;
  bottom: 82px;
  left: 50%;
  padding: 25px 20px;
  padding-top: 20px;
  margin-left: -70px;
  display: flex;
  gap: 2%;
  background-color: #fff;
  border: 0;
  border-top: 1px solid #f1f1f1;
}

.fix_group_btn button {
  height: 56px;
  border-radius: 12px;
}

.fix_group_btn button.btn_line {
  width: 103px;
}

.fix_group_btn button.btn_line.w_100 {
  width: 100%;
}

.fix_group_btn button.btn_main {
  width: calc(98% - 103px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.fix_group_btn button.btn_main.w_100 {
  width: 100%;
}

/*--------------------------------------------------------------------------------------
모달
----------------------------------------------------------------------------------------*/

.modal {
  width: 500px;
  height: 100%;
  position: fixed;
  left: 50%;
  margin-left: -70px;
  z-index: 93;
  top: 0;
}

.modal.index_0 {
  z-index: 94;
}

.modal.index_1 {
  z-index: 95;
}

.modal.index_2 {
  z-index: 96;
}

.modal.index_3 {
  z-index: 97;
}

.modal.index_4 {
  z-index: 98;
}

.modal.index_5 {
  z-index: 99;
}

.modal_wrap {
  height: 100%;
  width: 100%;
  position: relative;
  display: flex;
  background-color: rgba(0, 0, 0, 0.15);
}

.modal_body {
  background-color: #fff;
  width: 100%;
  margin-top: auto;
  display: flex;
  flex-direction: column;
  position: relative;
}

.m_header {
  position: static;
  width: 100%;
  padding: 0 20px;
  padding-top: 30px;
  background-color: #fff;
  z-index: 2;
  color: #121212;
  font-weight: 600;
  margin-bottom: 20px;
  display: flex;
}

.m_header .head_ico {
  margin-left: auto;
  cursor: pointer;
}

.m_header h4 {
  font-size: 15px;
}

.m_footer {
  width: 100%;
  height: 88px;
}

.m_btn_group {
  width: 500px;
  display: flex;
  gap: 2%;
  position: fixed;
  left: 50%;
  margin-left: -70px;
  background-color: #fff;
  bottom: 0;
  padding: 20px;
  flex-wrap: wrap;
}

.m_btn_group .btn_kakao {
  width: 100%;
}

.qna_m_modal .m_footer .m_btn_group {
  display: block;
  text-align: center;
}

.qna_m_modal button {
  flex: initial;
}

.btn_w_100 {
  width: 100%;
}

.qna_m_modal .m_footer .m_btn_group .btn_sub_line {
  background-color: #fff;
  border: 0;
  border-radius: 0;
  color: #717171;
  border-bottom: 1px solid #9f9e9e;
  height: auto;
  padding-bottom: 4px;
}

.m_btn_group button {
  background-color: #eaeaea;
  flex: 1 1 auto;
  padding: 10px;
  height: 48px;
  border-radius: 12px;
  font-size: 15px;
}

/*하단모달*/
.b_modal {
  border-radius: 16px 16px 0 0;
  height: auto;
  overflow: hidden;
  box-shadow: 0 -5px 6px rgba(0, 0, 0, 0.05);
}

.b_modal:has(.sc-mo) {
  max-height: 90vh;
}

.m_section {
  position: relative;
  overflow-y: auto;
  padding: 0 20px;
  height: 100%;
}

.m_section:has(.bg_search) {
  overflow-y: inherit;
}

.sale_modal .m_section .nav:has(.bg_search) {
  margin-bottom: 20px;
}

.m_section .checkbox_group {
  width: 100%;
  height: 100%;
  min-height: auto;
  max-height: 500px;
  padding-bottom: 10px;
  overflow-y: scroll;
}

.m_section .checkbox_group::-webkit-scrollbar {
  width: 4px;
}

.m_section .checkbox_group::-webkit-scrollbar-thumb {
  background: #bbc0c9;
  border-radius: 10px;
}

.m_section .checkbox_group::-webkit-scrollbar-track {
  background: rgba(3, 3, 3, 0.1);
}

.m_section .m_radio label {
  display: flex;
  border: 0;
  box-shadow: none;
  font-size: 16px;
  font-weight: 400;
  color: #828282;
}

.m_section .m_radio label i {
  width: 12px;
  height: 12px;
  margin-left: auto;
  background-position: center;
  background-size: cover;
  background-image: url(../images/icon/Check_w.svg);
  background-repeat: no-repeat;
}

.m_section .m_radio input[type="radio"]:checked + label {
  border: 0;
}

.m_section .m_radio input[type="radio"]:checked + label i {
  background-image: url(../images/icon/Check_b.svg);
}

/*공유하기 모달*/
.s_m_modal {
  background-color: rgba(0, 0, 0, 0.33);
  display: flex;
  align-items: center;
  justify-content: center;
}

.s_m_modal .modal_wrap {
  background-color: #fff;
  height: auto;
  width: 300px;
  flex-wrap: wrap;
  flex-direction: column;
  border-radius: 8px;
  padding: 20px;
}

.modal_wrap.m_agree .modal_head {
  border-bottom: 0;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
}

.modal_wrap.m_agree .modal_head .guide {
  font-size: 13px;
  font-weight: 500;
  color: #525252;
  width: 100%;
  margin-top: 4px;
  word-break: keep-all;
}

.modal_wrap.m_agree .modal_head i {
  margin-left: auto;
}

.s_m_modal .modal_head {
  border-bottom: 1px solid #e7e8ec;
  padding-bottom: 15px;
  margin-bottom: 15px;
  display: flex;
}

.s_m_modal .modal_head h4 {
  font-weight: 600;
  font-size: 16px;
}

.modal_head .head_ico {
  width: 24px;
  height: 24px;
  margin-left: auto;
  cursor: pointer;
}

.ico_close {
  background-image: url(../images/icon/close.svg);
}

.modal_body .link {
  display: flex;
  flex-direction: column;
  font-size: 15px;
  font-weight: 500;
}

.modal_body .link li {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.modal_body .link li i {
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  margin-right: 8px;
  border-radius: 3px;
}

.ico_kakao {
  background-image: url(../images/icon/kakaotalk_sharing_btn_small_ov.png);
}

.modal_body .link li i.ico_link {
  background-color: #eceff0;
  background-size: 18px;
  background-image: url(../images/icon/mingcute_link-line.svg);
}

.modal .nav {
  margin-bottom: 15px;
}

.modal .nav:last-of-type {
  margin-bottom: 0;
}

.modal .nav .form_radio_btn label {
  margin-bottom: 5px;
  padding: 15px 10px;
  font-size: 15px;
  height: auto;
  font-weight: 400;
  color: #a3a3a3;
}

.modal .nav h5 {
  font-size: 145x;
  font-weight: 600;
  margin-bottom: 15px;
}

.modal .select_group {
  display: flex;
  width: 100%;
  gap: 2%;
}

.modal .select_group select {
  flex: 1 1 49%;
}

.modal_footer.m_btn_group {
  position: inherit;
  width: 100%;
  margin: 0;
  left: 0;
  padding: 0;
}

/*pc 모달*/
.modal.s_m_modal.pc_modal {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  margin: 0;
  z-index: 100;
}

.s_m_modal.pc_modal .modal_wrap {
  width: 500px;
  max-height: 880px;
  pointer-events: auto !important;
}

.pc_modal .modal_body {
  width: 100%;
  overflow-y: auto;
  max-height: calc(-250px + 100vh);
  padding-bottom: 10px;
}

.pc_modal .modal_footer button {
  width: 100%;
  height: 40px;
  border-radius: 6px;
  margin-top: 10px;
}

.pc_modal .modal_body::-webkit-scrollbar {
  width: 4px;
}

.pc_modal .modal_body::-webkit-scrollbar-thumb {
  background: #bbc0c9;
  border-radius: 10px;
}

.pc_modal .modal_body::-webkit-scrollbar-track {
  background: rgba(3, 3, 3, 0.1);
}

.modal table {
  width: 100%;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid #e3e3e3;
  margin: 10px 0;
}

.modal table th {
  background-color: #f0f1f4;
  font-size: 13px;
  font-weight: 500;
  padding: 6px;
}

.modal table td:first-of-type {
  border: 0;
}

.modal table td {
  font-size: 13px;
  font-weight: 500;
  padding: 6px;
  word-break: keep-all;
  border-left: 1px solid #e3e3e3;
}

.tx_center {
  text-align: center;
}

/*견적횟수 모달*/
.numb_modal .m_header {
  margin-bottom: 15px;
}

.numb_modal .m_header h4 {
  font-size: 18px;
  font-weight: 600;
}

.i_section {
  display: flex;
  align-items: center;
}

.i_section p {
  width: calc(100% - 60px);
  word-break: keep-all;
}

/*--------------------------------------------------------------------------------------
메인
----------------------------------------------------------------------------------------*/
.main_visual {
  width: 100%;
  background-color: #f1f2f4;
  border-radius: 10px;
  overflow: hidden;
  height: auto;
}

.main_visual .swiper-slide::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}

.main_visual .swiper-slide img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main_visual .swiper {
  width: 100%;
  height: 100%;
}

.main_visual .swiper-slide {
  width: 100% !important;
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.main_visual .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main_visual .slide_text {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70%;
  padding: 30px 20px 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  text-align: left;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0) 100%
  );
  z-index: 2;
  color: #fff;
}

.main_visual .slide_text .main_t {
  font-size: 26px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 8px;
  letter-spacing: -0.5px;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.7s ease-out;
}

.main_visual .slide_text .main_t span {
  display: block;
}

.main_visual .slide_text .sub_t {
  font-size: 15px;
  font-weight: 300;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.7s ease-out 0.3s;
}

.main_visual .swiper-slide-active .slide_text .main_t {
  opacity: 1;
  transform: translateY(0);
}

.main_visual .swiper-slide-active .slide_text .sub_t {
  opacity: 0.8;
  transform: translateY(0);
}

.main_visual .swiper-pagination-fraction {
  top: 15px;
  bottom: auto;
  left: auto;
  right: 20px;
  width: auto;
  background-color: rgba(0, 0, 0, 0.4);
  color: #fff;
  padding: 3px 12px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 2px;
  z-index: 10;
}

.sub_contents {
  margin-top: 30px;
}

/*메인-고객후기*/
.review_play .swiper-slide {
  height: auto;
}

.review_card {
  background-color: #fff;
  border-radius: 12px;
  padding: 16px;
  height: 100%;
  box-sizing: border-box;
  position: relative;
  padding-bottom: 40px;
}

.review_card .review_car {
  font-size: 15px;
  font-weight: 700;
  color: #3b3b3b;
  margin-bottom: 6px;
}

.review_card .review_star {
  margin-bottom: 8px;
}

.review_card .review_star .star {
  display: inline-block;
  font-size: 14px;
  line-height: 1;
  color: #e0e0e0;
}

.review_card .review_star .star.on {
  color: #ffc107;
}

.review_card .review_txt {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: #717171;
  word-break: keep-all;
  margin-bottom: 12px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.review_card .rv_card_photos {
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}

.review_card .rv_thumb {
  width: 70px;
  height: 70px;
  border-radius: 8px;
  overflow: hidden;
  background: #f1f2f4;
  flex-shrink: 0;
  position: relative;
}

.review_card .rv_thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.review_card .review_user {
  font-size: 13px;
  font-weight: 500;
  color: #3b3b3b;
  position: absolute;
  bottom: 15px;
}

/*마이페이지-자주 묻는 질문*/
.faq_page .sub_contents .faq_group {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 0 15px;
}
.faq_page .sub_contents {
  margin-top: 0;
}

/* FAQ 카테고리 탭 */
.faq_cat_wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin-bottom: 16px;
  padding-bottom: 2px;
  -webkit-mask-image: linear-gradient(
    to right,
    black calc(100% - 44px),
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    black calc(100% - 44px),
    transparent 100%
  );
}
.faq_cat_wrap::-webkit-scrollbar {
  display: none;
}
.faq_cat_tabs {
  display: flex;
  gap: 6px;
  width: max-content;
  min-width: 100%;
  padding-right: 24px;
}
.faq_cat_tab {
  flex-shrink: 0;
  padding: 8px 14px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 500;
  color: #868e96;
  background: transparent;
  border: 1.5px solid #e2e5ea;
  cursor: pointer;
  transition:
    background 0.18s,
    color 0.18s,
    border-color 0.18s;
  white-space: nowrap;
  line-height: 1;
}
.faq_cat_tab.on {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
  font-weight: 700;
}
.faq_cat_tab:active {
  opacity: 0.8;
}
/*메인-자주 묻는 질문*/
.faq_group {
  background-color: #fff;
  border-radius: 12px;
  padding: 4px 16px;
}
.faq_item {
  border-bottom: 1px solid #ebebeb;
}

.faq_item:last-of-type {
  border-bottom: 0;
}

.faq_question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 16px 0;
  background-color: transparent;
  border: 0;
  font-size: 15px;
  font-weight: 500;
  color: #3b3b3b;
  text-align: left;
  cursor: pointer;
}

.faq_question .faq_q_wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.faq_question .faq_txt {
  flex: 1;
  min-width: 0;
  word-break: keep-all;
}

.faq_question .faq_q {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: var(--primary-light, #f2f6ff);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.faq_item.active .faq_question .faq_q {
  background-color: var(--primary);
  color: #fff;
}

.faq_question .ico_g_down {
  flex-shrink: 0;
  margin-left: 12px;
  transition: transform 0.25s ease;
}

.faq_item.active .faq_question .ico_g_down {
  transform: rotate(180deg);
}

.faq_item.active .faq_question {
  color: var(--primary);
  font-weight: 700;
}

.faq_answer {
  height: 0;
  overflow: hidden;
  transition: height 0.25s ease;
}

.faq_answer p {
  padding: 0 0 16px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: #717171;
  word-break: keep-all;
  white-space: pre-line;
}

/*메인-이벤트*/

.sub_contents:has(.mySwiper2) {
  margin-top: 0px !important;
}

.sub_contents .event .mySwiper2 .swiper-slide {
  background-color: #e5e5e5;
  border-radius: 10px;
  margin-top: 30px;
  width: 120px !important;
  height: 120px;
  display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
  align-items: flex-start;
  overflow: hidden;
  cursor: pointer;
}

.sub_contents .event .mySwiper2 .swiper-slide .ev_banner {
  width: 100%;
  height: 100%;
  background-color: #e5e5e5;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
  left: 0;
  top: 0;
}

.sub_contents .event .mySwiper2 .swiper-slide .ev_banner img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sub_contents .event .mySwiper2 .swiper-slide .badge {
  border-radius: 100px;
  margin-bottom: 5px;
  font-weight: 600;
}

.sub_contents .event .mySwiper2 .swiper-slide img {
  position: absolute;
  width: auto;
  height: 70px;
  right: 15px;
  bottom: 15px;
}

.sub_contents .event .mySwiper2 .swiper-slide.swiper_color_b {
  background-color: var(--primary);
  color: #fff;
  font-weight: 500;
}

.sub_contents .event .mySwiper2 .swiper-slide.swiper_color_b .badge {
  color: var(--primary);
  background-color: #bfd6ff;
}

.sub_contents .event .mySwiper2 .swiper-slide.swiper_color_g {
  background-color: #7fd7ad;
  color: #fff;
  font-weight: 500;
}

.sub_contents .event .mySwiper2 .swiper-slide.swiper_color_g .badge {
  color: #6fbc97;
  background-color: #d6ffeb;
}

/*메인 - 5일인도차량*/
.up_car {
  border-radius: 10px;
  background-color: #fff;
  padding: 15px;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #3b3b3b;
  font-weight: 500;
}

.up_car .up_title {
  display: flex;
  flex-direction: column;
}

.up_car .up_title label {
  font-size: 18px;
  font-weight: 700;
  color: #000;
}

.up_car .date {
  background-color: #edf5fe;
  color: var(--primary);
  font-weight: 600;
  display: flex;
  padding: 10px;
  border-radius: 6px;
  margin-left: auto;
  font-size: 16px;
  align-items: center;
}

/*메인 할인정보*/
.mySwiper4 .swiper-slide {
  width: 80% !important;
}

.main_wrap .page_sub_title {
  display: flex;
  align-items: center;
  position: relative;
}

.guide_group {
  display: flex;
  align-items: center;
}

.guide_group .fa-question-circle {
  color: #8f8f8f;
  font-size: 15px;
  margin-left: 4px;
  cursor: pointer;
}

.guide_group:hover .guide_bubble {
  display: block;
}

.guide_bubble {
  display: none;
  position: absolute;
  font-size: 13px;
  background-color: #4e4e4e;
  bottom: -55px;
  left: 0px;
  border-radius: 10px;
  padding: 8px;
  z-index: 2;
  box-shadow: 1px 1px 10px rgba(67, 72, 93, 0.19);
  color: #fff;
  font-weight: 400 !important;
}

.guide_bubble::after {
  content: "";
  position: absolute;
  top: -8px;
  right: 27px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #4e4e4e;
}

.main_wrap .mySwiper4 .info_group .price {
  display: flex;
}

.main_wrap .mySwiper4 .info_group .main_color {
  width: 46px;
  text-align: right;
}

.main_wrap .mySwiper4 .info_group .num {
  width: 110px;
  text-align: right;
}

/*메인 - 특가차량*/
.main_wrap .head_tab {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.main_wrap .head_tab .tab_btn {
  display: flex;
  gap: 4%;
}

.main_wrap .head_tab .tab_btn span {
  font-size: 14px;
  border-radius: 6px;
  background-color: #e4e4e4;
  padding: 5px 12px;
  font-weight: 600;
  color: #767676;
  cursor: pointer;
}

.main_wrap .head_tab .tab_btn span.on {
  background-color: var(--primary);
  color: #fff;
}

.main_wrap .group_head {
  display: flex;
  margin-bottom: 10px;
}

.main_wrap .group_head h5 {
  font-weight: 700;
  font-size: 15px;
}

.main_wrap .group_head button {
  margin-left: auto;
}

.main_wrap .car_group .info_group p .price b {
  margin-right: 5px;
  font-size: 14px;
}

.main_wrap .car_group .info_group p.total_txt .price {
  color: #111111 !important;
  font-size: 14px !important;
}

.main_wrap .car_group .info_group p label {
  font-weight: 600;
  font-size: 13px;
  color: #3b3b3b;
}

.main_wrap .car_group .nav li {
  margin-bottom: 10px;
  border-bottom: 0;
}

.main_wrap .car_group .nav li:last-of-type {
  margin-bottom: 0;
}

.main_wrap .car_card {
  border-radius: 10px;
  padding: 15px;
  position: relative;
  width: 100%;
}

.main_wrap .car_card .title {
  font-size: 15px;
  font-weight: 700;
}

.main_wrap .car_card .badge_area {
  margin-bottom: 2px;
}

.main_wrap .car_card .badge_area .badge {
  padding: 3px 10px;
}

.main_wrap .car_card .sub_title {
  font-size: 13px;
  font-weight: 500;
}

.main_wrap .car_card button {
  margin-top: 10px;
}

.ranking_num {
  position: absolute;
  background-color: #ff6370;
  color: #fff;
  width: 34px;
  height: 28px;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px 0 0 0;
}

.main_wrap .sub_visual {
  width: 100%;
  background-color: #fff;
  border-radius: 10px;
  padding: 20px 15px;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
}

.main_wrap .sub_visual_1 {
  width: 100%;
  background-color: #fff;
  border-radius: 10px;
  padding: 20px 15px;
  font-size: 15px;
  font-weight: 600;
  /*background-image: url(../images/common/main_subad.svg);*/
  background-repeat: no-repeat;
  background-position: right 20px bottom 20px;
  text-align: center;
}

@font-face {
  font-family: "GangwonEduPower";
  src: url(../font/GangwonEduPower-b.ttf) format("truetype");
}

.main_wrap .visual_title {
  font-size: 28px;
  color: var(--primary);
  font-weight: 600;
}

.main_wrap .sub_visual .sub_title {
  color: var(--primary);
  font-size: 18px;
  position: relative;
  top: 5px;
}

.main_wrap .sub_visual_1 .sub_title {
  color: var(--primary);
  font-size: 18px;
  font-family: "GangwonEduPower";
  position: relative;
  top: 5px;
}

.main_wrap .sub_visual .y_btn {
  background-color: var(--primary);
  color: #fff;
  padding: 8px 40px;
  border-radius: 100px;
  margin-top: 10px;
}

.main_wrap .sub_visual_1 .y_btn {
  background-color: var(--primary);
  color: #fff;
  padding: 8px 40px;
  border-radius: 100px;
  margin-top: 10px;
}

.m_sub_info {
  font-size: 15px;
  margin-top: 8px;
}

.car_list .car_group .nav .m_sub_info .sub_txt {
  margin: 6px 0;
  font-weight: 400;
  font-size: 12px;
  color: #505050;
}

.car_list .car_group li {
  border-bottom: 0;
}

.car_list .car_group .nav .m_sub_info li {
  padding: 0;
  margin-bottom: 0;
  display: flex;
  align-items: center;
}

.main_wrap .mySwiper3 .swiper-wrapper .swiper-slide {
  background-color: #fff;
  border-radius: 10px;
  display: flex;
  width: 45%;
  height: auto;
}

.car_list .car_group .nav .m_sub_info li label {
  font-size: 13px;
  font-weight: 400;
  color: #767676;
}

.car_list .car_group .nav .m_sub_info li .num {
  margin-left: auto;
  font-weight: 600;
}

/*메인 - 유튜브 채널*/
.youtube_play {
  width: 100%;
  background-color: #f1f2f4;
  border-radius: 10px;
  padding: 0 20px;
}

.youtube_play .youtubeSwiper .swiper-slide {
  width: 100% !important;
  border-radius: 10px;
  padding-bottom: 56.25%;
  position: relative;
}

.youtube_play .youtubeSwiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
}

/* Main Bottom Menu Swiper */
/* swiper-bundle.min.css가 common.css보다 나중에 로드되어 .swiper{padding:0}이
   이 패딩을 덮어쓰므로, 클래스를 결합해 명시도를 높여 잘리지 않게 함 */
.mainMenuSwiper.swiper {
  padding: 6px 10px 0;
}

.mainMenuSwiper .swiper-wrapper {
  overflow: visible;
}

.mainMenuSwiper .swiper-slide {
  /* width: 17% !important; */
  /* Show roughly 5.5-6 items */
  display: flex;
  justify-content: center;
  overflow: visible;
}

.menu_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-align: center;
}

.menu_item .ico_menu {
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  background-size: 40px;
  background-position: center;
  margin-bottom: 6px;
  background-color: transparent;
  border-radius: 100px;
  background-color: #fff;
  border-radius: 100px;
}

.menu_item .txt {
  font-size: 13px;
  font-weight: 500;
  color: #333;
  white-space: nowrap;
}

.menu_item .ico_menu.menu_1 {
  background-image: url(../images/icon/soft_menu_1.svg);
}

.menu_item .ico_menu.menu_2 {
  background-image: url(../images/icon/soft_menu_2.svg);
  background-size: 36px;
  background-position: 9px 6px;
}

.menu_item .ico_menu.menu_3 {
  background-image: url(../images/icon/soft_menu_3.svg);
}

.menu_item .ico_menu.menu_4 {
  background-image: url(../images/icon/soft_menu_4.svg);
  background-size: 36px;
}

.menu_item .ico_menu.menu_5 {
  background-image: url(../images/icon/soft_menu_5.svg);
  background-position: 6px 6px;
}

.menu_item .ico_menu.menu_6 {
  background-image: url(../images/icon/soft_menu_6.svg);
}

.menu_item .ico_menu.menu_7 {
  background-image: url(../images/icon/soft_menu_7.svg);
  background-position: 4px 5px;
}

.menu_item .ico_menu.menu_bmw {
  position: relative;
  background-image: url(../images/common/bmw-g-logo.svg);
  background-size: 34px;
}

.menu_item .ico_menu.menu_bmw .menu_bmw_badge {
  position: absolute;
  top: -3px;
  right: 0;
  background: #ff3b30;
  color: #fff;
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1;
  padding: 3px 5px;
  border-radius: 100px;
  letter-spacing: -0.2px;
  white-space: nowrap;
}

.main_b_menu ul li .ico_next {
  display: none;
}

/*메인 옵션 모달*/
.option_modal .option_nav li {
  display: flex;
  margin-bottom: 6px;
  align-items: flex-start;
}

.option_modal .option_nav li label {
  width: calc(50% - 18px);
}

.option_modal .option_nav li .price {
  margin-left: auto;
  width: 50%;
  text-align: right;
}

.option_modal .option_nav li i {
  width: 18px;
  height: 18px;
  background-color: var(--primary);
  background-size: 6px;
  background-position: center;
  background-image: url(../images/icon/ico_w_next.svg) !important;
  margin-top: 2px;
}

/*--------------------------------------------------------------------------------------
tab
----------------------------------------------------------------------------------------*/
.tab {
  width: 100%;
  height: 42px;
  font-size: 14px;
  color: #888c98;
  font-weight: 500;
  background-color: #fff;
  margin-bottom: 15px;
  border-radius: 8px;
}

.tab ul {
  display: flex;
  width: 100%;
  height: 100%;
  height: 100%;
}

.tab ul li {
  height: 100%;
  flex: 1 1 auto;
  text-align: center;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e7e8ec;
  border-radius: 0 8px 8px 0;
}

.tab ul li:nth-of-type(2) {
  border-radius: 0;
  border-right: 0;
}

.tab ul li:first-of-type {
  border-radius: 8px 0 0 8px;
  border-right: 0;
}

.tab ul li.on {
  color: var(--primary);
  font-weight: 600;
  border: 1px solid var(--primary);
  background-color: #fff;
}

.tab_info {
  margin-top: 20px;
}

/*--------------------------------------------------------------------------------------
main
----------------------------------------------------------------------------------------*/
main {
  flex: 1;
}

main.normal_b {
  padding: 0;
  position: relative;
}

main.normal_b section {
  height: 100%;
}

main.normal_b .nav {
  height: 100%;
}

main.p_b_210 {
  padding-bottom: 0px;
}

main.p_b_170 {
  padding-bottom: 170px;
}

main.p_b_170 .nav .row .content.release_del {
  padding-bottom: 0 !important;
}

main.p_b_87 {
  padding-bottom: 100px;
}

/*margin*/
.m_b_100 {
  margin-bottom: 100px;
}

/*page_title*/
.page_title {
  width: 100%;
}

.page_title h2 {
  font-size: 20px;
  font-weight: 600;
}

/*page_title_group*/
.page_title_group {
  display: flex;
  width: 500px;
  background-color: #fff;
  align-items: center;
  padding: 0px 20px;
  height: 58px;
  position: fixed;
  top: 0px;
  left: 50%;
  margin-left: -70px;
  z-index: 85;
  border-bottom: 1px solid #eeeeee;
}

.head_ico {
  display: flex;
  width: 24px;
  height: 24px;
}

.head_ico.menu {
  margin-left: auto;
}

.head_ico i {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: inline-block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.head_ico.arrow {
  margin-right: 20px;
}

.head_ico i.arrow_left {
  background-image: url(../images/icon/arrow_left_b.svg);
}

.head_btn {
  display: flex;
  margin-left: auto;
  gap: 4px;
}

.head_btn button {
  display: flex;
  width: auto;
  align-items: center;
  border: 1px solid #cccccc;
  background-color: #fff;
  font-size: 14px;
  padding: 6px 15px;
  border-radius: 100px;
}

.head_btn i.ico_arrow {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url(../images/icon/arrow_left_b.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transform: rotate(-90deg);
  margin-left: 3px;
}

.head_btn i.ico_arrow.on {
  transform: rotate(90deg);
}

.head_ico i.hamberger {
  background-image: url(../images/icon/hamberger.svg);
}

.head_arrow {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-color: transparent;
}

.page_title_group h2 {
  position: relative;
  font-size: 16px;
  font-weight: 500;
}

/*특가상품*/
.car_info {
  margin-top: 30px;
  padding: 15px;
  border-radius: 8px;
}

.car_info.w_bg {
  background-color: #fff;
}

.search_line {
  border-bottom: 1px solid #f0f0f0;
  padding-bottom: 20px;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.badge_check {
  width: 100%;
  margin-top: 8px;
}

.badge_check .checkbox_group {
  gap: 4px;
}

.badge_check .checkbox_group p {
  width: auto;
}

.badge_check .checkbox_group input[type="checkbox"] + label {
  width: auto;
  font-size: 13px;
  font-weight: 400;
  padding: 6px 12px;
  background-color: #eeeef0;
  border: 0;
  color: #767676;
  border-radius: 6px;
}

.badge_check .checkbox_group input[type="checkbox"]:checked + label {
  background-color: var(--primary);
  color: #fff;
  border: 0;
  font-weight: 400;
}

.line_select {
  margin-left: auto;
}

.line_select select {
  border: 0;
  min-width: 84px;
  background-color: #f6f7f8;
  border-radius: 100px;
  padding: 8px 14px;
  border: 1px solid #e7e8ec;
}

.car_group {
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.car_group ul li {
  position: relative;
}

.car_group ul li.black::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.31);
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 8px;
  z-index: 1;
}

.car_group:last-of-type {
  margin-bottom: 0;
}

.car_group li {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #dbdbdb;
}

.car_group li:last-of-type {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

.car_group > ul .img_group,
.car_group .nav ul .img_group {
  background-color: #fff;
  border-radius: 12px;
  padding: 4px 16px;
}

.car_group .img_group {
  display: flex;
  align-items: center;
  position: relative;
}

.sub_txt.info_guide {
  width: 100%;
  text-align: left;
  display: flex;
  font-size: 13px;
  align-items: center;
}

.group_img {
  margin-left: auto;
  width: 119px;
  position: relative;
}

.badge_promotions {
  position: absolute;
  display: inline-block;
  width: 100px;
  height: 30px;
  top: 0;
  right: 0px;
  background-image: url(../images/common/promotions-badge.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.group_txt {
  font-size: 16px;
  font-weight: 700;
  width: calc(100% - 140px);
  display: block;
}

.group_txt > span {
  width: 100%;
  display: -webkit-box;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  cursor: pointer;
}

.group_txt > span.g_txt {
  font-size: 13px;
  font-weight: 500;
  color: #767676;
  margin-top: 8px;
}

.group_txt .sub_txt {
  font-size: 11px;
}

.group_txt .sub_txt > span {
  width: 100%;
  display: -webkit-box;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 13px;
}

.group_txt .sub_txt > span:first-child {
  margin-bottom: 2px;
}

.group_txt .deli_sub_txt {
  font-size: 12px;
  color: #828282;
  margin-top: 7px;
}

.car_group .info_group p {
  display: flex;
  font-size: 13px;
  font-weight: 400;
  color: #767676;
}

.car_group .info_group p.condition {
  border-bottom: 1px solid #e7e8ec;
  padding-bottom: 15px;
}

.car_group .info_group p.condition .price {
  font-size: 18px;
}

.car_group .info_group p .price {
  margin-left: auto;
  color: #3b3b3b;
  font-weight: 700;
  font-size: 15px;
}

.car_group .info_group p .price.r_font {
  color: #f36471 !important;
}

.group_txt p .price.price_add {
  font-weight: 500;
  font-size: 14px !important;
  margin-bottom: 4px;
  margin-left: 0;
  color: #3b3b3b !important;
  position: relative;
}

.group_txt p .price.price_add b:last-of-type {
  position: relative;
  margin-left: 12px;
}

.sale_contents .group_txt p .price.price_add b:first-of-type::before {
  width: 0;
  height: 0;
}

.group_txt p .price.price_add b::before {
  content: "";
  position: absolute;
  top: 1px;
  left: -7px;
  width: 1px;
  height: 15px;
  border-radius: 0.5px;
  background-color: #a2a2a2;
  transform: rotate(20deg);
}

.btn_group {
  margin-top: 16px;
  width: 100%;
  border-radius: 2px;
  font-size: 14px;
  color: #000000;
}

.btn_group p {
  display: flex;
}

.btn_group p button {
  padding: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  border-radius: 8px;
}

.btn_group p button.btn_line {
  color: var(--primary);
}

.btn_group p button.main_color {
  color: #fff;
  background-color: var(--primary);
}

.btn_group p .ico_btn {
  width: calc(100% - 45px);
  display: flex;
  gap: 1%;
}

.btn_group p .ico_btn .btn_line {
  width: 40%;
}

.btn_group p .ico_btn .main_color {
  width: 60%;
}

.btn_group p > button:last-of-type {
  border-right: 0;
}

.btn_group p button.btn_ico {
  width: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}

i.btn_i {
  width: 24px;
  height: 24px;
  margin-right: 4px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.btn_group p > button.btn {
  margin-left: auto;
}

.btn_group p button.btn .ico_share {
  width: 18px;
  height: 18px;
}

i.ico_info {
  background-image: url(../images/icon/document.png);
}

i.ico_quick {
  background-image: url(../images/icon/quick.svg);
}

i.ico_share {
  background-image: url(../images/icon/Share_Icon_UIA.svg);
}

.car_list {
  overflow: hidden;
  cursor: pointer;
}

.car_list .model_category {
  display: flex;
  width: 100%;
  flex-direction: row;
  gap: 2%;
}

.car_list .model_category li {
  cursor: pointer;
  position: relative;
}

.car_list .model_category li:hover img {
  transform: scale(1.1);
}

.car_list .model_category .car_name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  align-items: flex-start;
}

.car_list .model_category .car_name strong {
  word-break: keep-all;
  width: calc(100% - 30px);
}

.car_list .model_category .car_name img {
  width: 30px;
}

.car_sub {
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
}

.car_list .model_category .car_price {
  font-size: 20px;
  margin-top: 6px;
  font-weight: 600;
}

.model_category.sale_frame li {
  width: 32%;
  border: 1px solid #f2f2f2;
  background-color: #fdfdfd;
  box-shadow: 0px 1px 10px #eaeaea;
  border-radius: 12px;
  padding: 10px;
  line-height: 1.2;
}

.model_category.sale_frame li > div {
  margin-bottom: 4px;
}

.price_num {
  font-size: 18px;
  font-weight: 600;
  word-break: keep-all;
}

.title_badge .title {
  font-weight: 500;
  margin-bottom: 6px;
  font-size: 15px;
}

/*특가차량 상세*/
.c_img {
  width: 100%;
  background-color: transparent;
  padding: 20px;
  position: relative;
}

.release_del .c_img {
  padding: 10px 20px;
}

.release_del .c_img .img_area {
  height: 100px;
  margin-bottom: 6px;
  position: relative;
  z-index: 3;
}

.c_group {
  position: relative;
  z-index: 2;
}

.done_fx {
  position: absolute;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.44);
  z-index: 1;
  height: 330px;
  left: 0;
  top: -15px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
}

.c_img .img_badge {
  position: absolute;
  bottom: 15px;
  left: 15px;
}

.head_area {
  width: 100%;
  display: flex;
  position: relative;
  z-index: 1;
}

.head_area .ico_share {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: auto;
  cursor: pointer;
}

.c_img .img_area {
  width: 100%;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.c_img .img_area img {
  width: 80%;
  object-fit: contain;
}

.badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 4px;
  color: #fff;
  font-weight: 600;
  font-size: 12px;
}

/*--------------------------------------------------------------------------------------
특가차량상세 - 차량선택
----------------------------------------------------------------------------------------*/
.c_group .w_s_bg {
  width: calc(100% - 30px);
  height: 100%;
  margin: 0 auto;
}

.c_title {
  padding: 20px 15px;
  background-color: #fff;
  border-radius: 20px;
}

.c_title .sub_txt {
  margin-bottom: 0px;
  display: flex;
  width: 100%;
  align-items: center;
}

.c_title .name {
  margin-bottom: 10px;
}

.c_title .card_sub_title {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  font-size: 15px;
  color: #282828;
  font-weight: 500;
}

.c_title .card_sub_title::before {
  content: "";
  display: block;
  width: 3px;
  height: 12px;
  background-color: var(--primary);
  border-radius: 2px;
  flex-shrink: 0;
}

.c_title .price ul li {
  display: flex;
  align-items: center;
  font-size: 13px;
  margin-bottom: 4px;
}

.c_title .price ul li.total {
  margin-bottom: 0;
  border-top: 1px solid #e7e8ec;
  margin-top: 10px;
  padding-top: 10px;
}

.c_title .price ul li.total:has(.guide_group) {
  position: relative;
}

.label_guide {
  display: flex;
  position: relative;
}

.c_title .price ul li.total .guide_bubble {
  width: 120px;
  top: 30px;
  bottom: inherit;
}

.c_title .price ul li.total .guide_group:hover {
  display: flex;
}

.c_title .price ul li .num {
  margin-left: auto;
  font-size: 14px;
  font-weight: 600;
  color: #3b3b3b;
}

.c_title .price ul li.total label {
  font-weight: 600;
  font-size: 14px;
  color: #3b3b3b;
}

.c_title .price ul li.total .num {
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
}

/*차량리스트*/
.tab_head {
  width: 100%;
}

.tab_head ul {
  display: flex;
  align-items: center;
}

.tab_head ul li {
  flex: 1 1 50%;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: #ababab;
  border-bottom: 2px solid #ababab;
  cursor: pointer;
  padding-bottom: 12px;
  background-color: #fff;
}

.tab_head ul li.on {
  color: var(--primary);
  border-bottom: 2px solid var(--primary);
}

.tab_contents {
  background-color: #f3f4f7;
  padding: 20px 15px;
  margin-bottom: 20px;
}

.car_select .select_group {
  margin-bottom: 20px;
  width: 100%;
}

.car_select .select_group ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.car_select .select_group ul li {
  flex: 1 1 32%;
}

.car_select .select_group ul li select {
  width: 100%;
}

/* c_title 상단 보증사 뱃지 */
.c_title_top {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}

.c_title_top .ca_name {
  display: flex;
  border: 1px solid #cbced2;
  padding: 4px 10px;
  border-radius: 4px;
}

.c_title_top .ca_name span {
  display: block;
  border: 0;
  padding: 0;
  border-radius: 0;
}

.ico_ca-logo {
  display: flex;
  align-items: center;
  display: inline-block;
  width: 24px;
  height: 24px;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: relative;
  top: -1px;
  margin-right: 4px;
}

.ico-lotte {
  background-image: url(../images/icon/ico-lotte.svg);
}

.ico-b-2 {
  background-image: url(../images/icon/2.svg);
}
.ico-b-3 {
  background-image: url(../images/icon/3.svg);
}
.ico-b-4 {
  background-image: url(../images/icon/4.svg);
}
.ico-b-5 {
  background-image: url(../images/icon/5.svg);
}
.ico-b-6 {
  background-image: url(../images/icon/6.svg);
}
.ico-b-8 {
  background-image: url(../images/icon/8.svg);
}
.ico-b-9 {
  background-image: url(../images/icon/9.svg);
}
.ico-b-10 {
  background-image: url(../images/icon/10.svg);
}
.ico-b-12 {
  background-image: url(../images/icon/12.svg);
}
.ico-b-13 {
  background-image: url(../images/icon/13.svg);
}
.ico-b-14 {
  background-image: url(../images/icon/14.svg);
}
.ico-b-15 {
  background-image: url(../images/icon/15.svg);
}
.ico-b-16 {
  background-image: url(../images/icon/16.svg);
}
.ico-b-17 {
  background-image: url(../images/icon/17.svg);
}
.ico-b-21 {
  background-image: url(../images/icon/21.svg);
}
.ico-b-23 {
  background-image: url(../images/icon/23.svg);
}
.ico-b-24 {
  background-image: url(../images/icon/24.svg);
}
.ico-b-26 {
  background-image: url(../images/icon/26.svg);
}
.ico-b-112 {
  background-image: url(../images/icon/112.svg);
}
.ico-b-115 {
  background-image: url(../images/icon/115.svg);
}
.ico-b-116 {
  background-image: url(../images/icon/116.svg);
}

/* c_title 내 인라인 커스텀 셀렉트 (구분/브랜드/모델/라인업/트림 즉시 변경) */
.select_row_group {
  display: flex;
  flex-direction: column;
}

.select_row {
  display: flex;
}

.select_row.half_row {
  gap: 16px;
}

.select_row.half_row .custom-select-box.select_box_row {
  flex: 1 1 50%;
  min-width: 0;
  padding-left: 0;
}

.select_row.half_row
  .custom-select-box.select_box_row
  + .custom-select-box.select_box_row {
  padding-left: 16px;
  border-left: 1px solid #ececec;
}

.custom-select-box.select_box_row {
  width: 100%;
  margin-bottom: 0;
}

.select_box_row .select-selected {
  width: 100%;
  justify-content: space-between;
  padding: 14px 2px;
  border-bottom-color: #ececec;
  font-size: 15px;
  font-weight: 500;
  color: #3b3b3b;
}

.select_box_row .select-selected:hover,
.select_box_row .select-selected.select-arrow-active {
  color: var(--primary);
}

.select_box_row .select-selected:after {
  width: 14px;
  height: 14px;
  margin-left: 8px;
  flex-shrink: 0;
}

.select_box_row .select-items {
  left: 0;
  right: 0;
  width: 100%;
  font-size: 14px;
  font-weight: 400;
  color: #3b3b3b;
}

.select_box_row.sub_select_box .select-selected .text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.list_head {
  display: flex;
  margin-bottom: 15px;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}

.result_page_head {
  padding: 16px 15px 0;
}

.list_head .guide_bubble {
  width: 200px;
  left: 10px;
  transform: none;
}

.list_head .guide_bubble::after {
  display: none;
}

.list_head .more_btn {
  margin-left: auto;
}

.car_list .car_group .nav li {
  padding: 15px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  background-color: #fff;
}

.car_list .car_group .nav ul .img_group {
  background-color: transparent;
  border-radius: 0;
  padding: 0;
}

.car_list .car_group .nav .img_group {
  margin: 0;
  min-height: 0;
}

.car_list .car_group .nav li .end {
  background-color: rgba(0, 0, 0, 0.38);
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
}

.car_group .nav li {
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 10px;
}

.car_group .nav li:last-child {
  margin-bottom: 0;
}

.car_group .img_group .group_txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.car_group .img_group .group_txt .logo_txt {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

.car_group .img_group .group_txt .logo_txt > img {
  height: 26px;
  object-fit: contain;
  object-position: left;
}

.car_group .img_group .group_txt > span:first-of-type {
  padding-top: 0;
}

.car_group .img_group .group_txt span {
  font-weight: 400;
  font-size: 14px;
  color: #999;
}
.car_group .img_group .group_txt .color-display-area .colors-group {
  margin-top: 0px;
  margin-bottom: 2px;
}
.car_group .img_group .group_txt .txt_sel {
  font-weight: 700;
  font-size: 16px;
  color: #1a1a1a;
}

.car_group .img_group .group_txt .badge_l_main {
  display: inline-block;
  font-size: 11px;
  line-height: 1;
  border: 1px solid var(--primary);
  color: var(--primary);
  padding: 4px 8px;
  padding-right: 6px;
  border-radius: 3px;
  margin-right: 6px;
  text-align: center;
  vertical-align: middle;
}

.car_group .img_group .sub_txt {
  margin: 0;
  margin-bottom: 2px;
}

.car_group .badge {
  font-size: 10px;
}

.car_group .badge_area {
  margin-bottom: 10px;
}

.option_check {
  margin-bottom: 50px;
}

.option_check label .price {
  margin-left: auto;
}

.option_check label .title {
  display: flex;
  align-items: center;
}

.option_check label i {
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  background-repeat: no-repeat;
  background-image: url(../images/icon/w-check.svg);
  background-position: center;
}

.checkbox_group input[type="checkbox"]:checked + label i {
  background-image: url(../images/icon/check.svg);
}

.option_info .txt {
  margin-bottom: 20px;
}

.option_btn button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

/* c_title 내 상세 옵션 선택 버튼 (클릭 시 바텀시트가 열리므로 '닫기' 텍스트 전환 없음) */
.c_title .option_btn {
  margin-top: 16px;
}

.c_title .option_btn button.close {
  font-size: 14px !important;
}

.c_title .option_btn button.close:before {
  content: none;
}

.option_btn button.close {
  font-size: 0px !important;
}

.option_btn button.close i {
  transform: rotate(180deg);
}

.option_btn button.close:before {
  content: "상세 옵션 닫기";
  display: block;
  font-size: 14px;
}

.option_btn button i {
  position: absolute;
  left: 150px;
}

.option_info .option_g_line {
  margin: 0 0 20px 0;
}

.list_head .title_sub {
  margin-left: auto;
}

.option_list .car_select .select_group {
  margin-bottom: 10px;
}

.option_list .condition {
  margin-bottom: 15px;
}

.option_list .condition label {
  font-size: 16px;
  font-weight: 500;
  color: #000000 !important;
}

.option_list .condition .price {
  font-size: 18px;
  font-weight: 700;
  color: var(--primary) !important;
}

.option_list .s_txt {
  margin-bottom: 4px;
  font-size: 14px;
  color: #3b3b3b;
  margin-bottom: 4px;
  display: block;
  width: 100%;
  font-weight: 500;
}

.option_list .s_txt i {
  color: #888c98;
}

.option_list .car_group .info_group p {
  color: #8f8f8f;
  font-weight: 400;
  font-size: 13px;
}

.option_list .car_group .info_group p.com_name {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  margin-bottom: 4px;
}

.option_wrap .car_group .info_group p.total_txt label {
  color: #3b3b3b;
  font-size: 14px;
  font-weight: 500;
}

.option_list .car_group .info_group p:last-of-type {
  margin-bottom: 0;
}

.option_list .car_group .info_group p .price {
  color: #757575;
}

.release_del .option_list.del_option {
  background-color: transparent;
  border: 1px solid #d4d4d5;
}

.release_del .option_list.del_option ul li label {
  color: #888c98;
  width: calc(100% - 114px);
}

.release_del .option_list.del_option ul li .price {
  color: #888c98;
  width: 114px;
  text-align: right;
}

/*미장착 옵션 개수 표시*/
.option_count {
  margin-left: auto;
  font-size: 13px;
  color: #8f8f8f;
}

.option_count strong {
  color: #3b3b3b;
  font-weight: 600;
}

/*미장착 옵션 더보기 아코디언*/
.release_del .option_list.del_option ul.del_option_more {
  display: none;
}

.release_del .option_list.del_option ul.del_option_more li:first-child {
  margin-top: 6px;
}

.del_option_toggle.btn_group {
  margin-top: 0;
}

.del_option_toggle.btn_group p button {
  width: 100%;
  border: 0;
  border-top: 1px solid #ebebeb;
  border-radius: 0;
  margin-top: 12px;
  padding: 12px 0 0;
  font-size: 14px;
  font-weight: 400;
  color: #959595;
  background-color: transparent;
}

.hidden {
  display: none !important;
}

.accordion_option {
  padding: 15px;
  margin-top: 15px;
  background-color: #f6f7f8;
  display: none;
}

.car_group .nav .accordion_option h4 {
  margin-bottom: 3px;
  font-size: 14px;
  font-weight: 600;
}

.car_group .nav .accordion_option ul li {
  box-shadow: none;
  border: 0;
  padding: 0;
  margin-bottom: 6px;
  font-size: 13px;
  color: #8f8f8f;
  background-color: transparent;
}

.accordion_title {
  border-bottom: 1px solid #d8d8d8;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.car_group .nav .accordion_option .accordion_title .label_option {
  font-size: 14px;
  color: #3b3b3b !important;
  font-weight: 600;
}

.car_group .nav .accordion_option .accordion_title .label_option label {
  width: 100px;
}

.car_group .nav .accordion_option .accordion_title .label_option .option {
  font-weight: 600;
  color: #3b3b3b !important;
  font-size: 16px;
  width: auto;
}

.label_option {
  display: flex;
  flex-wrap: wrap;
}

.label_option label {
  width: 50%;
}

.label_option .option {
  width: 50%;
  margin-left: auto;
  text-align: right;
  color: #757575;
  font-weight: 500;
  word-break: keep-all;
}

.total_opion_group .label_option .option {
  color: #3b3b3b;
}

.car_group .nav .accordion_option .total_opion_group {
  border-top: 1px dotted #d8d8d8;
  border-radius: 0;
  color: #3b3b3b;
  font-weight: 600;
  margin-top: 15px;
  padding-top: 15px;
  font-size: 14px;
}

.car_group .nav .accordion_option .total_opion_group label {
  width: 50%;
}

.car_group .nav .accordion_option .total_opion_group > div {
  margin-bottom: 8px;
}

.car_group .nav .accordion_option .total_opion_group > div:last-of-type {
  margin-bottom: 0;
}

.car_group .nav .accordion_option .total_opion_group span {
  width: 50%;
}

.car_group
  .nav
  .accordion_option
  .total_opion_group
  .label_option.total
  .option {
  font-size: 16px;
  color: #3b3b3b;
  font-weight: 600;
}

.accordion_btn.btn_group p button {
  padding-bottom: 0;
  color: #959595;
  font-size: 14px;
  font-weight: 400;
}

.accordion_btn button.close {
  font-size: 0px !important;
}

.accordion_btn button.close:before {
  content: "옵션닫기";
  display: block;
  font-size: 14px;
}

.accordion_btn.capital_btn button.close:before {
  content: "다른 캐피탈 견적 닫기";
  display: block;
  font-size: 14px;
}

.option_wrap .car_list {
  margin-top: 10px;
}

/*광고*/
.ad_group {
  margin-top: 34px;
  padding-bottom: 30px;
}

.ad_group .page_sub_title {
  display: flex;
  flex-direction: column;
  font-size: 18px;
  color: #1e1e1e;
  font-weight: 700;
}

.ad_group .page_sub_title .main_color {
  font-size: 20px;
}

.yotube {
  height: 211px;
  background-color: #d9d9d9;
  width: calc(100% + 20px * 2);
  margin: 0px 0px 0px -20px;
  overflow: hidden;
  cursor: pointer;
}

.ad_info {
  width: 100%;
  margin-top: 20px;
}

.ad_info ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 10px;
}

.ad_info ul li {
  background-color: #fff;
  width: calc(50% - 5px);
  flex-wrap: wrap;
  padding: 20px;
  border-radius: 8px;
}

.ad_info ul li > label {
  width: 100%;
  color: #000000;
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 6px;
  display: block;
}

.ad_info ul li > span {
  width: 100%;
  color: #9b9b9b;
  font-size: 13px;
  font-weight: 500;
  word-break: keep-all;
  display: block;
}

.ad_info ul li .label_sub {
  display: block;
  margin-bottom: 6px;
}

.ad_info ul li .label_sub i {
  display: block;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.ad_info ul li .label_sub i.ico_p1 {
  background-image: url(../images/icon/p-1.svg);
}

.ad_info ul li .label_sub i.ico_p2 {
  background-image: url(../images/icon/p-2.svg);
}

.ad_info ul li .label_sub i.ico_p3 {
  background-image: url(../images/icon/p-3.svg);
}

.ad_info ul li .label_sub i.ico_p4 {
  background-image: url(../images/icon/p-4.svg);
}

/*--------------------------------------------------------------------------------------
문의하기
----------------------------------------------------------------------------------------*/
main .nav .row .content.qna_wrap {
  padding: 0;
  background-color: #f3f4f7;
  padding-bottom: 50px;
}

.qna_wrap .car_group {
  padding: 20px;
  background-color: #fff;
}

.qna_wrap .car_group .nav ul .img_group {
  background-color: transparent;
  border-radius: 0;
  padding: 0;
}

.qna_wrap .car_group .nav li {
  padding: 0;
  box-shadow: none;
  border: 0;
  background-color: transparent;
}

.qna_wrap .car_group .nav li .sub_txt {
  font-size: 14px;
  font-weight: 500;
  color: #333;
}

.qna_wrap .car_group .nav li .sub_txt.add_txt {
  margin-top: 0;
}

.qna_wrap .car_group .nav li .option {
  font-size: 12px;
  font-weight: 500;
  color: #767676;
}

.qna_wrap .car_group .nav .price .g_txt li {
  display: flex;
  margin-bottom: 2px;
  font-size: 13px;
}

.qna_wrap .car_group .nav .price .g_txt li .num {
  margin-left: auto;
  color: #3b3b3b;
  font-weight: 700;
  text-align: right;
}

.qna_wrap .car_group .nav .price .g_txt li .num .num_txt {
  width: 40px;
  display: inline-block;
  text-align: left;
  color: #757575;
  font-weight: 500;
}

.qna_wrap .car_group .nav .price .g_txt li .num .sub_num {
  display: inline-block;
  width: 100px;
}

.qna_wrap .car_group .nav .price .g_txt li .num .main_color {
  font-size: 14px;
}

.qna_wrap .car_group .nav .price .g_txt li .num b {
  margin-right: 3px;
}

.qna_wrap .car_group .nav .price .g_txt li.total {
  border-top: 1px solid #e7e8ec;
  border-radius: 0;
  padding-top: 10px;
  margin-top: 10px;
  font-size: 14px;
}

.qna_wrap .car_group .nav .price .g_txt li.result_list {
  background-color: #ebf1fa;
  padding: 10px;
  border-radius: 6px;
  margin-top: 6px;
}

.qna_wrap .car_group .nav .price .g_txt li.total label {
  color: #3b3b3b;
  font-weight: 500;
}

.qna_wrap .car_group .nav .price .g_txt li.result_list .main_color {
  color: var(--primary);
  font-size: 14px;
}

.qna_wrap .car_group .nav .price .g_txt li.result_list label {
  font-size: 13px;
  font-weight: 400;
}

.qna_wrap .car_group .nav .price .g_txt li.total .num {
  color: var(--primary);
}

.chat {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  padding: 20px;
  padding-top: 0;
  padding-bottom: 120px;
}

.chat .bubble {
  font-size: 14px;
  font-weight: 400;
  border-radius: 6px;
  padding: 10px;
}

.bubble_group {
  display: flex;
}

.chat_profile {
  width: 35px;
  height: 35px;
  background-color: #e8eef9;
  border-radius: 100px;
  margin-right: 8px;
  background-image: url(../images/common/emoji-happy.png);
  background-repeat: no-repeat;
  background-size: 17px;
  background-position: center;
}

.bubble_robot {
  width: calc(100% - 43px);
}

.bubble_robot > span {
  display: inline-block;
}

.bubble_robot .sub_option {
  width: 100%;
  display: block;
}

.bubble_robot .radio_group label {
  background-color: #fff;
}

.bubble_robot .sub_option li {
  margin-bottom: 0;
  padding-bottom: 0;
}

.bubble_robot .bubble {
  background-color: #fff;
  border-radius: 6px;
  margin-bottom: 10px;
  min-width: 90%;
}

.bubble_robot .bubble label {
  font-weight: 500;
}

.bubble_group .name {
  font-size: 12px;
  font-weight: 700;
  color: #404040;
  margin-bottom: 6px;
  display: inline-block;
  width: 100%;
}

.chat_send {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  width: 100%;
}

.chat_send .bubble {
  margin-left: auto;
  background-color: var(--primary);
  color: #fff;
  max-width: 100%;
  margin-bottom: 10px;
}

.chat_send .bubble:last-of-type {
  margin-bottom: 0;
}

.chat_send .correction {
  display: flex;
  text-align: right;
  margin-top: 10px;
  color: #757575;
  font-size: 13px;
  font-weight: 400;
  cursor: pointer;
  margin-left: auto;
  align-items: center;
}

.chat_send .correction i {
  display: inline-block;
  width: 17px;
  height: 17px;
  background-image: url(../images/icon/eraser.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  margin-right: 3px;
}

.footer_wrap .write {
  width: 100%;
  background-color: #fff;
  display: flex;
  align-items: center;
  height: 44px;
}

.text_input {
  width: calc(100% - 50px);
}

.text_input textarea {
  width: 100%;
  border: 0;
  font-size: 15px;
  font-weight: 400;
  color: #000000;
  resize: none;
  height: 50px;
  padding: 15px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.p_write {
  padding: 0;
  padding-bottom: 16px;
}

.text_input textarea:focus {
  outline: 0;
}

.send_ico i {
  display: inline-block;
  width: 50px;
  height: 68px;
  position: relative;
  top: 9px;
  background-color: var(--primary);
  background-image: url(../images/icon/ico_send-fill.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.bubble .accordion_btn {
  padding-bottom: 10px;
  border: 1px solid #ebebeb;
  border-radius: 6px;
  margin-top: 10px;
}

.bubble .accordion_option .ch_result {
  margin-bottom: 3px;
}

.bubble .accordion_option .ch_result i {
  margin-top: -5px;
}

/*--------------------------------------------------------------------------------------
죽시출고
----------------------------------------------------------------------------------------*/
/*라인업*/
.navi_bar {
  width: 100%;
  height: 3px;
  background-color: #f0f0f0;
  position: sticky;
  position: -webkit-sticky;
  top: 58px;
  display: flex;
  z-index: 80;
}

.navi_bar .w-20 {
  width: 20%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-100 {
  width: 100%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-40 {
  width: 40%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-50 {
  width: 40%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-60 {
  width: 60%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-66 {
  width: 66.666666%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-80 {
  width: 80%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-83 {
  width: 83%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-16 {
  width: 16.666666%;
  height: 3px;
  background-color: var(--primary);
}

.navi_bar .w-33 {
  width: 33.333333%;
  height: 3px;
  background-color: var(--primary);
}

.con_release .car_group {
  margin-bottom: 0;
}

.con_release .car_group .nav li {
  box-shadow: none;
  border: 0;
  border-radius: 0;
}

.con_release .radio_form .form_radio_btn label {
  background-color: #fff;
  color: #888c98;
  font-size: 15px;
  font-weight: 400;
  padding: 15px;
  height: auto;
  justify-content: space-between;
  gap: 8px;
}

.con_release .radio_form .form_radio_btn label .lineup_name {
  word-break: keep-all;
}

.con_release .radio_form .form_radio_btn label .badge_stock {
  flex-shrink: 0;
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  color: var(--primary);
  background-color: var(--primary-light);
  border-radius: 20px;
  padding: 5px 10px;
}

.con_release .car_group .img_group {
  margin: 20px;
  margin-bottom: 0;
  min-height: 60px;
}

.con_release .car_group li {
  background-color: transparent !important;
}

.con_release .form_radio_btn input[type="radio"]:checked + label,
.con_release .form_radio_btn input[type="checkbox"]:checked + label {
  font-weight: 500;
}

.radio_form .radio_group {
  margin-bottom: 10px;
}

.radio_form .list_head {
  margin-bottom: 10px;
}

.con_release .radio_form {
  margin-bottom: 16px;
}

.con_release .badge {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 3px 9px;
  border-radius: 99px;
  margin-left: 6px;
}

.badge-required {
  color: #ef4444;
  background: #fef2f2;
  border: 1px solid #fecaca;
}

.badge-optional {
  color: #94a3b8;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}

.color_group {
  width: 100%;
  height: 48px;
  margin-bottom: 10px;
  background-color: #fff;
  border-radius: 8px;
  border: 1px solid #3b3b3b;
  font-size: 14px;
  font-weight: 500;
  color: #3b3b3b;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 10px;
}

/*체크*/
.check_form .con_sub_title {
  font-weight: 500;
  font-size: 18px;
  color: #1f1f1f;
}

.info_release .price .total label {
  font-size: 16px;
  font-weight: 400;
  color: #000000;
}

.info_release .price .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--primary);
}

.g_guide {
  background-color: #f6f6f6;
  font-size: 14px;
  font-weight: 700;
  color: #1f1f1f;
  padding: 16px;
  margin-top: 15px;
}

/*브랜드 선택*/

.list_group {
  width: 100%;
  border-bottom: 1px solid #dbdee0;
  padding-bottom: 15px;
  margin-bottom: 15px;
}

.list_group:last-of-type {
  border-bottom: 0;
}

.list_group ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1%;
  width: 100%;
}

.list_group ul li {
  width: 24%;
  margin-bottom: 1%;
}

.list_group ul li label {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: auto;
  text-align: center;
  padding: 15.4px 4px;
}

.list_group ul li label img {
  width: auto;
  height: 33px;
}

.list_group ul label span {
  width: 100%;
}

.head_select select {
  border-radius: 100px;
  border: 1px solid #cccccc;
  padding: 8px 10px;
  font-size: 14px;
  appearance: none;
  background: url("../images/icon/down.svg") no-repeat 90% 50%/15px auto;
  background-color: #fff;
  padding-right: 30px;
}

.head_check {
  margin-left: auto;
}

.rele_info .car_group .info_group p {
  font-size: 14px;
  color: #3b3b3b;
  font-weight: 600;
}

.rele_info .label_option label {
  width: 50%;
}

.rele_info .label_option .option {
  width: 50%;
}

.list_option {
  width: 100%;
}

.rele_info .head_check.checkbox_group {
  display: inline-block;
  width: auto;
}

.rele_info .head_check.checkbox_group p {
  width: auto;
}

.rele_info .head_check.checkbox_group input[type="checkbox"] + label {
  width: auto;
  font-size: 13px;
  padding: 10px;
  background-color: transparent;
  border: 1px solid #d4d4d5;
  color: #888c98;
  font-weight: 500;
}

.rele_info .head_check.checkbox_group input[type="checkbox"]:checked + label {
  background-color: var(--primary);
  color: #fff;
}

.ico_check {
  display: inline-block;
  width: 13px;
  height: 13px;
  vertical-align: middle;
  margin-top: 3px;
  margin-right: 4px;
  background-image: url(../images/icon/ico_check-g.svg);
  background-repeat: no-repeat;
  background-size: contain;
}

.rele_info
  .head_check.checkbox_group
  input[type="checkbox"]:checked
  + label
  .ico_check {
  background-image: url(../images/icon/ico_check-w.svg);
}

.rele_info .badge_area .badge_group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 4px;
  align-items: center;
}

.car_group .badge_area .badge_group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  align-items: center;
  gap: 4px;
}

.fr_group {
  width: 100%;
  display: flex;
  gap: 4px;
  align-items: center;
}

.se_group {
  width: 100%;
  display: flex;
  gap: 4px;
  align-items: center;
}

.rele_info .badge_area .badge_r_line {
  margin-left: auto;
}

.rele_info .total_txt .price.r_font {
  color: #f36471 !important;
}

/*즉시출고 딜러*/
.rele_info .c_title .name {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.rele_info .c_title .name .com_txt {
  border: 1px solid #e9e9e9;
  padding: 4px;
  font-size: 14px;
  font-weight: 500;
  margin-top: 6px;
  display: flex;
  align-items: center;
}

.rele_info .c_title .name .sub_txt {
  color: #3b3b3b;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  margin-top: 8px;
}

.rele_info .c_title .name .option {
  font-size: 14px;
  color: #767676;
}

.release_del .option_list {
  background-color: #fff;
  padding: 15px;
  border-radius: 8px;
}

.release_del .option_list ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  flex-direction: column;
}

.release_del .option_list ul li {
  display: flex;
  margin-bottom: 6px;
}

.release_del .option_list ul li:last-of-type {
  margin-bottom: 0;
}

.release_del .option_list ul li label {
  color: #8f8f8f;
  font-size: 14px;
}

.release_del .option_list ul li .price {
  font-size: 14px;
  color: #3b3b3b;
  font-weight: 600;
  margin-left: auto;
}

.sub_row {
  margin-bottom: 30px;
}

.sub_row:last-of-type {
  margin-bottom: 0;
}

.sub_row .sub_group {
  background-color: #fff;
  padding: 15px;
  border-radius: 8px;
}

.sub_row .sale_list ul li {
  display: flex;
  width: 100%;
  margin-bottom: 6px;
}

.sub_row .sale_list ul li:last-of-type {
  margin-bottom: 0;
}

.sub_row .sale_list ul li label {
  font-size: 14px;
  color: #8f8f8f;
  font-weight: 500;
}

.sub_row .sale_list ul li .price {
  color: #757575;
  font-size: 14px;
  margin-left: auto;
  font-weight: 600;
}

.sub_row .sale_list ul li .price .main_color {
  margin-right: 4px;
}

.profile_group .profile {
  display: flex;
  align-items: center;
}

.profile_group .profile .img {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  background-color: var(--primary-light);
  border-radius: 100px;
  overflow: hidden;
  margin-right: 15px;
}

.profile_group .profile .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}

.profile_group .profile .info {
  flex: 1;
  min-width: 0;
  color: #404040;
  font-size: 14px;
  font-weight: 500;
}

.profile_group .profile .info p {
  color: #404040;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 4px;
}

.profile_group .btn_group p .ico_btn {
  width: 100%;
  display: flex;
}

.profile_group .btn_group p .ico_btn button {
  flex: 1 1 49%;
}

.survice_group ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 2%;
}

.survice_group ul li {
  width: 49%;
  background-color: #fff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: column;
  margin-bottom: 2%;
  padding: 13px;
  font-weight: 600;
  word-break: keep-all;
  text-align: center;
}

.survice_group ul li img {
  margin-bottom: 8px;
}

.card_car ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 2%;
}

.card_car ul li {
  background-color: #fff;
  width: 49%;
  padding: 15px;
}

.card_car .title {
  color: #000000;
  font-size: 15px;
  width: 100%;
  font-weight: 600;
  margin-bottom: 6px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}

.card_option {
  margin-bottom: 6px;
}

.card_option p {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  font-size: 13px;
  align-items: center;
}

.card_option p label {
  color: #8f8f8f;
  width: 40px;
}

.card_option p span {
  margin-left: auto;
  width: calc(100% - 40px);
  text-align: left;
  font-weight: 500;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
}

.line_g_btn {
  border: 1px solid #d4d4d5;
  border-radius: 3px;
  color: #959595;
  font-size: 13px;
  font-weight: 500;
  width: 100%;
  padding: 4px;
}

.ca_name {
  font-size: 13px;
  margin-bottom: 4px;
  font-weight: 500;
  margin-left: auto;
}

.ca_name span {
  display: inline-block;
  border: 1px solid #dcdfe3;
  padding: 4px 10px;
  border-radius: 4px;
  padding-top: 5px;
}

/*--------------------------------------------------------------------------------------
금리계산기
----------------------------------------------------------------------------------------*/
/*계산하기*/
.write_form .radio_form ul {
  display: flex;
  gap: 6px;
}

.write_form .radio_form li {
  flex: 1 1 33%;
  text-align: center;
}

.write_form .radio_form li label {
  justify-content: center;
}

.write_form .radio_form input {
  border: 1px solid #e7e8ec;
  width: 100%;
  padding: 15px;
  border-radius: 8px;
  font-size: 14px;
}

.input_guide {
  font-size: 11px;
  color: #969696;
  font-weight: 500;
}

/*.con_release .write_form .radio_form {
    margin-bottom: 15px;
}*/

.con_release .write_form .con_sub_title {
  font-size: 15px;
}

.check_radio li:first-of-type {
  flex: 1 1 0;
}

.con_release .radio_form .check_radio li:first-of-type .form_radio_btn label {
  height: 71px;
}

.check_radio.tab_radio li {
  flex: 1 1 50%;
}

.radio_form .check_radio.tab_radio .radio_group {
  margin-bottom: 0;
}

.con_release .radio_form .check_radio.tab_radio li .form_radio_btn label {
  font-size: 13px;
  min-height: 71px;
}

.con_release
  .self_form
  .radio_form
  .check_radio.tab_radio
  li
  .form_radio_btn
  label {
  font-size: 15px;
}

.tab_guide {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  flex-direction: column;
  margin-bottom: 8px;
}

.write_form .radio_form .tab_guide li {
  width: 100%;
  text-align: left;
  font-size: 13px;
  border-radius: 6px;
  color: var(--primary);
  font-weight: 500;
  display: none;
}

.write_form.self_form .radio_form .tab_guide li {
  display: block;
}

.write_form .radio_form .tab_guide li.tab_list.on {
  display: block;
}

.sub_btn {
  width: 100%;
  text-align: center;
  margin-top: 50px;
}

.sub_btn button {
  font-size: 15px;
  color: #959595;
  border-bottom: 1px solid #959595;
}

/*금리계산기 - 상세*/
.price_list .num_nav li {
  flex-wrap: wrap;
  align-items: flex-start !important;
}

.price_list .num_nav label {
  display: flex;
  color: #767676;
}

.price_list .num_nav label.c_align {
  align-items: center;
}

.price_list .num_nav label .title {
  font-weight: 600;
}

.price_list .num_nav label .title b {
  display: block;
  width: 100%;
  font-weight: 400;
}

.price_list .num_nav li span.w-100 {
  margin-left: 15px;
  width: 100%;
}

.price_list .num_nav .count {
  width: 18px;
  margin: 0;
  font-weight: 500;
}

.price_list .num_nav .price_num {
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
}

.sub_accordion {
  width: 100%;
  background-color: #f6f7f8;
  padding: 15px;
  border-radius: 8px;
  margin-top: 6px;
  margin-bottom: 8px;
}

.sub_accordion p {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.sub_accordion p:last-of-type {
  margin-bottom: 0;
}

.sub_accordion p span {
  margin-left: auto;
  font-weight: 600;
  color: #757575;
}

.t_border {
  border-top: 1px dotted #e7e8ec;
  margin-top: 15px;
  padding-top: 15px;
  margin-bottom: 20px !important;
}

/* calc price wrapper — 아코디언 모서리 라운드 */
.calc_price_wrap {
  border-radius: 12px;
  overflow: hidden;
}

/* calc detail 아코디언 초기 숨김 */
.calc_detail.mian_accordion {
  display: none;
}

/* calc 토글 버튼 */
.calc_toggle_btn {
  text-align: center;
  padding: 12px 0 8px;
}

.calc_toggle_btn button {
  font-size: 12px;
  color: var(--primary);
  background-color: transparent;
  border: 1px solid var(--primary);
  border-radius: 20px;
  padding: 6px 20px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}

.calc_toggle_btn button .ico_g_down {
  background-image: url(../images/icon/b-down.svg);
  transition: transform 0.2s ease;
}

.calc_toggle_btn button.close .ico_g_down {
  transform: rotate(180deg);
}

/* calc summary */
.calc_summary {
  background-color: var(--primary-light);
  padding: 14px;
  margin-bottom: 0;
  border-radius: 12px 12px 0 0;
}

.calc_summary .total_interest_label {
  font-size: 13px;
  color: var(--primary);
  font-weight: 500;
}

.calc_summary .total_interest_num {
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 4px;
}

.calc_summary .total_interest_desc {
  font-size: 12px;
  color: #767676;
}

.calc_summary .summary_cards {
  display: flex;
  gap: 10px;
}

.calc_summary .summary_card {
  flex: 1;
  background: #fff;
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
}

.calc_summary .summary_card label {
  font-size: 12px;
  color: #767676;
  display: block;
  margin-bottom: 4px;
}

.calc_summary .summary_card .val {
  font-size: 15px;
  font-weight: 700;
  color: var(--primary);
}

.calc_summary .summary_card.primary {
  background: var(--primary);
}

.calc_summary .summary_card.primary label {
  color: rgba(255, 255, 255, 0.75);
}

.calc_summary .summary_card.primary .val {
  font-size: 18px;
  color: #fff;
}

.calc_summary .summary_card.primary .card_sub {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 4px;
}

/* calc detail */
.calc_detail {
  background-color: #fff;
  padding: 0 15px;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}

.calc_detail .detail_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid #e7e8ec;
}

.calc_detail .detail_row:last-child {
  border-bottom: none;
}

.calc_detail .detail_row .d_label {
  font-size: 13px;
  color: #3b3b3b;
}

.calc_detail .detail_row .d_sub {
  font-size: 12px;
  color: #888;
  margin-top: 2px;
}

.calc_detail .detail_row .d_right {
  display: flex;
  align-items: center;
}

.calc_detail .detail_row .d_pct {
  font-size: 11px;
  color: #9ba3b0;
  font-weight: 500;
  margin-right: 6px;
  white-space: nowrap;
}

.calc_detail .detail_row .d_val {
  font-size: 14px;
  font-weight: 700;
  color: #222;
  white-space: nowrap;
  margin-left: 10px;
}

.calc_detail .detail_row.total_row {
  background-color: #fcfcfc;
  margin: 0 -15px;
  padding: 14px 15px;
  flex-wrap: wrap;
  align-items: center;
}

.calc_detail .detail_row.total_row .d_label {
  font-size: 14px;
  color: #222;
  font-weight: 600;
  flex: 1;
}

.calc_detail .detail_row.total_row .d_val {
  font-size: 16px;
  color: var(--primary);
}

.calc_detail .detail_row.total_row .d_sub {
  width: 100%;
  margin-top: 3px;
}

.calc_detail .main_items {
  display: flex;
  border-bottom: 1px solid #e7e8ec;
  background-color: #fcfcfc;
  margin: 0 -15px;
  padding: 0 15px;
}

.calc_detail .main_items .main_item {
  flex: 1;
  padding: 14px 0;
}

.calc_detail .main_items .main_item:first-child {
  border-right: 1px solid #e7e8ec;
  padding-right: 12px;
}

.calc_detail .main_items .main_item:last-child {
  padding-left: 12px;
}

.calc_detail .main_items .m_label {
  font-size: 12px;
  color: #666;
  margin-bottom: 4px;
}

.calc_detail .main_items .m_val {
  font-size: 15px;
  font-weight: 700;
  color: #222;
}

.calc_detail .main_items .m_sub {
  font-size: 12px;
  color: #888;
  margin-top: 2px;
}

.calc_detail .detail_label {
  font-size: 12px;
  color: #999;
  padding: 12px 0 4px;
  display: block;
}

.num_circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 50%;
  background-color: var(--primary);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  margin-right: 5px;
  vertical-align: middle;
}

.calc_detail .detail_row .d_label,
.calc_detail .main_items .m_label {
  display: flex;
  align-items: center;
}

.num_circle.red {
  background-color: #f36471;
}

.num_tag {
  font-size: 11px;
  font-weight: 700;
  vertical-align: baseline;
  margin-right: 2px;
}

.num_tag.blue {
  color: var(--primary);
}

.num_tag.red {
  color: #f36471;
}

.detail_badge {
  display: inline-block;
  font-size: 10px;
  color: #fff;
  background: var(--primary);
  border-radius: 20px;
  padding: 2px 8px;
  margin-left: 8px;
  vertical-align: middle;
}

.result_list {
  background-color: var(--primary-light);
  border-radius: 8px;
  padding: 15px;
  position: relative;
}

.result_list .accordian_btn {
  position: absolute;
  top: -15px;
  background-color: var(--primary);
  color: #fff;
  padding: 10px 25px;
  left: 50%;
  margin-left: -56.5px;
  border-radius: 100px;
  width: 113px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.result_list .accordian_btn button {
  display: flex;
  align-items: center;
  font-size: 14px;
}

.result_list .accordian_btn button i {
  transform: rotate(90deg) !important;
}

.result_list .accordian_btn button.close {
  font-size: 0px !important;
}

.result_list .accordian_btn button.close i {
  transform: rotate(-90deg) !important;
}

.company_info .accordian_btn button.close i {
  transform: rotate(-180deg) !important;
}

.result_list .accordian_btn button.close:before {
  content: "접기";
  display: block;
  font-size: 14px;
}

.result_list .accordian_btn button i {
  transform: rotate(-90deg);
}

.result_list li {
  flex-wrap: wrap;
  margin-bottom: 4px;
}

.result_list label {
  color: #8f8f8f;
  font-size: 14px;
  font-weight: 600;
}

.result_list label.title {
  color: #3b3b3b;
  font-size: 15px;
}

.result_list .total_result .price_num {
  font-size: 18px;
  color: var(--primary);
  font-weight: 700;
}

.result_list .total_result .r_font {
  width: 100%;
  text-align: right;
  font-weight: 600;
}

.result_list .price_num {
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
}

.btn_banner {
  background-color: #fff;
  margin: 15px 0 26px 0;
  border-radius: 20px;
  padding: 15px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.banner_txt {
  font-size: 18px;
  font-weight: 700;
  color: #000;
  position: relative;
}

.click_img {
  display: inline-block;
  position: absolute;
  bottom: -10px;
  right: 0%;
  transform: rotate(-20deg);
}

.click_img img {
  width: 25px;
  animation: cursorClick 1.8s ease-in-out infinite;
}

@keyframes cursorClick {
  0%,
  100% {
    transform: rotate(-20deg) scale(1) translateY(0);
  }

  40% {
    transform: rotate(-20deg) scale(0.82) translateY(2px);
  }

  60% {
    transform: rotate(-20deg) scale(0.82) translateY(2px);
  }
}

.banner_txt .main_color {
  display: block;
  margin: 0;
}

.next_btn {
  font-size: 14px;
  padding: 10px 20px;
  border-radius: 100px;
  background: linear-gradient(0.25turn, var(--primary-dark), var(--primary));
  margin-top: 8px;
  color: #fff;
  font-weight: 500;
  display: flex;
  align-items: center;
  position: relative;
  animation: btnGlow 1.8s ease-out infinite;
}

@keyframes btnGlow {
  0%,
  38% {
    box-shadow: 0 0 0 0 rgba(var(--primary-rgb), 0.6);
  }

  100% {
    box-shadow: 0 0 0 14px rgba(var(--primary-rgb), 0);
  }
}

.banner_img {
  margin-left: auto;
  width: calc(100% - 250px);
  text-align: right;
}

@keyframes bannerFloat {
  0%,
  100% {
    transform: translateY(0);
  }

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

.banner_img img {
  display: inline-block;
  animation: bannerFloat 2.5s ease-in-out infinite;
}

.next_arrow {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-image: url(../images/icon/next-arrow.svg);
  background-position: center;
  background-size: cover;
  margin-left: 8px;
}

.t_btn_group {
  display: flex;
  width: calc(100% - 50px);
  gap: 2%;
}

.footer_btn .f_group_btn .t_btn_group button.btn_line {
  width: 30%;
}

.footer_btn .f_group_btn .t_btn_group button.btn_main {
  width: 68%;
}

.footer_btn .f_group_btn .t_btn_group.com_btn button.btn_line {
  width: 49%;
}

.footer_btn .f_group_btn .t_btn_group.com_btn button.btn_main {
  width: 49%;
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    270deg,
    var(--primary-dark),
    var(--primary-btn),
    var(--primary),
    var(--primary-dark)
  );
  background-size: 300% 100%;
  animation: btnGradientFlow 4s ease infinite;
}

.footer_btn .f_group_btn .t_btn_group.com_btn button.btn_main::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.35) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-20deg);
  animation: btnShimmer 2.5s ease-in-out infinite;
}

@keyframes btnShimmer {
  0%,
  65% {
    left: -75%;
  }

  100% {
    left: 125%;
  }
}

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

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

/*더낮은 금리 확인*/
.title_guide {
  font-size: 20px;
  font-weight: 400;
  color: #3b3b3b;
  margin-bottom: 20px;
}

.m_top {
  margin-top: 20px;
}

.cla_select {
  width: 100%;
  margin-top: 12px;
  background-color: #fff;
  border-radius: 12px;
  padding: 16px;
}

.sub_guide {
  font-size: 11px;
  color: #969696;
  font-weight: 500;
  width: 100%;
}

.cla_select .search_group {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.cla_select .search_group .form_group {
  width: 100%;
  display: flex;
  gap: 6px;
  margin-top: 6px;
}

.cla_select .search_group .form_head .con_sub_title {
  font-size: 14px;
}

.cla_select .search_group .form_group button {
  background-color: var(--primary);
  color: #fff;
  height: 47px;
  border-radius: 12px;
  padding: 0 15px;
  font-size: 14px;
  width: 111px;
}

.cla_select .search_group .form_group select {
  border: 1px solid #cccccc;
  padding: 12px 8px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(../images/icon/down.svg) no-repeat 95% 50% / 15px auto;
  background-color: #fff;
  padding-right: 20px;
  width: calc(100% - 117px);
}

.cla_select .result_group {
  margin-top: 15px;
}

/* ── result_card 공통 ── */
.result_card {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: #3b3b3b;
  cursor: default;
}

/* ── 카드 헤더 공통 ── */
.result_card .card_header {
  display: flex;
  align-items: center;
  column-gap: 8px;
  row-gap: 2px;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}

.result_card .card_header .card_header_sub {
  margin-left: auto;
  font-weight: 400;
  font-size: 11px;
  opacity: 0.85;
}

/* ── Blue 테마 ── */
.result_card.card_blue {
  border: 1px solid rgba(var(--primary-rgb), 0.25);
}

.result_card.card_blue .card_header {
  background-color: var(--primary);
  flex-wrap: wrap;
}

.result_card.card_blue .card_header .card_header_sub {
  width: 100%;
  margin-left: 22px;
  font-size: 12px;
}

.result_card.card_blue .card_body {
  background-color: #fff;
}

.result_card.card_blue .result_info .info .accent_color {
  color: var(--primary);
}

.result_card.card_blue .btn_accent {
  background-color: var(--primary);
  color: #fff;
}

/* ── Teal 테마 ── */
.result_card.card_green {
  border: 1px solid rgba(79, 174, 166, 0.25);
}

.result_card.card_green .card_header {
  background-color: #4faea6;
  flex-wrap: wrap;
}

.result_card.card_green .card_header .card_header_sub {
  width: 100%;
  margin-left: 28px;
  font-size: 12px;
}

.result_card.card_green .card_body {
  background-color: #fff;
}

.result_card.card_green .result_info .info .accent_color {
  color: #4faea6;
}

.result_card.card_green .btn_accent {
  background-color: #4faea6;
  color: #fff;
}

.result_card.card_green .card_header_badge {
  border-radius: 4px;
  padding: 2px 6px;
}

.pill_badge {
  background-color: #f0fdf4;
  border: 1px solid #b4e5c5;
  border-radius: 20px;
  padding: 2px 8px;
  font-size: 11px;
  color: #15803d;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding-top: 4px;
  margin-left: auto;
}

.pill_badge.pill_up {
  background-color: #e6e9ed;
  border: 1px solid #d3d3d3;
  color: #1f1f1f;
}

.pill_chart_icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

/* ── 카드 바디 공통 ── */
.result_card .card_body {
  padding: 14px;
}

/* ── result_info 공통 ── */
.result_card .result_info .info {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 6px;
}

.result_card .result_info .info label {
  color: #8f8f8f;
  font-size: 13px;
}

.result_card .result_info .info .num {
  margin-left: auto;
  font-weight: 600;
  color: #3b3b3b;
  display: flex;
  align-items: center;
  gap: 6px;
}

.result_card .result_info .info.title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0;
}

.result_card .result_info .info.title label {
  color: #1a1a1a;
  font-size: 18px;
}

.result_card .result_info .info.total_row {
  margin-top: 4px;
}

.result_card .result_info .info.total_row label {
  font-weight: 600;
  color: #3b3b3b;
}

.result_card .result_info .info.total_row .num {
  font-size: 17px;
  font-weight: 700;
  color: #1a1a1a;
}

/* ── 구분선 ── */
.result_card .card_divider {
  border: none;
  border-top: 1px solid #ebebeb;
  margin: 10px 0;
}

/* ── mini_badge (최고 잔가) ── */
.mini_badge {
  font-size: 11px;
  font-weight: 600;
  border: 1px solid currentColor;
  border-radius: 4px;
  padding: 1px 5px;
  white-space: nowrap;
  vertical-align: middle;
  padding-top: 3px;
}

/* ── 버튼 그룹 ── */
.result_card .btn_group {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.result_card .btn_group .btn {
  flex: 1;
  padding: 11px 0;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: none;
}

.result_card .btn_dark_line {
  background-color: #fff;
  color: #3b3b3b;
  border: 1px solid #ccc !important;
}

.result_card .btn_accent {
  border: none;
}

/* ── 섹션 구분 (li.section_head) ── */
.section_head {
  list-style: none;
  margin-bottom: 12px;
  padding: 0;
  background: none !important;
  border: none !important;
}

.section_head .section_title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 700;
  color: #222;
  padding-left: 10px;
  border-left: 3px solid #4faea6;
  margin-bottom: 10px;
}

.section_head.section_head_blue .section_title {
  border-left-color: var(--primary);
}

.section_notice {
  border-radius: 8px;
  padding: 12px;
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.5;
  word-break: keep-all;
  margin-top: 8px;
}

.section_notice.notice_green {
  background-color: #f0fafa;
  color: #3a6460;
}

.section_notice.notice_blue {
  background-color: #eef3fd;
  color: #2e4f8a;
}

.section_notice .notice_ico {
  font-style: normal;
  font-weight: 700;
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  flex-shrink: 0;
  margin-top: 1px;
}

.section_notice.notice_green .notice_ico {
  background-color: #4faea6;
}

.section_notice.notice_blue .notice_ico {
  background-color: var(--primary);
}

.section_notice p {
  width: calc(100% - 18px);
  word-break: keep-all;
}

.section_notice.notice_green strong {
  font-weight: 700;
  color: #2a7a74;
}

.section_notice.notice_blue strong {
  font-weight: 700;
  color: #1a4db3;
}

i.ico_o_plus {
  width: 18px;
  height: 18px;
  background-image: url(../images/icon/ico_o_plus.svg);
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: 6px;
  background-position: center;
}

.i_pr_down {
  margin-left: 4px;
  display: inline-block;
  width: 20px;
  height: 16px;
  background-image: url(../images/icon/ico_r_down.svg);
  background-repeat: no-repeat;
  background-size: contain;
}

.result_group .btn_group p .ico_btn {
  width: 100%;
}

.mian_accordion {
  display: none;
}

.no_data {
  color: #85898f;
  font-weight: 500;
  font-size: 16px;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}

.no_result {
  margin: 0;
  padding: 16px 0;
}

/*금리계산기 스케줄표*/
.schedule {
  border-collapse: collapse;
  text-align: center;
  width: 100%;
}

.schedule td {
  border: 1px solid #d2d2d2;
  padding: 4px;
  font-size: 13px;
  background-color: #fff;
}

.schedule th {
  border: 1px solid #b4bdeb;
  padding: 4px;
  font-size: 13px;
  background-color: #d9e2f3;
  font-weight: 500;
}

/*--------------------------------------------------------------------------------------
할인정보
----------------------------------------------------------------------------------------*/
/*리스트*/
.badge_option {
  width: 100%;
}

.badge_option ul {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  gap: 1%;
}

.badge_option ul li {
  display: flex;
  width: auto;
  align-items: center;
  height: 48px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 500;
  word-break: keep-all;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
  flex-wrap: wrap;
  color: #3b3b3b;
  background-color: #fff;
  margin-bottom: 1%;
  align-items: center;
}

main .nav .row .content:has(.badge_option) {
  padding-bottom: 0px !important;
}

.badge_option ul li img {
  height: 28px;
  margin-right: 3px;
}

.badge_option ul li i {
  width: 20px;
  height: 20px;
  margin-left: auto;
  background-position: center;
  background-size: contain;
  margin-left: 10px;
  cursor: pointer;
}

.filter_group {
  display: flex;
  font-weight: 500;
  font-size: 13px;
  color: #3b3b3b;
  gap: 4px;
}

.filter_group button {
  padding: 6px;
  border: 1px solid #ccc;
  border-radius: 6px;
  display: flex;
  align-items: center;
}

.filter_group button i {
  width: 14px;
  height: 14px;
  background-image: url(../images/icon/ico_filter.svg);
  background-repeat: no-repeat;
  background-size: cover;
  margin-right: 2px;
}

.filter_group .ico_btn {
  width: 52px;
  text-align: center;
  justify-content: center;
}

.filter_group button i.ico_reset {
  background-image: url(../images/icon/ico_reset.svg) !important;
  width: 20px;
  height: 20px;
}

.sale_contents .head_select {
  margin-left: auto;
}

.tag_badge {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  font-size: 11px;
  gap: 3px;
  align-items: center;
  font-weight: 500;
  color: #787878;
  margin-bottom: 4px;
}

.tag_badge span {
  padding: 3px 8px;
  background-color: #e4e4e4;
  border-radius: 100px;
}

.sale_contents .trim_info .info {
  display: flex;
  width: 100%;
  align-items: center;
  margin-bottom: 4px;
}

.sale_contents .trim_info .info label {
  font-size: 13px;
  font-weight: 500;
  color: #8f8f8f;
}

.sale_contents .trim_info .info .num {
  margin-left: auto;
  font-size: 14px;
  font-weight: 600;
  color: #111111;
}

.sale_contents .trim_info .info .num b {
  margin-right: 3px;
}

.rele_info .c_title .name .sub_t_wrap .sub_txt {
  margin: 0;
  margin-bottom: 2px;
}

.sale_contents .accordion_option {
  padding: 0;
}

.sale_contents .accordion_option .accordion_title {
  margin: 15px;
  padding-bottom: 10px;
  padding-top: 15px;
  margin-bottom: 10px;
}

.sale_contents .accordion_option > ul {
  padding: 15px;
  padding-top: 10px;
}

.acc_wrap {
  background-color: #fff;
  width: 100%;
  margin-top: 15px;
}

.sale_contents .accordion_option .acc_wrap .accordion_title {
  margin: 0;
  padding: 0;
  margin-bottom: 4px;
  padding-bottom: 4px;
}

.acc_wrap > label {
  font-weight: 600;
  font-size: 15px;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  align-items: center;
  margin-bottom: 8px;
  padding-top: 10px;
}

.acc_group {
  padding: 15px;
  background-color: #f6f7f8;
  border-radius: 6px;
  margin-bottom: 10px;
}

.m_section .model {
  width: 100%;
  text-align: left;
  font-size: 15px;
}

.acc_group .label_group {
  width: 100%;
  display: flex;
  font-size: 15px;
  align-items: center;
}

.acc_group .label_group label {
  font-size: 14px;
}

.acc_group .label_group .num {
  margin-left: auto;
  font-weight: 700;
}

.checkbox_group.p_10 input[type="checkbox"] + label {
  padding: 10px;
}

.label_sub {
  width: 100%;
  text-align: left;
  font-size: 13px;
}

.release_del .sale_contents .option_list .com_title label {
  font-size: 15px;
  color: #1f1f1f;
  font-weight: 600;
}

.release_del .sale_contents .option_list .com_title .price.main_color {
  font-size: 15px;
  color: var(--primary);
  font-weight: 700;
}

.release_del .sale_contents .option_list ul {
  border-bottom: 1px solid #e7e8ec;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.release_del .sale_contents .option_list ul:last-of-type {
  border-bottom: 0;
}

.release_del .sale_contents .option_list .btn_group p .ico_btn {
  width: 100%;
}

.release_del .sale_contents .option_list .btn_group p .ico_btn button {
  width: 100%;
}

.sale_contents .info_group .total_txt .price {
  color: #000000 !important;
}

.sale_contents .info_group .total_txt .price.r_font {
  color: #f36471 !important;
}

.ai_group .n_data {
  width: 100% !important;
}

.ai_group .info_group .total_txt .price b {
  color: #5e5e5e;
  font-size: 12px;
}

.sale_contents .badge_area .badge_group i {
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: cover;
  margin-left: auto;
  background-image: url(../images/icon/ico_g_share.svg);
}

.ai_group .nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 2%;
}

.ai_group .img_group {
  display: flex;
  flex-wrap: wrap;
}

.ai_group .img_group > div {
  width: 100%;
}

.ai_group .img_group .sub_txt {
  margin-top: 4px;
}

.car_group.ai_group .info_group p.total_txt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.ai_group .img_group .total_txt label {
  width: 82px;
  margin-left: 4px;
}

.ai_group .img_group .total_txt .price {
  width: calc(100% - 86px);
  word-break: keep-all;
  flex-wrap: wrap;
}

.ai_group .nav ul li {
  width: 49%;
  margin: 0;
  border: 0;
  margin-bottom: 2%;
}

.sale_contents .car_list .car_group .nav li i.ico_share {
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: cover;
  margin-left: auto;
  background-image: url(../images/icon/ico_g_share.svg);
}

.sale_contents .accordion_btn button.close:before {
  content: "트림 접기";
}

.sale_contents .total_txt .price.main_color {
  color: var(--primary) !important;
}

.sale_contents .option_list .btn_group p > span {
  width: 100%;
  display: flex;
  gap: 2%;
}

.sale_contents .option_list .btn_group button {
  flex: 1 1 49%;
}

.b_title {
  font-size: 14px !important;
  color: #3b3b3b !important;
  font-weight: 600;
}

.brand_list .checkbox_group p {
  width: calc(25% - 8px);
}

.brand_list .checkbox_group input[type="checkbox"] + label {
  flex-direction: column;
  flex-wrap: wrap;
  height: auto;
  text-align: center;
  padding: 15.4px 4px;
  color: #3b3b3b;
  font-size: 14px;
  font-weight: 500;
}

.brand_list .checkbox_group img {
  width: auto;
  height: 33px;
  object-fit: contain;
  margin-bottom: 3px;
}

.check_color li {
  display: flex;
  color: #3b3b3b;
  font-size: 15px;
  font-weight: 600;
  height: auto;
  margin-bottom: 10px;
  cursor: pointer;
  align-items: center;
  flex-wrap: wrap;
}

.check_color li .sele_option {
  border-radius: 8px 8px 0 0;
  padding: 15px;
  border-bottom: 1px solid #e7e8ec;
  background-color: #fff;
  display: flex;
  align-items: center;
  width: 100%;
}

.sele_value {
  width: 100%;
  border-radius: 0 0 8px 8px;
  padding: 10px 15px;
  background-color: #fff;
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 14px;
  background-color: #ffffff;
  border-top: 0;
  cursor: default;
}

.check_color li i {
  margin-left: auto;
}

.total_form {
  align-items: center;
  width: 100%;
  padding: 15px 20px;
  display: flex;
  background-color: #ffffff;
  background-image: linear-gradient(
    to right,
    var(--primary) 50%,
    rgba(255, 255, 255, 0) 0%
  );
  background-position: top;
  background-size: 10px 1.4px;
  background-repeat: repeat-x;
}

.total_form label {
  font-size: 15px;
  font-weight: 600;
  color: #000;
}

.total_form .num {
  margin-left: auto;
  font-size: 18px;
  color: var(--primary);
  font-weight: 600;
}

.f_total_form {
  align-items: center;
  width: 500px;
  position: fixed;
  z-index: 90;
  bottom: 182px;
  left: 50%;
  padding: 25px 20px;
  margin-left: -70px;
  display: flex;
  background-color: #ffffff;
  background-image: linear-gradient(
    to right,
    var(--primary) 50%,
    rgba(255, 255, 255, 0) 0%
  );
  background-position: top;
  background-size: 10px 1.4px;
  background-repeat: repeat-x;
}

.f_total_form label {
  font-size: 15px;
  font-weight: 600;
  color: #000;
}

.f_total_form .num {
  margin-left: auto;
  font-size: 18px;
  color: var(--primary);
  font-weight: 600;
}

.form_ptitle {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 15px;
}

.write_form.self_form .radio_form input {
  margin-top: 10px;
}

.write_form.self_form .radio_form input.p_0 {
  margin-top: 0px;
}

.con_release
  .self_form
  .radio_form
  .check_radio
  li:first-of-type
  .form_radio_btn
  label {
  height: auto;
}

.con_release .self_form .radio_form .check_radio li:first-of-type {
  height: auto;
}

.self_info {
  padding-bottom: 100px;
}

.self_info .c_title .name {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.self_info .c_title .name .sub_txt {
  color: #3b3b3b;
  font-size: 14px;
  font-weight: 500;
  margin-top: 8px;
  margin-bottom: 0;
}

.self_info .c_title .name .sub_txt.add_txt {
  margin-top: 0;
}

.self_info .c_title .name .txt_color {
  font-size: 14px;
  color: #767676;
  margin-top: 4px;
}

.self_info .btn_group p .ico_btn .main_color {
  width: 100%;
}

.h_search_form .select_form {
  width: 100%;
}

.h_search_form .search_group .form_group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 6px;
  margin-top: 6px;
}

.h_search_form .search_group .form_group select {
  border: 1px solid #cccccc;
  padding: 12px 8px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(../images/icon/down.svg) no-repeat 95% 50% / 15px auto;
  background-color: #fff;
  padding-right: 20px;
  width: calc(100% - 117px);
}

.h_search_form .search_group .form_group button {
  background-color: var(--primary);
  color: #fff;
  height: 47px;
  border-radius: 8px;
  padding: 0 15px;
  font-size: 14px;
  width: 111px;
}

.h_search_form .head_select {
  display: flex;
  width: 100%;
  justify-content: flex-end;
  gap: 4px;
  margin-top: 10px;
}

.self_info .option_list {
  background-color: #fff;
  border-radius: 6px;
  padding: 15px;
}

.self_info .option_list li {
  display: flex;
  width: 100%;
  font-size: 14px;
  color: #3b3b3b;
  margin-bottom: 6px;
}

.self_info .option_list li .price {
  margin-left: auto;
  font-weight: 600;
  color: #000;
  display: flex;
}

.self_info .option_list li .price span {
  min-width: 100px;
  max-width: 200px;
  text-align: right;
  display: inline-block;
}

.self_info .option_list li .price b {
  width: 50px;
  text-align: left;
  display: inline-block;
}

.self_info .option_list .btn_group {
  width: 100%;
}

.self_info .option_list .btn_group .ico_btn {
  width: 100%;
}

.self_info .option_list .btn_group button {
  width: 100%;
}

.self_info .car_group .nav li {
  padding: 15px;
  border-radius: 6px;
  border-bottom: 0;
}

.self_info .car_group .nav li .info_num > div {
  display: flex;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 6px;
}

.self_info .car_group .nav li .info_num .t_num .num span {
  text-align: right;
  min-width: 100px;
  max-width: 200px;
  display: inline-block;
}

.self_info .car_group .nav li .info_num b {
  width: 86px;
  text-align: left;
  display: inline-block;
  margin: 0;
}

.self_info .car_group .nav li .info_num > div .num {
  margin-left: auto;
  font-weight: 600;
}

.self_info .car_group .nav li .info_num > div .num_group {
  margin-left: auto;
  font-weight: 600;
}

.self_info .car_group .nav li .info_num > div label {
  color: #8f8f8f;
}

.t_num .num_group {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.self_info .car_group .nav li .info_num .total_num {
  border-top: 1px solid #e7e8ec;
  padding-top: 10px;
  margin-top: 10px;
}

.self_info .car_group .nav li .group_title {
  font-size: 16px;
  margin-bottom: 10px;
  font-weight: 600;
}

.self_info .car_group .nav li .group_title h3 {
  display: flex;
  align-items: center;
}

.self_info .car_group .nav li .group_title h3 label {
  margin-right: 6px;
}

.self_info .car_group .nav li .group_title .v-car-labels {
  width: auto;
  position: relative;
  top: 1px;
}

.self_info .car_group .nav li .group_title h3 .num {
  margin-left: auto;
}

i.ico_ranking {
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 4px;
}

i.g_ranking {
  background-image: url(../images/icon/g_ico_crown.svg);
}

i.s_ranking {
  background-image: url(../images/icon/s_ico_crown.svg);
}

i.b_ranking {
  background-image: url(../images/icon/b_ico_crown.svg);
}

.my_qna .section_footer {
  padding-bottom: 80px;
}

.my_qna .ran_txt {
  margin-bottom: 10px;
  margin-top: 0;
}

.ran_txt {
  font-size: 12px;
  font-weight: 400;
  position: relative;
  width: 100%;
  background-color: #f5f8fb;
  padding: 6px 4px;
  border-radius: 2px;
  margin-top: 3px;
  color: #4d4d4d;
}

.ran_txt .main_color {
  font-weight: 500;
}

.result_group .ran_txt {
  margin-bottom: 6px;
  margin-top: 0;
}

/*문의하기*/
.chat_check {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 1%;
  flex-direction: row;
  margin-top: 10px;
}

.chat_check li {
  flex: 1 1 49.5%;
  background-color: #eff1f6;
  text-align: center;
  padding: 7px;
  border-radius: 6px;
  font-weight: 500;
  font-size: 14px;
  cursor: pointer;
  margin-bottom: 1%;
}

.chat_check.check_100 li {
  width: 100%;
}

.bubble_robot .chat_info {
  border-top: 1px solid #eeeeee;
  margin-top: 10px;
  padding-top: 10px;
}

.main_txt {
  font-size: 15px;
  font-weight: 600;
  color: #000;
}

.bubble_robot .chat_info .sub_txt {
  font-size: 13px;
  font-weight: 400;
  color: #000;
  word-break: keep-all;
}

.bubble_robot .chat_info .ch_result {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 100%;
}

.ico_s_check {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url(../images/icon/ico_chat_check.svg);
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  margin-right: 2px;
}

.qna_modal input {
  width: 100%;
  height: 48px;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  word-break: keep-all;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
  flex-wrap: wrap;
  color: #3b3b3b;
  background-color: #fff;
}

.m_qna_radio {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.m_qna_radio li {
  flex: 1 1 48%;
}

.modal .nav .m_qna_radio li .form_radio_btn label {
  height: 48px;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin-bottom: 0;
}

.modal .chk_box {
  display: block;
  position: relative;
  padding-left: 25px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: underline;
  text-decoration-color: #8f8f8f;
}

.modal .chk_box input[type="checkbox"] {
  display: none;
}

.modal .on {
  width: 20px;
  height: 20px;
  background: #e7e8ec;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 3px;
}

.modal .chk_box input[type="checkbox"]:checked + .on {
  background: var(--primary);
}

.modal .on:after {
  content: "";
  position: absolute;
  display: none;
}

.modal .chk_box input[type="checkbox"]:checked + .on:after {
  display: block;
}

.modal .on:after {
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 7px;
  top: 3px;
}

.qna_modal.login_ka .nav {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding-bottom: 40px;
}

.qna_modal.login_ka .nav img {
  width: 70px;
  margin-bottom: 10px;
}

.qna_modal.login_ka .nav .guide_txt {
  font-size: 20px;
  font-weight: 700;
}

.nav.m-margin-b h5 {
  margin-bottom: 5px !important;
}

.flex_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.qna_done {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.qna_done h3 {
  font-size: 22px;
  font-weight: 600;
}

.qna_done .qna_guide {
  background-color: #ebf1fa;
  padding: 20px;
  font-weight: 500;
  font-size: 16px;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 10px;
  border-radius: 6px;
  width: 90%;
}

.qna_done button {
  background-color: var(--primary);
  border-radius: 6px;
  width: 90%;
  margin: 20px;
  color: #fff;
  padding: 16px;
}

.chat_check .check_input {
  background-color: #fff;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  width: 100%;
  border-radius: 6px;
  border: 1px solid #e7e8ec;
  overflow: hidden;
  padding: 0;
}

.c_input_group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border-bottom: 1px solid #e7e8ec;
}

.c_input_group:last-of-type {
  border-bottom: 0;
}

.c_input_group label {
  width: 50px;
  font-size: 14px;
  color: #757575;
  padding: 8px 0;
  border-right: 1px solid #e7e8ec;
}

.c_input_group .form {
  width: calc(100% - 50px);
  display: flex;
  align-items: center;
}

.c_input_group .form input {
  width: calc(100% - 20px);
  border: 0;
  padding: 4px;
  text-align: right;
}

.c_input_group .form span {
  width: 20px;
}

.check_input button {
  padding: 5px;
}

.qna_wrap .car_group .nav li.c_list {
  background-color: #ebf1fa !important;
  padding: 10px;
  margin-top: 6px;
}

.qna_wrap .car_group .nav li.c_list .num {
  color: var(--primary) !important;
}

.pa_bt .car_list .car_group .nav li {
  padding-top: 5px;
  padding-bottom: 8px;
}

.pa_bt .car_group .img_group {
  margin-bottom: 4px;
}

.sale_contents.pa_bt.tab_contents {
  padding-top: 5px;
  padding-bottom: 120px;
}

/*모달*/
.sale_modal {
  position: relative;
}

.bg_search {
  position: absolute;
  width: 100px;
  height: 100px;
  display: inline-block;
  left: 50px;
  background-image: url(../images/common/bg_search.svg);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
  opacity: 0.8;
}

.sale_modal .m_section .nav {
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  text-align: center;
}

.sale_modal .m_section .nav span {
  position: relative;
  z-index: 2;
}

.sale_modal .m_section .nav .r_font {
  font-weight: 700;
}

.form_guide {
  background-color: #f5f5fa;
  font-size: 12px;
  padding: 10px;
  color: #434343;
  font-weight: 500;
  border-radius: 6px;
  word-break: keep-all;
}

/*--------------------------------------------------------------------------------------
이벤트
----------------------------------------------------------------------------------------*/

.event_info {
  padding-bottom: 20px !important;
}

.event_wrap .content_tab {
  margin-bottom: 30px;
}

.event_wrap .content_tab ul {
  display: flex;
  align-items: center;
  background-color: #fff;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.event_nav {
  margin-bottom: 20px;
}

.event_wrap .content_tab ul li {
  text-align: center;
  padding: 12px;
  width: 50%;
  font-size: 15px;
  font-weight: 500;
  color: #8f8f8f;
  cursor: pointer;
}

.event_wrap .content_tab ul li.on {
  background-color: var(--primary);
  color: #fff;
}

.event_nav ul {
  width: 100%;
}

.event_nav ul li {
  background-color: #fff;
  margin-bottom: 10px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  border: 1px solid #e5e7eb;
}

.event_nav ul li .end {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.38);
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 10px;
  z-index: 1;
}

.ev_info {
  padding: 15px;
}

.ev_info label {
  font-size: 16px;
  color: #1e1e1e;
  font-weight: 600;
}

.ev_date {
  display: flex;
  align-items: center;
  color: #757575;
  font-size: 14px;
  font-weight: 500;
}

.ev_date .d_day {
  margin-left: auto;
}

.ev_date .d_day .badge {
  background-color: var(--primary-light);
  color: var(--primary);
  font-weight: 500;
}

.ev_img {
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 100%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.ev_img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
}

.ev_img_info {
  display: block;
}

.ev_img_info label {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}

.ev_img_info .date {
  font-size: 14px;
  color: #757575;
}

/*이벤트 상세*/
.event_info > div {
  margin-bottom: 15px;
}

.ev_title h3 {
  font-size: 16px;
  font-weight: 600;
  color: #000;
}

.ev_title .date {
  font-size: 13px;
  color: #757575;
}

.ev_main_visual {
  width: 100%;
  background-color: #fff;
  border-radius: 10px;
  min-height: 200px;
  overflow: hidden;
  cursor: pointer;
}

.ev_main_visual img {
  width: 100%;
}

.ev_txt {
  background-color: #fff;
  width: 100%;
  border-radius: 10px;
  padding: 20px 15px;
  text-align: left;
  font-weight: 500;
}

.ev_suv_visual {
  background-color: var(--primary);
  border-radius: 10px;
  overflow: hidden;
  color: #fff;
  padding: 20px;
  padding-top: 30px;
  padding-bottom: 100px;
  text-align: center;
  font-weight: 500;
  background-image: url(../images/common/ev_bg.svg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: bottom;
}

.ev_suv_visual .btn_group {
  color: #fff;
  width: 100%;
  display: flex;
  gap: 2%;
  justify-content: center;
}

.ev_suv_visual .btn_group button {
  padding: 10px;
  width: 40%;
}

/*--------------------------------------------------------------------------------------
로그인
----------------------------------------------------------------------------------------*/

.login_wrap {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 15px;
  position: relative;
}

.login_wrap .section_footer {
  position: absolute;
  bottom: 50px;
}

.logo_div {
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 50px;
}

.logo_div img {
  width: 150px;
}

.logo_div p {
  margin-top: 22px;
  font-size: 15px;
}

.logo_div .main_color {
  font-weight: 600;
}

.login_btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.login_btn .btn_group {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

/*마케팅 동의 상세*/
.agree_info {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 20px;
  font-size: 15px;
}

.agree_info .main_t_txt {
  display: inline-block;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}

.agree_info .sub_t_txt {
  display: inline-block;
  width: 100%;
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 4px;
}

/*--------------------------------------------------------------------------------------
마이페이지
----------------------------------------------------------------------------------------*/
.mypage .my_nav {
  background-color: #fff;
  border-radius: 10px;
  margin-bottom: 20px;
  padding: 15px;
  border: 1px solid #e5e7eb;
}

.mypage .my_nav:last-of-type {
  margin-bottom: 30px;
}

.mypage .my_nav.profile {
  display: flex;
  flex-direction: column;
}

.my_nav.profile .pro_info {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

.my_nav.profile .pro_info .img {
  width: 50px;
  height: 50px;
  background-color: #e2e2e2;
  border-radius: 100px;
  margin-right: 10px;
  background-image: url(../images/icon/ico_user_pro.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30px;
  overflow: hidden;
  cursor: pointer;
}

.my_nav.profile .pro_info .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.my_nav.profile .pro_info .img.y_img {
  background-size: cover;
}

.my_nav.profile .pro_btn button {
  background-color: #f1f2f4;
  width: 100%;
  border-radius: 6px;
  padding: 8px;
  font-size: 15px;
  font-weight: 500;
}

.my_nav.profile .pro_btn .btn_kakao {
  background-color: #fde500;
  color: #3b1f1e;
  height: auto;
}

.mypage .my_nav .row_menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 5px 0;
}

.mypage .my_nav .row_menu li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33.333333%;
  cursor: pointer;
  flex-direction: column;
  font-size: 15px;
  font-weight: 500;
  border-left: 1px solid #e5e7eb;
}

.mypage .my_nav .row_menu li:first-of-type {
  border-left: 0;
}

.mypage .my_nav .row_menu li i {
  margin-bottom: 6px;
}

.mypage .my_nav.event {
  padding: 0;
  overflow: hidden;
  background-color: transparent;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide {
  background-color: #e5e5e5;
  border-radius: 10px;
  height: 120px;
  width: 300px !important;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide {
  display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
  align-items: flex-start;
  padding: 15px;
  text-align: left;
  cursor: pointer;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide .badge {
  border-radius: 100px;
  margin-bottom: 5px;
  font-weight: 600;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide img {
  position: absolute;
  width: auto;
  height: 70px;
  right: 15px;
  bottom: 15px;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide.swiper_color_b {
  background-color: var(--primary);
  color: #fff;
  font-weight: 500;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide.swiper_color_b .badge {
  color: var(--primary);
  background-color: #bfd6ff;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide.swiper_color_g {
  background-color: #7fd7ad;
  color: #fff;
  font-weight: 500;
}

.mypage .my_nav.event .mySwiper2 .swiper-slide.swiper_color_g .badge {
  color: #6fbc97;
  background-color: #d6ffeb;
}

.mypage .my_nav .col_menu {
  display: flex;
  flex-direction: column;
  gap: 22px;
  cursor: pointer;
}

.mypage .my_nav .col_menu li {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 500;
}

.mypage .my_nav .col_menu li .ico_next {
  margin-left: auto;
}

.mypage .my_nav .col_menu li i:first-of-type {
  margin-right: 12px;
}

/*프로필 수정*/
.profile_form ul li {
  margin-bottom: 15px;
}

.profile_form ul li label {
  font-size: 15px;
  width: 100%;
  display: block;
  margin-bottom: 10px;
  font-weight: 600;
}

.profile_form ul li input {
  border: 1px solid #e7e8ec;
  padding: 15px 10px;
  border-radius: 6px;
  font-size: 15px;
  width: 100%;
}

.profile_photo {
  position: relative;
  width: 68px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px !important;
}

.profile_change {
  width: 68px;
  height: 68px;
  background-color: #e2e2e2;
  border-radius: 100px;
  overflow: hidden;
  background-image: url(../images/icon/ico_user_pro.svg);
  background-repeat: no-repeat;
  background-size: 40px;
  background-position: center;
  cursor: pointer;
}

.profile_change.y_img {
  background-size: cover;
}

.change_btn {
  width: 30px;
  height: 30px;
  position: absolute;
  background-color: #969696;
  border-radius: 100px;
  background-image: url(../images/icon/ico_camera.svg);
  background-repeat: no-repeat;
  background-size: 18px;
  background-position: center;
  bottom: -5px;
  right: -5px;
}

.profile_form .chk_box {
  display: block;
  position: relative;
  padding-left: 25px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.profile_form .input_group label.chk_box {
  font-weight: 500;
  font-size: 14px;
}

.profile_form .chk_box input[type="checkbox"] {
  display: none;
}

.profile_form .input_group .on {
  width: 20px;
  height: 20px;
  background: #fff;
  border: 1px solid #e7e8ec;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 3px;
}

.profile_form .chk_box input[type="checkbox"]:checked + .on {
  background: var(--primary);
}

.profile_form .on:after {
  content: "";
  position: absolute;
  display: none;
}

.profile_form .chk_box input[type="checkbox"]:checked + .on:after {
  display: block;
}

.profile_form .input_group .on:after {
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 7px;
  top: 3px;
}

.mypage .sub_btn {
  border-bottom: 1px solid #a2a2a2;
  color: #a2a2a2;
  width: auto !important;
  margin: 0 auto;
  display: block;
  margin-top: 40px;
}

/*찜한차량 - 금리계산*/

.save_info .search_bar {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  margin-bottom: 10px;
}

.save_info .search_bar input {
  border: 1px solid #e7e8ec;
  padding: 12px 8px;
  font-size: 15px;
  width: calc(100% - 106px);
  border-radius: 6px;
}

.save_info .search_bar button {
  width: 100px;
  border-radius: 6px;
  padding: 8px;
  font-size: 15px;
  height: 48.5px;
}

.save_info .head_select {
  margin-bottom: 10px;
}

.save_info .top_group {
  display: flex;
  margin-bottom: 4px;
  align-items: center;
  flex-wrap: wrap;
}

.save_info .top_group .date {
  font-size: 13px;
  color: #959595;
  font-weight: 600;
}

.save_info .top_group .ico_save {
  width: 20px;
  height: 20px;
  background-size: 20px;
  margin-right: 6px;
}

.save_info .top_group .ico_save.on {
  background-size: 20px;
}

.save_info .top_group .ico_share {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  margin-left: auto;
  cursor: pointer;
}

.save_info .info_group label {
  font-size: 14px;
  font-weight: 600;
  color: #3b3b3b;
  display: flex;
}

.save_info .info_group label.capital_title {
  width: 100%;
}

.save_info .info_group label.capital_title i {
  position: relative;
  top: 3px;
  margin-right: 4px;
  color: var(--primary);
}

.save_info .info_group .accordion_option .capital label {
  width: 100%;
}

.save_info .info_group label .price.main_color {
  margin-left: auto;
  color: var(--primary) !important;
}

.save_info .info_group .total_txt {
  flex-wrap: wrap;
}

.sub_total {
  width: 100%;
  color: #757575;
  font-size: 14px;
  display: flex;
  align-items: center;
}

.sub_total span {
  font-weight: 700;
  margin-left: auto;
}

.sub_total label {
  color: #8f8f8f !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

/*문의내역*/
.save_info {
  margin-bottom: 40px;
}

.my_qna .swiper {
  margin-bottom: 15px;
}

.my_qna .swiper-slide {
  background-color: #fff;
  width: auto !important;
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 500;
  border-radius: 6px;
  color: #888c98;
  border: 1px solid #e7e8ec;
  cursor: pointer;
}

.my_qna .swiper-slide.on {
  border: 1px solid var(--primary);
  color: var(--primary);
  font-weight: 600;
}

.my_qna .qna_badge {
  width: 100%;
  font-size: 13px;
  margin-bottom: 3px;
}

.my_qna .qna_badge span {
  display: inline-block;
  padding: 4px 6px;
  border-radius: 9px;
  font-weight: 600;
}

.my_qna .label_option label {
  width: 49%;
}

.my_qna .label_option .option {
  width: 50%;
}

.my_qna .car_group li {
  border-bottom: 0;
}

.my_qna .car_group .info_group p .price.main_color {
  color: var(--primary);
}

.my_qna .car_group .info_group p .price.r_font {
  color: #f36471 !important;
}

.my_qna .car_group .info_group p .price b {
  margin-right: 4px;
}

.my_qna .capital_nav {
  display: flex;
  flex-wrap: wrap;
  border-top: 1.5px dotted #d8d8d8;
  margin-top: 10px;
  padding-top: 10px;
}

.my_qna .capital_nav > span {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 3px;
}

.my_qna .car_group .info_group .capital .capital_nav .price {
  margin-left: auto;
  color: #767676;
  font-size: 14px;
  font-weight: 600;
}

.my_qna .car_group .info_group .capital .capital_nav .price b {
  margin-right: 4px;
  font-size: 13px !important;
}

.my_qna .car_group .info_group .capital .capital_nav .label i {
  display: inline-block;
  position: relative;
  top: -4px;
}

.capital_title {
  margin-bottom: 4px;
}

.accordion_option.n_bg {
  background-color: #fff;
  padding: 0;
  border-top: 1px solid #e2e2e2;
}

.my_qna .accordion_option .capital_nav {
  border: 0;
  margin-top: 0;
  padding-top: 0;
}

.my_qna .accordion_option .capital_nav {
  margin-top: 6px;
}

.sub_price {
  flex-wrap: wrap;
}

.sub_price > label {
  margin-bottom: 6px;
}

.sub_price .price_group {
  width: 100%;
  display: flex;
}

.sub_price .price_group .price {
  margin-left: auto;
}

.sub_price .price_group label {
  color: #767676;
  font-weight: 500;
}

.sub_price .price_group label i {
  position: relative;
  top: -4px;
}

.bg_price_group {
  border-radius: 6px;
  background-color: #f6f7f8;
  padding: 15px;
  margin-top: 15px;
}

.bg_price_group .title {
  margin-bottom: 3px;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid #d8d8d8;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.save_info .info_group .bg_price_group p {
  margin-bottom: 4px;
}

.save_info .info_group .bg_price_group p label {
  font-size: 13px;
  color: #8f8f8f;
  background-color: transparent;
  font-weight: 500;
  display: flex;
  flex-direction: column;
}

.save_info .info_group .bg_price_group p label b {
  font-size: 11px;
  color: #4e83e1;
}

.save_info .info_group .bg_price_group p .price {
  color: #767676;
  font-size: 14px;
  font-weight: 600;
  margin-top: 1px;
}

/*리스셀프견적 추가*/
.write_form .radio_form .input_label li {
  display: flex;
  flex-direction: column;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
}

.write_form .radio_form .input_label li input {
  border: 0;
  width: calc(100% - 20px);
  margin: 0;
  text-align: right;
}

.write_form .radio_form .input_label li .input_group {
  display: flex;
  align-items: center;
}

.write_form .radio_form .input_label li .input_group b {
  width: 20px;
  font-size: 13px;
  font-weight: 500;
}

.fl_input {
  display: flex;
  width: 100%;
  gap: 2%;
}

.fl_input .fl_group {
  display: flex;
  width: 49%;
  flex-direction: column;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
}

.fl_input .fl_group.on {
  border: 1px solid var(--primary);
}

.fl_input .fl_group.on .label {
  color: var(--primary);
  font-weight: 500;
}

.fl_input .fl_group.on .num {
  color: var(--primary);
  font-weight: 500;
  border-top: 1px solid var(--primary);
}

.fl_input .fl_group .label {
  padding: 6px 12px;
  font-size: 14px;
  font-weight: 500;
  color: #646464;
  width: 100%;
  text-align: left;
}

.fl_input .fl_group .num {
  width: 100%;
  border-top: 1px solid #e7e8ec;
  font-size: 15px;
  padding: 5px 10px;
  text-align: right;
  font-weight: 600;
}

/*--------------------------------------------------------------------------------------
posting
----------------------------------------------------------------------------------------*/
.posting_info {
  margin-bottom: 20px;
}

.posting_info li {
  cursor: pointer;
}

.posting_info .ev_info label {
  flex: 1;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  word-break: break-all;
}

.posting_info .ev_date .date {
  font-size: 12px;
}

.posting_info .txt {
  font-size: 13px;
  flex: 1;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
}

.posting_nav main .nav .row .content {
  padding: 0;
  position: relative;
}

.posting_nav .p_top {
  width: 100%;
  position: relative;
  min-height: 200px;
  height: auto;
}

.posting_nav .p_img {
  width: 100%;
  position: relative;
}

.posting_nav .p_img img {
  width: 100%;
  height: auto;
}

.posting_nav .p_title {
  position: absolute;
  bottom: 40px;
  left: 20px;
}

.posting_nav .p_txt .p_title {
  position: inherit;
  bottom: 40px;
  left: 20px;
  margin-bottom: 20px;
}

.posting_nav .p_txt .p_title h4 {
  color: #333;
  text-shadow: none;
}

.posting_nav .p_txt .p_title .date {
  color: #333;
  text-shadow: none;
  font-weight: 500;
  font-size: 15px;
}

.posting_nav .p_title h4 {
  font-size: 30px;
  color: #fff;
  font-weight: 700;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
}

.posting_nav .p_title .date {
  font-size: 13px;
  color: #fff;
  font-weight: 400;
}

.p_txt {
  padding: 20px;
  word-break: keep-all;
  background-color: #fff;
  margin-bottom: 60px;
}

.p_txt strong {
  font-size: 22px;
  font-weight: 700;
  display: block;
}

.p_txt img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.p_txt p {
  line-height: 1.6;
}

.p_txt b {
  font-weight: 600;
  font-size: 16px;
  display: block;
}

.link_btn {
  width: 100%;
  margin-top: 20px;
}

.link_btn .btn_main {
  width: 100%;
  border-radius: 6px;
  padding: 10px;
  font-size: 15px;
}

.none_data {
  width: 100%;
  height: 100%;
  display: flex;
  align-content: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  margin-top: 280px;
}

.none_data p {
  color: #8b8b8b;
}

i.no_img {
  width: 80px;
  height: 80px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(../images/common/no_img.png);
}

/*--------------------------------------------------------------------------------------
사업자 등록번호 추가
----------------------------------------------------------------------------------------*/
main .section_footer {
  width: 100%;
  color: #8f8e91;
  font-size: 13px;
  padding-bottom: 30px;
  background-color: transparent;
  padding-top: 10px;
}

.event_wrap .section_footer {
  padding-bottom: 100px;
}

.event_wrap .event_info .section_footer {
  padding-bottom: 10px;
}

.section_footer {
  width: 100%;
  color: #8f8e91;
  font-size: 13px;
  padding-bottom: 100px;
  padding-top: 20px;
  position: relative;
}

.section_footer .mian_accordion {
  padding-top: 4px;
  display: none;
}

.company_btn button {
  display: flex;
  align-items: center;
}

.group_btn .section_footer {
  padding-bottom: 0px;
}

.section_footer .logo {
  display: flex;
  flex-direction: row;
  width: 100%;
  margin-bottom: 8px;
}

.section_footer .logo .img {
  width: 70px;
  height: 20px;
  background-image: url(../images/common/footer_logo.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  opacity: 0.6;
}

.s_f_wrap {
  width: 100%;
  padding: 10px 20px;
}

.company_info ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.company_info ul li {
  display: flex;
  flex-wrap: wrap;
  margin: 2px;
  margin-bottom: 0;
  position: relative;
  width: 100%;
}

.company_info ul li span {
  margin-left: 2px;
}

/*견적 획수 확인 모달*/
.num_modal .r_font {
  font-weight: 700;
}

/*--------------------------------------------------------------------------------------
중고렌트
----------------------------------------------------------------------------------------*/
.car_num {
  font-size: 15px;
  font-weight: 500;
  border: 1.5px solid #333;
  padding: 4px 10px;
  border-radius: 3px;
  margin-right: 6px;
}

/*--------------------------------------------------------------------------------------
캐시백
----------------------------------------------------------------------------------------*/
/* 차량 가격 입력 */
.amount-section {
  background: #fff;
  padding: 0px 15px;
  border-radius: 8px;
  margin-bottom: 16px;
}

/* 각 row (차량가격/선납금/할부원금) */
.price-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid #f0f2f5;
}

.price-field:last-child {
  border-bottom: none;
}

/* 라벨 */
.price-label {
  font-size: 15px;
  font-weight: 600;
  color: #222b45;
  flex-shrink: 0;
  width: 60px;
  margin-right: 20px;
}

/* 오른쪽 input 그룹 */
.num-group {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  justify-content: flex-end;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid #dde3ea;
  background: #f9fbfd;
}

/* 인풋 */
.price-input {
  font-size: 16px;
  font-weight: 700;
  text-align: right;
  color: #0d1520;
  border: 0;
  width: calc(100% - 20px);
  background-color: transparent;
}

.price-input::placeholder {
  color: #bcc3cc;
}

/* 원 단위 */
.unit {
  font-size: 14px;
  color: #868d98;
  white-space: nowrap;
}

/* result card */
.result-card {
  background: #fff;
  border-radius: 8px;
  padding: 12px;
}

.result-head {
  width: 100%;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
}

.capital-name {
  font-weight: 800;
  font-size: 15px;
  color: #0b1330;
}

.meta {
  font-size: 12px;
  color: #8a94a6;
  margin-right: 10px;
}

.code {
  display: inline-block;
  background: var(--primary-light);
  color: var(--primary);
  padding: 4px 8px;
  border-radius: 8px;
  font-weight: 800;
}

/* body lines */
.result-body .line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  border-bottom: 0px solid transparent;
}

.result-body .k {
  font-size: 14px;
  color: #757575;
}

.result-body .v {
  font-size: 15px;
  color: #111;
  font-weight: 700;
  text-align: right;
}

.result-body .v.plus {
  color: var(--primary);
  font-weight: 800;
}

/* separator */
.sep {
  height: 1px;
  background: #f1f4f8;
  margin: 8px 0;
}

/* total (foot) — 분리된 강조 영역 */
.result-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  border-radius: 10px;
  background: #fbfdff;
  border: 1px solid var(--primary-light);
  margin-top: 8px;
}

.total-label {
  font-size: 14px;
  color: #556;
  font-weight: 700;
}

.total-amt {
  font-size: 18px;
  color: var(--primary);
  font-weight: 900;
}

/* notice */
.notice-toggle {
  width: 100%;
  margin-top: 10px;
  background: transparent;
  border: 0;
  color: var(--primary);
  font-weight: 700;
  text-align: left;
  padding: 8px 0;
}

.notice {
  font-size: 13px;
  color: #6b7788;
  background: #fcfdff;
  border-radius: 8px;
  padding: 10px;
  border: 1px solid var(--primary-light);
  margin-top: 8px;
}

/* utility */
.small {
  font-size: 12px;
  color: #9aa3b3;
}

/* 공지 유의사항 */
.save_info .notice {
  background: #fff;
  padding: 16px;
  border-radius: 8px;
  font-size: 14px;
  color: #616b78;
  line-height: 1.5;
}

.save_info .notice h3 {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #222;
}

/* 차량선택 버튼 */

.mo-btn {
  width: 100%;
  margin-bottom: 12px;
}

.mo-btn button {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border-radius: 8px;
  padding: 0 16px;
  font-size: 15px;
  font-weight: 500;
  color: #171717;
  cursor: pointer;
}

.mo-btn button .arrow {
  width: 7px;
  height: 7px;
  border-right: 2px solid #333;
  border-bottom: 2px solid #333;
  transform: rotate(-45deg);
  margin-left: 10px;
}

/* 캐시백 - 차량브랜드 선택 모달 */

.sc-mo {
  height: auto;
  overflow-y: auto;
  flex: 1;
  padding-bottom: 20px;
  padding-top: 5px;
}

.sc-mo .m_qna_radio li {
  width: 100%;
  flex: none;
}

.sc-mo .m_qna_radio li .form_radio_btn label {
  border: 1px solid #e1e6ec;
  border-radius: 12px;
  background-color: #fdfdfd;
}

.sc-mo .m_qna_radio li .form_radio_btn input[type="radio"]:checked + label {
  border: 1px solid var(--primary);
  background-color: var(--primary-light);
  font-weight: 700;
  color: var(--primary);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--primary-rgb), 0.15);
}

.sc-mo::-webkit-scrollbar {
  width: 6px;
}

.sc-mo::-webkit-scrollbar-track {
  background: transparent;
}

.sc-mo::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.12);
  border-radius: 10px;
  backdrop-filter: blur(4px);
}

.sc-mo::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.2);
}

/*loding-car*/

/* Loading Overlay Container */
.loading-overlay {
  position: fixed;
  top: 0;
  left: 50%;
  margin-left: -430px;
  width: 860px;
  height: 100%;
  backdrop-filter: blur(6px);
  background: rgba(244, 244, 244, 0.6);
  z-index: 99999;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-right: 200px;
  flex-direction: column;
  cursor: wait;
  perspective: 1000px;
  touch-action: none;
  overscroll-behavior: contain;
}

/* Car Animation Container */
.car-loader {
  position: relative;
  width: 120px;
  height: 80px;
  transform-style: preserve-3d;
  animation: carDrive 2s infinite ease-in-out;
}

/* Car Roof - Restored for Sedan Shape */
.car-roof {
  position: absolute;
  bottom: 45px;
  left: 20px;
  width: 70px;
  height: 30px;
  background: linear-gradient(
    180deg,
    var(--primary) 0%,
    var(--primary-dark) 100%
  );
  border-radius: 15px 15px 0 0;
  transform: perspective(100px) rotateX(5deg);
  z-index: 1;
  box-shadow: inset 0 2px 5px rgba(255, 255, 255, 0.3);
  animation: bodyBounce 0.6s infinite ease-in-out alternate;
}

/* Windows */
.car-roof::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 8px;
  width: 25px;
  height: 18px;
  background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 100%);
  border-radius: 8px 0 0 0;
  box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.8);
}

.car-roof::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 8px;
  width: 25px;
  height: 18px;
  background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 100%);
  border-radius: 0 8px 0 0;
  box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.8);
}

/* Car Body - Boxier Sedan Shape but with 3D style */
.car-body {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 120px;
  height: 35px;
  background: linear-gradient(
    180deg,
    var(--primary) 0%,
    var(--primary-darker) 100%
  );
  border-radius: 10px 10px 15px 15px;
  /* Less round than the 'cute' version */
  box-shadow:
    inset 0 3px 6px rgba(255, 255, 255, 0.3),
    inset 0 -3px 6px rgba(0, 0, 0, 0.2),
    0 4px 0 #153d80;
  /* 3D extrusion */
  z-index: 2;
  animation: bodyBounce 0.6s infinite ease-in-out alternate;
}

/* Headlight */
.car-body::after {
  content: "";
  position: absolute;
  bottom: 12px;
  right: -2px;
  width: 6px;
  height: 14px;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 0 5px #fff;
}

/* Tail light */
.car-tail {
  position: absolute;
  bottom: 32px;
  left: -2px;
  width: 6px;
  height: 12px;
  background: #ff5252;
  border-radius: 4px;
  box-shadow: 0 0 3px #ff5252;
  z-index: 3;
  animation: bodyBounce 0.6s infinite ease-in-out alternate;
}

/* Wheels */
.wheel {
  position: absolute;
  bottom: 8px;
  width: 26px;
  height: 26px;
  background: #333;
  border-radius: 50%;
  border: 4px solid #fff;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2);
  z-index: 3;
  animation:
    wheelSpin 0.8s infinite linear,
    wheelBounce 0.6s infinite ease-in-out alternate;
}

.wheel.front {
  right: 20px;
}

.wheel.back {
  left: 20px;
}

.wheel::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: #ccc;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

/* Shadow underneath */
.car-shadow {
  position: absolute;
  bottom: 0;
  left: 10px;
  width: 100px;
  height: 10px;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  animation: shadowScale 0.6s infinite ease-in-out alternate;
}

/* Road lines moving */
.road-lines {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 300px;
  margin-left: -70%;
  height: 5px;
  background: repeating-linear-gradient(
    90deg,
    transparent,
    transparent 75px,
    #d6d6d6 75px,
    #d6d6d6 150px
  );
  animation: roadScroll 0.6s linear infinite;
}

@keyframes roadScroll {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: -150px 0;
  }
}

/* Loading Text */
.loading-text {
  margin-top: 30px;
  font-family: "Pretendard Variable", "Noto Sans KR", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: 1px;
  animation: textPulse 1s infinite alternate;
}

/* Animations */
@keyframes carDrive {
  0%,
  100% {
    transform: rotateY(-10deg) rotateX(0deg);
  }

  50% {
    transform: rotateY(-10deg) rotateX(2deg);
  }
}

@keyframes bodyBounce {
  0% {
    transform: translateY(0) scale(1, 1);
  }

  100% {
    transform: translateY(-3px) scale(0.98, 1.02);
    /* Subtle squash/stretch */
  }
}

@keyframes wheelBounce {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-3px);
  }
}

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

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

@keyframes shadowScale {
  0% {
    transform: scale(1);
    opacity: 0.2;
  }

  100% {
    transform: scale(0.9);
    opacity: 0.15;
  }
}

@keyframes textPulse {
  from {
    opacity: 0.6;
  }

  to {
    opacity: 1;
  }
}

/*렌트 - 추가*/
.write_form .radio_form .select-form select {
  border: 1px solid #e7e8ec;
  width: 100%;
  padding: 15px;
  border-radius: 8px;
  font-size: 14px;
}

/* 리스트 기본 스타일 제거 */
.tag-check-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  width: 100%;
}

.tag-check-list li {
  list-style: none;
  position: relative;
  border-radius: 8px;
  flex: none !important;
  width: calc(33% - 8px);
}

/* 체크박스 숨김 */
.tag-check-list input[type="checkbox"] {
  display: none;
}

/* 기본 태그 스타일 */
.tag-check-list label {
  display: inline-flex;
  align-items: center;
  background: #ffffff;
  font-size: 14px;
  color: #888c98;
  cursor: pointer;
  width: 100%;
  height: 100%;
  padding: 15px 14px;
  border-radius: 8px;
  font-weight: 500;
  border: 1px solid #e7e8ec;
}

/* 체크 후 스타일 */
.tag-check-list input[type="checkbox"]:checked + label {
  background: #fff;
  border: 1px solid var(--primary);
  color: var(--primary);
}

/* 보험 항목 전체 컨테이너 */
.insurance-box {
  width: 100%;
  border: 1px solid #e7e8ec;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
}

.insurance-item {
  width: 100%;
  display: flex;
  align-items: center;
}

.item-label {
  width: 100px;
  padding: 0 8px;
  font-size: 15px;
}

.select-box {
  width: calc(100% - 100px);
}

.select-box select {
  width: 100%;
  border: 0;
  border-left: 1px solid #e7e8ec;
  padding: 15px 4px;
  cursor: pointer;
}

.insurance-item {
  border-bottom: 1px solid #e7e8ec;
}

.insurance-item:last-of-type {
  border-bottom: 0;
}

/* 3. Discount List (Sub Contents 2) - Grid Layout */
.discount_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  /* Matched with Immediate Delivery */
  padding: 0;
}

.d_item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 90px;
  background: #fff;
  padding: 0 15px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  overflow: hidden;
  cursor: pointer;
  z-index: 1;
}

.d_item .d_bg_logo {
  position: absolute;
  top: -60px;
  left: -60px;
  width: 180px;
  height: 180px;
  object-fit: contain;
  opacity: 0.06;
  /* 투명도 조절 */
  z-index: 0;
}

.d_item .d_name {
  position: absolute;
  top: 15px;
  left: 15px;
  font-size: 14px;
  font-weight: 600;
  color: #222;
  z-index: 2;
}

.d_item .txt {
  font-size: 13px;
  color: #888888;
  font-weight: 700;
  margin-bottom: 0;
}

.d_item .d_rate {
  position: absolute;
  left: 15px;
  bottom: 15px;
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 4px;
}

.d_item .d_rate .num {
  font-size: 26px;
  font-weight: 700;
  color: var(--primary);
  line-height: 0.9;
  letter-spacing: -1.5px;
}

.d_item .ico_next_arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 15px;
  opacity: 0.5;
}

/* 4. Immediate Delivery Section */
.immediate_delivery {
  margin-top: 5px;
  margin-bottom: 20px;
  background: transparent;
  border-radius: 0;
}

.id_head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.id_head h3 {
  font-size: 18px;
  font-weight: 700;
  color: #222;
  margin: 0;
}

.id_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  /* Minimizing gap */
}

.id_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 5px;
  background: #fff;
  /* White Card Background */
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  /* Light border */
  box-shadow: none;
  /* Removed shadow */
  text-align: center;
  cursor: pointer;
}

.id_logo {
  width: 36px;
  height: 36px;
  object-fit: contain;
  margin-bottom: 8px;
  /* Slightly more space */
}

.id_name {
  font-size: 14px;
  /* Mobile Standard */
  font-weight: 600;
  /* Semi-Bold */
  color: #222;
  /* Dark Gray */
  margin-bottom: 4px;
  white-space: nowrap;
}

.id_count {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
}

.id_count .num {
  font-size: 20px;
  /* Hero Size */
  font-weight: 800;
  /* Extra Bold */
  color: var(--primary);
  /* Brand Blue */
  line-height: 1;
}

.id_count .unit {
  font-size: 13px;
  /* Supporting Size */
  font-weight: 500;
  /* Medium */
  color: #888;
  /* Light Gray */
}

/* ====== Rate Banner ====== */
.rate_banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  padding: 18px 16px;
  border-radius: 16px;
  text-decoration: none;
  position: relative;
  overflow: hidden;

  background: linear-gradient(
    135deg,
    rgba(60, 129, 241, 0.16),
    rgba(231, 93, 19, 0.1)
  );
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.rate_banner__txt {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.rate_banner__eyebrow {
  margin: 0 0 6px 0;
  font-size: 14px;
  line-height: 1.2;
  opacity: 0.8;
}

.rate_banner__title {
  margin: 0 0 10px 0;
  font-size: 17px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: -0.2px;
  word-break: keep-all;
}

.rate_banner__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 800;
  padding: 8px 18px;
  /* 버튼 여백 */
  border-radius: 999px;
  /* 칩 형태 */
  background: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  width: fit-content;
}

.rate_banner__arrow {
  display: inline-block;
  animation: arrowNudge 1.2s ease-in-out infinite;
}

@keyframes arrowNudge {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(4px);
  }
}

/* 터치 피드백(모바일에서 눌리는 느낌) */
.rate_banner:active .rate_banner__cta {
  transform: translateY(1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  background: rgba(255, 255, 255, 0.75);
}

.rate_banner__visual {
  flex: 0 0 auto;
  width: 140px;
  height: 100px;
  position: relative;
  z-index: 1;
}

.calc_svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* ===== 계산기 SVG 스타일 ===== */
.c_body {
  fill: rgba(255, 255, 255, 0.72);
  stroke: rgba(255, 255, 255, 0.7);
}

.c_screen {
  fill: rgba(0, 0, 0, 0.08);
}

.c_screen_txt {
  font-size: 15px;
  font-weight: 900;
  fill: rgba(0, 0, 0, 0.58);
  font-family:
    Pretendard,
    "Noto Sans KR",
    system-ui,
    -apple-system,
    sans-serif;
}

.c_key {
  fill: rgba(0, 0, 0, 0.1);
}

.c_key--accent {
  fill: rgba(231, 93, 19, 0.88);
}

/* % 배지 */
.c_badge_bg {
  fill: #3c81f1;
  stroke: #ffffff;
  stroke-width: 2.5;
  filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.28));
}

.c_badge_txt {
  font-size: 19px;
  font-weight: 900;
  fill: #ffffff;
  font-family:
    Pretendard,
    "Noto Sans KR",
    system-ui,
    -apple-system,
    sans-serif;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}

/* 스파크 */
.c_spark {
  fill: rgba(255, 255, 255, 0.9);
  opacity: 0;
  animation: sparkBlink 2.8s ease-in-out infinite;
}

@keyframes sparkBlink {
  0%,
  78% {
    opacity: 0;
    transform: scale(0.9);
    transform-origin: 52px 120px;
  }

  84% {
    opacity: 1;
    transform: scale(1.05);
  }

  92% {
    opacity: 0;
    transform: scale(0.9);
  }

  100% {
    opacity: 0;
  }
}

/* 키 모션 */
.c_keys .c_key {
  transform-origin: center;
  animation: keyPress 2.8s ease-in-out infinite;
  animation-delay: var(--d, 0s);
}

/* 눌릴 순서 */
.c_keys .k1 {
  --d: 0.1s;
}

.c_keys .k2 {
  --d: 0.35s;
}

.c_keys .k3 {
  --d: 0.6s;
}

.c_keys .k5 {
  --d: 0.95s;
}

.c_keys .k8 {
  --d: 1.3s;
}

.c_keys .k9 {
  --d: 1.65s;
}

/* 키별 컬러 */
.c_keys .k1 {
  --press: #3c81f1;
}

.c_keys .k2 {
  --press: #22c55e;
}

.c_keys .k3 {
  --press: #a855f7;
}

.c_keys .k4 {
  --press: #f59e0b;
}

.c_keys .k5 {
  --press: #ef4444;
}

.c_keys .k6 {
  --press: #06b6d4;
}

.c_keys .k7 {
  --press: #eab308;
}

.c_keys .k8 {
  --press: #6366f1;
}

.c_keys .k9 {
  --press: #e75d13;
}

/* 눌리지 않는 키 */
.c_keys .k4,
.c_keys .k6,
.c_keys .k7 {
  animation: none;
  opacity: 0.85;
}

@keyframes keyPress {
  0%,
  72%,
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
    fill: rgba(0, 0, 0, 0.1);
    filter: none;
  }

  78% {
    transform: translateY(1.8px) scale(0.96);
    opacity: 0.9;
    fill: var(--press, #3c81f1);
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.18));
  }

  84% {
    transform: translateY(0) scale(1);
    opacity: 1;
    fill: rgba(0, 0, 0, 0.1);
    filter: none;
  }
}

/*색상 이미지 라디오 버튼*/
.modal .nav.img-radio .m_qna_radio li .form_radio_btn label {
  justify-content: flex-start;
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  height: auto;
  min-height: 48px;
}

.modal .nav.img-radio .m_qna_radio li .form_radio_btn label .color-box {
  margin-right: 6px;
  border-radius: 6px;
  overflow: hidden;
}

/*--------------------------------------------------------------------------------------
media
----------------------------------------------------------------------------------------*/
@media screen and (max-width: 880px) {
  .pc_wrap {
    display: none;
  }

  .page_title_group {
    margin-left: -250px;
  }

  .loading-overlay {
    width: 500px;
    align-items: center;
    padding-right: 0px;
    margin-left: -250px;
  }

  footer {
    margin-left: -250px;
  }

  .modal {
    margin-left: -250px;
  }

  .m_btn_group {
    margin-left: -250px;
  }

  .fix_group_btn {
    margin-left: -250px;
  }

  .f_total_form {
    margin-left: -250px;
  }

  .s_m_modal.pc_modal .modal_wrap {
    width: 95%;
  }

  .overlay {
    margin-right: -250px;
  }
}

@media screen and (max-width: 500px) {
  .wrap {
    width: 100%;
  }

  .wrap_contents {
    width: 100%;
  }

  .page_title_group {
    width: 100%;
    left: 0;
    margin: 0;
  }

  .overlay {
    margin-right: 0;
    right: 0;
  }

  footer {
    width: 100%;
    left: 0;
    margin: 0;
  }

  .fix_group_btn {
    width: 100%;
    left: 0;
    margin: 0;
  }

  .modal {
    width: 100%;
    left: 0;
    margin: 0;
    bottom: 0;
  }

  .m_btn_group {
    width: 100%;
    margin: 0;
    left: 0;
  }

  .f_total_form {
    width: 100%;
    margin: 0;
    left: 0;
  }

  .banner_img {
    width: calc(100% - 200px);
  }

  .next_btn {
    font-size: 13px;
  }
}

@media screen and (max-width: 430px) {
  .d_item {
    display: block;
    /* Switch to block for diagonal layout */
    position: relative;
    padding: 0;
  }

  .d_brand {
    position: absolute;
    top: 12px;
    left: 12px;
    margin: 0;
  }

  .d_rate {
    position: absolute;
    bottom: 8px;
    right: 12px;
    margin: 0;
    align-items: flex-end;
  }

  .d_name {
    font-size: 14px;
    /* Maintain readable size */
    max-width: 120px;
  }

  .d_rate .num {
    font-size: 24px;
    /* Maintain readable size */
  }

  .d_logo {
    width: 30px;
    height: 30px;
  }

  .discount_list {
    gap: 4px;
  }
}

@media screen and (max-width: 400px) {
  .result_card .result_info .info:has(.pill_badge) {
    align-items: flex-start;
  }

  .result_card .result_info .info:has(.pill_badge) .num {
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
  }

  .id_grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    /* Minimal gap for mobile */
  }

  .id_logo {
    width: 28px;
    height: 28px;
  }

  .id_name {
    font-size: 12px;
  }

  .id_count .num {
    font-size: 16px;
  }

  .id_count .unit {
    font-size: 11px;
  }

  .id_item {
    padding: 10px 2px;
  }
}

@media screen and (max-width: 439px) {
  .company_info ul li:nth-child(2)::before {
    width: 0;
    height: 0;
  }

  .company_info ul li:nth-child(4)::before {
    width: 0;
    height: 0;
  }

  .car_list .car_group .nav .m_sub_info li {
    flex-wrap: wrap;
    flex-direction: row;
  }

  .car_list .car_group .nav .m_sub_info li label {
    width: 40px;
  }

  .main_wrap .car_card .sub_title {
    font-size: 12px;
  }

  .car_list .car_group .nav .m_sub_info li .num {
    font-size: 13px;
    word-break: keep-all;
    width: calc(100% - 40px);
    text-align: right;
  }

  .main_wrap .car_card {
    padding: 10px 8px;
  }

  .car_group .img_group .group_txt > span:first-of-type {
    font-size: 15px;
  }

  .car_group .img_group .sub_txt {
    font-size: 12px;
  }

  .main_wrap .car_group .info_group p label {
    width: 50px;
  }

  .main_wrap .car_group .info_group p.total_txt .price {
    font-size: 13px !important;
    width: calc(100% - 50px);
    justify-content: flex-end;
  }

  .main_wrap .mySwiper4 .info_group .num {
    width: auto;
  }

  .main_wrap .car_group .info_group p .price b {
    font-size: 13px;
  }
}

@media screen and (max-width: 383px) {
  .car_list .car_group .nav .m_sub_info li label {
    font-size: 12px;
    width: 34px;
  }

  .car_list .car_group .nav .m_sub_info li .num {
    font-size: 12px;
    width: calc(100% - 34px);
  }
}

@media screen and (max-width: 375px) {
  .modal.s_m_modal {
    width: 100%;
    left: 0;
    top: 0;
    margin-left: 0;
  }

  .s_m_modal .modal_wrap {
    width: 90%;
  }

  .next_btn {
    font-size: 13px;
  }
}

/* 접근성 */
@media (prefers-reduced-motion: reduce) {
  .rate_banner__arrow,
  .c_spark,
  .c_keys .c_key {
    animation: none !important;
  }
}