@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 380 / var(--inner) * 100vw ), 380px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 380 / var(--inner) * 100vw ), 380px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"홈케어산후도우미"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:10px; margin-top:10px; line-height:1.3; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px);}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0 !important;}
.bullet-item .bullet-list.none::before {display: none !important;}

.bg-gray {background:#fbfbfb;}
.font17 {font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px);}

.markbx .marktxt {display: inline-block; position: relative; font-size: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); font-weight: bold;}
.markbx .marktxt:after {position: absolute; content: ''; left: 0; bottom: 2px; width: 100%; height:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); background: #ffb0d0; z-index: -1;}
.contwrap {overflow: hidden;}
.contwrap + .contwrap {margin-top:clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.incontwrap + .incontwrap {margin-top:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}

.aboutbx {padding-bottom: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); position: relative; overflow: hidden;}
.aboutbx:after {position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 460px; background:#fff9fb;z-index: -1;} 
.aboutbx .flxWrap {align-items: center;}
.aboutbx .imgbx {flex: 1 0 640px; max-width: 640px; margin-right: clamp(20px, calc( 100 / var(--inner) * 100vw ), 100px);}
.aboutbx .textbx {flex: 1 0 auto; width: 1%; letter-spacing:-0.5px;}
.aboutbx .eng {display: block; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; color:var(--color-fourth);} 
.aboutbx .title {padding-top:clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px); font-size: clamp(22px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold; }
.aboutbx .decbx {padding-top: clamp(30px, calc( 88 / var(--inner) * 100vw ), 88px);}
.aboutbx .dec {font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color: #454545;}
.aboutbx .dec + .dec {padding-top:clamp(18px, calc( 35 / var(--inner) * 100vw ), 35px); line-height: 1.7;}

.intxtbx {padding: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px) clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px); box-shadow:0 3px 7px rgba(0, 0, 0, 0.2);}
.intxtbx .topbx {text-align: center;}
.intxtbx .bottombx {padding-top: clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px);}
.intxtbx .title {padding-bottom: clamp(30px, calc( 55 / var(--inner) * 100vw ), 55px); margin-bottom: clamp(30px, calc( 55 / var(--inner) * 100vw ), 55px); position: relative; font-size: clamp(20px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold;}
.intxtbx .title:after {position: absolute; content: ''; left: 50%; bottom: 0; transform: translateX(-50%); width:clamp(60px, calc( 100 / var(--inner) * 100vw ), 100px); height: 2px; background: #ddd;}
.intxtbx .txt1 {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 500; line-height: 1.6;}
.intxtbx .txt2 {font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color: #454545; line-height: 1.7;}
.intxtbx .color {color: #242424;}
.intxtbx .tel {font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); font-weight: 600;}
.intxtbx .txt1 + .txt2 {padding-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.intxtbx .txt2 + .tel {padding-top:clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px);}
.intxtbx .flxWrap {flex-direction: row-reverse; align-items: center; justify-content: space-between;}
.intxtbx .imgbx {flex:1 0 610px; max-width: 610px; margin-left: 20px;}
.intxtbx .txtbx {flex: 1 0 auto; width: 1%;}
.intxtbx .textbx {flex: 1 0 auto; width: 1%;}
.intxtbx .markbx {margin-bottom:clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px);}
.intxtbx .intopmid {padding-top: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); max-width: 520px; width: 100%; margin: 0 auto;}
.intxtbx .bullet-item + .tel {padding-top:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.intxtbx .imgitem {display: flex; flex-wrap: wrap; margin:-20px;}
.intxtbx .imglist {flex: 1 0 50%; max-width: 50%; padding: 20px;}

.mapflxWrap {display: flex; flex-wrap: wrap; flex-direction: row-reverse;} 
.mapflxWrap .mapwrap {flex: 1 0 950px; max-width: 950px; margin-left: 20px;}
.mapflxWrap .map {border-radius: 20px; overflow: hidden;}
.mapflxWrap .addr {margin-top: clamp(15px, calc( 32 / var(--inner) * 100vw ), 32px); font-size: clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600;}
.mapflxWrap .textbx {flex: 1 0 auto; width: 1%;}
.mapflxWrap .title {padding-top:clamp(15px, calc( 26 / var(--inner) * 100vw ), 26px); position: relative; font-size: clamp(22px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold;}
.mapflxWrap .title:after {position: absolute; content: ''; left: 0; top: 0; width:clamp(3px, calc( 7 / var(--inner) * 100vw ), 7px); height: clamp(3px, calc( 7 / var(--inner) * 100vw ), 7px); border-radius: 50%; background:var(--color-secondary);}
.mapflxWrap .addritem {padding-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.mapflxWrap .addrlist + .addrlist {margin-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.mapflxWrap .addrlist span {display: block; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color: #454545;}
.mapflxWrap .addrlist .name {margin-bottom:clamp(10px, calc( 14 / var(--inner) * 100vw ), 14px); color:var(--color-secondary); font-weight: bold;}

.inpd {padding: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) 0;}
.inpd .flxWrap {align-items: center;}
.inpd .imgbx {flex: 1 0 600px; max-width: 600px; margin-right: clamp(15px, calc( 60 / var(--inner) * 100vw ), 60px);}
.inpd .textbx {flex: 1 0 auto; width: 1%;}
.inpd .textbx .subtt {font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; color:var(--color-secondary);}
.inpd .textbx .subtt + .bullet-item {padding-top: clamp(12px, calc( 22 / var(--inner) * 100vw ), 22px);}
.inpd .textbx .bullet-list::before {background: #454545;}
.inpd .textbx .desc {color: #454545; line-height: 1.7;}
.inpd .textbx .desc + .desc {padding-top:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px) ;}

.tblbx table {border-top: 1px solid var(--color-secondary);}
.tblbx table span {display: block;}
.tblbx table th,
.tblbx table td {padding: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px); text-align: center; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd;line-height: 1.7; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px);}
.tblbx table th:last-child,
.tblbx table td:last-child {border-right: 0;}
.tblbx table th {background:#fff9fb; font-weight: 500;}
.tblbx table td {color: #454545;}
.tblbx.type2 table thead th {padding: clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) clamp(5px, calc( 15 / var(--inner) * 100vw ), 15px);}
.tblbx.type2 table td {padding: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px) 5px;}
.tblbx.type2 .smpd {padding: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px) 5px;}
.tblbx table .bg-gray {background: #f2f2f2;}
.tblbx table .bg-blue{background: #f3f6ff; }
.tblbx table .bg-pink {background: #fff9fb;}
.tblbx table .bg-yellow {background: #fffce9;}

.warntxt {margin-bottom:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600;}
.conbullet .bullet-list + .bullet-list {margin-top: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.conbullet .bullet-list {padding-left: 12px; font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; line-height: 1.6;}
.conbullet .bullet-list::before {top: clamp(10px, calc( 13 / var(--inner) * 100vw ), 13px); width: clamp(3px, calc( 5 / var(--inner) * 100vw ), 5px); height: clamp(3px, calc( 5 / var(--inner) * 100vw ), 5px);}
.conbullet .bullet-list .txt {display: block; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); font-weight: 400; color: #454545;}

.workhead {margin-bottom:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px);}
.workhead .small {display: block; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; color:var(--color-secondary);}
.workhead .small + .tit {padding-top: 10px;}
.workhead .tit {font-size:clamp(20px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold;}
.workbody {padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.workbody .worklist + .worklist {margin-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.workbody .flxWrap {flex-direction: row-reverse;}
.workbody .imgbx {flex:1 0 700px; max-width: 700px; margin-left: 20px;}
.workbody .textbx {flex: 1 0 auto; width: 1%;}
.workbody .name {display: block; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; color: var(--color-secondary);}
.workbody .name + .dec {padding-top: 8px;}
.workbody .dec { font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color: #454545; line-height: 1.7;}
.workbody .dec + .dec {padding-top: 12px;}

.workbody .flxWrap.type2 {flex-direction: row;}
.workbody .flxWrap.type2 .textbx {flex: 1 0 50%; max-width: 50%;}

.inbgitem + .inbgitem {padding-top: 15px;}
.inbgitem {display: flex; flex-wrap:  wrap; margin:-15px -14px; padding:0 3px 10px;}
.inbglist {flex: 1 0 33.33%;  max-width: 33.33%; padding: 15px 14px;}
.inbglist.wid50 {flex: 1 0 50%; max-width: 50%;}
.inbglist .inner {padding:clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); background: #fff9fb; border-radius: 20px; box-shadow:0 3px 10px rgba(0, 0, 0,0.1); height: 100%; letter-spacing: -0.5px;}
.inbglist .name {display: block; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; color: var(--color-secondary);} 
.inbglist .desc {padding-top: clamp(15px, calc( 22 / var(--inner) * 100vw ), 22px); font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); }

.wrantoptxt {font-size: clamp(20px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold;}

.badtxtbx .subtt1 {font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; color: var(--color-secondary);} 
.badtxtbx .subtt2 {padding-top:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); font-size:clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color:#454545;} 
.badtxtbx + .fixitem {padding-top: clamp(25px, calc( 48 / var(--inner) * 100vw ), 48px);}
.fixitem {display: flex; flex-wrap: wrap; margin: -20px;}
.fixlist {flex: 1 0 50%; max-width: 50%; padding: 20px;}
.fixlist .inner {height: 100%; background: #fff9fb; border-radius: 20px; overflow: hidden;}
.fixlist .textbx { padding:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px); text-align: center; line-height: 1.7; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); font-weight: 600;} 

.bottomtxt {padding-top: 12px; font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px);  color: #454545;}

.proccitem + .proccitem {padding-top: 20px;}
.proccitem {display: flex; flex-wrap: wrap; margin:-20px;}
.procclist {flex: 1 0 25%; max-width: 25%; padding: 20px; position: relative;}
.procclist:after {position: absolute; content: ''; right: -7px; top: 50%; transform: translateY(-50%); width:clamp(14px, calc( 21 / var(--inner) * 100vw ), 21px); height: 15px; background: url(../images/sub/right.jpg) no-repeat; background-size: contain;}
.procclist:last-child:after {display: none;}
.procclist .inner {padding: clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); background: #fafafa; border-radius: 20px; height: 100%;} 
.procclist .num {display: inline-flex; align-items: center; justify-content: center; width:clamp(32px, calc( 48 / var(--inner) * 100vw ), 48px); height: clamp(32px, calc( 48 / var(--inner) * 100vw ), 48px); border-radius: 50%; background:var(--color-secondary); color: #fff; font-size:clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); font-weight: 600;}
.procclist .txtbx {padding-top: clamp(20px, calc( 48 / var(--inner) * 100vw ), 48px);}
.procclist .tit {font-size: clamp(16px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: bold;}
.procclist .desc {padding-top:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); font-size: clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color: #454545; line-height:1.7;}

.bdbox {padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.bdbox .flxWrap {align-items: center;}
.bdbox .imgbx {flex: 1 0 360px; max-width: 360px; margin-right:clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px);}
.bdbox .textbx {flex: 1 0 auto; width: 1%; letter-spacing: -0.5px;}
.bdbox .bullet-list {line-height: 1.7;}
.bdbox .bullet-list+.bullet-list {margin-top: 0;}
.bdbox .bullet-list::before {top: clamp(9px, calc( 13 / var(--inner) * 100vw ), 13px);}
.bdbox .bullet-item + .bottom {padding-top:clamp(14px, calc( 25 / var(--inner) * 100vw ), 25px);}
.bdbox .bottom {color: #454545; line-height:1.7;}

.badgecont {padding-bottom: 20px;}
.badgecont .flxWrap {align-items: center; justify-content: space-between;}
.badgecont .badge {display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; min-width: clamp(55px, calc( 60 / var(--inner) * 100vw ), 60px); height: clamp(28px, calc( 32 / var(--inner) * 100vw ), 32px); border: 1px solid var(--color-secondary); color: var(--color-secondary); border-radius: 16px; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600;}
.badgecont .text {font-size:clamp(14px, calc( 17 / var(--inner) * 100vw ), 17px); color:var(--color-secondary);}

.bx05_03.flxWrap {flex-direction: row-reverse;}
.bx05_03 .imgbx {flex: 1 0 700px; max-width: 700px; margin-left: 20px;}
.bx05_03 .textbx {flex: 1 0 auto; width: 1%;}
.inquirybx .buttons .cen .btn-pack {border-radius: 24px;}