:root {
    /* color */
    --col-white: #fff;
    --col-navy: #003555;
    --col-black: #232426;
    --col-gray1: #48494D;
    --col-gray2: #63656A;
    --col-gray3: #9B9DA1;
    --col-gray4: #C5C7CA;

    /* bg color */
    --bg-gray2: #E0E2E4;
    --bg-gray4: #F8F9FB;
    --bg-gray5: #F2F4F6;
    --bg-sky: #54C2F0;
    --dim-black: rgba(35, 36, 38, 0.6);

    /* border / shadow */
    --bor-blackRGB7: rgba(35, 36, 38, 0.07);
    --bor-blackRGB10: rgba(0, 0, 0, 0.1);

    /* font size */
    --h1-48: 3rem;
    --h2-36: 2.25rem;
    --h3-28: 1.75rem;
    --t1-24: 1.5rem;
    --t2-20: 1.25rem;
    --t3-18: 1.125rem;
    --t4-16: 1rem;
    --t5-13: .8125rem;
    --bold-f: 500;
    --semibold-f: 700;
}
@media (max-width: 1024px) {
    html { font-size: 14px; }
}

/* align */
.txt_center { text-align: center; }
.flexgap_8 { display: flex; align-items: center; gap: .5rem; }
.flex_gap40 { display: flex; align-items: center; justify-content: space-between; gap: 2.5rem; }

/* color */
.col_sky { color: var(--bg-sky); }

/* margin */
.mt_32 { margin-top: 2rem; }
.mb_40 { margin-bottom: 2.5rem; }

/* input */
.inp_tit { display: block; font-size: var(--t4-16); color: var(--col-black); padding-bottom: .75rem; }
.inp_wrap ~ .inp_wrap { padding-top: 1.25rem; }
textarea,
input { padding-inline: 1.25rem; border: 1px solid var(--bor-blackRGB7); border-radius: .75rem; font-size: var(--t3-18); width: 100%; font-weight: var(--bold-f); }
textarea { padding-block: 1.25rem; resize: none; }
input { height: 4.0625rem; }
textarea::placeholder,
input::placeholder { color: var(--col-gray4); font-weight: 400; }
textarea:focus,
input:focus { background-color: rgba(0, 53, 85, 0.08); }

.inp_box { position: relative; flex: 1; }
.inp_box input { padding-right: 4.125rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ic_box { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: .5rem; }
.clear_btn { width: 2rem; height: 2rem; background: url('../images/icons/ic_delite_round_dim.svg') no-repeat center / contain; opacity: 0; }
.clear_btn.active { opacity: 1; }
.reset_btn { width: 2.625rem; height: 2.625rem; background: url('../images/icons/ic_flip_gray.svg') no-repeat center / contain; pointer-events: none; }
.reset_btn.active { background-image: url('../images/icons/ic_flip.svg'); pointer-events: visible; }

.chk_label { padding: .25rem 0 .25rem 1.75rem; background: url('../images/icons/ic_check_round_off.svg') no-repeat left center / 1.5rem; color: var(--col-gray3); font-size: var(--t3-18); }
.chk_inp:checked + .chk_label { background-image: url('../images/icons/ic_check_round_on.svg'); color: var(--col-black); font-weight: var(--bold-f); }

/* button */
.navy_btn_s { width: 100%; border-radius: .25rem; color: var(--col-navy); font-weight: var(--bold-f); font-size: var(--t4-16); padding: .375rem .75rem; border: 1px solid var(--bg-sky); }
.white_btn_s { width: 100%; background-color: var(--col-white); border-radius: .25rem; color: var(--col-gray2); font-weight: var(--bold-f); font-size: var(--t4-16); padding: .375rem .75rem; border: 1px solid var(--bor-blackRGB7); padding-inline: .75rem; }

.navy_btn { display: inline-block; width: 100%; height: 4.75rem; line-height: 4.75rem; border-radius: .75rem; background-color: var(--col-navy); font-size: var(--t2-20); color: var(--col-white); font-weight: var(--bold-f); text-align: center; }

.white_btn_m { width: 100%; background-color: var(--col-white); border-radius: .5rem; color: var(--col-navy); font-weight: var(--bold-f); font-size: var(--t2-20); height: 4.75rem; line-height: 4.75rem; text-align: center; }
.navy_btn_m { width: 100%; background-color: var(--col-navy); border-radius: .5rem; color: var(--col-white); font-weight: var(--bold-f); font-size: var(--t2-20); height: 4.75rem; line-height: 4.75rem; border: 1px solid var(--col-white); text-align: center; }

.gray_btn { display: inline-block; width: 100%; background-color: var(--bg-gray4); color: var(--col-gray2); font-weight: var(--bold-f); border-radius: .5rem; height: 2.875rem; line-height: 2.875rem; }

.navy_search { display: inline-block; padding-inline: 1.25rem; height: 2.875rem; line-height: 2.875rem; border-radius: .5rem; background-color: var(--col-navy); font-size: var(--t4-16); color: var(--col-white); font-weight: var(--bold-f); }
button:disabled { background-color: var(--bg-gray2); color: var(--col-gray3); }

.floating_btn { position: fixed; right: 5rem; bottom: 5rem; padding: 1rem 4.625rem 1rem 2.5rem; background: url('../images/icons/ic_arrow_right_white.svg') no-repeat right 2rem center / 2rem var(--bg-sky); z-index: 100; border-radius: 6.25rem; color: var(--col-white); font-size: var(--t1-24); font-weight: var(--bold-f); box-shadow: 0px 0px 16px 0px rgba(35, 36, 38, 0.10); opacity: 0; transition: 0.3s; }
.floating_btn.active { opacity: 1; }

/* header */
header { position: fixed; left: 0; top: -4.1875rem; width: 100%; background-color: var(--col-white); padding: 1rem 1.25rem; z-index: 100; border-bottom: 1px solid var(--bor-blackRGB7); transition: 0.3s; }
header .max_w1024 { display: flex; align-items: center; justify-content: space-between; width: 100%; }
header .logo_box { margin-right: auto; }
header img { width: 5.125rem; }
header .btn_box .max_w1024 { display: flex; gap: .5rem; align-items: center; }
header .btn_box .max_w1024 * { white-space: nowrap; width: fit-content; background-color: transparent; }
header.active { top: 0; }

/* footer */
footer { padding: 7.5rem 1.25rem 12.5rem; background-color: var(--bg-gray5); font-size: var(--t3-18); color: var(--col-gray3); }
footer .soacial_box img { width: 3rem; }
footer .txt_box { padding-top: 2.5rem; }
footer .txt_box em,
footer .txt_box strong { color: var(--col-gray2); }
footer .txt_box li { display: flex; align-items: center; padding-top: .5rem; }
footer .txt_box li span { width: 10.625rem; }
footer .panel { display: none; padding-top: .5rem; }
footer .panel strong ~ strong { padding-top: 1.25rem; }
footer .txt_box .panel li span { width: 11.25rem; }
footer .tg_btn { display: flex; align-items: center; gap: .5rem; cursor: pointer; }
footer .tg_btn:after { content: ""; display: block; width: 2rem; height: 2rem; background: url('../images/icons/ic_arrow_down_gray.svg') no-repeat center / contain; transition: 0.3s; }
footer .tg_btn.active:after { transform: rotate(-180deg); }
footer .foo_terms { padding-top: 2.5rem; }
footer .foo_terms,
footer .foo_terms li { display: flex; align-items: center; }
footer .foo_terms li ~ li::before { content: ""; display: block; width: 1px; height: 1.5rem; background-color: var(--col-gray4); margin-inline: .75rem; }
footer .foo_terms a { color: var(--col-gray3); }

/* 공통 */
.pc_none { display: none; }
.max_w1024 { max-width: 64rem; margin: 0 auto; }

/* 랜딩 공통 */
.lan_wapper section:not(.visual_wrap) { padding: 7.5rem 1.25rem; }
.lan_tit { font-size: var(--h2-36); font-weight: var(--bold-f); color: var(--col-navy); }
.lan_subTit { padding-top: 1rem; font-size: var(--t1-24); color: var(--col-gray2); }

/* 팝업 */
.popup { position: fixed; left: 0; top: 0; width: 100%; height: 100%; align-items: center; justify-content: center; display: none; z-index: 100; }
.popup.active { display: flex; }
.dim { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(35, 36, 38, 0.6); z-index: -1; }
.pop_cont { position: relative; background-color: var(--col-white); border-radius: 1rem;  padding: 1.5rem; width: calc(100% - 2.5rem); max-width: 25rem; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05); }
.pop_cont .pop_tit { display: block; font-size: var(--t3-18); text-align: center; font-weight: var(--bold-f); }
.pop_cont .pop_txt { color: var(--col-gray3); text-align: center; padding-top: .75rem; font-size: var(--t4-16); }
.pop_cont .pop_subtxt { color: var(--col-gray4); padding-top: .25rem; text-align: center; }
.pop_cont .btn_box { padding-top: 2rem; }
.pop_cont .pop_price { display: block; font-size: var(--h3-f); padding-top: .5rem; color: var(--col-gray3); text-align: center; font-weight: var(--bold-f); }
.popup .inp_tit { padding-top: 1rem; }

