@charset "utf-8";


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

    공통

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


    #wrap:has(.atopy_ecz) .nav_title { padding-block: 76px 79px; }


    .num_list {counter-reset: num 0;font-size: var(--title-20);}
    .num_list > li {position: relative;color: var(--black-color02);font-weight: 300;letter-spacing: -0.03em;line-height: 1.77;font-size: max(16px ,95%);box-sizing: border-box;}
    .num_list > li strong { font-weight: 700; color:var(--black-color00)}
    .num_list > li:not(.non_num) { padding-left: 49px; }
    .num_list > li:not(.non_num)::before {position: absolute;left: 0;top: -3px;display: flex;justify-content: center;align-items: center;width: 36px;height: 36px;border-radius: 100%;content: counter(num);counter-increment: num 1;background: var(--point-color14);color: var(--point-white);font-size: max(14px, var(--title-17));font-weight: 500;line-height: 1.77;letter-spacing: -0.03em;}
    .num_list > li + li { margin-top: 19px; }
    .num_list > li.non_num { margin-top: 16px; }
    .num_list > li em.bk{display: block;margin-top: 15px;font-weight: inherit;}
    .num_list > li em.bk:has(strong){margin-top: 25px;}

    .sec_banner {display: block;text-align: center;width: 100%;box-sizing: border-box;padding: 30px;background: var(--point-color03);font-size: var(--title-20);}
    .sec_banner strong {color: var(--black-color02);font-size: max(16px, 95%);font-weight: 600;letter-spacing: -0.03em;line-height: 1.67;}
        .sec_banner.left{text-align: left;}
        .sec_banner p + p{margin-top: 15px;}
        .sec_banner.pt02{background: var(--point-color09);}
    .sec_banner02 { background: var(--point-color02); }

    .img_wrap.img_flex { display: flex; gap: 20px; box-sizing: border-box; }
    .img_wrap{text-align: center;}
    .img_txt{display: flex; align-items: flex-start; gap: 30px 0;}
    .img_txt .thumb{width: 45%;}
    .img_txt .sub_title{width: 55%; padding-left: 30px;}

    .faq_sec .sub_title h4::before { display: none; }
    .faq_sec .sub_faq { counter-reset: faq_num 0; }
    .faq_sec .sub_faq li { border: 1px solid var(--border-color02); }
    .faq_sec .sub_faq li + li { border-top: 0; }
    .faq_sec .sub_faq .question {position: relative;box-sizing: border-box;padding-inline: 30px 70px;padding-block: 30px;cursor: pointer;transition: all 0.4s;}
        .faq_sec .sub_faq .question:after{position: absolute;content:'';top: 44%;right: 32px;width: 12px;aspect-ratio: auto 1;border: 2px solid var(--black-color00);box-sizing: border-box;clip-path: polygon(100% 0, 0 100%, 100% 100%);translate: 0 -50%;rotate: 45deg;transition: all 0.4s;}
        .faq_sec .sub_faq li:not(.on) .question:after{top: 54%;scale: -1 -1;}
    .faq_sec .sub_faq .question p { position: relative; color: var(--black-color03); font-weight: 600; font-size: var(--title-18); letter-spacing: -0.03em; line-height: 1; }
        .faq_sec .sub_faq li:not(.on) .question p{color: var(--black-color00);}
        .faq_sec .sub_faq .question p::before { content: counter(faq_num) '.'; counter-increment: faq_num 1; display: inline-block; margin-right: 3px; position: relative; color: inherit; font-size: inherit; font-weight: inherit; }
    .faq_sec .sub_faq .answer { box-sizing: border-box; padding-inline: 30px; padding-block: 30px; border-top: 1px solid var(--border-color02); }
    .faq_sec .sub_faq .answer .flex_des { display: flex; align-items: center; gap: 15px; }
    .faq_sec .sub_faq .answer .profile { display: inline-flex; justify-content: center; align-items: flex-end; width: 100px; height: 100px; box-sizing: border-box; padding: 10px 10px 0; background: var(--point-color10); border-radius: 100%; overflow: hidden; flex-shrink: 0; }
    .faq_sec .sub_faq .answer p { color: var(--black-color02); font-weight: 300; font-size: max(14px, var(--title-17)); line-height: 1.77; letter-spacing: -0.03em; }

    .faq_sec .sub_faq .on .question { background: var(--point-color02); }

    .sub_title .acc { font-size: var(--title-18); }

    @media screen and (max-width: 1500px){
        .faq_sec .sub_faq .answer br.for_pc{display: none;}
    }
    @media screen and (max-width: 1023px){
        .num_list > li + li { margin-top: clamp(15px, 1.9vw, 19px); }
        .num_list > li.non_num {margin-top: clamp(10px, 1.6vw, 16px);}
        .sec_banner { padding: clamp(15px, 3vw, 30px); }
        .faq_sec .sub_faq .question { padding-inline: clamp(15px, 3vw, 30px) clamp(45px, 7vw, 70px); padding-block: clamp(15px, 3vw, 30px); }
        .faq_sec .sub_faq .question:after{right: clamp(17px, 3.2vw, 32px); width: clamp(10px, 1.5vw, 12px);}
        .faq_sec .sub_faq .answer { padding-inline: clamp(15px, 3vw, 30px); padding-block: clamp(15px, 3vw, 30px); }
        .faq_sec .sub_faq .answer .flex_des { gap: clamp(10px, 1.5vw, 15px); }

        .img_wrap.img_flex { gap: clamp(15px, 2vw, 20px); }

    }

    @media screen and (max-width: 860px){
        .num_list > li:not(.non_num)::before { width: 32px; height: 32px; }
        .num_list > li:not(.non_num) { padding-left: 45px; }

        .faq_sec .sub_faq .answer .profile { width: 90px; height: 90px; }
    }

    @media screen and (max-width: 640px){
        .num_list > li:not(.non_num)::before { width: 28px; height: 28px; top: -2px; }
        .num_list > li:not(.non_num) { padding-left: 40px; }
        .faq_sec .sub_faq .answer .profile { width: 80px; height: 80px; }

        .img_txt{flex-wrap: wrap;}
        .img_txt .thumb{width: 100%;}
        .img_txt .sub_title{width: 100%; padding-left: 0;}
    }

    @media screen and (max-width: 479px){
        .num_list > li:not(.non_num)::before { width: 24px; height: 24px; top: 0; }
        .num_list > li:not(.non_num) { padding-left: 35px; }
        .faq_sec .sub_faq .answer .profile { width: 70px; height: 70px; }
    }


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

    atopy

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

    .atopy_com .non_num::before { display: none; }


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

    화폐상습진

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

    .atopy_ecz .sticky_wrap .sec_item .sub_title h4::before { display: none; }

    .atopy_ecz .ecz_sec02 p:has(strong) { margin-top: -4px; }
    .atopy_ecz .sticky_wrap .sec_item:nth-child(3):before { background: var(--point-color03); }
    .atopy_ecz .sticky_wrap .sec_item:nth-child(4):before { background: var(--point-color01); }


    .atopy_ecz .sec_banner02 { margin-top: 2px; }

    .atopy_ecz .table_wrap > span { display: none; margin-bottom: 10px; font-size: max(14px, var(--title-17)); font-weight: 400; color: var(--black-color03); }
    .atopy_ecz table { font-size: var(--title-20); }
    .atopy_ecz table thead th { background: var(--point-color04); border: solid var(--border-color02); border-width: 1px 1px 1px 0; padding-block: 30px 20px; padding-inline: 30px; color: var(--black-color03); font-weight: 600; font-size: 110%; }
    .atopy_ecz table thead th:first-child { border-left: 1px solid var(--border-color02); }
    .atopy_ecz table thead th p { font-size: inherit; font-weight: inherit; color: inherit; margin-top: 10px; }
    .atopy_ecz table tbody :where(th, td) { padding-inline: 30px; text-align: center; }
    .atopy_ecz table tbody tr:nth-child(1) :where(th, td) { padding-block: 16px 15px; }
    .atopy_ecz table tbody tr:nth-child(2) :where(th, td) { padding-block: 20px 18px; }
    .atopy_ecz table tbody tr:nth-child(2) td { line-height: 1.45; }
    .atopy_ecz table tbody th { color: var(--black-color03); font-weight: 500; font-size: var(--title-20); letter-spacing: -0.03em; background: var(--point-color07); border: solid var(--border-color02); border-width: 0 1px 1px 1px; }
    .atopy_ecz table tbody td { background: var(--point-color01); color: var(--black-color03); font-weight: 400; font-size: var(--title-18); letter-spacing: -0.03em; border: solid var(--border-color02); border-width: 0 1px 1px 0; }
    .atopy_ecz table tbody tr:last-child { border-bottom: 1px solid var(--border-color02); }
    


    @media screen and (max-width: 1185px){
        .atopy_ecz .ecz_sec02 br.del { display: none; }
    }

    @media screen and (max-width: 1023px){
        .atopy_ecz table thead th { padding-block: clamp(15px, 3vw, 30px) clamp(15px, 2vw, 20px); padding-inline: clamp(15px, 3vw, 30px); }
        .atopy_ecz table tbody tr:nth-child(1) :where(th, td) { padding-block: clamp(10px, 1.6vw, 16px) clamp(10px, 1.5vw, 15px); }
        .atopy_ecz table tbody tr:nth-child(2) :where(th, td) { padding-block: clamp(10px, 2vw, 20px) clamp(10px, 1.8vw, 18px); }
        .atopy_ecz table tbody :where(th, td) { padding-inline: clamp(15px, 3vw, 30px); }
    }
    @media screen and (max-width: 479px){
        .atopy_com .img_wrap.img_flex { flex-direction: column; width: 100%; }
        .atopy_ecz .img_wrap.img_flex .img:nth-child(1) { width: 100%; }
        .atopy_ecz .img_wrap.img_flex .img:nth-child(2) { width: 100%; }
        .atopy_ecz .table_wrap span { display: block; }
    }


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

    한포진

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

    .atopy_herp .ico_wrap { padding-block: 31px 30px; padding-inline: 30px; background: var(--point-color02); }
    .atopy_herp .ico_wrap strong { display:block; text-align: center; color: var(--black-color02); font-size: var(--title-20); font-weight: 500; line-height: 1.5; letter-spacing: -0.03em; }
    .atopy_herp .ico_wrap ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 50px; margin-top: 30px; }
    .atopy_herp .ico_wrap li .ico_box { border-radius: 100%; overflow: hidden; box-sizing: border-box; }
    .atopy_herp .ico_wrap li span { display: block; color: var(--black-color02); font-weight: 500; font-size: var(--title-18); letter-spacing: -0.03em; line-height: 1.67; text-align: center; margin-top: 11px; }
    .atopy_herp .ico_wrap li em { display: block; color: var(--point-color16); font-weight: 500; font-size: var(--title-16); letter-spacing: -0.03em; line-height: 1.88; text-align: center; margin-top: 5px;}



    @media screen and (max-width: 1220px){
        .atopy_herp .ico_wrap li .ico_box { width: 130px; height: 130px; }
        .atopy_herp .ico_wrap ul { gap: 20px 30px; }
    }

    @media screen and (max-width: 1023px){
        .atopy_herp .ico_wrap { padding-block: clamp(20px, 3vw, 31px) clamp(20px, 3vw, 30px); padding-inline: clamp(20px, 3vw, 30px); }
        .atopy_herp .ico_wrap ul { gap: 20px clamp(20px, 5vw, 50px); }
        .atopy_herp .ico_wrap ul > li { width: calc(100% / 2 - clamp(20px, 5vw, 50px)) }
        .atopy_herp .ico_wrap li .ico_box { margin-inline: auto; }
        .atopy_herp .ico_wrap li span { margin-top: clamp(7px, 1vw, 10px); }
    }

    @media screen and (max-width: 860px){
        .atopy_herp .ico_wrap li .ico_box { width: 120px; height: 120px; }
    }

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

    @media screen and (max-width: 570px){
        .atopy_herp br.del { display: none; }
    }

    @media screen and (max-width: 479px){
        .atopy_herp .img_wrap { width: 100%; }
    }

    @media screen and (max-width: 350px){
        .atopy_herp .ico_wrap ul > li { width: 100%; }
    }

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

    아토피 피부염

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

    .atopy_derma { counter-reset: alpha; }
    .atopy_derma .sticky_wrap .sec_item:nth-child(3):before { background: var(--point-color03); }
    .atopy_derma .sticky_wrap .sec_item:nth-child(4):before { background: var(--point-color02); }
    .atopy_derma .sticky_wrap .sec_item:nth-child(5):before { background: var(--point-color01); }

    .atopy_derma .alpha strong { display: flex; gap: 14px; color: var(--black-color02); font-weight: 700; font-size: 160%; line-height: 1; letter-spacing: -0.03em; }
    .atopy_derma .circle_list { display: flex; flex-wrap: wrap; gap: 16px; }
    .atopy_derma .circle_list > li { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; text-align: center; box-sizing: border-box; min-height: 120px; padding-block: 15px; padding-inline: 15px; border-radius: 60px; }
    .atopy_derma .circle_list > li span { color: var(--black-color02); font-weight: 500; font-size: var(--title-20); line-height: 1.5; letter-spacing: -0.03em; }
    .atopy_derma .circle_list > li small { color: var(--black-color02); font-weight: 400; font-size: var(--title-18); line-height: 1.34; letter-spacing: -0.03em; }
    .atopy_derma .circle_list.circle01 > li { width: calc(100% / 3 - 10.67px); }
    .atopy_derma .circle_list.circle01 > li:nth-child(odd) { background: var(--point-color03); }
    .atopy_derma .circle_list.circle01 > li:nth-child(even) { background: var(--point-color07); }
    .atopy_derma .circle_list.circle02 > li { width: calc(100% / 4 - 12px); }
    .atopy_derma .circle_list.circle02 > :where(li:nth-child(1), li:nth-child(3), li:nth-child(6), li:nth-child(8)) { background: var(--point-color03); }
    .atopy_derma .circle_list.circle02 > li:not(:where(li:nth-child(1), li:nth-child(3), li:nth-child(6), li:nth-child(8))) { background: var(--point-color07); }

    .atopy_derma .img_grid { display: grid; gap: 10px; justify-content: start; max-width: 930px; width: 100%; }
    .atopy_derma .img_grid .img img { width: 100%; height: 100%; object-fit: cover; }
    .atopy_derma .img_grid .img:nth-child(1) { grid-column: 1; grid-row: 1; width: 100%; height: 100%; }
    .atopy_derma .img_grid .img:nth-child(2) { grid-column: 1; grid-row: 2; width: 100%; height: 100%;  }
    .atopy_derma .img_grid .img:nth-child(3) { grid-column: 2; grid-row: span 2; width: 100%; height: 100%; }

    .atopy_derma .img_flex03 { display: flex; box-sizing: border-box; width: 100%; max-width: 920px; }
    .atopy_derma .img_flex03 .img_box { font-size: var(--title-20); display: flex; flex-direction: column; justify-content: center; align-items: center; box-sizing: border-box; width: 50%; background: var(--point-color02); padding-block: 38px 20px; padding-inline: 15px;  }
    .atopy_derma .img_flex03 .img_box strong { display: block; text-align: center; color: var(--black-color02); font-weight: 600; font-size: 120%; line-height: 1.25; letter-spacing: -0.03em; margin-top: 20px; }

    .atopy_derma .img_box { display: flex; flex-direction: column; gap: 10px; max-width: 750px;  }
    .atopy_derma .img_box .img_wrap { width: 100%; }
    .atopy_derma .img_wrap.img_flex { gap: 10px; width: 100%; }
    .atopy_derma .img_wrap.img_flex .img img { display: block; width: 100%; height: 100%; object-fit: cover; }
    .atopy_derma .img_wrap.img_flex .img:nth-child(1) { width: 50%; }
    .atopy_derma .img_wrap.img_flex .img:nth-child(2) { width: calc(50% - 10px); }

    .atopy_derma .img_wrap.img_flex02 { display: flex; gap: 10px; width: 100%; }
    .atopy_derma .img_wrap.img_flex02 .img img { display: block; width: 100%; height: 100%; object-fit: cover; }
    .atopy_derma .img_wrap.img_flex02 .img:nth-child(1) { width: 33.33%; }
    .atopy_derma .img_wrap.img_flex02 .img:nth-child(2) { width: calc(66.66% - 10px); }

    .atopy_derma .has_desc p { color: var(--black-color02); font-size: max(14px, var(--title-17)); font-weight: 300; letter-spacing: -0.03em; line-height: 1.77; margin-top: 36px; }

    @media screen and (max-width: 1400px){
        .atopy_derma .circle_list.circle02 > li { width: calc(100% / 3 - 10.67px); }
        .atopy_derma .circle_list.circle02 > li:nth-child(odd) { background: var(--point-color03); }
        .atopy_derma .circle_list.circle02 > li:nth-child(even) { background: var(--point-color07); }
    }

    @media screen and (max-width: 1023px){
        .atopy_derma .circle_list > li { min-height: clamp(90px, 12vw, 120px); }
        .atopy_derma .alpha strong { font-size: 150%; gap: clamp(10px, 1.4vw, 14px); }
        .atopy_derma .img_flex03 .img_box { padding-block: clamp(20px, 3.8vw, 38px) 20px; padding-inline: clamp(10px, 1.5vw, 15px); }
        .atopy_derma .img_flex03 .img_box strong { margin-top: clamp(15px, 2vw, 20px); }
        .atopy_derma .has_desc p { margin-top: clamp(20px, 3.6vw, 36px); }
    }

    @media screen and (max-width: 860px){
        .atopy_derma .alpha strong { font-size: 140%; }
        .atopy_derma .img_flex03 .img_box strong { font-size: 110%; }
    }

    @media screen and (max-width: 640px){
        .atopy_derma .alpha strong { font-size: 130%; }
        .atopy_derma .circle_list.circle01 > li { width: calc(100% / 2 - 8px); }
        .atopy_derma .circle_list.circle02 > li { width: calc(100% / 2 - 8px); }
        .atopy_derma .has_desc .img { width: 25%; }
        .atopy_derma .img_grid{display: flex; flex-direction: column; gap: 10px;}

    }

    @media screen and (max-width: 479px){
        .atopy_derma .circle_list > li { border-radius: 20px; }
        .atopy_derma .alpha strong { font-size: 120%; }
        .atopy_derma .img_wrap.img_flex { flex-direction: row; }
        .atopy_derma .img_flex03 .img_box strong { font-size: 100%; }
    }

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

    아토피 3징후

