.vote-main-img {background: url(/images/vote/vote_main_img.png) no-repeat; height: 100vh; background-size: cover; background-position: center center;}
.vote-title {display: flex; flex-direction: column;  align-items: center; height: 100%; padding-top: clamp(140px, 16vh, 230px);; gap:24px;}
.vote-title .title p:first-child {font-size: 60px; font-weight: 300; line-height: 135%; letter-spacing: -2%; color:#fff;  }
.vote-title .title p:last-child {font-size: 78px; font-weight: 700; line-height: 135%; letter-spacing: -2%; color:#fff;  }
.vote-title .sub {font-size: 20px; font-weight: 400; line-height: 150%; letter-spacing: -2%; color:#fff;}

.vote-wrap {margin: 0 auto; max-width: 1240px; width: 100%;}
.vote-wrap .vote-con {padding-top:120px; }
.vote-wrap .vote-con-title {display: flex; flex-direction: column; gap:16px;}
.vote-wrap .vote-con-title .main {font-weight:700; font-size: 44px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;}
.vote-wrap .vote-con-title .sub {font-weight:400; font-size: 20px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F;}

.vote-con-wrap {display: flex; flex-direction: column; gap:40px;}

.vote-img-ul {display: flex; gap:20px; }
.vote-img-ul .vote-img-li {background: #F0F7FF; border-radius: 16px; padding: 48px; width: 33.33%; display: flex; flex-direction: column; align-items: center;}
.vote-img-ul .vote-img-li .vote-text {display: flex; flex-direction: column; gap:16px; align-items: center; }
.vote-img-ul .vote-img-li .vote-text .title {font-weight: 700; font-size: 32px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;} 
.vote-img-ul .vote-img-li .vote-text .sub-text {font-size: 18px; line-height: 150%; color:#393B3D; letter-spacing: -2%; text-align: center;}

.vote-section-2 {}

.vote-step-ul {display: flex; gap:8px; }
.vote-step-ul .vote-step-li {position: relative; width: 20%; display: flex; flex-direction: column; gap:32px; align-items: center; background: #F5F7FA; border-radius:16px; border:1px solid #E1E4E5; padding: 0 20px 32px 20px;}
.vote-step-ul .vote-step-li::after {content: ""; position: absolute; right: -40px; top: 50%; width: 70px; height: 70px;  border: 1px solid #E1E4E5; border-radius: 50%;  background:url("/images/vote/vote_img_icon.png")  center / cover no-repeat;  transform: translateY(-50%); z-index: 10; box-sizing: border-box;}
.vote-step-ul .vote-step-li::before { content: "";  position: absolute;  right: -40px;  top: 50%;  width: 70px;  height: 70px;  background:    linear-gradient(#fff, #fff) top center / 8px 4px no-repeat, linear-gradient(#fff, #fff) bottom center / 8px 4px no-repeat;  transform: translateY(-50%);  z-index: 11;  pointer-events: none;}
.vote-step-ul .vote-step-li:last-child::after {display: none;}
.vote-step-ul .vote-step-li:last-child::before {display: none;}
.vote-step-ul .vote-step-li.w-25 {width:25%;}
.vote-step-ul .vote-step-li .step {padding: 6px 28px; border-radius: 0 0 999px 999px; background: #fff; border:1px solid #E1E4E5; border-top:1px solid #fff; margin-top: -1px;}
.vote-step-ul .vote-step-li .step p {color:#2A79D1; font-size: 14px; line-height: 150%; letter-spacing: -2%; font-weight: 500;}
.vote-step-ul .vote-step-li .vote-img-text {display: flex; flex-direction: column; gap:24px;}
.vote-step-ul .vote-step-li .vote-img-text img {margin: 0 auto;}
.vote-step-li .vote-img-text .vote-step-text {display: flex; flex-direction: column; gap:16px; align-items: center; text-align: center;}
.vote-step-li .vote-img-text .vote-step-text p:first-child {font-size: 24px; font-weight: 700; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;}
.vote-step-li .vote-img-text .vote-step-text p:last-child {font-size: 18px; font-weight: 400; line-height: 150%; letter-spacing: -2%; color:#393B3D;}

.vote-content-wrap { display: flex; max-height: 590px;}
.vote-con-ul {width:100%; max-width: 435px; padding: 48px; display: flex; flex-direction: column; gap:40px; border:1px solid #e1e4e5; background: #fff; border-radius: 16px;;}
.vote-con-ul .vote-con-li {opacity: .6; display: flex; flex-direction: column; gap:16px; cursor: pointer;}
.vote-con-ul .vote-con-li .con-li-title {display: flex; align-items: center; gap: 6px;}
.vote-con-ul .vote-con-li .con-li-title img {display: none;}
.vote-con-ul .vote-con-li .con-li-title p {color:#1D1E1F; font-size:32px; line-height: 135%; letter-spacing: -2%; font-weight: 700;}
.vote-con-ul .vote-con-li .con-li-text {display: flex; gap:8px}
.vote-con-ul .vote-con-li .con-li-text p {border: 1px solid #D5D7D9; border-radius: 999px; padding: 4px 12px; background: #fff; line-height: 150%;} 
.vote-con-ul .vote-con-li.active {opacity: 1;}
.vote-con-ul .vote-con-li.active .con-li-title img {display: block;}
.vote-con-ul .vote-con-li.active .con-li-text p {border: 2px solid transparent;  background: linear-gradient(#fff, #fff) padding-box,  linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%) border-box; border-radius: 999px; padding: 4px 12px; background-color: #fff;} 

.vote-banner-ul {flex:1 1 0; padding: 48px; border-radius: 16px;;   border: 2px solid transparent;  background: linear-gradient(#fff, #fff) padding-box,  linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%) border-box;}
.vote-banner-ul .vote-banner-li {display: flex; flex-direction: column; gap:32px;}
.vote-banner-ul .vote-banner-li p {font-size: 32px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; text-align: center;}
.vote-banner-ul .vote-banner-li p strong {background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%);    -webkit-background-clip: text;    background-clip: text;    -webkit-text-fill-color: transparent;    color: transparent;}
.vote-section-3 {background: #F0F7FF;}


.vote-section-4 {background: url(/images/section_img_4.png) no-repeat 100%; background-size: cover;}
.vote-apply-title {display: flex; flex-direction: column; gap:16px; align-items: center;}
.vote-apply-title p:first-child {font-size: 44px; font-weight: 700; line-height: 135%; letter-spacing: -2%; color:#F5F7FA;}
.vote-apply-title p:last-child {font-size: 20px; font-weight: 400; line-height: 150%; letter-spacing: -2%; color:#F5F7FA;}
.apply-btn-wrap {display: flex; gap:12px; align-items: center; justify-content: center;}
.apply-btn-style {cursor: pointer; background: #fff;; display: inline-flex; padding:14px 14px 14px 28px; gap:24px; align-items: center; border-radius: 999px; justify-content: center; font-weight: 500; line-height: 135%; letter-spacing: -.4px; color:#1D1E1F; font-size: 20px;}
.apply-btn-style .more_arrow {background: linear-gradient(84.04deg, #1364BD 12.55%, #3FBBF0 91.66%); border-radius: 999px; padding:8px;}
.apply-btn-style .more_arrow img { transition: transform 0.25s ease;}
.apply-inquiry-btn {cursor: pointer; display: flex; align-items: center; justify-content: center; width: 211px; height: 64px; padding: 0 24px; color:#fff; border-radius: 999px;; border:1px solid #fff; font-size:20px; font-weight: 500; line-height: 135%; letter-spacing: -2%;}

.popup-wrap {position: fixed; top:0; left:0;right: 0; bottom: 0; z-index: 100; display: none; height: 100%; align-items: center; justify-content: center;}
.popup-wrap-f {position: fixed; top:0; left:0;right: 0; bottom: 0; z-index: 100; display: none; height: 100%; align-items: center; justify-content: center;}
.popup-bg {background: #00000066; width: 100%; height: 100%;; position: fixed; top:0; left:0; right:0;bottom: 0;}
.popup-bg-f {background: #00000066; width: 100%; height: 100%;; position: fixed; top:0; left:0; right:0;bottom: 0;}
.popup-bg2 {background: #00000066; width: 100%; height: 100%;; position: fixed; top:0; left:0; right:0;bottom: 0;}
.popup-bg2-f {background: #00000066; width: 100%; height: 100%;; position: fixed; top:0; left:0; right:0;bottom: 0;}
.qa-popup-wrap {display: flex; align-items: center; justify-content: center; height: 100%;}
.qa-popup-wrap-f {display: flex; align-items: center; justify-content: center; height: 100%;}
.qa-popup {width: 100%; max-width: 900px; margin: 0 auto; padding: 32px; border-radius: 16px;; box-shadow: 1px 1px 40px 0px #0000001A; background: #fff;;  position: relative;} 
.qa-popup-title {display: flex; flex-direction: column; gap:12px; padding-bottom: 28px; border-bottom: 1px solid #E1E4E5;}
.qa-popup-title .title {font-size:32px; line-height: 135%; font-weight: 700; letter-spacing: -2%;}
.qa-popup-title .sub-title p {font-size:18px; line-height: 150%; letter-spacing: -2%; color:#393B3D;}
.qa-popup-title .sub-title span {display: block ; font-size:16px; line-height: 150%; letter-spacing: -2%; color:#1364BD;}
.qa-popup-con {padding: 28px 0 40px 0; display: flex; flex-direction: column; gap:24px}
.qa-popup-con .input-wrap {display: flex; gap:20px;}
.qa-popup-con .input-wrap .input-con.textarea {padding: 0 ;}
.input-wrap .input-con {display: flex; flex-direction: column; gap:8px; width: 50%;;}
.input-wrap .input-con p {font-size: 14px; line-height: 135%; font-weight: 700; letter-spacing: -2%; color: #1D1E1F}
.input-wrap .input-con .qa-input {padding: 12px 16px; border-radius: 8px; border:1px solid #D5D7D9; width: 100%; font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#393B3D;}
.input-wrap .input-con .qa-input::placeholder {color:#7E8285}

.input-wrap .input-con.textarea {width: 100%;}
.input-wrap .input-con.textarea textarea {width: 100%; border: 1px solid #D5D7D9; padding: 12px 16px; border-radius: 8px; resize: none; height: 105px; font-size: 18px; line-height: 150%; letter-spacing: -2%;}
.input-wrap .input-con.textarea .max-text {text-align: right; font-weight: 400; color:#6E7275 ; font-size: 16px; line-height: 135%; letter-spacing: -2%; }
.input-wrap .input-con.textarea .max-text strong {font-weight: 700; color:#393B3D;}
.input-wrap .input-con-wrap {display: flex; gap:8px; align-items: center;}
.input-wrap .input-con-wrap .select select { -webkit-appearance:none; /* for chrome */ -moz-appearance:none; /*for firefox*/ appearance:none;}
.input-wrap .input-con-wrap .select select::-ms-expand{display:none;/*for IE10,11*/}
.input-wrap .input-con-wrap .select select { background:url('/images/select-icon.png') no-repeat 95% 50% / 20px auto; flex:1 1 0;}
.input-wrap .input-con-wrap .tel-select select {width: 120px; border:1px solid #D5D7D9; border-radius: 8px; padding: 12px 16px;;}
.input-wrap .input-con-wrap .mail-select select {width: 180px; border:1px solid #D5D7D9; border-radius: 8px; padding: 12px 16px;;}
.input-wrap .input-con-wrap .spam-text {border: 1px solid  #D5D7D9; border-radius: 8px; background: #F0F7FF;padding: 12px 16px; font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F;}
.input-wrap .input-con-wrap .spam-text > p{font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F; font-weight: 400}

.qa-popup-btn {margin: 0 auto; text-align: center; display: flex; gap:12px; align-items: center; justify-content: center;}
.qa-popup-btn .popup-btn {border-radius: 999px; background: #BEC1C3; width: 160px; height: 52px; text-align: center; color:#6E7275}
.qa-popup-btn .popup-btn.active {color:#FFFFFF; background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%);}
.cancel-btn {cursor: pointer; width: 160px; height: 52px; display: flex ; align-items: center; justify-content: center; border: 1px solid #A5A8AB; border-radius: 999px;}
.popup-apply-btn {cursor: pointer; color:#FFFFFF; background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); border-radius: 999px;; width: 160px; height: 52px; text-align: center; display: flex; align-items: center; justify-content: center;}

.qa-popup-clear {display: flex; align-items: center; justify-content: center;  height: 100%;; position: relative; }
.qa-popup-clear .clear-wrap{ display: flex; flex-direction: column; gap:40px; width: 100%; max-width: 600px; margin: 0 auto;box-shadow: 1px 1px 40px 0px #0000001A; padding: 32px;  border-radius: 16px ; background: #fff;}

.qa-popup-clear .clear-title p{font-size:32px; line-height: 135%; letter-spacing: -2% ; color:#1d1e1f; font-weight: 700; text-align: center;}
.qa-popup-clear .clear-img {display: flex; flex-direction: column; gap:20px; align-items: center; justify-content: center;}
.qa-popup-clear .clear-img p {text-align: center; font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F;;}
.qa-popup-clear .clear-btn  {text-align: center; margin: 0 auto;}
.qa-popup-clear .clear-btn a {display: flex; align-items: center; justify-content: center; line-height: 135%;; color:#FFFFFF; background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); border-radius: 999px; width: 160px; height: 52px; text-align: center;font-size: 18px; letter-spacing: -2%;} 

.qa-popup-open {max-width: 900px;}
.clear-popup-open {max-width: 600px;;}
.qa-popup-open , .clear-popup-open {display: none; position: relative; width: 100%;}
.qa-popup-open.active {display: block}
.clear-popup-open.active {display: block}

.qa-popup-open-f {max-width: 900px;}
.clear-popup-open-f {max-width: 600px;;}
.qa-popup-open-f , .clear-popup-open-f {display: none; position: relative; width: 100%;}
.qa-popup-open-f.active {display: block}
.clear-popup-open-f.active {display: block}

.vote-apply-popup-wrap {position: fixed; top:0; left:0;right: 0; bottom: 0; z-index: 100;  height: 100%; align-items: center; justify-content: center; display: none;}
.vote-apply-popup-open {display: flex; align-items: center; justify-content: center; height: 100%;}
.apply-wrap {width: 100%; max-width: 600px; margin: 0 auto; padding: 32px; border-radius: 16px; box-shadow: 1px 1px 40px 0px #0000001A; background: #fff; position: relative;}
.apply-wrap .apply-title { padding-bottom: 28px; border-bottom: 1px solid #E1E4E5 ; display: flex; flex-direction: column; gap:12px;}
.apply-wrap .apply-title p:first-child {font-weight: 700;font-size:32px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;}
.apply-wrap .apply-title p {font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#393B3D;}
.apply-wrap .apply-con-btn {padding-top: 40px; display: flex; gap:12px; align-items: center; justify-content: center;}
.apply-con-wrap {padding-top:28px; display: flex; flex-direction: column; gap:28px;}
.apply-con-wrap .apply-ul {display: flex; flex-direction: column; gap:16px;}
.apply-con-wrap .apply-ul .apply-li {display: flex;  gap:12px;}
.apply-con-wrap .apply-ul .apply-li p {font-size: 18px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; font-weight: 400;}
.apply-con-wrap .apply-ul .apply-li p:first-child {font-weight: 700; width:120px;}
.apply-con-wrap .apply-con-box {border-radius: 16px; padding:12px; background: #F0F7FF; text-align: center;}
.apply-con-wrap .apply-con-box div.img {display: flex; gap:4px; align-items: center; justify-content: center;} 
.apply-con-wrap .apply-con-box p {font-size:16px; color:#0C68CC; line-height: 150%; letter-spacing: -2%; }

.apply-popup-open { position: relative; width: 100%; max-width: 600px;}
.apply-popup-open .qa-popup-apply {display: flex; align-items: center; justify-content: center; height: 100%;}
.apply-btn .more_arrow { transition: transform 0.25s ease;}

.vote-apply-popup-wrap-f {position: fixed; top:0; left:0;right: 0; bottom: 0; z-index: 100;  height: 100%; align-items: center; justify-content: center; display: none;}
.vote-apply-popup-open-f {display: flex; align-items: center; justify-content: center; height: 100%;}
.apply-wrap-f {width: 100%; max-width: 600px; margin: 0 auto; padding: 32px; border-radius: 16px; box-shadow: 1px 1px 40px 0px #0000001A; background: #fff; position: relative;}
.apply-wrap-f .apply-title { padding-bottom: 28px; border-bottom: 1px solid #E1E4E5 ; display: flex; flex-direction: column; gap:12px;}
.apply-wrap-f .apply-title p:first-child {font-weight: 700;font-size:32px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;}
.apply-wrap-f .apply-title p {font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#393B3D;}
.apply-wrap-f .apply-con-btn {padding-top: 40px; display: flex; gap:12px; align-items: center; justify-content: center;}
.apply-con-wrap-f {padding-top:28px; display: flex; flex-direction: column; gap:28px;}
.apply-con-wrap-f .apply-ul {display: flex; flex-direction: column; gap:16px;}
.apply-con-wrap-f .apply-ul .apply-li {display: flex;  gap:12px;}
.apply-con-wrap-f .apply-ul .apply-li p {font-size: 18px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; font-weight: 400;}
.apply-con-wrap-f .apply-ul .apply-li p:first-child {font-weight: 700; width:120px;}
.apply-con-wrap-f .apply-con-box {border-radius: 16px; padding:12px; background: #F0F7FF; text-align: center;}
.apply-con-wrap-f .apply-con-box div.img {display: flex; gap:4px; align-items: center; justify-content: center;} 
.apply-con-wrap-f .apply-con-box p {font-size:16px; color:#0C68CC; line-height: 150%; letter-spacing: -2%; }

.apply-popup-open-f { position: relative; width: 100%; max-width: 600px;}
.apply-popup-open-f .qa-popup-apply-f {display: flex; align-items: center; justify-content: center; height: 100%;}
.apply-btn .more_arrow { transition: transform 0.25s ease;}


@media (hover: hover) { 
  .apply-btn:hover .more_arrow img { transform: rotate(45deg);}
}


/* 전자투표 이용 신청*/

.vote-sign-page {padding: 120px 0;; background:url(/images/vote/vote_bg_img.png) no-repeat; background-size: cover;}
.vote-sign-wrap {max-width: 1080px; width: 100%; margin: 0 auto;}
.vote-sign-wrap .con-wrap {padding:48px; border-radius: 16px; box-shadow: 1px 1px 40px 0px #0000001A; background: #fff;;}
.vote-sign-wrap .title-wrap {display: flex; flex-direction: column; gap:16px;}
.vote-sign-wrap .title-wrap .title {font-weight: 700; font-size: 60px; line-height: 135%; letter-spacing: -2% ; color:#1D1E1F;}
.vote-sign-wrap .title-wrap .sub-title {font-size: 20px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F;}
.sign-chk-num {padding-top:60px; display: flex; flex-direction: column; gap:24px;}
.sign-chk-num .sign-num-ul {display: flex; gap:8px; align-items: center; justify-content: center;}
.sign-chk-num .sign-num-ul .num-li {display: flex; gap:4px; align-items: center;}
.sign-chk-num .sign-num-ul .num-li .num {width:24px; height: 24px; border-radius: 999px; display: flex; align-items: center; justify-content: center; background:#D5D7D9 ; color:#929598; font-size: 14px; font-weight: 700; line-height: 135%; letter-spacing: -2%;}
.sign-chk-num .sign-num-ul .num-li .text {font-size: 16px; line-height: 135%; letter-spacing: -2%; color:#6E7275;}
.sign-chk-num .sign-num-ul .num-li.on .num {width:24px; height: 24px; border-radius: 999px; color:#fff;; display: flex; align-items: center; justify-content: center; background:#2A79D1 ;font-size: 14px; font-weight: 700; line-height: 135%; letter-spacing: -2%;}
.sign-chk-num .sign-num-ul .num-li.on .text {font-size: 16px; line-height: 135%; letter-spacing: -2%; color:#2A79D1;}
.sign-chk-num .sign-num-ul .num-li.active .text {font-size: 16px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; font-weight: 700;}
.sign-chk-num .sign-num-ul .num-li.on.active .num {background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); color:#fff; font-weight: 700;}

.dashed-line {width: 80px; height: 2px; opacity: 1; background: repeating-linear-gradient(to right,#D5D7D9 0 2px, transparent 2px 8px);}
.dashed-line.on {background: linear-gradient(84.04deg, #1364BD 12.55%,#2DA8DE 91.66%);
                -webkit-mask: repeating-linear-gradient(to right, #000 0 2px,transparent 2px 8px);
                mask: repeating-linear-gradient(to right, #000 0 2px,transparent 2px 8px);
} 

.sign-style-wrap {background: #F5F7FA; border:1px solid #E6E8EB; border-radius: 12px; padding: 48px;;}
.sign-chk-wrap .chk-title {padding-bottom: 40px;} 
.sign-chk-wrap .chk-title p {font-weight: 700; font-size: 32px;; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;} 

.all-chk-wrap {border-bottom: 1px solid #E1E4E5; padding-bottom: 20px; margin-bottom: 20px;}
.chk_all {display: inline-block;}
.chk-wrap input[type="checkbox"] + label { display: flex; align-items: center; gap:8px; color:#393B3D; font-size:18px; line-height: 135%; font-weight: 400;} 
.chk-wrap input[type="checkbox"] + label:hover {color:#1364BD}
.chk-wrap input[type="checkbox"] + label span {width:24px; height:24px; display:block; background:#fff; border:1px solid #D5D7D9; border-radius:4px}
.chk-wrap input[type="checkbox"]:checked + label {color:#000}
.chk-wrap input[type="checkbox"]:checked + label span {background:url('/images/vote/chk_on.png') no-repeat 50% 50% #2A79D1; border-color:#2A79D1; border-radius:4px}
.chkbox-input {position:absolute;top:0;left:0;width:0;height:0;opacity:0;outline:0;z-index:-1;overflow:hidden; display: none;}

.chk-wrap-style {display: flex; justify-content: space-between; align-items: center; padding-bottom: 16px;; border-bottom:1px solid #E1E4E5}
.textarea-wrap {height: 280px; background: #fff; padding: 32px 32px 48px; overflow-y: scroll;}
.textarea-ul {padding-bottom: 24px;;}
.textarea-ul:last-child {padding-bottom: 0;}
.textarea-ul strong { font-weight: 700; font-size: 16px;; line-height: 135%; letter-spacing: -2%; color:#393B3D; padding-bottom: 16px;;display: block;}
.textarea-ul .textarea-li p { font-size: 16px; line-height: 150%; letter-spacing: -2%; color:#393B3D; padding-left:16px; position: relative;}
.textarea-ul .textarea-li p:first-child::before {content: ""; width:4px; height: 4px; border-radius: 999px; background: #393B3D;  position: absolute; top:10px; left:0;}
.sign-btn {display: flex; justify-content: flex-end; padding-top: 40px;;}
.sign-btn button {width: 160px; height: 52px;  display: flex; align-items: center; justify-content: center; background: #BEC1C3; border-radius: 999px; cursor: pointer;}
.sign-btn button.on {background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); color:#fff;}

.info-wrap > div {display: flex ;flex-direction: column; gap:40px;}
.info-wrap .info-title {display: flex; flex-direction: column; gap:12px; }
.info-wrap .info-title .title {font-size: 32px ; font-weight: 700; line-height: 135%; letter-spacing: -2%; color:#1D1E1F;}
.info-wrap .info-title .sub-title {color:#1364BD; font-size:16px; line-height: 150%; letter-spacing: -2%;;}

.info-ul  {display: flex; gap:48px; flex-direction: column;}
.info-ul .info-li .title {border-bottom: 1px solid #E1E4E5;}
.info-ul .info-li .title p {font-weight: 700; font-size: 18px; line-height: 135%; letter-spacing: -2%; padding-bottom: 20px;}
.info-li .prev-next-btn {display: flex; align-items: center; justify-content: space-between;}
.info-li .prev-next-btn a {width:160px; height: 52px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 18px; line-height: 135%; letter-spacing: -2%;;} 
.info-li .prev-next-btn button {width:160px; height: 52px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 18px; line-height: 135%; letter-spacing: -2%;;} 

.info-li .prev-next-btn a.prev {border:1px solid #A5A8AB; background: #fff; color:#1D1E1F;}
.info-li .prev-next-btn button.next {background: #BEC1C3; color:#6E7275;}
.info-li .prev-next-btn button.next.active {background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); color:#fff;}

.info-input {display: flex; gap:20px; padding-top: 20px;;}
.info-input .input-con {display: flex; flex-direction: column; gap:8px;}
.info-input .input-con p {font-size: 14px ; line-height: 135%; font-size: 14px; color:#1d1e1f; letter-spacing: -2%; font-weight: 700;}
.info-input .input-con input[type='text'] {width: 100%; padding:12px 16px; border:1px solid #D5D7D9; background: #fff; border-radius: 8px; font-size: 18px; line-height: 150%; letter-spacing: -2%;}
.info-input .input-con input[type='password'] {width: 100%; padding:12px 16px; border:1px solid #D5D7D9; background: #fff; border-radius: 8px; font-size: 18px; line-height: 150%; letter-spacing: -2%;}

.info-input .input-con .input-con-text {display: flex; gap:8px; align-items: center;}
.info-input .input-con .input-con-text p {font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#393B3D; font-weight: 400;}
.info-input .input-con .sub-text p {font-weight: 400; font-size: 16px; line-height: 135%; letter-spacing: -2%; color:#6E7275;}
.info-input .post-con {width: 100%; display: flex; flex-direction: column; gap:8px;}
.info-input .post-con p {font-size: 14px ; line-height: 135%; font-size: 14px; color:#1d1e1f; letter-spacing: -2%; font-weight: 700;}
.info-input .post-wrap {display: flex; flex-direction: column; gap:8px;}
.info-input .post-wrap .post-btn {display: flex; gap:8px}
.info-input .post-wrap .post-btn input {width: 290px;;}
.info-input .post-wrap .post-btn input::placeholder {color:#1D1E1F;}
.info-input .post-wrap .post-btn button {background: #1364BD; padding: 12px 16px; border-radius: 8px ; color:#fff; font-size:18px; line-height: 150%; letter-spacing: -2%; }
.info-input .post-wrap {width: 100%; display: flex; flex-direction: column; gap:8px;}
.info-input .post-wrap p {font-size: 14px ; line-height: 135%; font-size: 14px; color:#1d1e1f; letter-spacing: -2%; font-weight: 700;}
.info-input .post-wrap input {width: 100%; padding:12px 16px; border:1px solid #D5D7D9; background: #fff; border-radius: 8px; font-size: 18px; line-height: 150%; letter-spacing: -2%; }
.info-input .post-wrap .post-input {display: flex; flex-direction: column; gap:8px;}
.info-input .post-wrap .post-btn #VoteZip::placeholder {color:#1D1E1F}
.info-input .post-wrap .post-btn #userZip::placeholder {color:#1D1E1F}
.info-input .post-wrap .post-input #userAddr1::placeholder {color:#1D1E1F}
.info-input .post-wrap .post-input #VoteAddr1::placeholder {color:#1D1E1F}

.date-icon {background: url(/images/vote/date-icon.png) no-repeat; position: absolute; top:16px; right: 16px; width: 20px; height: 20px;;;} 
.radio-wrap {display: flex; gap: 24px; align-items: center;}
.radio-wrap label {display: flex; align-items: center; gap: 6px; cursor: pointer;}
.radio-wrap input[type="radio"] {cursor: pointer;}
.custom-radio {display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 16px; color: #222;}
.custom-radio input[type="radio"] {display: none;}
.custom-radio span {position: relative; padding-left: 32px; font-size: 18px; line-height: 135%; letter-spacing: -2%; color:#393B3D;}
.custom-radio span::before {content: ""; position: absolute; left: 0; top: 50%; width: 24px; height: 24px; border: 1px solid #D5D7D9; border-radius: 50%; background: #fff; transform: translateY(-50%); box-sizing: border-box;}
.custom-radio span::after {content: ""; position: absolute; left: 8px; top: 50%; width: 8px; height: 8px; border-radius: 50%; background: #fff; transform: translateY(-50%) scale(0); transition: transform 0.15s;}
.custom-radio input[type="radio"]:checked + span::before {border-color: #1364BD; background: #1364BD;}
.custom-radio input[type="radio"]:checked + span::after {transform: translateY(-50%) scale(1);}

.input-con .vote-select.select select { -webkit-appearance:none; /* for chrome */ -moz-appearance:none; /*for firefox*/ appearance:none;}
.input-con .vote-select.select select::-ms-expand{display:none;/*for IE10,11*/}
.input-con .vote-select.select select { background:url('/images/select-icon.png') no-repeat 95% 50% / 20px auto #fff; flex:1 1 0;}
.input-con .vote-select select {width: 120px; height: 53px; border:1px solid #D5D7D9; border-radius: 8px; padding: 12px 16px;;}


.register-ul  {display: flex; gap:48px; flex-direction: column;}
.register-ul .register-li {}
.register-ul .register-li .title {border-bottom: 1px solid #E1E4E5; display: flex; gap:16px; }
.register-ul .register-li .title p {font-weight: 700; font-size: 18px; line-height: 135%; letter-spacing: -2%; padding-bottom: 20px;}
.register-ul .register-li .prev-next-btn {display: flex; align-items: center; justify-content: space-between;}
.register-ul .register-li .prev-next-btn a {width:160px; height: 52px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 18px; line-height: 135%; letter-spacing: -2%;;} 
.register-ul .register-li .prev-next-btn button {width:160px; height: 52px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 18px; line-height: 135%; letter-spacing: -2%;;} 
.register-ul .register-li .prev-next-btn a.prev {border:1px solid #A5A8AB; background: #fff; color:#1D1E1F;}
.register-ul .register-li .prev-next-btn button.next {background: #BEC1C3; color:#6E7275;}
.register-ul .register-li .prev-next-btn button.next.active {background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%); color:#fff;}

.register-ul .chk-wrap input[type="checkbox"] + label { display: flex; align-items: center; gap:8px; color:#393B3D; font-size:16px; line-height: 135%; font-weight: 400;} 
.register-ul .chk-wrap input[type="checkbox"] + label:hover {color:#1364BD}
.register-ul .chk-wrap input[type="checkbox"] + label span {width:20px; height:20px; display:block; background:#fff; border:1px solid #D5D7D9; border-radius:4px}
.register-ul .chk-wrap input[type="checkbox"]:checked + label {color:#000}
.register-ul .chk-wrap input[type="checkbox"]:checked + label span {background:url('/images/vote/chk_on.png') no-repeat 50% 50% #2A79D1; border-color:#2A79D1; border-radius:4px}

.exit-wrap {background: #F5F7FA; border:1px solid #E6E8EB; border-radius: 12px; padding: 48px;;}
.exit-wrap .exit-con-wrap {display: flex; flex-direction: column; gap:40px; align-items: center;}
.exit-wrap .exit-wrap .title { font-size: 32px; font-weight: 700; line-height: 135%; letter-spacing: -2%; color:#1d1e1f}
.exit-banner-text {display: flex; flex-direction: column; gap:20px; align-items: center;}
.exit-banner-text p {text-align: center; font-size: 18px; line-height: 150%; letter-spacing: -2%; color:#1d1e1f}
.exit-btn {padding-top: 40px; display: flex; gap:12px; align-items: center; justify-content: center;}
.exit-btn a {font-size:18px; line-height: 135%; letter-spacing: -2%;  border-radius: 999px; width:160px; height: 52px; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.exit-btn a.list {border:1px solid #A5A8AB; }
.exit-btn a.home {color:#fff;background: linear-gradient(84.04deg, #1364BD 12.55%, #2DA8DE 91.66%);}

.grecaptcha-badge {left: 14px !important; right: auto !important; bottom: 80px !important;}



/*가입신청*/

.sign-wrap {max-width: 1240px; width: 100%; margin: 0 auto;}
.sign-wrap .con-wrap {padding:118px 0 120px 0;}
.sign-wrap .title-wrap {display: flex; flex-direction: column; gap:16px; align-items: center;}
.sign-wrap .title-wrap .title {font-weight: 700; font-size: 60px; line-height: 135%; letter-spacing: -2% ; color:#1D1E1F;}
.sign-wrap .title-wrap .sub-title {font-size: 20px; line-height: 150%; letter-spacing: -2%; color:#1D1E1F;}

.login-id-wrap span {font-size: 16px; letter-spacing: -2%; line-height: 135%; color:#6E7275;}
.id-btn {display: flex; gap:8px}
.id-btn input {width: 290px;;}
.id-btn button {background: #1364BD; padding: 12px 16px; border-radius: 8px ; color:#fff; font-size:18px; line-height: 150%; letter-spacing: -2%; }
.productlist-wrap {display: flex; gap:24px;}
.productlist-wrap input[type="checkbox"] + label { display: flex; align-items: center; gap:8px; color:#393B3D; font-size:18px; line-height: 135%; font-weight: 400;} 
.productlist-wrap input[type="checkbox"] + label span {width:24px; height:24px; display:block; background:#fff; border:1px solid #D5D7D9; border-radius:4px}
.productlist-wrap input[type="checkbox"]:checked + label {color:#000}
.productlist-wrap input[type="checkbox"]:checked + label span {background:url('/images/vote/chk_on.png') no-repeat 50% 50% #2A79D1; border-color:#2A79D1; border-radius:4px}



.vote-scroll-item {display: flex; justify-content: center;}
.vote-scroll-image {max-width: 320px;;}
.vote-scroll-title {font-weight: 700; font-size: 78px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; margin-top: 130px;}
.vote-scroll-text {font-weight: 250; font-size: 78px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; margin-top: 270px; }

/* 애니메이션 실행 전 */
.vote-scroll-item .vote-scroll-image,
.vote-scroll-item .vote-scroll-title,
.vote-scroll-item .vote-scroll-text {
  opacity: 0;
  transform: translateY(50px);
  transition:
    opacity 0.8s ease,
    transform 0.8s ease;
}

/* 영역이 화면에 들어왔을 때 */
.vote-scroll-item.is-active .vote-scroll-image,
.vote-scroll-item.is-active .vote-scroll-title,
.vote-scroll-item.is-active .vote-scroll-text {
  opacity: 1;
  transform: translateY(0);
}

/* 이미지 먼저 */
.vote-scroll-item.is-active .vote-scroll-image {
  transition-delay: 0s;
}

/* 제목 두 번째 */
.vote-scroll-item.is-active .vote-scroll-title {
  transition-delay: 0.3s;
}

/* 설명 텍스트 마지막 */
.vote-scroll-item.is-active .vote-scroll-text {
  transition-delay: 0.6s;
}



@media (max-width: 1280px){

    .popup-wrap {padding: 0 16px;}
    .qa-popup {max-width: 712px;}

    .vote-sign-page {padding:120px 16px;}
    .vote-sign-wrap .con-wrap {padding: 40px;;}
    .sign-wrap {max-width:712px ;}
    .sign-wrap .con-wrap {padding: 118px 16px 120px ;}
    .sign-style-wrap {padding: 40px;;}

    .vote-wrap {max-width: 760px;}
    .vote-wrap .vote-con {padding:80px 16px 0;}
    .vote-img-ul {flex-direction: column;}
    .vote-img-ul .vote-img-li {width: 100%; padding: 24px;;}

    .m-scroll-wrap {width: 100%; overflow: hidden;}
    .m-scroll {width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;  scrollbar-width: none; -ms-overflow-style: none;}
    .m-scroll img {content: url('/images/vote/m_vote_img4.png'); display: block; min-width: 1748px; height: 318px;}

    .vote-section-2 {margin-top:80px ;}

    .vote-step-ul {display: flex; overflow-x: auto; overflow-y: hidden;  gap: 16px;   -webkit-overflow-scrolling: touch;  scroll-snap-type: x proximity;}
    .vote-step-ul::-webkit-scrollbar {display: none;}
    .vote-step-ul .vote-step-li {flex: 0 0 280px;  min-width: 280px; scroll-snap-align: start; gap:28px; padding: 0 16px 28px;}

    .vote-section-2 .vote-wrap {padding: 0  0 80px;}

    .vote-content-wrap {flex-direction: column; max-height: none;}

    .vote-banner-ul {padding: 40px;;}
    .vote-banner-ul .vote-banner-li#tab01 div img {content: url(/images/vote/t_voto_banner_img1.png);}
    .vote-banner-ul .vote-banner-li#tab02 div img {content: url(/images/vote/t_voto_banner_img2.png);}
    .vote-banner-ul .vote-banner-li#tab03 div img {content: url(/images/vote/t_voto_banner_img3.png);}
    .vote-banner-ul .vote-banner-li#tab04 div img {content: url(/images/vote/t_voto_banner_img4.png);}

    .vote-con-ul {width: 100%;
    max-width: 100%;
    display: flex;
    padding: 40px;
    gap: 16px;
    box-sizing: border-box;
    flex-direction: row;

    overflow-x: auto;

    scroll-padding-left: 40px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;}
    .vote-con-ul::-webkit-scrollbar { display: none;}
    .vote-con-ul .vote-con-li {flex: 0 0 300px; min-width: 0; scroll-snap-align: start; gap:12px;}

    .apply-btn-wrap {padding-bottom: 80px;}
    .dashed-line {width: 28px;;}

    .vote-scroll-image {max-width: 240px;;}
    .vote-scroll-title {font-weight: 700; font-size: 54px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; margin-top: 130px;}
    .vote-scroll-text {font-weight: 250; font-size: 54px; line-height: 135%; letter-spacing: -2%; color:#1D1E1F; margin-top: 270px; }


      .info-input {flex-direction: column;}
    .info-input .post-wrap input {padding: 10px 12px;; font-size: 16px;}

    .info-input .input-con.w-1\/2 {width: 100%;}
    .info-input .post-wrap .post-btn button {font-size: 16px; padding: 12px 10px;;}
    .info-input .post-wrap .post-btn input {flex:1 1 0;}
    .info-input .post-con.\!w-1\/2 {width: 100% !important;}
    .info-input .input-con {gap:6px;}
    .info-input .input-con input[type='text'] {padding:10px 12px; font-size: 16px;;}
    .info-input .input-con input[type='password'] {padding:10px 12px; font-size: 16px;;}
    .info-input .input-con .sub-text p {font-size: 14px;;}
    .info-input .input-con .vote-day {flex-direction: column; }
    .productlist-wrap {width: 100%;}
    .checkboxList {width: 100%;}
    .checkboxList .chk_style {width: auto;}

    .popup-wrap {padding:0 16px;}
    .popup-wrap-f {padding:0 16px;}

    .qa-popup-con {padding:20px 0;}
    .qa-popup-con .input-wrap {flex-direction: column;}
    .qa-popup-title {padding-bottom: 20px;;}
    .qa-popup-title .title {font-size: 24px;}
    .qa-popup-title .sub-title p {font-size: 16px;}
    .qa-popup-title .sub-title span {font-size: 14px;;}

    .input-wrap .input-con {width: 100%;;}
    .input-wrap .input-con p {font-size: 12px;;}

      

 }


@media (max-width: 767px){ 
  .vote-main-img{background: url(/images/vote/m_vote_banner_img.png) no-repeat; background-size: cover; background-position: center bottom; height: 100vh; display: block; padding: 110px 16px 0;}
  .vote-title {padding: 0; gap:20px;}
  .vote-title .title p:first-child {font-size: 32px;}
  .vote-title .title p:last-child {font-size: 40px;;}
  .vote-title .sub {font-size: 18px;;}

  .vote-wrap .vote-con-title .main {font-size:24px; }
  .vote-wrap .vote-con-title .sub {font-size: 18px;;}

  .vote-con-wrap {gap:24px;}


  .vote-img-ul .vote-img-li .vote-text {gap:12px;}
  .vote-img-ul .vote-img-li .vote-text .title {font-size: 20px;}
  .vote-img-ul .vote-img-li .vote-text .sub-text {font-size: 16px;;}

  .vote-step-ul .vote-step-li .vote-img-text {gap:20px;}
  .vote-step-li .vote-img-text .vote-step-text {gap:8px;}
  .vote-step-li .vote-img-text .vote-step-text p:first-child {font-size: 20px;}
  .vote-step-li .vote-img-text .vote-step-text p:last-child {font-size: 16px;;}

  .vote-con-ul {padding: 24px;;}
  .vote-con-ul .vote-con-li {flex:0 0 250px}
  .vote-con-ul .vote-con-li .con-li-title p {font-size: 20px;;}
  .vote-con-ul .vote-con-li .con-li-text {gap:6px;}
  .vote-con-ul .vote-con-li .con-li-text p {font-size: 14px;;}
  .vote-banner-ul {margin-bottom: 80px; padding:24px;}
  .vote-banner-ul .vote-banner-li {gap:20px;}
  .vote-banner-ul .vote-banner-li p {font-size: 20px;;}
  
    .vote-banner-ul .vote-banner-li#tab01 div img {content: url(/images/vote/m_voto_banner_img1.png);}
    .vote-banner-ul .vote-banner-li#tab02 div img {content: url(/images/vote/m_voto_banner_img2.png);}
    .vote-banner-ul .vote-banner-li#tab03 div img {content: url(/images/vote/m_voto_banner_img3.png);}
    .vote-banner-ul .vote-banner-li#tab04 div img {content: url(/images/vote/m_voto_banner_img4.png);}

  .vote-apply-title p:first-child {font-size:24px;}
  .vote-apply-title p:last-child {font-size: 18px; text-align: center;}
  .apply-btn {font-size: 16px; gap:12px; padding: 12px;;}
  .apply-inquiry-btn {font-size: 16px;; height: 48px; width: 155px;;}
  .apply-btn .more_arrow {max-width: 24px;;}


  /* 문의 하기 */

  .popup-wrap {padding:0 ;}
  .popup-wrap-f {padding:0 ;}

  .qa-popup {padding:40px 16px 32px; height: 100vh; border-radius: 0;}

  .apply-wrap {padding:40px 16px 60px; height: 100vh; border-radius: 0;;}
  .apply-wrap .apply-title p {font-size: 16px;;}
  .apply-wrap .apply-title p:first-child {font-size: 24px;}

  .apply-con-wrap .apply-ul .apply-li p {font-size: 16px;;}
  .apply-con-wrap .apply-con-box p {font-size: 14px;;}





  /* 전자투표 */

  .vote-sign-wrap .title-wrap .title {font-size: 24px;}
  .vote-sign-wrap .title-wrap .sub-title {font-size: 18px;;}
  .vote-sign-wrap .con-wrap {padding:40px 16px 60px;}
  

  .info-ul {gap:32px;}
  .info-li .prev-next-btn a {width: 120px; height: 42px;; font-size: 16px;;}
  .info-li .prev-next-btn button {width: 120px; height: 42px; font-size: 16px;;}



  .info-wrap .info-title .title {font-size: 20px;;}
  .info-wrap .info-title .sub-title {font-size: 14px;;}
  .input-con .vote-select select {padding: 10px 12px;;}


  .radio-wrap {flex-direction: column; align-items: flex-start; gap:20px;}

  .register-ul {gap:32px;}
  .register-ul .register-li .title p {padding-bottom: 0;}
  .register-ul .register-li .title {flex-direction: column; padding-bottom: 16px;;}

  .exit-banner-text p {font-size: 16px;}
  .exit-btn a {font-size: 16px;;}

  /* 가입 */
  .id-btn {flex-direction: column;}
  .id-btn button {padding: 10px 12px; font-size: 16px;;}
  .login-id-wrap span {font-size: 14px;;}
  .sign-wrap .con-wrap {padding:118px 16px 60px;}
  .sign-wrap .title-wrap { align-items: flex-start;}
  .sign-wrap .title-wrap .title {font-size: 24px;}
  .sign-wrap .title-wrap .sub-title {font-size: 18px;}
  .sign-chk-num {padding-top: 32px; gap:16px;}
  .sign-chk-wrap .chk-title {padding-bottom: 32px;;}
  .sign-chk-wrap .chk-title p {font-size: 20px;;}
  .all-chk-wrap {padding-bottom: 16px; margin-bottom: 16px;;}
  .sign-chk-num .sign-num-ul .num-li .num {width: 20px; height: 20px;; font-size: 12px;;}
  .sign-chk-num .sign-num-ul .num-li.on .num {width: 20px; height: 20px;; font-size: 12px;;}
  .sign-chk-num .sign-num-ul .num-li .text {display: none;}
  .sign-chk-num .sign-num-ul .num-li.active .text {display: block; font-size: 14px;;}

  .sign-style-wrap {padding:24px 20px;}
  
  .chk-wrap.flex.items-center.gap-2 {flex-direction: column ; align-items: flex-start;}
  .chk-wrap input[type="checkbox"] + label {font-size: 15px;;}
  .productlist-wrap input[type="checkbox"] + label {font-size: 16px;;}
  .textarea-wrap {padding: 20px 20px 30px;;}

  .vote-scroll-item { flex-direction: column; align-items: center;}
  .vote-scroll-title {order:2; margin-top: 16px; font-size: 40px; text-align: center;}
  .vote-scroll-image {order:1;}
  .vote-scroll-text {order:3; margin-top: 0; font-size: 40px; text-align: center;}

  
}