@charset "utf-8";
@import "reset.css";

/* 🔥 폰트 확대 방지 (핵심) */
html {
    font-size: 16px !important;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}

body {
    -webkit-text-size-adjust: none !important;
    text-size-adjust: none !important;
}

/* 🔥 전체 강제 차단 (갤럭시 대응) */
* {
    -webkit-text-size-adjust: none !important;
    text-size-adjust: none !important;
}

/*  common
=============================================================================*/
.blind {position:absolute; font-size:0; text-indent:-999999px;}

.wrap {}
.header_box {position:absolute; top:0; left:0; right:0; display:flex; height:3.5rem; z-index:3;}
.header_box .h_util {display:flex; margin-left:auto;}
.header_box .h_util > a {display:block; width:3.5rem; height:3.5rem;}
.header_box .h_util > a.btn_alert {margin-right:3rem; width:3rem; font-size:0; text-indent:-9999px; background:url(../img/comm/btn_alert.png) no-repeat center; background-size:30px;}
.header_box .h_util > a.btn_alert.on {background-image:url(../img/comm/btn_alert_on.png)}
.header_box .h_util > a.btn_menu {margin-left:2px;}
.header_box > a.btn_back {display:block; padding-left:2.2rem; height:3.5rem; line-height:3.5rem; font-size:1.1rem; background:url(../img/comm/btn_back.gif) no-repeat .4rem center; background-size:27px;}

/* 추가된 부분: btn_notice */
.header_box .h_util > a.btn_notice {
  display: block;
  width: 3rem;
  height: 3.5rem;
  font-size: 0;
  text-indent: -9999px;
  background: url(../img/main/img_sign2.png) no-repeat center;
  background-size: 30px;
  margin-right: 0.5rem; /* 필요에 따라 조정 */
}

.header_box .h_util > a.btn_demo {
    display: block;
    width: 3rem;
    height: 3.5rem;
    font-size: 0;
    text-indent: -9999px;
    background: url(../img/main/img_demo.png) no-repeat center;
    background-size: 30px;
    margin-right: 0.2rem;
}

