@charset "utf-8";

.sub-cont {padding: 80px 0 120px 0;}

.product-name-area {display: flex; align-items: center; column-gap: 10px;}
.product-network {font-size: 14px; font-weight: 500; color: var(--color-text-gray); padding: 5px 8px; border-radius: 3px; border: 1px solid var(--color-text-gray);}
.product-name {font-size: 28px; font-weight: 500;}

.circle-bullet {display: flex; column-gap: 4px; font-size: 15px;}
.circle-bullet span {width: 3px; height: 3px; margin-top: 6px; background-color: var(--color-primary); border-radius: 50%;}

/* list */
.list-cont {display: flex; align-items: flex-start; column-gap: 40px;}
.list-cont .input-area {position: sticky; top: 100px; width: 100%; max-width: 240px; flex-shrink: 0; padding: 24px 20px; border: 1px solid var(--color-border); border-radius: 20px;}
.list-cont .input-area .input-item {flex-direction: column; row-gap: 16px;}
.list-cont .input-area .input-item > span {width: 100%; font-size: 15px; margin-top: 0;}
.list-cont .input-area .input-item .input-item-area {width: 100%; flex-wrap: wrap; column-gap: 6px; row-gap: 10px;}
.list-cont .input-area .plan-item .custom-select{width: 100%; position:relative;}
.list-cont .input-area .plan-item .select-btn{width:100%;height:36px; border:1px solid var(--color-border); border-radius:10px; display:flex;align-items:center;justify-content:center;color:var(--color-text-gray);font-size:12px;cursor:pointer;transition:.3s;}
.list-cont .input-area .plan-item .select-btn svg{position: absolute; top: 50%; right: 12px; transform: translateY(-50%); transition:.3s;}
.list-cont .input-area .plan-item.active .select-btn{border: 1px solid var(--color-secondary);}
.list-cont .input-area .plan-item.active .select-btn span {color: var(--color-secondary);}
.list-cont .input-area .plan-item.active .select-btn svg path {stroke: var(--color-secondary);}
.list-cont .input-area .plan-item .custom-select.active .select-btn{border-color:var(--color-secondary); border-bottom: 0; border-bottom-left-radius:0;border-bottom-right-radius:0;}
.list-cont .input-area .plan-item .custom-select.active .select-btn svg{transform:translateY(-50%) rotate(180deg);}
.list-cont .input-area .plan-item .select-list{display:none;position:absolute;top:100%;left:0;width:100%;height:120px;overflow-y:auto;background:#fff;border:1px solid var(--color-secondary);border-top:none;border-radius:0 0 10px 10px;z-index:10;-ms-overflow-style:none;scrollbar-width:none;}
.list-cont .input-area .plan-item .select-list::-webkit-scrollbar{display:none;}
.list-cont .input-area .plan-item .select-list li{height:30px; display:flex;align-items:center;justify-content:center;color:var(--color-text-gray);font-size:12px;cursor:pointer;transition:.2s;}
.list-cont .input-area .plan-item .select-list li:hover{background-color: var(--color-bg); color: var(--color-secondary);}
.list-cont .input-area .radio-item {width: calc(100% / 2 - 3px); flex: revert;}
.list-cont .input-area .radio-item input[type="radio"] + label {height: 36px; column-gap: 4px; border-radius: 8px; font-size: 12px;}
.list-cont .input-area .btn-area {display: flex; column-gap: 6px;}
.list-cont .input-area .btn-area .btn-reset {width: 42px; flex-shrink: 0; background-color: #fff; border: 1px solid var(--color-primary);}
.list-cont .input-area .btn-area .btn-reset svg {width: 18px; height: 18px;}
.list-cont .input-area .btn-area .btn-default {height: 42px; font-size: 15px; column-gap: 4px;}
.list-cont .input-area .btn-area .btn-result .num {width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; background-color: #fff; border-radius: 50%; font-size: 12px; font-weight: 700; color: var(--color-primary);}
.list-cont .phone-item-box {display: flex; flex-wrap: wrap; column-gap: 20px; row-gap: 60px;}
.list-cont .phone-item-box .phone-item {width: calc(100% / 3 - 14px); transition:.3s;}
.list-cont .phone-item-box .phone-item.hide-item{display:none !important;}
.list-cont .phone-item-box .phone-item .phone-info .phone-title {font-size: 18px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-colors {margin-top: 12px; margin-bottom: 8px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-colors .color-item {width: 12px; height: 12px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-benefit {row-gap: 2px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-benefit {padding-bottom: 20px; margin-bottom: 16px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-benefit li span,
.list-cont .phone-item-box .phone-item .phone-info .phone-price .original-price {font-size: 12px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-price .monthly-price {font-size: 20px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-tags {column-gap: 11px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-tags .phone-tag {font-size: 10px;}
.list-cont .phone-item-box .phone-item .phone-info .phone-tags .phone-tag:not(:last-child)::after {right: -5px;}

.list-cont .mo-top {display: none; position: sticky; top: 0; z-index: 9999; background-color: #fff; align-items: center; justify-content: space-between; cursor: pointer; padding: 20px;}
.list-cont .mo-top .tit {display: flex; align-items: center; column-gap: 10px; font-weight: 600;}
.list-cont .mo-top svg {transition:.3s;}
.list-cont .mo-top.active svg {transform:rotate(180deg);}

.list-cont .phone-item-list .btn-area {margin-top: 60px;}

/* view */
.view-cont {display: flex; flex-direction: column; row-gap: 100px;}
.view-cont .product-view-top {display: flex; align-items: flex-start; column-gap: 60px;}
.view-cont .product-cont {width: 100%; max-width: 600px; flex-shrink: 0; display: flex; flex-direction: column; row-gap: 40px;}
.view-cont .product-cont .color-area {padding: 10px 4px; column-gap: 20px;}
.view-cont .product-cont .color-area .color-item {flex: none;}
.view-cont .product-cont .color-area .color-item label {position: relative; width: 36px; height: 36px; display: block; border-radius: 50%; border: 0;}
.view-cont .product-cont .color-area .color-item label::after {position: absolute; display: none; content: ''; width: 44px; height: 44px; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 1px solid var(--color-secondary); border-radius: 50%;}
.view-cont .product-cont .color-area .color-item:nth-of-type(1) label {background-color: #F8F3EF;}
.view-cont .product-cont .color-area .color-item:nth-of-type(2) label {background-color: #1B222A;}
.view-cont .product-cont .color-area .color-item:nth-of-type(3) label {background-color: #266282;}
.view-cont .product-cont .color-area .color-item:nth-of-type(4) label {background-color: #F8DBD5;}
.view-cont .product-cont .color-area .color-item:nth-of-type(5) label {background-color: #3A4D39;}
.view-cont .product-cont .color-area .color-item input[type="radio"] + label:hover::after,
.view-cont .product-cont .color-area .color-item input[type="radio"]:checked + label::after {display: block;}
.view-cont .discount-item .discount-card label {height: auto; padding: 14px 0; flex-direction: column; row-gap: 6px;}
.view-cont .discount-item .discount-card .discount-type {font-size: 11px; padding: 4px 6px; border-radius: 3px; background-color: var(--color-bg); font-weight: 500; color: var(--color-text-lightgray);}
.view-cont .discount-item .discount-card .discount-amount {color: var(--color-text-gray);}
.view-cont .discount-item .discount-card .discount-amount b {font-weight: 500;}
.view-cont .discount-item .discount-card .discount-description {font-size: 12px; color: var(--color-text-lightgray);}
.view-cont .discount-item input[type="radio"] + label:hover .discount-type,
.view-cont .discount-item input[type="radio"]:checked + label .discount-type {background-color: var(--color-secondary); color: #fff;}
.view-cont .discount-item input[type="radio"] + label:hover .discount-amount,
.view-cont .discount-item input[type="radio"]:checked + label .discount-amount,
.view-cont .discount-item input[type="radio"] + label:hover .discount-amount b,
.view-cont .discount-item input[type="radio"]:checked + label .discount-amount b,
.view-cont .discount-item input[type="radio"] + label:hover .discount-description,
.view-cont .discount-item input[type="radio"]:checked + label .discount-description {color: var(--color-secondary);}
.view-cont .product-cont .input-item .common-select > div {width: 100%; height: 90px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.3s; border-radius: 10px; border: 1px solid var(--color-border); column-gap: 10px;}
.view-cont .product-cont .input-item .common-select > div span {color: var(--color-text-gray);}
.view-cont .product-cont .input-item .common-select:hover .common-empty {border: 1px solid var(--color-secondary);}
.view-cont .product-cont .input-item .common-select:hover .common-empty span {color: var(--color-secondary);}
.view-cont .product-cont .input-item .common-select:hover .common-empty svg path {fill: var(--color-secondary);}

.view-cont .product-cont .input-item .plan-selected,
.view-cont .product-cont .input-item .card-selected {display:flex; flex-direction:column; align-items:center;justify-content:center; row-gap:6px; height: auto !important; padding:20px 0; border: 1px solid var(--color-secondary) !important; border-radius:10px;}
.view-cont .product-cont .input-item .plan-selected-top{display:flex;align-items:center;column-gap:6px;}
.view-cont .product-cont .input-item .plan-selected-top .selected-plan-badge{display:flex;align-items:center;justify-content:center;padding:4px 6px;border-radius:3px;background-color:var(--color-secondary);font-size:10px;font-weight:500;color:#FFF;}
.view-cont .product-cont .input-item .plan-selected-top .selected-plan-price {font-size:16px; color: var(--color-secondary);}
.view-cont .product-cont .input-item .plan-selected-top .selected-plan-price strong {font-weight: 600;}
.view-cont .product-cont .input-item .plan-selected-info {display:flex;flex-direction:column;row-gap:2px;}
.view-cont .product-cont .input-item .plan-selected-info span {color:var(--color-secondary);}
.view-cont .product-cont .input-item .plan-selected-info .selected-plan-data{font-size:13px;font-weight:600; color:var(--color-secondary); text-align: center;}
.view-cont .product-cont .input-item .plan-selected-info .selected-plan-benefit{font-size:13px; font-weight:500;}
.view-cont .product-cont .input-item .card-selected {flex-direction: row; column-gap: 20px; align-items: center; padding: 20px;}
.view-cont .product-cont .input-item .card-selected-thumb {width: 60px;}
.view-cont .product-cont .input-item .card-selected-info {display: flex; flex-direction: column; row-gap: 3px;}
.view-cont .product-cont .input-item .card-selected-info .selected-card-name {color: var(--color-secondary); font-weight: 500; padding-bottom: 3px;}
.view-cont .product-cont .input-item .card-selected-info > p {font-size: 12px; color: var(--color-secondary);}

.view-cont .detail-desc-wrap {position:relative; display: flex; flex-direction: column; align-items: center;}
.view-cont .detail-desc {position:relative; max-height:1600px; overflow:hidden;}
.view-cont .detail-desc::after {content:""; position:absolute; left:0; right:0; bottom:0; height:100%; background:linear-gradient(180deg,rgba(255,255,255,0) 0%,#fff 100%); pointer-events:none;}
.view-cont .detail-desc.active::after {display: none;}
.view-cont .detail-desc img {display:block; width:100%;}

.fixed-buy-wrap {position:fixed; width: 100%; left:0; right:0; bottom:0; z-index:999; display: flex; flex-direction: column; align-items: center; row-gap: 20px; background:#fff; padding: 16px 46px 20px; border-radius: 30px 30px 0 0; box-shadow:0 4px 20px rgba(15,23,42,.06);}
.fixed-buy-wrap.active .fixed-buy-toggle span::before {transform:translate(-50%,-70%) rotate(135deg);}
.fixed-buy-wrap .fixed-buy-toggle svg {transition:transform .3s ease;}
.fixed-buy-wrap.active .fixed-buy-toggle svg {transform:rotate(180deg);}
.fixed-buy-wrap .fixed-buy-detail {display:none; width: 100%; padding: 30px 0; border-bottom:1px solid var(--color-border);}
.fixed-buy-wrap .buy-detail-section {display: flex; flex-direction: column; row-gap: 12px;}
.fixed-buy-wrap .buy-detail-section:nth-of-type(1) {margin-bottom: 32px; padding-bottom: 20px; border-bottom: 1px solid var(--color-border);}
.fixed-buy-wrap .buy-detail-section > li {display:flex; align-items:center; justify-content:space-between;}
.fixed-buy-wrap .buy-detail-section > li span {color: var(--color-text-gray);}
.fixed-buy-wrap .buy-detail-section > li span,
.fixed-buy-wrap .buy-detail-section > li strong {font-weight: 500;}
.fixed-buy-wrap .buy-detail-section > li.blue span,
.fixed-buy-wrap .buy-detail-section > li.blue strong {color:var(--color-secondary);}
.fixed-buy-wrap .buy-detail-section .buy-detail-head strong {font-weight: 600;}
.fixed-buy-wrap .buy-detail-section .buy-detail-head {padding-bottom: 8px;}

.fixed-buy-wrap .fixed-buy-bottom {width: 100%; display:flex; align-items:center; justify-content:space-between; column-gap:20px;}
.fixed-buy-wrap .fixed-buy-product {display:flex; align-items:center; column-gap:40px;}
.fixed-buy-wrap .fixed-buy-info {display:flex; align-items: flex-start; flex-direction: column; row-gap: 6px;}
.fixed-buy-wrap .fixed-buy-info .product-name {font-size: 20px;}
.fixed-buy-wrap .fixed-buy-info .product-network {font-size: 10px; padding: 4px 6px;}
.fixed-buy-wrap .fixed-buy-info .fixed-buy-text {display: flex; align-items: center; column-gap: 2px; font-size: 14px;}
.fixed-buy-wrap .fixed-buy-text h3 {margin-bottom:8px; font-size:42px; font-weight:700; color:#111827;}
.fixed-buy-wrap .fixed-buy-text p {font-size:18px; color:#6B7280;}
.fixed-buy-wrap .fixed-buy-price {display: flex; flex-direction: column; row-gap: 10px;}
.fixed-buy-wrap .fixed-buy-price .total-price {display: flex; align-items: center; column-gap: 12px;}
.fixed-buy-wrap .fixed-buy-price .total-price span {color: var(--color-primary); font-weight: 500; font-size: 14px;}
.fixed-buy-wrap .fixed-buy-price .total-price strong {font-size: 32px; font-weight: 700;}
.fixed-buy-wrap .fixed-buy-price .total-price strong b {font-weight: 700; color: var(--color-primary);}
.fixed-buy-wrap .fixed-buy-price > p {font-size: 13px; color: var(--color-text-gray);}

.product-view footer .inner {padding-bottom: 140px;}

.common-modal {position:fixed;top:0;left:0;z-index:9999999;width:100%;height:100%;background:rgba(15,23,42,.40); display: flex; align-items: center; justify-content: center;}
.common-modal .modal-inner {position:relative; width:100%; max-width:640px; height: 90vh; background:#fff; border-radius:30px;overflow-y:auto;-ms-overflow-style: none; scrollbar-width: none;}
.common-modal .modal-inner::-webkit-scrollbar {display: none;}
.common-modal .modal-top {display: flex; flex-direction: column; row-gap: 20px; background-color: #fff; z-index: 1; padding: 50px 40px 30px; border-bottom:1px solid var(--color-border); position: sticky; top: 0;}
.common-modal .modal-top .btn-area {display: flex; align-items: center; justify-content: space-between;}
.common-modal .common-provider{display:flex;align-items:center;column-gap:10px;}
.common-modal .common-provider .provider-name{font-size:20px;font-weight:600;}
.common-modal .modal-list{padding: 30px 40px;display:flex;flex-direction:column;row-gap:0;}
.common-modal .modal-list .modal-item{display:flex;flex-direction:column;row-gap:10px;padding:20px 12px;border-bottom:1px solid var(--color-border); cursor:pointer;transition:.3s;}
.common-modal .modal-list .modal-item:nth-of-type(1) {border-top: 1px solid var(--color-text-main);}
.common-modal .modal-list .modal-item:hover{background:var(--color-bg);}

.plan-modal .plan-badge{width: fit-content; padding:4px 10px;border:1px solid var(--color-primary); border-radius:5px;font-size:12px;font-weight:500;color:var(--color-primary);}
.plan-modal .plan-info-area{display:flex;align-items:center;justify-content:space-between;column-gap:20px;}
.plan-modal .plan-info {display:flex;align-items:center;column-gap:20px;}
.plan-modal .plan-info li{position:relative; display: flex; flex-direction: column; row-gap: 2px; justify-content: center; align-items: center; padding-right:20px;}
.plan-modal .plan-info li:not(:last-child)::after{content:'';position:absolute;top:50%;right:0;width:1px;height:24px;background:#D9D9D9;transform:translateY(-50%);}
.plan-modal .plan-info li strong {font-size:14px; font-weight:500;white-space:nowrap;}
.plan-modal .plan-info li span {font-size:14px;white-space:nowrap;}
.plan-modal .plan-info .plan-data strong {color: var(--color-primary);}
.plan-modal .plan-price {display:flex;align-items:center;column-gap:10px;flex-shrink:0;}
.plan-modal .plan-price .price{font-size:20px;font-weight:700; white-space:nowrap;}
.plan-modal .plan-price .price strong{font-weight: 700; color: var(--color-accent);}
.plan-modal .plan-arrow{display:flex;align-items:center;justify-content:center;}

.card-modal .card-item {flex-direction: row !important; align-items: flex-start; column-gap: 30px;}
.card-modal .card-thumb {width: 80px; flex-shrink: 0;}
.card-modal .card-info {display: flex; flex-direction: column; row-gap: 20px; width: 100%;}
.card-modal .card-info .card-name {font-size: 18px; font-weight: 700;}
.card-modal .card-info .card-detail-btn {display: flex; align-items: center; column-gap: 4px; font-size: 12px; font-weight: 500; color: var(--color-text-gray);}
.card-modal .card-info .card-benefit {display: flex; flex-direction: column; row-gap: 10px;}
.card-modal .card-info .card-benefit > div {display: flex; flex-direction: column; row-gap: 2px;}
.card-modal .card-info .card-benefit span {font-size: 15px; color: var(--color-text-gray);}
.card-modal .card-info .card-benefit span strong {font-weight: 600; color: var(--color-primary);}

/* 반응형 */
@media screen and (max-width: 1520px) {

}
@media screen and (max-width: 1440px) {

}
@media screen and (max-width: 1280px) {
    .view-cont {column-gap: 30px;}
    .view-cont .product-cont {flex-shrink: revert;}
}
@media screen and (max-width: 1024px) {
    .sub-cont {padding: 60px 0 100px 0;}

    .list-cont {column-gap: 20px;}
    .list-cont .input-area {max-width: 220px;}
    .list-cont .phone-item-box .phone-item {width: calc(100% / 2 - 10px) !important;}

    .view-cont {row-gap: 80px;}
    .view-cont .product-view-top {flex-direction: column; row-gap: 60px; align-items: center;}
    .view-cont .product-thumb {max-width: 640px;}
    .view-cont .product-cont {max-width: 100%;}
    .view-cont .detail-desc {max-height: 100vw;}

    .fixed-buy-wrap .fixed-buy-product {flex-direction: column; row-gap: 8px; align-items: flex-start;}
    .fixed-buy-wrap .fixed-buy-info {flex-direction: row; align-items: center; column-gap: 10px; flex-wrap: wrap;}
}
@media screen and (max-width: 768px) {
    .common-modal .modal-inner {max-width: 100%; border-radius: 0;height: 100vh;}
    .common-modal .modal-top,
    .common-modal .modal-list {padding: 30px 20px;}

    .fixed-buy-wrap {padding: 16px 20px 20px;}

    .product-view footer .inner {padding-bottom: 250px;}
    .product-list footer {padding: 60px 0 100px 0;}

    .list-cont .mo-top {display: flex;}
    .list-cont .input-area {position: fixed; max-width: 100%; width: 100%; max-height: 60vh; padding: 0; overflow-y:auto;-ms-overflow-style: none; scrollbar-width: none; top: auto; bottom: 0; left: 0; z-index: 99999; background-color: #fff; border-radius: 30px 30px 0 0; border: 0; box-shadow: 0 4px 20px rgba(15,23,42,.06);}
    .list-cont .input-area.open {padding: 0 0 100px;}
    .list-cont .input-area::-webkit-scrollbar {display: none;}
    .list-cont .phone-item-box {margin-left: 0 !important;}
    .list-cont .input-area .btn-area {position: fixed; bottom: 0; left: 0; width: 100%; padding: 20px; background-color: #fff;}
    .list-cont .phone-item-box .phone-item .phone-info .phone-tags .phone-tag {flex: revert;}
    .list-cont .phone-item-box .phone-item .phone-info .phone-tags .phone-tag:not(:last-child)::after {display: block; right: -8px;}
    .list-cont .input-area .plan-item .select-list {height: 90px;}
    .list-cont .input-area .input-item {padding: 0 20px;}


}
@media screen and (max-width: 600px) {
    .input-area {row-gap: 30px;}
    .input-area .input-item {flex-direction: column; row-gap: 10px;}
    .input-area .input-item > span {margin-top: 0;}
    .input-area .input-item .input-item-area {width: 100%;}

    .list-cont .phone-item-box {row-gap: 30px;}
    .list-cont .phone-item-box .phone-item {width: 100% !important; flex-direction: row; align-items: center; column-gap: 16px; padding: 24px 16px;}
    .list-cont .phone-item-box .phone-item .phone-thumb {width: 28vw; height: 28vw; flex-shrink: 0;}
    .list-cont .phone-item-box .phone-item .phone-info {width: 100%;}
    .list-cont .btn-area {margin-top: 40px;}

    .plan-modal .plan-info-area {flex-direction: column; row-gap: 12px; align-items: flex-start;}
    .fixed-buy-wrap .fixed-buy-bottom {flex-direction: column; row-gap: 16px;}
    .fixed-buy-wrap .fixed-buy-product {width: 100%;}
    .fixed-buy-wrap .btn-default-r {max-width: 100%;}
}
@media screen and (max-width: 500px) {
    .sub-cont {padding: 40px 0 80px 0;}
    .view-cont {row-gap: 60px;}
    
    .product-name {font-size: 24px;}
    .product-network {font-size: 12px;}
    .common-modal .modal-close svg {width: 24px; height: 24px;}
    .common-modal .modal-top {padding: 24px 16px; row-gap: 12px;}
    .common-modal .modal-list {padding: 30px 16px;}
    .common-modal .common-provider .provider-name {font-size: 18px;}

    .view-cont .discount-item .input-item-area {flex-direction: column; row-gap: 10px;}
    .view-cont .discount-item .discount-card {width: 100%; flex: revert;}
    
    .product-view footer .inner {padding-bottom: 214px;}
    .fixed-buy-wrap {padding: 12px 16px 16px;}
    .fixed-buy-wrap,
    .fixed-buy-wrap .fixed-buy-bottom {row-gap: 12px;}
    .fixed-buy-wrap .fixed-buy-info .fixed-buy-text,
    .fixed-buy-wrap .fixed-buy-price .total-price span,
    .fixed-buy-wrap .fixed-buy-price > p {font-size: 12px;}
    .fixed-buy-wrap .fixed-buy-price .total-price strong {font-size: 28px;}
    .fixed-buy-wrap .fixed-buy-toggle svg {width: 20px; height: 20px;}
    .btn-default-r {font-size: 16px; height: 50px;}

    .fixed-buy-wrap .buy-detail-section > li span,
    .fixed-buy-wrap .buy-detail-section > li strong {font-size: 14px;}
    .fixed-buy-wrap .fixed-buy-detail {padding: 0 0 20px 0;}
    .fixed-buy-wrap .buy-detail-section .buy-detail-head {padding: 2px;}
    .fixed-buy-wrap .buy-detail-section:nth-of-type(1) {margin-bottom: 20px; padding-bottom: 20px; row-gap: 8px;}

}
@media screen and (max-width: 400px) {
    .plan-modal .plan-list .modal-item {padding: 14px 0;}
    .plan-modal .plan-info {column-gap: 4vw;}
    .plan-modal .plan-info li {padding-right: 4vw;}
    .plan-modal .plan-info li strong,
    .plan-modal .plan-info li span {font-size: 12px;}
    .plan-modal .plan-price .price {font-size: 18px;}
    .plan-modal .plan-info-area {row-gap: 8px;}
}
@media screen and (max-width: 375px) {
    .card-modal .card-thumb {width: 60px;}
    .card-modal .card-item {column-gap: 20px;}
    .card-modal .card-info {row-gap: 16px;}
    .card-modal .card-info .card-name {font-size: 15px;}
    .circle-bullet,
    .card-modal .card-info .card-benefit span {font-size: 13px;}

    .plan-modal .plan-info li strong,
    .plan-modal .plan-info li span {font-size: 3.4vw;}
    
}

/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/
/*********/