@charset "utf-8";
* {box-sizing: border-box}

@import url("https://hangeul.pstatic.net/hangeul_static/css/nanum-square.css");

@font-face {
  font-family: 'UhBee';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_five@.2.0/UhBeeSe_hyun.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  }

:root {
    --swiper-theme-color:#FF7276!important;
    --primary:#FF7276;
    --red:rgba(255,88,88,0.9);
    --gray:rgba(112, 112, 112, 0.4);
    --grayText:rgba(112, 112, 112, 0.8);

    --line:#f4f5fa;
	  --lightline:#dde2ed;
    --lightPink:#FFF4F4;

    --b-milk:#FE9698;
    /*--powder-milk:#96B3FF;*/
    --powder-milk:#f46b7b;
    --baby-food:#AADCEE;
    --sleep:#AF9AF4;
    --diaper:#FFD945;
    --play:#9BDB5E;
    --sleep-cons:#51D9C2;
    --medicine:#F891EA;
    --pdas:#9e54d5;
}

#wrap {
  padding-right:constant(safe-area-inset-right);
  padding-left:constant(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
  padding-left:env(safe-area-inset-left);
}

.primary {color: var(--primary) !important;}
.red{color: var(--red)!important;}
.grayTxt{color: var(--grayText)!important;}
.bgGray{background: var(--line)!important;}
.fCol{color: var(--primary) !important;}

.bmilk{color: var(--b-milk)!important;;}
.powdermilk{color: var(--powder-milk)!important;;}
.baby-food{color: var(--baby-food)!important;;}
.sleep {color: var(--sleep)!important;;}
.diaper{color: var(--diaper)!important;;}
.play{color: var(--play)!important;;}
.sleep-cons{color: var(--sleep-cons)!important;;}
.medicine{color: var(--medicine)!important;;}

.bmilk-bg{background: var(--b-milk) !important;}
.powdermilk-bg{background: var(--powder-milk)!important;}
.baby-food-bg{background: var(--baby-food)!important;}
.sleep-bg {background: var(--sleep)!important;}
.diaper-bg{background: var(--diaper)!important;}
.play-bg{background: var(--play)!important;}
.sleep-cons-bg{background: var(--sleep-cons)!important;}
.medicine-bg{background: var(--medicine)!important;}

.w10{width:10%!important}
.w11{width:11.1%!important}
.w12{width:12.5%!important}
.w14{width:14.2%!important}
.w16{width:16.6%!important}
.w20{width:20%!important}
.w25{width:25%!important}
.w30{width:30%!important}
.w33{width:33.3%!important}
.w40{width:40%!important}
.w50{width:50%!important}
.w95{width:95%!important}
.w100{width:100%!important}
.maxW100{max-width: 100%}
.col2>li{width:50%}
.col3>li{width:33%;float:left;}
.col4>li{width:25%;float:left;}
.col5>li{width:20%}

.tL{text-align:left !important}
.tC{text-align:center !important}
.tR{text-align:right !important}

.f-left{float:left !important}
.f-right{float:right !important}

.d-flex {display: flex;}
.j-content-between{justify-content:space-between !important;}
.j-content-end{justify-content:end !important;}
.align-center{align-items: center}
.d-block{display: block!important;}
.positionR{position: relative!important;}

.mgt{margin-top:30px !important;}
.mgt1{margin-top:10px !important}
.mgt2{margin-top:20px !important}
.mgt-2{margin-top:-20px !important}
.mgl1{margin-left: 10px !important;}

.vT{vertical-align:top}
.vM{vertical-align:middle}
.underline{text-decoration: underline!important;}

