:root{
    --main-color: #0084ee;
}

.touch-none {overflow: hidden; width: 100%; height: 100%; touch-action: none;}
#wrap { width: 100%; box-sizing: border-box;  position: relative;}
.container { width: 100%; padding: 0 1.8rem; box-sizing: border-box;}


/* header */
header {display:flex; align-items: center; height: 7rem;}
header img { width: 16rem;}



/* main_visual*/
#main_visual { margin-top: 0.6rem; padding: 0 1.9rem;}
#main_visual .container { display: flex; align-items: center; justify-content: space-between; background-color: var(--main-color); padding: 3rem 2rem; border-radius: 1rem; letter-spacing: -1px;}
#main_visual .vistext_wrap h5 { font-size: 1.6rem; line-height: 1.2; margin-bottom: 0.6rem; letter-spacing: -0.01rem; color: #fff;}
#main_visual .vistext_wrap h2 { font-size: 2.4rem; font-weight: 700; line-height: 1.1; color: #fff;}
#main_visual .vistext_wrap p { font-size: 1.6rem; line-height: 1.3; font-weight: 600; margin-top: 2.5rem; color: #fff;}
#main_visual .vistext_wrap p b { color: #fff200;}
#main_visual .visimg_wrap {width: 9.1rem;}

/* section */
section .title_wrap {margin-bottom: 2.4rem;}
section .title_wrap h2 { font-size: 2.2rem; font-weight: 800; letter-spacing: -0.12rem;}
section .title_wrap h2 b { color: var(--main-color);}
section .title_wrap h3 { color: var(--main-color); font-size: 2rem; font-weight: 600; margin-bottom: 0.8rem;}
section .title_wrap p { font-size: 1.6rem; color: #666; margin-top: 2.5rem; letter-spacing: -0.1rem;}

/* section_form */
#section_form { padding-top: 4rem;}
.form-box .form-set { display: flex; flex-direction: column; gap: 3rem;}
.form-box .form-span{ font-size: 1.8rem; font-weight: 500; margin-bottom: 1.2rem; letter-spacing: -0.1rem;}
.form-box .form_cover{ display: flex; flex-direction: column; width: 100%;}
.form-box .form_cover .input_wrap { display: flex; align-items: center; width: 100%; gap: 1.5rem;}
.form-box .form_cover select,
.form-box .form_cover input { padding: 0 1.8rem; flex: 1; min-width: 0; height: 5rem; font-size: 1.6rem; border: 1px solid #ccc; border-radius: 0.6rem;}
.form-box .form_cover input::placeholder,
.form-box .input_wrap select,
.form-box .input_wrap select:invalid,
.form-box .input_wrap select option[value=""] { color: #aaa;}
.form-box .input_wrap select:valid,
.form-box .input_wrap select option { color: #000;}

.form-box .form_cover .form_jumin_items { flex: 1; min-width: 0;}
.form-box .form_cover .form_jumin_items input { width: 100%;}
.form-box .form_cover .dash { flex-shrink: 0; font-size: 2.5rem;}
select#telecom, select#telecom__btm { background: url(./arrow-1.png) no-repeat center right 1.9rem/ 1.6rem; padding-right: 1.9rem;}
.form-box .notice_text_title { font-family: inherit; background: none; border: 0; padding: 0; font-size: 1.5rem; letter-spacing: -0.03rem; font-weight: 600; display: flex; align-items: center;}
.form-box .notice_text_title b { font-size: 1.5rem; margin-right: 0.2rem;}
.notice_text_wrap p { margin-top: 0.6rem; font-size: 1.3rem; line-height: 1.2; color: #aaa; letter-spacing: -0.01rem; word-break: keep-all; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none; }
.form-box .btn_wrap { margin-top: 2.5rem;}
.form-box .btn_wrap button { background-color: var(--main-color); font-size: 1.8rem; font-weight: 600; display: flex; align-items: center; justify-content: center; border-radius: 0.6rem; padding: 2rem 0; gap: 1.3rem; color: #fff; width: 100%; letter-spacing: -0.06rem;}
.form-box .btn_wrap button img { width: 1.8rem;}

.form-box .region_wrap select {flex: auto; background: url(./arrow-1.png) no-repeat center right 1.9rem/ 1.6rem; padding-right: 1.9rem;}


/* section sc_con1 */
.sc_con1 {padding-top: 2.8rem;}
.sc_con1 .secimg_wrap { margin-bottom: 2.9rem;}
.sc_con1 .con1 ul { display: grid; grid-template-columns: repeat(1, 1fr); gap: 1.9rem;}
.sc_con1 .con1 ul li { display: flex; align-items: center; border: 1px solid #ccc; border-radius: 0.6rem; padding: 1.8rem 2rem; gap: 1.4rem;}
.sc_con1 .con1 ul li .img_box { width: 4.4rem; flex-shrink: 0; display: flex; align-items: center; justify-content: center;}
.sc_con1 .con1 ul li .text_box { flex: 1; min-width: 0;}
.sc_con1 .con1 ul li .text_box h4 { font-size: 1.6rem; font-weight: 600; letter-spacing: -0.04rem; line-height: 1.4; word-break: keep-all; color: var(--main-color);}
.sc_con1 .con1 ul li .text_box p { font-size: 1.6rem; letter-spacing: -0.13rem; color: #6e6e6e; line-height: 1.4;  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; }
.sc_con1 .con2 { margin-top: 3.1rem;}
.sc_con1 .con2 h5{ font-size: 2.4rem; font-weight: 600; line-height: 1.3;  margin-bottom: 0.2rem;}
.sc_con1 .con2 h5 b{ font-size: 3rem; font-weight: 900; position: relative; color: var(--main-color); padding: 0 0.6rem; letter-spacing: -0.16rem;}
.sc_con1 .con2 h5 b span {font-family: 'GMarketSans'; font-size: inherit; font-weight: inherit; color: inherit; }
.sc_con1 .con2 h5 b::after { content: ""; position: absolute; left: 0; bottom: -0.3rem;  width: 100%; height: 3.1rem; background: #e1f4ff; opacity: 0.5; z-index: -1; }
.sc_con1 .con2 p { color: #999; font-size: 1.8rem;  margin-bottom: 4rem; font-weight: 300;}

.sc_con1 .btn_wrap { margin-top: 3.1rem;}
.sc_con1 .btn_wrap button { background-color: var(--main-color); font-size: 1.8rem; font-weight: 600; display: flex; align-items: center; justify-content: center; border-radius: 0.6rem; padding: 2rem 0; gap: 1.3rem; color: #fff; width: 100%; letter-spacing: -0.06rem;}
.sc_con1 .btn_wrap button img { width: 1.9rem;}


/* section sc_con2 */
.sc_con2 { margin-top: 6.1rem;}
section .title_wrap p { margin-top: 1.3rem;}
.sc_con2 .con1 ul { display: flex; flex-direction: column; gap: 1.9rem;}
.sc_con2 .con1 ul .item { background: #f2f2f2; padding: 1.9rem 0;}
.sc_con2 .con1 ul .item:nth-child(odd) { border-radius: 6.3rem 6.3rem 6.3rem 0;}
.sc_con2 .con1 ul .item:nth-child(even) { border-radius: 6.3rem 6.3rem 0 6.3rem;}
.sc_con2 .con1 ul .text_box { text-align: center;}
.sc_con2 .con1 ul .text_box h4 { color: var(--main-color); font-size: 1.3rem; font-weight: 400; letter-spacing: -0.08rem;}
.sc_con2 .con1 ul .text_box p { font-size: 1.3rem; font-weight: 400; letter-spacing: -0.08rem; color: #777; margin-top: 0.5rem;}


/* btmcon_area */
.btmcon_area .text_wrap { background-color: #0084ee; padding: 1.8rem; margin-top: 3.8rem;}
.btmcon_area h4{ text-align: center; font-size: 1.6rem; color: #fff; font-weight: 500;}
.btmcon_area .img_wrap { width: 2.5rem; margin: 0 auto; margin-top: 3.4rem;}

/* section form btm */
#section_form_btm { }

.privacy {
	display: flex;
    align-items: center;
    margin-top: 2rem;
}
#privacy_checkbox_all {
    margin-top: 3.1rem;
}

#privacy_checkbox_all .agree-text {
    font-weight: 600;
    color: #444;
    text-decoration: underline;

}
.agree-text {
    font-size: 1.4rem;
    margin: 0 0.9rem;
    letter-spacing: -0.05rem;
    cursor: pointer;
}
#popup_modal {border:none;background:none;font-size:1.9rem;}
.underline {text-decoration:underline;padding:0 0.1rem;}
.privacy a {color:#111; text-decoration: none;}

/* info_input css end */

.img_box img {width: 100%;}



/* privacy_modal_m.php */
.pop_wrap { max-width:50rem; background:#fff; overflow:hidden;}
.pop_wrap h2 {padding:0.9rem 1.9rem; color:yellow; font-size:1.5rem; font-weight:500; line-height:1.3em; letter-spacing:-0.03rem; background:#000;}
.pop_wrap .content {padding:1.6rem 1.9rem; overflow:auto; font-size:0.9rem; font-weight:300; line-height:1.5em; letter-spacing:-0.02rem; color:#505050;}
.pop_wrap .sec {margin-bottom:1.9rem;}
.pop_wrap .sec h3 {color:#222; font-size:1.4em; font-weight:500; margin-bottom:0.6rem;}
.pop_wrap .sec h4 {color:#333; font-size:1.3em; font-weight:500; margin-bottom:0.4rem;}
.pop_wrap .sec p {margin-bottom:1em;}
.pop_wrap .sec strong {font-weight:500;}
.pop_wrap .policy-contact {display:flex; padding:1.3rem 0; background:#fafafa; border:1px solid #e5e5e5; margin-bottom:1em;}
.pop_wrap .policy-contact dl {flex:1; padding:0 1.3rem; border-left:1px solid #e5e5e5;}
.pop_wrap .policy-contact dl:first-child {border-left:0;}
.pop_wrap .policy-contact dt {font-weight:500; color:#333; margin-bottom:0.8rem;}
.pop_wrap table {width:100%; border-collapse:collapse; border-spacing:0;}
.pop_wrap table th {border:1px solid #ddd; background:#f4f4f4; padding:0.2rem 0;}
.pop_wrap table td {border:1px solid #ddd; background:#fff; padding:0.3rem;}



.pri_modal_wrap{ position: fixed; left: 50%; top: 0; transform: translateX(-50%); width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 99999999999; display: none; }

.pri_modal_inner{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);width: 37.5rem; height: 40.6rem; background: #eee; border: 0.6rem solid #ccc; overflow-X:hidden; overflow-y: scroll; }
.pri_modal_txt {margin-top: -1.9rem;}
.pri_modal_txt p{
    padding: 1.3rem; line-height:1.3rem; 
}
.pri_modal_txt1 p{
    padding: 1.3rem; line-height:1.3rem; 
    font-size:1.1em;
}
.agree_close {
    position: sticky;
    width: 1.9rem;
    height: 1.9rem;
    top: 0.9rem;
    left: 33.4rem;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pri_modal_inner h3 {
    margin-top: -1.9rem;
}
.agree_close > div{
    width: 0.2rem;
    height: 1.9rem;
    background: #aaa;
    position: absolute;
}
.agree_close div {
    transform: rotate(45deg);
}
.agree_close div:last-child {
    transform: rotate(-45deg);
}
.touch-none {touch-action:none; height: 100%; min-height: 100%; overflow:hidden;}



.pri_modal_wrap2{ position: fixed; left: 50%; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 99999999999; display: none; }
/* .pri_modal_inner2{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);width: 37.5rem; height: 40.6rem; background: #eee; border: 0.6rem solid #ccc; overflow-X:hidden; overflow-y: scroll; } */
.agree_close2 {
    position: sticky;
    width: 1.9rem;
    height: 1.9rem;
    top: 0.9rem;
    left: 33.4rem;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}
.agree_close2 > div{
    width: 0.2rem;
    height: 1.9rem;
    background: #aaa;
    position: absolute;
}
.agree_close2 div {
    transform: rotate(45deg);
}
.agree_close2 div:last-child {
    transform: rotate(-45deg);
}

.form-box .notice_wrap {
    margin-top: 2.2rem;
}


/* bottom_btn_wrap */
.bottom_btn_wrap { width: 100%; position: fixed; bottom: 0; z-index: 1;}
.bottom_btn_wrap .container { display: flex; align-items: center;  height: 100%; padding: 1.3rem 1.9rem; box-sizing: border-box; background-color: #fff;  box-shadow: 0 -0.3rem 0.8rem rgba(0,0,0,0.3);}
.bottom_btn_wrap button { width: 100%; height: 5rem;  background-color: #ed7000; color: #fff; font-size: 1.8rem; border-radius: 0.6rem; font-weight: 600; letter-spacing: -0.06rem;}

/* FOOTER */
.footer { -webkit-text-size-adjust: none; }
.footer .notice_wrap, .footer .company_wrap {padding: 3.1rem 0 2.5rem;}
.footer .notice_wrap h5 {font-size: 1.5rem; font-weight: 500; margin-bottom: 1rem; letter-spacing: -0.06rem;}
.footer .notice_wrap p {font-size: 1.3rem; line-height: 1.3; letter-spacing: -0.06rem; color: #9b9b9b; word-break: break-all;}
.footer .notice_wrap p + p {margin-top: 0.6rem;}
.footer .notice_wrap ul li { font-size: 1.2rem; line-height: 1.3; letter-spacing: -0.06rem; color: #9b9b9b; word-break: break-all;}
.footer .company_wrap {border-top: 1px solid #e0e0e0;}
.footer .company_wrap .list_wrap {margin-top: 2.8rem;}
.footer .company_wrap .list_wrap ul {display: flex; flex-wrap: wrap; gap: 2.5rem;}
.footer .company_wrap .list_wrap ul li a {font-size: 1.8rem; color: #222; text-decoration: none; letter-spacing: -0.06rem;}
.footer .company_wrap .list_wrap ul li.bold a {font-weight: 600;}
.footer .company_wrap .info_wrap {margin-top: 2.8rem; display: flex; flex-direction: column; gap: 1.9rem;}
.footer .company_wrap .info_wrap p {font-size: 1.3rem; line-height: 1.8; color: #9b9b9b;}
.footer .company_wrap .info_wrap ul {display: flex; flex-wrap: wrap; gap: 0.9rem 1.3rem; }
.footer .company_wrap .info_wrap ul li {font-size: 1.3rem; color: #9b9b9b; letter-spacing: -0.06rem;}

footer {padding: 3rem 0 9rem; background: #424242;}
footer p {font-size: 1.2rem; line-height: 1.6; letter-spacing: -0.06rem; color: #aaa;}
footer .btn_wrap { margin-bottom: 1.2rem; display: flex; align-items: center; gap: 0.6rem;}
footer button {font-family: inherit; font-size: inherit; background: none; border: 0; padding: 0; letter-spacing: -0.06rem; color: #aaa; font-weight: 500; font-size: 1.2rem;}

/* vue.js에서 하단 상담신청 부분 고정시키는 클래스 */
.fixed {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
}