/* bottom nav */
.nav_box {position:fixed; bottom:0; left:0; right:0; display:flex; height:3.8rem; border-radius:10px 10px 0 0; background-color:#fff; box-shadow: 0 0 5px 2px rgba(0, 0, 0, .1); z-index:2;}
.nav_box::after {content:""; position:absolute; top:0; left:50.5%; transform:translate(-50%,-50%); display:block; width:65px; height:65px; border-radius:100px; background-color:#fff; box-shadow: 0 0 5px 2px rgba(0, 0, 0, .1); z-index:-1;}
.nav_box a {display:block; padding:.5rem 0; text-align:center; color:#000; font-size:.8rem; font-weight:500; background-color:#fff;}
.nav_box a.home {width:16%; border-radius: 10px 0 0 0;}
.nav_box a.estimate {width:23%;}
.nav_box a.mobile {padding:2.1rem 0 0; width:23%;}
.nav_box a.service {width:19%;}
.nav_box a.mypage {width:19%; border-radius:0 10px 0 0;}
.nav_box a::before {content:""; display:block; margin:0 auto; width:33px; height:26px; background:url(../img/comm/ico_b_nav.png) no-repeat 0 0; background-size:33px;}
.nav_box a.home::before {background-position:0 0;}
.nav_box a.estimate::before {background-position:0 -26px;}
.nav_box a.service::before {background-position:0 -52px;}
.nav_box a.mypage::before {background-position:0 -78px;}
.nav_box a.mobile {position:relative;}
.nav_box a.mobile::before {content:""; display:block; position:absolute; top:0; left:50%; transform:translate(-50%,-50%); width:56px; height:56px; background:url(../img/comm/ico_mobile24.png) no-repeat center; background-size:56px; z-index:1;}
.nav_box a.mobile::after {content:""; position:absolute; top:-28px; left:50%; transform:translate(-50%,0); display:block; width:56px; height:56px; border-radius:100px;
    background: rgb(230,11,77);
    background: -moz-linear-gradient(0deg, rgba(230,11,77,1) 0%, rgba(242,88,134,1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(230,11,77,1) 0%, rgba(242,88,134,1) 100%);
    background: linear-gradient(0deg, rgba(230,11,77,1) 0%, rgba(242,88,134,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e60b4d",endColorstr="#f25886",GradientType=1);
    z-index:0;
}


/* header menu */
.menu_toggle {display:block; padding:1.1rem .8rem 1rem .5rem; position:absolute; top:0; right:0; width:3rem; height:3.5rem; z-index:2; -webkit-user-select:none; user-select:none;}
.menu_toggle a {text-decoration:none; color:#232323; transition:color 0.3s ease;}
.menu_toggle a:hover {color:tomato;}
.menu_toggle input {display:block; position:absolute; top:0; left:0; width:100%; height:3.5rem; cursor:pointer; opacity:0; z-index:3; -webkit-touch-callout:none;}
.menu_toggle > span {display:block; position: relative; margin-bottom:6px; width:28px; height:2px; border-radius:50px; background-color:#000; z-index:3;
  transform-origin: 4px 0px;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}
.menu_toggle > span:first-child {transform-origin: 0% 0%;}
.menu_toggle > span:nth-last-child(2) {transform-origin:0% 100%;}
.menu_toggle input:checked {position:fixed;}
.menu_toggle input:checked ~ span {opacity:1; margin-left:0; width:30px; transform:rotate(45deg) translate(-2px, -1px); background-color:#fff;}
.menu_toggle input:checked ~ span:nth-last-child(3) {opacity:0; transform:rotate(0deg) scale(0.2, 0.2);}
.menu_toggle input:checked ~ span:nth-last-child(2) {transform: rotate(-45deg) translate(0, -1px);}
.ul_menu {position:fixed; right:-40rem; top:0; bottom:0; width:0; padding:4rem 1rem 1rem; overflow-y:auto; background-color:#ededed; transition:ease .6s; z-index:2;}
.menu_toggle input:checked ~ .ul_menu {right:0; width:100%;}
.menu_toggle a.cblue {color:#0066c2;}
.container {padding:3.5rem 0 4rem;}
.menu_toggle:has(input[type="checkbox"]:checked) {position:fixed;}

/* 체크박스 버튼 */
.chk_box { display:inline-block; position:relative; color:#000; font-weight:600; -webkit-user-select:none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor:pointer;}
.chk_box input[type="checkbox"] { display: none; }
.chk_box .on {position:relative; display:inline-block; margin:-2px 3px 0 0; width:25px; height:25px; border-radius:50px; background-color:#fff; vertical-align:middle; border:1px solid #bdbdbd;}
.chk_box input[type="checkbox"]:checked + .on { background-color:#e71151; border:1px solid #e71151;}
.chk_box .on:after { content: ""; position: absolute; }
.chk_box .on:after {position:absolute; left:8px; top:3px; width:5px; height:11px; border:solid #fff; border-width:0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/* 라디오 버튼 */
.radio_box { display:inline-block; position:relative; padding-left:28px; margin-right:20px; color:#000; cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.radio_box input[type="radio"] { display: none; }
.radio_box .on {position:absolute; top:0; left:0; width:25px; height:25px; background-color:#ddd; border-radius:50%;}
.radio_box input[type="radio"]:checked + .on { background-color: #44465c; }
.radio_box .on:after { content: ""; position: absolute; display: none; }
.radio_box input[type="radio"]:checked + .on:after { display: block; }
.radio_box .on:after { width:11px; height:11px; background: #fff; border-radius: 50%; position: absolute; left:7px; top:7px; }

.cred {color:#ff0000; font-style:normal;}
.cblack {color:#000;}
.cpurple {color:#852a91;}
.cblue {color:#0066c2;}
.bnavy {color:#fff; background-color:#303c49;}
.blightgray {color:#000; background-color:#e9ecf5;}

/* pup */
.pup_wrap {position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, .4); z-index:9;}
.pup_wrap .pup_object {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding:1rem; width:21rem; border-radius:10px; background-color:#fff;}
.pup_wrap .pup_object .ico_exclamation_mark {display:block; margin:1rem auto 0; width:50px; height:50px; background:url(../img/comm/ico_exclamationmark.gif) no-repeat 0 0; background-size:50px;}
.pup_wrap .pup_object .pup_body {padding:1rem 0;}
.pup_wrap .pup_object .pup_body .alcenter {text-align:center;}
.pup_wrap .pup_object .btn_bottom {display:flex; margin-top:1rem; text-align:center;}
.pup_wrap .pup_object .btn_bottom a {display:block; margin:0 1.5%; padding:.65rem 0; width:50%; font-size:.9rem; border-radius:7px;}
.pup_wrap .pup_object .btn_bottom.flexno {display:block;}
.pup_wrap .pup_object .btn_bottom.flexno a {margin:0; width:100%;}
.pup_wrap .pup_object.red {color:#fff; background-color:#e71151;}
.pup_wrap .pup_object.blue {color:#fff; background-color:#3094db;}
.pup_wrap .pup_object.red .btn_bottom.flexno a,
.pup_wrap .pup_object.blue .btn_bottom.flexno a {color:#fff; background-color:#34363d;}
.pup_wrap .pup_object.red .ico_exclamation_mark,
.pup_wrap .pup_object.blue .ico_exclamation_mark{background-image:url(../img/comm/ico_exclamationmark2.png);}

.pup_wrap .pup_object .btn_bottom.flexok {display: flex;justify-content: center;gap: 5px;}
.pup_wrap .pup_object .btn_bottom.flexok a {flex: 0 0 auto;}
.pup_wrap .pup_object.blue .btn_bottom.flexok a {color:#fff; background-color:#34363d;}

body:has(.menu_toggle input:checked ~ .ul_menu) {overflow: hidden;}

#popupFrameContainer {background:#fff url(../img/comm/img_iframe_loding.gif) no-repeat center !important; background-size:25% !important;}
#popupCloseBtn {position:absolute; left:0; right:0; bottom:0; padding:1rem; background:#fff; box-shadow:0 0 5px 2px rgba(0, 0, 0, .1);}
#popupCloseBtn button {position:relative !important; top:auto !important; right:auto !important; padding:.8rem 0 !important; border-radius:10px !important;  text-align:center; font-size:.95rem !important; background:#303c49 !important;}
#popupIframe {padding-bottom:4.5rem;}