h4{font-size: 0.9em;}
h3{font-size: 1em;}
.titTypeA{font-size:14px;font-weight: bold;}
.titTypeB{font-size:12px;font-weight: bold;color:#707070}

.ico-close{ background: url(/images/ico-close.svg) no-repeat center; }
.ico-search{ background: url(/images/ico-menu-search.svg) no-repeat center; }
.ico-info{ background: url(/images/ico-info.svg) no-repeat center; }
.ico-info>.ico-new{top:0;right:0}
.ico-favo{ background: url(/images/ico-star-line.svg) no-repeat center; }
.ico-favo.selected{background: url(/images/ico-star.svg) no-repeat center;}
.ico-arrow-left{background: url(/images/ico-arrow-left.svg) no-repeat left center;}
.ico-arrow-right{background: url(/images/ico-arrow-right.svg) no-repeat left center;}
.ico-photo{background: url(/images/ico-photo.svg) no-repeat left center;}
.ico-reply{background: url(/images/ico-reply.svg) no-repeat left center;}
.ico-3dots-hor{background: url(/images/ico-3dots-hor.svg) no-repeat left center;}
.ico-drag{background: url(/images/ico-drag.svg) no-repeat left center;}
.ico-check{background: url(/images/ico-check.svg) no-repeat left center;}
.ico-siren{background: url(/images/ico-siren.svg) no-repeat left center;}
.ico-check{background: url(/images/ico-check-white.svg) no-repeat left center;}
.ico-trash{background: url(/images/ico-trash-white.svg) no-repeat center;}
.ico-cog{background: url(https://icongr.am/material/cog.svg?size=26&color=ffffff) center no-repeat;}

.disabled{cursor:unset;opacity: .3;}

.container{margin:0 10px;}
.bar-block{display: block;border: 0;border-bottom: 6px solid var(--line);margin:8px 0 8px;}
.ver-line{border-left: 1px solid #c7c7c7; margin:0 9px}

.btn-primary{background-color: var(--primary)!important;color:rgba(255, 255, 255, 1)!important;}
.second-btn{background-color: rgb(179, 176, 176);color:rgba(255, 255, 255, 1)!important;}
.gray-btn{background-color: var(--line);color:rgba(0, 0, 0, 0.7)!important;}
.line-primary-btn{background-color: #fff !important;border:1px solid var(--primary);color:var(--primary)!important;}
.line-gray-btn{background-color: #fff;border:1px solid rgba(0, 0, 0, 0.25);color:rgba(0, 0, 0, 0.6)!important;}
.line-darkgray-btn{background-color: transparent;border:1px solid #666;color:#999!important;}
.btn-large{display: inline-block;width:100%;height:40px;padding:0 18px;text-align: center;border-radius: 4px;line-height: 36px;}
.btn-small{display: inline-block;height:26px;padding:1px 12px 1px;text-align: center;border-radius: 4px;box-sizing: border-box}
button:hover{opacity: .8;}


.line_box{clear: both; border: 1px solid var(--lightline);border-radius: 4px;background: #fff;padding:10px 16px 10px 16px;}
.bg_box{font-size: 13px;border-radius: 4px;background: var(--line);padding:10px 16px 10px 16px;margin:4px 0}
.btn_fixed {position: fixed;bottom: 16px;left: 3%;width: 94%!important;}
.btn_fixed.fmenu {bottom: 65px;}
.btn_segment{padding:10px 0;width:100%;}
.btn_segment .btn-small{border-radius: 0px;border-left-width: 0!important;background-color: #fff;border: 1px solid var(--primary);color: var(--primary);}
.btn_segment .btn-small:first-child{border-radius: 4px 0 0 4px;border-left-width: 1px !important;}
.btn_segment .btn-small:last-child{border-radius: 0px 4px 4px 0;}
.btn_segment .btn-small.selected{background-color: var(--primary);color: rgba(255, 255, 255, 1)!important;}
.btn_segment .btn-small.second{background: url(https://icongr.am/material/check-circle-outline.svg?size=20&color=bbbbbb) 12px center no-repeat;background-color: #f4f4f4;border: 1px solid #ccc;color: #888;}
.btn_segment .btn-small.second.selected{background: url(https://icongr.am/material/check-circle.svg?size=20&color=AF9AF4) 12px center no-repeat;background-color: rgba(175, 154, 244, 0.4);border-color:var(--sleep); color: var(--sleep)!important;font-weight: bold;}

a {text-decoration: none;color: inherit;}
.hidden-text {display: inline-block;text-indent: -9999px;}
.ad-banner{display: block;width: 100%;}
.ad-banner>img, .ad-google>img{width: 100%;height:60px;object-fit: cover;}
.ad-google{position: fixed;bottom:60px; display: block;width: 100%;height: 60px;}
.ad-google.only{bottom:0px;}

/** 아코디언**/
.noswitch{background: url(/images/ico-arrow-left.svg) right 10px top 50% no-repeat;background-size: 8px;transform: rotate( 180deg );width: 30px;height: 20px;display: inline-block;float: right;opacity: .3;}
.switch{background: url(/images/ico-arrow-down.svg) right 10px top 50% no-repeat;background-size: 14px;}
.switch-active{background: url(/images/ico-arrow-up.svg) right 10px top 50% no-repeat;}
.collapse--box{position: relative; display: block; width: 100%;}
.collapse--expand{width: 100%; display: none; overflow: hidden;padding:4px 10px;border-bottom: 1px solid var(--line);}

/* Accordion List*/
.accordion {cursor: pointer;width: 100%;background-color:#fff;outline: none;transition: 0.4s;} 
.accordion:hover {font-weight: bold;}
button.accordion:after{content: '';float:right;width:20px;height:20px;vertical-align: middle;background: url('/images/ico-arrow-left.svg') no-repeat center;background-size:6px;transform: rotate(-90deg);display: inline-block;}
button.accordion.active:after{background: url('/images/ico-arrow-left.svg') no-repeat center;transform: rotate(-270deg);background-size:6px;}
.panel {padding: 14px 1px 20px;display: none;background-color: white;overflow: auto}
.panel a {overflow: hidden;}

/** bottom up modal **/
.modal-bottomUp.modal-open .modal__box {top: 0;}
.modal__box {z-index: 11;background: #fff;width: 100%;height: 100%;margin: 0;padding: 0;transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);top: 100%;position: ;left: 0;/*overflow-y: auto;*/}
.modal__box .hd__menu{border-bottom: 1px solid var(--lightline);}
/* modal 스크롤 방지 */
.not_scroll{position: fixed;overflow: hidden;width: 100%;height: 100%;}
.fixed-ft {position: fixed;bottom: 0; z-index: 12;left: 0;width: 100%;height: 60px;box-sizing: border-box; background:#fff;padding:10px;}

/* custom select*/
.custom-select {width: 100%;position: relative;vertical-align: middle;display: inline-block;padding:4px 10px;color:#333;border:1px solid rgb(146 151 165 / 50%);height: 40px;border-radius: 4px;
background:#fff url(../images/ico-arrow-down-black.svg) right 10px top 48% no-repeat; background-size:14px; -webkit-appearance: none; -moz-appearance: none; appearance : none; }
.custom-select select {}
.select-selected {background-color:transparent;}
.select-selected:after {position: absolute;content: "";top: 42%;right: 12px;width: 0;height: 0; border: 6px solid transparent;border-color: rgba(0, 0, 0, 0.4) transparent transparent transparent; }
.select-selected.select-arrow-active:after {top: 30%;border-color: transparent transparent rgba(0, 0, 0, 0.4) transparent;}
.select-items div,  .select-selected {width:100%;height:40px;padding: 10px 34px 0 12px;border: 0px solid transparent;border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;cursor: pointer;user-select: none;}
/*style items (options):*/
.select-items {position: absolute;border-radius: 6px;border: 1px solid #ddd;background-color: rgba(255, 255, 255, 0.95);top: 100%;left: 0;right:0;z-index: 1;}
.select-hide {display: none;}
.select-items div:hover, .same-as-selected {background-color: rgba(0, 0, 0, 0.1);}

/* custom checkbox*/
.custom-checkbox{display:inline-block;position:relative;padding:2px 10px 0 28px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.custom-checkbox input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}
.checkmark{position:absolute;top:0;left:0;height:22px;width:22px;border-radius:4px;background-color:#fff;border:1px solid rgba(0, 0, 0, 0.16);}
.custom-checkbox:hover input~.checkmark{opacity: .5;}
.custom-checkbox input:checked~.checkmark{background-color:var(--primary);border: 0;}
.checkmark:after{content:"";position:absolute;display:none}
.custom-checkbox input:checked~.checkmark:after{display:block}
.custom-checkbox .checkmark:after{box-sizing: content-box;left:7px;top:3px;width:5px;height:10px;border:solid #fff;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}

/* custom radiobutton*/
.custom-radio{display:inline-block;position:relative;padding:0px 20px 0 32px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.custom-radio input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}
.radio-checkmark{position:absolute;top:0;left:0;height:22px;width:22px;border-radius:30px;background-color:#fff;border:1px solid rgba(0, 0, 0, 0.16);}
.custom-radio:hover input~.checkmark{opacity: .5;}
.custom-radio input:checked~.radio-checkmark{background-color:#fff;border: 1px solid var(--lightline);}
.radio-checkmark:after{content:"";position:absolute;display:none}
.custom-radio input:checked~.radio-checkmark:after{display:block}
.custom-radio .radio-checkmark:after{left:4px;top:4px;width:12px;height:12px;background: var(--primary);border-radius: 20px;}
.checkOrder .custom-radio{width:100%;margin:1px 0}
.checkOrder .check .radio-checkmark{background: var(--primary);text-align: center;color: #fff;line-height: 24px;border:0}

/* form */
textarea,input[type='text'],input[type='password'],input[type='tel'],input[type='number'],input[type='search'],input[type='email'],input[type='date'], select
{background-color: #fff; font-family: 'NanumSquareAcR', sans-serif;display:inline-block;border-radius:4px;width:100%;height:40px;padding:9px 10px 11px;border:1px solid rgb(146 151 165 / 60%);box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;color:#0c1041;font-size:14px;line-height:20px}
textarea:focus,input[type='text']:focus,input[type='password']:focus,input[type='tel']:focus,input[type='number']:focus,input[type='search']:focus,input[type='email']:focus,input[type='date']:focus{border-color:var(--primary)!important;}
textarea:disabled,input[type='text']:disabled,input[type='password']:disabled,input[type='tel']:disabled,input[type='number']:disabled,input[type='search']:disabled,input[type='email']:disabled,input[type='date']:disabled{background:#f3f3f3}
textarea[readonly],input[type='text'][readonly],input[type='password'][readonly],input[type='tel'][readonly],input[type='number'][readonly],input[type='search'][readonly],input[type='email'][readonly],input[type='date'][readonly]{border:1px solid #e6e6e6;background:#f3f3f3}
textarea{height: auto;}

#hr{height: 5px;width:100%;margin:20px 0;background:var(--line)}
.ico-new{overflow: hidden;position: absolute; top: 5px;right: 20px;width: 6px;height: 6px;text-indent: 9em;border-radius: 50%;background: #ef2b2a;}
.lyDim{z-index: 2; position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,0.5)}

@media (min-width: 768px) {
    #wrap,
    #contents{width: 100%; margin: 0 auto;}
}

body {width: 100%;height: 100vh;overflow: hidden;overflow-y: auto;font-family: 'NanumSquare', sans-serif;font-size: 14px;line-height: 1.4em;letter-spacing: -0.8px;font-weight: normal;color: #333;}
#wrap {width: 100%;min-height: 100vh;padding-bottom: 100px;position: relative;background: #fff;box-sizing: border-box;}
#header {position: sticky;position: -webkit-sticky;top: 0;background: rgba(255, 255, 255, 1);/*height: 50px;*/z-index: 3;transition: 0.5s;}
#header.trans {background: rgba(255, 255, 255, 1);border: 0;}
#header.pink {background: #FF7276;border: 0;color: #fff;}
#contents {position: relative;padding-bottom: 50px;/*height: 100vh;*/}

/**Header**************/
.hd__menu {position: relative;top: 0;display: flex;justify-content: space-between;align-items: center;width: 100%;height: 50px;padding: 6px 6px;margin: 0 auto;box-sizing: border-box;border-bottom: 1px solid var(--lightline);}
.hd__title {position: absolute;top: 50%;bottom: 50%;left: 50%;right: 50%;transform: translate(-50%, -50%) rotate(-0.03deg);display: block;height: 100%;width: 50%;text-align: center;font-size: 16px;font-weight: bold;padding-top: 17px;}

/*.hd__btn{height: 40px;}*/
.hd__btn>div {display: inline-block;width: 36px;height: 36px;margin: 0;padding:8px 6px;}
.hd__btn>div>a {display: block;width: 100%;height: 100%;background-repeat: no-repeat!important;background-size: contain!important;}
.hd__btn.delete>button {color:#fff!important;background: transparent;border: 1px solid #fff;}
.hd__btn.delete>a{width: 45px;height: 35px;display: inline-block;vertical-align: middle;}

#header.pink .btn-back>a {background: url(/images/ico-arrow-pre-white.svg) center;opacity: 1;}
.btn-close>a {background: url(/images/ico-close.svg) center;}
.btn-more{background: url(/images/ico-3dots.svg) center no-repeat;background-size: 20px;}
.btn-scrap{background: url(/images/ico-folder.svg) no-repeat center;background-size: 30px;}
.btn-back>a {background: url(/images/ico-arrow-pre.svg) center;opacity: .5;}

.terms {position: relative;text-decoration: none;color: #707070;}

#TopBtn {opacity: 0;display: none;position: fixed;position: -webkit-fixed;bottom:60px;width: 100%;z-index: 2;animation-duration: 0.1s;animation-fill-mode: forwards;}

#TopBtn button[class*="btn-"] {margin-bottom: 16px;position: absolute;right: 10px;bottom: 20px;width: 55px;height: 55px;border-radius: 50%;text-align: center;font-size: 12px;line-height: 14px; box-shadow: 0px 1px 6px 0px rgba(0,0,0,0.1);}
.btn-totop {background: url(/images/ico-arrow-top.svg) center no-repeat;background-size: 16px;background-color: #fff;border: 1px solid #e2e2e2;}
.btn-toMilkR {bottom: 80px!important;background-color: #fff;color:var(--primary);border: 1px solid var(--primary);}
.btn-toMilkL {bottom: 140px!important;background-color:#fff;color:var(--primary);border: 1px solid var(--primary);}
.btn-toSleep {background-color: var(--sleep);color:#fff;border: 1px solid #fff;}
.btn-d-day{left: 15px;position: absolute;bottom: 55px;width: 45px;height: 45px;border-radius: 50%;text-align: center;font-size: 13px;line-height: 14px; box-shadow: 0px 1px 6px 0px rgba(0,0,0,0.1);background-color: #fff;color:var(--primary);border: 1px solid var(--primary);}
.btn-toMilkL.control, .btn-toMilkR.control, .btn-toSleep.control{right: 70px !important;}

.inner-input {border: 0;border-bottom: 1px solid #CCC;border-radius: 0;padding: 0 8px;width: 100%;height: 48px;box-sizing: border-box;}
.inner-input:focus {outline: none;}
input[type=checkbox].ic-psw {width: 1px;height: 1px;overflow: hidden;position: absolute;left: -9999px;}
input[type=checkbox].ic-psw+label {display: inline-block;width: 40px;height: 40px;background: url(/images/ico-eye.svg) center no-repeat;background-size: 24px;position: absolute;right: 4px;opacity: .3;}
input[type=checkbox].ic-psw:checked+label {background: url(/images/ico-eye-close.svg) center no-repeat;background-size: 24px;}
input[type=password] {font-family:'Malgun gothic', dotum, sans-serif;} 

/**로그인**/
.login_wrap {padding: 50px 24px 20px;}
.login_wrap>h1 {color: var(--primary);font-size: 22px;font-weight: bold; padding:10px 0 10px}
.login_wrap>h2 {color: var(--primary);font-size: 24px;font-weight: bold; padding:4px 0 36px;line-height: 30px;}
.login_wrap>h3 {font-size: 13px;color:var(--grayText);margin-top: 10px;}

.kakao-login{color:#3b1e1e;font-size: 16px;background:#FEE500 url(/images/logo-kakao.png) 20px center no-repeat;background-size: 26px!important;}
.sns-account{width:65%;display: flex; justify-content: space-between; margin:60px auto 40px;}
.sns-account > li{display: inline-block; width: 50px; height: 50px; }
.sns-account > li > a{display: inline-block; width: 100%; height: 100%; background-size: 100%;border-radius: 100%;text-indent: -9999px;}
.sns-kakao{background:#FEE500 url(/images/logo-kakao.png) center no-repeat;background-size: 56%!important;}
.sns-naver{background: url(/images/logo-naver.png) center no-repeat;background-size: 100%!important;}
.sns-google{background:url(/images/logo-google.svg) center no-repeat;border: 1px solid var(--lightline);}
.sns-apple{width:50px;height:50px;display:block;margin:10px auto 40px; border-radius: 100%;background:var(--lightline) url(/images/logo-apple.png) center no-repeat;background-size: 70%!important;}

.login_wrap.signup{padding: 20px 24px 20px;}
.signup_intro {text-align: center;background: url(/images/illu-welcome.svg) center no-repeat;background-size: 78%;width: 100%;height: 250px;margin: -20px auto 10px;}
.overlap-confirm{position: absolute;right: 7px;top:5px;padding:5px 10px;color: var(--grayText);background: var(--lightline);border-radius: 2px;}
.overlap-confirm.num {right: 54px; background: none;color: var(--primary);}

.regBaby_wrap{height: 100vh;background:#fff;padding:20px;}
.regBaby_wrap>h2{padding-bottom:20px;color:var(--primary);font-size: 18px;}
.regBaby_sellect{display: flex;justify-content: space-between;}
.regBaby_sellect>a{width:49%;padding:30px 20px;border-radius: 10px;border-color:#ffcbcf}
.regBaby_form li{display: flex;justify-content: space-between; width:100%;padding:3px 0;}
.regBaby_form li strong{width:24%;text-align: center;font-size: 12px; padding:3px;background: var(--lightPink);border-radius: 4px;color:var(--primary);line-height:34px}
.regBaby_form li .form{width: 74%;}
.regBaby_form li input{width:100%;padding:3px;background: var(--line)!important;border-radius: 4px;border:none}
.famliy-select li{display: inline-block; width:49%;padding: 10px 4px;}
.head-color>.color{width:56px;height:28px;margin-top: 5px;margin-right: 4px;border-radius:3px;background-color:var(--primary);display:inline-block}
.head-color>.color:nth-child(2), .head-color02{background-color:#00ACCB!important;}
.head-color>.color:nth-child(3), .head-color03{background-color:#03C98F!important;}
.head-color>.color.selected{background-image:url(https://icongr.am/material/check-circle-outline.svg?size=24&color=ffffff);background-position: center;background-repeat: no-repeat;}

.area-select li{display: inline-block; width:32.5%;padding: 3px 1px;}
.profile-box{margin:0 auto 20px;text-align: center;}
.profile{position: relative; width: 70px;height: 70px;border-radius: 100%;background:var(--line) url("/images/ico-babyface.svg") no-repeat center;display: inline-block;vertical-align: middle;}
.profile>img{width: 100%}
.profile.photo:after{content: '';width: 25px;height: 25px;display: inline-block;border-radius: 100%;border:3px solid #fff; background:var(--primary) url("https://icongr.am/material/camera.svg?size=16&color=ffffff") no-repeat center;position: absolute;right: -1px;bottom: -1px;}
.profile-box.photo-only>.profile {width: 100px;height: 100px;}
.profile-box.photo-only>.profile.photo:after{display: none;}

/**my account**/
.account_wrap {padding: 30px 20px 20px;}
.account_wrap input {margin-top:8px;}
.account_wrap input[type=checkbox].ic-psw+label{top:6px}
.account_wrap .overlap-confirm{top:18px}
.noline-option{padding: 1px 18px 1px 0px;margin-right:10px;border: 0;background: url(/images/ico-arrow-down-black.svg) no-repeat 100% 50%;background-size: 10px;}
.mypost_option{position: relative;padding-bottom: 10px;}
.mypost_option .trashBtn{position: absolute;right:0;top:1px}
.trashBtn{background: url(/images/ico-trash.svg) left top no-repeat;background-size: 20px;height: 24px;padding-left: 22px;;}
.count{font-size: 12px; padding: 1px 6px;width:60px;text-align: center;background: rgb(221 226 237 / 70%); border-radius: 10px;margin-left: 4px;}

.account_mypost_list > .list__type--line {position:relative;padding-left: 31px;}
.account_mypost_list > .list__type--line > .custom-checkbox {position: absolute;top:22px;left: 0px;}
.myreply_list .list__type--line {padding-bottom: 0;border: 1px solid var(--lightline);border-radius: 8px;}
.myreply_list .list__type--line .list__content {width:100%;padding: 10px 14px;position: relative;}
.myreply_list .list__type--line .list__content>a {position: absolute;right: 16px;bottom:6px;padding-left:20px;background-size: 16px;background-position:left center ;}
.myreply_list .list__content--info{background-color: var(--line);padding: 10px 14px;}
.myreply_list .list__content--info .list__info--writer {color:#333; font-size: 14px;font-weight: bold;}
.myreply_list .list__content--info p{font-size: 13px;color: #333;margin-top: 10px;}
.myreply_list > .list__type--line > .custom-checkbox {top:12px;left: 6px;}

.myfav .board__list{padding: 10px 0;}
.myfav .ico-drag, .myfav .ico-check {width: 20px;height: 20px;background-size: contain;}

.account_main .user_profile{background-color:var(--primary)}
.account_main .user_profile .user-id, .account_main .user_profile .user-id>h2{color:#fff}
.mymenu{display: flex;justify-content: space-between;}
.mymenu li{width:33%;font-size: 13px;}
.mymenu li a:before{content:'';display:block; margin:10px auto;border-radius: 100%;background-size: 26px!important;height: 50px;width:50px;opacity: .5;}
.mymenu li:first-child a:before{background: var(--lightline) url(/images/ico-star-line.svg) center no-repeat;}
.mymenu li:nth-child(2) a:before{background: var(--lightline) url(/images/ico-message.svg) center no-repeat;}
.mymenu li:nth-child(3) a:before{background: var(--lightline) url(/images/ico-help.svg) center no-repeat;}
.account_liked {margin-top: 20px;}
.account_liked .list__type--line {position: relative;}
.account_liked .moreBtn{top:4px;background-color: rgba(255, 255, 255, 0.8);border-radius: 4px;right: 4px;height: 30px;background-position: center;}
.noline-option.right{position: absolute;top: 0;right: 0;text-align: right;}

.account_custom{padding:20px 0}
.custom-subject{display: block;position: relative;border-bottom: 1px solid var(--line);padding:10px 0 14px;}
.custom-subject:last-child{border-bottom: 0px;}
.custom-subject>h2{font-size:16px;font-weight: bold;line-height: 36px;}
.custom-subject>h3{color:var(--grayText);font-size:12px;}
.custom-subject>.toggleWrap > div{right:10px;top:16px;}
.custom-subject>.lower{background: var(--line);padding:10px;border-radius: 4px;margin-top: 10px;}
.account_custom .bar-block{margin:8px 0 18px}
.account_custom .noswitch {position: absolute;right: 0;top: 18px;}
.chip-sort{position: relative;border:1px solid #ddd;background: rgba(255,255,255,0.8);padding:6px 10px;border-radius: 20px;display: inline-block;padding-right: 40px;margin:0 4px 4px 0;}
.chip-sort .ico-close{position: absolute;right: 6px !important;top:4px!important;width:23px!important;height:23px!important; background-color:var(--lightline);background-size: 13px!important;border-radius: 100%;}
.account_custom .custom-checkbox a{margin-left: 10px;color: var(--grayText);}
.account_sns{margin-top: 10px;}
.account_sns .custom-subject {padding-left: 50px;}
.account_sns div[class*="sns-"] {width: 40px;height: 40px;position: absolute;left: 0;top: 10px;border-radius: 100%;}
.cscenter {color: var(--grayText);font-size: 13px;margin-bottom: 20px;}
.cscenter h2 {color: #333;font-size: 16px;margin-bottom: 10px;}
.cscenter .bg{position: relative;padding-right:124px}
.cscenter .bg:after{content:'';background:url(/images/ill-cscenter.svg) center no-repeat;width: 130px;height: 130px;background-size: 110%;position: absolute;bottom: 0;right: -10px;}
.account_qna{margin-top: 20px;}
.account_qna .ico-photo{padding-left: 30px;background-size: 24px;line-height:30px;display: inline-block;opacity: .7;}
.account_qna .titTypeB{margin-top: 4px;font-weight: normal;}

.list__profile{width:40px;height:40px;border-radius: 100%;margin-right: 14px; background: var(--lightline);text-align: center;font-size: 16px;line-height: 40px;}
.account_note .list__type--line>a {align-items: start;}
.account_note .list__type--line{margin:0;padding: 10px 0 10px 10px;}
.list__type--line.no-read{background: var(--line);}
.account_note_pop{margin:20px 0;}
.account_note_pop .list__type--line .list__content{width:100%;border-bottom: 1px solid var(--lightline);padding:0 0 10px;margin-bottom: 10px;}
.pop_btn_group button[class*=ico-] {padding-left:24px;background-size: contain;}
.pop_btn_group{margin:20px 0}
.account_point .list__type--line{display: flex;justify-content: space-between;}
.mypoint{position: relative;text-align: center; width: 100%; background-color: var(--line);padding: 14px 0 14px 26px;margin: 6px 0 14px;border-radius: 10px;}
.mypoint:before{content: '';vertical-align: middle; position: absolute;left: 90px;top:10px; background:url(/images/ico-point.svg) center no-repeat;width: 50px;height: 50px;background-size: 72%;opacity: .8;}
.mypoint>strong{font-size: 24px;color: var(--primary);} 
.point-date{width: 50px;}
.point-value{text-align: right; width: 70px;padding-right: 8px;color: var(--grayText);}
.point-value>strong{color: var(--primary);font-weight: bold;font-size: 15px;padding-right: 4px;}

/**이용약관**/
.policy--wrap{width: 100%; height: 100%;}
.policy--chapter{position: relative; width: 100%; box-sizing: border-box; background: #FFF;border: 1px solid #ddd;border-radius: 6px;}
.policy--chapter > .chapter-select{width: 100%; line-height: 48px; padding: 0 16px; font-weight: bold; border-bottom: 2px solid var(--primary); background: url(/images/ico-arrow-down-black.svg) #FFF right 16px center no-repeat; background-size: 14px;}
.spot{line-height: 110px;}
.chapter-option{display: none;}
.chapter-option-open{display: block; position: absolute; left: 0; top: 50px; width: 100%; border: 1px solid #A0A0A0; box-sizing: border-box; background: #FFF;}
.chapter-option > li{width: 100%; line-height: 40px; padding: 0 16px; box-sizing: border-box; color: #707070; border-bottom: 1px solid #CCC; font-size: 0.9em;}
.chapter-option > li:last-child{border-bottom: 0;}
.policy--contents{padding: 20px 6px 60px; box-sizing: border-box;}
.policy--contents > p{margin-bottom: 8px}

/**FAQ**/
.question{display: flex; align-items: center; background-color: #FFF; padding:0 20px 0 3px; width: 100%; height: 55px; box-sizing: border-box; border-bottom: 1px solid #EAEAEA; transition: 0.4s; background: url(/images/ico-arrow-down.svg) right 10px center #FFF no-repeat; background-size: 12px; text-overflow: ellipsis;}
.question > span{width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.opened > span{text-overflow: inherit;}
.opened{background: url(/images/ico-arrow-up.svg) right 10px center #FFF no-repeat; background-size: 12px; border: 0;}
.panel{display: none; padding:0 4px 10px; background: #FFF; overflow: hidden;border-bottom: 1px solid #EAEAEA;}
.answer{width: 100%; box-sizing: border-box; padding:10px;background: var(--line); border-radius:4px; color: #707070;}


/**알림**/
.alert_wrap{margin:10px auto;}
.alert_wrap .list__type--line{padding:16px;margin:0;}
.alert_wrap .list__type--line:last-child{border-bottom:0}
.alert_wrap .board__list{margin:10px auto;}
.alert_wrap .list__content>h3{white-space:unset;line-height: 18px;font-weight: 500;}
.type-action {text-decoration: underline;width: 65px;font-size: 12px; color: var(--primary);}
.type-action:before {content: '';display: block;margin: 1px auto 5px; width:30px;height:30px;border-radius: 50px;opacity: .7; border:1px solid #999}
.type-action.friend:before {background: url(/images/ico-user.svg) center no-repeat; background-size: 22px; }
.type-action.notice:before {background: url(/images/ico-bell.svg) center  no-repeat; background-size: 18px; }
.type-action.contnets:before {background: url(/images/ico-like.svg) center   no-repeat; background-size: 22px; }


/** 이용약관 **/
.terms_wrap .container{padding: 10px 10px 40px;}
.terms_wrap h2{font-size:18px;font-weight: bold;line-height: 26px;margin: 15px auto;}
.terms_wrap h3{font-size:15px;font-weight: bold;}
.terms_wrap .con{font-size:13px;line-height: 18px;margin:10px auto 30px}
.terms_wrap ol li{list-style-type:decimal;margin:6px 0 4px 14px;}
.terms_wrap ol li>ol li{list-style-type:circle;margin-left: 10px;}

.terms_tbl {overflow-x:scroll !important;width:100%;margin-top: 20px;}
.terms_tbl table {width:550px;border-bottom:1px solid #999; border-spacing:0}
.terms_tbl table thead th {vertical-align: middle;padding:10px 0;border-top:1px solid #ccc;border-bottom:1px solid #ddd;background:#f5f5f5;color:#3f3f3f;font-size:1.1em;}
.terms_tbl table tbody th{vertical-align: middle;color:#111; padding:8px;border-right:1px solid #ddd; border-bottom:1px solid #ddd;text-align:center;}
.terms_tbl table tbody td {vertical-align: middle;color:#555;padding:8px; border-right:1px solid #efefef; border-bottom:1px solid #ddd;text-align:center;}
.terms_tbl table tbody td:last-child { border-right:0px;}

.tbl {width:100%;margin-top: 20px;}
.tbl table {width:100%;border-bottom:1px solid #999; border-spacing:0}
.tbl table thead th {vertical-align: middle;padding:10px 0;border-top:1px solid #ccc;border-bottom:1px solid #ddd;background:#f5f5f5;color:#3f3f3f;font-size:1.05em;}
.tbl table tbody th{vertical-align: middle;color:#111; padding:8px;border-right:1px solid #ddd; border-bottom:1px solid #ddd;text-align:center;}
.tbl table tbody td {vertical-align: middle;color:#555;padding:8px; border-left:1px solid #efefef; border-bottom:1px solid #ddd;text-align:center;}
.tbl table tbody td:first-child { border-left:0px;}
.tbl.color table thead th{background: var(--powder-milk);color: #fff;border:0;border-right: 1px solid rgba(255, 255, 255, 0.3);}
.tbl.color table tbody{background: #fff}
.tbl.color table tbody th{width:70px;padding: 8px 0;}
.tbl.color.baby-food-bg table thead th{background: var(--baby-food);}
.tbl.color.sleep-bg table thead th{background: var(--sleep);}
.tbl.color.baby-food-bg table thead th{background: var(--baby-food);}

.faq_wrap{margin: 20px 10px;}
.faq_wrap .faq-menu {float: left;width:100%;margin: 20px auto;}
.faq_wrap .faq-menu ul li{border: 1px solid var(--lightline);margin:-1px -1px 0 0;background: #fff;}
.faq_wrap .faq-menu ul li>a{display:block;padding:10px;text-align: center;color: var(--primary);}
.faq_wrap .faq-list{border-bottom: 1px solid var(--lightline);font-weight: bold;display: block;padding: 12px 0;}
.faq_wrap .faq-list:last-child { border-bottom:0;}


#snackbar {visibility: hidden;width: 90%;background-color:#333;color: #fff;text-align: center;border-radius: 4px;padding: 14px 20px;position: fixed;z-index: 1;left: 0%;bottom: 20px;font-size: 14px;margin:0 20px;}
#snackbar.show {visibility: visible;-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;animation: fadein 0.5s, fadeout 0.5s 2.5s;}
  @-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;} 
    to {bottom: 20px; opacity: 1;}
  }
  
  @keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 20px; opacity: 1;}
  }
  
  @-webkit-keyframes fadeout {
    from {bottom: 20px; opacity: 1;} 
    to {bottom: 0; opacity: 0;}
  }
  
  @keyframes fadeout {
    from {bottom: 20px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
  }

/**레이어팝업 - 필수구조**/
.layer {position: fixed;top: 0;bottom: 0;left: 0;right: 0;z-index: 3;}
.layer::after {display: inline-block;vertical-align: middle;width: 0;height: 100%;content: "";}
.layer_wrap {display: table;table-layout: fixed;width: 100%;height: 100%;}
.layer_inner {display: table-cell;vertical-align: middle;text-align: center;}
.layer__back {position: relative;display: inline-block;width: 310px;min-height: 160px;background: #FFF;border-radius: 10px;box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.2);padding: 10px;box-sizing: border-box;z-index: 30;}
.layer__header {display: flex;justify-content: space-between;align-items: center;padding: 6px 12px 0;}
.layer__header>h2 {font-size: 1.3em;font-weight: bold;text-align: left;}
.layer__single-btn {width: 100%;height: 40px;box-sizing: border-box;}
.layer__single-btn>button, .btn_fixed.btn-primary {width: 100%;height: 40px;margin: 0;padding: 0;border-radius: 4px;background: var(--primary);color:#fff;font-weight: bold;}
.layer__ft-btn {width: 100%;box-sizing: border-box;display: flex;justify-content: space-between;}
.layer__ft-btn.modal {position: fixed;bottom: 0px;background-color: #fff;padding: 10px;}
.layer__ft-btn>button {width: 50%;height: 100%;border-radius: 4px;margin: 0;padding: 10px;font-weight: 600;}
.layer__ft-btn>button:first-child {margin-right:6px;background: var(--lightline);}
.layer__ft-btn>button:last-child {background: var(--primary);color:#fff;}
.layer__content {margin:16px auto; padding: 5px 10px;text-align: left;min-height: 90px;max-height: 300px;overflow: auto;}
.layer__content>dl>dt {font-weight: bold;padding-bottom: 12px;border-bottom: 1px solid #CCC;}
.layer__content>dl>dd {color: #666;padding-top: 12px;width: 100%;}
.layer__content .f-sub {color: #707070;}
.dimmed {background: rgba(0, 0, 0, 0.5);width: 100%;height: 100%;position: absolute;top: 0;bottom: 0;left: 0;right: 0;z-index: 29;}
button.close {width: 30px;height: 30px;background: url("/images/ico-close.svg") #FFF right top no-repeat;border: 0;text-indent: -9999px;}
.layer__back.data-input .layer__content{max-height: unset;}
.layer__content .custom-radio{padding:4px 20px 4px 32px}

.checkbox-list{max-height:280px; overflow: auto;}
.checkbox-list li{padding:4px 0;display: flex;justify-content: space-between;align-items: center;}

/** toggle **/
div.toggleWrap {width: 50px;margin: 0 auto;padding: 0 10px;}
div.toggleWrap input {display: none;}
div.toggleWrap input:active + div label,
div.toggleWrap input:checked + div label {border: 13px solid var(--primary);box-shadow: 0 0 5px var(--primary);}
div.toggleWrap input:active + div label > span,
div.toggleWrap input:checked + div label > span {left: 22px;}
div.toggleWrap label {display: block;width: 45px;height: 25px;box-sizing: border-box;border-radius: 45px;border: 1px solid var(--lightline);background: #fff;transition: all 0.3s ease;}
div.toggleWrap label > span {position: absolute;top: 3px;left: 3px;display: block;width: 18px;height: 18px;border-radius: 50%;box-sizing: border-box;box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.65), 0 3px 3px 0 rgba(0, 0, 0, 0.45);transition: all 0.3s cubic-bezier(0.275, -0.45, 0.725, 1.45);background: #fff;}
.toggleWrap > div {position: absolute;top: 0;bottom: 0;right: 0px;width: 34px;height: 20px;}


.list__tab__wrap {background: #fff;width: 100%;margin: 8px 0 20px;border-bottom: 1px solid var(--lightline);overflow-x: auto; -ms-overflow-style: none;scrollbar-width: none;}
.list__tab__wrap::-webkit-scrollbar {display: none;}
.list__tab {width: max-content;height: 35px;}
.list__tab>li {float: left;display: inline-block;margin: 0 18px 0px 0;padding: 0 2px;line-height: 32px;color: var(--grayText);}
.list__tab>li:first-child {margin-left: 18px;}
li.current {border-bottom:3px solid var(--primary);color: #333;font-weight: bold;}

.invite_wrap{height: 100vh;padding:20px;background: #fff;}
.code-view{text-align: center; border:1px solid var(--primary);box-shadow: 0 1px 5px #e9cdcf;padding:14px;border-radius: 16px;}
.code-view>h3{color:var(--grayText);padding-bottom: 10px;}
.code-view>strong{font-weight: bold; font-size: 30px;color:var(--primary);}
.code-timer{display: block;width:100%;padding:10px 30px;margin:20px auto;text-align: center; }
.code-timer::before{content: ''; display: inline-block;background: url(https://icongr.am/material/timer.svg?size=22&color=999999) 0 0 no-repeat;width:24px;height:24px;padding:2px;vertical-align: middle;}


.alram_box{display: block;background-color: rgba(255, 255, 255, 0.7);border-radius: 8px; padding:10px 16px;margin:6px 10px; font-size: 12px;box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.15);}
.alram_box .detail {display: inline-block;vertical-align: middle;}
.alram_box:before {content:'';background:url(/images/logo.png) 4px center no-repeat;display: inline-block;width:44px;height:40px;background-size: 24px;vertical-align: middle;}
.alram_box .detail .content {font-size: 13px;font-weight: bold;}
.alram_box .detail .date {color: var(--grayText);padding-left: 10px;}

.setup-menu{padding:5px 20px;}
.setup-menu.col4>li{float: unset;width:24%; display: inline-block;}
.setup-menu li a{display: block;font-size: 12px;text-align: center;padding:20px 6px 10px;text-align: center;}
.setup-menu li a:before{content:'';background-color: #fff !important;border-radius:14px;display: block;height: 60px;margin-bottom: 8px;border:1px solid var(--lightline);box-shadow: 0px 2px 4px #e9cdcf}
.setup-menu li:first-child a:before{background:url(https://icongr.am/material/account-edit-outline.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(2) a:before{background:url(https://icongr.am/material/chart-bar.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(3) a:before{background:url(https://icongr.am/material/account-child-outline.svg?size=36&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(4) a:before{background:url(https://icongr.am/material/bell-check-outline.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(5) a:before{background:url(https://icongr.am/clarity/volume-up.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(6) a:before{background:url(https://icongr.am/material/folder-search-outline.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(7) a:before{background:url(https://icongr.am/material/coffee-outline.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(8) a:before{background:url(https://icongr.am/material/cogs.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(9) a:before{background:url(https://icongr.am/material/clipboard-text-outline.svg?size=32&color=FF7276) center no-repeat;}
.setup-menu li:nth-child(10) a:before{background:url(https://icongr.am/material/credit-card-check-outline.svg?size=32&color=FF7276) center no-repeat;}

.consulting-detail{padding:20px 16px;}
.consulting-detail a, dl.partner{position: relative; display: block;background-color: rgba(255, 255, 255, 0.7);border-radius: 8px; padding:16px 16px 16px;margin-bottom:10px;border: 1px solid #ddd;}
.consulting-detail a>h2{font-size: 16px;font-weight: bold;color:#333}
.consulting-detail a>h2:before{content:'';vertical-align: middle;display:inline-block;background:url(https://icongr.am/material/account-alert-outline.svg?size=20&color=999999) 0 center no-repeat;width:26px;height:20px}
.consulting-detail a>h2.confirm:before{background:url(https://icongr.am/material/account-check-outline.svg?size=20&color=FF7276) 0 center no-repeat;}
.consulting-detail a>.date{font-size: 12px;color: var(--grayText);position: absolute;right:20px;top:16px;}
.consulting-detail a strong{display: block;margin:14px 0 2px}
.consulting-detail a .price{color: var(--primary);}
.consulting-detail .btn-small{position: absolute;right:10px;bottom:10px;border-radius: 30px;}
.consulting-detail.report a{padding-left: 55px;}
.consulting-detail.report a>h2:before{display: none;}
.consulting-detail.report a:before{content:'';position: absolute;left:0px;top:0px;background:url(/images/illu-static.svg) center no-repeat;background-size: 34px; width:60px;height: 70px;}
.consulting-detail.report.type a:before{background:url(/images/illu-static2.svg) center no-repeat;background-size: 36px;}
dl.partner dt{width: 30%;display:inline-block;font-size: 12px;color: var(--grayText);line-height:2;}
dl.partner dd{width: 45%;display:inline-block;text-align: right;}
dl.partner .cancle{height: 50px;bottom: 27px;}


.detail_view{padding:20px 20px 30px;}
.detail_view>h2{display: inline-block;color: var(--primary);font-weight: bold;font-size:16px;border:1px solid var(--primary);border-radius: 20px;padding:4px 16px}
.detail_view>p{position: relative;font-size:20px;line-height:26px;margin:16px 0 30px;}
.detail_view>p:after{content:'';position: absolute;right: 0;bottom: 0; background:url(/images/illu-mobile.svg) center bottom no-repeat;background-size: contain; width:100px;height: 88px;}
.detail_view>p>strong{font-weight: bold;display: block;}
.detail_view h3{font-weight: bold;font-size:14px;padding:10px 0px 6px;color:var(--sleep)}
.detail_view .remain{text-align: center;font-weight: 300; font-size:18px;background:var(--sleep);padding:14px 20px;border-radius: 8px;color:#fff;}
.detail_view .consult-detail{margin:10px 0px;}
.detail_view .purchase_wrap .question-box{padding: 10px 0;}

.question-box{padding:20px 16px 70px;word-break: break-all;}
.question-box .unit{position: relative; display: block;background-color: rgba(255, 255, 255, 0.7);border-radius: 8px; padding:16px 16px 16px;margin-bottom:10px;border: 1px solid #ddd;}
.question-box .unit>h2{font-size: 14px;font-weight: bold;color:#333}
.question-box .unit>.date{font-size: 12px;color: var(--grayText);padding-top:6px;}
.question-box .unit>.reply{padding-top:16px;margin-top:10px;border-top: 1px solid var(--lightline);}

.chkList li{margin-left:10px;text-align: left;list-style-type: none !important;}
.chkList li+li{margin-top:8px}
.chkList li:before{content:'';display:inline-block;width:12px;height:15px;background:url(/images/ico-dot.svg) no-repeat 0 50%;background-size:4px;vertical-align:middle;margin-left:-10px}


.hd__search{width:100%;position: relative;}
.hd__search input{width:100%;border-radius:4px;border: 0;padding:10px 40px;height: 40px;background-color: #fff;border:1px solid var(--gray);}
.hd__search .ico-close, .hd__search .ico-search{position: absolute;right: 0;top: 0;width: 40px; height: 40px;background-size: 16px;opacity: .7;}
.hd__search .ico-search{left: 0;}

.recomm_wrap{margin:10px 11px;padding-bottom: 10px;}
.recomm_wrap .title{display: flex;justify-content: space-between;padding:6px 4px 6px;}
.recomm_wrap .title .more {font-size: 12px;color: var(--grayText);padding-right:12px;background: url(/images/ico-arrow-right.svg) right center no-repeat;background-size: 6px;}
.recomm_box{position: relative; display: flex;justify-content: space-between;align-items: center; background-color: rgba(255, 255, 255, 0.7);border-radius: 8px; padding:16px 20px 16px;margin-bottom:10px;border: 1px solid #ddd;}
.recomm_box .behavior-icon{width:38px;height: 30px;display: inline-block;margin: 2px;}
.recomm_box .ico-group{width:75%;}
.recomm_box .ico-group.small .behavior-icon{width:30px;}
.recomm_box .times{text-align: right;font-size: 16px;}
.recomm_box .times strong{font-size: 20px;font-weight: bold;}
.recomm_box .times h3{font-size: 13px;color: var(--grayText);padding-top: 4px;}
.recomm_wrap .consulting-detail{padding:0 0 20px}
.recomm_wrap .tC.bg_box .primary{font-size: 22px;}
.col2.recomm_box li{text-align: center;color:var(--grayText)}
.col2.recomm_box li strong{display: block;font-size: 28px;padding-top: 10px;color: var(--primary);}

.recomm_wrap .terms_tbl, .recomm_wrap .tbl{font-size: 12px;}
.recomm_wrap .terms_tbl tbody th, .recomm_wrap .tbl tbody th{width:90px}

.recomm_guide{margin:10px;padding:10px 8px;border-bottom:1px solid var(--lightline);margin-bottom: 8px;}
.recomm_guide .date{display: flex;justify-content: space-between;margin-bottom: 5px;font-size:16px}
.recomm_guide .date h2>strong{font-size: 20px;}
.recomm_guide .date h3{font-size: 12px;color:var(--grayText)}

.recomm_wrap .time-input-list{padding:10px;background-color:var(--line);border-radius: 4px;}
.recomm_wrap .time-input-list>.time li{height:288px}
.recomm_wrap .time-input-list>.recomm-time{width:170px}
.recomm_wrap .time-input-list>.baby-time{width:70%}
.recomm_wrap .time-input-list .term-time{font-weight: bold;}

.time_table {background:  url(/images/timetable.png) center top no-repeat;background-size: contain;width:100%;height:100%;}

.legend{margin:10px;background: var(--line);padding:5px 0px 5px 15px;}
.legend:after{content: '';clear: both;display: block;}
.legend li{display: inline-block;margin:2px 0px;font-size: 11px;float: left;}
.legend li span{background-size: 90%!important;background-position: center !important;width:16px;height:16px;display: inline-block;vertical-align: middle;margin-right:2px}

.purchase_wrap{}
.purchase_wrap .card{margin:14px 16px; box-shadow: 1px 2px 5px 0px rgb(0 0 0 / 10%);position: relative;background: #fff; display: block;border-radius: 12px; padding:16px 16px 16px;border: 1px solid #ddd;}
.purchase_wrap .card>h2{color:#000;font-size: 16px;font-weight: bold;border-bottom: 1px solid var(--lightline);padding-bottom:8px;margin-bottom:12px;}
.purchase_wrap .card>h2>strong{margin-top: 4px;color:var(--grayText);font-size: 12px;font-weight: normal;display: block;}
.purchase_wrap .card>span>h2{color:#000;font-size: 16px;font-weight: bold;border-bottom: 1px solid var(--lightline);padding-bottom:8px;margin-bottom:12px;}
.purchase_wrap .card>span>h2>strong{margin-top: 4px;color:var(--grayText);font-size: 12px;font-weight: normal;display: block;}
.purchase_wrap .card .detail{font-size: 13px;text-decoration: underline; color: var(--grayText);position: absolute;right:16px;top:16px;padding-right: 20px; background: url(https://icongr.am/material/arrow-right.svg?size=16&color=aaaaaa) right center no-repeat;}
.purchase_wrap .card .price{color: var(--primary);font-size: 17px;margin-top:8px}
.purchase_wrap .card .price>span{text-decoration: line-through;}
.purchase_wrap .card .price>span:after{content: '';display: inline-block;vertical-align: middle; width: 28px;height: 20px;background: url(https://icongr.am/material/arrow-right.svg?size=18&color=FF7276) right center no-repeat;}

.purchase_wrap .card .price>.txt{margin-top: 4px;font-size: 12px;color: var(--grayText);padding-left: 22px; background: url(https://icongr.am/material/clock-check-outline.svg?size=17&color=999999) left center no-repeat;}
.purchase_wrap .card .btn-small{position: absolute;right:14px;bottom:14px;border-radius: 30px;}
.purchase_wrap .card.detail .dot{font-size: 12px;}
.purchase_wrap .card.detail img{width:100%;}
.purchase_wrap .card.detail .circle1{display: inline-block;background: #8d5fa2; vertical-align: middle;width:14px;height:14px;border-radius: 100%;margin:0 6px;}
.purchase_wrap .card.detail .profile{width:60px; height: 60px;margin-bottom: 6px;}
.purchase_wrap .card.detail .photo {color:var(--medicine);font-weight: bold; text-align: center; margin-right: 20px;}
.purchase_wrap .base{font-size: 18px;line-height: 24px;margin: 10px 0;}
.purchase_wrap .base img{width:66%;margin:20px auto}
.purchase_wrap .card>h3{background: #8d5fa2;border-radius: 30px;width:80px;padding:3px 10px;margin:10px 0 5px;color:#fff}

.base-search li{padding:10px 0;font-size: 12px;}
.base-search li input, .base-search li select, .base-search li textarea {margin-top: 5px;}

.consult-detail{margin:14px 16px; box-shadow: 1px 2px 5px 0px rgb(0 0 0 / 10%);position: relative;background: #fff; border-radius: 12px; padding:16px 16px 16px;border: 1px solid #ddd;}
.consult-detail strong{color:var(--primary);font-size:16px}
.consult-detail strong>span{opacity: .7;;padding:0 4px 0 10px;font-size: 12px;}
.consult-detail .question-box{padding:10px 0 0}
.consult-detail .question-box .unit{padding:10px 16px 8px}

.cover_wrap{background: #FF7276!important;text-align: center;}
.cover_wrap img{margin-top:50%; width:34%}

.withdrawal{padding: 20px 20px 30px;}
.withdrawal>h2{font-size:20px;line-height: 1.4em;font-weight: bold;}
.withdrawal h3{font-size:15px;font-weight: bold;}
.withdrawal p{margin: 14px 0 10px;}
.withdrawal .custom-radio{width: 100%;margin:6px}

.growth_report > .titTypeA{padding:6px 20px;margin:10px auto;width: fit-content;text-align:center;font-size: 16px;display: flex;border-radius: 30px;background: #6ebad3;color: #fff;}
.growth_report > .titTypeD{text-align:center;padding:10px 20px 6px;}

.parenting_wrap{padding-bottom: 20px;}
.parenting_wrap .withdrawal{padding-bottom: 0px;}
.parenting_wrap .withdrawal strong{color:var(--primary)}
.parenting_wrap .purchase_wrap .parenting-btn {margin: 20px 16px;}
.term{font-size: 14px; padding-left: 10px; font-weight: bold;}

.alzam_now h2{font-size: 20px;font-weight: bold;padding:20px 20px;}
.alzam_now > .swiper{margin:0px 20px 30px;}
.alzam_now > .swiper-slide{height: 150px;border-radius: 8px;background: #f4f4f4;text-align: center;}
.alzam_now > .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.alzam_now > .swiper-pagination{}

.report_wrap{margin:0px 10px 0px;}
.report_wrap h3{margin:30px 0px 16px;padding-left:30px;font-size: 20px;font-weight: bold;background: url(https://icongr.am/material/calendar-month.svg?size=24&color=666666) 0 center no-repeat;}
.report_wrap ul{display: flex; justify-content: flex-start;flex-wrap: wrap;}
.report_wrap ul li{width:33.3%;padding-right: 8px;margin-bottom: 10px;}
.report_wrap ul li:nth-child(3n){padding-right: 0px;}
.report_wrap ul li a{display: block;height: 100%;}
.report_wrap ul li a>img{display: block;border:1px solid #ddd;width: 100%;height: 110px;object-fit: cover;border-radius: 4px;}
.report_wrap ul li a>.report-date{padding:8px 0 10px;display: inline-block;}
.report-bg{font-family: 'UhBee';width:100%;background: url(/images/baby_bg01.gif) center 0 no-repeat;background-size: contain!important;background-color: #fdefe6;}
.report-title{padding: 70px 0 10px;color:#e83985;text-align: center;}
.report-title span{font-size: 20px;font-weight: bold;display: block;}
.report-title .d-day{color:#fff;background:#e83985;margin-top: 10px; padding:5px 10px; border-radius: 20px;display: inline-block;}
.report-info{font-size: 12px;position: relative;width:100%;min-height: 250px;margin: auto;background: url(/images/baby_bg01-2.gif) center 0 no-repeat;background-size: 350px!important;}
.report-info .profile-box{padding-top: 18px;}
.report-info .profile-box .profile{width: 118px;height: 118px;}
.info-sleep{position: absolute; left: 49px; top:13%;}
.info-sleep2{position: absolute; left: 25px; top:41%;}
.info-bmilk{position: absolute; right: 17px; top:36%;}
.info-bfood{position: absolute; right: 47px; top:68%;}
.info-body{position: absolute; right: 28px; top:12%;}
.info-unique{position: absolute; left: 50px; top:69%;}
.info-birth{position: absolute; width: 100%;text-align: center;bottom:20px;color:#e83985;font-weight: bold;}
.report-comment>h4{font-weight: bold;}
.report_wrap.type-boy,
.report_wrap.type-girl,
.report_wrap.type-neut{margin:0}
.report_wrap.type-boy .report-bg {background: url(/images/baby_bg02.gif) center 0 no-repeat;background-color: #d7eff3;}
.report_wrap.type-boy .report-title,
.report_wrap.type-boy .info-birth {color:#005b8f;}
.report_wrap.type-boy .report-title .d-day {background-color:#005b8f;}
.report_wrap.type-boy .report-info {background: url(/images/baby_bg02-2.gif) center 0 no-repeat;}
.report_wrap.type-neut .report-bg {background: url(/images/baby_bg03.gif) center 0 no-repeat;background-color: #eaf5d4;}
.report_wrap.type-neut .report-title,
.report_wrap.type-neut .info-birth {color:#009c6c;}
.report_wrap.type-neut .report-info {background: url(/images/baby_bg03-2.gif) center 0 no-repeat;}
.report_wrap.type-neut .report-title .d-day{background-color:#009c6c;}
.report-comment{margin:16px}

.report-breif{height:200px;}
.report-breif.type-boy{background: url(/images/baby_bg02-3.png) center 0 no-repeat;}
.report-breif .profile-box{padding-top:22px;}
.report-breif .profile-box .profile {width:120px;height:120px;}
.text-box{margin: 0 auto;position: relative;min-height: 250px;width: 360px;}

.sound-play{position: absolute !important;right: 0;top: 12px;width:30px;height:30px; background: url(https://icongr.am/material/play-circle.svg?size=28&color=666666) center no-repeat;}
.sound-pause{position: absolute !important;right: 0;top: 12px;width:30px;height:30px; background: url(https://icongr.am/material/pause-circle.svg?size=28&color=666666) center no-repeat;}
.ico-play{background: url(https://icongr.am/material/play-circle.svg?size=33&color=FF7276) right 10px center no-repeat;}
.btn-time.ico-play{padding:20px 60px 20px 20px;font-size: 30px;}
.ad_fixed{padding-bottom: 150px!important;}

.ico-play{margin-top: 6px;height:40px;display:block; background: url(https://icongr.am/material/play-circle.svg?size=38&color=FF7276) center no-repeat;}
.ico-pause{margin-top: 6px;height:40px;display:block;background: url(https://icongr.am/material/pause-circle.svg?size=38&color=FF7276) center no-repeat;}

/*vue css*/
.vpd-header{background-color: var(--primary)!important;border-radius:10px 10px 0 0;}
.vpd-content{border-radius: 10px;}
.vpd-actions button{color:var(--primary)!important;}
.vpd-content{text-align: left!important;}
textarea{border:1px solid #ccc !important;font-family: 'NanumSquareAcR' !important;}
.vpd-input-group{margin: 10px!important;}
.vpd-input-group label{background: var(--primary) !important;}
.vpd-input-group input{border-right: 1px solid #ddd!important;border-radius: 4px !important;}