/* ============================ footer style start ============================= */
@charset "utf-8";

#footer {color: #fff;}
#footer .top {padding: 45px 0; background: #f3f3f3; color: #333;}
#footer .top ul.flex .tit {margin-bottom: 25px; font-family:'NanumSquare',san-serif; font-weight: 900; transform: skew(-0.1deg); text-align: center;}

#footer .time ul.list {display:flex; flex-direction: column; align-items: flex-start; max-width: 315px; margin: 0 auto;}
#footer .time ul.list > li:not(:first-child) {margin-top: 10px;}
#footer .time ul.list > li > ul {display:flex; /* align-items:center; */ display: inline-flex; margin-bottom: 3px; text-align: left;}
#footer .time ul.list > li > ul > li:first-child {margin-right: 15px; width: 85px; text-align-last: justify; text-align: center; position: relative;}
#footer .time ul.list > li > ul > li:first-child p {font-weight: 900;}
#footer .time ul.list p {}

#footer .call h4 {line-height: 0.6; color: #00a6b1;}
#footer .call p {line-height: 1.5; font-weight: 700; margin-bottom: 20px;}

#footer .link .tit {text-align: center;}
#footer .link ul.flex a {display: inline-block;}
#footer .link ul.flex p {font-weight: 700;}

#footer .mid .root_daum_roughmap {width: 100%;}
#footer .mid .root_daum_roughmap .wrap_controllers {display: none;}

#footer .btm {padding: 45px 0 115px; background: #211d19;}
#footer .btm .inner {padding: 0 20px;}
#footer .btm article p {line-height: 1.5;}
#footer .btm ul {display: flex; margin-top: 20px;}
#footer .btm ul > li:not(:first-child) {margin-left: 20px;}
#footer .btm ul a {display: flex; align-items: center; justify-content: center; text-align: center; padding: 5px 10px; width: 200px; color: #ababab; background: #2b2928; border: 1px solid #727272;}
#footer .btm ul a img {max-width: 20px; margin-right: 10px;}

/*================================================================ 1500px 이하 ================================================================= */
@media screen and (max-width:1500px) {

}

/*================================================================ 1200px 이하 ================================================================= */
@media screen and (max-width:1200px) {
#footer .btm {padding: 50px;}
}

/*================================================================ 1025px 이하 ================================================================= */
@media screen and (max-width:1025px) {
#footer .time ul.list {max-width: 290px;}
#footer .btm {padding: 50px 0 150px 50px}
}

/*================================================================ 900px 이하 ================================================================= */
@media screen and (max-width:900px) {
#footer .top > ul.flex > li {width: 100%;}
#footer .link ul.flex {max-width: 500px; margin: 0 auto;}
#footer .time::before {position: absolute; content: ''; top: 20px; left: 50%; transform: translateX(-50%); width: 80%; height: 1px; background: #e9e9e9;}
#footer .time::after {position: absolute; content: ''; bottom: 20px; left: 50%; transform: translateX(-50%); width: 80%; height: 1px; background: #e9e9e9;} 
#footer .time > div {padding: 40px 0;}
}

/*================================================================ 769px 이하 ================================================================= */
@media screen and (max-width:769px) {
#footer {margin-top: 80px;}
#footer .top ul.flex .tit {margin-bottom: 15px;}
#footer .time ul.list {max-width: 275px;}

#footer .btm ul > li:not(:first-child) {margin-left: 10px;}
#footer .btm ul a {width: 130px;}
}

/*================================================================ 600px 이하 ================================================================= */
@media screen and (max-width:600px) {

}

/*================================================================ 425px 이하 ================================================================= */
@media screen and (max-width:480px) {
#footer {margin-top: 60px;}
#footer .top {padding: 30px 0;}
#footer .top ul.flex .tit {margin: 0 0 15px; font-size: 22px;}
#footer .time ul.list {max-width: 260px;}
#footer .mid .root_daum_roughmap .wrap_map {height: 300px !important;}

#footer .btm {padding: 30px 0 180px;}
#footer .btm article {text-align: center;}
#footer .btm ul {flex-direction: column; align-items: center;}
#footer .btm ul > li:not(:first-child) {margin-left: 0; margin-top: 10px;}
#footer .btm ul a {width: 150px;}
}


/* ============================================================================================================================== */
/* ======================================================= quick menu 코드 ==================================================== */
/* ============================================================================================================================== */


#quick_menu {position: fixed; top: 50%; transform: translateY(-50%); right: 0; z-index: 999999;}
#quick_menu img {height: 38px;}
#quick_menu span {display: block; width: 100%; padding-top: 5px; white-space: pre-line; line-height: 1.5; font-family: 'NanumSquare',san-serif; font-weight: 700; transform: skew(-0.1deg);}

#quick_menu li:first-child a{display: inline-block; width: 100%; color: #fff;}
#quick_menu li:not(:first-child) a {display: flex; align-items: center; justify-content: center; flex-direction: column; background-color: #ffffffc7; cursor: pointer; text-align: center; font-weight: 500; width: 100px; height: 100px; font-size: 14px; border: 1px solid #ccc;}
#quick_menu li:first-child {cursor: pointer; color: #fff; background-color: #00a6b1; padding: 10px 0; width: 100%; text-align: center;}
#quick_menu li:not(:first-child) a:hover {background-color: #fff; transition: all 0.3s;}
#quick_menu li.call a {border: 0; padding: 0; background: #00a6b1 !important;}
#quick_menu li.call img {height: 100%;}
#quick_menu ul li.mobile-on {display: none;}

#top_btn {border: none; width: 100%; max-width: 100px; max-height: 100px; padding: 10px; background-color: #626262; cursor: pointer;}
#top_btn span {padding: 0; color: #fff;}
#top_btn img {height: 25px;}

@media screen and (max-width:1024px){
#quick_menu {padding: 0; left: 0px;	top: auto; width: 100%; height: auto; bottom: 0px; display: block; position: fixed; z-index: 200; transform:none;}
#quick_menu ul {width: 100%; height: 100%; position: relative;}
#quick_menu ul li {width: 16.66%; height: 100%; text-align: center; border-right-color: rgb(255, 255, 255); border-right-width: 1px; border-right-style: solid; float: left;
-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
#quick_menu ul li a {width: 100% !important; max-width: 100%	!important; border: none !important; padding: 10px;}
#quick_menu ul li:first-child {display: none;}
#quick_menu ul li.mobile-on {display: block;}
#quick_menu ul li.mobile-off {display: none;}
}

@media screen and (max-width:480px){
#quick_menu ul li {width: 33.3%;}
#quick_menu ul li:nth-child(n+5):nth-child(-n+9) {border-top: 1px solid #fff;}
#quick_menu li:not(:first-child) a {height: 80px;}
#quick_menu span {line-height: 1.3; font-size: 13px;}
}