::-webkit-scrollbar{width:6px;}
::-webkit-scrollbar-track{background:#f5f5f5;border-radius:10px;}
::-webkit-scrollbar-thumb{background:#d9d9d9;border-radius:10px;}
::-webkit-scrollbar-thumb:hover{background:#c7c7c7;}

@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}

*{ box-sizing:border-box;font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;letter-spacing:-0.1px;word-break:keep-all !important;box-sizing: border-box;}
.gm{ font-family: 'GMarketSans' !important}
/*.serif{font-family: "Cormorant", serif !important;}*/
.serif{ font-family: "Newsreader", serif !important}
body{min-width:1400px;line-height:1.6;}
#ctt{display:none;}
.ctt{width:1400px;margin:0 auto;}
.full_right {overflow: hidden;width: calc(50vw + 700px);margin-left: calc(50% - 700px);}
.mb_block{display:none;}
.pc_block{display:block;}
i, em{font-style:normal;}
b{font-weight:bold}
.c1{color:#1d509a}
.c2{color:#003668}
.c3{color:#009de1}
.c4{color:#3bbbca}
.b1{background:#1d509a}
.b2{background:#003668}
.wt{color:#fff}
.wt2{color:#d1e4ff}
.bold{font-weight:bold}
.pd180{padding:180px 0}
.pdt180{padding-top:180px}
.pd120{padding:120px 0}
.pdt120{padding-top:120px}
.mt120{margin-top:120px;}
.mt100{margin-top:100px;}
.mt80{margin-top:80px;}
.mt60{margin-top:60px;}
.mt40{margin-top:40px;}
.mt30{margin-top:30px;}
.mt20{margin-top:20px;}
.mt15{margin-top:15px;}
.mt10{margin-top:10px;}
.f50{font-size:50px;}
.f46{font-size:46px;}
.f40{font-size:40px;}
.f36{font-size:36px;}
.f32{font-size:32px;}
.f30{font-size:30px;}
.f26{font-size:26px;}
.f22{font-size:22px;}
.f20{font-size:20px;}
.f18{font-size:18px;}
.f17{font-size:17px;}
.f16{font-size:16px;}
.f15{font-size:15px;}
.f14{font-size:14px;}
.f13{font-size:13px;}


.hover_rotate{transition:all .5s;}
.hover_rotate:hover img{transform:rotate(360deg)}
.hover_rotate:hover{background:#0e3369;}
.hover_rotate2:hover{background:none}
.hover_rotate img{transition:all .5s;transform-origin:center;}

/* 서브페이지 */
.sub_top{border-bottom:1px solid #e4e4e4;background:#fff;width:100%;padding:30px 0;position:relative;}
.sub_sym{position:absolute;right:5%;bottom:0;width:20%;opacity:0.05;}
.sub_top_ban{padding-top:140px;}
.sub_top_ban span{font-weight:700;display:flex;align-items:center;gap:0 10px}
.sub_top_ban h4{}
.sub_top i{width:5px;height:5px;border-radius:100px;background:#999;}

.location{padding:30px 0;}
.location i{margin:0 40px;opacity:0.3;}
.location .ctt{display:flex;align-items:center;}
.home{width:16px}
.home img{width:100%;}
.sub_dep{position:relative}
.sub_dep h4{margin-top:5px;cursor:pointer;font-weight:500;display:flex;align-items:center;gap:0 20px;}
.sub_dep h4 img{width:10px;}
.sub_dep ul{border:1px solid #e9e9e9;pointer-events: none;z-index:99;position:absolute;top:50px;left:0;min-width:100%;width:230px;background: #fff;border-radius: 6px;overflow:hidden;opacity:0;transition:all .3s;transform:translateY(10px);}
.sub_dep.on ul{pointer-events: auto;opacity:1;transform:translateY(0px)}
.sub_dep ul li{font-size:15px}
.sub_dep ul li:hover{background:#f8f8f8}
.sub_dep ul li.active{background:#f8f8f8}
.sub_dep ul li.active a{font-weight:600}
.sub_dep ul li a{display:block;font-size:14px;padding:12px;}

.page_tit{}
.page_tit h2{line-height:1.5;}
.page_tit p{line-height:1.7}

.page_tab{box-shadow: inset 0 -1px 0 #e4e4e4;}
.page_tab ul{border-left:1px solid #e4e4e4;display:flex;flex-wrap:wrap;}
.page_tab ul li{border-right:1px solid #e4e4e4;}
@media (min-width:769px){

    .page_tab ul li:nth-child(7){
        border-bottom:1px solid #e4e4e4;
    }

    .page_tab ul:has(li:nth-child(8)) li:nth-child(n+8){
        border-top:1px solid #e4e4e4;
    }

}

.page_tab ul li:last-child{border-right:1px solid #e4e4e4;}
.page_tab ul li a{text-align:center;font-size:15px;display:block;padding:14px 0;width:180px;font-weight:400}
.page_tab ul li a:hover{background:#f8f8f8;}
.page_tab ul li a.active{font-weight:bold;background:#1d509a !important}

/* 질환 메인 */
.page_main{}
.page_main .ctt{display:flex;justify-content:space-between;}
.main_img{width:40%;}
.main_img img{width:100%;border-radius:15px;}
.main_txt_wrap{width:50%;}
.main_txt h2{font-weight:300}
.main_txt p{line-height:1.7;}
.main_txt_descript p{margin-top:22px;}
/* 원인 */
.cause{}
.cause h3{}
.cause ul{display:grid;grid-template-columns:repeat(3, 1fr);gap:20px 20px;}
.cause ul li{background:#f2f7fb;color:#081929;border-radius:500px;padding:20px;text-align:Center;font-size:16px;font-weight:500;position:relative}
.cause ul li i{width: 18px;height: 18px;display: inline-block;display:none;background: #003668;color: #fff;line-height: 18px;font-weight: 900;border-radius: 50px;font-size: 9px;position: absolute;top: -6px;left: 50%;transform: translateX(-50%);}

/* 진행단계 */
.step{background:#f9f9f9}
.step ul{background:#fff;border-radius:15px;padding:40px;display:grid;grid-template-columns:repeat(4, 1fr);}
.step ul li{position:relative;z-index:0;}
.step ul li:before{content: "";background: #f2f2f2;width: 100%;height: 4px;display: block;position: absolute;top: 18px;left: 50%;z-index: -1;}
.step ul li:after{content:"";position:absolute;top:18px;left:50%;width:0;height:4px;background:#003668;z-index:-1;transition:width .6s;}
.step ul li:last-child:before,
.step ul li:last-child:after{display:none;}
.step ul li div{text-align:center;}
.step ul li div span{font-size:14px;border-radius:100%;width:40px;height:40px;text-align:center;display:flex;justify-content:center;align-items:Center;color:#fff;font-weight:900;margin:0 auto;background:#fff;border:1px solid #003668;color:#003668;margin-bottom:20px}
.step ul li div h4{}
.step ul li div p{}
.step ul li img{width:90%;margin:0 auto;display:block;margin-top:30px;border-radius:15px;}
.step ul li:after{content:"";position:absolute;top:18px;left:50%;width:var(--progress,0%);height:4px;background:#003668;transition:none;}

/* 증상 */
.symptom{}
.symptom .ctt{width:1260px;}
.symptom_tit{}
.symptom ul{background:#fff;display:grid;grid-template-columns:repeat(4, 1fr);gap:30px;}
.symptom ul li{border-radius:15px;overflow:hidden;background:#000}
.symptom ul li img{width:100%}
.symptom ul li p{text-align:center;font-weight:600;padding:18px 0;color:#fff;}

/* 비수술치료 퀵메뉴 */
.quick_non{background:url('../common/images/non_bg.jpg')no-repeat;background-attachment:fixed;background-size:100%;}
.quick_non .ctt{display:flex;align-items:start;justify-content:space-between;}
.quick_non .main_tit{font-weight:600;width:30%;position:sticky;top:120px;left:0;}
.quick_non .main_tit a{width:fit-content;display:flex;align-items:center;gap:0 20px;padding:12px 25px;border-radius:100px;font-weight:500}
.quick_non .main_tit a img{width:15px;}
.quick_non ul{width:60%;display:grid;grid-template-columns: repeat(2, 1fr);gap:60px}
.quick_non ul li{position:relative;border-radius:15px;overflow:hidden;background:linear-gradient(132deg, #3daad3, #003668)}
.quick_non ul li:nth-child(1){}
.quick_non ul li:nth-child(2){transform:translateY(150px);}
.quick_non ul li:nth-child(3){}
.quick_non ul li:nth-child(4){transform:translateY(150px);}
.quick_non_img{width:100%;transition:all .5s;}
.quick_non ul li a{display:block;}
.quick_non ul li a:before{content:"";position:absolute;width:100%;height:50%;background:linear-gradient(180deg, #040e1a, transparent);;top:0;left:0}
.quick_non ul li div{position:absolute;top:80%;left:40px;transition:all .5s;}
.quick_non ul li img{width:100%}
.quick_non ul li div h4{font-weight:300;}
.quick_non ul li div p{transform:translateY(20px);opacity:0;transition:all .5s;}
.quick_non ul li i{position:absolute;right:50px;bottom:50px;border:1px solid #fff;display:flex;align-items:center;justify-content:center;transform:rotate(-45deg);opacity:0;transition:all .5s;width: 50px;
  height: 50px;border-radius: 100px;}
.quick_non ul li i img{width:13px;filter:invert(1);opacity:1;}

.quick_non ul li.active .non_img{opacity:0;}
.quick_non ul li div{top:10%;}
.quick_non ul li.active div p{transform:translateY(0);opacity:1;}
.quick_non ul li.active i{opacity:1;}

/* 비수술치료특화 */
.non_top_cont{position:relative;}
.non_swiper{overflow:hidden;}
.non_swiper ul{}
.non_swiper ul li{transition:all .5s;}
.non_swiper ul li a{display:flex;justify-content:space-between;}
.non_swiper ul li a img{width:40%;border-radius:15px;}
.non_swiper ul li a div{width:54%;}
.non_swiper ul li a div span{font-weight:600}
.non_swiper ul li a div strong{display:flex;align-items:center;gap:0 20px;width:fit-content;padding:18px 30px;border-radius:100px;margin-top:50px;font-weight:600;font-size:14px;line-height:normal}
.non_swiper ul li a div strong img{width:15px;}

.non_thumb_swiper{z-index:90;position:absolute;bottom:0;left:46%;width:50%;}
.non_thumb_swiper .swiper-slide{cursor:pointer;}
.non_thumb_swiper .swiper-slide-thumb-active img{filter:grayscale(0)}
.non_thumb_swiper img{width:100%;border-radius:8px;filter:grayscale(1);height: 100px;object-fit: cover;}
.non_thumb_swiper p{text-align:center;margin-top:10px;}

/* 비수술 메인 */
.non_page_main{background:linear-gradient(0deg, #fff, #f4f6f7)}
.non_page_main .ctt{}
.non_page_ctt{width:1200px;}
.non_main_txt{}
.non_main_txt h2{margin-top:5px;}
.non_main_txt h6{}
.non_txt_descript{}
.non_txt_descript p{line-height:1.8}
.non_main_img{width:100%;border-radius:15px;overflow:hidden;position:relative}
.non_main_img img{width:100%;border-radius:15px}

.non_notice{width: fit-content;font-weight: 600;padding: 8px 20px;display: flex;align-items: center;justify-content: center;text-align: center;gap: 0 8px;position: absolute;right: 30px;bottom: 30px;background: rgb(195 0 0 / 70%);border-radius: 100px;}
.non_notice i{background:#fff;width:15px;height:15px;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#cb0000;font-weight:900;font-size:12px;padding-top: 1px;padding-left: 1px;}

/* 특징 */
.charac{}
.charac .ctt{}
.charac ul{display:grid;grid-template-columns:repeat(5, 1fr);gap:30px}
.charac ul li{background:#f2f8f8;border-radius:15px;padding:40px 0;}
.charac ul li img{width:52px;margin:0 auto;display:block;}
.charac ul li h4{margin-top:18px;text-align:center;}
.charac ul li p{text-align:center;margin-top:6px;line-height:1.6;font-weight:300;}

/* 장점 */
.target{}
.target .ctt{}
.target ul{display:grid;grid-template-columns:repeat(2, 1fr);gap: 30px;}
.target ul li{background:#f8f8f8;padding:25px;display:flex;align-items:center;gap:0 10px;border-radius:8px;}
.target ul li img{width:20px;}
.target ul li p{text-align:center;font-weight:500;}

@media screen and (max-width:768px){
  .mb_block{display:block;}
  .pc_block{display:none;}
  body{min-width:100%;width:100%}
  .ctt{width:90%}
  .full_right {overflow: hidden;width:90%;margin-left:0;margin:0 auto;}
  .pd180{padding:80px 0}
  .pdt180{padding-top:80px}
  .pd120{padding:60px 0}
  .pdt120{padding-top:60px}
  .mt120{margin-top:70px;}
  .mt100{margin-top:60px;}
  .mt80{margin-top:50px;}
  .mt60{margin-top:40px;}
  .mt40{margin-top:30px;}
  .mt30{margin-top:20px;}
  .mt20{margin-top:15px;}
  .mt15{margin-top:10px;}
  .mt10{margin-top:8px;}
  .f50{font-size:30px;}
  .f46{font-size:28px;}
  .f40{font-size:22px;}
  .f36{font-size:20px;}
  .f32{font-size:18px;}
  .f30{font-size:18px;}
  .f26{font-size:18px;}
  .f22{font-size:17px;}
  .f20{font-size:17px;}
  .f18{font-size:15px;}
  .f17{font-size:14px;}
  .f16{font-size:14px;}
  .f15{font-size:13px;}
  .f14{font-size:13px;}
  .f13{font-size:12px;}


  .hover_rotate {font-size: 13px !important;padding:10px 20px;}
  .hover_rotate img{width:12px !important;}

  /* 서브 */
  .subpage{width:100%;overflow:hidden;}
  .sub_top_ban{padding-top:100px;}
  .sub_sym{width:60%;}
  .location{padding-bottom:10px;}
  .location .ctt{position:relative}
  .location i{margin: 0 9px;width: 4px;height: 4px;}
  .sub_dep{position:unset;}
  .sub_dep h4 img{width:9px;}
  .home{width:13px;}
  .sub_dep h4 {gap:0 10px;font-size:13px;}
  .sub_dep ul li a {font-size: 13px;padding: 10px 12px;}
  .sub_dep ul {top: 40px;left: 10%;min-width: 90%;}

  .page_tab ul{flex-wrap:wrap;width:100%}
  .page_tab ul li{box-sizing:border-box;width:33.3%;box-shadow: inset 0 -1px 0 #e4e4e4;}
  .page_tab ul li a{width:100%;font-size: 13px;padding: 10px 0;}

  .page_main .ctt{flex-direction:column-reverse;flex-wrap:wrap}
  .main_txt_wrap{width:100%;margin-top:30px;}
  .main_txt_descript p {margin-top: 15px;}
  .main_img{width:100%}

  .cause ul {grid-template-columns: repeat(1, 1fr);gap:10px;}
  .cause ul li {padding: 14px;font-size: 14px;}

  .step ul {padding:20px 0;grid-template-columns: repeat(1, 1fr);gap:30px 0;}
  .step ul li:before, .step ul li:after{display:none}
  .step ul li div{display:flex;gap:0 15px;margin-left:20px;}
  .step ul li div span {width:25px;height:25px;font-size:11px;background: #003668;color: #fff;margin:0;margin-bottom:10px;}
  .step ul li div h4, .step ul li div p{text-align:left;}
  .step ul li div h4{line-height:normal}
  .step ul li img{margin-top:15px;}

  .symptom .ctt{width:90%}
  .symptom ul {grid-template-columns: repeat(2, 1fr);
    gap: 20px;}
  .symptom ul li p {padding: 12px 10px;font-size: 13.5px;}


  .quick_non{background-size:cover;}
  .quick_non  .ctt{display:block}
  .quick_non .main_tit{width:100%;top:0;position:relative;}
  .quick_non ul{width:100%;margin-top:30px;grid-template-columns: repeat(1, 1fr);gap: 30px;}
  .quick_non ul li{height:280px}
  .quick_non ul li div{left:30px}
  .quick_non ul li.active{background:none}
  .quick_non ul li.active .non_img{opacity:1;}
  .quick_non ul li div p {transform: translateY(0px);opacity:1;}
  .quick_non ul li i {opacity: 1;}
  .quick_non ul li:nth-child(2), .quick_non ul li:nth-child(4) {transform: translateY(0px);}
  .quick_non ul li i {right: 30px;bottom: 30px;background: #000;border: none;}

  /* 비수술치료특화 */

  .non_swiper ul li a{flex-wrap:wrap;;}
  .non_swiper ul li a img{width:100%}
  .non_swiper ul li a div{width:100%;margin-top:30px;}
  .non_thumb_swiper {position: relative;bottom: 0;left: 0;width: 100%;margin-bottom:30px;}
  .non_thumb_swiper .swiper-wrapper{width:100%}
  .non_thumb_swiper img {height: auto;aspect-ratio: 1 / 1;border-radius: 100px;}
  .non_thumb_swiper p {line-height: 1.4;font-size:14px;}
  .non_thumb_swiper p b{display:block;}
  .non_swiper ul li a div strong{margin-top:30px}
  
  /* 비수술 질환 */
  .non_main_img{border-radius:0;}
  .non_notice {width:100%;position: relative;right: 0;bottom: 0;border-radius:0px;text-align: left;display: block;background:none;color:#cb0000;padding:0;}
  .non_notice i{margin-bottom:7px;background:#cb0000;color:#fff;}
  .non_main_img img{margin-top:25px;}
  
  .charac ul {grid-template-columns: repeat(1, 1fr);gap:15px;}
  .charac ul li{padding:25px;display:flex;align-items:Center;gap:0 20px}
  .charac ul li img{margin:0;width:35px}
  .charac ul li div{text-align:left;}
  .charac ul li h4{margin-top:0;}
  .charac ul li h4, .charac ul li p{text-align:left;}
  
  .target ul {grid-template-columns: repeat(1, 1fr) !important;gap: 15px;}
  .target ul li p{text-align:left}
}