@charset "UTF-8";

/* 마이페이지_이력서 등록 */
.resume-block{row-gap: 3rem; display: flex;}
.resume-banner a{height: 13.2rem; display: flex; align-items: center; border-radius: 1rem; overflow: hidden;}
.resume-banner picture{height: 100%;}
.resume-banner img{width: 100%; height: 100%;}
.resume-banner br{display: none;}
.resume-menu {display: flex; justify-content: space-between; gap: 3.8rem;}
.resume-menu li{display: flex; width: 100%;}
.resume-menu li button{ width: 100%;}
.resume-list{display: grid; flex-wrap: wrap; gap: 3.8rem; row-gap: 2.4rem; justify-content: space-between; grid-template-columns: 1fr 1fr;}
.resume-con{display: flex; flex-direction: column; width: 100%; border: 1px solid #ECECEC; padding: 2rem; gap: 1.4rem; border-radius: 0.6rem;}
.resume-con hr{height: 1px; display: block; background-color: #ECECEC; margin: 0; border: none; opacity: 1;}
.resume-con > div{display: flex; justify-content: space-between; color: #999; font-weight: 400;}
.resume-con div:first-of-type {font-size: 1.2rem;}
.resume-con div:first-of-type p{color: #999; font-weight: normal; display: flex; align-items: center; gap: 1rem;}
.resume-con div:first-of-type span{display: none;}
.resume-con div:first-of-type button.dropdown-toggle{display: flex; background: url(../images/icon_more_g.svg) no-repeat 50% 50%; font-size: 1px; text-indent: -99999px; overflow: hidden;  width: 5.8rem; }
.resume-con.default div:first-of-type span{font-size: 1.4rem; display:inline-flex;}
.resume-con div:last-of-type{color: #000; align-items: center;}
.resume-con.default {border-color: #0040BF; padding: 0; gap: 0;}
.resume-con.default > div:first-of-type{background-color: #0040BF; padding: 0 2rem; height: 4rem;}
.resume-con.default > div:first-of-type p{color: #fff;}
.resume-con.default > div:first-of-type button.dropdown-toggle{display: flex; height: 4rem; background: url(../images/icon_more_w.svg) no-repeat 50% 50%;}
.resume-con.default > div:first-of-type svg circle{fill: #fff;}
.resume-con.default hr{display: none;}
.resume-con.default div:last-of-type{padding: 2.25rem 2rem; height: 7.4rem; display: flex; gap: 3rem;}
.resume-con.default div:last-of-type p{display: table; table-layout: fixed; width: 100%;}
.resume-con.default div:last-of-type p span{display: table-cell;  white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}


.resume-block .adress{width: 100%; }
.resume-block .adress .detail{flex-wrap: wrap;}
.resume-block .adress #zipcode{width: auto; background: #fff;}
.resume-block .adress #txtRoadAddr,
.resume-block .adress #rgdtAddr2{width:100%; background: #fff;}
.resume-block .adress #schAddr{border-color: #222; color: #222; border-radius: 4px;}

.resume-block #highest_education_level{width: 85%; margin-left: auto; background:#fff;}
/*.resume-block .input-box input[type=text].datepicker{padding: 0.5rem; text-align: center;}*/


.btn-default{ display: inline-flex; align-items: center; justify-content: center;}
.btn-default.btn-sm{font-size: 1.2rem; padding: 0.6rem 1.2rem;}
.btn-default.btn-pink{color: #FF4856; background: #FFE9F4;}
.resume-con .dropdown-menu.show{
flex-direction: column; font-size: 1.4rem; padding: 1.6rem; display: flex; row-gap: 0.8rem;
border-radius: 5px;
border: 1px solid #ECECEC;
background: #FFF;
box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.06), 0px 1px 4px 0px rgba(0, 0, 0, 0.04), 0px 0px 1px 0px rgba(0, 0, 0, 0.04);
}
.resume-con .dropdown-menu li{}
.resume-con .dropdown-menu button{padding: 0; color: #333 ; font-size: 1.4rem;}
.resume-con .dropdown-menu button:hover{background: none;  color: #0040BF;}
.resume-block .btn-st-brd-50{gap: 1rem; display: flex; align-items: center; justify-content: center;}
.resume-block .sec{margin-bottom: 3.125rem;}

.biz-wrap{background-color: #ECF8FF;}

@media all and (max-width:767px) {
    .resume-banner a{width:100%; align-items:flex-start; font-size: 2rem; aspect-ratio: 2 / 1;  height: 16rem;}
    .resume-banner picture{height: 100%; width: 100%;}
    .resume-banner br{display: block;}
    .resume-menu {flex-direction: column; gap: 1rem;}
    .resume-list{display: grid; flex-wrap: wrap; row-gap:1rem; justify-content: space-between; grid-template-columns: 1fr;}
}

.sub-desc .my-tit{font-size: 1rem; color: #000; font-weight: 400; line-height: 1.5rem; padding: 7px 0; position: relative;}
.sub-desc .my-tit i{color:#A2228E; font-style: normal; position: absolute; right: 0; top: 0; }


.resume-form{width: 100%;}
.resume-form input,
.resume-form input[type="text"],
.resume-form input[type="password"],
.resume-form input[type="number"],
.resume-form input[type="email"],
.resume-form input[type="tel"],
.resume-form input[type="time"],
.resume-form input[type="date"],
.resume-form input[type="radio"],
.resume-form select,
.resume-form input.datepicker,
.resume-form textarea{font-size: 1rem; height: 2.5rem;}

.resume-form input[type="radio"]{width: 1.25rem; height: 1.25rem; margin-right: 0.65rem;accent-color: #c11fa8;}

.resume-form textarea{border: 1px solid #DFDFDF; border-radius: 4px; font-size: 1rem; font-weight: 400; width: 100%; padding: 2rem; min-height: 15rem;}

.resume-header{display: flex;}
.resume-header .form-block .form h4{width: 8rem; font-weight: 400;}
.resume-header > div{display: flex; margin-bottom: 5rem;}
.resume-header .title{gap: 2rem;}
.resume-header .title input{background-color: #F2F4F8;padding: 1rem 2rem ;}
.resume-header .info{display: flex; gap: 1.25rem; flex-wrap: wrap;}
.resume-header .info .avatar{width:8.125rem; position: relative; height: 9.875rem;}
.resume-header .info .avatar img{width: 100%; height: 100%;}
.resume-header .info .avatar .btn-gray{font-size: 0.93rem; line-height: 1.37rem; width: 100%; padding: 5px 0;}



.resume-header .info .tel-wrap .d-flex{gap: 0 0.6rem;}
.resume-header .info .tel-wrap input,
.resume-header .info .tel-wrap select{width: 7.5rem;}
.resume-header .info .mail-wrap .d-flex{gap: 0 0.6rem;}
.resume-header .info .mail-wrap input,
.resume-header .info .mail-wrap select{width: 12.5rem;}
.resume-header .info dl{ width: 80%; display: flex; flex-wrap: wrap; gap: 0 1.25rem;}
.resume-header .info dl dt{font-size: 2.2rem;}
.resume-header .info dl dd{font-size: 1.6rem; color: #848484; font-weight: 400; width: 47%; display: flex; flex-direction: column; justify-content: center;}
.resume-header .info dl dd:last-child{width: 100%;}
.resume-header .info dl dd ul{display: flex; gap:0 1.25rem;}
.resume-header .info dl dd ul li{display: flex; gap: 0.3rem; align-items: center;font-size: 1rem;}
.resume-header .info-select{display: flex; align-items: center; gap: 0 0.6rem; flex-wrap: wrap}

.resume-header .info-select select{font-size: 1rem; width: 7.5rem;}
.resume-header .default-radio input{width: 1.4rem; height: 1.4rem;}
.resume-header .form-block .form .form-con{align-items: flex-start;}


.resume-form-con{display: flex; flex-direction: column; gap: 3.125rem 0;}
.resume-form-con .sec-01 dd{padding: 0.875rem 0; border-bottom: 1px solid #D9D9D9;}
.resume-form-con .sec-01 dd:last-child{border-bottom: none;}
.resume-form-con .sec-01 dd + dd{margin-top: 1.25rem;}
.resume-form-con .sec-01 dd .box{gap: 0 1.875rem;}
.resume-form-con .sec-01 dd .box label{color: #666;}
.resume-form-con .sec-01 dd .box input[type="date"]{width: 7.5rem; padding: 0.5rem;}
.resume-form-con .sec-01 dd .box #date01{width: auto; margin: 0 0.65rem;}
.resume-form-con .sec-02 .my-input-box{position: relative; padding-top: 2rem;}
.resume-form-con .sec-02 .my-input-box .del-btn{position: absolute; top: 0.5rem; right: 1rem;}

.resume-block #highest_education_level{width: 75%;}
.resume-header .info dl dd:last-child span{display: inline-block; font-size: 1rem; color: #222; margin-left: 1rem;}
.resume-block #user_birth{width: 47%;}
.graduation_input_wrapper{display: none;}

.box-gray{background: #F4F4F4;}
.box-gray .input-box{ border: none;}
.box-gray .line.my-tit{margin-bottom: 1.25rem;}
.box-gray .line.my-tit .d-flex{gap: 0 2rem;}
.box-gray .my-tit.info{font-size: 0.875rem;}
.box-gray .line.my-tit .sub-span{color: #222; margin-top: 0; display: flex;align-items: center;gap: 0 0.5rem;}
.box-gray .my-input-box{background: #fff; border: 1px solid; padding: 0.937rem;}
.box-gray table{border-spacing: 0.5rem 0.5rem;border-collapse: separate;}
.box-gray thead{margin-bottom: 0.625rem;}
.box-gray tbody tr + tr{margin-top: 0.625rem;}
.box-gray tbody td .my-tit{display: none;}
.box-gray tbody td textarea{min-height: 2.5rem; padding: 0.5rem 1rem; height: 2.5rem;}
.box-gray .bottom{margin-top: 0.625rem;}
.box-gray .bottom span{display: block; width: 7rem; }
.box-gray .date-box .d-flex{align-items: center; gap: 0 0.937rem;}
.box-gray .del{text-align: center;}
.box-gray .del-btn{width: 2.12rem; height: 2.12rem; background: url("../images/common/del_btn.svg") no-repeat center; background-size: contain; margin: 0 auto;}

.box-gray .project-box .d-flex{flex-wrap: wrap;}
.box-gray .project-box .d-flex + .d-flex{margin-top: 0.625rem;}
.box-gray .project-box .my-tit{width: 20%; }
.box-gray .project-box input[type="text"] {width: 74%;}
.box-gray .project-box textarea{width: 80%;}
.box-gray .project-box .info{padding-left: 20%;margin-top: 0.625rem;font-size: 0.875rem;}
.box-gray .project-box .file-wrap{width: 80%;}

.box-gray .project-box .file-wrap .file-upload + .file-upload{margin-top: 0.625rem;}
.box-gray .project-box .file-wrap .file-upload .upload-nm{width: 90%; height: 2.5rem; border-radius: 4px; line-height: 2.5rem; font-size: 1rem;}
.box-gray .project-box .file-wrap .file-upload .upload-label{background: #D0D0D0; color: #222; font-size: 1rem; border-radius: 4px; height: 2.5rem}
.box-gray .box_container p{font-size: 1rem}
.sec .chk-wrap{ margin-top: 1.875rem;}


.sec-06 td .d-flex{gap: 0 0.5rem;}




    /*.resume-form-con > div{display: flex; flex-direction: column; gap: 2rem;}*/
.resume-form-con h4{font-size: 2rem; font-weight: 500;}
.title-line{display: flex; justify-content: space-between;}
.resume-form-con hr{height: 1px; display: block; background-color: #ECECEC; margin: 0; border: none; opacity: 1;}
.resume-form-con hr.red{background-color: #FF4856;}
.pd-x-2{padding: 0 2rem;}
.flex{display: flex;}
.flex-right{justify-content:flex-end !important; gap: 1rem; color: #848484; display: flex;}
.fc-primary{color: #FF4856;}
.fc-gray{color: #848484;}
.btn-add{display: flex; align-items: center; justify-content: center; font-size: 1rem; width: 8.75rem; height: 2.5rem; color: #222; border: 1px solid; border-radius: 4px; margin-top: 1.43rem;}

.input-box{border: 1px solid #DFDFDF; padding: 1rem; gap: .8rem; display: flex; flex-direction: column;}
.input-box input[type=text],.input-box input[type=number]{border: 1px solid #dfdfdf; height: 2.5rem; width: fit-content; padding: 0.5rem 1rem; width: 100%;}
.input-box input[type=text].input-lg{font-size: 1rem;}
.input-box input[type=number]{text-align: center;}
.resume-form-con .block{display: flex; justify-content: space-between;  gap: 10rem;}
.resume-form-con .line{display: flex; gap: 1rem; align-items: center; color: #999999;}
.input-box input[type=checkbox]{width: 20px; height: 20px; border: 1px solid #DFDFDF !important; outline: none;}
.input-box input[type=checkbox]+label{color: #999999; font-weight: 400;}
.input-box .block .line:first-of-type{flex-grow: 1;}

.input-box .block .line:last-of-type{margin-left: auto;}
.text-center{text-align: center;}

.input-result{border-radius: 0.6rem; background: #F4F4F4; padding: 1rem; gap: 1rem; display: flex; flex-direction: column;}
.input-result dl.block{padding: 0 1rem; display: flex; align-items: center; gap: 1.2rem;}
.input-result dl.block dd{font-size: 1.2rem; color: #848484; font-weight: 400;}
.input-result dl.block dd:nth-of-type(2){color: #333;}
.input-result dl.block dd:last-of-type{margin-left: auto; display: flex; gap: 2rem;color: #848484;}
.input-result dl.team{display: flex; align-items: center; font-size: 1.4rem; gap:0.6rem; color: #333; padding: 0 1rem;}
.input-result dl.team dt{font-weight: normal;}
.input-result dl.team dd{font-weight: normal;}
.input-result .result{border-radius: 6px; background: #FFF; display: flex; flex-direction: column; gap: 0.6rem; padding: 1rem; color: #5D5D5D; font-weight: 400;}
.skill-list{display: flex; gap: 1rem; align-items: center;}
.skill-list li{display: flex; align-items: center; padding: 1rem 1.6rem; border-radius: 5rem;background: #F4F4F4; font-size: 1.4rem; gap: 0 0.6rem;}
.skill-list span{display: block;  max-width: 15rem; white-space: nowrap;overflow: hidden;word-break: break-all;text-overflow: ellipsis;-o-text-overflow: ellipsis;}
.skill-list button{content: ''; display: inline-block; width: 1.2rem; height: 1.2rem; background: url("../../images/icon_remove_g.svg")no-repeat center;}
.resume-form select{border: 1px solid #dfdfdf; color: #999999; height: 2.5rem; width: 100%; border-radius: 4px;}
.resume-form select:focus{outline: none;}
.resume-block .resume-tit{cursor: pointer;}
#academic{width: 300px;}
.btn-confirm{ margin-top: 5rem; gap: 1rem; width: 100%;}
.btn-confirm button{border: none; height: 3.75rem; margin: 0; font-size: 1.125rem; display: flex; align-items: center; width:15.625rem; justify-content: center;}


@media all and (max-width:767px) {

    .resume-form-con{gap: 3.07rem;}
    .resume-form-con .sec-02 .my-input-box{padding-top:4rem;}
    .resume-form-con .sec-02 .my-input-box .del-btn{top: 1rem;}
    /*.mypage-wrap select,
    .input-box input[type=text], .input-box input[type=number],input.datepicker{height: 3.5rem; font-size: 1.125rem; padding: 0 0.5rem;}*/
    .mypage-wrap input,
    .mypage-wrap input[type="text"],
    .mypage-wrap input[type="password"],
    .mypage-wrap input[type="number"],
    .mypage-wrap input[type="email"],
    .mypage-wrap input[type="tel"],
    .mypage-wrap input[type="time"],
    .mypage-wrap input[type="date"],
    .mypage-wrap input[type="radio"],
    .mypage-wrap select,
    .mypage-wrap input.datepicker,
    .mypage-wrap textarea{height: 3.5rem; font-size: 1.076rem !important; padding: 0 0.5rem;}
    .resume-header,
    .mypage-wrap .border-top{flex-wrap: wrap;}
    .mypage-wrap .sub-tit{}
    .resume-header .info{flex-wrap: wrap; width: 100%;}
    .mypage-wrap .sub-tit{width: 100%; margin-bottom: 1.153rem; font-weight: 700; font-size: 2rem; line-height: 3.07rem;}
    .mypage-wrap .sub-desc{width: 100%; gap: 0;}
    .sub-desc .my-tit{font-size: 1.3rem; font-weight: 400; margin-bottom: 0.769rem; position: relative;}
    .box-gray .line.my-tit .d-flex{width: 50%; gap: 0;}
    .sub-desc .my-tit i{font-weight: 400;}
    .sub-desc .my-tit .del-btn{position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
    .box-gray .del-btn{margin: unset; margin-left: auto;}
    .m-w-full{width: 100%; display: flex; flex-wrap: wrap; gap: 0.5rem}
    .m-full{width: 100%;}
    .box-gray tbody td.m-full label.my-ti{width: 100%;}
    .box-gray tbody td.m-full input,
    .sec-02 .input-box .block .line input.m-full{width: 100%;}

    /*.resume-header .info .avatar{width: 10rem;}*/

    .resume-header .info dl{width: 100%; margin-top: 1rem; gap: 1.25rem;}
    .resume-header .info dl dd{width: 100%;}
    .resume-header .info dl dd ul{flex-direction: row;}
    .resume-header .info-select select{width: 25%; font-size: 1.125rem;}
    .resume-header .info-select .my-tit{margin-bottom: 0;}
    .resume-header .info .tel-wrap,
    .resume-header .info .mail-wrap{margin-top: 1.53rem;}
    .resume-header .info .tel-wrap input,
    .resume-header .info .tel-wrap select{width: 33%;}
    .resume-header .info .mail-wrap input,
    .resume-header .info .mail-wrap select{width: 48%; font-size: 1.125rem;}
    .resume-header .info dl dd ul li{font-size: 1.23rem;}
    .resume-form-con .sec-01 dd{padding: 1.538rem 0;}
    .resume-form-con .sec-01 dd .box{flex-wrap: wrap; gap:0.76rem 2.3rem}
    .resume-form-con .sec-01 dd:nth-child(1) .box label{width:calc(33.33% - 1.6rem); font-size: 1.23rem;}
    .resume-form-con .sec-01 dd:nth-child(2) label{width: 100%; font-size: 1.23rem;}
    .resume-form-con .sec-01 dd:nth-child(3) li{width: 100%;}
    .resume-form-con .sec-01 dd .box input[type="date"]{margin-left: 2rem; width: 9.23rem; font-size: 1.25rem;}
    .resume-form-con .sec-01 dd .box label{font-size: 1.23rem;}
    .box-gray .input-box{padding: 1.15rem;}
    .box-gray .my-input-box{padding: 1.76rem 1.15rem;}
    .input-box .block .line .my-tit{margin-bottom: 0;}
    .input-box .block .line input,
    #academic{width: 65%;}

    .box-gray .line.my-tit .sub-span input{ width: 55% !important; padding: 0.5rem;}
    .resume-form input[type="radio"]{width: 1.7rem; height: 1.7rem;}
    .resume-header .addr-wrap{margin-top: 2rem;}

    /*.box-gray table{display: flex;}*/
    /*.box-gray table colgroup{display: none;}*/
    /*.box-gray table thead{width: 20%;}*/
    /*.box-gray table thead tr,*/
    /*.box-gray table tbody tr{display: flex; flex-wrap: wrap; width: 100%;}*/
    /*.box-gray table thead tr .my-tit,*/
    /*.box-gray table tbody tr td{width: 100%;}*/
    .box-gray table{display: flex; flex-direction: row; min-width: 100%; border: none;}
    .box-gray table colgroup{display: none;}
    .box-gray table thead {display: none;}

    .box-gray table tbody {display: block; width: 100%;}
    .box-gray table tbody tr {display: block;}
    .box-gray table tbody td{padding: 0 !important; margin-bottom: 0.769rem; display: flex; align-items: center; padding: 0.5rem;white-space: nowrap;}
    .box-gray tbody td label.my-tit{display: block;}
    .box-gray tbody td .my-tit{display: block;padding: 0; margin: 0;width: 40%;}
    .box-gray table tbody td input[type="text"],
    .box-gray table tbody td select,
    .box-gray .date-box .d-flex{width: 60% !important;}
    .box-gray .date-box .d-flex{justify-content: space-between}
    .box-gray table tbody td input[type="date"]{width: 41%;}
    .box-gray table tbody td input.datepicker.m-full{width: 60%;}
    .box-gray tbody td textarea{height: 3.5rem; min-height: 3.5rem; font-size: 1.125rem; padding: 1rem;}
    .box-gray tbody td.m-w-full label.my-tit{margin: 1rem 0;}
    .sec-06 td .d-flex{width: 70%; font-size: 1.25rem;}
    .email{font-size: 1.25rem}
    .box-gray .project-box .my-tit{width: 100%;}
    .box-gray .project-box input[type="text"],
    .box-gray .project-box textarea,
    .box-gray .project-box .file-wrap{width: 100%;}
    .box-gray .project-box .file-wrap .file-upload .upload-nm{height: 3.5rem; line-height: 3.5rem;}
    .box-gray .project-box .file-wrap .file-upload .upload-label{height: 3.5rem; font-size: 1.23rem;}
    .box-gray .project-box .info{padding-left: 0; font-size: 1.076rem;}

    .box-gray .bottom p{flex-wrap: wrap;}
    .box-gray .bottom span{width: 100%}
    .box-gray .my-tit.info,
    .sec .chk-wrap{font-size: 1.076rem;}
    .btn-add{width: 10.76rem; height: 3.5rem; font-size: 1.23rem;}


input,select, textarea{font-size: 1.23rem !important}
.resume-header .title{gap: 2rem; flex-direction: column;}
.resume-header .title input{background-color: #F2F4F8;padding: 1rem 2rem ;}
.resume-header .info .image{width: 13.8rem; height: 17.2rem;}


/*.resume-form-con{gap: 5rem;}*/
.pd-x-2{display: none;}
.input-result{background: #fff; padding: 0; gap: 0.6rem;}
.input-result dl.block{padding: 0 ; display: flex; align-items: center; gap: 1.2rem; justify-content: flex-start;}
.input-result dl.block dt{flex: none;}
.input-result dl.block dd{font-size: 1.2rem; color: #848484; font-weight: 400; word-break: break-all;}
.input-result dl.block dd:nth-of-type(2){color: #333;}
.input-result dl.block dd:last-of-type{display: none;}
.input-result .result{display: none;}
.input-result dl.team{padding: 0;}
.skill-list{display: flex; gap: 1rem; flex-wrap: wrap;}
.skill-list li{display: flex;  padding: 0.5rem 1rem; border-radius: 5rem;background: #F4F4F4; font-size: 1.2rem; flex: none;}
.btn-confirm{display: flex; justify-content: center; margin-top: 2rem; gap: 1rem; padding: 0;}
.btn-confirm button{height: 3.75rem; display: flex; align-items: center; padding:0; justify-content: center;border: none; font-size: 1.25rem;}
.btn-confirm button.btn-gray{background: #e6e6e6; color: #000; width: auto; padding: 0 2rem;}
.resume-form-con > div:last-of-type dl.block{align-items: flex-start;}
}


/* 기업회원 */

.enter-wrapper{background-color:#ECF8FF;}
.enter-header{background:#0BBDFF; letter-spacing: 0;}
.enter-header .max-conts{color: #fff; font-weight:300; display: flex; justify-content:space-between; height: 6rem; align-items: center; padding: 0;}
.enter-header nav{display: flex; align-items: center; gap: 2rem;}
.enter-header nav dl{display: flex; align-items: center;}
.enter-header nav a{display: flex; padding: 0.8rem 1.2rem; border-radius: 5px; border: 1px solid #DFDFDF; background: #FFF; color: #5D5D5D; font-size: 14px; line-height: 100%;}
.enter-header .company-select{display: flex; align-items: center; gap: 0.4rem; font-size: 1.2rem; color: #fff;}
.enter-header .company-select .img-bx{width: 3rem; height: 3rem; border-radius: 3rem; overflow: hidden;}
.enter-header .company-select .img-bx img{width: 100%; height: 100%;}
.enter-header .company-select:after{content: ""; display: flex; background: url(/images/icon_arrow_down_w.svg) no-repeat 50% 50%; background-size: cover; width: 1.6rem; height: 1.6rem;}
.enter-header .m-menu{display: flex; width: 2.4rem; height: 2.4rem; align-items: center; justify-content: center; background: url(/images/ico-m-menu.svg) no-repeat 50% 50%; text-indent: -9999px; overflow: hidden; display: none; }
.enter-header .dropdown-menu {border: none; padding: 0; background: none;  }
.enter-header .dropdown-menu ul{font-size: 1.4rem;  padding: 0.8rem 1.6rem; display: flex; flex-direction: column; gap: 0.8rem; margin-top: 1.3rem; box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.06), 0px 1px 4px 0px rgba(0, 0, 0, 0.04), 0px 0px 1px 0px rgba(0, 0, 0, 0.04); background: #fff; border-radius: 0.5rem;}
.enter-header .dropdown-menu button{padding: 0; color: #5D5D5D;}
.enter-header .dropdown-menu button:hover{background: none;}
.enter-header .dropdown-menu ul li:nth-child(3) button{color: #FC4F32;}
.enter-header .dropdown-menu ul li:nth-child(4){padding-top: 0.8rem; border-top: 1px dashed #DFDFDF;}

.company-container{display: flex; padding: 5rem 0 7rem; gap: 3rem; overflow: hidden;}

.left-menu{width: 22rem; display: flex; flex-direction: column; gap: 2rem; flex: none;}
.company-name{display: flex; flex-direction: column; border-radius: 6px; background: #FFF; padding: 2rem; gap: 1.2rem;}
.company-name h2{display: flex; flex-direction: column; padding-bottom: 2rem; border-bottom: 1px solid #DFDFDF; gap: 1.2rem; align-items: center; font-weight: 500; line-height: 100%;}
.company-name h2 .ci-img{width: 6rem; height: 6rem; overflow: hidden; border-radius: 6rem;}
.company-name h2 img{width: 100%; height: 100%;}
.company-name p{color: #5D5D5D; font-size: 1.2rem; text-align: center;line-height: 100%;}
.btn-list{display: flex; flex-direction: column; gap: 1rem;}
.btn-list li a{display: flex; align-items: center; justify-content: center; color: #fff; font-weight:600; gap: 0.4rem; border-radius: 0.6rem; height: 5rem;}
.btn-list li:nth-child(1) a{background-color: #FF4856;}
.btn-list li:nth-child(2) a{background-color: #9A188B;}
.btn-list li:nth-child(3) a{background-color: #0040BF;}

.menu-enter{border-radius: 6px; background: #FFF; padding: 3rem; display: flex; flex-direction: column; gap: 2.4rem;}
.menu-enter dl{display: flex; flex-direction: column; gap: 1.4rem;}
.menu-enter dl dt{display: flex; align-items: center; font-weight: 500; gap: 0.6rem;  line-height: 100%;}
.menu-enter dl dd {padding-left: 3rem;}
.menu-enter dl dd a{font-size: 1.4rem; color: #5D5D5D; font-weight: 300; line-height: 100%;}
.menu-enter dl dd a:hover{color: #0068FF;}
.menu-enter dl dd.active a{color: #0068FF;}
.contents{max-width: 100%; position: relative; width: 100%;}
.contents .title-line{padding-bottom: 2rem; align-items: center; justify-content: flex-start;}
.contents .title-line h3{font-size: 2.2rem; font-weight: 700; margin-right: 1rem;}

.bottom-banner{border-radius: 0.6rem; overflow: hidden;}
.bottom-banner .banner-type-01{height: 12rem;}
.banner-type-01{width: auto; height: 15rem; background-color: #eeeeee;}
.banner-type-01 img{width: 100%; height: 100%; object-fit: cover;}
/*.banner-type-01 dl{display: flex; flex-direction: column; gap: 1rem;}*/
/*.banner-type-01 dl dt{font-size: 1.8rem; font-weight: 300; line-height: normal;}*/
/*.banner-type-01 dl dd{font-size: 3rem; font-weight: 400; line-height: 3.3rem;}*/
/*.banner-type-01 br{display: none;}*/

.block-white{display: flex; border-radius: 6px; background: #FFF; padding: 3rem; font-weight: 300; gap: 3rem; align-items: center; margin-bottom: 3rem;}
.block-white dl.num{width: 13rem; height: 13rem; display: flex; align-items: center; justify-content: center; flex-direction: column; color: #fff; background-color: #38B4FB; border-radius: 20rem; gap: 0.4rem; flex: none;}
.block-white dl.num dt{font-size: 4rem; font-weight: 500;}
.block-white dl.num dd{}
.list-view{ flex-grow: 1;}
.wish-list{display:grid; grid-template-columns: 1fr 1fr; row-gap: 1.6rem; padding: 1.95rem 0; position: relative;}
.wish-list li a{color: #333; font-weight: 500;}
.wish-list li:nth-child(2n+1){padding-right: 3rem;}
.wish-list li:nth-child(2n+2){padding-left: 3rem;}
.wish-list:after{content: ""; display:block; width: 1px; height: 100%; left: 50%; background-color: #DFDFDF; position: absolute;}

.people-list{display: grid; grid-template-columns: 1fr 1fr 1fr; row-gap: 4rem; }
.people-list{}
.people-list div{display: flex; align-items: center;position: relative;}
.people-list div a{display: flex; gap: 0.6rem; padding: 0.7rem 2rem; align-items: center; border-left: 1px solid #DFDFDF;}
.people-list div:nth-child(-n+3):after{content: ""; display:block; height: 1px; width:100%; left: 0%; bottom: -2rem ; background-color: #DFDFDF; position: absolute;}
.people-list a p.image{display: flex; border-radius: 10rem; width: 6rem; height: 6rem; overflow: hidden; flex: none;}
.people-list a p img{width: 100%; object-fit: cover;}
.people-list a dl{display: flex; flex-direction: column; gap: 0.6rem;}
.people-list a dl dt{line-height: 100%; font-weight: 400;}
.people-list a dl dd{color: #5D5D5D; font-size: 1.4rem;}
.people-list div:nth-of-type(1) a,.people-list div:nth-of-type(4) a{border: none; padding-left: 0;}
.people-list div:nth-of-type(3) a,.people-list div:nth-of-type(6) a{padding-right: 0;}

/* 그룹 내 형제요소가 3개 이하일 때 전체 선택 */
.people-list div:nth-last-child(-n+3):first-child:after{content: none;}
.people-list div:nth-last-child(-n+3):first-child ~ div:after{content: none;}

.my-service-info{margin-bottom:1.2rem; display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 2rem; }
.my-service-info dl{background-color: #fff; height: 8rem;border-radius: 0.6rem; align-items: center; justify-content:space-between; display: flex; padding: 0 2rem;}
.my-service-info dl dt{font-weight: 500; color: #333;}
.my-service-info dl dd{font-size: 3rem; color: #FF4856; font-weight: 700;}

.resume-block .addr-wrap{margin-top: 2rem;}

@media all and  (max-width:1214px) {
    .enter-header{position: sticky; top: 0; z-index: 10;}
    .enter-header .max-conts{padding: 0 2rem;}
    .enter-header nav{margin-left: auto; gap: 1rem;}
    .enter-header nav a,.enter-header nav .company-select p,.enter-header nav .company-select::after{display: none;}
    .enter-header .m-menu{display: block; margin-left: 2rem;}
    /*.resume-header .info .avatar{height: 18rem;}*/
    .resume-header .info dl{margin-top: 3rem;}
    .resume-block .addr-wrap{margin-top: 0;}
    .resume-block .adress #schAddr{min-width: 8rem;}

    .left-menu{position: fixed; z-index: 10; background-color: #ECF8FF; width: 100%; left: 0; padding-left: 2rem; padding-right: 2rem; top:6rem; padding-top: 5rem; padding-bottom: 6rem; height:calc(100vh - 6rem); overflow-y: auto; transform: translateX(-100%); }
    .people-list{grid-template-columns: 1fr 1fr; row-gap:0; column-gap: 2rem;}
    .people-list div:nth-child(-n+3):after{content: none;}
    .people-list div{ border-bottom: 1px solid #DFDFDF; padding: 1.3rem 0; }
    .people-list div:last-of-type, .people-list div:last-of-type a{border: none; padding-bottom: 0;}
    .people-list div a{border: none; padding-left: 0; padding-right: 0;}
    body.active{overflow: hidden;}
    body.active .left-menu{transform: translateX(0);}

    .enter-header .m-menu{position: relative; top: unset; left: unset; flex-grow: unset; transform: unset;}
}
@media all and (max-width:767px) {

    .block-white{flex-direction: column; padding: 3rem 2rem; margin-bottom: 5rem;}

    .list-view{ flex-grow: 1; width: 100%;}
    .wish-list{display:grid; grid-template-columns: 1fr; row-gap: 1.6rem; padding:0; position: relative;}
    .wish-list li:nth-child(2n+1){padding-right: 0rem;}
    .wish-list li:nth-child(2n+2){padding-left: 0rem;}
    .wish-list:after{display: none;}

    .people-list{display: grid; grid-template-columns: 1fr; row-gap:0; column-gap: 2rem; position: relative;}
    .people-list:after{display: none;}
    .people-list a{display: flex; width: 100%; gap: 0.6rem; padding: 0; align-items: center; border-left:0;}
    .people-list hr{height: 1px; display: block; background-color: #ECECEC; margin: 0; border: none; opacity: 1;}



    .my-service-info{margin-bottom:5rem; display:grid; grid-template-columns: 1fr; gap: 1rem; }
    .banner-type-01{display: flex; align-items:flex-start; color: #fff; height: 20rem;}
    .banner-type-01 picture{height: auto; width: 100%;}
    .banner-type-01 img{width: 100%; height: 100%; object-fit: cover;}
    .banner-type-01 dl{display: flex; flex-direction: column; gap: 0.6rem;}
    .banner-type-01 br{display:block;}
}



.enter-con{padding: 4rem; border-radius: 6px; background: #FFF; display: flex; flex-direction: column; gap: 5rem;}
.enter-con .title-line{padding-bottom:0;}
.enter-con .btn-confirm button{}
.form-block{display: flex; flex-direction: column; gap: 3rem;}
.form-block .form{display: flex; position: relative;}
.form-block .form .btn-form{position: absolute; right: 1.6rem;color: #999; font-size: 1.4rem; top: 1rem;}
.form-block .form h4{display: flex; align-items: center; height: 4rem; font-weight:700; width: 14rem; flex: none; gap: 0.2rem;}
.regi-box .form-block .form h4{font-size: 1.6rem;}
.form-block .form h4 span{color: #FC4F32;}
.form-block .form .form-con{flex-grow: 1; display: flex; flex-wrap: wrap; position: relative; column-gap: 10rem; align-items: center;}
.regi-box .form-block .form .form-con{align-content: flex-start;}
.form-block .form .form-con.inline{flex-wrap: nowrap; white-space: nowrap; gap: 1rem; font-weight: 400;}
.form-block .form .form-con .colum{display: flex; gap: 1rem; align-items: center; white-space:nowrap; color: #5D5D5D; font-size: 1.4rem;}
.form-block .form .form-con .radio{gap: 3rem;}
.form-block .form .form-con .radio p{display: flex; align-items: center; gap: 0.5rem;}
.form-block .form .form-con .select-form{background: url(../../images/icon_arrow_down_g.svg) no-repeat right 1.6rem center; cursor: pointer;}

.form-block .form .form-con .tag-add-list{margin-top: 1.2rem; display: flex; gap: 1rem; flex-wrap: wrap; justify-content: flex-start;}
.form-block .form .form-con .tag-add-list li{display: inline-flex; border-radius:10rem;
border: 1px solid #DFDFDF; height: 4rem; align-items: center; padding: 0 1.5rem; font-size: 1.4rem; gap: 1rem; max-width: fit-content; flex: none;}

.form-block input[type=radio]+label{font-size: 1.4rem; color: #5D5D5D; font-weight: 400;}
.form-block input[type=number]{text-align: center; min-width: 0;}
.form-block input[type=checkbox]{width: 2rem; height: 2rem;}
.form-block input[type=button]{width: 100%;
    height: 4rem; font-size: 1.4rem;
    padding: 1rem 1.6rem;
    box-sizing: border-box;
    border: 1px solid #DFDFDF;
    border-radius: 5px;
    min-width: 9rem; background-color: #fff; text-align: left;}
.form-block textarea{width: 100%; height: 14rem; padding: 16px; border-radius: 5px; border: 1px solid #DFDFDF; color: #666;}
.form-block .dropdown-menu{border: none; width: 100%; z-index: 10; pointer-events: all;}

.select-layer{border-radius: 5px; border: 1px solid #DFDFDF; background: #FFF; box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.06), 0px 1px 4px 0px rgba(0, 0, 0, 0.04), 0px 0px 1px 0px rgba(0, 0, 0, 0.04); width: 100%; padding: 0.6rem; top: 4.6rem; left: 0; font-weight: 500; font-size: 1.4rem; gap: 2rem; display: flex; align-items: flex-start;}
.work-tab {width: 23rem; height: 24rem; overflow-y: auto; flex: none;}
.work-tab button{padding: 1rem; display: flex; justify-content: space-between; width: 100%; align-items: center; font-weight: 400;}
.work-tab button.active{background-color: #F2F4F8;}
.work-content{padding: 1rem; height: 24rem;
    overflow-y: auto;}
.work-content .tab-pane .list{display: flex; flex-wrap: wrap; gap: 1rem; row-gap: 1rem;}
.work-content .tab-pane input[type=checkbox]{display: none;}
.work-content .tab-pane input[type=checkbox]+label{color: #848484; font-size: 1.2rem; border-radius: 6px; border: 1px solid #DFDFDF; background: #FFF; padding: 0.45rem 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.work-content .tab-pane input[type=checkbox]:checked+label{color: #0068FF; border: 1px solid #0068FF;}

@media all and (max-width:767px) {

}

.modal-sm.modal-400{min-width: 40rem;}
.enter-con .modal-body{padding: 3rem 2rem; padding-top: 2rem;}

.adress-list{display: flex; flex-direction: column; gap: 1rem;}
.adress-list .adress{border-radius: 6px; background: #F6F6F6; padding: 2rem; display: flex; justify-content: space-between; align-items: center; gap: 4.5rem;}
.adress-list .adress dl{display: flex; flex-direction: column; gap: 0.4rem;}
.adress-list .adress dt{font-size: 1.6rem; font-weight:500;}
.adress-list .adress dd{font-size: 1.4rem; color: #848484; font-weight: normal;}
.adress-list .adress p{display: inline-flex; background-color: #fff;border-radius: 5px; border: 1px solid #207BFF; flex: none; color: #207BFF; font-size: 1.2rem; padding: 0.9rem 1.2rem; line-height: 100%;}
.modal-btn{display: flex; width: 100%; flex-wrap: nowrap; gap: 1rem;}
.modal-btn.full{flex-direction: column;}
.modal-btn button{display: flex; flex-wrap: nowrap; width: auto; align-items: center; justify-content: center; font-size: 1.6rem; flex-grow: 1; padding: 0;}
.modal-body {padding-left: 2rem; padding-right: 2rem; padding-bottom: 3rem; padding-top: 2rem;}
.modal-body .form-block {gap: 3rem;}
.modal-body .form-block .form{flex-direction: column; gap: 1rem;}
.modal-body .form-block .form h4{font-size: 1.4rem; height: auto;}
/*select.select{border-radius: 4px; border: 1px solid #DFDFDF; width: 100%; color: #999; padding: 0.5rem 1rem; background: #FFF;background: url(../../images/icon_arrow_down_g.svg) no-repeat right 1.6rem center; cursor: pointer;}
select.select:focus{outline: none;}*/
@media all and (max-width:767px) {
    .modal-sm.modal-400{width: auto; flex-grow: 1; min-width: 0;}
}

.tab-line{display: flex; border-bottom: 1px solid #DFDFDF; height: 5rem; position: relative;}
.tab-line > button{display: flex; height: 5rem; font-weight: 500; color: #999; align-items: center;  border-radius: 0; border-bottom:0.2rem solid rgba(0,0,0,0); min-width: 10rem; justify-content: center;}
.tab-line > button.active{border-bottom:0.2rem solid #0068FF; color: #333; font-weight: 700;}
.seach-line{display: flex; gap: 2rem; margin-bottom: 3rem;}
.seach-line select{width: 12rem; flex: none;}
.seach-line .search-text{position: relative; flex-grow: 1;}
.seach-line .search-text button{position:absolute; width: 4rem; height: 100%; right:0; top: 0; display: flex; align-items: center; justify-content: center;}


.list-wrap .list{display: flex; justify-content: space-between; padding: 1.6rem; border-bottom: 1px solid #DFDFDF;}
.list-wrap .list .summery{display: flex; flex-direction: column; gap: 1.4rem; max-width: 30rem;}
.list-wrap .list .summery dt{font-size: 1.6rem; font-weight: 500; line-height: 100%;}
.list-wrap .list .summery dd{}
.list-wrap .list .summery dd ul{display: flex; color: #848484; font-size: 1.4rem; font-weight: 400;}
.list-wrap .list .summery dd ul li{ line-height: 100%;}
.list-wrap .list .summery dd ul li:nth-of-type(2).active{color: #0068FF;}
.list-wrap .list .summery dd ul li:nth-of-type(4).active{color: #FC4F32;}
.list-wrap .list .summery dd ul li:after{content: "/"; display: inline-flex;color: #848484; margin: 0 0.5rem;}
.list-wrap .list .summery dd ul li:last-of-type::after{display: none;}
.list-wrap .list .stats{ display: flex; gap: 6rem; padding-right: 2.5rem;}
.list-wrap .list .stats li{font-size: 1.6rem;font-weight: 500; display: flex; flex-direction: column; align-items: center; gap: 1.2rem; line-height: 100%;}
.list-wrap .list .stats li b{font-size: 1.4rem; font-weight: 400;line-height: 100%;}
.list-wrap .error{display: flex; gap: 0.6rem; align-items: center;}

.error-msg{font-weight: 400; color: #5D5D5D; display: flex; flex-direction: column; gap: 3rem;}
.error-msg .reason{color: #5D5D5D; border-radius: 6px; background: #F6F6F6; padding: 2rem; min-height: 10rem;}
.enter-con .noti{}
.enter-con .noti a{ display: block; padding: 1.2rem 2rem; font-size: 1.6rem; color: #333;border-radius: 6px;background: #F2F4F8;font-weight: 500;}
.enter-con .tab-block-head{display: flex; flex-direction: column; gap: 2rem;}
.btn-st-nor-40{padding: 0.8rem 2rem !important; height: 4rem;}
@media all and (max-width:767px) {
    .tab-line{border-bottom: 1px solid #DFDFDF; height: 5rem;}
    .tab-line > button{min-width: 0rem; padding: 0; flex-grow: 1;}
    .seach-line{display:grid; grid-template-columns: 1fr 1fr; flex-wrap: wrap; gap: 1rem; row-gap: 1rem;}
    .seach-line select{width: 100%;}
    .seach-line .search-text{grid-column: 1 / 3; }
    .list-wrap {gap: 2rem; display: flex; flex-direction: column;}
    .list-wrap .list {padding:1.6rem 0; flex-direction: column; gap: 2rem;}
    .list-wrap .list .summery{gap: 0.6rem; max-width: 100%;}
    .list-wrap .list .stats{gap: 1.3rem; padding-right: 0rem;}
    .list-wrap .list .stats li{font-size: 1.6rem;font-weight: 500; display: flex; flex-direction: column; align-items: center; gap: 1.2rem; line-height: 100%; width: 6rem;}
    .list-wrap .list .stats li b{font-size: 1.4rem; font-weight: 400;line-height: 100%;}
    .paging{display: none;}
}

.table-block {position:relative; width: 100%; position: relative; overflow-x:auto; overflow-y: hidden;}
.table-block::-webkit-scrollbar {
    height: 0.2rem;
  }
  .table-block::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 10px;
  }
  .table-block::-webkit-scrollbar-thumb {
    background-color: #007aff;
    border-radius: 10px;
    border: none;
  }

.table-block table{border-collapse:collapse; border-spacing:0; border:0; font-size: 1.4rem; table-layout: fixed; width: 100%; min-width: auto;}
.table-block table th{text-align: center; background-color: #F2F4F8; height: 5rem;}
.table-block table thead tr th:first-of-type{border-radius: 0.6rem 0 0 0.6rem;}
.table-block table thead tr th:last-of-type{border-radius:0 0.6rem 0.6rem 0;}
.table-block table tbody td{border-bottom: 1px solid #DFDFDF; padding: 1rem 0; text-align: center; font-size: 1.2rem; color: #999;}
.table-block table tbody td b{display: block; color: #5D5D5D; font-size: 1.4rem; font-weight: 400; margin-bottom: 0.4rem;}
.table-block table tbody td .table-info{display: inline-flex; align-items: center; gap: 2rem;color: #5D5D5D; font-size: 1.4rem; font-weight: 400;}
.table-block table tbody td .table-info b{font-size: 1.6rem; font-weight: 500; margin-bottom: 0;}
.table-block table tbody td .table-info .image{display: flex; width: 6rem; height: 6rem; border-radius: 10rem; overflow: hidden;}
.table-block table tbody td .table-info .image img{width: 100%; object-fit: cover;}
.table-block table tbody td select{border: none; background: url(../../images/icon_arrow_down_g.svg) no-repeat right center; padding-right: 2rem; color: #5D5D5D;}
.table-block table tbody td select:focus{border: none; outline: none;}

.tab-line-user{position: relative;}
.tab-line-btn{display: flex; justify-content: flex-end; align-items: center; gap: 1rem; position: absolute; right: 0; top: 0; z-index: 1;}
.tab-line-btn select{width: 10rem;}
.resume-view{display: block;border-radius: 6px;background: #F2F4F8; padding: 2rem; max-height: 43rem; overflow-y: auto; width: 100%;}

.image-user{display: flex; width: 6rem; height: 6rem; border-radius: 10rem; overflow: hidden;}
.image-user img{width: 100%; object-fit: cover;}
.user-profile{border-radius: 6px; border: 1px solid #DFDFDF; padding: 3rem; display: flex; flex-direction: column;  gap: 2rem;}
.user-profile > div{display: flex; gap: 4rem; align-items: center;}
.user-profile > div dt{font-size: 2.2rem; display: flex; align-items: flex-end; gap: 1.4rem; line-height: 100%;}
.user-profile > div dt span{font-size: 1.4rem; color: #5D5D5D; font-weight: 300;;}
.user-profile > div dd{margin-top: 1rem;color: #5D5D5D; font-size: 1.4rem; font-weight: 300;}
.user-profile ul{display: flex;color: #5D5D5D; font-weight: 300; font-size: 1.4rem; padding-left: 10rem; justify-content: space-between;}
.user-profile ul li{line-height: 100%;}
.user-profile ul li b{margin-bottom: 0.4rem; display: block; font-size: 1.2rem; color: #999;}

.modal-body{padding-left: 2rem; padding-right: 2rem; padding-bottom: 3rem; padding-top: 2rem;}
@media all and (max-width:767px) {
    .tab-line-user{}
    .tab-line-btn{position: static; margin-bottom: 2rem;}
    .user-profile ul{padding-left: 0; justify-content: space-between; flex-wrap: wrap; row-gap: 1rem;}
    .user-profile ul li{width: 50%;}
}

.my-people{display: flex; gap: 2rem;}
.my-people dl{flex: 1; border: 1px solid #DFDFDF; border-radius:0.6rem; overflow: hidden;}
.my-people dl dt{background: #F2F4F8; cursor: pointer; height: 7rem; display: flex; justify-content: space-between; align-items: center; padding: 0 2rem; font-size: 1.6rem; font-weight: 500;}
.my-people dl dt .num{margin-left: auto; font-weight: 500; color: #FF4856; font-size: 3rem; font-weight: 700; display: flex; gap: 0.4rem; align-items: flex-end; line-height: 100%;}
.my-people dl dt .num b{font-weight: 400; color: #333; font-size: 1.6rem;}
.my-people dl dt img{display: none; margin-left: 2rem;}
.my-people dl dd{}
.my-people dl dd ul{background-color: #DFDFDF; display: flex; flex-direction: column; gap:1px;}
.my-people dl dd ul li{background-color: #fff;}
.my-people dl dd ul li a{font-size: 1.4rem; color: #5D5D5D; padding: 2rem; font-weight: 400;}
@media all and (max-width:767px) {
    .my-people{flex-direction: column;}
    .my-people dl dt .num b{display: none;}
    .my-people dl dt img{display:block;}
    .my-people dl dd ul{display: none;}
    .my-people dl.active dt img{transform: rotateZ(180deg);}
    .my-people dl.active dd ul{display:flex;}
}

.package-block{display: grid; grid-template-columns:1fr 1fr; gap: 2rem; margin-top: 3rem; flex-wrap: wrap;}
.package-block h3{font-size: 16px; font-style: normal; font-weight: 600; width: 100%; grid-column: 1 / 3;}
.package-block .package{background-color: #fff;border-radius: 6px; padding: 3rem; display: flex; justify-content:space-between;}
.package-block .package:nth-of-type(1){grid-column: 1 / 3; background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #FF4856 0%,  #0040BF 100%); background-origin: border-box; background-clip: content-box, border-box; padding: 1px;}
.package-block .package:nth-of-type(1) .title,.package-block .package:nth-of-type(1) .price{padding: 3rem;}
.package-block .package:nth-of-type(2){border: 1px solid #FFC306; grid-column: 1 / 3;}
.package-block .package:nth-of-type(3){flex:1 0 0; width: auto; flex-direction: column; gap: 2rem;}
.package-block .package:nth-of-type(4){flex:1 0 0; width: auto; flex-direction: column; gap: 2rem;}
.package-block .package:nth-of-type(3) .price,.package-block .package:nth-of-type(4) .price{text-align: left;}
.package-block .package .title{display: flex; flex-direction: column; gap: 1rem;}
.package-block .package .title dt{font-size: 2.2rem; color: #333; font-weight:500;}
.package-block .package .title dt b{font-weight: 600; display: block;}
.package-block .package .title dd{ font-size: 1.4rem; color: #848484; font-weight: 300;}
.package-block .package .price{display: flex; flex-direction: column; gap: 2rem; text-align: right;}
.package-block .package .price dt{font-size: 2.2rem; font-weight: 600;}
.package-block .package .price dd{}

@media all and (max-width:767px) {
    .package-block{display: flex; flex-direction: column;}

    .package-block .package{flex-direction: column; padding: 2rem; gap: 2rem;}
    .package-block .package:nth-of-type(1) .title,.package-block .package:nth-of-type(1) .price{padding: 2rem;}
    .package-block .package:nth-of-type(1) .title{padding-bottom: 0;}
    .package-block .package:nth-of-type(1) .price{padding-top: 0;}
    .package-block .package:nth-of-type(2){}
    .package-block .package:nth-of-type(3){border: 1px solid #DFDFDF;}
    .package-block .package:nth-of-type(4){border: 1px solid #DFDFDF;}
    .package-block .package:nth-of-type(3) .price,.package-block .package:nth-of-type(4) .price{text-align: right;}
    .package-block .package .title{display: flex; flex-direction: column; gap: 1re m;}
    .package-block .package .title dt{font-size: 2.2rem; color: #333; font-weight:500;}
    .package-block .package .title dt b{font-weight: 600; display: block;}
    .package-block .package .title dd{ font-size: 1.4rem; color: #848484; font-weight: 300;}
    .package-block .package .price{gap: 1rem;}

}

.buy-package{font-size: 2.2rem; font-weight: 700; display: flex; align-items: center; gap: 2rem;}
.package-detail{display: flex; gap: 4rem;}
.package-detail > p{display: flex;}
.package-detail > p img{width: 100%; object-fit: cover;}
.pagkage-info{width: 45rem; flex: none; display: flex; flex-direction: column; padding: 2rem 0;}
.pagkage-info .info-summery{margin-bottom: auto;border-radius: 6px;background: #F2F4F8; padding: 2rem; display: flex; flex-direction: column;}
.pagkage-info .info-summery h4{margin-bottom: 0.4rem; font-size: 2.2rem; font-weight: 600;}
.pagkage-info .info-summery p{}
.pagkage-info .info-summery ul{margin-top: 2rem; line-height: normal; font-weight: 400;}
.pagkage-info dl {color: #5D5D5D; display: flex; flex-direction: column; gap: 0.4rem;}
.pagkage-info dl:last-of-type{margin-top: 2rem;}
.pagkage-info dl dt{ margin-bottom: 0.6rem;}
.pagkage-info dl dd{font-weight: 300; display: list-item; padding-inline-start: 0rem; margin-inline-start: 1.5rem; margin-inline-end: 0rem; }
.pagkage-info dl dd::marker{font-size: 1rem; display: inline-flex;}
@media all and (max-width:767px) {
    .title-line.package{flex-direction: column; align-items: flex-start;}
    .buy-package{justify-content: space-between; width: 100%;}
    .package-detail{flex-direction: column; gap: 2rem;}
    .pagkage-info{padding: 0; gap: 2rem; width: 100%;}
}

hr{height: 1px; display: block; background-color: #DFDFDF; margin: 0; border: none; opacity: 1;}
.ad-select{display: flex; flex-direction: column; gap: 3rem;}
.ad-select dl{display: flex; justify-content: space-between; align-items: center;}
.ad-select dl dt{width: 13rem;}
.ad-select dl dd{flex-grow: 1; display: flex; justify-content: space-between; align-items: center;font-size: 1.4rem; font-weight: 400;}
.ad-select dl dd p{display: flex; gap: 1rem; align-items: center; white-space: nowrap; }
.ad-select dl dd select{}
.ad-select dl:last-of-type dd{flex-grow: 0; font-size:2.2rem; font-weight: 700;}
.seleted-package{border-radius: 6px; background: #F6F6F6; height: 5rem; padding: 0 2rem; display: flex; justify-content: space-between; align-items: center; font-size: 2.2rem; font-weight: 500;}
input[type='date'] {position: relative; width: 100%; background: url(../images/calender.svg) no-repeat right 1.5rem center; padding-right: 2.5rem;}
input[type='date']::-webkit-calendar-picker-indicator {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  color: transparent;
  cursor: pointer;
}
/* input[type='date']::before {content: attr(placeholder); width: 100%; height: 100%;} */
input[type="date"]:focus,input[type="date"]:valid {color: #333;}
input[type="date"]:focus::before,input[type="date"]:valid::before {content: "" !important;}

@media all and (max-width:767px) {
    .ad-select dl{flex-direction: column; align-items: flex-start; gap:1.2rem;}
    .ad-select dl dd{flex-direction: column; align-items: flex-start; gap:2rem; width: 100%;}
    .ad-select dl dd p{flex-direction: column; align-items: flex-start; gap:1.2rem; width: 100%;}
    .ad-select dl:last-of-type {flex-direction: row; align-items: center; justify-content: space-between; width: 100%;}
    .ad-select dl:last-of-type dd{width: auto;}
}

.tab-line-content .paging{margin-top: 5rem;}
.search-people{width: 100%; display: flex; flex-direction: column; gap: 1.5rem; padding-top: 5rem;}
.search-people .title-line{display: flex; justify-content: space-between;}
.search-people h2{display: flex; font-size: 1.6rem; font-weight: 700; align-items: center; gap: 1rem;}
.search-people .seach-line{background-color: #fff; padding: 3rem; border-radius: 0.6rem; margin-bottom: 0;}
.people-container{display: flex; padding: 3rem 0 8rem; gap: 3rem; overflow: hidden; align-items: flex-start;}
.people-container .left-people{background-color: #fff; border-radius: 0.6rem; width: 29rem; flex: none; padding: 3rem; display: flex; flex-direction: column; gap: 3rem;}
.people-container .left-people dl.stats{display: flex; flex-direction: column; gap: 1rem;}
.people-container .left-people dl.stats dd{display: flex; align-items: center; gap: 1rem; font-size: 1.4rem; color: #666;}
.people-info{display: flex; flex-direction: column; gap: 3rem;}
.people-info .info{border-radius: 6px; border: 1px solid #DFDFDF; padding: 3rem; display: flex; justify-content: space-between; gap: 3.7rem;}
.people-info .info .image{width: 7rem; height: 7rem; border-radius: 10rem; overflow: hidden; flex: none;}
.people-info .info .image img{width: 100%; object-fit: cover;}
.people-info .info .info-detail{flex: 1; display: flex; flex-direction: column; gap: 2rem;}
.people-info .info .info-detail .name{display: flex; gap: 1.4rem; align-items: center;}
.people-info .info .info-detail .name dt{font-size: 2.2rem; line-height: 100%;}
.people-info .info .info-detail .name dd{font-weight: 300;}
.people-info .info .info-detail ul{display: flex; gap: 1rem;}
.people-info .info .stats-list{ display: flex; flex-wrap: wrap; gap: 7rem; row-gap: 1rem; }
.people-info .info .stats-list dl{ display: flex;  flex-direction: column; gap: 0.4rem;}
.people-info .info .stats-list dt{font-size: 1.2rem; color: #999; font-weight: 400;}
.people-info .info .stats-list dd{font-size: 1.4rem; font-weight: 400; color: #5D5D5D; max-width: 23rem;}

.modal-880{max-width: 88rem!important;}
.product-select{display:grid; grid-template-columns: 1fr 30rem 1fr; align-items: center;}
.product-select .box{border-radius: 6px; padding: 2rem; background: #F2F4F8; display: flex; flex-direction: column; gap: 2rem;}
.product-select .box.default{border: 1px solid #0040BF; background: #ECF8FF;}
.product-select .box.default .product-info{gap: 4rem;}
.product-select .box h2{display: flex; flex-direction: column; align-items: center; gap: 1rem; font-size: 2.2rem; line-height: 100%;}
.product-select .box h2 b{font-weight: 600;}
.product-select .product-info{display: flex; flex-direction: column; gap: 2rem; border-radius: 6px; background: #FFF; padding: 2rem; color: #848484; font-size: 1.4rem; font-weight: 300;}
.product-select .product-info p.benefit{}
.product-select .product-info ul{display: flex; flex-direction: column; gap: 0.6rem;}
.product-select .product-info ul li{display: flex;justify-content: space-between; min-height: 2rem;}
.product-select .product-info ul li.benefit{color: #0068FF;}

@media all and  (max-width:1214px) {
    .people-container{display: flex; flex-direction: column; gap: 3rem; overflow: hidden; margin-top:3rem;}
    .people-container .left-people{display: grid; grid-template-columns: 1fr 1fr; width: 100%;}
}
@media all and (max-width:767px) {
    .people-container .paging{padding-top: 3rem;}
    .search-people{padding-top: 3rem; row-gap: 5rem;}
    .search-people .seach-line{padding: 0rem; margin-bottom: 0;}
    .people-container{display: flex; flex-direction: column; padding: 0; gap:5rem; overflow: hidden; padding-bottom: 5rem;}
    .people-container .left-people{display: grid; grid-template-columns: 1fr; padding: 0; width: 100%;}
    .people-info{gap: 2rem;}
    .people-info .info{padding: 2rem; position: relative;}
    .people-info .info .image{position: absolute;}
    .people-info .info .info-detail .name{ padding-left: 9rem; flex-direction: column; align-items: flex-start; gap: 1rem; height: 7.1rem; justify-content:center;}
    .people-info .info .info-detail .name dd{font-size: 1.4rem;}
    .product-select{grid-template-columns: 1fr; row-gap: 2rem; max-height: 70vh; overflow-y: auto;}
    .product-select .box h2{flex-direction: row; justify-content: space-between; align-items: center;}
    .product-select .box.default{grid-row: 1 / 2;}
    .product-select .box.default .product-info{gap: 2rem;}
}
.caution{ padding-top:3rem; color: #5D5D5D; font-size: 1.4rem; display: flex; flex-direction: column; gap: 1.4rem;}
.caution input[type=checkbox]{width: 2rem; height: 2rem; flex: none;}
.caution li{display: flex; align-items: flex-start; gap: 1.2rem;}
button.btn-wide{width: 18rem; justify-content: center;}
button.btn-full{width: 100%; justify-content: center;}
.edit{display: flex; flex-direction: column; gap: 3rem;}
.edit dl{display: flex; flex-direction: column; gap: 1rem;}
.edit dt{display: flex; gap: 0.2rem;}
.edit dt span{color: #FC4F32;}
.edit dd{}

.form-company{}
.form-company ul.file-up{display: flex; justify-content: space-between; gap: 3rem;}
.form-company ul.file-up li{flex: 1; position: relative; border-radius: 6px;}
.form-company ul.file-up li p.image{display: flex; align-items: center; justify-content: center; gap: 1rem;  height: 20rem; background-size: cover; overflow: hidden; flex: none;}
.form-company ul.file-up li p.image img{width:100%; object-fit:cover; max-width:fit-content;}
.form-company ul.file-up li:first-of-type {border: 1px solid #FF4856;}
.form-company ul.file-up li:last-of-type {border: 1px solid #0040BF;}
.form-company ul.file-up li input[type=file]{position: absolute; left: 0; top: 0; opacity: 0;}
.form-company ul.file-up li input[type=file]+label{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; gap: 1rem;}
.form-company ul.file-up li:first-of-type label{color: #FF4856;}
.form-company ul.file-up li:last-of-type label{color: #0040BF;}
.form-company .form-block .form h4{font-size: 1.6rem;}
.form-colum{display: grid; grid-template-columns: 1fr 1fr; gap: 10rem; row-gap: 3rem;}
.form-block .form .form-con.inline{ flex-wrap: nowrap; white-space: nowrap; gap: 1rem; font-weight: 400; flex-direction: row;}
@media all and (max-width:767px) {
    .form-company ul.file-up{flex-direction: column;}
    .form-colum{display: flex; flex-direction: column; gap: 2rem;}
    .form-block .form .form-con.inline{flex-direction: row; align-items: center;}
}

.table-header{display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem;}
.table-header dt{font-weight: 300; width: 10rem; text-align: center;}
.table-header dt b{ margin-left: 0.5rem;color: #0068FF; font-weight: 600;}
/*.table-header dd{width: 13rem;}*/
.my-service-list tbody tr td{font-size: 1.4rem; padding: 2rem; color: #5D5D5D; font-weight: 400;}

.my-service-list tbody tr td:nth-of-type(1){padding-left: 4rem; text-align: left;}

@media all and (max-width:767px) {
    .my-service-list {border-top: 1px solid #DFDFDF !important;}
    .my-service-list thead{display: none;}
    .my-service-list colgroup{display: none;}
    .my-service-list tbody {}
    .my-service-list tbody tr {display: flex; width: 100%; flex-direction: column; padding: 2rem;border-bottom: 1px solid #DFDFDF}
    .my-service-list tbody tr td{padding: 0 !important; border-bottom: 0; text-align: left;}
    .my-service-list tbody tr td:nth-of-type(1){font-size: 1.6rem; color: #333; font-weight: 600;}
    .my-service-list tbody tr td:nth-of-type(2){width: auto;}
    .my-service-list tbody tr td:nth-of-type(3){width: auto; margin-top: 1.2rem;}
}
@media (max-width: 576px) {
    .user-profile ul li {
        width: 100%;
    }
    }
