@charset "utf-8";
.popup{width:100dvw; height:100dvh; background:rgba(0, 0, 0, 0.6); position: fixed; z-index:999; left:0; top:0; display:flex; align-items: center; justify-content: center;}
.popLink{line-height: 0;}
.popContent{width:30dvw; overflow:hidden}
.popContent img{width:100%}
.popupImg{border-radius: 20px 20px 0 0}
.popBtn{width:-webkit-avable; display:flex; align-items: center; justify-content: space-between; box-sizing: border-box; padding:12px 20px ; background:#fefefe;}
.popBtn p{cursor: pointer;}
.btn_1{width:fit-content}
/*************** mainBanner ***************/
.mainBtn{width:fit-content}


.vsBox{  border: 3px solid  #006AFF;}
.vsBox1{top:calc(50% - 40px); left:calc(50% - 40px); z-index: 10;  background: linear-gradient(300deg, #4ca8da, #006AFF);}

/*************** service ***************/
.serviceCnt{overflow:hidden}

.footLink{border-bottom: 1px solid #394353;}






/*************** online ***************/
.onlineBtn{background:#005290; cursor: pointer;}
.policyBox{border-top:2px solid #3994d9; }
.policyCheck{cursor: pointer;}
.policyCheck:before,.policyCheck:after{content:''; display:block; position:absolute; top:50%;}
.policyCheck:before{left:0; width:20px; height:20px; border:1px solid #eee; background:#fefefe; transform: translateY(-50%); border-radius:20px}
.policyCheck:after{left:7px; width:6px; height:12px; border:2px solid #fefefe;  transform: translateY(-55%) rotate(45deg); border-width:0 2px 2px 0; opacity:0}
#policy:checked + label:before{background:#3994d9; border:1px solid #3994d9}
#policy:checked + label:after{opacity: 1}
#policy{left:-9999px}

.modalClose{cursor: pointer;}
.modalClose:before, .modalClose:after{content:''; display:block; position: absolute; top:50%; left:50%; width:2px; height:40px; background:#fefefe;}
.modalClose:before{transform:translate(-50%, -50%) rotate(45deg)}
.modalClose:after{transform:translate(-50%, -50%) rotate(-45deg)}

.policyModal{left:0; top:0; background:rgba(0, 0, 0, 0.6)}
.policyModalCnt input[type="checkbox"]{left:-9999px}
#policyAll + label{background:#eee;  transition: ease-in 0.2s;}
#policyAll + label:before, #policyAll + label:after{ content:''; display:block; position:absolute; top:50%; }
#policyAll + label:before{left:20px; width:20px; height:20px; border-radius:20px; background:#fefefe; transform:translateY(-50%)}
#policyAll:checked + label{background:#0066FF; color:#fefefe}
#policyAll + label:after{left:26px; width:6px; height:10px; border:2px solid #0066FF;  transform: translateY(-55%) rotate(45deg); border-width:0 2px 2px 0; opacity:0}
#policyAll:checked + label:after{opacity: 1;}

.policyCheckBox input[type="checkbox"] + label:before, .policyCheckBox input[type="checkbox"] + label:after{content:''; display:block; position:absolute; top:45%;}
.policyCheckBox input[type="checkbox"] + label:before{left:20px; width:20px; height:20px; border-radius:20px; border:1px solid #d5d5d5; background:#fefefe; transform:translateY(-50%); transition: ease-in 0.2s;}
.policyCheckBox input[type="checkbox"]:checked + label:before{background:#0066FF; border:1px solid #0066FF}
.policyCheckBox input[type="checkbox"] + label:after{left:26px; width:6px; height:10px; border:2px solid #fefefe;  transform: translateY(-55%) rotate(45deg); border-width:0 2px 2px 0; opacity:0}
.policyCheckBox input[type="checkbox"]:checked + label:after{opacity: 1;}

.policySuccess{background:#eee; cursor: pointer;}
.policySuccess.active{background-color: #0066FF;}

.success{background:#222}



/*************** 로그인 ***************/
.loginBox, .loginBtn{background:#005290}
.loginForm{background:#fefefe}
.loginFieldset input{border: 1px solid #eee}
.loginFieldset button{border:0; cursor: pointer; }

.snsLoginIcon{background:#eee}

.socialLoginBox input, #chk_all{left:-99999px}
.socialLoginBox input + label{box-sizing: border-box; cursor: pointer;}
.socialLoginBox input + label:before, .socialLoginBox input + label:after{content:''; display:block; position: absolute;}
.socialLoginBox input + label:before{right:20px; width:20px; height:20px; background:#fefefe; border:1px solid #999; border-radius: 4px;}
.socialLoginBox input + label:after{right:28px; top:48%; transform: translateY(-50%) rotate(45deg); width:4px; height:10px; }
.socialLoginBox input:checked + label:after{ border:2px solid #999; border-width:0 2px 2px 0}
.socialLoginBox textarea{min-width:100%; max-width: 100%; box-sizing: border-box; border:0; min-height:200px}
.socialLoginBox table td, .socialLoginBox table th{border:1px solid #d5d5d5}

.chk_allLabel input + label{background:#0068C9; cursor: pointer;}
.chk_allLabel input + label:before, .chk_allLabel input + label:after{content:''; display:block; position: absolute;}
.chk_allLabel input + label:before{width:20px; height:20px; background:#fefefe; border-radius:2px; right:20px}
.chk_allLabel input + label:after{right:28px; top:48%; transform: translateY(-50%) rotate(45deg); width:4px; height:10px; }
.chk_allLabel input:checked + label:after{ border:2px solid #0068C9; border-width:0 2px 2px 0}
#register_form input{border:1px solid #999}
.btn_confirm a, .btn_confirm button{border:0; cursor: pointer;}
.btn_confirm a{background:#eee;}
.btn_confirm button{background:#0066FF}

/*************** 상담신청 ***************/
.board_list{overflow-x:scroll}
.board_list table{min-width:500px}
.board_list table tbody tr{border-bottom: 1px solid #aaa;}
.pg_wrap{display:flex; justify-content: center; width:100%}
.pg_wrap .pg{display:flex; justify-content: center;}
.pg_wrap .pg strong, .pg_wrap .pg a{width:30px; height:30px; border-radius:4px; background:#eee; transition: ease-in 0.2s; display:flex; align-items: center; justify-content: center; margin:0 10px}
.pg_wrap .pg strong{background:#005290; color:#fefefe}
.viewBox{border-top:1px solid #222}
.viewBox td{border:1px solid #222}
.viewBox tr td:nth-child(1){border-bottom:1px solid #fefefe}
.viewBox tr:nth-last-child(1) td:nth-child(1){border-bottom:1px solid #222}




.botQan-popup {    position: fixed;    bottom: 20px;    right: 20px;    z-index: 9999;}

/* 팝업 버튼 */
.botQan-toggle {    background: #FAD700;    border: none;    border-radius: 20px;    width: 80px;    height: 80px;    display: flex;    align-items: center;    justify-content: center;    cursor: pointer;    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);    transition: background-color 0.3s ease;}

/* 버튼 아이콘 이미지 기본 상태 */
.botQan-toggle .botQan-icon img {    width: 60%;}

/* 팝업 컨텐츠 */
.botQan-content {    display: none; /* 기본적으로 숨김 */    position: absolute;    bottom: 85px; /* 버튼 위에 위치 */    right: 0;    width: 450px;    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);    border-radius: 20px;    opacity: 0; /* 초기 상태는 투명 */    transition: opacity 0.3s ease, transform 0.3s ease; /* 부드럽게 애니메이션 */}

/* 팝업 내부 */
.botQan-inner {    width: 100%;    height: 600px;    overflow-y: auto;}

/* 클릭 시 버튼 이미지 및 배경색 변경 */
.botQan-toggle.active {    background-color: #e9e9e9;}

.botQan-toggle.active .botQan-icon img {    content: url("/img/close.png"); /* 클릭 시 닫기 이미지로 변경 */    width:40%;}
.botQan-toggle.active .botQan-icon .botQnaTxt{display:none;}


/** kakao **/
.kakaoTalk{background:#9abbd3; height:100%; overflow-y:auto; overflow-x:hidden; border-radius: 20px;padding-bottom:12px;}
.kakaoTop{border-bottom:1px solid #91b0c7;left:0; top:0;  background: #9abbd3; position:sticky}
.reply{background:#fefefe; width:fit-content; border:0;}
.botQnaBox{background:#fefefe; margin-bottom:12px;}
.answer{background:#f8e731; width:fit-content}
.botQnaBoxGo{background:#f8e731;}
.sendTelForm input[type="text"], .sendTelForm input[type="number"], .sendTelForm textarea,
.sendTelForm input:focus, .sendTelForm textarea:focus{ border:1px solid #eee;}
.sendTelForm textarea{min-height:100px; resize: vertical; width: calc(100% - 24px);}

input[type="number"] {
    -moz-appearance: textfield; /* Firefox */
    -webkit-appearance: none; /* Chrome, Safari */
    appearance: none; /* 표준화 */
}

/* Chrome, Safari에서 스핀 버튼 제거 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


.hasesoltaxbco_7{background:#425996;}
.hasesoltax input[type="radio"] + label{ background:#fff; cursor: pointer; color:#425996}
.hasesoltax input[type="radio"]:checked + label, .filedset input[type="radio"] + label:hover{background:#425996;opacity: 1; color:#fefefe}
.hasesoltax #policy:checked + label:before{background:#425996; border:1px solid #425996}
.hasesoltax #policy:checked + label:after{opacity: 1}
.hasesoltax .policyCheckBox-custom:checked + label:before{background:#425996; border:1px solid #425996}
.hasesoltax .policyCheckBox input[type="checkbox"]:checked + label:before{background:#425996; border:1px solid #425996}
.hasesoltax #policyAll:checked + label{background:#425996; color:#fefefe}
.hasesoltax #policyAll + label:after{left:27px; width:6px; height:10px; border:2px solid #425996;  transform: translateY(-55%) rotate(45deg); border-width:0 2px 2px 0; opacity:0}
.hasesoltax .policySuccess.active{background-color: #425996; color:#fff;}
.hasesoltax #policyAll:checked + label:after{   opacity: 1;}
.hasesoltax .policyCheckBox input[type="checkbox"]:checked + label:after{ opacity: 1;}
.hasesoltax .inputBox{background-color:rgb(255, 255, 255, 0.2) !important;}
.bco_7{background:#425996;}

    /* 체크박스 숨기기 */
    .checkpolicy input[type="checkbox"] {      display: none;    }
    /* 체크박스 스타일 */
    .custom-checkbox {      width: 20px;      height: 20px;    padding:0;   border-radius: 4px;      background-color: #fff;      margin-right: 10px;     transition: background-color 0.3s, border 0.3s;      position: relative;    }

    /* 체크박스 선택 상태 스타일 */
   .checkpolicy input[type="checkbox"]:checked + .custom-checkbox {      background-color: #005290;      border-color: #005290;    }

   .checkpolicy input[type="checkbox"]:checked + .custom-checkbox::after {      content: '';      position: absolute;      top: 2px;      left: 5px;      width: 5px;      height: 8px;      border: solid white;      border-width: 0 3px 3px 0;      transform: rotate(45deg);    }

    /* 체크박스 hover 효과 */
    .custom-checkbox:hover {      border-color: #005290;    }
    .moreBtn{border-bottom:1px solid #E9E9EC; color:#E9E9EC;}