/*========== 01 해든동물의료센터 ===========*/ #greeting {background: #F6F7F9} #greeting .inner {max-width: 139.6rem; padding: 14.2rem 0 18rem; justify-content: space-between;} #greeting .txtArea {padding-left: 1.6rem;} #greeting .txtArea .tit {line-height: 5.5rem;} #greeting .txtArea .wrt {line-height: 3.2rem; padding: 6.5rem 0 7rem} #greeting .txtArea .txt {width: 31.1rem;} #greeting .imgArea {} @media all and (max-width: 880px){ #greeting {} #greeting .inner {max-width: 38.2rem; padding: 11rem 0;} #greeting .txtArea {} #greeting .txtArea .tit {font-size: 2.8rem; line-height: 4rem;} #greeting .txtArea .wrt {font-size: 1.4rem; line-height: 2.2rem; padding: 4rem 0;} #greeting .txtArea .txt {width: 19.1rem;} #greeting .imgArea {display: none;} } #equip {padding: 14.2rem 0 18rem} #equip .title {} #equip .tab {margin: 6rem 0 8.6rem; gap: 2rem;} #equip .tab li {width: 18rem; padding: 1.7rem 0 1.3rem; text-align: center; border-radius: 2.8rem; border: 1px solid #454C53; cursor: pointer;} #equip .tab li.on {background: var(--fcp); border: 1px solid var(--fcp); color: #fff;} #equip .tabCon {display: none;} #equip .tabCon.on {display: block;} #equip .tabConA {} #equip .tabConA .lstArea {max-width: 136.4rem; gap: 2.4rem 1.6rem;} #equip .tabConA .lstArea .lst {width: calc((100% - 1.6rem) / 2);} #equip .tabConA .lstArea .lst .imgArea {} #equip .tabConA .lstArea .lst .txtArea {top: 6.8rem; left: 4.7rem;} #equip .tabConA .lstArea .lst .txtArea .tit {padding-bottom: 1.4rem;} #equip .tabConA .lstArea .lst .txtArea .wrt {line-height: 2.8rem;} #equip .tabConB {} #equip .tabConB .lstArea {max-width: 122.6rem; gap: 6.9rem 1.6rem;} #equip .tabConB .lstArea .lst {width: calc((100% - 3.2rem) / 3);} #equip .tabConB .lstArea .lst .imgArea {} #equip .tabConB .lstArea .lst .txtArea {margin-top: 2.2rem} #equip .tabConB .lstArea .lst .txtArea .tit {padding-bottom: 1rem;} #equip .tabConB .lstArea .lst .txtArea .subt {line-height: 2.6rem} @media all and (max-width: 880px){ #equip {padding: 11rem 0;} #equip .title {font-size: 3.4rem;} #equip .tab {gap: 1rem 1.7rem; font-size: 1.4rem; flex-wrap: wrap; max-width: 26.5rem; margin: 4rem auto; justify-content: space-between;} #equip .tab li {width: calc((100% - 1.7rem) / 2); padding: 1.1rem 0 1.2rem} #equip .tab li.on {} #equip .tabCon {} #equip .tabCon.on {} #equip .tabConA {} #equip .tabConA .lstArea {max-width: 38.2rem; flex-direction: column;} #equip .tabConA .lstArea .lst {width: 100%} #equip .tabConA .lstArea .lst .imgArea {} #equip .tabConA .lstArea .lst .txtArea {width: 100%; max-width: 31.2rem; left: 50%; transform: translateX(-50%); top: 29.2rem;} #equip .tabConA .lstArea .lst .txtArea .tit {font-size: 2.6rem; padding-bottom: 3.4rem; text-align: center;} #equip .tabConA .lstArea .lst .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;} #equip .tabConB {} #equip .tabConB .lstArea {max-width: 38.2rem; flex-direction: column; gap: 2.9rem;} #equip .tabConB .lstArea .lst {width: 100%;} #equip .tabConB .lstArea .lst .imgArea {} #equip .tabConB .lstArea .lst .txtArea {position: absolute; top: 2.4rem; left: 2.2rem; margin: 0; text-align: left;} #equip .tabConB .lstArea .lst .txtArea .tit {font-size: 2.2rem;} #equip .tabConB .lstArea .lst .txtArea .subt {font-size: 1.4rem; line-height: 2.2rem;} } #fees {background: #F6F7F9;} #fees .inner {padding: 14.2rem 0 18rem; max-width: 97.2rem;} @media all and (max-width: 880px){ #fees {} #fees .inner {max-width: 38.22rem; padding: 11rem 0 14.6rem;} #fees .inner .img {overflow-y: hidden; overflow-x: scroll; white-space: nowrap;} #fees .inner .img img {width: 150vw; max-width: none; height: auto;} #fees .fakeScroll { margin-bottom: 1rem; width: 100%; height: 0.4rem; background: #d9d9d9; border-radius: 999px; position: relative; overflow: hidden; } #fees .fakeScroll .thumb { position: absolute; left: 0; top: 0; height: 100%; background: #4b5cff; border-radius: 999px; transform: translateX(0); } } /*========== 02 지점안내 ===========*/ .infoCont {} .infoCont .inner {max-width: 139.6rem; padding-top: 14.2rem;} .infoCont .title {margin-bottom: 8.6rem} .infoCont .timeArea {} .infoCont .timeArea .tit {align-items: flex-end; gap: 3.6rem;} .infoCont .timeArea .tit .t1 {} .infoCont .timeArea .tit .t2 {} .infoCont .timeArea .cont {margin-top: 3.6rem} .infoCont .timeArea .cont .lst {gap: 7rem;} .infoCont .timeArea .cont .lst li {gap: 2.4rem;} .infoCont .timeArea .cont .lst li .opg {padding: 0.7rem 1.8rem 0.6rem 1.8rem; border-radius: 1.9rem; background: var(--fcp)} .infoCont .timeArea .cont .lst li .opg.red {background: #F00000} .infoCont .timeArea .cont .lst li .time {} .infoCont .timeArea .cont .call {padding-left: 7rem; margin-left: 7rem; border-left: 1px solid #C9CDD2; gap: 2.4rem} .infoCont .timeArea .cont .call span {} .infoCont .photoArea {margin: 11rem 0 24rem;} .infoCont .photoArea .photoSwiper {overflow: hidden; max-width: 115rem; margin: 0 auto;} .infoCont .photoArea .photoPrev {left: 3%; cursor: pointer;} .infoCont .photoArea .photoNext {right: 3%; cursor: pointer;} @media all and (max-width: 880px){ .infoCont {overflow: hidden;} .infoCont .inner {max-width: 100%; padding-top: 11rem} .infoCont .title {font-size: 3.4rem; margin-bottom: 7rem} .infoCont .timeArea {max-width: 38.2rem; margin: 0 auto} .infoCont .timeArea .tit {gap: 1.4rem} .infoCont .timeArea .tit .t1 {font-size: 2.6rem;} .infoCont .timeArea .tit .t2 {font-size: 1.8rem;} .infoCont .timeArea .cont {margin-top: 4rem; flex-direction: column;} .infoCont .timeArea .cont .lst {flex-direction: column; gap: 2rem;} .infoCont .timeArea .cont .lst li {gap: 3rem;} .infoCont .timeArea .cont .lst li .opg {font-size: 1.8rem; padding: 0.9rem 2.2rem 0.7rem 2.2rem;} .infoCont .timeArea .cont .lst li .time {font-size: 2rem} .infoCont .timeArea .cont .call {padding: 0; margin: 0; border: 0; justify-content: center; font-size: 3rem; gap: 1.2rem; padding-top: 6rem; margin-top: 3.6rem; border-top: 1px solid #C9CDD2;} .infoCont .timeArea .cont .call span {font-size: 1.8rem;} .infoCont .photoArea {max-width: 38.2rem; margin: 7rem auto 10rem;} .infoCont .photoArea .phptoSwiper {} .infoCont .photoArea .photoPrev {display: none} .infoCont .photoArea .photoNext {display: none} .infoCont .photoControl {display: flex; margin-top: 4rem; gap: 0.8rem;} .infoCont .photoControl span {} .infoCont .photoControl .curr {} .infoCont .photoControl .total {color: #C9CDD2} .infoCont .photoControl .pg {position: relative; width: 14.7rem; height: 0.4rem; background: #EEF0F3; border-radius: 2rem; overflow: hidden;} .infoCont .photoControl .pg .swiper-pagination-progressbar-fill {background: #162F9E; border-radius: 2rem;} } .infoCont .direcArea {margin-bottom: 20rem} .infoCont .direcArea .title {margin-bottom: 7rem;} .infoCont .direcArea .cont {gap: 9rem} .infoCont .direcArea .mapArea {} .infoCont .direcArea .mapArea .map {width: 69rem;} .infoCont .direcArea .infoArea {} .infoCont .direcArea .infoArea .tit {line-height: 4.6rem; margin-bottom: 5rem;} .infoCont .direcArea .infoArea .lst {} .infoCont .direcArea .infoArea .lst li {} .infoCont .direcArea .infoArea .lst li + li {margin-top: 4rem} .infoCont .direcArea .infoArea .lst li .opt {min-width: 12rem; padding-top: 0.4rem;} .infoCont .direcArea .infoArea .lst li .wrt {line-height: 3.2rem; font-size: 1.8rem;} .infoCont .direcArea .infoArea .lst li .wrt .div {} .infoCont .direcArea .infoArea .lst li .wrt .div + .div {margin-top: 1.5rem} .infoCont .moreArea {} .infoCont .moreArea li {} .infoCont .moreArea li .bgImg {} .infoCont .moreArea li .txt {justify-content: space-between; padding: 0 3.9rem 0 8.8rem; top: 0} .infoCont .moreArea li .txt .tit {} .infoCont .moreArea li .txt .btn {opacity: 0; transition: 0.2s;} .infoCont .moreArea li:hover .txt .btn {opacity: 1} @media all and (max-width: 880px){ .infoCont .direcArea {margin-bottom: 10.6rem;} .infoCont .direcArea .title {max-width: 38.2rem; margin: 0 auto; margin-bottom: 4rem; font-size: 2.6rem;} .infoCont .direcArea .cont {flex-direction: column; gap: 7rem;} .infoCont .direcArea .mapArea {} .infoCont .direcArea .mapArea .map {width: 100%} .infoCont .direcArea .infoArea {max-width: 38.2rem; margin: 0 auto} .infoCont .direcArea .infoArea .tit {font-size: 2.4rem; line-height: 3.6rem;} .infoCont .direcArea .infoArea .lst {} .infoCont .direcArea .infoArea .lst li {} .infoCont .direcArea .infoArea .lst li + li {margin-top: 3.2rem;} .infoCont .direcArea .infoArea .lst li .opt {min-width: 10rem; font-size: 1.8rem;} .infoCont .direcArea .infoArea .lst li .wrt {font-size: 1.6rem;} .infoCont .direcArea .infoArea .lst li .wrt .div {} .infoCont .direcArea .infoArea .lst li .wrt .div + .div {} .infoCont .direcArea .infoArea .lst li .wrt i {display: none; line-height: 2.6rem} .infoCont .moreArea {flex-direction: column;} .infoCont .moreArea li {height: 17rem;} .infoCont .moreArea li .bgImg {height: 100%} .infoCont .moreArea li .bgImg img {height: 100%; object-fit: cover} .infoCont .moreArea li .txt {padding: 0 2.6rem 0 5rem; display: none !important} .infoCont .moreArea li .txt .tit {font-size: 2.6rem;} .infoCont .moreArea li .txt .btn {width: 15rem;} } .root_daum_roughmap .wrap_controllers {display: none} .root_daum_roughmap .cont {display: none} .docCont {padding: 14.2rem 0 18rem} .docCont .title {} .docCont .tab {margin: 6rem 0 9rem; gap: 2rem;} .docCont .tab li {width: 18.2rem; text-align: center; padding: 1.5rem; border: 1px solid #454C53; border-radius: 2.8rem; cursor: pointer;} .docCont .tab li.on {background: #162F9E; border: 1px solid #162F9E; color: #fff; } .docCont .docTab {} .docCont .docTab .lstArea {} .docCont .docTab .lstArea li {} .docCont .docTab .lstArea li + li {margin-top: 10rem} .docCont .docTab .imgArea {} .docCont .docTab .imgArea .img {} .docCont .docTab .imgArea .txts {top: 21.2rem; left: 38.6rem;} .docCont .docTab .imgArea .txts .place {padding: 0.8rem 1.6rem 0.5rem 1.6rem; background: #162F9E; display: inline-block;} .docCont .docTab .imgArea .txts .name {padding: 2.8rem 0 1.6rem; gap: 1.2rem; align-items: baseline;} .docCont .docTab .imgArea .txts .name span {font-weight: 400} .docCont .docTab .imgArea .txts .detail {line-height: 3.2rem;} .docCont .docTab .txtArea {} .docCont .docTab .txtArea .name {display: none;} .docCont .docTab .txtArea .name span {} .docCont .docTab .txtArea .detail {display: none;} .docCont .docTab .txtArea .hst {font-size: 1.6rem; line-height: 2.6rem;} .docCont .vetTab {display: none;} .docCont .vetTab .lstArea {max-width: 139.4rem; margin: 0 auto; gap: 2.2rem;} .docCont .vetTab .lstArea li {width: calc((100% - 4.4rem) / 3);} @media all and (max-width: 880px){ .docCont {padding: 11rem 0 10.6rem} .docCont .title {font-size: 3.4rem;} .docCont .tab {margin: 4rem 0 7rem; font-size: 1.4rem; gap: 1.7rem} .docCont .tab li {width: 12.4rem; padding: 1.1rem 0 1.2rem; border-radius: 2.2rem} .docCont .tab li.on {} .docCont .docTab {max-width: 38.2rem; margin: 0 auto} .docCont .docTab .lstArea {} .docCont .docTab .lstArea li {flex-direction: column; gap: 2.9rem; align-items: baseline;} .docCont .docTab .lstArea li + li {margin-top: 7rem;} .docCont .docTab .imgArea {background: #F6F7F9; border-radius: 2rem} .docCont .docTab .imgArea .img {} .docCont .docTab .imgArea .txts {top: 0; right: 0; left: auto;} .docCont .docTab .imgArea .txts .place {font-size: 1.4rem; padding: 0.6rem 1.2rem;} .docCont .docTab .imgArea .txts .name {display: none;} .docCont .docTab .imgArea .txts .name span {} .docCont .docTab .imgArea .txts .detail {display: none;} .docCont .docTab .txtArea {} .docCont .docTab .txtArea .name {display: block; margin-bottom: 1.9rem} .docCont .docTab .txtArea .name span {font-weight: 400} .docCont .docTab .txtArea .detail {display: block; line-height: 2.8rem;} .docCont .docTab .txtArea .hst {font-size: 1.6rem; line-height: 2.4rem; margin-top: 2.7rem} .docCont .docTab .txtArea .hst.mop {padding-top: 1.5rem;} .docCont .docTab .txtArea .hst span {font-size: 1.4rem;} .docCont .vetTab {} .docCont .vetTab .lstArea {flex-direction: column; max-width: 38.2rem; gap: 1.8rem} .docCont .vetTab .lstArea li {width: 100%} } .schCont {background: #F6F7F9} .schCont .inner {padding: 14.2rem 0 17.9rem; max-width: 97.2rem;} .schCont .tit {} .schCont .tit i {display: inline-block; padding-bottom: 0.8rem;} .schCont .wrt {margin: 4rem 0 5.8rem;} .schCont .link {margin-bottom: 8.2rem; gap: 6rem;} .schCont .link li {width: 27.8rem; background: var(--fcp); border-radius: 2.8rem; overflow: hidden;} .schCont .link li a {display: block; padding: 1.5rem 0;} .schCont .schImg {} @media all and (max-width: 880px){ .schCont {} .schCont .inner {padding: 11rem 0 10.6rem; max-width: 38.2rem} .schCont .tit {font-size: 3.4rem; line-height: 5rem;} .schCont .tit i {padding: 0; font-size: 3.4rem;} .schCont .wrt {margin: 4rem 0; font-size: 1.6rem; line-height: 2.6rem;} .schCont .link {margin-bottom: 4rem; flex-direction: column; gap: 1.2rem; font-size: 1.4rem; width: 20.6rem; margin: 0 auto; margin-bottom: 4rem;} .schCont .link li {width: 100%; border-radius: 2.2rem;} .schCont .link li a {padding: 1.1rem 0 1.1rem;} .schCont .schImg {} } /** 의정부 **/ #ujinf {} #ujinf .s1 {} #ujinf .s2 {} #ujinf .s3 {} #ujDoc {} #ujSpc {} #ujSpc .s1 {margin-top: 18.5rem} #ujSpc .s2 {margin-top: 30.6rem} #ujSpc .s3 {margin-top: 25rem} #ujSpc .s4 {margin-top: 30rem;} #ujSpc .s5 {margin-top: 28.8rem} #ujSpc .s6 {margin-top: 30.6rem} #ujSpc .s7 {margin-top: 24rem} #ujSpc .s8 {margin-top: 30rem} #ujSpc .s9 {margin-top: 34rem} #ujSpc .s10 {margin-top: 30.6rem} #ujSpc .s11 {margin-top: 24rem} #ujSpc .s12 {margin-top: 30rem} #ujSpc .s13 {margin-top: 34rem} #ujSpc .s14 {margin-top: 24rem} #ujSpc .s15 {margin-top: 21rem} #ujSpc .s16 {margin-top: 24rem} #ujSpc .s17 {margin-top: 34rem} #ujSpc .s18 {} #ujSpc .s19 {margin: 18rem 0 25rem} #ujSpc .s20 {} #ujSch {} @media all and (max-width: 880px){ #ujinf {} #ujinf .s1 {} #ujinf .s2 {} #ujinf .s3 {} #ujDoc {} #ujSpc {} #ujSpc .s1 {margin-top: 11rem} #ujSpc .s2 {margin-top: 11rem} #ujSpc .s3 {margin-top: 11rem;} #ujSpc .s4 {margin-top: 11rem;} #ujSpc .s5 {margin-top: 13rem} #ujSpc .s6 {margin-top: 11rem} #ujSpc .s7 {margin-top: 11rem} #ujSpc .s8 {margin-top: 11rem} #ujSpc .s9 {margin-top: 13rem} #ujSpc .s10 {margin-top: 11rem} #ujSpc .s11 {margin-top: 11rem} #ujSpc .s12 {margin-top: 11rem} #ujSpc .s13 {margin-top: 11rem} #ujSpc .s14 {margin-top: 7rem} #ujSpc .s15 {margin-top: 10.6rem} #ujSpc .s16 {margin-top: 11rem} #ujSpc .s17 {margin-top: 13rem} #ujSpc .s18 {} #ujSpc .s19 {margin: 11rem 0;} #ujSpc .s20 {} #ujSch {} } /** 양주 **/ #yginf {} #ygDoc {} #ygSpc {} #ygSpc .s1 {margin-top: 18.5rem} #ygSpc .s2 {margin-top: 30.6rem} #ygSpc .s3 {margin-top: 25rem;} #ygSpc .s4 {margin-top: 30rem} #ygSpc .s5 {margin-top: 28.8rem} #ygSpc .s6 {margin-top: 30.6rem} #ygSpc .s7 {margin-top: 24rem;} #ygSpc .s8 {margin-top: 30rem} #ygSpc .s9 {margin-top: 43rem} #ygSpc .s10 {} #ygSpc .s11 {margin: 18rem 0 25rem} #ygSpc .s12 {} #ygSch {} @media all and (max-width: 880px){ #yginf {} #ygDoc {} #ygSpc {} #ygSpc .s1 {margin-top: 11rem} #ygSpc .s2 {margin-top: 11rem} #ygSpc .s3 {margin-top: 11rem;} #ygSpc .s4 {margin-top: 11rem} #ygSpc .s5 {margin-top: 13rem} #ygSpc .s6 {margin-top: 11rem} #ygSpc .s7 {margin-top: 11rem;} #ygSpc .s8 {margin-top: 11rem} #ygSpc .s9 {margin-top: 11rem} #ygSpc .s10 {} #ygSpc .s11 {margin: 11rem 0} #ygSpc .s12 {} #ygSch {} } /** 민락 **/ #mlinf {} #mlDoc {} #mlSpc {} #mlSpc .s1 {margin-top: 18.5rem} #mlSpc .s2 {margin-top: 30.6rem} #mlSpc .s3 {margin-top: 25rem;} #mlSpc .s4 {margin-top: 30rem} #mlSpc .s5 {margin-top: 28.8rem} #mlSpc .s6 {margin-top: 30.6rem} #mlSpc .s7 {margin-top: 24rem;} #mlSpc .s8 {margin-top: 30rem} #mlSpc .s9 {margin-top: 43rem} #mlSpc .s10 {} #mlSpc .s11 {margin: 18rem 0 25rem} #mlSpc .s12 {} #mlSch {} @media all and (max-width: 880px){ #mlinf {} #mlDrc {} #mlSpc {} #mlSpc .s1 {margin-top: 11rem} #mlSpc .s2 {margin-top: 11rem} #mlSpc .s3 {margin-top: 11rem;} #mlSpc .s4 {margin-top: 11rem} #mlSpc .s5 {margin-top: 13rem} #mlSpc .s6 {margin-top: 11rem} #mlSpc .s7 {margin-top: 11rem;} #mlSpc .s8 {margin-top: 11rem} #mlSpc .s9 {margin-top: 11rem} #mlSpc .s10 {} #mlSpc .s11 {margin: 11rem 0} #mlSpc .s12 {} #mlSch {} } /*========== 03 MRI/CT 영상진단센터 ===========*/ #mri {} #mri .s1 {} #mri .s2 {margin-top: 30rem} #mri .s2::before {content: ''; display: block; position: absolute; width: 100%; height: 11.4rem; background: #F6F7F9; bottom: 0; left: 0} #mri .s3 {padding: 24rem 0 16rem; background: #F6F7F9} #mri .s4 {margin: 24rem 0 18rem} #ct {} #ct .s1 {} #ct .s2 {margin-top: 30rem} #ct .s2::before {content: ''; display: block; position: absolute; width: 100%; height: 25rem; background: #F6F7F9; bottom: 0; left: 0} #ct .s3 {background: #F6F7F9; padding-top: 7rem} #ct .s3 .inner {max-width: 141rem; gap: 7rem;} #ct .s3 .imgArea {width: 83.5rem;} #ct .s3 .txtArea {} #ct .s3 .txtArea .tit {padding-bottom: 4rem;} #ct .s3 .txtArea .wrt {line-height: 3.2rem;} #ct .s4 {padding: 40.8rem 0 16rem; background: #F6F7F9} #ct .s5 {margin: 24rem 0 18rem} #ct .s6 {} #xray {} #xray .s1 {} #xray .s2 {margin-top: 30rem; padding-bottom: 18rem} #xray .s2::before {content: ''; display: block; position: absolute; width: 100%; height: 29.2rem; background: #F6F7F9; bottom: 0; left: 0} #ultra {} #ultra .s1 {} #ultra .s2 {margin-top: 30rem; padding-bottom: 20.8rem;} #ultra .s2::before {content: ''; display: block; position: absolute; width: 100%; height: 32rem; background: #F6F7F9; bottom: 0; left: 0} #ultra .s3 {margin-top: 24rem; padding-bottom: 18rem;} #ultra .s3::before {content: ''; display: block; position: absolute; width: 100%; height: 29.2rem; background: #F6F7F9; bottom: 0; left: 0} @media all and (max-width: 880px){ #mri {} #mri .s1 {} #mri .s2 {margin-top: 10rem} #mri .s2::before {height: 56.8rem;} #mri .s3 {padding: 11rem 0;} #mri .s4 {margin: 11rem 0;} #ct {} #ct .s1 {} #ct .s2 {margin-top: 10rem} #ct .s2::before {height: 129.4rem;} #ct .s3 {} #ct .s3 .inner {max-width: 38.2rem; flex-direction: column; gap: 3.8rem; padding-top: 11rem;} #ct .s3 .imgArea {width: 100%} #ct .s3 .txtArea {text-align: center;} #ct .s3 .txtArea .tit {font-size: 2.6rem; padding-bottom: 2rem;} #ct .s3 .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;} #ct .s4 {padding: 11rem 0;} #ct .s5 {margin: 11rem 0;} #ct .s6 {} #xray {} #xray .s1 {} #xray .s2 {margin-top: 10rem; padding-bottom: 11rem;} #xray .s2::before {height: 81.5rem;} #ultra {} #ultra .s1 {} #ultra .s2 {margin-top: 10rem; padding-bottom: 11rem;} #ultra .s2::before {height: 54.9rem} #ultra .s3 {margin-top: 11rem; padding-bottom: 11rem;} #ultra .s3::before {height: 81.5rem} } /*========== 04 특화진료센터 ===========*/ #ortho {} #ortho .s1 {} #ortho .s2 {margin-top: 30rem} #ortho .s3 {margin-top: 24rem;} #ortho .s4 {margin: 30rem 0 18rem} #heart {} #heart .s1 {} #heart .s2 {margin-top: 30rem} #heart .s3 {margin-top: 24rem;} #heart .s4 {margin: 30rem 0 18rem} #eye {} #eye .s1 {} #eye .s2 {margin-top: 30rem} #eye .s3 {margin-top: 24rem;} #eye .s4 {margin: 30rem 0 18rem} #cat {} #cat .s1 {} #cat .s2 {margin-top: 30rem} #cat .s3 {margin-top: 21rem} #cat .s4 {margin: 24rem 0 18rem;} #checkup {} #checkup .s1 {} #checkup .s2 {margin-top: 24rem;} #checkup .s3 {margin: 25rem 0;} #checkup .s4 {} #checkup .s5 {} @media all and (max-width: 880px){ #ortho {} #ortho .s1 {} #ortho .s2 {margin-top: 10rem;} #ortho .s3 {margin-top: 11rem;} #ortho .s4 {margin: 11rem 0;} #heart {} #heart .s1 {} #heart .s2 {margin-top: 11rem} #heart .s3 {margin-top: 11rem;} #heart .s4 {margin: 11rem 0;} #eye {} #eye .s1 {} #eye .s2 {margin-top: 10rem} #eye .s3 {margin-top: 11rem;} #eye .s4 {margin: 11rem 0;} #cat {} #cat .s1 {} #cat .s2 {margin-top: 10rem} #cat .s3 {margin-top: 11rem} #cat .s4 {margin: 11rem 0;} #checkup {} #checkup .s1 {} #checkup .s2 {margin-top: 10rem} #checkup .s3 {margin: 11rem 0;} #checkup .s4 {} #checkup .s5 {} } /*========== 05 세부진료 ===========*/ #surgery {} #surgery .s1 {} #surgery .s2 {margin-top: 30rem} #surgery .s3 {margin-top: 24rem;} #surgery .s4 {margin: 30rem 0 18rem} #emergency {} #emergency .s1 {} #emergency .s2 {margin-top: 30rem} #emergency .s3 {margin: 24rem 0 18rem} #cancer {} #cancer .s1 {} #cancer .s2 {margin-top: 30rem} #cancer .s3 {margin-top: 24rem;} #cancer .s4 {margin-top: 30rem} #cancer .s4 .inner {max-width: 119.6rem;} #cancer .s4 .titArea {margin-bottom: 8rem;} #cancer .s4 .titArea .tit {padding-bottom: 1.6rem;} #cancer .s4 .titArea .wrt {} #cancer .s4 .lstArea {gap: 5.2rem;} #cancer .s4 .lstArea .lst {width: calc((100% - 5.2rem) / 2); background: #F6F7F9; border-radius: 2rem; padding: 4.2rem 0; line-height: 3.2rem;} #cancer .s5 {margin: 30rem 0 18rem} #rehab {} #rehab .s1 {} #rehab .s2 {background: #F6F7F9; margin-top: 29.5rem} #rehab .s2 .inner {max-width: 100.8rem; padding: 12.5rem 0 12rem;} #rehab .s2 .title {margin-bottom: 7.5rem;} #rehab .s2 .lstArea {gap: 4.8rem;} #rehab .s2 .lstArea li {width: 100%; background: #fff; padding: 7.7rem 0;} #rehab .s2 .lstArea li .ico {width: 12.6rem;} #rehab .s2 .lstArea li .tit {padding: 4.2rem 0 2.6rem;} #rehab .s2 .lstArea li .wrt {line-height: 2.8rem;} #rehab .s3 {padding: 23.4rem 0 18rem} #rehab .s3 .inner {max-width: 146.4rem;} #rehab .s3 .lst {gap: 7.6rem; padding-left: 5rem;} #rehab .s3 .lst + .lst {margin-top: 5.8rem;} #rehab .s3 .lst .img {width: 68.2rem;} #rehab .s3 .lst .txts {} #rehab .s3 .lst .txts .tit {padding-bottom: 2.8rem;} #rehab .s3 .lst .txts .wrt {line-height: 2.8rem;} #rehab .s3 .lst .txts .prg {gap: 0.3rem; line-height: 2.8rem} #rehab .s3 .lst .txts .prg + .prg {margin-top: 2rem;} #dental {} #dental .s1 {} #dental .s2 {margin-top: 30rem} #dental .s2 .inner {max-width: 150.4rem;} #dental .s2 .title {margin-bottom: 11rem} #dental .s2 .lstArea {padding: 0 12rem; justify-content: space-between;} #dental .s2 .lstArea + .lstArea {padding-top: 6.8rem; margin-top: 6.8rem; border-top: 1px solid #C9CDD2} #dental .s2 .lstArea .lst {} #dental .s2 .lstArea .lst .imgArea {} #dental .s2 .lstArea .lst .txtArea {} #dental .s2 .lstArea .lst .txtArea .tit {padding: 3.2rem 0 2.4rem} #dental .s2 .lstArea .lst .txtArea .wrt {line-height: 2.8rem;} #dental .s3 {margin-top: 26.7rem;} #dental .s4 {margin: 44.4rem 0 22rem;} #dental .s5 {} @media all and (max-width: 880px){ #surgery {} #surgery .s1 {} #surgery .s2 {margin-top: 10rem} #surgery .s3 {margin-top: 11rem;} #surgery .s4 {margin: 11rem 0;} #emergency {} #emergency .s1 {} #emergency .s2 {margin-top: 10rem} #emergency .s3 {margin: 11rem 0;} #cancer {} #cancer .s1 {} #cancer .s2 {margin-top: 11rem} #cancer .s3 {margin-top: 11rem;} #cancer .s4 {margin-top: 11rem;} #cancer .s4 .inner {max-width: 38.2rem;} #cancer .s4 .titArea {margin-bottom: 4rem;} #cancer .s4 .titArea .tit {font-size: 3.4rem;} #cancer .s4 .titArea .wrt {font-size: 1.6rem;} #cancer .s4 .lstArea {flex-direction: column; gap: 2rem; font-size: 1.6rem;} #cancer .s4 .lstArea .lst {padding: 3.7rem 0 3.4rem; line-height: 2.6rem; width: 100%;} #cancer .s5 {margin: 11rem 0} #rehab {} #rehab .s1 {} #rehab .s2 {margin-top: 10rem} #rehab .s2 .inner {max-width: 33.4rem; padding: 7rem 0 11rem;} #rehab .s2 .title {margin-bottom: 4rem; font-size: 3.4rem;} #rehab .s2 .lstArea {flex-direction: column; gap: 2.2rem} #rehab .s2 .lstArea li {padding: 5.8rem 0;} #rehab .s2 .lstArea li .ico {width: 10.4rem;} #rehab .s2 .lstArea li .tit {font-size: 2.4rem; padding: 2.4rem 0 2rem;} #rehab .s2 .lstArea li .wrt {font-size: 1.6rem; line-height: 2.6rem;} #rehab .s3 {padding: 11rem 0;} #rehab .s3 .inner {max-width: 38.2rem;} #rehab .s3 .lst {gap: 2.4rem; flex-direction: column; padding: 0; align-items: baseline;} #rehab .s3 .lst + .lst {margin-top: 6.1rem;} #rehab .s3 .lst .img {width: 100%} #rehab .s3 .lst .txts {} #rehab .s3 .lst .txts .tit {font-size: 2.4rem; padding-bottom: 1.8rem;} #rehab .s3 .lst .txts .wrt {font-size: 1.6rem; line-height: 2.6rem; letter-spacing: -0.005em;} #rehab .s3 .lst .txts .prg {letter-spacing: -0.005em; font-size: 1.6rem; line-height: 2.6rem;} #dental {} #dental .s1 {} #dental .s2 {margin-top: 10rem} #dental .s2 .inner {max-width: 38.2rem;} #dental .s2 .title {font-size: 3.4rem; margin-bottom: 4rem} #dental .s2 .lstArea {padding: 0; flex-direction: column; gap: 6.1rem;} #dental .s2 .lstArea + .lstArea {border: 0; padding-top: 6.1rem; margin: 0;} #dental .s2 .lstArea .lst {} #dental .s2 .lstArea .lst .imgArea {} #dental .s2 .lstArea .lst .txtArea {} #dental .s2 .lstArea .lst .txtArea .tit {font-size: 2.4rem; padding: 2.4rem 0 1.8rem;} #dental .s2 .lstArea .lst .txtArea .wrt {font-size: 1.6rem; line-height: 2.6rem;} #dental .s3 {margin: 11rem 0;} #dental .s4 {margin: 11rem 0;} #dental .s5 {} } /*========== 06 커뮤니티 ===========*/ /*==== 진료의뢰 =====*/ #referral {} #referral .s1 {} #referral .s2 {margin-top: 30rem} #referral .s2 .title {margin-bottom: 6rem;} #referral .s2 .cont {padding: 11.7rem 0 10.3rem; background: #F6F7F9;} #referral .s2 .lstArea {max-width: 121rem; margin: 0 auto; } #referral .s2 .lstArea .lst {width: 25%} #referral .s2 .lstArea .lst + .lst::before {content: ''; display: block; position: absolute; width: 1.4rem; height: 2.4rem; background: url('../img/06/61_s2_arr.svg') center/contain no-repeat; left: -0.7rem; top: 27%;} #referral .s2 .lstArea .lst .ico {} #referral .s2 .lstArea .lst .step {padding: 3.6rem 0 1.4rem} #referral .s2 .lstArea .lst .tit {} #referral .s3 {} #referral .s3 .inner {max-width: 139.6rem; padding: 24rem 0 18rem;} #referral .s3 .title {margin-bottom: 6rem;} #referral .s3 .lstArea {gap: 6.8rem;} #referral .s3 .lstArea .lst {} #referral .s3 .lstArea .lst .thumb {} #referral .s3 .lstArea .lst .tit {padding: 3.4rem 0 1.8rem;} #referral .s3 .lstArea .lst .info {} #referral .s3 .lstArea .lst .info li {gap: 1.5rem;} #referral .s3 .lstArea .lst .info li + li {margin-top: 0.5rem;} #referral .s3 .lstArea .lst .info li img {} @media screen and (max-width: 880px) { #referral {} #referral .s1 {} #referral .s2 {margin-top: 10rem;} #referral .s2 .title {font-size: 3.4rem; line-height: 5rem;} #referral .s2 .cont {padding: 7rem 0;} #referral .s2 .lstArea {flex-direction: column; gap: 8rem;} #referral .s2 .lstArea .lst {width: 100%;} #referral .s2 .lstArea .lst + .lst::before {left: 50%; transform: translateX(-50%) rotate(90deg); top: -5rem;} #referral .s2 .lstArea .lst .ico {width: 15rem;} #referral .s2 .lstArea .lst .step {font-size: 1.6rem; padding: 2.3rem 0 1.5rem;} #referral .s2 .lstArea .lst .tit {font-size: 2rem;} #referral .s3 {} #referral .s3 .inner {max-width: 38.2rem; padding: 11rem 0;} #referral .s3 .title {font-size: 3.4rem; line-height: 5rem; margin-bottom: 4rem;} #referral .s3 .lstArea {flex-direction: column; gap: 7rem;} #referral .s3 .lstArea .lst {width: 100%} #referral .s3 .lstArea .lst .thumb {} #referral .s3 .lstArea .lst .tit {font-size: 2.4rem; padding: 2.8rem 0 1.7rem} #referral .s3 .lstArea .lst .info {} #referral .s3 .lstArea .lst .info li {font-size: 1.8rem; gap: 1.1rem} #referral .s3 .lstArea .lst .info li + li {margin-top: 0.4rem;} #referral .s3 .lstArea .lst .info li img {width: 2.6rem;} } /*==== 진료케이스 =====*/ #case {} #case .inner {padding: 14.2rem 0 18rem; max-width: 126.2rem;} #case .title {margin-bottom: 8rem;} #case .lstArea {gap: 3.4rem} #case .lstArea .lst {width: calc((100% - 10.2rem) / 4);} #case .lstArea .lst a {} #case .lstArea .lst a img {height: 100%; object-fit: cover} #case .btnArea {margin-top: 10rem;} #case .btnArea .moreBtn {padding: 1rem 2.9rem; border: 1px solid #162F9E; border-radius: 3.4rem; transition: 0.2s;} #case .btnArea .moreBtn:hover {background: #162F9E; color: #fff;} @media screen and (max-width: 880px) { #case {} #case .inner {padding: 11rem 0; max-width: 38.2rem;} #case .title {font-size: 3.4rem; margin-bottom: 4rem;} #case .lstArea {gap: 1.4rem;} #case .lstArea .lst {width: calc((100% - 1.4rem) / 2);} #case .lstArea .lst a {} #case .btnArea {margin-top: 7rem;} #case .btnArea .moreBtn {} } /*==== 공지사항 =====*/ #notice {} #notice .inner {max-width: 126rem; padding: 14.2rem 0 18rem} #notice .title {margin-bottom: 8rem;} #notice .search {margin-bottom: 3.6rem; justify-content: flex-end; gap: 1rem; height: 3.7rem; font-size: 1.4rem;} #notice .search select {border: 1px solid #C9CDD2; min-width: 9.4rem; border-radius: 0; padding: 0 1.4rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('../img/ic_select.svg') right 1.8rem center / 1.2rem 0.6rem no-repeat;} #notice .search input {height: auto; border: 1px solid #C9CDD2; box-shadow: none; min-width: 19.6rem; border-radius: 0} #notice .search button {background: #454C53; color: #fff; padding: 0 3.4rem; font-family: inherit;} #notice .ntcTable {border-top: 1px solid #222527} #notice .ntcTable thead {} #notice .ntcTable tbody {} #notice .ntcTable tr {} #notice .ntcTable tr.ntc {background: #F6F7F9} #notice .ntcTable th {padding: 2rem 0 1.7rem;} #notice .ntcTable td {padding: 2.8rem 0; border-bottom: 1px solid #C9CDD2;} #notice .ntcTable td.num {width: 8rem; text-align: center;} #notice .ntcTable td.subj {} #notice .ntcTable td.subj a {display: block; padding: 0 0.6rem} @media screen and (max-width: 880px) { #notice {} #notice .inner {padding: 11rem 0; max-width: 38.2rem;} #notice .title {font-size: 3.4rem; margin-bottom: 7rem;} #notice .search {} #notice .search select {width: 8.8rem; flex-shrink: 0; min-width: 0; padding: 0 1.2rem} #notice .search input {min-width: 0} #notice .search button {width: 8.9rem; flex-shrink: 0; padding: 0;} #notice .ntcTable {} #notice .ntcTable thead {font-size: 1.6rem;} #notice .ntcTable tbody {font-size: 1.6rem;} #notice .ntcTable tr {} #notice .ntcTable th {padding: 1.7rem 0} #notice .ntcTable td {padding: 2.2rem 0 2rem} #notice .ntcTable td.num {width: 5.6rem;} #notice .ntcTable td.subj {line-height: 2.6rem;} #notice .ntcTable td.subj a {padding: 0; padding-right: 1rem;} } #view {} #view .inner {padding: 14.2rem 0 18rem; max-width: 126rem} #view .subj {margin-bottom: 2rem;} #view .subt {margin-bottom: 2.6rem;} #view .cont {padding: 8rem 0; border-top: 1px solid #C9CDD2;} @media screen and (max-width: 880px) { #view {} #view .inner {max-width: 38.2rem; padding: 11rem 0;} #view .subj {margin-bottom: 1.4rem;} #view .subt {margin-bottom: 1.4rem;} #view .cont {padding: 4rem 0;} #view .cont img {max-width: 100%} } /*==== 채용 =====*/ #recruit {padding-top: 14.2rem;} #recruit .title_area {margin-bottom: 25rem;} #recruit .title_area .txt {margin-bottom: 2.8rem; letter-spacing: 0.1rem;} #recruit .title_area .tit {margin-bottom: 4.6rem;} #recruit .title_area .txt2 {line-height: 2.6rem;} #recruit h4.title {width: 127rem; margin-bottom: 6.1rem;} @media screen and (max-width: 880px) { #recruit {padding-top: 11rem;} #recruit .title_area {margin-bottom: 11rem;} #recruit .title_area .txt {font-size: 1.2rem; margin-bottom: 1.6rem;} #recruit .title_area .tit {font-size: 3.4rem; margin-bottom: 4rem;} #recruit h4.title {font-size: 2.6rem; width: 100%; margin-bottom: 4rem;} #recruit #s1 {padding: 0 2.4rem;} } #recruit .table_wrap {width: 127rem;} #recruit .table_wrap table {margin-bottom: 2.75rem;} #recruit .table_wrap thead th {background-color: #162F9E; padding: 1.7rem 0 1.4rem 0; border-right: 1px solid #C9CDD2; font-size: 2rem; color: #fff; font-weight: 400; text-align: center;} #recruit .table_wrap td {border: 1px solid #C9CDD2; padding: 1.7rem 0 1.4rem 0; color: #222527; font-size: 2rem; text-align: center;} #recruit .table_wrap td:not(.category) {font-size: 1.8rem; line-height: 2.8rem;} #recruit .table_wrap .border-bottom-light {border-bottom: 1px solid #C9CDD2 !important; } #recruit .table_wrap .txt {margin-bottom: 31rem;} @media screen and (max-width: 880px) { #recruit .table_wrap {width: 100%;} #recruit .table_wrap img {width: 38.2rem; margin-bottom: 2.4rem;} #recruit .table_wrap .txt {font-size: 1.2rem; margin-bottom: 11rem;} } #recruit .welfare_list {width: 139.6rem; gap: 2rem; margin-bottom: 36.8rem;} #recruit .welfare_list li {width: 33.4rem; height: 14.8rem; padding: 0 3rem; background: #fff; border: 1px solid #C9CDD2;} #recruit .welfare_list li .tit {line-height: 2.8rem;} #recruit .welfare_list li .txt {line-height: 2rem; margin-top: 0.8rem;} @media screen and (max-width: 880px) { #recruit .welfare_list {width: 38.2rem; gap: 0.6rem; margin-bottom: 11rem;} #recruit .welfare_list li {width: 18.8rem; height: 11.6rem; padding: 0 1.6rem 0 1.4rem;} #recruit .welfare_list li .tit {font-size: 1.4rem; line-height: 2.2rem;} #recruit .welfare_list li .txt {font-size: 1.2rem; line-height: 1.8rem; margin-top: 0.4rem;} #recruit .welfare_list li img {width: 4.4rem;} #recruit .welfare_list li.type2 img {position: absolute; top: 1.4rem; right: 1.4rem;} } #recruit .pro_img {margin-bottom: 6.8rem;} #recruit .pro_txt {width: 56.8rem; padding: 1.6rem 0 1.3rem 0; background: #EEF0F3; border-radius: 2.5rem; margin-bottom: 45.8rem;} @media screen and (max-width: 880px) { #recruit .pro_img {margin-bottom: 3.9rem;} #recruit .pro_img img {width: 38.2rem;} #recruit .pro_txt {width: 34.4rem; padding: 1.2rem 0 1.1rem 0; margin-bottom: 11rem;} #recruit .pro_txt p {font-size: 1.2rem;} } #recruit .flex_bx {width: 131.7rem; margin-bottom: 28.5rem;} #recruit .flex_bx h4.title {width: auto; margin: 0;} #recruit .flex_bx .list {width: 82.8rem; padding-top: 0.8rem;} #recruit .flex_bx .list li {gap: 1.8rem; margin-bottom: 3.3rem; padding-bottom: 3.3rem; border-bottom: 1px solid #C9CDD2;} #recruit .flex_bx .list li:last-child {margin-bottom: 0; padding-bottom: 0; border-bottom: none;} @media screen and (max-width: 880px) { #recruit .flex_bx {width: 38.2rem; flex-direction: column; gap: 4rem; margin-bottom: 11rem;} #recruit .flex_bx .list {width: 38.2rem; padding-top: 0;} #recruit .flex_bx .list li {align-items: flex-start; gap: 1.2rem; margin-bottom: 2.7rem; padding-bottom: 2.9rem;} #recruit .flex_bx .list li p {font-size: 1.8rem; line-height: 2.8rem;} #recruit .flex_bx .list li img {width: 1.8rem; margin-top: 0.5rem;} } #recruit #s2 {padding: 15rem 0; background: #F6F7F9;} #recruit #s2 .list {width: 130rem; gap: 6rem;} #recruit #s2 .list li {width: 61.8rem; height: 38.6rem; padding: 5.1rem 5.8rem 0 5.8rem; background: #fff;} #recruit #s2 .list li .tit {padding-bottom: 3.7rem; margin-bottom: 4.4rem; border-bottom: 1px solid #C9CDD2;} #recruit #s2 .list li .txt {line-height: 3.2rem;} #recruit #s2 .list li .btn {display: block; margin-top: 2rem;} @media screen and (max-width: 880px) { #recruit #s2 {padding: 7rem 0;} #recruit #s2 .list {flex-direction: column; width: 38.2rem; gap: 2rem;} #recruit #s2 .list li {width: 38.2rem; height: 23.2rem; padding: 4.4rem 1rem 0 1rem;} #recruit #s2 .list li:nth-child(2) {height: 30.1rem;} #recruit #s2 .list li .tit {font-size: 2.4rem; margin-bottom: 1.8rem; padding-bottom: 1.9rem;} #recruit #s2 .list li .txt {font-size: 1.6rem; line-height: 2.6rem;} #recruit #s2 .list li .btn {margin-top: 2.2rem} #recruit #s2 .list li .btn img {width: 20.5rem;} } #recruit #s3 {padding: 21.6rem 0 18rem 0;} #recruit .faq_list {width: 125.8rem; border-top: 0.1rem solid #222527;} #recruit .faq_item {border-bottom: 0.1rem solid #222527; transition: all 0.3s ease; } #recruit .faq_question {padding: 3.1rem 0 2.8rem 1.2rem; cursor: pointer; display: flex; justify-content: space-between; align-items: center; position: relative; } #recruit .faq_question::before {content: ''; position: absolute; top: 3.8rem; right: 0.7rem; width: 2rem; height: 2rem; background-image: url('../img/06/recruit_arr.png'); background-repeat: no-repeat; background-size: 100%; transition: all 0.3s;} #recruit .active .faq_question::before {transform: rotate(180deg); top: 2.9rem;} #recruit .faq_answer { max-height: 0; overflow: hidden; transition: all 0.3s ease-out; background-color: #fff; } #recruit .faq_item.active .faq_answer {max-height: 20rem; padding: 2.9rem 0 5.4rem 0; border-top: 1px solid #C9CDD2;} #recruit .faq_answer p {padding-left: 1.2rem; line-height: 2.8rem;} @media screen and (max-width: 880px) { #recruit #s3 {padding: 11rem 2.4rem;} #recruit .faq_list {width: 38.2rem;} #recruit .faq_question {padding: 2.6rem 0 2.4rem 0; font-size: 1.6rem;} #recruit .faq_question::before {display: none;} #recruit .faq_item.active .faq_answer {padding: 2.5rem 0 3.9rem 0;} #recruit .faq_answer p {font-size: 1.4rem; line-height: 2.4rem; padding-left: 0;} } .pg_wrap {float: none; display: flex; justify-content: center; margin-top: 6rem;} .pg_wrap::after{display: none} .pg {font-size: 1.2rem; display: flex; gap: 0.4rem;}