@charset "UTF-8";

/* ===== 비주얼 섹션 ===== */
.visual{position: relative; width: 100%; height: 720px; display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; margin-top: 140px;}
.visual_text{position: relative; z-index: 2; text-align: center; color: #fff;}
.visual_text img{max-width: 900px; width: 100%;}
.visual_text h3{font-size: clamp(36px, 5vw, 72px); font-weight: 400; line-height: 140%; letter-spacing: -1px;}
.visual_text h3 b{color: #3BA5F7; font-weight: 800;}
.visual_text h4{font-size: clamp(36px, 5vw, 72px); font-weight: 400; line-height: 140%; letter-spacing: -1px;}
.visual_text h4 b{color: #3BA5F7; font-weight: 800;}
.visual_line{position: absolute; bottom: -30px; left: 50%; transform: translateX(-50%); width: 2px; padding: 100px 0; background: rgba(255,255,255,0.48); z-index: 5;}
.visual2{position: relative; width: 100%; display: flex; align-items: flex-end; justify-content: center; padding: 120px 0 60px; background-size: cover; background-position: center; background-repeat: no-repeat;}

/* ===== page1 깨워라 ===== */
.page1{position: relative; width: 100%;}
.page1::before{content: ''; position: absolute; top: 0; left: 0; right: 0; padding: 80px 0; background: linear-gradient(180deg, #000 0%, transparent 100%); z-index: 1; pointer-events: none;}
.page1_bg img{width: 100%;}

/* ===== page2 제품 소개 ===== */
.page2{background: #111 url(../img/p2_bg.png) no-repeat center bottom / cover; text-align: center; padding-bottom: 0;}
.page2 .ptxt img{max-width: 900px; width: 100%;}
.page2 .img{margin-top: 60px;}
.page2 .img img{width: 100%;}

/* ===== page3 추천 대상 ===== */
.page3{background: #f4f4f4 url(../img/p3_bg.png) no-repeat center / cover;}
.page3 .ptxt{text-align: center; margin-bottom: 80px;}
.page3 .ptxt img{max-width: 900px; width: 100%;}
.recommend_list{display: flex; flex-direction: column; gap: 60px;}
.recommend_item{position: relative; padding: 110px 10%; background-size: cover; background-position: center;}
.recommend_item::before{content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit;}
.recommend_item::after{content: ''; position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #7ec8e3; z-index: 3; top: 50%; transform: translateY(-50%);}
.recommend_item.left{width: 73%; border-radius: 0 20px 20px 0;}
.recommend_item.left::before{background: rgba(0, 140, 210, 0.45);}
.recommend_item.left::after{right: -6px;}
.recommend_item.right{width: 73%; margin-left: auto; border-radius: 20px 0 0 20px;}
.recommend_item.right::before{background: rgba(0, 84, 162, 0.55);}
.recommend_item.right::after{left: -6px;}
.recommend_item span{position: relative; z-index: 2; display: block; font-size: clamp(24px, 3vw, 40px); font-weight: 500; color: #fff; margin-bottom: 12px; letter-spacing: -1px; line-height: 130%;}
.recommend_item p{position: relative; z-index: 2; font-size: clamp(24px, 3.5vw, 48px); font-weight: 400; color: #fff; letter-spacing: -1.2px; line-height: 130%;}
.recommend_item p b{font-weight: 700;}

/* ===== page4 탄탄한 설계 ===== */
.page4{background: #000 url(../img/p4_bg.png) no-repeat center / cover; text-align: center; position: relative; overflow: hidden;}
.page4 .ptxt img{max-width: 900px; width: 100%;}
.pill_img{margin: 60px auto; max-width: 1000px;}
.pill_img img{width: 100%;}
.page4 .box_wrap{display: flex; justify-content: center; gap: 2%; max-width: 1135px; margin: 0 auto;}
.page4 .box{flex: 1; background: rgba(255,255,255,0.2); padding: 50px 20px 40px; text-align: center;}
.page4 .box > img{width: 100%; max-width: 160px;}
.box_bar{display: block; margin: 40px auto; opacity: 0.6;}
.box_bar img{width: 100%; max-width: none;}
.page4 .box p{font-size: 36px; font-weight: 500; color: #fff; line-height: 130%; letter-spacing: -0.9px;}
.bubble{position: absolute; opacity: 0.3; pointer-events: none;}
.bubble img{width: 100%;}
.bubble.b1{width: 80px; top: 15%; left: 5%;}
.bubble.b2{width: 120px; top: 20%; right: 3%;}
.bubble.b3{width: 60px; bottom: 15%; left: 10%;}
.bubble.b4{width: 100px; bottom: 20%; right: 8%;}

/* ===== 공통 POINT 배지 ===== */
.point_badge{display: inline-flex; align-items: center; border-radius: 100px; overflow: hidden; margin-bottom: 40px;}
.point_badge span{font-size: 32px; font-weight: 500; color: #505050; background: #f7f7f7; padding: 12px 14px 12px 28px; letter-spacing: -0.8px; line-height: 130%;}
.point_badge em{font-size: 32px; font-weight: 500; color: #fff; background: #00adef; padding: 12px 28px 12px 14px; font-style: normal; letter-spacing: -0.8px; line-height: 130%;}
.section_title{font-size: clamp(36px, 5vw, 72px); font-weight: 700; color: #111; text-align: center; line-height: 130%; letter-spacing: -1.8px;}
.section_title b{color: #3BA5F7;}

/* ===== page5 POINT01 옥타코사놀 ===== */
.page5{background-color: #fff; background-size: 100% auto; background-position: top center; background-repeat: no-repeat; position: relative; overflow: hidden;}
.page5 .width{text-align: center;}
.page5 .ptxt{margin-bottom: 100px;}
.page5 .ptxt img{max-width: 900px; width: 100%;}
.page5 .img{max-width: 1520px; margin: 0 auto -280px; position: relative; z-index: 2;}
.page5 .img img{width: 100%; border-radius: 40px; box-shadow: 0 8px 48px rgba(0,0,0,0.16);}
.bird_img{position: absolute; top: 60px; right: -5%; width: 42%;}
.bird_img img{width: 100%;}
.bird_img2{position: absolute; top: 500px; left: -22%; width: 38%; transform: scaleX(-1);}
.bird_img2 img{width: 100%;}
.test_result{background: #fff; padding:480px 0 80px; margin-top: 0;}
.test_result h2{font-size: clamp(36px, 5vw, 72px); font-weight: 700; color: #111; text-align: center; line-height: 130%; letter-spacing: -1.8px;}
.test_result .notice{font-size: 20px; color: #767676; text-align: center; margin: 20px 0 60px; letter-spacing: -0.5px;}
.result_wrap{display: flex; justify-content: center; max-width: 1520px; margin: 0 auto;}
.result_item{flex: 1; text-align: center;}
.result_item:first-child{border-right: 1px solid #e5e5ec;}
.result_item img{width: 100%; max-width: 200px; margin-bottom: 44px;}
.result_item h3{font-size: clamp(24px, 3vw, 40px); font-weight: 700; color: #111; line-height: 130%; letter-spacing: -1px; margin-bottom: 24px;}
.result_info{display: flex; flex-direction: column; gap: 4px; align-items: center;}
.result_info_row{display: flex; gap: 12px; justify-content: center;}
.result_info p{font-size: 20px; color: #767676; line-height: 130%; letter-spacing: -0.5px; margin: 0;}

/* ===== page6 블루맥스 1정에 ===== */
.page6{background-color: #f0f0f0; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 160px 0;}
.page6 .width{display: flex; justify-content: flex-end;}
.page6_text{text-align: left; max-width: 800px;}
.page6_text h2{font-size: clamp(32px, 4.5vw, 64px); font-weight: 600; color: #111; line-height: 120%; letter-spacing: -1.6px;}
.page6_text h2 b{background: linear-gradient(to bottom, #6cd6ff, #00adef); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-weight: 700;}
.page6_text h2 em{color: #d40000; font-style: normal; font-weight: 900;}
.page6_text p{font-size: clamp(14px, 1.6vw, 24px); color: #999; margin-top: 28px; letter-spacing: -0.6px; font-weight: 500;}

/* ===== page7 미국산 옥타코사놀 ===== */
.page7{padding: 320px 0 280px 0; background-size: cover; background-position: center; background-repeat: no-repeat; overflow: hidden; position: relative;}
.page7 .width{position: relative; z-index: 1;}
.page7_wrap{display: flex; align-items: center; justify-content: space-between; gap: 5%;}
.page7_text{flex: 1; text-align: center;}
.page7_text h2{font-size: clamp(36px, 6vw, 85px); font-weight: 700; color: #fff; margin-bottom: 40px; letter-spacing: -2.125px; line-height: 130%;}
.page7_text p{font-size: clamp(18px, 2.5vw, 35px); color: #fff; line-height: 130%; font-weight: 400; letter-spacing: -0.875px;}
.page7_img{flex: 0 0 auto; text-align: center;}
.page7_img img{width: 100%; max-width: 452px;}
.page7_img span{display: block; margin-top: 28px; font-size: clamp(20px, 2.8vw, 40px); font-weight: 600; color: #fff;}

/* ===== page8 POINT02 기능성 원료 ===== */
.page8{background: #111; text-align: center;}
.p8_txt{margin-bottom: 40px;}
.p8_txt img{max-width: 900px; width: 100%;}
.body_img{max-width: 1328px; margin: 40px auto;}
.body_img img{width: 100%;}
.page8 .ptxt{margin: 40px 0;}
.page8 .ptxt h3{font-size: clamp(24px, 3.8vw, 54px); font-weight: 500; color: #fff; letter-spacing: -1.35px; line-height: 130%;}
.page8 .ptxt h3 b{background: linear-gradient(to bottom, #6cd6ff, #00adef); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-weight: 500;}
.page8 .ptxt h2{font-size: clamp(32px, 5vw, 72px); font-weight: 700; color: #fff; letter-spacing: -1.8px; line-height: 130%;}
.page8 .box_wrap{display: grid; grid-template-columns: 1fr 1fr; gap: 16px 2%; max-width: 1540px; margin: 0 auto;}
.page8 .box{display: flex; align-items: center; gap: 2%; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); padding: 24px 28px; text-align: left;}
.page8 .box img{width: 100%; max-width: 140px; flex-shrink: 0;}
.page8 .box h4{font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 5px;}
.page8 .box p{font-size: 14px; color: rgba(255,255,255,0.6); line-height: 150%;}

/* ===== page9 8가지 복합성분 ===== */
.page9{background-size: cover; background-position: center; background-repeat: no-repeat;}
.p9_txt{text-align: center; margin-bottom: 50px;}
.p9_txt img{max-width: 900px; width: 100%;}
.p9_chart{margin: 0 auto; max-width: 1360px;}
.p9_chart img{width: 100%; filter: drop-shadow(0px 0px 10px #c3c3c3);}

/* ===== page10 POINT03 부원료 ===== */
.page10{background-color: #f5f7fa; background-size: cover; background-position: center; background-repeat: no-repeat;}
.page10 .width{text-align: center;}
.p10_txt{margin-bottom: 40px;}
.p10_txt img{max-width: 900px; width: 100%;}
.sub_ingredient_top{display: flex; align-items: stretch; border: 4px solid #00adef; border-radius: 32px; overflow: hidden; margin: 0 0 40px; text-align: left; background: #fff;}
.sub_ingredient_img{width: 40%; flex-shrink: 0;}
.sub_ingredient_img img{width: 100%;}
.sub_ingredient_info{flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 28px; padding: 40px 80px; background: #f7f7f7;}
.sub_ingredient_info h3{font-size: clamp(28px, 3vw, 40px); font-weight: 600; color: #111;}
.sub_ingredient_info p{font-size: clamp(22px, 2.5vw, 35px); color: #505050; line-height: 130%;}
.sub_grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 2%; margin-top: 40px;}
.sub_item{background: #fff; border: 1px solid #e5e5ec; border-radius: 32px; overflow: hidden; position: relative;}
.sub_item img{width: 100%;}
.sub_item p{padding: 24px; font-size: clamp(18px, 2vw, 28px); font-weight: 600; color: #111; text-align: center; background: #f7f7f7; line-height: 130%;}
.sub_item .badge{position: absolute; bottom: 76px; right: 16px; background: #00adef; color: #fff; font-size: clamp(16px, 1.8vw, 24px); padding: 6px 20px; border-radius: 8px; font-weight: 600;}

/* ===== page11 블루맥스 1정에 모두 ===== */
.page11{background-color: #f0f2f5; background-size: cover; background-position: center; background-repeat: no-repeat; text-align: center;}
.p11_txt{margin-bottom: 40px;}
.p11_txt img{max-width: 900px; width: 100%;}
.circle_wrap{display: flex; align-items: center; justify-content: center; gap: 4%; margin: 50px 0;}
.circle{width: 360px; aspect-ratio: 1; border-radius: 50%; background: linear-gradient(166deg, rgb(24, 46, 184) 10%, rgb(26, 166, 228) 90%); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff;}
.circle h3{font-size: clamp(32px, 4vw, 60px); font-weight: 700; background: linear-gradient(to bottom, #6cd6ff, #00adef); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 130%; letter-spacing: -1.5px;}
.circle p{font-size: clamp(18px, 2.5vw, 36px); font-weight: 500; line-height: 130%;}
.plus{font-size: 40px; font-weight: 300; color: #182eb8;}
.fist_img{max-width: 950px; margin: 0 auto; border-radius: 20px; overflow: hidden;}
.fist_img img{width: 100%;}

/* ===== page12 POINT04 섭취방법 ===== */
.page12{background: linear-gradient(180deg, #F7F7F7 0%, #F2F5FC 100%); text-align: center;}
.p12_txt{margin-bottom: 40px;}
.p12_txt img{max-width: 955px; width: 100%;}
.ptp_img{max-width: 850px; margin: 50px auto 100px auto;}
.ptp_img img{width: 100%;}
.ptp_title{font-size: clamp(28px, 3.6vw, 52px); font-weight: 700; color: #00adef; letter-spacing: -1.3px; line-height: 130%; position: relative; z-index: 1; margin-bottom: -30px;}
.page12 .box_wrap{display: grid; grid-template-columns: 1fr 1fr; background: rgba(255,255,255,0.9); border-radius: 40px; padding: 60px;}
.page12 .box{display: flex; align-items: flex-start; gap: 3%; padding: 48px 7%; text-align: left;}
.page12 .box:nth-child(-n+2){border-top: 3px solid #00adef; border-bottom: 1px solid #61cdf6;}
.page12 .box:nth-child(n+3){border-bottom: 3px solid #00adef;}
.page12 .box img{width: 100%; max-width: 40px; flex-shrink: 0;}
.page12 .box p{font-size: clamp(18px, 2.2vw, 32px); color: #111; line-height: 130%; letter-spacing: -0.8px;}
.page12 .box b{display: inline; position: relative; font-size: clamp(18px, 2.2vw, 32px); color: #00adef; font-weight: 600; line-height: 130%; letter-spacing: -0.8px;}
.page12 .box b::after{content: ''; position: absolute; bottom: 0; left: -4px; right: -4px; padding-bottom: 12px; background: rgba(0,173,239,0.16); z-index: -1;}

/* ===== page13 패키지구성 ===== */
.page13{background: linear-gradient(180deg, #0a1530 0%, #0a2050 100%) center / cover no-repeat; text-align: center;}
.page13 .ptxt img{max-width: 900px; width: 100%;}
.page13 .box_wrap{display: flex; flex-direction: column; gap: 80px; margin-top: 60px;}
.page13 .box{display: flex; align-items: center; gap: 20px 4%; text-align: left;}
.page13 .box.reverse .text{text-align: right;}
.page13 .img{width: 48%;}
.page13 .img img{width: 100%;}
.page13 .text{width: 48%;}
.page13 .text h3{font-size: clamp(24px, 3.8vw, 52px); font-weight: 700; letter-spacing: -1.8px; line-height: 130%; background: linear-gradient(180deg, #6cd6ff, #00adef); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;}
.page13 .text p{font-size: clamp(20px, 3.2vw, 44px); font-weight: 300; color: #fff; line-height: 130%; margin-top: 10px;}

/* ===== page14 브랜드 ===== */
.page14{background: center / cover no-repeat; padding-bottom: 0;}
.page14 .ptxt{text-align: center;}
.page14 .ptxt img{max-width: 900px; width: 100%;}
.brand_logo{display: flex; align-items: center; justify-content: center; gap: 5%; margin-top: 50px;}
.brand_logo img{width: 100%; max-width: 590px;}
.brand_divider{width: 4px; padding: 50px 0; background: rgba(0,0,0,0.24);}
.brand_bottom{padding: 300px 0 120px; text-align: center;}
.brand_bottom img{width: 100%; max-width: 1000px;}

/* ===== page15 품질보증서 ===== */
.page15{background: #1a1a1a center / cover no-repeat; text-align: center;}
.page15 .ptxt img{max-width: 900px; width: 100%;}
.warranty_img{margin-top: 160px;}
.warranty_img img{width: 100%;}

/* ===== page16 건강기능식품 ===== */
.page16{background: #f5f7fa center / cover no-repeat; text-align: center;}
.page16 .box_wrap{display: flex; justify-content: center; gap: 5%;}
.page16 .box{width: 48%; max-width: 520px; border: 2px solid #e5e5ec; border-radius: 28px; overflow: hidden;}
.page16 .box .img{background: #fff; padding: 40px 20%;}
.page16 .box .img img{width: 100%;}
.page16 .box .text{background: #00adef; padding: 16px;}
.page16 .box .text h3{font-size: clamp(24px, 3.2vw, 48px); font-weight: 500; color: #fff; letter-spacing: -1.2px; line-height: 130%;}
.page16 .box .text p{font-size: clamp(18px, 2.4vw, 34px); font-weight: 400; color: #fff; line-height: 130%; margin-top: 6px;}
.cert_text{margin-top: 70px;}
.cert_text p{font-size: clamp(22px, 3.8vw, 54px); font-weight: 500; color: #111; line-height: 130%; letter-spacing: -1.35px;}
.cert_text b{color: #00adef; font-weight: 700;}

/* ===== page17 제조공장 + 제품표시 ===== */
.page17{color: #fff;}
.factory_hero{background: center / cover no-repeat; position: relative; text-align: center; padding: 650px 0 80px;}
/* .factory_hero::before{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0.2), #000);} */
.factory_hero .width{position: relative; z-index: 2;}
.factory_hero img{width: 100%; max-width: 1115px;}
.page17_content{background: #000 center / cover no-repeat; padding-top: 20px;}
.cert_badges{display: flex; justify-content: center; gap: 5%; margin-bottom: 140px; max-width: 1195px; margin-left: auto; margin-right: auto;}
.cert_badges .box{text-align: center; width: 28%;}
.cert_badges .box img{width: 100%; border-radius: 20px;}
.cert_badges .box p{font-size: clamp(20px, 2.4vw, 36px); font-weight: 600; color: #fff; margin-top: 20px; line-height: 130%;}
.factory_photos{display: flex; gap: 2%; margin-bottom: 60px;}
.factory_photos .box{width: 33%;}
.factory_photos .box img{width: 100%; border-radius: 28px;}
.page17_info{background: #000;}
.product_info_title{font-size: 28px; font-weight: 700; color: #fff; text-align: center; margin-bottom: 30px; padding-top: 40px;}
.product_info{font-size: 14px; color: #fff; line-height: 130%; border: 1px solid rgba(255,255,255,0.6); border-bottom: 0;}
.product_info dl{display: flex; gap: 0 4px; border-bottom: 1px solid rgba(255,255,255,0.6); padding: 16px 40px;}
.product_info dt{font-weight: 300; letter-spacing: -0.03em; line-height: 130%;}
.product_info dd{font-weight: 300; letter-spacing: -0.03em; line-height: 130%;}
.info_row{display: flex;}
.info_row dl{width: 50%;}
.info_row dl:last-child{border-left: 1px solid rgba(255,255,255,0.6);}

/* ===== 푸터 ===== */
#ft{padding: 30px 0 30px 0; background: #fbf5ed;}
#ft .foot_logo img{width: 120px;}
#ft .footer{display: flex; justify-content: space-between; align-items: center;}
#ft .foot_info ul{display: flex; gap: 0 7px; align-items: center;}
#ft .foot_info ul li{color: #686868; line-height: 150%;}
#ft .foot_info ul span{color: #686868; line-height: 150%;}

/* ===== 반응형 ===== */
@media all and (max-width: 1400px) {
	.visual_line{padding: 60px 0;}
}

@media all and (max-width: 1024px) {
	.visual{height: 50vh; margin-top: 100px;}
	.visual_text img, .page2 .ptxt img, .page3 .ptxt img, .page4 .ptxt img, .page5 .ptxt img, .p8_txt img, .p9_txt img, .p10_txt img, .p11_txt img, .p12_txt img, .page13 .ptxt img, .page14 .ptxt img, .page15 .ptxt img, .factory_hero img{max-width: 700px;}
	.visual_line{padding: 40px 0;}
	.page1_text img{max-width: 250px;}
	.page2{padding-bottom: 0;}
	.page3 .ptxt{margin-bottom: 50px;}
	.recommend_list{gap: 40px;}
	.recommend_item{padding: 80px 8%;}
	.recommend_item.left, .recommend_item.right{width: 85%;}
	.page4 .box_wrap{gap: 3%;}
	.page4 .box p{font-size: 28px;}
	.point_badge span, .point_badge em{font-size: 24px;}
	.page5 .ptxt{margin-bottom: 60px;}
	.page5 .img{margin: 0 auto -150px;}
	.test_result{padding: 230px 0 60px;}
	.test_result h2{font-size: clamp(28px, 4.5vw, 52px); letter-spacing: -1px;}
	.result_wrap{flex-direction: column; align-items: center;}
	.result_item:first-child{border-right: none; border-bottom: 1px solid #e5e5ec; padding-bottom: 40px; margin-bottom: 40px;}
	.result_info_row{flex-direction: column; gap: 4px;}
	.page6{padding: 80px 0;}
	.page6 .width{justify-content: center;}
	.page6_text{max-width: none;}
	.page7{padding: 80px 0;}
	.page7_wrap{flex-direction: column; text-align: center;}
	.page7_img{margin-top: 40px;}
	.page7_img img{max-width: 280px;}
	.page8 .box_wrap{grid-template-columns: 1fr;}
	.ptp_img{margin: 30px auto 60px;}
	.ptp_title{margin-bottom: -25px;}
	.page12 .box_wrap{padding: 40px; border-radius: 28px;}
	.page12 .box{padding: 36px 5%;}
	.page13 .box{flex-direction: column;}
	.page13 .box.reverse{flex-direction: column-reverse;}
	.page13 .box.reverse .text{text-align: center;}
	.page13 .img, .page13 .text{width: 100%;}
	.page13 .text{text-align: center;}
	.page14 .width{padding: 60px 0;}
	.brand_logo img{max-width: 400px;}
	.cert_badges .box{width: 30%;}
	.cert_badges .box img{border-radius: 0;}
	.cert_badges .box p{font-size: clamp(14px, 1.8vw, 24px);}
	.factory_photos .box{width: 32%;}
	.factory_photos .box img{border-radius: 0;}
	.factory_hero{padding: 400px 0 60px;}
	.circle{width: 240px;}
	.sub_ingredient_top{flex-direction: column;}
	.sub_ingredient_img{width: 100%;}
	.sub_ingredient_info{padding: 30px 40px;}
	.sub_grid{grid-template-columns: repeat(2, 1fr);}
	.sub_item .badge{bottom: 66px;}
}

@media all and (max-width: 768px) {
	#ft .footer{flex-direction: column; gap: 15px 0; align-items: center;}
	#ft .foot_info ul{flex-direction: column; align-items: center;}
	#ft .foot_info ul span{display: none;}
	#ft .foot_logo img{width: 76px;}
	.visual{height: 50vh; margin-top: 60px;}
	.page1::before{padding: 40px 0; background: linear-gradient(180deg, rgba(0,0,0,0.6) 0%, transparent 100%);}
	.page2{padding-bottom: 0;}
	.page2 .img{margin-top: 0;}
	.page2 .ptxt h5{font-size: 20px;}
	.page3 .ptxt{margin-bottom: 30px;}
	.recommend_list{gap: 30px;}
	.recommend_item{padding: 60px 6%;}
	.recommend_list{padding: 0 4%;}
	.recommend_item.left, .recommend_item.right{width: 100%; border-radius: 0;}
	.recommend_item::after{display: none;}
	.recommend_item p{font-size: clamp(18px, 5vw, 28px);}
	.recommend_item span{font-size: clamp(18px, 2.5vw, 28px);}
	.page4 .box_wrap{flex-direction: column; align-items: center; gap: 20px;}
	.page4 .box{width: 80%;}
	.page4 .box p{font-size: 22px;}
	.page4 .box > img{max-width: 100px;}
	.box_bar{margin: 5px auto;}
	.point_badge{margin-bottom: 24px;}
	.point_badge span, .point_badge em{font-size: 20px; padding: 8px 12px;}
	.page5 .ptxt{margin-bottom: 40px;}
	.page5 .img{margin: 0 auto -100px;}
	.page5 .img img{border-radius: 20px;}
	.test_result{padding: 160px 0 40px;}
	.test_result h2{font-size: clamp(22px, 5vw, 32px); letter-spacing: -0.5px;}
	.test_result .notice{font-size: 16px;}
	.result_item img{max-width: 100px; margin-bottom: 24px;}
	.result_item h3{font-size: clamp(20px, 4vw, 28px); margin-bottom: 16px;}
	.result_info p{font-size: 15px;}
	.page6{position: relative;}
	.page6::before{content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.3); z-index: 0;}
	.page6 .width{position: relative; z-index: 1;}
	.page6_text{text-align: center;}
	.page6_text h2{color: #fff; font-size: clamp(24px, 5vw, 36px);}
	.page6_text p{color: rgba(255,255,255,0.7);}
	.page8 .box img{max-width: 80px;}
	.circle{width: 140px;}
	.circle h3{font-size: 28px;}
	.ptp_img{margin: 20px auto 40px;}
	.ptp_title{margin-bottom: -20px;}
	.page12 .box_wrap{grid-template-columns: 1fr; padding: 30px; border-radius: 20px;}
	.page12 .box:nth-child(-n+2){border-top: none; border-bottom: none;}
	.page12 .box:first-child{border-top: 3px solid #00adef;}
	.page12 .box:not(:last-child){border-bottom: 1px solid #61cdf6;}
	.page12 .box:last-child{border-bottom: 3px solid #00adef;}
	.page12 .box{padding: 16px 5%;}
	.page12 .box svg{width: 30px; height: 30px;}
	.page12 .box p, .page12 .box b{font-size: clamp(16px, 4vw, 22px);}
	.page12 .box b::after{padding-bottom: 8px;}
	.page14 .width{padding: 40px 0 0;}
	.brand_bottom{padding: 40px 0 30px;}
	.brand_logo{flex-direction: column; gap: 20px;}
	.brand_divider{display: none;}
	.brand_logo img{max-width: 70%;}
	.cert_badges{margin-bottom: 60px;}
	.page16 .box .img{padding: 30px 10%;}
	.page16 .box .text h3{font-size: clamp(18px, 4vw, 28px);}
	.page16 .box .text p{font-size: clamp(14px, 3vw, 20px);}
	.warranty_img{margin-top: 60px;}
	.factory_hero{padding: 250px 0 40px;}
	.factory_photos .box{width: 100%;}
	.product_info dl{padding: 14px 20px; flex-direction: column;}
	.product_info dt{font-size: 13px;}
	.product_info dd{font-size: 13px;}
	.info_row{flex-wrap: wrap;}
	.info_row dl{width: 100%; flex-direction: row;}
	.info_row dl:last-child{border-left: 0;}
	.info_row:last-child dl:last-child{flex-direction: column;}
	.sub_ingredient_top{border-radius: 20px;}
	.sub_ingredient_info{padding: 24px 30px; gap: 16px;}
	.sub_ingredient_info h3{font-size: clamp(22px, 4vw, 28px);}
	.sub_ingredient_info p{font-size: clamp(16px, 3.5vw, 22px);}
	.sub_grid{grid-template-columns: repeat(2, 1fr); gap: 12px 2%;}
	.sub_item{border-radius: 20px;}
	.sub_item p{padding: 10px; font-size: clamp(14px, 3vw, 20px);}
	.sub_item .badge{bottom: 56px; right: 12px; padding: 4px 14px;}
}

@media all and (max-width: 510px) {
	.page1_text img{max-width: 180px;}
	.sub_grid{grid-template-columns: 1fr 1fr;}
}

@media all and (max-width: 380px) {
	.visual_text img, .page2 .ptxt img, .page3 .ptxt img, .page4 .ptxt img, .page5 .ptxt img, .p8_txt img, .p9_txt img, .p10_txt img, .p11_txt img, .p12_txt img, .page13 .ptxt img, .page14 .ptxt img, .page15 .ptxt img, .factory_hero img{max-width: 250px;}
}