/* 팝업 공통 */
.popup-wrap .btn-d.btn-lg{width:100%;padding:0 1.25em !important;}
.popup-wrap .form-bx + .form-bx{margin-top:6px;}
.popup-wrap .form-control{height:3em;border-radius: var(--round-sm);border-color:var(--lgray1);background-color:var(--lgray1);padding:0 1.25em;} 
.popup-wrap .form-control::placeholder{color:var(--dgray2);}
.popup-wrap .form-control:focus{color:var(--black); border-color: currentColor;}
.popup-wrap .form-control:readonly{color:var(--black);}
.popup-wrap select.form-control {width: 100%; padding-right: 1em; background-color: var(--lgray2); border-radius: var(--round-lg); background-position: center right 16px;}
.popup-wrap .cont {text-align:left;}
.popup-wrap .cont .stit{font-size:1.25em;font-weight:var(--font-bold);line-height:28px;margin-bottom:4px;}
.popup-wrap .cont .des{font-size:var(--font-base); line-height:var(--lh-24);}
.popup-wrap .form-wrap .form-group {margin-bottom: 6px;}
.popup-wrap .form-wrap .form-group:last-child {margin-bottom: 0;}
.popup-wrap .btn-wrap {display:flex;gap:12px;margin-top:1.5em;}
/* .popup-wrap .btn-wrap .btn-d{width:calc(50% - 12px);} */
.popup-wrap .btn-d.black, .popup-wrap .btn-d.green{display:block;}
.popup-wrap .pb24{padding-bottom:1.5em;}
.popup-wrap .mtp24{margin-top:1.5em !important;}
.popup-wrap .info{margin:1.5em 0 3em;}

@media only screen and (max-width: 1024px){
	.popup-wrap .info{margin:1em 0 2em;}
	.popup-wrap .cont .stit{line-height:var(--lh-24);}
	.popup-wrap .pb24{padding-bottom:1em;}
	.popup-wrap .mtp24{margin-top:1em !important;}
}
@media only screen and (max-width: 768px){
	.popup-wrap .btn-d.btn-lg{width:100%;}
	.popup-wrap .cont .des{line-height:var(--lh-20);}
	.popup-wrap .btn-wrap{flex-wrap:wrap;gap:6px;margin-top:1em;}
	.popup-wrap .info{margin:.5em 0 1.5em;}
	.popup-wrap .pb24{padding-bottom:.5em;}
	.popup-wrap .mtp24{margin-top:.5em !important;}
}

