 @charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:420px !important;}
.root_daum_roughmap .wrap_map {height:420px !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"옥정탑내과"; font-size:12px; line-height:15px;}


.doc-tit {position:relative; width: fit-content; margin: 0 auto var(--margin-50); font-weight:700; font-size: var(--font-size-40); letter-spacing: -0.02em; color: #242424; text-align:center;} 
.doc-tit::after {content: ""; position: absolute; top: -4px; right: -4px; width: 8px; height: 8px; background-color: rgba(237, 28, 36, 0.8);} 

.doc-cnt {padding:var(--padding-80) 0;} 
.doc-cnt:last-child {padding-bottom:0;} 
.doc-cnt.bg-grey {background-color: #f4f4f4;} 

.bullet-item .bullet-list {position:relative; padding-left:7px; margin-top:6px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:2px; height:2px; background:#454545; border-radius:50%;}
.bullet-item2 .bullet-list {position:relative; padding-left:10px; margin-top:6px; line-height:1.3;}
.bullet-item2 .bullet-list:first-child {margin-top:0;}
.bullet-item2 .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:6px; height:2px; background:#454545;}
.bullet-item2.non .bullet-list {padding-left:0;}
.bullet-item2.non .bullet-list::before {display:none;}

/* 병원소개 */          
.greeting-area {overflow:hidden;}
.greeting-area .img-box {flex:1 0 450px; max-width:450px; margin-right:clamp(20px, -1.6071rem + 4.4643vw, 60px);}
.greeting-area .text-box {flex:1 0 auto; width:1%; padding-top: clamp(20px, 0.8438rem + 1.0156vw, 33px); background:url(../images/sub/greet-logo.png) no-repeat right 42px bottom;}
.greeting-area .text-tit {margin-bottom:clamp(25px, 1.25rem + 0.7813vw, 35px); padding-bottom:clamp(20px, 1.0625rem + 0.4688vw, 26px); border-bottom:1px solid #ddd; font-size:var( --font-size-36-22); font-weight:bold; color:#242424;}
.greeting-area .main-color {font-weight:500;}
.greeting-area .sort {display:inline-flex; align-items:center; justify-content:center; padding:0 18px; height:32px; border-radius:20px; background:var(--color-1); color:#fff; font-size:var(--font-size-15); font-weight:600;} 
.greeting-area .bullet-item {margin-top:clamp(15px, 0.8438rem + 0.2344vw, 18px);}

.eq-aera .tab-box {max-width:880px; width:100%; margin:0 auto; padding-bottom:clamp(35px, 0.9063rem + 3.2031vw, 76px);}
.eq-aera .tabs {display:flex; flex-wrap:wrap; margin:0 clamp(-5px, 0.1563rem + 0.3906vw, -10px);}
.eq-aera .tab {flex:1 0 20%; max-width:20%; padding:0 clamp(5px, 0.1563rem + 0.3906vw, 10px);}
.eq-aera .tab.active a {background:var(--color-2); border-color:var(--color-2); color:#fff;}
.eq-aera .tab a {display:inline-block; width:100%; height:clamp(36px, 1.9375rem + 0.7813vw, 46px); line-height:clamp(36px, 1.9375rem + 0.7813vw, 46px); border:1px solid #ddd; border-radius:25px; font-size:var(--font-size-18-15); font-weight:500; text-align:center;}
.eq-aera .tab-content {text-align:center;}
.eq-aera .tab-content .dec {font-size:var(--font-size-22-16); font-weight:600; color:#242424;}
.eq-aera .tab-content .img {display:flex; align-items:center; justify-content:center; padding:15px; margin-top:clamp(20px, 0.9375rem + 0.7813vw, 30px); height:500px; border:1px solid #ddd;}

.diag-aera .flxWrap {border-radius:20px; overflow:hidden;}
.diag-aera .imgbx {flex:1 0 580px; max-width:580px;}
.diag-aera .textbx {flex:1 0  auto; width:1%; background:#f4f4f4;}
.diag-aera .inner {padding: clamp(20px, 0.4063rem + 2.9375vw, 47px);}
.diag-aera .day-item {display:flex; flex-wrap:wrap; margin-top:-27px;}
.diag-aera .day-list {flex:1 0 205px; max-width:205px; padding-top:27px;}
.diag-aera .day-list .box {padding-left:clamp(20px, 0.9375rem + 0.7813vw, 30px); background:url(../images/sub/right-icn.png) no-repeat left top 5px;}
.diag-aera .day-list .day {font-size:var(--font-size-25-18); font-weight:bold; line-height:1.1; color:#242424;}
.diag-aera .day-list .time {display:inline-block; padding-top:14px; line-height:1.2;}
.diag-aera .text-strong {padding-top:24px; font-size:var(--font-size-18-15); font-weight:bold; color:#ff0000;}
.diag-aera .icn-item {display:flex; margin-right:-29px; margin-top:clamp(25px, 0.3438rem + 3.0469vw,64px);}
.diag-aera .icn-list {display:flex; align-items:center; padding-right:29px;}
.diag-aera .icn-list .icn {margin-right:clamp(8px, 0.3438rem + 0.3906vw, 13px);}
.diag-aera .icn-list .strong {font-size:var(--font-size-25-18); font-weight:bold; color:#242424;}

.location-area .info-item {display:flex; flex-wrap:wrap; margin:-15px; padding-top:34px;} 
.location-area .info-list {flex:1 0 25%; max-width:25%; padding:15px;}
.location-area .info-list .inner {display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding:34px 20px; border:1px solid #ddd; height:300px; border-radius:18px;}
.location-area .info-list .tit {padding-top:clamp(15px, 0.7188rem + 0.5469vw, 22px); line-height:1.1; font-size:var(--font-size-22-16); font-weight:600; color:#242424;}
.location-area .info-list .dec {padding-top:10px; line-height:1.7; text-align:center;}
.location-area .info-list:last-child .inner {background:var(--color-1); border:0; color:#fff;}
.location-area .info-list:last-child .tit2 {font-size:var(--font-size-25-18);}
.location-area .info-list:last-child .dec-list {padding-top:clamp(15px, 0.7188rem + 0.5469vw, 22px); text-align:center;}
.location-area .info-list:last-child .txt {padding-top:5px;}
.location-area .info-list:last-child .txt:first-child {padding-top:0;}
.location-area .info-list:last-child .txt.strong {display:inline-block; font-weight:bold; border-bottom:2px solid #fff;}
.location-area .info-list:last-child .last-text {padding-top:clamp(10px, 0.4375rem + 0.4688vw, 16px); font-size:var(--font-size-20-16); font-weight:bold;}

/* 병원둘러보기 */
.around-area .sub-swipe,
.around-area .main-swipe {position:relative; max-width:1260px; width:100%; margin:0 auto; padding-right:var(--container-space); padding-left:var(--container-space);}
.swiper .img img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;}
.mySwiper2 .img {position:relative; padding-bottom:58.33%; overflow:hidden;}
.mySwiper {margin-top:15PX;}
.mySwiper .img {position:relative; padding-bottom:65.79%; overflow:hidden;}
.mySwiper2 .btn-arrow:after {display:none;}
.mySwiper2 .btn-arrow {width:29px; height:53px;}
.mySwiper2 .swiper-button-next {background:url(../images/sub/main-right.png) no-repeat right center; right:40px;}
.mySwiper2 .swiper-button-prev {background:url(../images/sub/main-left.png) no-repeat left center; left:40px;}
.sub-swipe .btn-arrow {width:46px; height:46px; border-radius:50%; border:1px solid #ddd; background:#fff; top:50%;}
.sub-swipe .btn-arrow::after {font-size:20px; color:#242424;}
.sub-swipe .btn-arrow:hover {background:var(--color-2); border:0;}
.sub-swipe .btn-arrow:hover::after {color:#fff;}
.sub-swipe .swiper-button-next {right:0;}
.sub-swipe .swiper-button-prev {left:0;}
.sub-swipe .img::after {position:absolute; content:''; left: 0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.3);}
.sub-swipe .swiper-slide-thumb-active .img:after {background:0; border:3px solid var(--color-1);}

/* 내시경센터, 초음파클리닉 */
.gast-area {overflow:hidden;}
.gast-area .intro-box .tit {font-size:var(--font-size-40-20); font-weight:bold; color: var(--color-1); text-align:center; line-height:1.1;}
.gast-area .intro-box .img {padding-top:clamp(35px, 1.25rem + 2.3438vw, 65px); text-align:right;}
.content-box + .content-box {padding-top:clamp(35px, 1.0938rem + 2.7344vw, 70px);}
.sub-textbx + .sub-textbx {padding-top:clamp(25px, 1.3438rem + 0.5469vw, 32px);}
.sub-textbx .sor-sub + .sub-tit {margin-top:clamp(10px, 0.5rem + 0.3125vw,14px);}
.sub-textbx .sub-tit {padding-left:28px; font-size:var(--font-size-22-16); font-weight:600; color:#242424; background:url(../images/sub/right-icn.png) no-repeat left top 6px;}
.sub-textbx .sub-dec + .sub-tit2 {margin-top:18px;}
.sub-textbx .sub-tit2 + .sub-dec {padding-top:6px;}
.sub-textbx .sub-tit3 + .sub-tit {margin-top:15px;}
.sub-textbx .sub-tit2 {padding-left:16px; position:relative; font-size:var(--font-size-18-15); font-weight:600; color:#242424;}
.sub-textbx .sub-tit2::after {position:absolute; content:''; top:10px; left:0; width:6px; height:6px; border-radius:50%; background:var(--color-2);}
.sub-textbx .sub-tit3 {padding-left:16px; position:relative; font-size:var(--font-size-22-16); font-weight:600; color:#242424;}
.sub-textbx .sub-tit3::after {position:absolute; content:''; top:12px; left:0; width:6px; height:6px; border-radius:50%; background:var(--color-2);}
.sub-textbx .sub-tit + .bullet-item {margin-top:clamp(12px, 0.5938rem + 0.3906vw, 17px);}
.sub-textbx .sor-sub {display:inline-block; padding:0 20px; height:clamp(34px, 1.9375rem + 0.4688vw, 40px); line-height:clamp(34px, 1.9375rem + 0.4688vw, 40px); font-size:var(--font-size-18-15); font-weight:600; border-radius:20px; background:var(--color-1); color:#fff;}
.sub-textbx .sub-dec {padding-top:clamp(10px, 0.5rem + 0.3125vw, 14px); line-height:1.7;}
.sub-textbx .text-item {margin-top:clamp(10px, 0.5rem + 0.3125vw,14px);}
.sub-textbx .text-item.type2 {padding-left:28px;}
.sub-textbx .text-list {padding-top:5px;}
.sub-textbx .text-list:first-child {padding-top:0;}
.sub-textbx .text-list strong {color:#242424;}
.imglist-item {display:flex; flex-wrap:wrap; padding-top:clamp(18px, 0.9375rem + 0.4688vw, 24px);}
.imglist-item .text {padding-top:clamp(15px, 0.5625rem + 0.9375vw, 27px); line-height:1.7; text-align:center;}
.imglist-item.col4 {margin:-14px -16px;}
.imglist-item.col4 .imglist-list {flex:1 0 25%; max-width:25%; padding:14px 16px;}
.imglist-item.col2 {margin:-15px -20px;}
.imglist-item.col2 .imglist-list {flex:1 0 50%; max-width:50%; padding:15px 20px;}
.imglist-item.col3 {margin:0 -15px;}
.imglist-item.col3 .imglist-list {flex:1 0 33.33%; max-width:33.33%; padding:0 15px;}

.table-box {margin-top:clamp(12px, 0.5313rem + 0.5469vw, 19px);}
.table-box table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #242424;}
.table-box th,
.table-box td {padding:clamp(10px, 0.375rem + 0.625vw, 18px) clamp(14px, 0.375rem + 1.25vw, 30px); border-bottom:1px solid #ddd;}
.table-box th {background:#f4f4f4; font-weight:600; color:#242424;}
.table-box td {color:#454545;}

/* 진료과목 */
.trea-item {display:flex; flex-wrap:wrap;}
.trea-item .inner {position:relative;}
.trea-item .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; text-align:center; font-size:var(--font-size-36-16); font-weight:bold; color:#fff ;}
.trea-sort {display:inline-block; padding:0 20px; min-width:130px; height:clamp(34px, 1.9375rem + 0.4688vw, 40px); line-height:clamp(34px, 1.9375rem + 0.4688vw, 40px); text-align:center; font-size:var(--font-size-18-15); font-weight:600; border-radius:20px; background:var(--color-1); color:#fff;}
.trea-sort + .trea-item {padding-top:clamp(15px, 0.625rem + 0.7813vw, 25px);}
.trea-item.col2 {margin:-20px;}
.trea-item.col2 .trea-list {flex:1 0 50%; max-width:50%; padding:20px;}
.trea-item.col3 {margin:-15px;}
.trea-item.col3 .trea-list {flex:1 0 33.33%; max-width:33.33%; padding:15px;}
.trea-item.col3 .title {font-size:var(--font-size-30-16);}
.scroll-box {padding-top:clamp(30px, 0.9375rem + 2.3438vw, 60px);}
.img-colorbox {padding-top:clamp(15px, 0.4688rem + 1.1719vw, 30px);}
.img-colorbox .color-list {display:flex; flex-wrap:wrap; padding-top:clamp(10px, 0.3125rem + 0.7813vw, 20px);}
.img-colorbox .color-list:first-child {padding-top:0;}
.img-colorbox .color-title {flex:1 0 65px; max-width:65px; height:18px; text-indent:-999em; margin-right:14px;}
.img-colorbox .color-title.color1 {background:#cfccfd;}
.img-colorbox .color-title.color2 {background:#ffe4f7;}
.img-colorbox .color-title.color3 {background:#ff0000;}
.img-colorbox .color-dec {flex:1 0 auto; width:1%; display:flex;}
.img-colorbox .color-dec .tit {font-weight:bold; color:#242424;}
.img-colorbox .color-dec .dec {flex:1;}

.bullet-item + .text-item3 {padding-top:clamp(30px, 1.25rem + 1.5625vw, 50px);}
.sub-textbx + .table-box2 {padding-top:clamp(35px, 1.0938rem + 2.7344vw, 70px);}
.text-item3 .text-list {display:flex; padding-top:2px; line-height:1.6;}
.table-box2 table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #242424;}
.table-box2 table th,
.table-box2 table td {padding:19px 5px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.table-box2 table th:last-child,
.table-box2 table td:last-child {border-right:0;}
.table-box2 table th {background:#f4f4f4; font-weight:600; color:#242424; }
.table-box2 table td {line-height:1.7;}

/* 건강검진센터 */
.check-area {overflow:hidden;}
.head-box {position:relative; margin-bottom:clamp(20px, 0.625rem + 1.5625vw, 40px); height:clamp(200px, 8.4375rem + 10.1563vw,330px); border-radius:20px; overflow:hidden;}
.head-box .text {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; color:#fff;}
.head-box .title {font-size:var(--font-size-36-22); font-weight:bold;}
.head-box .dec {display:inline-block; padding-top:clamp(10px, 0.5rem + 0.3125vw, 14px);}
.head-box.bg1 {background:url(../images/sub/check-bg1.jpg) no-repeat center center; background-size:cover;}
.head-box.bg2 {background:url(../images/sub/check-bg2.jpg) no-repeat center center; background-size:cover;}
.trea-sort + .sub-tit {margin-top:clamp(10px, 0.5rem + 0.3125vw, 14px);}
.sub-dec + .bullet-item {margin-top:9px;}
.sub-textbx + .sub-textbx2 {margin-top:clamp(20px, 0.8438rem + 1.0156vw, 33px);}
.subtit3 {font-size:var(--font-size-18-15); font-weight:600; color:#242424;}
.subtit3 + .bullet-item2 {margin-top:clamp(10px, 0.4688rem + 0.3906vw, 15px);}
.sub-dec2 {font-size:var(--font-size-18-15); font-weight:600; color:#242424;}
.sub-textbx2 .sub-dec2 {margin-bottom:clamp(15px, 0.5625rem + 0.9375vw, 27px);}
.check-item {display:flex; flex-wrap:wrap; margin:-15px;}
.check-item.col2 .check-list {flex:1 0 50%; max-width:50%; padding:15px;}
.pcc-img {padding-top:clamp(20px, 0.7813rem + 1.1719vw, 35px); text-align:center;}
.sub-dec + .bullet-item2 {margin-top:clamp(10px, 0.4688rem + 0.3906vw, 15px);}
.sub-textbx2 .flxWrap {align-items:center;}
.sub-textbx2 .imgbx {padding-right:clamp(30px, -9.0625rem + 10.9375vw, 65px);}
.sub-textbx2 .flxWrap.last .imgbx {padding-right:clamp(30px, -1.25rem + 3.125vw, 40px);}
.proceccbx {display:flex; align-items:center;}
.proceccbx .circle {display:flex; align-items:center; justify-content:center; width:200px; height:200px; border-radius:50%; background:linear-gradient(-45deg, #58abc1, #7fd858);}
.proceccbx .circle .tit {font-size:var(--font-size-22-16); font-weight:600; color:#fff; line-height:1.5; text-align:center;}
.proceccbx .plus {padding:0 clamp(15px, -3.75rem + 4.6875vw, 30px);}

.ageWrap {padding:87px 100px 80px 100px; background:#f1e6dd url(../images/sub/check-logo.png) no-repeat right 26px top 23px; border-radius:18px;}
.ageWrap .title {text-align:center; color:#f72625; font-size:var(--font-size-50-20); font-weight:500; line-height:1.4;}
.ageWrap .inner {display:flex; justify-content:center; margin-top:clamp(10px, -0.5rem + 2.8125vw, 46px); padding:60px 20px 110px; background:#fff; border-radius:20px;}
.ageWrap .period-list {display:flex; align-items:center; padding-top:clamp(20px, 0.625rem + 1.5625vw, 40px);}
.ageWrap .period-list:first-child {padding-top:0;}
.ageWrap .namebx {display:flex; align-items:center;}
.ageWrap .name {display:inline-block; height:clamp(35px, 1.5938rem + 1.4844vw, 54px); line-height:clamp(35px, 1.5938rem + 1.4844vw, 54px); flex:1 0 180px; width:180px; text-align:center; border-radius:30px; background:var(--color-1); color:#fff; font-size:var(--font-size-18-14); font-weight:bold;}
.ageWrap .name-dec {flex:1 0 184px; width:184px; padding-left:clamp(10px, 0.4063rem + 0.5469vw, 17px); font-size:var(--font-size-20-16); font-weight:500;}
.ageWrap .arrow {margin-right:clamp(20px, 0.625rem + 1.5625vw, 40px);}
.ageWrap .period {flex:1; position:relative; font-size:var(--font-size-26-16); font-weight:500; color:#242424;}
.ageWrap .small {position:absolute; bottom:-57px; width:100%; font-size:clamp(14px, 0.8125rem + 0.1563vw, 16px); color:#454545; font-weight:500;}

.checktext {margin-top:clamp(10px, 0.2813rem + 0.8594vw, 21px);}
.checktext .checktext-list {padding-top:clamp(5px, 0.1875rem + 0.3125vw, 9px);}
.checktext .box {display:flex;}
.checktext .tit {display:flex; align-items:center; justify-content:center; flex:1 0 150px; max-width:150px; color:#fff; font-size:var(--font-size-20-16); font-weight:600;}
.checktext .decbx {flex:1 0 auto; width:1%; padding:clamp(15px, 0.0625rem + 2.1875vw, 43px) clamp(10px, -0.125rem + 1.875vw, 34px);}
.checktext .checktext-list:nth-child(odd) .tit {background:var(--color-1);}
.checktext .checktext-list:nth-child(odd) .decbx {background:rgba(88, 171, 193, 0.1);}
.checktext .checktext-list:nth-child(even) .tit {background:var(--color-2);}
.checktext .checktext-list:nth-child(even) .decbx {background:rgba(127, 216, 88, 0.1);}

.flxWrap.last-check {align-items:center;}
.flxWrap.last-check .img2 {margin-right:clamp(20px, -0.625rem + 4.6875vw, 80px);}