/* BASIC css start */
footer {background: var(--7); padding: 62px 100px; margin-top:150px;}
footer .cont1 {display: inline-block; vertical-align: top;}
footer .cont1 .inner {display: flex;}
footer .cont1 .inner > div {margin-right:80px;}
footer .cont1 .inner > div:last-child {margin-right:0;}
footer .cont1 h3 {font-size: 1rem; color: var(--0); font-weight: 500; margin-bottom: 20px; display: block; line-height:1; position:relative; z-index:1;}
footer .cont1 h3.on {border-bottom:none;}
footer .cont1 a {display: block; color: var(--2); font-size: 0.813rem; font-weight: 500; line-height:1; padding-bottom: 15px;}
footer .cont1 a:hover {opacity:0.5;}

footer .cont2 {display: inline-block; vertical-align: top; width: 366px; float:right;}
footer .cont2 h2 {display: block; font-size: 1.25rem; font-weight: 700; color: var(--0);}
footer .cont2 h2 br {display:none;}
footer .cont2 .subscribe {display: flex; padding:18px 0 18px;}
footer .cont2 .subscribe input {font-size: 1rem; height: 40px; line-height: 40px; border: 1px solid var(--0); text-align: center; background:none; color:#fff; width:70%; }
footer .cont2 .subscribe input:placeholder {font-size: 1rem; color: #94A0A6;}
footer .cont2 .subscribe a {line-height: 40px; text-align: center; background: var(--0); font-size: 0.875rem; color: var(--7); flex:1;}
footer .cont2 .snsLink {display: flex; align-items: center;}
footer .cont2 .snsLink li {margin-right:18px;}
footer .cont2 .snsLink li a {display: block;}
footer .cont2 .snsLink li:nth-of-type(1) a img {width:23px;}
footer .cont2 .snsLink li:nth-of-type(2) a img {width:23px; vertical-align:baseline;}
footer .cont2 .snsLink li:nth-of-type(3) a img {width:25px;}
footer .cont2 .snsLink li:nth-of-type(4) a img {width:26px;}

footer .cont3 {padding-top: 115px; clear:both; max-width:1100px;}
footer .cont3 p br {display:none;}
footer .cont3 p,
footer .cont3 p span,
footer .cont3 p span a,
footer .cont3 .copyright {font-size: 0.875rem; color: var(--2); font-weight: 500; line-height: 1;}
footer .cont3 p span {display: inline-block; vertical-align: top; margin-right: 18px; margin-bottom:12px; line-height:1;}
footer .cont3 p span a {cursor:pointer;}
footer .cont3 p span:last-child {margin-right: 0;}
footer .cont3 .copyright {margin-top:10px;}

.ft_dim {position:fixed; left:0; top:0; width:100%; height:100vh; background:rgba(0,0,0,.2); z-index:1; display:none;}

/* iframe Æ˾÷ */
.popup {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 100; display:none;}
.popup-content {position: absolute; left: 50%; top: 50%; background: #fff; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); max-width:1013px; width:1013px; height:70vh;}
.popup-content .inner {width:100%; height: 100%;}
.popup #popup-close img {width:45px;}
.popup #popup-closes {position: fixed; right: -10px; top: -50px; cursor:pointer;}
.popup #popup-closes img {width:45px;}


/******************************* ¹ÝÀÀÇü *******************************/

@media (max-width:1440px) {
    footer {padding: 42px 5vw 32px; margin-top:120px;}
    footer .cont1 .inner > div {margin-right:40px;}
    footer .cont2 .subscribe a {font-size:1rem;}
}

@media (min-width:1024px) {
    .txtLink {display:block !important;}
}


/* tablet */
@media (max-width:1024px) {
    footer {padding:0 0 32px; margin-top:95px;}

    footer .cont1 {width:100%; }
    footer .cont2 {width:100%; float:none; margin:80px 0 37px; padding:0 20px; box-sizing:border-box;}
    footer .cont3 {width:100%; margin:0; padding:0 0 0 20px; box-sizing:border-box;}
    
    footer .cont1 h3 {margin:0; font-size:0.8rem; padding:0 50px 0 20px; line-height:60px; border-bottom:1px solid var(--5);}
    footer .cont1 a {padding: 0 20px 0 35px; line-height: 30px; font-size:0.77rem;}
    footer .cont1 .inner {display:block;}
    footer .cont1 .inner > div {flex:inherit; position:relative; margin:0;}
    footer .cont1 .inner .txtLink {display:none; border-bottom:1px solid var(--5); padding:0 0 20px;}
    footer .cont1 .inner .open {width:50px; position: absolute; right: 0; top:10px; transition:all .3s ease;}
    footer .cont1 .inner .open span {width: 11px; height: 1px; display: inline-block; position: absolute; background: var(--3); top: 21px; left: 50%; margin-left:-5.5px; transition:all .3s ease;}
    footer .cont1 .inner .open span:first-child {}
    footer .cont1 .inner .open span:last-child {transform: rotate(90deg); -webkit-transform: rotate(90deg);}
    footer .cont1 .inner .open.active span:last-child {opacity:0;}
    
    footer .cont2 h2 br {display:block;}
    footer .cont2 .subscribe {padding:20px 0 14px; max-width:550px;}
    footer .cont2 .subscribe input {line-height:40px; height:40px;}
    footer .cont2 .subscribe input:placeholder {font-size:0.5rem;}
    footer .cont2 .subscribe a {width:19%;}
    footer .cont2 .snsLink li {margin-right:15px;}
    footer .cont2 .snsLink li a img {width:20px; vertical-align: middle;}
    
    footer .cont3 p,
    footer .cont3 p span,
    footer .cont3 p span a,
    footer .cont3 .copyright,
    footer .cont2 .subscribe input {font-size:0.75rem;}
    footer .cont2 h2 {font-size:1.5rem;}
    footer .cont3 p {display:inline-block; word-break: keep-all;}
    footer .cont3 p br {display:block;}
    footer .cont3 p span {margin:0; display:inline; line-height:1.5;}
    footer .cont3 p span.line:after {content:''; display:inline-block; width:1px; height:10px; background:var(--2); margin:0 5px; position: relative; top: 2px;}
    
    .popup-content {width:88%;}
    .popup #popup-closes {top:-45px;}
    .popup #popup-close img {width:45px;}
    .popup #popup-closes svg {width:40px !important;}
}


/* mobile */
@media (max-width:768px) {
    footer .cont1 h3 {font-size:1rem; line-height:55px;}
    footer .cont1 .inner .open {top:14px;}
    footer .cont1 .inner .open span {width: 11px; height: 1px; top: 14px;}
    footer .cont1 a {font-size:0.875rem;}
    
    footer .cont2 .snsLink li:nth-of-type(1) a img {width:25px;}
    footer .cont2 .snsLink li:nth-of-type(2) a img {width:25px;}
    footer .cont2 .snsLink li:nth-of-type(3) a img {width:28px;}
    footer .cont2 .snsLink li:nth-of-type(4) a img {width:29px;}
    footer .cont2 .subscribe a {font-size:0.875rem;}
    
    footer .cont2 h2 {font-size:1.25rem;}
    footer .cont3 p, 
    footer .cont3 p span, 
    footer .cont3 p span a,
    footer .cont3 .copyright {font-size:0.65rem;}
}
/* BASIC css end */