.price_container {}

.price_box1 {box-sizing: border-box; padding: 120px 0;}
.price_box1 h2 {font-size: 48px; font-weight: bold; padding-bottom: 100px; text-align: center;}

.price_box1 .price_list_container {
  display: grid; 
  grid-template-columns: repeat(4, 1fr); 
  gap: 12px;
  overflow-x: hidden;
  overflow-y: hidden;
  padding: 10px;
  scroll-snap-type: x mandatory;
}
.price_box1 .price_list_box {scroll-snap-align: start; border: 1px solid #ddd; border-radius: 15px;}
.price_box1 .price_list_box:nth-child(3) {
  position: relative;
  border-radius: 15px;
  background: linear-gradient(white, white) padding-box, 
              linear-gradient(345.09deg, #F8E4E4 0%, #EF4D4D 25%, #EF4D4D 75%, #F8E4E4 100%) border-box;
  border: 1px solid transparent;
}

.price_table_box {box-sizing: border-box; padding: 32px 24px;}

.table_top {}
.table_top h3 {font-size: 24px; font-weight: bold; }
.table_top h3.active {color: #EF4D4D;}
.table_top p {font-size: 14px; color: #999; padding: 12px 0;}

.table_middle {box-sizing: border-box; padding: 20px 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.table_middle p {margin-bottom: 18px; font-size: 14px; position: relative;}
.table_middle p span {font-size: 20px; font-weight: bold; position: absolute;  right: 0; top: 0;}

.table_middle .img_box {display: flex; align-items: center;}
.table_middle .img_box {}
.table_middle .img_box span {padding-left: 5px; font-size: 14px; color: #ef4d4d;}
.table_middle .img_box span.active {color: rgba(35, 134, 92, 1);}

.table_bottom {padding: 15px 0; box-sizing: border-box;}
.table_bottom h3 {background-color: #f4f4f4; padding: 8px 0; border-radius: 8px; text-align: center;}

.table_bottom ul {padding: 24px 0; box-sizing: border-box;}
.table_bottom ul li {padding-bottom: 14px;}
.table_bottom ul li .img_box {display: flex; align-items: center; }
.table_bottom ul li .img_box span {font-size: 14px; padding-right: 4px; padding-left: 2px;}
.table_bottom ul li .img_box span.active {color: #eee;}

.price_box2 {padding: 90px 0; box-sizing: border-box; background-color: rgba(243, 243, 249, 1);}

.price_box2 .box_top {text-align: center;}
.price_box2 .box_top span {font-size: 14px; padding: 8px 16px; display: inline-block; border-radius: 25px; background-color: rgba(141, 120, 239, 1); color: #fff;}
.price_box2 .box_top h2 {font-size: 40px; font-weight: bold; padding: 20px 0 40px 0;}

.price_box2 .box_middle {}

.price_box2 .box_middle ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
.price_box2 .box_middle ul li {width: 100%;; background-color: #fff; border-radius: 15px; padding: 35px 0;}
.price_box2 .box_middle ul li .img_box {text-align: center;}
.price_box2 .box_middle ul li .img_box img {}
.price_box2 .box_middle ul li .img_box p {padding-top: 20px; font-weight: 500;}

.price_box2 .box_bottom {text-align: center; padding-top: 40px;}
.price_box2 .box_bottom a {background-color: #Fff; display: inline-block; padding: 16px 24px; border-radius: 25px; border: 1px solid rgba(141, 120, 239, 1); color: rgba(141, 120, 239, 1);}

.price_box3 {box-sizing: border-box; padding: 100px 0 120px;}
.price_box3 .box_top h2 {font-size: 24px; font-weight: bold; text-align: center;}

.price_box3 .box_bottom {margin: 0 auto; max-width: 1200px; width: 100%; box-sizing: border-box; padding: 20px 20px; background-color: #f4f4f4; border-radius: 15px;}
.price_box3 .box_bottom h3 { color: rgba(102, 102, 102, 1); font-weight: bold; display: flex; align-items: center; margin-bottom: 12px;}
.price_box3 .box_bottom h3 span {padding-left: 3px;}
.price_box3 .box_bottom ul {}
.price_box3 .box_bottom ul li {padding-bottom: 8px;}
.price_box3 .box_bottom ul li p {color: #999; font-size: 14px; line-height: 1.3;}
.price_box3 .box_bottom ul li:last-child {padding-bottom: 0;}

.price_box4 {box-sizing: border-box; padding: 160px 0; background: var(--color-red-brand-r-02, #F8E4E4);}
.price_box4 .text_box {text-align: center;}
.price_box4 .text_box h3 {font-weight: bold; font-size: 40px; line-height: 1.3;}

.price_box4 .btn_box {display: flex; justify-content: center; align-items: center; gap: 10px; padding-top: 40px;}
.price_box4 .btn_box a {width: 196px; height: 66px; text-align: center; line-height: 66px; border-radius: 5px; color: #fff; font-weight: 500; font-style: 18px;}
.price_box4 .btn_box a:first-child {color: #ef4d4d; background-color: #ffffff;}
.price_box4 .btn_box a:last-child {color: #fff; background-color: #EF4D4D;}

.landing_box2 {padding: 24px 0 100px 0; box-sizing: border-box;}
.landing_box2 .logo_container {    
    display: flex; 
    justify-content: center; 
    align-items: center;
    overflow: hidden;
}
.logo_box {
    display: flex;
    position: relative; 
    place-items: center; 
    list-style-type: none; 
    opacity: 1; 
    padding-bottom: 10px;
    width: calc(200%);
}

.slide_box {
    max-width: 200px;
    height: auto;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 32px;
    box-sizing: border-box;
}
.slide_box img {width: auto; height: 100%; object-fit: contain; flex-shrink: 0;}

.logo_container1 .logo_box {animation: loop 50s linear infinite;}

@keyframes loop {
    0% {
        transform: translateX(0);
    }
    50%{
        transform: translateX(-20%);
    }
    100% {
        transform: translateX(0);
    }
}

.tooltip_wrap {
  position: relative;
  display: inline-block;
}

.tooltip_wrap .tooltip {
  position: absolute;
  top: 120%; /* 위쪽 대신 아래쪽으로 이동 */
  left: 50%;
  transform: translateX(-50%);
  background: #000;
  color: #fff;
  padding: 7px 12px;
  border-radius: 8px;
  font-size: 12px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 10;
  line-height: 1.3;
}

/* 꼬리 방향도 반대로 */
.tooltip_wrap .tooltip::after {
  content: '';
  position: absolute;
  bottom: 100%; /* 위쪽 꼬리 → 아래쪽 꼬리 */
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: transparent transparent #333 transparent;
}

/* hover 시 표시 */
.tooltip_wrap:hover .tooltip {
  opacity: 1;
}

@media screen and (max-width: 1200px){
  .price_box1 .price_list_container {margin-left: 40px; overflow-x: auto;}
  .price_box1 .price_list_box {width: 282px;}
  

  .price_box2 .inner {}
  .price_box2 .box_middle ul {grid-template-columns: repeat(1, 1fr); max-width: 387px; margin: 0 auto;}

  .price_box3 .bottom_inner {box-sizing: border-box; padding: 0 40px;}

  .price_box4 .text_box h3 {font-size: 36px;}
}
@media screen and (max-width: 768px){
    .price_box1 {padding: 100px 0;}
    .price_box1 h2 {font-size: 36px; padding-bottom: 60px;}
    .price_box1 .price_list_container {margin-left: 15px;}

    .price_box2 {padding: 48px 0;}
    .price_box2 .box_top h2 {font-size: 22px; padding: 12px 0 20px 0;}
    .price_box2 .box_top span {font-size: 12px;}
    .price_box2 .box_middle {box-sizing: border-box; padding: 0 15px;}
    .price_box2 .box_middle ul li .img_box p {font-size: 14px;}
    .price_box2 .box_bottom {padding-top: 24px;}
    .price_box3 .bottom_inner {box-sizing: border-box; padding: 0 15px;}

    .price_box3 .box_top h2 {font-size: 22px;}

    .slide_box img {width: 100px;}

    .price_box4 .text_box h3 {font-size: 24px;}
}
@media screen and (max-width: 480px){

  
    .price_box1 .price_list_box {width: 100%;}
    .price_box1 .price_list_container {margin-left: 0; padding: 0 15px; gap: 20px;}
    .price_box1 .price_list_container {
      grid-template-columns: repeat(1, 1fr);
    }

    .price_box4 {padding: 100px 0;}
    .price_box4 .btn_box {display: block; padding: 40px 16px 0 16px;}
    .price_box4 .btn_box a {display: block; text-align: center; margin-bottom: 10px; width: 100%;}
}