@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	header, footer, main 관련 작성 css 파일입니다.

	** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다.

───────────────────────────────────────────────────────────*/
body::-webkit-scrollbar{display: none;}
html{scroll-padding-top: calc(clamp(60px, 9vw, 90px) + var(--row-gap100));}
/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
	#wrap {position:relative;width:100%; overflow: clip;}
    .w_custom{position: relative; width: calc(100% - 60px); max-width: 1500px; margin-inline: auto;}
    #container{position: relative; padding-bottom:clamp(70px, 12vw, 120px);}
	.layer-popup .pop_closed{display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap;}

    @media (max-width:1500px){
		br.for_pc{display: none;}
    }
    @media (max-width:860px){
        .w_custom{width: calc(100% - 30px);}
    }
    @media (max-width:320px){
        .w_custom{width: calc(100% - 20px);}
    }


/*───────────────────────────────────────────────────────────

    HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
	#header{position: sticky;top:0;width: 100%;height: clamp(60px, 9vw, 90px);z-index: 100;background: var(--point-white);transition: all 0.4s;}
		#header.on{box-shadow:inset 0 -1px 0 var(--border-color01);}
	#header .w_custom{max-width: 1800px;height: 100%;display: flex;align-items: center;justify-content: space-between;gap: 20px;}
	#header .logo{height: 100%;}
	#header .logo a{display: flex;align-items: center;height: 100%;padding-block: 18px;}
	#header .gnb{position: absolute;top:0;left:50%;translate: -50%;width: calc(100% - 400px);height: 100%;display: flex;justify-content: center;text-align: center;}
	#header .gnb > li{position:relative;font-size: var(--text-20);font-weight: 500;color: var(--black-color03);line-height: 1.3;}
	#header .gnb > li > a{display:flex;align-items: center;justify-content: center;height: 100%;padding-inline: clamp(15px, 1.6vw, 30px);}
	#header .utility{display: flex; align-items: center; gap: clamp(15px, 3vw, 30px);}
	#header .allCate{display: flex;flex-direction: column;justify-content: space-between;width: clamp(23px, 3.5vw, 30px);aspect-ratio: auto 1.25;}
	#header .allCate span{width: 100%; height: 2px; background: var(--black-color03);}

	.com-btn{position: relative;display: flex;align-items: center;justify-content: center;min-width: clamp(100px, 15vw, 140px);padding: clamp(11px, 2.1vw, 16px) 20px;background: var(--point-color01);border-radius: 50px;font-size: var(--text-20);font-weight: 500;color: var(--point-white);line-height: 1.2;}


/*───────────────────────────────────────────────────────────

	Aside | outline/nav.html

───────────────────────────────────────────────────────────*/
    #aside{position: fixed;top: 0;left:0;width: 100%;height: 100%;z-index: 999;background: rgba(255,255,255,0.8);backdrop-filter:blur(10px);display: flex;flex-direction: column;overflow: hidden;overflow-y: auto;padding-block: 10vh;box-sizing: border-box;opacity: 0;transition: all 0.6s;clip-path: inset(0 0 100% 0);}
        #aside.on{opacity: 1;clip-path: inset(0);}
        body:has(#aside.on){overflow: clip; touch-action: none;}
    #aside .w_custom{flex-shrink: 0;max-width: 1800px;min-height: 100%;display: flex;align-items: center;}
    #aside .gnb{width: 100%;display: grid;align-items: start;justify-content: center;grid-template: auto / repeat(4, 1fr);gap: clamp(15px, 2.2vw, 40px);}
    #aside .gnb > li{color: var(--black-color01);font-size: var(--text-20);text-align: center;}
        
        @media (min-width:861px) {
            #aside .gnb > li{opacity:0;translate:0 100px;transition:all 0.8s 0.3s;}
            #aside.on .gnb > li{opacity:1;translate:0;}
            #aside.on .gnb > li:nth-child(2){transition-delay:0.4s;}
            #aside.on .gnb > li:nth-child(3){transition-delay:0.5s;}
            #aside.on .gnb > li:nth-child(4){transition-delay:0.6s;}
            #aside.on .gnb > li:nth-child(5){transition-delay:0.7s;}
            #aside.on .gnb > li:nth-child(6){transition-delay:0.8s;}
        }
    #aside .gnb > li > a{position: relative;display: block;font-size: var(--text-40);font-weight: 700;line-height: 1.4;padding-block: 30px;transition: all 0.4s;letter-spacing: 0;}
        #aside .gnb > li > a:before{position: absolute;content: '';top: 0;left: 50%;translate: -50%;width:12px;height: 0;opacity:0;border-radius:100%;background: var(--point-color01);transition:all 0.3s;}
    #aside .gnb .dep02{position: relative;}
    #aside .gnb .dep02 > li > a{display: block;font-weight: 400;padding-block: clamp(7px, 1.7vw, 13px);color: var(--black-color06);line-height: 1.6;transition: all 0.4s;}
    #aside .utility{position: absolute;top: clamp(30px, 2.8vw, 50px);right: clamp(30px, 2.8vw, 50px);display: flex;align-items: center;gap: clamp(20px, 1.6vw, 30px);z-index:2;}
    #aside .close_btn{position: relative;width: clamp(30px, 4vw, 40px);height: clamp(30px, 4vw, 40px);z-index: 9;}
    #aside .close_btn span{position: absolute;top:50%;left:50%;transform: translate(-50%, -50%) rotate(45deg);width: 100%;height: 2px;background: var(--black-color01);}
    #aside .close_btn span + span{transform: translate(-50%, -50%) rotate(-45deg);}
    
        /* over */
            @media (hover:hover) and (pointer:fine){
				#aside .gnb > li:hover > a{color: var(--point-color01);}
                #aside .gnb > li:hover > a:before{height:12px;opacity:1;}
                #aside .gnb .dep02 > li:hover a{color: var(--point-color02);}
            }

    @media (max-width:1023px){
        #aside{padding-block: clamp(80px, 12vw, 120px);}
    }
    @media (max-width:860px){
		#aside{display: block;}
		#aside .w_custom{align-items:flex-start;}
		#aside .gnb{grid-template: auto / repeat(1, 1fr);gap:0;}
        #aside .gnb > li{padding-block: clamp(20px, 3vw, 25px);text-align:left;border-bottom: 1px solid rgba(0,0,0,0.15);}
        #aside .gnb > li > a{padding-block: 0;}
		#aside .gnb > li > a:before{display: none;}
        #aside .gnb .dep02{display: grid;gap: 0 20px;grid-template: auto / repeat(2, 1fr);margin-top: clamp(10px, 1.8vw, 15px);justify-content: flex-start;}
		#aside .utility{top:15px; right: 15px;}
    }
    @media (max-width:479px){
        #aside .gnb .dep02{grid-template: auto / repeat(1, 1fr);}
    }
    

/*───────────────────────────────────────────────────────────

    MAIN | index.html

───────────────────────────────────────────────────────────*/
	.noti_txt{margin-top: 15px; text-align: right;}
		.noti_txt.cen{text-align: center;}
		.noti_txt.left{text-align: left;}
		.noti_txt.top{margin-block: 0 15px;}
	.noti_txt p{font-size: var(--text-16); color: var(--black-color06); line-height: 1.6;}
	.noti_txt p strong{font-weight: 500; color: var(--black-color01);}
	
	/* 비주얼 */
		.main-visual{position: relative;background: url('../images/skin/main_visual.jpg') no-repeat center / cover;padding-block: clamp(70px, 11vw, 110px);}
		.main-visual .w_custom{display: flex;align-items: flex-start;justify-content: space-between;gap: var(--row-gap40) var(--row-gap50);}
		.main-visual .cont{position: relative;width:min(636px, 100%);display: flex;flex-direction: column;gap: var(--row-gap50);}
		.main-visual .title{display: flex;flex-direction: column;gap: var(--row-gap20);text-wrap: balance;}
		.main-visual .title h2{font-size: var(--text-50);font-weight: 700;color: var(--black-color00);line-height: 1.2;letter-spacing: -0.03em;}
			.main-visual .title h2 + p{margin-top: var(--row-gap20);}
		.main-visual .title h3{font-size: var(--text-35);font-weight: 700;color: var(--black-color00);line-height: 1.2;letter-spacing: -0.03em;}
		.main-visual .title h3 em{font-weight: inherit; color: var(--point-color01);}
		.main-visual .title p{font-size: var(--text-20);line-height: 1.6;color: var(--black-color05);letter-spacing: -0.03em;}
		.main-visual .info-list{display: grid;grid: auto / repeat(3, 1fr);gap: clamp(16px, 1.6vw, 16px);}
		.main-visual .info-list > li{position: relative;padding: 21px 15px;text-align: center;background: var(--point-color02);border-radius: var(--radius-20);display: flex;flex-direction: column;gap: clamp(15px, 1.8vw, 18px);}
		.main-visual .info-list .icon{display: flex;align-items: center;justify-content: center;height: clamp(42px, 7vw, 65px);}
		.main-visual .info-list .desc{display: grid;gap: 6px;}
		.main-visual .info-list .desc dt{font-size: var(--text-20);font-weight: 500;color: var(--black-color00);line-height: 1.2;font-family: var(--font-type02);letter-spacing: 0.04em;}
		.main-visual .info-list .desc dd{font-size: var(--text-14);color: var(--black-color00);line-height: 1.3;}
		.main-visual .thumb{position: sticky;top: 80px;translate: 0 45px;margin-right: 28px;width: min(522px, 36%);flex-shrink: 0;}

		@media (max-width:1023px) {
			.main-visual .w_custom{flex-wrap: wrap;flex-direction: column-reverse;align-items: center;}
			.main-visual .cont{width: 100%;}
			.main-visual .thumb{position: relative;inset: auto;flex-shrink: unset;width: 80%;translate: 0;margin: 0;text-align: center;}
		}

		@media (max-width:479px) {
			.main-visual .info-list{grid: auto / repeat(1, 1fr);}
		}

	/* 타이틀 */
		.main-title{position: relative;display: flex;flex-direction: column;gap: var(--row-gap20);text-align: center;margin-bottom: var(--row-gap60);text-wrap: balance;}
			.main-title.left{text-align: left;}
		.main-title h2{font-size: var(--text-60); font-weight: 700; color: var(--black-color03); line-height: 1.4; letter-spacing: -0.04em;}
			.main-title h2 + h6{margin-top: var(--row-gap10);}
		.main-title h3{font-size: var(--text-50);font-weight: 700;color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;}
		.main-title h4{font-size: var(--text-40);font-weight: 700;color: var(--black-color00);line-height: 1.4;letter-spacing: -0.04em;}
			.main-title h4 + p{margin-top: var(--row-gap10);}
		.main-title h4 em{font-weight: inherit; color: var(--point-color01);}
		.main-title h6{font-size: var(--text-22);color: var(--black-color03);line-height: 1.6;letter-spacing: -0.04em;}
		.main-title h6 strong{font-weight: 600;}
		.main-title p{font-size: var(--text-20);color: var(--black-color03);line-height: 1.6;letter-spacing: -0.04em;}
		.main-title p strong{font-weight: 600;}
		.main-title p.sm-size{font-size: var(--text-24); font-weight: 500;}
		.main-title p.sm-size em{font-weight: inherit; color: var(--point-color01);}

	/* vecinfo-list */
		.vecinfo-list{display: grid;grid: auto / repeat(2, 1fr);gap: var(--col-gap40);}
		.vecinfo-list > li{position: relative;background: var(--point-color03);border-radius: var(--radius-20);padding: clamp(25px, 4vw, 40px) clamp(40px, 3.2vw, 60px);display: flex;align-items: center;gap: clamp(30px, 2.1vw, 40px);}
		.vecinfo-list .icon{display: flex;width: clamp(90px, 6vw, 100px);flex-shrink: 0;}
		.vecinfo-list .desc{display: flex;flex-direction: column;gap: var(--row-gap20);}
		.vecinfo-list .desc dt{font-size: var(--text-40);font-weight: 600;color: var(--point-color01);line-height: 1.5;font-family: var(--font-type02);}
		.vecinfo-list .desc dd{font-size: var(--text-22);color: var(--black-color03);line-height: 1.6;letter-spacing: -0.04em;}

		@media (max-width:1023px) {
			.vecinfo-list{grid: auto / repeat(1, 1fr);}
			.vecinfo-list .icon{width: clamp(56px, 9.5vw, 90px);}
			.vecinfo-list > li{padding: clamp(25px, 4vw, 40px);gap: clamp(25px, 3vw, 30px);}
		}
		@media (max-width:479px) {
			.vecinfo-list > li{flex-direction: column;text-align: center;gap: 15px;}
		}

	/* bd-exp */
		.bd-exp{display: flex; flex-direction: column; gap: var(--row-gap20);}
		.bd-exp > dt{font-size: var(--text-24);font-weight: 500;color: var(--black-color00);line-height: 1.4;letter-spacing: -0.04em;}
		.bd-exp > dd{border: 1px solid var(--border-color01);border-radius: var(--radius-20);padding: clamp(25px, 3vw, 30px); background: var(--point-white);}

	/* chk-list */
		.chk-list{display: flex;flex-direction: column;gap: clamp(15px, 2vw, 20px);}
		.chk-list > li{position: relative;font-size: var(--text-18);color: var(--black-color03);line-height: 1.6;letter-spacing: -0.04em; text-align: left;}
		.chk-list .desc{display: grid;gap: 8px;}
		.chk-list .desc dt{display: flex;align-items: baseline;gap: 8px;font-size: var(--text-20);font-weight: 600;color: var(--black-color00);line-height: 1.4;}
			.chk-list .desc dt::before{display: inline-flex;content:'';width: clamp(12px, 2.2vw, 17px);aspect-ratio: auto 1.21;background: url('../images/skin/chk_icon.svg') no-repeat center / 100% auto;flex-shrink: 0;}
		.chk-list .desc dd em{font-weight: 600;color: var(--point-color01);}

			.chk-list.type02{gap: 8px;}
			.chk-list.type02 > li{font-size: var(--text-16);font-weight: 500;color: var(--black-color03);display: flex;align-items: baseline;gap: 8px;line-height: 1.4;}
			.chk-list.type02 > li::before{display: inline-flex;content:'';width: clamp(10px, 1.8vw, 13px);aspect-ratio: auto 1.21;background: url('../images/skin/chk_icon.svg') no-repeat center / 100% auto;flex-shrink: 0;}

	/* bullet-list */
		.bullet-list{display: flex;flex-direction: column;gap: 5px;}
		.bullet-list > li{position: relative;font-size: var(--text-17);color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;text-align: left;display: flex;align-items: baseline;gap: 4px;}
		.bullet-list > li::before{display: contents; content:'· ';}
		.bullet-list > li strong{display: contents; font-weight: 600;}

		.bullet-list.type02{gap: var(--row-gap10);}
		.bullet-list.type02 > li{font-size: var(--text-18);line-height: 1.4;gap: clamp(6px, 0.8vw, 8px);color: var(--black-color00);}
		.bullet-list.type02 > li::before{display: inline-flex;content:'';width: 4px;aspect-ratio: auto 1;background: var(--point-color01);border-radius: 100%;flex-shrink: 0;translate: 0 -4px;}

	/* features-meta */
		.features-meta{display:flex;align-items: flex-start;gap: clamp(30px, 2.8vw, 53px);}
		.features-meta .thumb{position: sticky;top: 120px;width: min(697px, 48%);flex-shrink: 0;}
		.features-meta .cont{width: 100%;}

		@media (max-width:1023px) {
			.features-meta{flex-wrap: wrap;}
			.features-meta .thumb{position: relative;inset: auto;width: auto;flex-shrink: unset;margin-inline: auto;}
		}

	/* diff-platform */
		.diff-platform{padding-block: clamp(70px, 16.9vw, 169px);background: #E0DDDE url('../images/skin/diff-platform.jpg') no-repeat 69% 50% / cover;}
		.diff-platform .main-title{width: min(620px, 100%);}

		@media (max-width:1023px) {
			.diff-platform{background: none;padding-block: 0;}
			.diff-platform::after{display: block;content:'';width: 100%;background: #E0DDDE url('../images/skin/diff-platform.jpg') no-repeat 80% 50% / cover;height: clamp(400px, 50vw, 500px);margin-top: var(--row-gap70);}
			.diff-platform .main-title{width: 100%;}
		}

	/* vecexp-list */
		.vecexp-list{display: grid;grid: auto / repeat(4, 1fr);gap: var(--col-gap20);}
		.vecexp-list > li{position: relative;text-align: center;border: 1px solid var(--border-color01);border-radius: var(--radius-20);overflow: hidden;padding: clamp(30px, 4vw, 40px) clamp(15px, 3vw, 30px);display: flex;flex-direction: column;gap: var(--row-gap20);text-wrap: balance;}
		.vecexp-list .icon{display: flex;align-items: center;justify-content: center;height: clamp(55px, 9.1vw, 86px);}
		.vecexp-list .desc{display: grid;gap: var(--row-gap10);}
		.vecexp-list .desc dt{font-size: var(--text-24);font-weight: 600;color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;}
		.vecexp-list .desc dd{font-size: var(--text-18);color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;}

		@media (max-width:860px) {
			.vecexp-list{grid: auto / repeat(2, 1fr);}
		}
		@media (max-width:360px) {
			.vecexp-list{grid: auto / repeat(1, 1fr);}
		}

	/* dev-arw */
		.dev-arw {width: clamp(80px, 15vw, 150px);aspect-ratio: auto 1.25;background: var(--point-grad01);clip-path: var(--clip-poly03);opacity: 0.3;margin-inline: auto;}

	/* insulin-pump */
		.insulin-pump{padding-block: var(--row-gap140); background: url('../images/skin/insulin-pump.jpg') no-repeat center / cover;}

	/* advan-list */
		.advan-list{display: grid;grid: auto / repeat(3, 1fr);gap: var(--col-gap30);}
		.advan-list > li{position: relative;border: 1px solid var(--border-color01);border-radius: var(--radius-20);background: var(--point-white);padding: clamp(30px, 4vw, 40px) clamp(25px, 3vw, 30px);display: flex;flex-direction: column;}
		.advan-list .item-desc{text-align: center;display: grid;gap: var(--row-gap20);}
		.advan-list .item-desc dt{display: flex;align-items: center;justify-content: center;height: clamp(55px, 8.5vw, 80px);}
		.advan-list .item-desc dd{font-size: var(--text-26);font-weight: 600;color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;}
		.advan-list .cont{margin-top: clamp(15px, 2vw, 20px);padding-top: clamp(15px, 2vw, 20px);border-top: 1px solid var(--border-color01);display: flex;flex-direction: column;justify-content: space-between;gap: var(--row-gap20);flex-grow: 1;}
		.advan-list .bg-box{background: var(--point-color03);border-radius: var(--radius-10);padding: 20px;font-size: var(--text-18);font-weight: 500;color: var(--black-color00);line-height: 1.5;display: flex;flex-direction: column;gap: 8px;flex-grow: 1;}

		@media (max-width:1023px) {
			.advan-list{grid: auto / repeat(2, 1fr);}
		}
		@media (max-width:640px) {
			.advan-list{grid: auto / repeat(1, 1fr);}
		}

	/* detect-meta */
		.detect-meta{position: relative;padding-block: var(--row-gap140);clip-path: inset(0);}
		.detect-meta::before{position: fixed;content:'';top:0;left:0;width: 100%;height: 100dvh;background: url('../images/skin/detect-meta.jpg') no-repeat center / cover;}
		.detect-meta .w_custom{display: flex;align-items: flex-start;gap: var(--row-gap50);}
		.detect-meta .main-title{position: sticky;top: 138px;filter: var(--filter-white);width: 100%; margin-bottom: 0;}
		.detect-meta .step-list{width: min(770px, 55%);counter-reset: step-list;flex-shrink: 0;display: grid;gap: clamp(15px, 10vw, 100px);}
		.detect-meta .step-list > li{padding: clamp(25px, 5vw, 50px);padding-bottom: clamp(50px, 7vw, 70px);border-radius: var(--radius-20);background: var(--point-white);width: 100%;max-width: 420px;min-height: 400px;display: flex;flex-direction: column;flex-wrap: wrap;gap: var(--row-gap20);}
			.detect-meta .step-list > li::before{content: counter(step-list, decimal-leading-zero);counter-increment: step-list;min-width: clamp(36px, 5.5vw, 50px);min-height: clamp(36px, 5.5vw, 50px);border-radius: clamp(40px, 5.5vw, 50px);background: var(--point-color04);display: flex;width: fit-content;align-items: center;justify-content: center;text-align: center;font-size: var(--text-22);color: var(--point-white);line-height: 1.2;padding: 5px;font-family: var(--font-type02);}
			.detect-meta .step-list > li:nth-child(2n){margin-left:auto;}
		.detect-meta .step-list .desc{display: grid;gap: var(--row-gap30);}
		.detect-meta .step-list .desc dt{font-size: var(--text-26);font-weight: 600;color: var(--black-color03);line-height: 1.5;letter-spacing: -0.04em;}
		.detect-meta .step-list .desc dd{font-size: var(--text-20);line-height: 1.5;color: var(--black-color03);}
		.detect-meta .bullet-list > li{font-size: inherit;font-weight: inherit;color: inherit;line-height: inherit;}
		
		@media (max-width:1023px) {
			.detect-meta .w_custom{flex-wrap: wrap;}
			.detect-meta .main-title{position: relative; inset: auto;}
			.detect-meta .step-list{width: 100%;grid: auto / repeat(2, 1fr);gap: clamp(15px, 2vw, 20px);}
			.detect-meta .step-list > li{max-width:100%; min-height:auto;}
		}
		@media (max-width:640px) {
			.detect-meta .step-list{grid: auto / repeat(1, 1fr);}
		}

	/* com-tab */
		.com-tab{background: var(--point-white);width: fit-content;border: 1px solid var(--border-color01);border-radius: 50px;padding:5px;display: flex;margin: 0 auto var(--row-gap60);}
		.com-tab > li{display: flex;align-items: center;justify-content: center;text-align: center;min-width: clamp(150px, 27vw, 260px);font-size: var(--text-22);color: var(--black-color03);padding: clamp(11px, 1.7vw, 12px) 15px;letter-spacing: -0.04em;border-radius: inherit;cursor: pointer; transition: all 0.4s;}
		.com-tab > li.on{background: var(--point-color01);color: var(--point-white);font-weight: 500;}

		.tab-cont{background: var(--point-color03);padding: 73px clamp(50px, 5.3vw, 100px);min-height: 800px;border-radius: var(--radius-20);display: flex;flex-direction: column;justify-content: center;}
		.tab-cont > .item{transition: all 0.4s;}
		.tab-cont > .item:not(.on){opacity: 0; height: 0; overflow: hidden;}

			/* over */
			@media (hover:hover) and (pointer:fine) {
				.com-tab > li:not(.on):hover{background: var(--point-color01);color: var(--point-white);}
			}

		@media (max-width:1023px) {
			.tab-cont{padding: clamp(25px, 7.3vw, 73px); min-height: auto;}
		}
		@media (max-width:479px) {
			.com-tab{width: 100%;}
			.com-tab > li{width: 100%; min-width: auto;}
		}

	/* device-list */
		.device-list{display: grid; grid: auto / repeat(3, 1fr); gap: clamp(15px, 1.1vw, 21px);}
		.device-list > li{position: relative; background: var(--point-white); padding:clamp(20px, 2.4vw, 24px); border-radius: var(--radius-20);}
		.device-list .desc{display: flex;gap: 8px;flex-direction: column;justify-content: space-between;height: 100%;}
		.device-list .desc dt{font-size: var(--text-22); font-weight: 500; color: var(--black-color00); line-height: 1.4; letter-spacing: -0.04em;}
		.device-list .desc dd{margin-left: auto;display: flex;align-items: center;height: clamp(43px, 6.9vw, 64px);}

		@media (max-width:479px) {
			.device-list{grid: auto / repeat(1, 1fr);}
		}
		
	/* insulin_bnr */
		.insulin-bnr{position: relative;background: var(--black-color06);min-height: clamp(350px, 50vw, 500px);padding-block: var(--row-gap100);color: var(--point-white);display: flex;flex-direction: column;justify-content: center;}
		.insulin-bnr .title{text-align: center;display: grid;gap: var(--row-gap30);text-wrap: balance;}
		.insulin-bnr .title h3{font-size: var(--text-22);font-weight: 500;font-family: var(--font-type02);line-height: 1.4;letter-spacing: -0.02em;} 
		.insulin-bnr .title h4{font-size: var(--text-54);font-weight: 600;line-height: 1.3;letter-spacing: -0.03em;} 
		.insulin-bnr .title h5{font-size: var(--text-22);font-weight: 300;line-height: 1.6;letter-spacing: -0.02em;} 

	/* inquiry-form */
		.inquiry-form{background: url('../images/skin/inquiry-form.png') no-repeat left 133% / cover;padding-bottom:var(--row-gap100);}
		.inquiry-form .w_custom{display: flex;align-items: flex-start;gap: var(--row-gap50) clamp(50px, 7.3vw, 140px);}
		.inquiry-form .info{position: relative;width: clamp(350px, 32vw, 450px);flex-shrink: 0;display: flex;flex-direction: column;gap: var(--row-gap40);}
		.inquiry-form .table-box{width: 100%;}
		.inquiry-form form{display: block; width: 100%;}

	/* 문의하기 */
		#wrap .bbs_write{position: relative; display: block; width: 100%;}
		#wrap .bbs_write :where(tbody, tr, th, td){display: block; width: 100%; background: none; border:0; padding:0;}
		#wrap .bbs_write tbody{display: flex;flex-wrap: wrap;gap: clamp(15px, 2vw, 20px) 10px;}
		#wrap .bbs_write tr{display: flex;align-items: baseline;gap: clamp(15px, 2vw, 20px);width: calc(100% / 2 - 5px);border: 1px solid var(--border-color01);border-radius: var(--radius-06);padding: clamp(15px, 2vw, 20px);background: var(--point-white);}
		#wrap .bbs_write tr:has(#email, #contents, #captcha){width: 100%;}
		#wrap .bbs_write tr:has(#captcha){padding-block:15px;}
		#wrap .bbs_write th{width: auto;min-width: clamp(60px, 9vw, 80px);flex-shrink: 0;font-size: var(--text-20);font-weight: 500;color: var(--black-color01);line-height: 1.4;}
		#wrap .bbs_write th em{font-weight: inherit; color: var(--point-color01);}
		#wrap .bbs_write th label{font-size: inherit; font-weight: inherit; color: inherit;}
		#wrap .bbs_write td{display: flex;flex-wrap: wrap;gap: 12px 10px;}
		#wrap .bbs_write :where([type="text"], [type="password"], textarea){border:0;height: auto;vertical-align: top;width: 100%;padding: 0;}
		#wrap .bbs_write textarea{height: clamp(100px, 12vw, 116px);}
		#wrap .bbs_write td:has(.controller){flex-wrap: nowrap;column-gap: clamp(15px, 2vw, 20px);}
		#wrap .bbs_write .controller{display: flex;align-items: center;gap: 10px;}
		#wrap .bbs_write #captcha_box{height: clamp(36px, 4.5vw, 40px);aspect-ratio: 3.9 auto;overflow: hidden;border: 1px solid var(--border-color01);border-radius: 4px;margin: 0;}
		#wrap .bbs_write #captcha_box img{width: calc(100% + 2px) !important;height: calc(100% + 2px) !important;max-width: none;max-height: none;object-fit: cover;margin: -1px 0 0 -1px;}
		#wrap .bbs_write #refreshCode{font-size: 0;background: url('../images/skin/refreshCode.svg') no-repeat center / clamp(14px, 2.1vw, 16px);width: clamp(36px, 4.5vw, 40px);aspect-ratio: auto 1;border: 1px solid var(--black-color01);border-radius: 4px;cursor: pointer;}
		#wrap .policy-box{margin-top: clamp(15px, 4vw, 40px);display: flex;align-items: flex-start;justify-content: space-between;flex-wrap: wrap;gap: 30px;font-size: var(--text-20);color: var(--black-color06);line-height: 1.4;letter-spacing: -0.05em;}
		#wrap .policy-box .com-btn{min-width: clamp(120px, 19vw, 180px);line-height: 1.3;font-size: var(--text-22);}
		#wrap .policy-box .utility{display: flex;flex-direction: column;gap: var(--row-gap20);align-items: flex-end;text-align: right;}
		#wrap .policy-box label:has([type="checkbox"]){font-size: var(--text-20);}

		@media (max-width:1023px) {
			.inquiry-form .w_custom{flex-wrap: wrap;}
			.inquiry-form .info{width: 100%; flex-shrink: unset;}
			#wrap .policy-box .utility{width: 100%;}
		}
		@media (max-width:479px) {
			#wrap .bbs_write tr{width: 100%;}
			#wrap .bbs_write td:has(.controller){flex-wrap: wrap;}
		}

	/* 인풋 */
		#wrap :where([type="text"], [type="password"], textarea){font-size: var(--text-20);font-weight: 400;color: var(--black-color01);height: clamp(42px, 7vw, 60px);border: 1px solid var(--border-color01);padding: 0 clamp(15px, 2vw, 20px);background: var(--point-white);line-height: normal;min-width: auto;border-radius: var(--radius-06);overflow: hidden;text-overflow:ellipsis;white-space:nowrap;}
		#wrap :where([type="text"], [type="password"], textarea)::placeholder{color: var(--black-color10);}
		#wrap textarea{width: 100%; overflow: visible; text-overflow: unset; white-space: unset; resize: none; padding: clamp(15px, 2vw, 20px);}

		#wrap [type="checkbox"]{display: inline-flex;align-items: center;justify-content: center;width: clamp(20px, 3.3vw, 28px);height: clamp(20px, 3.3vw, 28px);border-radius: clamp(2px, 0.4vw, 4px);border: 1px solid var(--black-color06);background: var(--point-white);flex-shrink: 0;transition: all 0.4s;cursor: pointer;}
			#wrap [type="checkbox"]::before{display: inline-flex;content:'';width: 18px;aspect-ratio: auto 1.5;background: url('../images/skin/chk_box.svg') no-repeat center / clamp(12px, 2.3vw, 18px) auto;opacity: 0;transition: all 0.4s;}
			#wrap [type="checkbox"]:checked{border-color: var(--point-white);}
			#wrap [type="checkbox"]:checked:before{opacity:1;}
		#wrap label:has([type="checkbox"]){display: inline-flex;align-items: flex-start;gap: clamp(10px, 1.4vw, 14px);line-height: clamp(20px, 3.3vw, 28px);font-size: var(--text-14);font-weight: 500;color: var(--black-color03);letter-spacing: -0.05em; cursor: pointer;}

/*───────────────────────────────────────────────────────────

    FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
	#footer{position: relative;padding-block: var(--row-gap80) var(--row-gap70);font-size: var(--text-16);font-weight: 400;color: var(--black-color06);line-height: 1.4;border-top: 1px solid var(--border-color03);margin-top: var(--row-gap50);}
	#footer .w_custom{display: grid;gap: var(--row-gap60);}
	#footer .cont{display: flex;align-items: flex-start;justify-content: space-between;flex-wrap: wrap;gap: 30px;}
	#footer .logo{display: flex;max-width: clamp(112px, 17.8vw, 168px);}
	#footer .ftr-title{display: flex;flex-direction: column;gap: var(--row-gap40);}
	#footer .ftr-title h6{font-size: var(--text-20);font-weight: 500;color: var(--black-color03);line-height: 1.8;letter-spacing: -0.03em;}
	#footer .addr-list{display: flex;flex-direction: column;gap: var(--row-gap20);}
	#footer .addr-list > li{display: flex;flex-wrap: wrap;gap: var(--row-gap20) clamp(25px, 3.2vw, 60px);}
	#footer .addr-list .desc{display: flex;align-items: baseline;gap: clamp(12px, 1.6vw, 16px);letter-spacing: 0;}
	#footer .addr-list .desc dt{font-size: var(--text-17);color: var(--black-color03);flex-shrink: 0;}
	#footer .addr-list .desc dd{d:0;}
	#footer .info{background: var(--gray-bg04);padding: clamp(20px, 3vw, 25px) clamp(20px, 2.1vw, 40px);display: flex;align-items: center;justify-content: space-between;gap: 12px 30px;flex-wrap: wrap;border-radius: var(--radius-10);}
	#footer .link-list{display: flex;flex-wrap: wrap;gap: 10px clamp(25px, 4vw, 40px);}
	#footer .link-list > li{font-size: var(--text-17);letter-spacing: 0;}
	#footer .link-list strong{font-weight:500;color: var(--black-color03);}
	#footer .copy{opacity: 0.6;font-family: var(--font-type02);letter-spacing: 0;}

	.quick-box{position: fixed;left: 50%;bottom: clamp(15px, 5vw, 50px);z-index: 50;max-width: 1800px;translate: -50%;display: flex;flex-direction: column;align-items: flex-end;pointer-events: none;opacity: 0;transition: all 0.4s;}
	.quick-box a{display: flex;align-items: center;justify-content: center;width: clamp(36px, 5vw, 50px);height: clamp(36px, 5vw, 50px);background: var(--black-color03);border-radius: 100%;box-shadow: var(--shadow-01);padding: 10px;}

		body:has(#header.on:not(.end)) .quick-box{opacity: 1;}
		body:has(#header.on:not(.end)) .quick-box a{pointer-events: auto;}