.dim_popup { position: fixed; top: 2.5rem; left: 50%; transform: translateX(-50%); z-index: 100; display: none; }
.dim_box { background-color: rgba(35, 36, 38, 0.6); padding: 1.5rem 2.5rem; border-radius: 4.25rem; color: var(--col-white); font-size: var(--t2-20); font-weight: var(--bold-f); }

/* 영양제 상세 팝업 */
.modal_detail { max-width: 30rem; border-radius: 1rem; padding: 1.5rem; position: relative; background-color: var(--col-white); }
.detail_close { position: absolute; top: -2.5rem; right: 0; width: 2rem; height: 2rem; background: url('../images/icons/ic_delite_round_dim.svg') no-repeat center / contain; }
.modal_tit .fix { position: absolute; display: flex; gap: .5rem; top: 2.5rem; right: 1.5rem; } 
.modal_tit .fix img { width: 2.5rem; } 
.modal_tit .img img { height: 4.5rem; } 
.modal_tit .pill_modaltit { padding-block: .5rem; color: var(--col-navy); font-weight: var(--bold-f); font-size: var(--t2-20); } 
.modal_tit .pill_modalinfo { display: flex; gap: .5rem; align-items: center; font-size: var(--t3-18); font-weight: var(--bold-f); padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--bor-blackRGB10); } 
.modal_tit .pill_modalinfo .num { color: var(--col-black); }
.modal_tit .pill_modalinfo .price { color: var(--col-gray2); }
.modal_tit .pill_modalinfo .tag { border-radius: 6.25rem; padding: .125rem .5rem; color: var(--col-navy); background-color: rgba(84, 194, 240, 0.3); font-size: var(--t5-13); } 
.detail_txt { padding-bottom: 3.75rem; max-height: 20rem; overflow: auto; font-size: var(--t4-16); } 
.detail_txt:after { content: ""; position: absolute; left: 1.5rem; right: 1.5rem; bottom: 1.5rem; height: 3.125rem; background-image: linear-gradient(to bottom, transparent, #fff); z-index: 1; }
.detail_txt .data ~ .data { padding-top: 1.25rem; } 
.detail_txt .data .title { padding-bottom: .5rem; font-weight: var(--bold-f); } 
.detail_txt .data .txt { color: var(--col-gray2); } 
.detail_txt .data li { padding-left: 1.625rem; position: relative; color: var(--col-gray2); }
.detail_txt .data li ~ li { margin-top: .25rem; }
.detail_txt .data li::before { content: ""; border-radius: 50%; position: absolute; top: 0.4rem; left: 0.4rem; width: .25rem; height: .25rem; background-color: #9C9D9F; } 
.detail_txt .data .col_gray3 { color: var(--col-gray2); } 
.detail_txt .data table { width: 100%; border-left: 1px solid var(--bor-blackRGB7); border-right: 1px solid var(--bor-blackRGB7); } 
.detail_txt .data table td, 
.detail_txt .data table th { padding: .5rem 1rem; text-align: left; border-bottom: 1px solid var(--bor-blackRGB7); color: var(--col-gray2); } 
.detail_txt .data table th { background-color: var(--bg-gray2); font-weight: var(--bold-f); } 
.detail_txt .data table th ~ th { border-left: 1px solid var(--bor-blackRGB7); }
.detail_txt .data table td:first-child { border-right: 1px solid var(--bor-blackRGB7); } 
.detail_txt .info_notice { border-radius: .5rem; padding: .75rem; margin-top: 1.25rem; background-color: var(--bg-gray4); font-size: var(--t5-13); color: var(--col-gray3); } 
.detail_txt .info_notice p { padding-left: 1.375rem; position: relative; } 
.detail_txt .info_notice p ~ p { margin-top: .25rem; }
.detail_txt .info_notice p::before { content: ""; border-radius: 50%; position: absolute; top: 0.4rem; left: 0.4rem; width: .25rem; height: .25rem; background-color: #9C9D9F; }

/* 이용약관 */
.term_wrapper { max-width: 30rem; margin: 0 auto; padding: 2.5rem 1.25rem 9.375rem; color: #9B9DA1; font-weight: var(--bold-f); }
.top_title { display: flex; justify-content: space-between; align-items: center; }
.top_title h1 { font-size: 1.75rem; color: #232426; margin: 0; }
.top_title button { width: 2rem; height: 2rem; background: url('../images/icons/delite_line.svg') no-repeat center / contain; }
.term_wrapper .list_box { position: relative; margin-top: 1.25rem; }
.term_wrapper .list_box button { position: relative; background-color: #fff; border: 1px solid rgba(35, 36, 38, 0.1); border-radius: .5rem; width: 100%; height: 3rem; padding-left: 1rem; text-align: left; font-size: .875rem; font-weight: 700; color: #48494D; }
.term_wrapper .list_box button:after { content: ""; position: absolute; right: 1rem; top: .75rem; width: 1.5rem; height: 1.5rem; background: url('../images/icons/ic_arrow_down_black.svg') no-repeat center / contain; transition: 0.3s; }
.term_wrapper .list_box button.active:after { transform: rotate(180deg); }
.term_wrapper .list_box ul { display: none; position: absolute; top: 3.5rem; background-color: #fff; border-radius: .5rem; border: 1px solid rgba(35, 36, 38, 0.1); width: 100%; max-height: 16.25rem; overflow: auto; z-index: 1; }
.term_wrapper .list_box ul li { padding: 1rem; color: #48494D; font-size: .875rem; transition: 0.3s; cursor: pointer; }
.term_wrapper .list_box ul li ~ li { border-top: 1px solid rgba(35, 36, 38, 0.1); }
.term_wrapper .list_box ul li.active,
.term_wrapper .list_box ul li:hover { background-color: #F8F9FB; }

.terms_box { margin-top: 2.5rem; }
.terms_box strong { display: block; padding-bottom: .5rem; font-size: 1.25rem; font-weight: 700; color: #232426; }
.terms_box pre { margin: 0; white-space: pre-wrap; word-wrap: break-word; font-size: .9375rem; color: #9B9DA1; line-height: 1.5; margin-bottom: 2.5rem; line-height: 1.5; }
.terms_box *:not(strong) { color: #9B9DA1; font-size: .9375rem; line-height: 1.5; }
.terms_box .dot { padding-left: 1.25rem; position: relative; }
.terms_box .dot:before { content: ""; display: block; position: absolute; left: .375rem; top: .5rem; width: .1875rem; height: .1875rem; border-radius: 100%; background-color: #9B9DA1; }
.terms_box table { width: 100%; border-collapse: collapse; border-right: 1px solid #F2F4F6; border-bottom: 1px solid #F2F4F6; margin-bottom: 2.5rem; }
.terms_box table th,
.terms_box table td { padding: .75rem 1rem; color: #63656A; font-size: .8125rem; }
.terms_box table th { background-color: var(--bg-gray5); }
.terms_box table td { text-align: center; line-height: 1.5; border-left: 1px solid #F2F4F6; border-top: 1px solid #F2F4F6; }
.terms_box .space_txt { line-height: 1.5; padding-left: .6875rem; text-indent: -0.6875rem; }
.terms_box .space_list { padding-left: 1.625rem; text-indent: -0.6875rem; }
.terms_box .space_list ul { padding-left: 1.875rem; text-indent: -0.6875rem; }

/* visual */
.visual_wrap { position: relative; padding: 12.5rem 1.25rem 3.875rem; background: url('../images/img_visual.png') no-repeat center top; }
.visual_wrap .con_box { display: flex; justify-content: space-between; max-width: 75rem; margin: 0 auto; }
.visual_wrap .txt_box { padding-top: 1.125rem; }
.visual_wrap h2 { font-size: var(--h1-48); font-weight: var(--bold-f); }
.visual_wrap p { font-size: var(--t1-24); padding-block: 1.25rem 2.5rem; }
.visual_wrap a { display: inline-block; background-color: var(--col-navy); color: var(--col-white); font-size: var(--t2-20); padding: 1.25rem 2.5rem; border-radius: .5rem; }
.package_box { width: 28.25rem; height: 33.625rem; background: url('../images/img_package.png') no-repeat center / contain; }

/* section 1 */
.wrap_01 { text-align: center; }
.step_list { padding-top: 5rem; max-width: 42.5rem; margin: 0 auto; text-align: left; }
.step_list li { display: flex; align-items: center; gap: 2.5rem; padding: 2.5rem; border-radius: .5rem; background-color: var(--bg-gray4); }
.step_list li > img { width: 6.25rem; }
.step_list li ~ li { margin-top: 1.25rem; }
.step_list li div span { font-size: var(--t1-24); color: var(--col-navy); }
.step_list li div p { padding-top: .5rem; font-size: var(--h3-28); }

/* section 2 */
.wrap_02 { text-align: center; }
.category_slide { margin-top: 5rem; max-width: 120rem; }
.category_slide .swiper-wrapper { transition-timing-function: linear }
.category_slide .swiper-slide { width: 18.875rem; }
.category_slide::before, 
.category_slide::after { content: ""; position: absolute; top: 0; bottom: 0; width: 9.375rem; z-index: 2; }
.category_slide::before { left: 0; background-image: linear-gradient(270deg, transparent, #fff 100%); }
.category_slide::after { right: 0; background-image: linear-gradient(-270deg, transparent, #fff 100%); }

/* section 3 */
.wrap_03 .max_w1024 { display: flex; align-items: center; justify-content: space-between; gap: 2.5rem; }
.note_box { width: calc(100% - 24.5rem); }
.note_txt { position: relative; max-width: 31.25rem; background-color: var(--bg-gray2); margin-top: 5rem; padding: 4.5rem 2rem 2rem; }
.note_txt::before { content: ""; width: calc(100% - 2rem); height: 1.25rem; background: url('../images/icons/note_dot.png') center; position: absolute; left: 1rem; top: 1.25rem; }
.note_txt strong { font-size: var(--t2-20); font-weight: var(--bold-f); padding-bottom: 1.25rem; }
.note_txt p { font-size: var(--t4-16); color: var(--col-gray2); }
.note_txt p span { background-color: #F2F76F; color: var(--col-black); }

.wrap_03 .swiper-wrapper { transition-timing-function: linear; }
.review_slide { position: relative; width: 22rem; height: 47.625rem; display: flex; gap: .75rem; }
.review_slide::before, 
.review_slide::after { content: ""; position: absolute; left: 0; right: 0; height: 9.375rem; z-index: 2; }
.review_slide::before { top: 0; background-image: linear-gradient(180deg, #fff, transparent 100%); }
.review_slide::after { bottom: 0; background-image: linear-gradient(-180deg, transparent, #fff 100%); }
.review_02 .swiper-wrapper { top: -7.75rem; }
.review_slide .swiper-slide { max-height: 14.75rem; background-color: var(--bg-gray4); padding: 1.25rem 1.5rem; border-radius: .25rem; }
.review_slide .swiper-slide strong:before { content: ""; display: block; width: 100%; height: 2.125rem; background: url('../images/icons/ic_quotes.svg') no-repeat left top / 1.375rem; border-bottom: 1px solid var(--bor-blackRGB7); margin-bottom: .75rem; }
.review_slide .swiper-slide strong { display: block; padding-bottom: 1.25rem; color: var(--col-navy); font-size: .75rem; }
.review_slide .swiper-slide p { color: var(--col-gray2); font-size: .6875rem; letter-spacing: -0.2px; }

/* section 4 */
.wrap_04 { background-color: var(--bg-gray4); }
.info_box { padding-top: 5rem; }
.info_box li { display: flex; align-items: center; justify-content: space-between; gap: 2.5rem; }
.info_box li ~ li { padding-top: 7.5rem; }
.info_box img { width: 43.95%; }
.info_box .txt_box strong { font-size: var(--h3-28); padding-bottom: 1.25rem; }
.info_box .txt_box p { font-size: var(--t2-20); color: var(--col-gray3); }
.info_box .txt_box span { display: block; padding-top: .5rem; font-size: var(--t4-16); }

/* section 5 */
.wrap_05 .lan_tit { padding-bottom: 5rem; text-align: center; }
.pack_list { width: calc(48.05% - 2.5rem); }
.pack_list li { position: relative; padding-left: 3.25rem; }
.pack_list li ~ li { margin-top: 3rem; }
.pack_list li:not(:last-child):after { content: ""; display: block; width: 1px; background-color: var(--col-navy); height: 100%; position: absolute; left: .875rem; top: 2.4375rem; }
.pack_list li img { position: absolute; left: 0; top: .1875rem; width: 1.75rem; }
.pack_list li strong { display: block; padding-bottom: .5rem; font-size: var(--t1-24); color: var(--col-gray1); }
.pack_list li p { font-size: var(--t4-16); color: var(--col-gray3); }
.pack_box { position: relative; width: 51.95%; padding: 2.5rem; background-color: var(--bg-gray4); }
.pack_box .pack_tit { padding-bottom: 5.625rem; color: var(--col-gray3); font-size: var(--t3-18); }
.pack_slide { overflow: hidden; }
.pack_slide img { display: block; width: 15rem; margin: 0 auto; }
.pack_slide p { padding-top: 2rem; text-align: center; font-weight: var(--bold-f); font-size: var(--t2-20); }
.pack_slide p span { color: var(--col-gray2); padding-left: .5rem; }
.pack_box .pack_pagination { position: absolute; right: 2.5rem; top: 2.5rem; left: auto; bottom: auto; text-align: right; }
.pack_pagination .swiper-pagination-bullet-active { background-color: var(--col-gray2); }
.pack_slide .pack_next,
.pack_slide .pack_prev { width: 2rem; height: 2rem; background: url('../images/icons/ic_arrow_down_gray.svg') no-repeat center / contain; position: absolute; top: 6.5rem; z-index: 1; cursor: pointer; }
.pack_slide .pack_prev { transform: rotate(90deg); left: 0; }
.pack_slide .pack_next { transform: rotate(-90deg); right: 0; }

/* section 6 */
.wrap_06 { background-color: var(--bg-gray4); }
.wrap_06 .flex_gap40 { align-items: flex-start; }
.wrap_06 .flex_gap40 .coalition_tit { flex: 1; width: 100%; }
.coalition_box { flex: 1; width: 100%; max-width: 30rem; }

/* section 7 */
.wrap_07 { text-align: center; }
.qna_list { text-align: left; padding-top: 2.5rem; max-width: 64rem;  margin: 0 auto; }
.qna_list .question,
.qna_list .answer .flex_baseline { display: flex; align-items: baseline; gap: .5rem; padding: 2rem 1.25rem; }
.qna_list .question { position: relative; font-size: var(--t2-20); color: var(--col-gray1); cursor: pointer; border-bottom: 1px solid var(--bor-blackRGB7); }
.qna_list .question::after { content: ""; position: absolute; right: 1.25rem; top: calc(50% - .75rem); width: 1.5rem; height: 1.5rem; background: url('../images/icons/ic_arrow_down_gray.svg') no-repeat center / contain; transition: 0.3s; }
.qna_list .question > strong { color: var(--col-navy); }
.qna_list .question > p { padding-right: 1.5rem; }
.qna_list .answer { display: none; font-size: var(--t3-18); color: var(--col-gray2); background-color: var(--bg-gray4); border-bottom: 1px solid var(--bor-blackRGB10); }
.question.active { border: none; }
.question.active:after { transform: rotate(-180deg); }

.more_info { padding-block: 6.25rem; background-color: var(--col-navy); }
.more_info .max_w1024 { display: flex; align-items: center; justify-content: space-between; padding-inline: 1.25rem; }
.more_info .max_w1024 p { color: var(--col-white); font-size: var(--h3-28); font-weight: var(--bold-f); }
.more_info .max_w1024 .btn_box { width: 100%; max-width: 27rem; display: flex; gap: .5rem; }

/* 영양제 목록 */
.sub_wrapper { padding-block: 4.375rem 5rem; } 
.pill_banner { background-color: var(--col-navy); overflow: hidden; margin-bottom: 5rem; }
.sub_wrapper .max_w1024 { max-width: 66.5rem; }
.sub_wrapper section.max_w1024 { padding-inline: 1.25rem; }
.pill_banner .max_w1024 { padding: 6.5rem 1.25rem; position: relative; }
.pill_banner .max_w1024:after { content: ""; position: absolute; right: 5.86%; bottom: 0; width: 20.9375rem; height: 100%; background: url('../images/pill_bnr.png') no-repeat right bottom / contain; }
.pill_banner img { width: 17.5rem; }
.pill_banner p { padding-top: 2.5rem; font-size: var(--h3-28); color: var(--col-white); }

.list_tit { display: block; padding-bottom: 2rem; text-align: center; font-size: var(--h2-36); color: var(--col-navy); }
.search_wrap { display: flex; gap: .5rem; align-items: center; max-width: 45rem; margin: 0 auto; padding-bottom: 2.5rem; }

.tab_btnBox { display: flex; align-items: center; height: 3.75rem; margin-top: 2.5rem; }
.tab_btnBox button { flex: 1; background-color: var(--bg-gray4); height: 100%; border-bottom: 1px solid var(--bor-blackRGB10); color: var(--col-gray2); font-size: var(--t2-20); }
.tab_btnBox button.active { border-top: 2px solid var(--bg-sky); border-bottom: none; background-color: var(--col-white); color: var(--col-navy); font-weight: var(--bold-f); }

.hospital_type { margin-top: .5rem; border-bottom: 1px solid var(--bor-blackRGB7); }
.hospital_type .swiper-slide { width: fit-content; margin-right: 1.25rem; padding-block: 1.25rem; font-size: var(--t3-18); color: var(--col-gray3); font-weight: var(--bold-f); border-bottom: 2px solid transparent; transition: 0.3s; cursor: pointer; }
.hospital_type .swiper-slide:hover { color: rgba(0, 53, 85, 0.5); }
.hospital_type .swiper-slide.active { color: var(--col-navy); border-color: var(--col-navy); }

.tab_panel { display: none; }
.tab_panel.active { display: block; }
.pill_list { display: flex; flex-wrap: wrap; gap: 1.25rem; padding-block: 2.5rem 2.5rem; }
.pill_list > li:not(.empty) { width: calc(33.33% - .8331rem); text-align: center; background-color: var(--bg-gray4); padding: 2rem 2.5rem; border-radius: .5rem; }
.pill_list > li:not(.empty) strong { font-size: var(--t1-24); color: var(--col-black); letter-spacing: -0.2px; }
.pill_list > li:not(.empty) p { padding-block: .5rem 2rem; font-size: var(--t3-18); color: var(--col-gray2); }
.pill_list > li.empty { width: 100%; padding-block: 7.5rem; text-align: center; color: var(--col-gray3); font-size: var(--t1-24); }
.pill_list a { display: flex; flex-direction: column; align-items: center; justify-content: space-between; height: 100%; }
.pill_img { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; justify-content: center; aspect-ratio: 1 / 1; align-content: center; width: 100%; }
.pill_img .img_box { display: flex; align-items: center; justify-content: center; width: calc(50% - .625rem); aspect-ratio: 1 / 1; background-color: var(--col-white); padding-inline: .625rem; border-radius: 100%; }
.pill_img .img_box img { width: 100%; }
.pill_img .over_txt { font-size: var(--h2-36); font-weight: var(--bold-f); color: var(--col-black); }

.pill_list.single_type .pill_img .img_box { width: 100%; max-width: 10rem; padding-inline: 1rem; }

/* 영양제 상세 */
.pill_typeTab { margin-block: 1.25rem; }
.pill_typeTab .swiper-slide { width: fit-content; padding: .5rem 1rem; font-size: var(--t4-16); color: var(--col-gray3); border: 1px solid var(--bor-blackRGB7); border-radius: .25rem; cursor: pointer; margin-right: .25rem; }
.pill_typeTab .swiper-slide.active { background-color: var(--col-navy); color: var(--col-white); }

.pill_detail { padding-block: 5rem 2.5rem; border-bottom: .5rem solid var(--bg-gray4); text-align: center; }
.division_tag { display: inline-block; padding: .5rem 1rem; border-radius: 2.8125rem; background-color: rgba(84, 194, 240, 0.2); font-size: var(--t4-16); font-weight: var(--bold-f); color: var(--col-navy); margin-bottom: 1.25rem; }
.pill_tit { display: block; font-size: var(--h2-36); }
.basic_info { padding-top: .5rem; color: var(--col-gray2); font-size: var(--t1-24); }

.combination_list { display: flex; flex-wrap: wrap; justify-content: center; gap: 3.75rem; max-width: 50rem; margin: 5rem auto 3.75rem; padding-inline: 6.875rem; word-break: keep-all; }
.combination_list li { width: calc(50% - 1.875rem); }
.combination_list .img_box { display: flex; align-items: center; padding-inline: .875rem; border-radius: 100%; background-color: var(--bg-gray5); width: 8.75rem; margin: 0 auto; aspect-ratio: 1 / 1; }
.combination_list .img_box img { width: 100%; }
.combination_list li strong { display: block; font-size: var(--t1-24); padding-top: 1.25rem; }
.combination_list li p { font-size: var(--t2-20); color: var(--col-gray2); padding-top: .5rem; }

.product_box { padding-block: 3.75rem 5rem; }
.product_box .img_box { display: flex; align-items: center; justify-content: center; width: 15rem; aspect-ratio: 1/1; padding-inline: 1.5rem; margin: 0 auto; border-radius: 100%; background-color: var(--bg-gray5); }
.product_box .img_box img { width: 100%; }
.product_box .logo_box { display: flex; gap: 2rem; align-items: center; justify-content: center;margin-top: 3.75rem; flex-wrap: wrap; padding-inline: 1rem; }
.product_box .logo_box img { height: 2.5rem; }

.pill_infoBox { display: flex; align-items: stretch; border-top: 1px solid var(--bor-blackRGB7); padding-block: 2.5rem; justify-content: center; }
.detail_info ~ .detail_info { border-left: 1px solid var(--bor-blackRGB7); padding-left: 1.5625rem; margin-left: 1.5625rem; box-sizing: content-box; }
.detail_info { width: 11.25rem; }
.detail_info span { color: var(--col-gray3); font-size: var(--t2-20); }
.detail_info p { display: flex; align-items: center; justify-content: center; padding-top: .5rem; font-size: var(--t1-24); color: var(--col-gray1); height: calc(100% - 2rem); font-weight: var(--bold-f); }

.component_wrap { padding-block: 7.5rem; color: var(--col-gray2); }
.component_tit { display: flex; align-items: center; justify-content: space-between; padding-bottom: 2rem; border-bottom: 1px solid var(--col-navy); margin-bottom: 5rem; }
.component_tit .name { font-size: var(--h2-36); font-weight: var(--bold-f); color: var(--col-navy); }
.component_tit .right_txt { text-align: end; font-size: var(--t4-16); }
.component_tit .right_txt p { color: var(--col-gray3); padding-top: .25rem; font-weight: var(--bold-f); }

.probiotics_wrap { padding-bottom: 5rem; text-align: center; }
.probiotics_wrap + .sales_box { margin-top: 0; }
.probiotics_con { display: flex; gap: 5rem; align-items: center; justify-content: center; }
.probiotics_con + .lacto_list { margin-top: 5rem; }
.probiotics_tit { display: block; font-size: var(--h3-28); color: var(--col-navy); padding-bottom: 2rem; }
.probiotics_info { display: flex; align-items: center; justify-content: center; width: 16.25rem; aspect-ratio: 1/1; border-radius: 100%; background-color: var(--bg-sky); color: var(--col-white); font-size: var(--t1-24); padding: 1.25rem; }

.lacto_info { max-width: 52.5rem; margin: 0 auto; padding-top: 5rem; font-size: var(--t3-18); }
.probiotics_con[style*="display: none"] + .lacto_info { padding-top: 0; }
.lacto_list { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; max-width: 52.5rem; margin: 1.25rem auto 0; border: 1px solid var(--bor-blackRGB10); border-radius: .5rem; padding: 2.5rem; }
.lacto_list li { display: flex; width: calc(50% - .625rem); font-size: var(--t3-18); }
.lacto_list li span { width: 2.5rem; }
.lacto_list li p { width: calc(100% - 2.5rem); text-align: left; margin-left: auto; }

.graph_wrap { display: flex; align-items: end; flex-wrap: wrap; gap: 5rem; max-width: 50rem; margin: 0 auto; }
.graph_box { position: relative; width: calc(50% - 2.5rem); padding-bottom: 3.375rem; }
.graph_wrap .graph_box:first-child { margin: 0 auto; }
.graph_txt { display: flex; align-items: end; justify-content: space-between; padding-bottom: 2.75rem; }
.graph_per { max-width: calc(100% - 4.75rem); color: var(--col-navy); font-size: var(--h3-28); }
.graph_per span { color: var(--bg-sky); margin-left: .5rem; }
.graph_unit { font-size: var(--t5-13); }
.graph_box .bar { height: .75rem; border-radius: 6.25rem; background-color: rgba(0, 53, 85, 0.5); }
.graph_box .bar div { position: relative; height: 100%; border-radius: 6.25rem; background-color: var(--bg-sky); }
.graph_box .bar div:after { content: ""; position: absolute; right: -0.5rem; top: -1.5rem; width: 0; height: 0; border-style: solid;  border-width: .75rem .5rem 0 .5rem; border-color: var(--bg-sky) transparent transparent transparent; }
.graph_box .amount_txt { position: absolute; bottom: 0; right: 0; height: 3.375rem; display: flex; align-items: end; flex-direction: column; font-size: var(--t4-16); padding-top: .5rem; color: var(--col-black); }

.sales_box { max-width: 35.625rem; margin: 5rem auto; width: fit-content; }
.sales_box li { display: flex; align-items: baseline; font-size: var(--t4-16); }
.sales_box li ~ li { padding-top: .75rem; }
.sales_box li span { width: 3.9375rem; color: var(--col-black); font-weight: var(--bold-f); }
.sales_box li p { width: calc(100% - 3.9375rem); }

.more_link { display: flex; align-items: center; justify-content: space-between; padding: 1.5rem 2.5rem; background-color: var(--bg-gray4); }
.more_link p { color: var(--col-navy); font-size: var(--t2-20); font-weight: var(--bold-f); }
.more_link .btn_box { display: flex; align-items: center; gap: .5rem; justify-content: center; }
.more_link .btn_box * { width: 9.75rem; height: 2.875rem; line-height: 2.875rem; border-radius: .5rem; font-size: var(--t4-16); font-weight: var(--bold-f); text-align: center; }
.more_link .btn_box .navy_link { color: var(--col-white); background-color: var(--col-navy); }
.more_link .btn_box .white_link { color: var(--col-navy); border: 1px solid var(--col-navy); background-color: var(--col-white); }

/* 애니메이션 공통 */
@keyframes fadeup {
    from {
        transform: translateY(2.5rem);
    }
    to {
        transform: translateY(0); opacity: 1;
    }
}
.visual_wrap .con_box { animation: fadeup 0.5s linear both; }
.ani_box { opacity: 0; }
.ani_box.active:not(.review_slide) { animation: fadeup 0.5s linear both; }
.review_slide.active { animation: fadeup 0.5s 0.5s linear both; }

/* 두번째 섹션 모바일에서만 스크롤 애니 적용 */
@media (min-width: 769px) {
    .wrap_01 { animation: fadeup 0.5s linear both; }
}

/* 1920 이상 */
@media (min-width: 1920px) {
    .floating_btn { right: calc(50% + 5rem - 60rem); }
}

/* mobile */
@media (max-width: 768px) {
    html { font-size: 20px; }
    body { font-weight: 500; }
    :root {
        /* font size */
        --h1-48: 2rem;
        --h2-36: 1.375rem;
        --h3-28: 1.25rem;
        --t1-24: 1rem;
        --t2-20: .9375rem;
        --t3-18: .875rem;
        --t4-16: .8125rem;
        --t5-13: .75rem;
        --bold-f: 600;
    }
    @media (max-width: 430px) {
        html { font-size: 16px; }
        .pill_list.single_type .pill_img .img_box { max-width: 5rem; }
    }
    @media (max-width: 320px) {
        html { font-size: 14px; }
    }

    /* header */
    header img { width: 4rem; }
    header .btn_box .max_w1024 { gap: .25rem; }
    header .dim { position: fixed; top: 3.5625rem; }
    header .mobile_menu { width: 1.5rem; height: 1.5rem; background: url('../images/icons/ic_menu.svg') no-repeat center / 1.5rem; transition: 0.3s; }
    header .mobile_menu.active { background-image: url('../images/icons/delite_line.svg'); }
    header .btn_box { display: none; position: absolute; top: 3.5625rem; left: 0; right: 0; background-color: var(--col-white); padding-inline: 1.25rem; }
    header .btn_box .max_w1024 { flex-direction: column; align-items: flex-start;  }
    header .btn_box .max_w1024 * { border: none; font-size: var(--t2-20); padding: 1rem 1rem 1rem 0; width: 100%; color: var(--col-gray2); font-weight: 400; transition: 0.3s; }
    header .btn_box .max_w1024 *:hover { color: var(--col-navy); font-weight: var(--bold-f); }

    /* 팝업 */
    .pop_cont { padding: 1.5rem 1rem 1rem; }
    .pop_cont .pop_tit { font-size: var(--t1-24); }
    .pop_cont .pop_txt { font-size: var(--t2-20); padding-top: .5rem; }
    .pop_cont .btn_box { padding-top: 1.25rem; }

    .dim_popup { width: 100%; top: 1.25rem; }
    .dim_box { display: block; margin: 0 auto; width: calc(100% - 2.5rem); max-width: 20rem; padding: .75rem 1.25rem; text-align: center; font-size: var(--t3-18); }

    /* 영양제 상세 팝업 */
    .detailModal { align-items: end; }
    .modal_detail { max-width: 100%; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
    .modal_tit .pill_modaltit { font-size: var(--h3-28); }
    .modal_tit .pill_modalinfo { font-size: var(--t1-24); gap: .25rem; }
    .detail_txt { max-height: 53.85svh; font-size: var(--t3-18); }

    /* input */
    .inp_tit { padding-bottom: .5rem; }
    textarea, 
    input { padding-inline: 1rem; border-radius: .5rem; }
    textarea { padding-block: .875rem; }
    input { height: 3rem }
    .clear_btn { width: 1.5rem; height: 1.5rem; }
    .reset_btn { width: 2rem; height: 2rem; }

    /* button */
    .navy_btn { height: 3.3125rem; line-height: 3.3125rem; border-radius: .5rem; }
    .gray_btn { font-size: var(--t2-20); }
    .white_btn_m,
    .navy_btn_m { height: 2.625rem; line-height: 2.625rem; border-radius: .25rem; font-size: var(--t4-16); }
    .floating_btn { font-size: var(--t2-20); padding: .75rem 3rem .75rem 1.25rem; background-size: 1.5rem; background-position: right 1rem center; right: 1.25rem; bottom: 2.5rem; }
    .navy_search { height: 2.0625rem; line-height: 2.0625rem; padding-inline: .75rem; border-radius: .25rem; }

    /* footer */
    footer { padding-block: 2.5rem 7.5rem; }
    footer .soacial_box img { width: 1.75rem; }
    footer .txt_box { padding-top: 1.25rem; }
    footer .txt_box li span { width: 7.5rem; }
    footer .tg_btn { gap: .25rem; }
    footer .tg_btn:after { width: 1.25rem; height: 1.25rem; }
    footer .panel strong ~ strong { padding-top: 2rem; }
    footer .foo_terms li ~ li::before { height: .625rem; margin-inline: .25rem; }

    /* 공통 */
    .mobile_none { display: none; }
    .pc_none { display: block; }

    .lan_wapper section:not(.visual_wrap) { padding-block: 5rem; }
    .lan_tit { letter-spacing: -0.1px; }
    .lan_subTit { padding-top: .5rem; }
    .max_w1024 { max-width: 31.25rem; }

    /* visual */
    .visual_wrap { background-image: url('../images/Mimg_visual.png'); padding-block: 3.75rem 0; height: var(--fixed-vh, 100vh); min-height: 42.5rem; max-height: 85rem; }
    .visual_wrap .con_box { flex-direction: column; text-align: center; height: 100%; }
    .visual_wrap p { padding-block: 1rem 2rem; }
    .visual_wrap a { padding: 1rem 2rem; }
    .package_box { background-image: url('../images/Mimg_package.png'); width: 18.125rem; height: 16.875rem; margin: 0 auto; }


    /* section 1 */
    .lan_wapper section.wrap_01 { padding-bottom: 3.75rem; }
    .step_list { padding-top: 2.5rem; max-width: 31.25rem; }
    .step_list li { padding: 1.5rem 1.25rem; gap: 1.25rem; }
    .step_list li ~ li { margin-top: .5rem; }
    .step_list li > img { width: 2.875rem; }
    .step_list li div span { font-size: var(--t2-20); }
    .step_list li div p { padding-top: .25rem; font-size: var(--t2-20); }

    /* section 2 */
    .lan_wapper section.wrap_02 { padding-top: 3.75rem; }
    .category_slide { margin-top: 2.5rem; }
    .category_slide .swiper-slide { width: 10.5rem; }
    .category_slide::before, .category_slide::after { display: none; }

    /* section 3 */
    .wrap_03 .max_w1024 { flex-direction: column; }
    .wrap_03 .lan_tit { text-align: center; }
    .note_box { width: 100%; }
    .note_txt { max-width: 100%; margin-top: 2.5rem; padding: 2.75rem 1.25rem 1rem; }
    .note_txt::before { height: .75rem; background-size: 2rem .75rem; top: .7725rem; }
    .note_txt strong { font-size: var(--t2-20); padding-bottom: 1rem; }
    .note_txt p { font-size: var(--t4-16); }
    .review_slide::before, .review_slide::after,
    .review_02 { display: none; }
    .review_slide { width: 100%; height: fit-content; }
    .review_slide .swiper-slide { max-height: 100%; width: 10.625rem; padding: 1rem; }
    .review_slide .swiper-slide strong:before { background-size: 1rem; height: 1.5rem; margin-bottom: .5rem; background-size: 1rem; }
    .review_slide .swiper-slide strong { font-size: var(--t4-16); padding-bottom: 1rem; }
    .review_slide .swiper-slide p { font-size: .75rem; }

    /* section 4 */
    .info_box { padding-top: 3.75rem; }
    .info_box li { flex-direction: column; gap: 1.5rem; align-items: baseline; }
    .info_box img { order: 1; width: 100%; }
    .info_box .txt_box { order: 2; } 
    .info_box .txt_box strong { font-size: var(--h3-28); padding-bottom: .5rem; }
    .info_box .txt_box p { font-size: var(--t2-20); }

    /* section 5 */
    .wrap_05 .lan_tit { padding-bottom: 2.5rem; }
    .wrap_05 .flex_gap40 { flex-direction: column; }
    .pack_list { width: fit-content; }
    .pack_list li { padding-left: 2.75rem; }
    .pack_list li:not(:last-child):after { top: 1.75rem; left: .75rem; height: calc(100% + .5rem); }
    .pack_list li ~ li { margin-top: 2.5rem; }
    .pack_list li img { width: 1.5rem; top: 0; }
    .pack_box { width: 100%; padding: 1.25rem; }
    .pack_box .pack_tit { padding-bottom: 2.5rem; }
    .pack_box .pack_pagination { right: 1.25rem; top: .95rem; }
    .pack_box .pack_pagination .swiper-pagination-bullet { width: .25rem; height: .25rem; margin: 0 .125rem; }
    .pack_slide img { width: 9.375rem; }
    .pack_slide p { padding-top: 1.5rem; }
    .pack_slide .pack_next, 
    .pack_slide .pack_prev { width: 1.25rem; height: 1.25rem; top: 4.0625rem; }

    /* section 6 */
    .wrap_06 .flex_gap40 { flex-direction: column; }
    .wrap_06 .flex_gap40 .coalition_tit { text-align: center; }
    .coalition_box { max-width: 100%; }
    .wrap_06 .txt_center.mt_32 { margin-top: 1.5rem; }
    .wrap_06 .navy_btn.mt_32 { margin-top: 1.25rem; }
    
    /* section 7 */
    .qna_list { max-width: 31.25rem; }
    .qna_list .question, 
    .qna_list .answer .flex_baseline { padding: 1.25rem 1rem; }
    .qna_list .question { font-size: var(--t3-18); } 
    .qna_list .answer { font-size: var(--t4-16); }
    .qna_list .question::after { width: 1.25rem; height: 1.25rem; }

    .more_info { padding-block: 2.5rem; }
    .more_info .max_w1024 { flex-direction: column; text-align: center; gap: 1.5rem; }
    .more_info .max_w1024 p { font-size: var(--t1-24); }
    .more_info .max_w1024 .btn_box { max-width: 25rem; }

    /* 영양제 목록 */
    .sub_wrapper { padding-block: 3.5625rem 0; }
    .pill_banner { margin-bottom: 3.75rem; }
    .pill_banner .max_w1024 { padding-block: 3.5rem; }
    .pill_banner .max_w1024:after { width: 10rem; right: -1.25rem; opacity: 0.25; }
    .pill_banner img { width: 7rem; }
    .pill_banner p { padding-top: 1rem; font-size: var(--t1-24); }

    .list_tit { padding-bottom: 1rem; }
    .search_wrap { padding-bottom: 1.25rem; }
    .tab_btnBox { margin-top: 1.25rem; height: 2.75rem; }
    .tab_btnBox button { font-size: var(--t3-18); }
    .tab_btnBox button.active { border-width: 1px; }
    .hospital_type { position: relative; margin-top: 0; }
    .hospital_type .swiper-slide { padding-block: 1rem; font-size: var(--t4-16); border-width: 1px; margin-right: 1rem; }
    .pill_list { gap: .5rem; padding-block: 1.25rem 3.75rem; }
    .pill_list > li:not(.empty) { padding: 1.25rem; width: calc(50% - .25rem); border-radius: .25rem; }
    .pill_list > li:not(.empty) strong { font-size: var(--t2-20); }
    .pill_list > li:not(.empty) p { font-size: var(--t5-13); padding-block: .25rem 1.25rem; }
    .pill_img { gap: .5rem; }
    .pill_img .img_box { width: calc(50% - .25rem); max-width: 6.25rem; padding-inline: .3125rem; }
    .pill_list.single_type .pill_img .img_box { max-width: 7.5rem; padding-inline: .5rem; }

    /* 영양제 상세 */
    .pill_typeTab { margin-block: 1rem; position: relative; }
    .hospital_type::after,
    .pill_typeTab::after { content: ""; position: absolute; right: 0; top: 0; width: 1.5rem; height: 100%; background-image: linear-gradient(to right, transparent, #fff); z-index: 1; }
    .pill_typeTab .swiper-slide { padding: .25rem .5rem; font-size: var(--t5-13); }

    .pill_detail { padding-block: 3.75rem 1.75rem; }
    .division_tag { padding: .25rem .5rem; font-size: var(--t5-13); margin-bottom: .75rem; }
    .pill_tit { font-size: var(--h3-28); }
    .basic_info { padding-top: .25rem; }
    .combination_list { padding-inline: 0; margin-block: 2.5rem; gap: 2.5rem .5rem; }
    .combination_list li { width: calc(50% - .25rem); }
    .combination_list .img_box { width: 5rem; }
    .combination_list li strong { padding-top: 1rem; font-size: var(--t3-18); }
    .combination_list li p { padding-top: .125rem; font-size: var(--t4-16); }

    .product_box { padding-block: 2.5rem; }
    .product_box .img_box { width: 11.25rem; padding-inline: 1.875rem; }
    .product_box .logo_box { margin-top: 2.5rem; gap: 1rem; }
    .product_box .logo_box img { height: 1.875rem; }

    .pill_infoBox { padding-block: 2rem; }
    .detail_info span { font-size: var(--t4-16); }
    .detail_info p { font-size: var(--t3-18); }

    .component_wrap { padding-block: 3.75rem 2.5rem; }
    .component_tit { flex-direction: column; border-bottom: none; align-items: flex-start; padding-bottom: 3.75rem; margin-bottom: 0; } 
    .component_tit .name { width: 100%; padding-bottom: 1rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--col-navy); }
    .component_tit .right_txt { text-align: left; }
    .component_tit .right_txt p { font-size: var(--t5-13); }

    .probiotics_wrap { padding-bottom: 3.75rem; }
    .probiotics_con { flex-direction: column; gap: 2.5rem; }
    .probiotics_tit { padding-bottom: 1.25rem; }
    .probiotics_info { width: 11.25rem; }
    .lacto_info { padding-top: 2rem; }
    .lacto_list { padding: 1.25rem 1.5rem; gap: .25rem; }
    .probiotics_con + .lacto_list { margin-top: 2rem; }
    .lacto_list li { width: 100%; }
    .graph_wrap { gap: 1.25rem; }
    .graph_box { width: 100%; padding-bottom: 0; }
    .graph_box .amount_txt { position: static; }
    .sales_box { margin-block: 5rem 2.5rem; }
    .sales_box li ~ li { padding-top: .5rem; }
    .more_link { flex-direction: column; border-radius: .5rem; padding: 1.25rem; }
    .more_link p { font-size: var(--t3-18); padding-bottom: 1.25rem; }
    .more_link .btn_box { width: 100%; max-width: 25rem; }
    .more_link .btn_box * { height: 2.625rem; line-height: 2.625rem; width: 100%; text-align: center; }
}