@charset "utf-8"; 

/** 한 팩 영양제 **/
.pack_slider_box .main_title_area { margin-top: 0px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } 
.pack_slider_box .main_title_area .label_wrap { display: flex; justify-content: flex-start; align-items: center; } 
.pack_slider_box .main_title_area .label_wrap.type_text { justify-content: space-between; width: 100%; } 
.pack_slider_box .main_title_area .label_wrap.type_text .text { font-size: var(--font-small); font-weight: 400; line-height: 20px; } 
.pack_slider_box .main_title_area .label { display: inline-block; width: auto; height: 22px; padding: 0 8px; font-size: 13px; font-weight: 500; color: var(--color-black-40); line-height: 22px; background: #eff0f6; border-radius: 5px; } 
.pack_slider_box .main_title_area .label01 { display: inline-block; height: 24px; font-size: var(--font-small); font-weight: 700; line-height: 24px; text-align: center; padding: 0 8px; border-radius: var(--border-radius); } 
.pack_slider_box .main_title_area .label01.type_pp { color: var(--color-main); background-color: rgba(139, 79, 246, 0.1); } 
.pack_slider_box .main_title_area .label01.type_gn { color: #00C3AB; background-color: rgba(0, 195, 171, 0.1); } 
.pack_slider_box .main_title_area .label01.type_gy { color: var(--color-gray); background-color: rgba(136, 136, 136, 0.1); } 
.pack_slider_box .main_title_area .label02 { display: inline-block; height: 20px; font-size: var(--font-medium); font-weight: 700; line-height: 20px; } 
.pack_slider_box .main_title_area .label02.type_pp { color: var(--color-main); } 
.pack_slider_box .main_title_area .label02.type_gn { color: #00C3AB; } 
.pack_slider_box .main_title_area .label02.type_gy { color: var(--color-black-40); } 
.pack_slider_box .main_title_area .label + .label { margin-left: 8px; } 
.pack_slider_box .main_title_area .main_title { width: 100%; font-size: var(--font-large-xl); font-weight: 700; line-height: 34px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-top: 8px; } 
.pack_slider_box .main_title_area .sub_copy { font-size: var(--font-regular); font-weight: 400; color: var(--color-black-70); line-height: 20px; margin-top: 8px; } 
.pack_slider_box .swiper-pagnation { display: flex; justify-content: center; align-items: center; width: 100%; margin-top: 24px; } 
.pack_slider_box .swiper-pagnation .swiper-pagination-bullet { display: inline-block; width: auto; height: 40px; font-size: var(--font-regular); font-weight: 500; color: var(--color-black-70); line-height: 40px; background: var(--color-white); border: var(--border); border-radius: 40px; padding: 0 12px; box-sizing: border-box; opacity: 1; } 
.pack_slider_box .swiper-pagnation .swiper-pagination-bullet.swiper-pagination-bullet-active { color: var(--color-main); background: rgba(139, 79, 246, 0.1); border: 1px solid transparent; } 
.pack_slider_box .swiper-pagnation .swiper-pagination-bullet + .swiper-pagination-bullet { margin-left: 8px; } 
.pack_slider_box .pack_swiper_wrap { width: calc(100% + 48px); margin-left: -24px; margin-top: 24px; overflow: hidden; } 
.pack_slider_box .pack_swiper_wrap .swiper-wrapper { height: auto; } 
.pack_slider_box .pack_swiper_wrap .swiper-slide { width: 100%; text-align: center; } 
.pack_slider_box .pack_swiper_wrap .swiper-slide .pack_area { width: 298px; height: 278px; background-image: url(../image/test/img_pack.png); background-repeat: no-repeat; background-position: center; background-size: 100%; margin: 0 auto; } 
.pack_slider_box .pack_swiper_wrap .swiper-slide .pack_area.pack20 { background-image: url(../image/test/img_pack20.png); } 
.pack_slider_box .pack_swiper_wrap .pack_area { width: 310px; height: 284px; background-image: url(../image/test/img_pack.png); background-repeat: no-repeat; background-position: center center; padding: 71px 28px 0; background-size: 100%; } 
.pack_slider_box .pack_swiper_wrap .pack_area .title_area { display: flex; justify-content: space-between; align-items: center; } 
.pack_slider_box .pack_swiper_wrap .pack_area .title { width: calc(100% - 75px); font-size: var(--font-medium); font-weight: 700; line-height: 26px; text-align: left; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } 
.pack_slider_box .pack_swiper_wrap .pack_area .time_area { display: flex; align-items: center; } 
.pack_slider_box .pack_swiper_wrap .pack_area .time_area span { font-size: var(--font-medium); font-weight: 700; line-height: 26px; } 
.pack_slider_box .pack_swiper_wrap .pack_area .time_area img { width: 20px; margin-left: 4px; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area { display: flex; flex-wrap: wrap; justify-content: flex-start; flex-direction: column; height: 108px; margin-top: 18px; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area li { position: relative; display: inline-block; width: calc(50% - 10px); display: flex; justify-content: space-between; margin-bottom: 6px; padding-left: 10px; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area li::before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 21px; font-size: 13px; font-weight: 400; color: var(--color-black); line-height: 16px; content: "•"; display: inline-block; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area li strong { width: 100%; font-size: var(--font-small); font-weight: 400; line-height: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area li .btn { width: 100%; font-size: var(--font-small); font-weight: 400; line-height: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: underline; text-align: left; } 
.pack_slider_box .pack_swiper_wrap .pack_area .list_area li span { font-size: 15px; font-weight: 400; color: var(--color-gray); line-height: 21px; }