@charset "utf-8";

/* 내용관리 */

.cs {
    padding-bottom: 270px;
}
ul.cs-ul {}
li.cs-li {
    display: flex;
    border-top: 0.5px solid #000000;
    justify-content: space-between;
}
.cs-subj {
    white-space: nowrap;
    padding-top: 19px;
    font-size: 1.125rem;
    font-weight: 500;
    min-width: calc(470/1548*100%);
}
.cs-cont {
    width: 100%;
}
ul.cs-cont-ul {}
li.cs-cont-li {
    position: relative;
    padding: 20px 0;
    padding-right: 110px;
}
li.cs-cont-li + li.cs-cont-li,
li.cs-cont-li__arc + li.cs-cont-li__arc{border-top: 0.5px solid #000000;}
a.cs-btn {
    position: absolute;
    bottom: 19px;
    right: 0;
    background-color: #D9D9D9;
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 0.5px solid #707070;
    border-bottom: 0.5px solid #707070;
    width: 102px;
    height: 34px;
}
li.cs-cont-li h2 {
    font-size: 1.125rem;
    font-weight: 500;
}
.cs-cont p {
    margin-top: 8px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}
.cs-arc-hd {
    font-size: 1.125rem;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    cursor: pointer;
    transition: color 0.3s;
}
.cs-arc-hd.active {
    color: #BFBFBF;
}
.cs-arc-hd:after {content: '';display: block;background-image: url(/img/proc/ico-proc-plus.svg);width: 18px;height: 18px;background-position: center;background-repeat: no-repeat;background-size: cover;margin-right: 18px;transition: opacity 0.3s;}
.cs-arc-hd.active:after {content: '';opacity: 0;}
ul.cs-arc-ul {
    display:none;
    /* padding-left: 23px; */
    padding-bottom: 20px;
}
li.cs-arc-li {
    font-size: 1rem;
    font-weight: 400;
    padding-left: 23px;
    /* text-indent: -23px; */
    position: relative;
}
li.cs-arc-li + li.cs-arc-li{
    margin-top: 10px;
}
li.cs-arc-li:before{content: '';width: 3px;height: 3px;background-color: #000000;position: absolute;top: 8px;left: 6px;border-radius: 100%;}
.map-cont {
    width: 100%;
    height: 0;
    padding-bottom: calc(646 / 1077*100%);
    position: relative;
    margin-top: 20px;
}
.map-cont #map {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}
.map-cont + p {
    margin-top: 29px;
}



.qaform-cont {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: -1;
    overflow-y: auto;
    backdrop-filter: blur(8px);
}
.qaform-bg {
    background-color: #000000;
    /* mix-blend-mode: multiply; */
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    opacity: 0.9;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
/* 배경 흐림 8px */
    backdrop-filter: blur(8px);

  /* 배경 밝기 4 (기본 1, 높을수록 밝음) */
    backdrop-filter: blur(8px) brightness(4);

  /* 투명도 59% (0.59) */
    opacity: 0.59;

  /* Safari 등 호환성 */
    -webkit-backdrop-filter: blur(8px) brightness(4);
    opacity: 0;
}
.qaform-bg.active{
    opacity: 0.59;
    z-index: 1000;
}
.cont-wrap-inner {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    margin-top: 40px;
    margin-bottom: 20px;
    height: calc(100% - 60px);
    min-height: 700px;
    position: relative;
    /* transform: translateY(100%); */
    transition: transform 0.5s ease;
}
.qaform-cont.active {
    z-index: 9999;
    opacity: 1;
}
.qaform-cont.active .qaform-bg {}
.qaform-cont.active .cont-wrap-inner {
    /* transform: translateY(0); */
}
section.contact {
    background-color: #D9D9D9;
    /* padding: 23px 27px; */
    /* padding-bottom: 80px; */
}
.contact-wrap{
    height: calc(100% - 60px);
    overflow-y: auto;
    padding: 23px 27px;
}
.contact-title {
    font-size: 1.125rem;
    font-weight: 500;
    border-top: 0.5px solid #000000;
    padding-top: 17px;
}
.contact-sub {
    margin-top: 14px;
    font-size: 0.875rem;
    font-weight: 400;
    min-height: 100px;
    line-height: 1.7;
}
.contact-cont {
    margin-top: 20px;
    border-top: 0.5px solid #000000;
}
.contact-cont h2 {
    margin-top: 17px;
    font-size: 1.125rem;
    font-weight: 500;
    margin-bottom: 32px;
}
.contact-cont .row,
.contact-cont .row__agree {
    /* display: flex; */
    margin-bottom: 1rem;
}
.contact-cont .row.flex{
    gap: 20px;
}
.contact-cont .row .name{
    min-width: calc(204/546*100%);
    max-width: calc(204/546*100%);
    width: 100%;
}
.contact-cont .row .tel{
    width: 100%;
}
.input_label {font-size: 0.875rem;font-weight: 400;margin-bottom: 5px;display: block;}
.input_box {}
.contact-cont input[type="text"] {
    height: 37px;
    border-radius: 0;
    border: 0;
    border-bottom: 0.5px solid #000000;
}
ul.input-ul {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 20px;
    margin-top: 13px;
    margin-bottom: 23px;
}
ul.input-ul li {
    width: calc(1/4*100% - 3/4*20px);
    border-bottom: 0.5px solid #000000;
    display: flex;
    white-space: nowrap;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 400;
    padding-bottom: 6px;
}
ul.input-ul li input#qa_4 {
    text-align: right;
    background-color: transparent;
    border: 0;
    height: 17px;
    min-width: 10px;
    padding: 0;
}
.contact-cont input[type="radio"] {}
.contact-cont input[type="radio"] + label::before {
    border-radius: 0;
    border: 0;
    width: 10px;
    height: 10px;
}
input[type="radio"]:checked + label::before{content: '';background-color: #fff;}
input[type="radio"]:checked + label::after{content: '';width: 10px;height: 11px;position: absolute;background-image: url(/img/ico-check.svg);background-repeat: no-repeat;background-size: cover;background-position: center;}
.contact-cont input[type="radio"] + label{
    font-size: 0.875rem;
    font-weight: 400;
    position: relative;
}
.contact-cont .row__agree {
    margin-top: 40px;
    padding-top: 10px;
    border-top: 0.5px solid #000000;
}

.agree {
    display: flex;
    justify-content: space-between;
}
.agree input[type="checkbox"] {}
.agree input[type="checkbox"] + label {
    font-size: 0.750rem;
    font-weight: 300;
    position: relative;
}
.agree input[type="checkbox"] + label::before {
    border-radius: 0;
    border: 0;
    width: 10px;
    height: 10px;
}
.agree input[type="checkbox"]:checked + label::before{content: '';background-color: #fff;}
.agree input[type="checkbox"]:checked + label::after{content: '';width: 10px;height: 11px;position: absolute;background-image: url(/img/ico-check.svg);background-repeat: no-repeat;background-size: cover;background-position: center;}
.agree a {
    font-size: 0.750rem;
    font-weight: 300;
    text-decoration: underline;
}
.agree a:hover{text-decoration:underline}

#captcha{
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    align-items: end;
}
#captcha_img {
    width: 120px;
    height: 50px;
    border-bottom: 0.5px solid #000000;
}
#captcha_key {
    width: 120px;
    height: 50px;
}
#captcha_mp3 ,
#captcha_reload{
        font-size: 0;
        width: 32px;
        height: 32px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        background-color: #D9D9D9;
        border: 0.5px solid #000000;
}
#captcha_mp3 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31.973' height='31.973' viewBox='0 0 31.973 31.973'%3E%3Cg id='그룹_608' data-name='그룹 608' transform='translate(16727.453 -3469.617)'%3E%3Crect id='사각형_278' data-name='사각형 278' width='31.973' height='31.973' transform='translate(-16727.453 3469.617)' fill='none'/%3E%3Cpath id='패스_100' data-name='패스 100' d='M40.577,12.547a6.669,6.669,0,0,1-.009,8.485' transform='translate(-16748.795 3468.811)' fill='none' stroke='%23000' stroke-miterlimit='10' stroke-width='1.5'/%3E%3Cpath id='패스_101' data-name='패스 101' d='M49.079,5.523a9.847,9.847,0,0,1-.009,12.534' transform='translate(-16754.846 3473.81)' fill='none' stroke='%23000' stroke-miterlimit='10' stroke-width='1.5'/%3E%3Cpath id='패스_102' data-name='패스 102' d='M9.637,1.75,5.765,6.3H1.75v5.614H5.765l3.872,4.551h.928V1.75Z' transform='translate(-16721.164 3476.496)' fill='none' stroke='%23000' stroke-miterlimit='10' stroke-width='1.5'/%3E%3Crect id='사각형_279' data-name='사각형 279' width='19.309' height='18.13' transform='translate(-16721.121 3476.539)' fill='none'/%3E%3C/g%3E%3C/svg%3E%0A");

}
#captcha_reload {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='31.973' height='31.973' viewBox='0 0 31.973 31.973'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='사각형_277' data-name='사각형 277' width='19.05' height='19.917' transform='translate(0 -1)' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='그룹_609' data-name='그룹 609' transform='translate(16687.682 -3469.617)'%3E%3Crect id='사각형_276' data-name='사각형 276' width='31.973' height='31.973' transform='translate(-16687.682 3469.617)' fill='none'/%3E%3Cg id='그룹_599' data-name='그룹 599' transform='translate(-16681.219 3476.586)' clip-path='url(%23clip-path)'%3E%3Cpath id='패스_98' data-name='패스 98' d='M16.355,9.052a7.3,7.3,0,1,1-.945-3.595' transform='translate(0.473 -0.094)' fill='none' stroke='%23000' stroke-miterlimit='10' stroke-width='1.5'/%3E%3Cpath id='패스_99' data-name='패스 99' d='M38.71,1.75V5.473H34.987' transform='translate(-22.812 -0.094)' fill='none' stroke='%23000' stroke-miterlimit='10' stroke-width='1.5'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
#captcha_info {
    font-size: 0.875rem;
    font-weight: 400;
}
.btn_submit-wrap{
    /* position: fixed; */
    left: 50%;
    bottom: 0;
    background-color: #D9D9D9;
    padding: 17px 27px;
    /* padding-top: 0; */
    /* transform: translateX(-50.4%); */
    width: 100%;
    max-width: 600px;
}
.btn-submit-qa {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.250rem;
    font-weight: 500;
    width: 100%;
    height: 46px;
    border: 0.5px solid #000000;
}