───────────────────────────────────────────────────────────*/
    .nav_title big { color: var(--black-color02); font-weight: 700; font-size: 200%; letter-spacing: -0.03em; line-height: 1; }
    .atopy_three .sticky_wrap .sec_item:nth-child(3):before { background: var(--point-color02); }
    .atopy_three .sticky_wrap .sec_item:nth-child(4):before { background: var(--point-color01); }
    .atopy_three .sticky_wrap .sec_item:nth-child(5):before { background: var(--point-color03); }
    .atopy_three .sticky_wrap .sec_item:nth-child(6):before { background: var(--point-color02); }
    .atopy_three .sticky_wrap .sec_item:has(+ .non_space_sec) { padding-block: 120px 0; }


    .atopy_three .graph_wrap { box-sizing: border-box; padding-block: 28px 25px; padding-inline: 30px; background: var(--point-white); }
    .atopy_three .graph_wrap .img { width: fit-content; margin-inline: auto; }

    .atopy_three .graph_wrap .txt { display: flex; justify-content: center; align-items: center; box-sizing: border-box; padding-block: 19px; padding-inline: 15px; border: 1px solid var(--border-color01); margin-top: 20px; }
    .atopy_three .graph_wrap .txt ul { display: flex; flex-wrap: wrap; gap: 30px; }
    .atopy_three .graph_wrap .txt span { display: flex; align-items: center; gap: 19px; color: var(--black-color02); font-weight: 400; font-size: max(14px, var(--title-17)); letter-spacing: -0.03em; line-height: 1.77; }
    .atopy_three .graph_wrap .txt span::before { content: ''; width: 40px; height: 4px; box-sizing: border-box; flex-shrink: 0; }
    .atopy_three .graph_wrap .txt li:nth-child(1) span{color:var(--point-color12);}
    .atopy_three .graph_wrap .txt li:nth-child(1) span::before { background: var(--point-color12); }
    .atopy_three .graph_wrap .txt li:nth-child(2) span {color:#115aba; }
    .atopy_three .graph_wrap .txt li:nth-child(2) span::before { border-bottom: 4px dashed #115aba; }
    .atopy_three .graph_wrap .txt li:nth-child(3) span{color: #239123;}
    .atopy_three .graph_wrap .txt li:nth-child(3) span::before { border-bottom: 4px dashed #239123; }

    .atopy_three .graph_title h6 { position: relative; display: flex; align-items: center; gap: 20px; }
    .atopy_three .graph_title h6::before { content: ''; position: relative; display: block; width: 40px; height: 4px; box-sizing: border-box; flex-shrink: 0; }
    .atopy_three .graph_title .red_gra::before { background: var(--point-color12); }
    .atopy_three .graph_title .blue_gra::before { border-bottom: 4px dashed #115aba; }
    .atopy_three .graph_title .green_gra::before { border-bottom: 4px dashed #239123; }
    .atopy_three .graph_title .bullet_list { box-sizing: border-box; padding-left: 5px; gap: 4px; }
    .atopy_three .graph_title .bullet_list > li { gap: 7px; color: var(--black-color02); font-size: max(14px, var(--title-17)); font-weight: 300; letter-spacing: -0.03em; }
    .atopy_three .graph_title .bullet_list > li::before { background: var(--black-color02); width: 2px; height: 2px; translate: 0 -5px; }

    .atopy_three .event_tab { display: flex; }
    .atopy_three .event_tab .img_wrap { position: relative; width: 41.82%; box-sizing: border-box; border: 1px solid var(--border-color02); flex-shrink: 0; padding-inline: 15px; }
    .atopy_three .event_tab .img_wrap img { position: absolute; left: 0; top: 50%; transform: translateY(-50%); opacity: 0; transition: all 0.4s; }
    .atopy_three .sticky_wrap .event_tab .img_wrap img{margin:0;}
    .atopy_three .event_tab .img_wrap img.on { opacity: 1; }
    .atopy_three .event_tab dl {position: relative;box-sizing: border-box;padding-block: 30px;padding-inline: 30px 0;font-size: var(--title-20);}
    .atopy_three .event_tab dl::before { content: ''; position: absolute; left: 0; top: 0; width: 150%; height: 100%; box-sizing: border-box; border-top: 1px solid var(--border-color02); background: var(--point-color03); z-index: -1; transition: all 0.4s; }
    .atopy_three .event_tab dl:last-child::before { border-bottom: 1px solid var(--border-color02); }
    .atopy_three .event_tab dt {color: var(--black-color02);font-weight: 700;font-size: max(18px, 100%);line-height: 1;letter-spacing: -0.03em;}
    .atopy_three .event_tab dt em{font-weight: inherit; color: var(--point-color12);}
    .atopy_three .event_tab dt em.yel{color: var(--point-color15);}
    .atopy_three .event_tab dt em.grn{color: var(--point-color14);}
    .atopy_three .event_tab dt img{display: none;}
    .atopy_three .event_tab dd {color: var(--black-color02);font-weight: 300;font-size: max(16px, 80%);letter-spacing: -0.03em;line-height: 1.75;margin-top: 10px;}

    .atopy_three .event_tab dd strong { font-weight: 700; }

    .atopy_three .event_tab dl.on:before { background: var(--point-color02); }

		@media (hover: hover) and (pointer: fine){
			.atopy_three .event_tab dl:hover::before { background: var(--point-color02); }
		}

    @media screen and (max-width: 1545px){
        .atopy_three .event_tab dd br.del { display: none; }
    }

    @media screen and (max-width: 1500px){
        .atopy_three .event_tab dd br.for_pc { display: none; }
    }

    @media screen and (max-width: 1023px){
        .atopy_three .sticky_wrap .sec_item:has(+ .non_space_sec) { padding-block: clamp(70px, 12vw, 120px) 0; }
        .atopy_three .graph_wrap { padding-block: clamp(15px, 2.8vw, 28px) clamp(15px, 3vw, 30px); padding-inline: clamp(15px, 3vw, 30px); }
        
        .atopy_three .graph_wrap .txt { padding-block: clamp(12px, 1.9vw, 19px); padding-inline: clamp(10px, 1.5vw, 15px); }
        .atopy_three .graph_wrap .txt ul { gap: clamp(15px, 3vw, 30px); }
        .atopy_three .graph_wrap .txt span { gap: clamp(12px, 1.9vw, 19px); }
        .atopy_three .graph_wrap .txt span::before { width: clamp(25px, 4vw, 40px); }
        .atopy_three .graph_title h6 { gap: clamp(12px, 2vw, 20px); }
        .atopy_three .graph_title h6::before { width: clamp(25px, 4vw, 40px); }

        .atopy_three .event_tab .img_wrap { padding-inline: clamp(10px, 1.5vw, 15px); }
        .atopy_three .event_tab dl { padding-block: clamp(15px, 3vw, 30px); padding-inline: clamp(15px, 3vw, 30px) 0; }
        .atopy_three .event_tab dd { margin-top: clamp(7px, 1vw, 10px); }
    }

    @media screen and (max-width: 860px){
        .atopy_three .graph_wrap .txt span::before { height: 3px; }
        .atopy_three .graph_wrap .txt li:nth-child(2) span::before { border-width: 3px; }
        .atopy_three .graph_wrap .txt li:nth-child(3) span::before { border-width: 3px; }

        .atopy_three .graph_title h6::before { height: 3px; }
        .atopy_three .graph_title .blue_gra::before { border-width: 3px; }
        .atopy_three .graph_title .green_gra::before { border-width: 3px; }
    }

    @media screen and (max-width: 744px){
        .atopy_three br.del { display: none; }
    }

    @media screen and (max-width: 640px){
        .atopy_three .event_tab { flex-direction: column; }
        .atopy_three .event_tab .img_wrap { width: 100%; aspect-ratio: 1 / 1; display: none;}
        .atopy_three .event_tab .img_wrap img { left: 50%; transform: translate(-50%, -50%); }
        .atopy_three .event_tab dl {padding-inline: clamp(15px, 3vw, 30px);border-left: 1px solid var(--border-color02);border-right: 1px solid var(--border-color02);}
        .atopy_three .event_tab dl::before { width: 100%; background:none !important;}
        .atopy_three .event_tab dl:first-child::before {}
        .atopy_three .event_tab dl:not(:first-child) dd {}
        .atopy_three .event_tab dt img{display: block;margin-inline: auto;}
    }

    @media screen and (max-width: 479px){
        .atopy_three .graph_wrap .txt span::before { height: 2px; }
        .atopy_three .graph_wrap .txt li:nth-child(2) span::before { border-width: 2px; }
        .atopy_three .graph_wrap .txt li:nth-child(3) span::before { border-width: 2px; }

        .atopy_three .graph_title h6::before { height: 2px; }
        .atopy_three .graph_title .blue_gra::before { border-width: 2px; }
        .atopy_three .graph_title .green_gra::before { border-width: 2px; }

        .atopy_three .event_tab dd br.for_pc { display: none; }
    }

    @media screen and (max-width: 387px){
        .atopy_three .graph_wrap .txt ul { flex-direction: column; width: 100%; align-items: flex-start; }
    }

    @media (min-width:641px){
        .atopy_three .event_tab dd{display: block !important;}
    }

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

    만성 피부질환

───────────────────────────────────────────────────────────*/
    
    .chro_com .table_wrap { font-size: var(--title-20); }
    .chro_com .table_wrap > span { display: none; margin-bottom: 10px; font-size: max(14px, var(--title-17)); font-weight: 400; color: var(--black-color03); }
    .chro_com .table_wrap thead th { background: var(--point-color04); box-sizing: border-box; padding-block: 20px; padding-inline: 30px; color: var(--black-color02); font-weight: 600; font-size: 110%; letter-spacing: -0.03em; border: solid var(--border-color02); border-width: 1px 1px 1px 0; }
    .chro_com .table_wrap thead th:first-child { border-left: 1px solid var(--border-color02); }
    .chro_com .table_wrap tbody th { background: var(--point-color07); box-sizing: border-box; padding-block: 20px; padding-inline: 30px; color: var(--black-color03); font-weight: 500; font-size: 100%; letter-spacing: -0.03em; border: solid var(--border-color02); border-width: 0 1px 1px 1px; }
    .chro_com .table_wrap tbody td { background: var(--point-color01); box-sizing: border-box; padding-block: 20px; padding-inline: 22px; color: var(--black-color03); font-weight: 400; font-size: 90%; line-height: 1.45; letter-spacing: -0.03em; border: solid var(--border-color02); border-width: 0 1px 1px 0; text-align: center;}
    .chro_com .table_wrap tbody td:first-child { border-left: 1px solid var(--border-color02); }


    .chro_com .fw_700 { font-weight: 700; }

    @media screen and (max-width: 1023px){
        .chro_com .table_wrap thead th { padding-block: clamp(15px, 2vw, 20px); padding-inline: clamp(10px, 2.5vw, 30px); }
        .chro_com .table_wrap tbody th { padding-block: clamp(15px, 2vw, 20px); padding-inline: clamp(10px, 2.5vw, 30px); }
        .chro_com .table_wrap tbody td { padding-block: clamp(15px, 2vw, 20px); padding-inline: clamp(10px, 2.2vw, 22px); }
    }


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

    건선

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


    .chro_psor .sec_item:nth-child(2) .sub_title h4::before,
    .chro_psor .sec_item:nth-child(3) .sub_title h4::before,
    .chro_psor .sec_item:nth-child(4) .sub_title h4::before { display: none; }

    .chro_psor .img_grid { display: grid; justify-content: start; width: 100%; max-width: 550px; gap: 10px; }
    .chro_psor .img_grid .img img { width: 100%; height: 100%; object-fit: cover; }
    .chro_psor .img_grid .img:nth-child(1) { grid-column: 1; grid-row: 1; width: 100%; height: 100%; }
    .chro_psor .img_grid .img:nth-child(2) { grid-column: 2; grid-row: span 3; width: 100%; height: 100%;  }
    .chro_psor .img_grid .img:nth-child(3) { grid-column: 1; grid-row: 2; width: 100%; height: 100%; }
    
    .chro_psor .table_wrap tbody tr:nth-child(2) td { padding-inline: 20px; padding-block: 27px; }
    .chro_psor .table_wrap tbody td .bullet_list {color: inherit;font-size: inherit;font-weight: inherit;gap: 0;}
    .chro_psor .table_wrap tbody td .bullet_list li { gap: 7px; color: inherit; font-size: inherit; font-weight: inherit; letter-spacing: -0.03em; display: block;}
    .chro_psor .table_wrap tbody td .bullet_list li::before { width: 2px; height: 2px; background: var(--black-color03); translate: 0 -6px; margin-right: 7px;}
    
    .chro_psor .table_wrap02 tbody td { padding-inline: 28px; }

    

    @media screen and (max-width: 1023px){
        .chro_psor .table_wrap02 tbody td { padding-inline: clamp(10px, 2.5vw, 28px); }
    }

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


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

    두드러기

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

    


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

    지루성피부염

───────────────────────────────────────────────────────────*/
    
    .chro_derma .sec_item:not(:nth-child(3)) .sub_title h4::before { display: none; }
    .chro_derma .derma_case { counter-reset: derma_case 0; }
    .chro_derma .derma_case > li { display: flex; align-items: center; gap: 20px 40px; box-sizing: border-box; }
    .chro_derma .derma_case > li .img_box { flex-shrink: 0; width: 41.82%; }
    .chro_derma .derma_case > li + li { margin-top: 56px; padding-top: 56px; border-top: 1px solid var(--border-color01); }
    .chro_derma .derma_case dl { width: calc(58.18% - 40px); }
    .chro_derma .derma_case dt { position: relative; display: flex; align-items: flex-start; gap: 12px; color: var(--black-color02); font-weight: 600; font-size: var(--title-20); line-height: 1.5; letter-spacing: -0.03em; }
    .chro_derma .derma_case dt span { padding-top: 2px; }
    .chro_derma .derma_case dt::before { content: counter(derma_case); counter-increment: derma_case 1; display: flex; justify-content: center; align-items: center; width: 36px; height: 36px; flex-shrink: 0; color: var(--point-white); font-weight: 500; font-size: max(14px, var(--title-17)); letter-spacing: -0.03em; line-height: 1.77; border-radius: 100%; }
    .chro_derma .derma_case dd { margin-top: 20px; }
    .chro_derma .derma_case dd .bullet_list { box-sizing: border-box; padding-left: 5px; gap: 4px; }
    .chro_derma .derma_case dd .bullet_list > li { gap: 7px; color: var(--black-color02); font-size: max(14px, var(--title-17)); font-weight: 300; letter-spacing: -0.03em; }
    .chro_derma .derma_case dd .bullet_list > li::before { background: var(--black-color02); width: 2px; height: 2px; translate: 0 -5px; }
    .chro_derma .derma_case > li:nth-child(1) dt::before { background: var(--black-color08); }
    .chro_derma .derma_case > li:nth-child(2) dt::before { background: var(--black-color06); }
    .chro_derma .derma_case > li:nth-child(3) dt::before { background: var(--black-color03); }

    @media screen and (max-width: 1023px){
        .chro_derma .derma_case > li { gap: 20px clamp(20px, 4vw, 40px); }
        .chro_derma .derma_case > li + li { margin-top: clamp(20px, 5.6vw, 56px); padding-top: clamp(20px, 5.6vw, 56px); }
        .chro_derma .derma_case dl { width: calc(58.18% - clamp(20px, 4vw, 40px)); }
        .chro_derma .derma_case dt { gap: clamp(10px, 1.2vw, 12px); }
        .chro_derma .derma_case dd { margin-top: clamp(15px, 2vw, 20px); }
    }

    @media screen and (max-width: 860px){
        .chro_derma .derma_case dt::before { width: 32px; height: 32px; }
    }

    @media screen and (max-width: 640px){
        .chro_derma .derma_case dt::before { width: 28px; height: 28px; }
        .chro_derma .derma_case dt span { padding-top: 0; }
    }

    @media screen and (max-width: 479px){
        .chro_derma .img_wrap { width: 100%; }
        .chro_derma .img_wrap .img { width: 100%; }
        .chro_derma .img_flex { flex-direction: column;}
        .chro_derma .img_flex:not(.img_flex02) { gap: 3px; }
        .chro_derma .derma_case dt::before { width: 24px; height: 24px; }
        
        .chro_derma .derma_case > li { flex-direction: column; }
        .chro_derma .derma_case > li .img_box { width: 100%; }
        .chro_derma .derma_case dl { width: 100%; }
    }

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

    3C

───────────────────────────────────────────────────────────*/
    .threec_wrap .sticky_wrap .sec_item:nth-child(4):before { background: var(--point-color02); }
    .threec_wrap .sticky_wrap .sec_item:nth-child(3):before { background: var(--point-color03); }


    .threec_wrap .circle_wrap { position: relative; box-sizing: border-box; width: 100%; max-width: 560px; aspect-ratio: 1 / 0.96; }
    .threec_wrap .circle_wrap .circle_box { width: 100%; max-width: 420px; aspect-ratio: 1 auto; position: absolute; left: 50%; top: 56%; transform: translate(-50%, -50%); border-radius: 100%; font-size: var(--title-20); text-align: center; border: 1px solid var(--border-color01); border-radius: 100%; box-sizing: border-box; }
    .threec_wrap .circle_wrap .circle_box::before,
    .threec_wrap .circle_wrap .circle_box::after { content: ''; position: absolute; width: 10px; aspect-ratio: 1 auto; background: var(--border-color02); border-radius: 100%; transform: translateY(-50%); }
    .threec_wrap .circle_wrap .circle_box::before { left: 1.5%; top: 33.33%; }
    .threec_wrap .circle_wrap .circle_box::after { right: 1.5%; top: 33.33%; }

    .threec_wrap .circle_wrap .circle_box strong { display: flex; justify-content: center; align-items: center; border-radius: inherit; color: var(--black-color02); font-size: 130%; font-weight: 600; line-height: 1.39; letter-spacing: -0.03em; width: 100%; height: 100%; }
    .threec_wrap .circle_wrap .circle_box strong::before { content : ''; position: absolute; bottom: -1.5%; left: 50%; transform: translateX(-50%); width: 10px; aspect-ratio: 1 auto; background: var(--border-color02); border-radius: 100%; }
    .threec_wrap .circle_wrap ul { position: relative; display: flex; align-items: flex-start; flex-wrap: wrap; gap: 140px 160px; width: 100%; height: 100%; z-index: 2; }
    .threec_wrap .circle_wrap li { display: flex; justify-content: center; flex-shrink: 0; font-size: var(--title-20); text-align: center;  }
    .threec_wrap .circle_wrap li span { display: flex; justify-content: center; align-items: center; aspect-ratio: 1 auto; color: var(--black-color02); width: 100%; max-width: 200px;  font-weight: 500; font-size: 120%; line-height: 1.34; letter-spacing: -0.03em; border-radius: 100%; }
    .threec_wrap .circle_wrap li:nth-child(1) { width: 100%; }
    .threec_wrap .circle_wrap li:nth-child(2),
    .threec_wrap .circle_wrap li:nth-child(3) { width: calc(50% - 80px); }

    .threec_wrap .circle_wrap li:nth-child(1) span { margin-inline: auto; background: var(--point-color03); }
    .threec_wrap .circle_wrap li:nth-child(2) span { background: var(--point-color04); }
    .threec_wrap .circle_wrap li:nth-child(3) span { background: var(--point-color07); }

    .threec_wrap .graph_wrap { display: flex; justify-content: center; align-items: center; box-sizing: border-box; padding-block: 40px; padding-inline: 20px; max-width: 1000px; width: 100%; background: var(--point-color03); }
    .threec_wrap .list_desc ul{font-size: var(--title-20);}
    .threec_wrap .list_desc li {color: var(--black-color02);font-weight: 300;font-size: max(16px, 85%);line-height: 1.77;letter-spacing: -0.03em;}
    .threec_wrap .bold_list {font-size: var(--title-20);font-weight: 600;line-height: 1.77;letter-spacing: -0.03em;color: var(--black-color02);padding: 20px 30px;background: var(--point-color03);}
    .threec_wrap .bold_list :where(p, li){ font-size: inherit; font-weight: inherit; letter-spacing: inherit; color: inherit; }

    @media screen and (max-width: 1023px){
        .threec_wrap .graph_wrap { padding-block: clamp(20px, 4vw, 40px); padding-inline: clamp(15px, 2vw, 20px); }
        .threec_wrap .bold_list{padding-inline: clamp(25px, 3vw, 30px);}
    }

    @media screen and (max-width: 640px){
        .threec_wrap .circle_wrap li span { max-width: 150px; }
        .threec_wrap .circle_wrap .circle_box { top: 53%; }
        .threec_wrap .circle_wrap .circle_box::before,
        .threec_wrap .circle_wrap .circle_box::after { width: 8px; }
        .threec_wrap .circle_wrap .circle_box::before { left: 2%; }
        .threec_wrap .circle_wrap .circle_box::after { right: 2%; }
        .threec_wrap .circle_wrap .circle_box strong::before { width: 8px; bottom: -1%; }
    }

    @media screen and (max-width: 580px){
        .threec_wrap .circle_wrap { max-width: 100%; }
        .threec_wrap .circle_wrap .circle_box { max-width: revert; width: 85%; top: 54%; }
    }