/* reset */
*{margin:0;padding:0;box-sizing:border-box}
ul,ol{list-style:none}
a{text-decoration:none;color:inherit}
/* img{max-width:100%;display:block} */
button{background:none;border:0;cursor:pointer;font:inherit;color:inherit}

.inner{max-width:1200px;margin:0 auto;padding:0 20px}


/* sub visual */
.all_wrap_title {height: 700px; overflow: hidden;}
.sub_bg {height: inherit; animation: bg-zoom-in 5s both;}
.sub_tit {color:#8BBBF1;font-size:1.6rem; font-weight: 500; letter-spacing: 0.5px;}
@keyframes bg-zoom-in {
	0% {transform: scale(1);}
	100% {transform: scale(1.1);}
}

.sub_cont01_wrap {padding: 0 20px;}
.sub_cont01{width: 100%; max-width:1400px; margin:120px auto; }
.sub_cont01 .box_01 {position: relative; margin-bottom: 120px; color: rgba(0, 0, 0, .2);}
.sub_cont01 .box_01 p {position: relative; line-height: 1.3; text-align:right; font-size:3.5rem; background: linear-gradient(to right, #000, #000) no-repeat; -webkit-background-clip: text; background-clip: text; background-size: 0%; transition: background-size cubic-bezier(.1,.5,.5,1) 0.5s}
.sub_cont01 .box_01 p:nth-child(2){font-weight:bold; margin-top: 10px;}

.sub_cont01 .box_02 p {font-weight: 500; line-height: 1.2;}
.sub_cont01 .box_02 p:nth-child(1){}
.sub_cont01 .box_02 p:nth-child(2){color:#000;font-size:2.4rem; margin-top: 20px;}
/* ---- .sub visual */


/* features */
.features{background:#f6f7f9;padding:120px 0; position: relative; text-align: center;}
.features::before{content:'';position:absolute;top:236px; left: 0;height:2px;background:#91BEF2;width:100%;}
.features h3{font-size:4rem;font-weight:700;color:#222;margin-bottom:40px}
.feature-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;position:relative}
.feature-list li{position:relative;padding-top:60px;text-align:center;}
.feature-list li::before{content:'';position:absolute;top:32px;left:50%;transform: translateX(-50%); width:12px;height:12px;border-radius:50%;background:#002D7F;}
.feature-list .num {font-size:3.2rem;font-weight:300;color:#C8C8C8;}
.feature-list p{font-size:1.8rem; font-weight: 300; margin-top: 10px; line-height:1.55}

/* programs */
.programs{padding:90px 0}
.program-list{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.program-list li{background:#f9f9f9; border-radius:2px;overflow:hidden;display:flex;flex-direction:column}
.program-list .thumb{aspect-ratio:4/3;overflow:hidden}
.program-list .thumb img{width:100%;height:100%;object-fit:cover}
.program-list .info {padding:26px 20px 30px}
.program-list h4 {font-size:2.5rem; font-weight: 500; margin-bottom:24px; }
.program-list dl {font-size: 1.6rem;line-height:1.7; }
.program-list dl .flex {display: flex; margin-top: 25px;}
.program-list dl .flex:first-child {margin-top: 0;}
.program-list dt {width: 100%; max-width: 75px; font-weight: 600;}
.program-list dd {word-break: keep-all;}


/* symptom slides */
.symptom_sl {padding:50px 20px; position: relative;}
.symptom_sl::before {content: '';position: absolute;left: 0;bottom: 0;display: block;width: 100%;height: 60%;background-color: #F0F8FF; z-index: -1;}
.symptom_sl_content {width: 100%; max-width: 1400px; margin: 0 auto;}
.symptom_sl .img_cont {width: 50%; text-align: center;}
.symptom_sl .img_cont .img_wrap {position: relative; display: inline-block;}

.symptom_sl_content {display: flex;}

.button-list-area .list-con {position: absolute; height: 5.5%;}
.button-list-area .list-con:nth-child(1) {top: 10%; left: 25.8%; width: 21.7%;}
.button-list-area .list-con:nth-child(2) {top: 30.5%; left: 19.5%; width: 21.7%;}
.button-list-area .list-con:nth-child(3) {top: 30.5%; left: 79%; width: 21.7%;}
.button-list-area .list-con:nth-child(4) {top: 23.5%; left: 6%; width: 21.7%;}
.button-list-area .list-con:nth-child(5) {top: 55%; left: 14%; width: 21.7%;}
.button-list-area .list-con:nth-child(6) {top: 59%; left: 76%; width: 21.7%;}

.button-list-area .list-con .btn {font-size: 1.6rem; position: absolute; left: 0px; top: 0px; display: block; width: 100%; height: 100%; text-align: center; color: #fff; cursor: pointer; background: #002D7F; border-radius: 50px;}
.button-list-area .list-con .btn .point { position: absolute; left: -48px; top: 50%; width: 6px; height: 6px; border-radius: 50%; background:#002D7F; transform: translateY(-50%); text-indent: -9999px;}
.button-list-area .list-con .btn .point::before { content: ''; position: absolute; left: 100%; top: 50%; display: block; width: 60px; height: 1px; background-color: #002D7F; margin: -1px 0 0;}
.button-list-area .list-con .btn .point.point-right {left: auto; right: -48px;}
.button-list-area .list-con .btn .point.point-right::before {left: auto; right: 100%;}

.button-list-area .list-con.active .btn,
.button-list-area .list-con.active .btn .point,
.button-list-area .list-con.active .btn .point::after,
.button-list-area .list-con.active .btn .point::before {background: #DD6E0D;}
.button-list-area .list-con.active .btn .point.point-right {left: auto; right: -48px;}

.txt_cont {width: 50%;}
.txt_cont > h3 {font-size: 4rem; line-height: 1.2; margin-top: 78px;}

.txt_cont ul {margin-top: 140px;}
.txt_cont .list-con {display: none;}
.txt_cont .list-con.active {display: block;}
.txt_cont .list-con h3 {font-size: 2.4rem; margin-bottom: 20px; font-weight: 500;}
.txt_cont .list-con .txt_box p {font-size: 1.8rem; line-height: 1.6;}

.counsel_sub {background: #002D7F; color: #fff; border: none; padding: 10px 40px; font-size: 2rem; border-radius: 40px; margin-top: 20px; cursor: pointer; display: inline-block;}


/* 반응형 */
@media (max-width:1300px) {
  .symptom_sl {padding: 50px 20px 80px;}
  .symptom_sl_content {flex-direction: column; align-items: center;}
  .symptom_sl .img_cont  {width: 100%; max-width: 380px;}
  .symptom_sl .img_cont .img_wrap img {width: 100%;}
  .button-list-area .list-con:nth-child(1) {left: 20.8%; width: 21.7%;}
  .button-list-area .list-con:nth-child(2) {left: 15.5%; width: 21.7%;}
  .button-list-area .list-con:nth-child(3) {left: 83%; width: 21.7%;}
  .button-list-area .list-con:nth-child(4) {left: 2%; width: 21.7%;}
  .button-list-area .list-con:nth-child(5) {left: 6%; width: 26%;}
  .button-list-area .list-con:nth-child(6) {left: 80%; width: 21.7%;}
  .button-list-area .list-con .btn .point::before {width: 43px;}

  .txt_cont {width: 100%; max-width: 380px; margin: 0 auto;}
  .txt_cont > h3 {margin-top: 0;}
  .txt_cont ul {margin-top: 30px;}
}

/* tablet */
@media (max-width:1024px){
    .gnb ul{gap:18px}
    .gnb a{font-size:14px}

    .features::before {display: none;}
    .feature-list {grid-template-columns: 1fr;gap: 0;position: relative;padding-left: 40px; max-width: 260px; width: 100%; margin: 0 auto;}
		/* 세로 연결선 */
		.feature-list::before {content: '';display: block;position: absolute;top: 18px;bottom: 10px;left: 37px;width: 2px;height: auto;background: #91BEF2;}
		/* 각 아이템 점 위치 조정 */
		.feature-list li {position: relative;padding: 14px 0 24px 20px;text-align: left;}
		.feature-list li::before {top: 17px;left: -2px;width: 10px;height: 10px; border-color: #f6f7f9;}

		/* 번호 인라인 표시 */
		.feature-list .num {position: static;display: block;margin-bottom: 6px;}
		.feature-list p {line-height: 1.6;}

    .program-list{grid-template-columns:1fr 1fr}
    .program-list li:last-child{grid-column:1/-1;max-width:50%;margin:0 auto;width:100%}
}


@media (max-width: 850px) {
  /* top */
  .all_wrap_title {height: 400px;}

  /* .sub_cont01 */
  .sub_cont01 {margin: 80px auto;}
  .sub_cont01 .box_01 {margin-bottom: 60px;}
  .sub_cont01 .box_01 p {font-size: 2.5rem;}

  /* .features */
  .features {padding: 80px 0;}
}


/* mobile */
@media (max-width:768px){
    .header{height:60px}
    .gnb{display:none}
    .menu-btn{display:flex}
    .sub-visual{margin-top:60px;height:260px}
    .sub-visual h2{font-size:28px}


    .programs{padding:60px 0}
    .program-list{grid-template-columns:1fr;gap:30px}
    .program-list li{max-width:100%!important}
    .program-list .info{padding:22px 20px 26px}
    .program-list dt {max-width: 60px;}

}