/***********************************************************************************
mediaquery
************************************************************************************/
@media screen and (max-width: 1200px) {


    
}
@media screen and (max-width: 768px) {


  .cs {
    padding-bottom: 62px;
}
ul.cs-ul {}
li.cs-li {}
.cs-subj {
    min-width: 92px;
    padding-top: 12px;
    font-size: 0.875rem;
}
.cs-cont {}
ul.cs-cont-ul {}
li.cs-cont-li {
    padding: 12px 0;
}
a.cs-btn {
    top: 15px;
    bottom: auto;
    font-size: 0.750rem;
    width: 80px;
    height: 22px;
}
li.cs-cont-li h2 {
    font-size: 0.875rem;
    font-weight: 500;
}
.cs-cont p {
    font-size: 0.750rem;
    font-weight: 300;
    margin-top: 19px;
}
li.cs-cont-li:nth-child(2) p{
    margin-top: 26px;
}
.cs-arc-hd {
    font-size: 0.875rem;
    font-weight: 500;
    padding: 12px 0;
}
.cs-arc-hd.active {}
.cs-arc-hd:after {content: '';width: 12px;height: 12px;margin-right: 8.5px;}
.cs-arc-hd.active:after {content: '';}
ul.cs-arc-ul {
    padding-bottom: 12px;
}
li.cs-arc-li {
    font-size: 0.750rem;
    font-weight: 300;
    line-height: 1.5;
    padding-left: 9px;
}
li.cs-arc-li + li.cs-arc-li{
    margin-top: 0;
}
li.cs-arc-li:before{content: '';width: 1px;height: 1px;left: 1px;top: 8px;}
.map-cont {
    width: 100%;
    height: 0;
    padding-bottom: calc(196 / 268 * 100%);
    position: relative;
    margin-top: 11px;
}
.map-cont #map {}




.qaform-cont {}
.qaform-bg {}
.cont-wrap-inner {
    padding: 10px;
}
.qaform-cont.active {}
.qaform-cont.active .qaform-bg {}
.qaform-cont.active .cont-wrap-inner {}
section.contact {
    /* padding: 16px; */
}
.contact-wrap{
    padding: 19px 16px;
}
.contact-title {
    padding-top: 10px;
    font-size: 0.875rem;
    font-weight: 500;
}
.contact-sub {
    font-size: 0.750rem;
    font-weight: 300;
    min-height: auto;
    margin-top:16px;
    line-height: 1.6;
}
.contact-cont {
    margin-top: 16px;
}
.contact-cont h2 {
    margin-top: 10px;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 16px;
}
.contact-cont .row,
.contact-cont .row__agree {
    margin-bottom: 1rem;
}
    .contact-cont .row.flex{
    gap: 14px;
}
.contact-cont .row .name{
    min-width: calc(144/332*100%);
    max-width: calc(144/332*100%);
    width: 100%;
}
.contact-cont .row .tel{
    width: 100%;
}
.input_label {
    font-size: 0.750rem;
    font-weight: 300;
    margin-bottom: 4px;
    display: block;
}
.input_box {}
.contact-cont input[type="text"] {
    height: 23px;
}
ul.input-ul li input#qa_4 {
    height: 14px;
}
ul.input-ul {
    margin-top: 9px;
    margin-bottom: 23px;
}
ul.input-ul li {
    font-size: 0.750rem;
    font-weight: 300;
    padding-bottom: 4px;
}
.contact-cont input[type="radio"] + label{
    font-size: 0.750rem;
    font-weight: 300;
}
.contact-cont input[type="radio"] {}
.contact-cont input[type="radio"] + label::before {
    font-size: 0.813rem;
}
.contact-cont .row__agree {
    margin-top: 27px;
    padding-top: 7px;
}
#captcha_key {}
#captcha_mp3 {}
#captcha_reload {}
#captcha_info {}
    
#captcha{
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: end;
}
#captcha_img {
    width: 88px;
    height: 38px;
    border-bottom: 0.5px solid #000000;
}
#captcha_key {
    width: 95px;
    height: 38px;
}
#captcha_mp3 ,
#captcha_reload{width: 23px;height: 23px;}
#captcha_mp3 {


}
#captcha_reload {

}
#captcha_info {
    font-size: 0.750rem;
    font-weight: 300;
}
.btn-submit-qa {
    font-size: 0.875rem;
    font-weight: 500;
    height: 34px;
}
.btn_submit-wrap{
    /* width: calc(100% - 20px); */
    /* transform: translateX(-50%); */
    padding: 9px 15px;
    /* padding-top: 0; */
}


footer{display: block;}

}