@charset "UTF-8";
.look-terms-wrap{
    margin-bottom:18vh;
}
.white-bg{
    background-color: #fff;
    position: fixed;
    left: 0;
    bottom: 0;
    height: 100px;
    width: 100%;
    z-index: 1000;
}
.modal-center.terms-slide{
    width: 100%;
    height: 80vh;
    border-radius: 30px 30px 0 0;
    top:100%;
    transform: translateX(-50%) translateY(calc( -37% - constant(safe-area-inset-bottom)));
    transform: translateX(-50%) translateY(calc( -37% - env(safe-area-inset-bottom)));
}

.page-header-wrapper.terms-header{
    background-color: #fff;
    /*border:1px solid #000;*/
    border-bottom:1px solid #2b9a69;
    border-radius: 30px 30px 0 0;
    position: relative;
}
.page-header-wrapper.terms-header .terms-back-btn{
    position: absolute;
    top:50%;
    left: 10px;
    transform: translate(0 ,-50%);
    border: none;
    background-color: #fff;
    color:dimgray;
    font-size: 17px;
}
.page-header-wrapper.terms-header h5{
    font-size: 2.5rem;
    text-align: center;
}

.container {
    vertical-align: middle;
    background-color: #fff;
    height: 100%;
    line-height: 2rem;
}
.page-header-wrapper{
    padding: 20px 0;
    background-color:rgb(8,32,67);
}
.page-header-wrapper h1{
    color: #ffffff;
    font-family: 'EliceDigitalBaeum' ,sans-serif;
    font-size: 2.5rem;
    font-weight: 700;
}

.page-header{
    font-weight: bold;
    width:fit-content;
    margin:0 auto;
}

.terms-list{
    width: 89%;
    min-width: 50%;
    margin: 0 auto;
    position: relative;
}
.terms-list .all-terms{
    width: 90%;
    display: flex;
    align-items: center;
    margin-top: 10px;
    padding: 10px;
    border: 2px solid var(--main-color);
    border-radius: 5px;
}
.all-terms label{
    width: 90%;
}
.all-terms p{
    font-size: 2.3rem;
    font-weight: 700;
}
.all-terms p>span{
    font-size: 1.8rem;
    font-weight: 400;
    color:#707070;
}
.each-term .terms-left{
    display: flex;
}
.terms-list .terms-contents {
    margin-bottom: 60px;
}

.terms-list .terms-contents .terms-name {
    margin-top: 10px;
    letter-spacing: 1px;
    height: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.7rem;

}
.terms-name span.terms-neceagree{

    font-weight: 700;
}

.terms-name span.click-term-name{
    /*width: 210px;*/

}
.terms-list .terms-contents .terms-name .span {
    font-weight: bold;
    font-size: 20px;
}
.terms-name span.arrow-btn{
    font-size: 1.5rem;
    color: #9a9a9a;
}

.terms-list .terms-contents .terms-label {
    display: flex;
    align-items: center;
    justify-content: center;
}


.terms-slide input[type=checkbox]+label{
    position: relative;
    display: inline-block;
    width: 10px;
    height: 10px;
    border: none;
    cursor: pointer;
    margin-right: 10px;
}
.terms-slide input[type=checkbox]+label::after{
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-top: 2px solid #707070;
    border-right: 2px solid #707070;
    display: inline-block;
    transform: rotate(135deg) skew(-15deg,-15deg);
    top: -2px;
    left:0;
}
.all-terms input[type=checkbox]+label{
    width: 15px;
    height: 15px;
}
.all-terms input[type=checkbox]+label::after{
    width: 15px;
    height: 15px;
    top:-8px;
}
.terms-slide input[type=checkbox]:checked+label::after{
    border-top: 2px solid var(--main-color);
    border-right: 2px solid var(--main-color);
}
.terms-slide input.terms-checkbox[type=checkbox]{
    display: none;
}
input.all-check[type=checkbox]{
    display: none;
}
.terms-list .terms-contents .terms-checkbox {
    width: 15px;
    height: 15px;
}
.terms-list .terms-contents span.terms-agree {

}
.terms-list .terms-contents .terms-ctnt {
    padding: 10px;
    height: 170px;
    overflow-y: auto;
    font-size: 1.5rem;
    border: 1px solid #000;
}
.terms-list .terms-contents .terms-ctnt.hide-term {
    display: none;
}
.terms-list .terms-form-group .terms-btn-group button.btn-save{
    background-color:#b3c2ff;
    color: #ffffff;
}
.footer-join-group.terms-footer{
    padding-bottom: 0;
}
/*재동의*/
.terms-reAgree-list div {
    margin: 20px 0px;
}
.terms-reAgree-list div span{
    font: 700 1.7rem font-family;
    vertical-align: bottom;
}
.look-terms-ctnt.agree .agree-button{
    background-color: #888888;
}
.look-terms-ctnt.agree .agree-button.is-agree{
    background-color: var(--main-color);
    transition: all 0.5s;
}
.terms-reAgree-list input {
    -webkit-appearance:checkbox;
    accent-color: var(--main-color);
}

/*
아이폰8
*/
@media all and (max-height:668px) {
    /*.modal-center.terms-slide{*/
    /*    transform: translate(-50%,-38%);*/
    /*}*/
    .terms-list .terms-contents .terms-ctnt {
        height: 170px;
    }
}
/*
아이폰 12, 13 mini , 12,13 까지
*/
@media all and (min-height:668px) and (max-height:850px ){
    /*.modal-center.terms-slide{*/
    /*    transform: translate(-50%,-40%);*/
    /*    */
    /*}*/
    .terms-list .terms-contents .terms-ctnt {
        height: 220px;
    }
}
/*
아이폰 12max, 13max
 */
@media all and (min-height:851px) {
    /*.modal-center.terms-slide{*/
    /*    transform: translate(-50%,-40%);*/
    /*}*/
    .terms-list .terms-contents .terms-ctnt {
        height: 320px;
    }
}