/* 팝업- 로그인  */
.login-popup .login-type{margin-bottom:1.5em;}
.login-popup .row{justify-content:space-between;align-items:center;gap:12px;}
.login-popup .login-type .btn-wrap{display:flex;gap:0.75em;margin-top:0;}
.login-popup .login-type a.btn-d{display:flex;align-items:center;justify-content:center;width:5.5em !important;height:5.5em !important;}
.login-popup .login-type a.btn-black{background-color:var(--black); color:#fff; font-weight:600!important;line-height:64px;}
.login-popup .login-form{margin-bottom:1.5em;}
.login-popup .login-find{display:flex;justify-content:center;margin-top:1.375em;align-items:center;}
.login-popup .login-find li:before{content:"";display:block;width:1px;height:1.5em;background:#e6e6e6; margin:0 1.875em;float:left;}
.login-popup .login-find li:first-child:before{display:none;}
.login-popup .btn-d.black {background-color:var(--basic-color)!important; color: var(--black)!important;}
.login-popup .btn-d.black:hover{background-color:var(--black)!important; color: var(--white)!important;}
.login-popup .btn-d.green{margin-bottom:6px;}

.login-popup .row .login-green{width:calc(50% - 6px);}

@media only screen and (max-width: 1024px){
	.login-popup .login-type .btn-wrap{gap:.58em;}
	.login-popup .login-type a.btn-d{width:4.5em !important;height:4.5em !important;}
	.login-popup .login-type,
	.login-popup .login-form{margin-bottom:1em;}
}
@media only screen and (max-width: 768px){
	.login-popup .login-find li:before{margin:0 1em;}
}

/* 팝업 - 계정관리 */
.popup-wrap {}
.popup-wrap .manage{max-width:480px;min-height:auto;padding:2em 2em 7.5em;}
.popup-wrap .manage h3{font-weight:700;margin:0 auto 32px; font-size: var(--font-2xlg);}
.popup-wrap .manage .comm{line-height:16px;font-size:14px;font-weight:500;color:#999;}
.popup-wrap .manage .comm:before{font-family:FontAwesome;content:"\f06a";font-weight:600;color:#999;display:inline-block;margin-right:4px;}

.popup-wrap .manage .form-wrap{text-align:left;margin-top:24px;}
.popup-wrap .manage .form-group{margin-bottom:12px;}
.popup-wrap .manage .form-group:last-child{margin-bottom:0;}
.popup-wrap .manage .form-label{font-size:var(--font-base);margin-bottom:8px;}
.popup-wrap .manage .form-label .required {display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--main-color);vertical-align:top;margin-left:4px;margin-top:1px;}
.popup-wrap .manage .form-control{line-height:48px;height:48px;border:1px solid #E6E6E6;border-radius:64px;padding:0.25rem 1.5rem;}
.popup-wrap .manage .form-control:after{display:none;}
.popup-wrap .manage .form-group .comm{padding-left:10px;margin-top:8px;}

.popup-wrap .manage .char-choice{width:64px;height:64px;margin:0 auto 16px;background:#E6E6E6;border-radius:50%;text-align:center;overflow:hidden;}
.popup-wrap .manage .char-choice img{height:64px;}

.popup-wrap .manage .char-cat{display:flex;justify-content:center;gap:8px;}
.popup-wrap .manage .char-cat .btn-d{background:var(--dgray1);padding:0 24px;}
.popup-wrap .manage .char-cat .btn-d:hover,
.popup-wrap .manage .char-cat .btn-d.on{font-weight:700 !important;color:var(--white);background-color:var(--black);}

.popup-wrap .manage .char-wrap{padding:6px 4px 0 16px;border-radius: var(--round-sm);background:#F4F4F4;margin-top:16px;}
.popup-wrap .manage .char-wrap .bx{max-height:132px;display:flex;flex-wrap:wrap;overflow-y:scroll;padding-top:6px;}
.popup-wrap .manage .char-wrap a{width:48px;height:48px;display:block;margin:8px 4px;transition:all .3s ease;}

.popup-wrap .manage .char-wrap:has(a.on) a:not(.on):not(:hover){filter:grayscale(1);}

.popup-wrap .manage .form-group .row:has(.birth-badge){gap:8px;align-items:center;}
.popup-wrap .manage .form-group .row:has(.birth-badge) .form-control{flex:1;margin-right:0;}

/* 기관 모달 */
.popup-wrap .support-popup {padding: 1.5em 2em 2em;}
.support-popup .pop-head {padding-top: 4px; margin-top: 48px; border-top: 1px solid var(--black); position: relative;}
.support-popup .pop-head .cate {display: block; padding-bottom: 8px; font-weight: var(--font-bold); font-size: var(--font-lg); line-height: var(--lh-26);}
.support-popup .pop-head h1 {padding-right: 40px; font-size: var(--font-xlg); line-height: 30px; word-break: normal;}
.support-popup .pop-head .btn-fav {width:40px; height:40px; position: absolute; top: 32px; right: 0; display: flex; align-items: center; justify-content: center;}
.support-popup .pop-head .btn-fav .ico-favorite::before {background-color: var(--lgray3); -webkit-mask-image: url("../img/icon/sd-favorite.svg"); mask-image: url("../img/icon/sd-favorite.svg");}
.support-popup .pop-head .btn-fav.current .ico-favorite::before {background-color: var(--black);}
.support-popup .info {margin: 0; display: grid; gap: var(--gap-4x);}
.support-popup .info .cont {padding-top: 2px; border-top: 1px solid var(--basic-border);}
.support-popup .info .cont h2 {margin: 0; padding-bottom: 6px; font-weight: var(--font-semibold); font-size: var(--font-base); line-height: var(--lh-24);}
.support-popup .info .cont .add-txt {padding-bottom: 4px;}
.support-popup .info .cont .link-btn {position: static; margin-top: 12px;}
.popup-wrap .support-popup .pop-close-btn {top: 1em; right: 1.5em;}

.popup-modal-wrap {background: transparent !important;}
.popup-wrap:before {background: rgba(17,17,17,.4) !important; grid-column: 1;}
.popup-wrap .map-loc {}
.popup-wrap .map-loc .map-my-loc {padding: 1em; margin-bottom: 1em; display: flex; align-items: center; justify-content: center; gap: var(--gap-3x); background-color: var(--lgray2); border-radius: var(--basic-round);}

@media only screen and (max-width: 1024px){
	.popup-wrap .support-popup{padding:1em 1.5em 1.5em;}
	.popup-wrap .support-popup .pop-close-btn{top:.5em;right:.5em;}
	.support-popup .pop-head .cate{line-height:var(--lh-20);}
	.support-popup .pop-head h1{line-height:var(--lh-26);margin-bottom:1.5em;}
	.support-popup .pop-head .btn-fav{top:24px;}
}
@media only screen and (max-width: 768px){
	.popup-wrap .support-popup{padding:.5em 1em 1em;}
	.support-popup .pop-head .cate{padding-bottom:4px;}
	.support-popup .pop-head h1{margin-bottom:1em;}
	.support-popup .pop-head .btn-fav{top:20px;}
}

/* 회원가입 공통 */
body:has(.member){background:var(--lgray1);}
.member .member-form{display:flex;flex-direction:column;gap:2em;}
.member h1{font-size:var(--font-2xlg);font-weight:var(--font-bold);line-height:var(--lh-36);margin:2px 0 1.5em;}
.member #snb{grid-column:span 3 !important;}
.member .step{display:flex;flex-direction:column;gap:0.75em;}
.member .step li{display:flex;align-items:center;}
.member .step span{display:inline-block;}
.member .step .num{width:3.667em;height:3.667em;line-height:3.667em;font-size:var(--font-xlg);font-weight:var(--font-bold);text-align:center;background-color:var(--white);color:var(--black);margin-right:1em;}
.member .step .num.active{background-color:var(--black);color:var(--white);}
.member .page-head{border-top:1px solid var(--black);min-height:6.667em;padding:0;}
.member .page-head h2{font-size:var(--font-xlg);line-height:var(--lh-24 );margin:6px 0 0.5em;}
.member .page-head .txt{font-size:var(--font-base);font-weight:var(--font-normal);line-height:var(--lh-24);}
.member #contentArea{grid-column:5 / 13 !important;grid-template-columns: subgrid;}

.mem-cont{border-top:1px solid var(--dgray1);padding-bottom:4em;}
.mem-cont h3{font-size:var(--font-lg);line-height:var(--lh-26);margin:6px 0 1.333em;}
.mem-cont .agree{background:var(--white);border-radius:var(--round-sm);padding:1.5em;margin-bottom:0.75em;}
.mem-cont .agree .txt > div{height:18em;overflow-y:auto;padding-right:3px;}
.mem-cont .agree .stit{font-weight:var(--font-semibold);}
.mem-cont .agree .num-list{padding-left:0;}
.mem-cont fieldset:has(.radio-wrap){display:flex;align-items:center;gap:1.5em;}
.mem-cont fieldset legend{display:inline-block;width:auto;max-width:none;font-size:var(--font-base);}
.mem-cont fieldset .radio-wrap{display:flex;gap:1.5em;}
.mem-cont fieldset .tv-radio{position:relative;display:inline-flex;align-items:center;padding-block:6px; font-size: var(--font-base);}
.mem-cont fieldset .tv-radio label{display:inline-flex;align-items:center;cursor:pointer;color:var(--black);}
.mem-cont fieldset .tv-radio label:before{content:'';flex:none;width:24px;height:24px;box-sizing:border-box;border:none;border-radius:var(--round-xlg);background:var(--dgray1);transition:all .3s ease !important;margin-right:6px;}
.mem-cont fieldset .tv-radio:has(#gender-female, #gender-male) label,
.mem-cont fieldset .tv-radio:has(#gender-female, #gender-male) label:before{cursor:auto;}
.mem-cont fieldset .tv-radio label:after{display:none;}
.mem-cont fieldset .tv-radio input[type="radio"]:not(#gender-female, #gender-male):checked + label::before,
.mem-cont fieldset .tv-radio input[type="radio"]:not(#gender-female, #gender-male):hover + label::before{border:none;background:var(--black);}
.mem-cont fieldset .tv-radio input[type="radio"]:checked + label:before{content:'';border:none;background:var(--black);}
.mem-cont fieldset .tv-radio input[type="radio"]:checked + label:after{content:''; position:absolute;left:6px;top:50%;transform:translateY(-50%);width:12px;height:12px;border-radius:var(--round-xlg);background:var(--black);}
.mem-cont fieldset .tv-radio input[type="radio"]:focus-visible + label:before{outline:none;}
.mem-cont .btn-wrap{display:flex;gap:0.75em;}
.mem-cont .member-type{align-items:center;}
.mem-cont .member-option {display:flex;gap:0.75em;}
.mem-cont .member-option input[type="radio"],
.mem-cont .character-option input[type="radio"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.mem-cont .member-option label {display:flex;align-items:center;justify-content:center;width:5.5em;height:5.5em;border-radius:50%;background:var(--white);color:var(--black);cursor:pointer;transition:all .3s ease;}
.mem-cont .member-option input[type="radio"]:checked + label {background:var(--black);color:var(--white);}
.mem-cont .member-option label:hover {background:var(--black);color:var(--white);}
.mem-cont .member-option input[type="radio"]:focus-visible + label {outline:none;}
.mem-cont .grid-row{display:grid;grid-template-columns:repeat(8, 1fr);gap:0 var(--gap-3x); align-items:center;}
.mem-cont .form-tit{grid-column:span 1;}
.mem-cont div:has(.grid-row) .form-bx,
.mem-cont div:has(.grid-row) .form-control.only,
.mem-cont .member-option,
.mem-cont .char-preview,
.mem-cont .char-wrap .bx{grid-column:span 7;}
.mem-cont .form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:0;}
.mem-cont .form-inline{flex-flow:nowrap;gap:12px;}
.mem-cont .form-control{margin:0;}
.mem-cont .form-control:not(select){width:100%;height:3em;margin:0;border-color:var(--white);border-radius: var(--round-sm);padding:0 1.25em;}
.mem-cont .form-control:not(select):focus {border-color: var(--black);}
.mem-cont .form-control:disabled {background-color:var(--dgray0) !important;border-color:var(--dgray0);color:var(--dgray2);}
.member .mem-cont .form-control[readonly] {background-color:var(--dgray0) !important;border-color:var(--dgray0);color:var(--dgray2);}
.mem-cont .form-control input{width:100%;}
.mem-cont select.form-control {border-color:var(--white); background-position: center right 1em;}
.mem-cont .form-group .field-hint,
.mem-cont .info-txt,
.mem-cont fieldset:has(.radio-wrap){grid-column:2 / 9;}
.mem-cont .w100{flex: 0 0 100px;}
.mem-cont .w212{min-width:212px;flex: 0 0 212px;}
.mem-cont fieldset:has(.radio-wrap),
.mem-cont .info-txt{color: var(--dgray2);margin-top:6px;}
.mem-cont input[type="date"]{max-width:100%;position: relative;appearance:none;-webkit-appearance:none;display:flex;align-items:center;box-sizing:border-box;}
.mem-cont input[type="date"]::-webkit-date-and-time-value{text-align:left !important;}
.mem-cont .form-bx:has(input[type="date"]){min-width:0;}
.mem-cont input[id^="childBirth_"]:not(disabled){appearance:none;-webkit-appearance: none;background:url("../img/icon/sd-check-day.svg") center right 20px / 24px no-repeat var(--white);}
.mem-cont input[id^="childBirth_"]::-webkit-calendar-picker-indicator{position: absolute; right: .625em; width: 2.75em; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer;}
.mem-cont .grid-row:has(label[for="email"]) #email1{min-width:324px;flex: 0 0 324px;}
.mem-cont .char-preview{display:flex;gap:0.75em;}
.mem-cont .char-preview button{width:5.5em;height:5.5em;}
.mem-cont .char-preview button:focus{outline:none;}
.mem-cont .char-wrap .bx{display:flex;flex-wrap: wrap;gap:1.375em;}
.mem-cont .char-wrap .bx a img{width:3em;}

.mem-cont + .btn-wrap,
.child-regi + .btn-wrap{display:flex;gap:.75em;}

@media only screen and (max-width: 1366px){
	.mem-cont .grid-row:has(label[for="email"]) #email1{min-width:40%;flex:0 0 40%;}
	.mem-cont .w212{min-width:200px;flex: 0 0 200px;}
}
@media only screen and (max-width: 1280px){
	.mem-cont .w212{min-width:130px;flex: 0 0 130px;}
}
@media only screen and (max-width: 1024px){
	.member .member-form{gap:1.25em;}
	.member h1{line-height:var(--lh-26);margin-bottom:2.5em;}
	.member .step .num{width:3.2em;height:3.2em;line-height:3.2em;margin-right:.75em;}
	.member .page-head{min-height:110px;}
	.mem-cont{padding-bottom:2em;}
	.mem-cont h3{margin-bottom:1em;}
	.mem-cont .agree{padding:1.25em;}
	.mem-cont .agree .txt > div{height:13em;}
	.mem-cont .char-preview{gap:.58em;}
	.mem-cont .member-option label,
	.mem-cont .char-preview button{width:4em;height:4em;}
	.mem-cont .char-wrap .bx{gap:.58em;}
	.child-regi{padding-bottom:2em;}
}
@media only screen and (max-width: 768px){
	body:has(.member) #header::before{background-color:var(--lgray1);}
	.member #snb{grid-column:span 12 !important;background:rgba(249,249,249,.9);margin-bottom:.7em;}
	.member h1{margin-bottom:.75em;}
	.member .step{flex-direction:row;}
	.member .step li{flex:1;}
	.member #contentArea{grid-column:1 / 13 !important;}
	.member .page-head{min-height:auto;padding-bottom:1em;}
	.member .page-head .txt{line-height:var(--lh-20);}
	.mem-cont .grid-row{grid-template-columns:repeat(12, 1fr);gap:0;}
	.mem-cont div:has(.grid-row) .form-bx,
	.mem-cont div:has(.grid-row) .form-control.only,
	.mem-cont .member-option,
	.mem-cont .char-preview,
	.mem-cont .char-wrap .bx{grid-column:span 10;}
	.mem-cont .form-group .field-hint,
	.mem-cont .info-txt,
	.mem-cont fieldset:has(.radio-wrap){grid-column:3 / 13;}
	.mem-cont .member-type p,
	.mem-cont .form-tit,
	.mem-cont .form-label,
	.mem-cont .grid-row label[for="due-date"],
	.mem-cont .grid-row label[for="group-sel"],
	.mem-cont .grid-row label[for^="dueDate_"]{grid-column:span 2;}
	.mem-cont .form-control:not(select){height:40px;padding:0 1em;}
	.child-regi{padding-bottom:1em;}
	.mem-cont input[id^="childBirth_"]:not(disabled){background-position:center right 14px !important;}
}
@media only screen and (max-width: 567px){
	.member .step li{flex-direction:column;}
	.member .step .num{width:2.2em;height:2.2em;line-height:2.2em;font-size:var(--font-lg);margin-right:0;margin-bottom:6px;}
	.mem-cont .grid-row{gap:0;}
	.mem-cont .agree{padding:1em;}
	.mem-cont fieldset:has(.radio-wrap){flex-direction:column;align-items:flex-start;gap:.5em;}
	.mem-cont fieldset .radio-wrap{gap:1em;}
	.mem-cont fieldset .tv-radio label:before{width:20px;height:20px;}
	.mem-cont .form-inline{flex-flow:wrap;gap:6px;}
	.mem-cont .form-tit,
	.mem-cont .member-type p,
	.mem-cont .form-label{margin-bottom:4px;}
	.mem-cont .form-tit,
	.mem-cont .member-type p,
	.mem-cont div:has(.grid-row) .form-bx,
	.mem-cont div:has(.grid-row) .form-control.only,
	.mem-cont .member-option,
	.mem-cont .char-preview,
	.mem-cont .char-wrap .bx{grid-column:span 12;}
	.mem-cont .form-group .field-hint,
	.mem-cont .info-txt,
	.mem-cont fieldset:has(.radio-wrap){grid-column:1 / 13;}
	.mem-cont .w100,
	.mem-cont .w212,
	.mem-cont .w324{flex:0 0 100%;}
	.mem-cont select.form-control{min-width:100%;}
	.mem-cont .grid-row:has(label[for="email"]) .form-inline{align-items:center;}
	.mem-cont .grid-row:has(label[for="email"]) #email1{flex:1.5 1 0;min-width:0;}
	.mem-cont .grid-row:has(label[for="email"]) #email2{flex:1 1 0;min-width:0;}
	.mem-cont .grid-row:has(label[for="email"]) .email-at{flex:0 0 auto;}
	.mem-cont .grid-row label[for="due-date"],
	.mem-cont .grid-row label[for="group-sel"],
	.mem-cont .form-label,
	.mem-cont .grid-row label[for^="dueDate_"]{grid-column:span 12;}
	.mem-cont + .btn-wrap,
	.child-regi + .btn-wrap{flex-wrap:wrap;gap:6px;}
	.mem-cont + .btn-wrap button,
	.child-regi + .btn-wrap button{width:100% !important;}
	.mem-cont .agree .txt > div{font-size:.9em;line-height:var(--lh-18);}
}

/* 회원가입 완료 */
#sub-content:has(.join-wrap.done, .delete-wrap){position:relative;min-height:100vh;}
.sub-container:has(.join-wrap.done, .delete-wrap){padding-bottom:0;margin-top:0 !important;}
.join-wrap.done{width:41.25em;}
.join-card{width:27.25em;margin:0 auto;}
.join-card .thumb{width:9.75em;height:9.75em;border-radius:50%;}
.join-card .row{gap:0.75em;justify-content:center;}
.join-card .tit{padding:.8em 0 .3em;font-size:var(--font-3xlg);line-height:var(--lh-44);font-weight:var(--font-bold);letter-spacing:-0.025em;}
.join-card .txt{line-height:var(--lh-24);}
.join-card .btn-wrap{display:flex;padding-top:4em;gap:.75em;}
.join-card .btn-wrap .btn-d{width:50%;}
.join-card .btn-green{background:var(--green1);}

@media only screen and (max-width: 1024px){
	.join-card .thumb{width:8.75em;height:8.75em;}
	.join-card .btn-wrap{padding-top:3em;}
}
@media only screen and (max-width: 768px){
	.join-wrap.done{width:100%;}
	.join-card .thumb{width:7.75em;height:7.75em;}
	.join-card .tit{line-height:var(--lh-26);}
	.join-card .btn-wrap{padding-top:2em;}
}
@media only screen and (max-width: 567px){
	.join-card{width:100%;}
	.join-card .thumb{width:6em;height:6em;}
	.join-card .btn-wrap{flex-flow:wrap;gap:6px;}
	.join-card .btn-wrap .btn-d{width:100%;}
}

/* 회원탈퇴 */
.delete-wrap {width:100%;}
.delete-wrap h1{line-height:38px;margin-bottom:0;}
.delete-wrap .page-head{min-height:auto;padding-bottom:1.5em;}
.delete-wrap .page-head h2{margin:6px 0;}
.delete-wrap .mem-cont{border-top:0;padding-bottom:0;}
.delete-wrap .num-list{margin-bottom:2em;}
.delete-wrap .num-list li{padding:4px 0;}
.delete-wrap fieldset:has(.radio-wrap){margin-top:0;}
.delete-wrap fieldset .tv-radio{padding-block:0;}
.delete-wrap .form-bx{display:flex;gap:.75em;margin-top:4em;}
.delete-wrap .form-inline{flex:1;}
.delete-wrap .btn-wrap{width:13.25em;}

@media only screen and (max-width: 1366px){
	.delete-wrap .btn-wrap{width:14em;}
}
@media only screen and (max-width: 1024px){
	.delete-wrap h1{line-height:var(--lh-26);}
	.delete-wrap .page-head{padding-bottom:1em;}
	.delete-wrap .num-list{margin-bottom:1.5em;}
	.delete-wrap .form-bx{margin-top:3em;}
}
@media only screen and (max-width: 768px){
	.delete-wrap .page-head{padding-bottom:6px;}
	.delete-wrap .num-list{margin-bottom:1em;}
	.delete-wrap .form-bx{margin-top:2em;}
	.delete-wrap .btn-wrap{width:15em;}
}
@media only screen and (max-width: 567px){
	.delete-wrap .form-bx{gap:1em;}
	.delete-wrap .form-bx,
	.delete-wrap .btn-wrap{flex-wrap:wrap;}
	.delete-wrap .btn-wrap{gap:6px;}
	.delete-wrap .form-inline{flex:0 0 100%;}
	.delete-wrap .btn-wrap{width:100%;}
}

/* mypage */
.my-profile-select .my-user, .mypage-list .my-user {align-items:center;gap: var(--gap-6x);}
.my-profile-select .name, .mypage-list .name {font-weight:var(--font-bold);}
.my-profile-select .my-user {background:var(--dgray0); flex-wrap: nowrap;}
.my-profile-select .my-user .thumb{width:6em;height:6em; border-radius: var(--round-xlg);}
.my-profile-select .my-user .name {font-size:var(--font-2xlg);line-height:var(--lh-36);}
.my-profile-select .my-select-wrap{padding: 1.5em; display:flex;justify-content:center;align-items:center; background:var(--lgray3); border-radius: var(--basic-round); gap: var(--gap-accordion);}
.my-profile-select .my-select-wrap .form-control{min-width:29em;}
.my-profile-select .my-select-wrap .btn-wrap{gap: var(--gap-accordion); flex-wrap: nowrap;}
.my-profile-select .my-select-wrap button {background-color:var(--white);}

@media only screen and (max-width: 1024px){
	#sub-visual.my-profile-select {height: 12em;}
	.my-profile-select .my-user .thumb {width: 5em;height: 5em;}
	.my-profile-select .my-select-wrap {padding: 1em;}
	.my-profile-select .my-select-wrap .form-control {min-width: 25em;}
}
@media only screen and (max-width: 930px){
	.my-profile-select .my-select-wrap {flex-direction: column;}
}
@media only screen and (max-width: 768px){
	#sub-visual.my-profile-select {height: auto; display: contents !important;}
	#sub-visual.my-profile-select .my-user {padding: 1em;}
	.my-profile-select .my-user .thumb {width: 4em;height: 4em;}
	.my-profile-select .my-select-wrap {margin-top: 6px; flex-direction: row;}
	.my-profile-select .my-select-wrap .form-control {padding-inline: 1em 2.5em; background-position: center right 1em;}
}
@media only screen and (max-width: 567px){
	.my-profile-select .my-user .thumb {width: 3em; height: 3em;}
	.my-profile-select .my-select-wrap {flex-direction: column;}
	.my-profile-select .my-select-wrap .form-control{min-width: auto; width: 100%;}
	.my-profile-select .my-select-wrap .btn-wrap {width: 100%;}
	.my-profile-select .my-select-wrap button {flex: 1;}
}

.mypage-list .my-user{display:flex;padding-left:1.5em;}
.mypage-list .thumb{width:4em;height:4em; border-radius: var(--round-xlg);}
.mypage-list .name{font-size:var(--font-xlg);line-height:var(--lh-24);}
.mypage-list .name .birth {font-size: var(--font-base); font-weight: var(--font-normal); line-height: 20px;}
.mypage-list .cont{display:flex;align-items:center;}

.mypage-list{margin-bottom: var(--gap-accordion);}
.mypage-list:last-child{margin-bottom:0;}
.mypage-list .btn-d{height:3em;line-height: 3em;}
.mypage-list .acc-list{}
.mypage-list .acc-list > li{position:relative;background:var(--lgray1);border-radius:var(--basic-round);}
.mypage-list .acc-list > li > a{position:relative;display:grid;grid-template-columns: repeat(3, 1fr);gap:var(--gap-3x);width:100%;padding:1.5em 0;}
.mypage-list .acc-list .acc-cont{padding:0;}

.mypage-list .btn-arr {width: 3em; height: 3em; display:flex;align-items:center; justify-content: center; background-color: var(--dgray0); transition: all .2s linear;}
.mypage-list .btn-arr:has(.ico-arrow){padding:0 12px;}
.mypage-list .acc-list a .btn-arr{position:absolute;top:50%;right:1.5em;transform:translateY(-50%);}
.mypage-list .acc-list > li .btn-arr .ico-arrow:before{-webkit-mask-image: url("../img/icon/sd-arrow-up.svg"); mask-image: url("../img/icon/sd-arrow-up.svg");rotate:180deg;transition:rotate .2s linear;}
.mypage-list .acc-list > li.on .btn-arr .ico-arrow:before{rotate:360deg;}
.mypage-list .tit{font-size:var(--font-lg);line-height:var(--lh-26);padding:4px 0 .667em .667em;}
.mypage-list .acc-cont{padding:0 0 .75em !important;}
.mypage-list .acc-cont ul li{padding:.375em 0 .375em 0; grid-template-columns: repeat(12, 1fr) !important;}
.mypage-list .acc-cont ul li .col-4 {grid-column: span 4 !important}
.mypage-list .acc-cont ul li .date {padding-left: 1.5em;}

.mypage-info .tit {padding-left: 1.33em;}
.mypage-info .tit, .mypage-info ul {grid-column:1 / -1;}
.mypage-info{display:flex;flex-direction:column;gap:var(--gap-6x);}
.mypage-info .history,
.mypage-info .memo{border-top:1px solid var(--dgray1); gap: 0 var(--gap-3x)}
.mypage-info .memo textarea {display:block;min-height:7.5em;field-sizing: content;border:none;outline:none;resize:none;color:var(--dgray2);border-radius:var(--round-sm);padding:1.5em;}
.mypage-info .memo .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;}
.mypage-info .memo .form-group{min-height:7.5em;margin-bottom:0;padding:0 .75em;}
.mypage-info .history .va-mo {display: block !important;}

.my-select-wrap button:focus:not(:focus-visible),
.mypage-list button:focus:not(:focus-visible){outline:none;}

.mypage-list .btn-wrap{position:absolute; top:2em; right: 4.875em; gap:6px;}
.mypage-list .btn-wrap .btn-memo.on{background:var(--black) !important;border-color:var(--black) !important;color:var(--white) !important;}
.mypage-list .acc-list > li > a:hover .btn-arr {background:var(--black) !important;}
.mypage-list .acc-list > li > a:hover .btn-arr .ico-arrow:before {background:var(--white);}

@media only screen and (max-width: 1024px){
	.mypage-list .my-user {padding-left: 1.25em; gap: var(--gap-4x);}
	.mypage-list .thumb{width:48px;height:48px; flex-shrink: 0;}
	.mypage-list .acc-list a .btn-arr {right: 1.25em;}
	.mypage-list .acc-cont ul li {gap: 0;}
	
	.mypage-info .history {gap: 0;}
	.mypage-list .btn-wrap {top: 1.6em; right: 4.6em;}
	.mypage-info .history .va-mo {display: none !important;}
}
@media only screen and (max-width: 930px){
	.mypage-list .my-user {min-width: 20em;}
}
@media only screen and (max-width: 768px){
	.mypage-list .my-user {padding-left: 1em;}
	.mypage-list .thumb {width: 40px; height:40px;}
	.mypage-list .name .va-mo {display: block !important;}
	.mypage-list .btn-d {height:40px; line-height: 40px;}
	
	.mypage-list .acc-list > li > a {padding: 1em 0; display: block !important;}
	
	.mypage-list .cont.va-pc {display: none !important;}
	.mypage-list .btn-arr {width: 40px; height: 40px;}
	.mypage-list .acc-list a .btn-arr {right: 1em;}
	
	.mypage-list .tit {padding:4px 0 0 1em;}
	.mypage-list .acc-cont ul li {padding:2px 0 2px 0;}
	#sub-content .mypage-list .acc-cont ul li .date {grid-column: span 5 !important; padding-left: 1em;}
	#sub-content .mypage-list .acc-cont ul li .round {grid-column: span 3 !important}
	#sub-content .mypage-list .acc-cont ul li .status {grid-column: span 3 !important}
	
	.mypage-info .memo .form-group {padding:0;}
	.mypage-list .btn-wrap {top: 1.125em; right: 4.2em;}
}
@media only screen and (max-width: 567px){
	.mypage-list .name {font-size:var(--font-lg);line-height:var(--lh-22);}
	.mypage-list .acc-list > li.on > a {padding-bottom: 4.8em;}
	.mypage-list .acc-list a .btn-arr{top:1em;transform:unset;}
	
	#sub-content .mypage-list .acc-cont ul li .date {grid-column: span 8 !important;}
	#sub-content .mypage-list .acc-cont ul li .round {grid-column: span 4 !important;}
	#sub-content .mypage-list .acc-cont ul li .status {grid-column: span 12 !important; padding-left: 1em;}
	
	.mypage-info .memo textarea {padding:1em;}
	.mypage-list .btn-wrap {width: calc(100% - 2em); top:5.2em; right: 0; left: 1em; display: none; flex-flow: nowrap;}
	.mypage-list .btn-wrap .btn-d {width: 100%;}
	.mypage-list .acc-list > li.on .btn-wrap {display: flex;}
}
@media only screen and (max-width: 320px){
	#sub-content .mypage-list .acc-cont ul li .date {grid-column: span 8 !important;}
	#sub-content .mypage-list .acc-cont ul li .round {grid-column: span 4 !important}
}


/* mypage : account */
#sub-content.member.l-grid12,
#sub-content.mypage.l-grid12 {margin-block: 6em 1em;}
#snb.mypage-mn {grid-column: span 3 !important;}
#snb.mypage-mn ul li {border-top: 1px solid var(--basic-border);}
#snb.mypage-mn ul li a {display: block; width: 100%; padding-block: 4px .667em; font-size: var(--font-lg); line-height: var(--lh-26);}
#snb.mypage-mn ul li.active .on {font-weight: var(--font-bold);}
#sub-content.mypage #contentArea {grid-column: 5 / 13 !important;}

@media only screen and (max-width: 1024px){
	#sub-content.member.l-grid12,
	#sub-content.mypage.l-grid12 {margin-block: 3em 1em;}
	/* #snb.mypage-mn, 
	#sub-content.mypage #contentArea {grid-column: 1 !important;} */
}
@media only screen and (max-width: 768px){
	#sub-content.member.l-grid12,
	#sub-content.mypage.l-grid12 {margin-block: 0;}
	#snb.mypage-mn{grid-column:span 12 !important;}
	#sub-content.mypage #contentArea{grid-column: 1 / 13 !important;}
}
@media only screen and (max-width: 567px){}

.mypage .page-head {border-top: 1px solid var(--black); min-height: 86px; padding: 0;}
.mypage .page-head h2 {font-size: var(--font-xlg); line-height: var(--lh-24); margin: 6px 0 0.5em;}
.mypage .mem-cont .btn-wrap {margin-block: 2em 6em;}
.mypage .mem-cont:has(.joind-txt) .btn-wrap{margin-block:0;}
.mypage .mem-cont:has(.joind-txt){padding-bottom:0;}
.mypage .member-form {display: flex; flex-direction: column; gap: 2em;}
.mypage .mem-cont .joind-txt {padding-bottom: 2em;}
.mypage .btn-d {background-color: var(--lgray1);}
.mypage .account-btn {display:flex;gap:.75em;padding-bottom: 6em;}

.mypage input[id^="targetBirth_"],
.mypage input[id^="dueDate_"] {position: relative;appearance: none;-webkit-appearance: none;background: url("../img/icon/sd-check-day.svg") center right 20px / 24px no-repeat var(--lgray1);}
.mypage input[id^="targetBirth_"]::-webkit-calendar-picker-indicator,
.mypage input[id^="dueDate_"]::-webkit-calendar-picker-indicator {position: absolute;top: 0;right: 0;width: 64px;height: 100%;margin: 0;padding: 0;opacity: 0;cursor: pointer;}

@media only screen and (max-width: 1024px){
	.mypage .mem-cont .btn-wrap {margin-block:1em 3em;}
	.mypage .member-form{gap:1.25em;}
	.mypage .account-btn{padding-bottom:3em;}
	.mypage .mem-cont .joind-txt{padding-bottom:1em;}
}
@media only screen and (max-width: 768px){
	.mypage .page-head{min-height:auto;padding-bottom:1em;}
	.mypage .account-btn{padding-bottom:2em;}
	.mypage input[id^="targetBirth_"],
	.mypage input[id^="dueDate_"]{background-position:center right 14px !important;}
	.mypage .mem-cont .btn-wrap {margin-block:1em 1.5em;}
}
@media only screen and (max-width: 567px){
	.mypage .mem-cont .btn-wrap,
	.mypage .account-btn{flex-wrap:wrap;}
	.mypage .account-btn a,
	.mypage .account-btn .w324{width:100% !important;}
}

/* mypage : input style */
.mypage .mem-cont .member-option label {background: var(--dgray0); color: var(--dgray2);}
.mypage .mem-cont .form-control:disabled {background-color: var(--dgray0); border-color: var(--dgray0);}
.mypage .mem-cont .form-control:not(select) {border-color: var(--lgray1); background-color: var(--lgray1);}
.mypage .mem-cont select.form-control {background-color: var(--lgray1);}