@charset "utf-8";

/* 공통영역 reset */
* {font-family: 'Noto Sans KR';}
html {scroll-behavior: smooth;}
section {width: 100%; position: relative; overflow: hidden; letter-spacing: -0.02em;}
.container {width: 1400px; margin: 0 auto;}
a:active, a:hover, a:focus {text-decoration: none;}

/* global.css 수정 */
.btnArea {margin: 2.143em 0;}

@media screen and (max-width: 1400px) {
    .container {width: 90%;}
}

@media screen and (max-width: 1025px) {
    .container {width: 100%; padding: 0 30px; box-sizing: border-box;}
}

@media screen and (max-width: 768px) {
    .container {padding: 0 20px;}
}

/* header */
header {width: 100%; position: fixed; top: 0; left: 0; z-index: 99; transition: all 0.5s ease-in-out;}
header .in_header {width: 90%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
header .in_header .logo {display: flex; align-items: center;}
header .in_header .logo a {text-indent: -9999px; background-repeat: no-repeat; background-size: 100%;}
header .in_header .logo .busan {display: block; width: 169px; height: 43px; background-image: url('/humanframe/theme/anbu/assets/img/layout/busan_logo.png'); margin-right: 40px;}
header .in_header .logo .anbu {display: block; width: 82px; height: 47px; background-image: url('/humanframe/theme/anbu/assets/img/layout/anbu_logo.png');}
header .in_header .nav .nav_list {display: flex; padding-top: 35px;}
header .in_header .nav .nav_list li a {display: block; padding: 0 32px 35px 32px; box-sizing: border-box; font-weight: 500; color: #fff; font-size: 21px; position: relative;}
header .in_header .nav .nav_list li a::before {content: ''; position: absolute; top: 5px; right: 0; width: 1px; height: 16px; background-color: #fff; opacity: 0.5;}
header .in_header .nav .nav_list li:first-child a {padding-left: 0;}
header .in_header .nav .nav_list li:last-child a {padding-right: 0;}
header .in_header .nav .nav_list li:last-child a::before {display: none;}


header.on, header.active  {background-color: #fff; border-bottom: 1px solid #e6e6e6; box-sizing: border-box;}
header.on .in_header .logo .busan,
header.active .in_header .logo .busan {background-image: url('/humanframe/theme/anbu/assets/img/layout/busan_logo_on.png');}
header.on .in_header .logo .anbu,
header.active .in_header .logo .anbu {background-image: url('/humanframe/theme/anbu/assets/img/layout/anbu_logo_on.png');}
header.on .in_header .nav .nav_list li a,
header.active .in_header .nav .nav_list li a {color: #000;}

header.on .in_header .nav .nav_list li a:hover,
header.active .in_header .nav .nav_list li a:hover {color: #e3007f; font-weight: 600;}
header.on .in_header .nav .nav_list li a::before,
header.active .in_header .nav .nav_list li a::before {background-color: #d0d0d0;}

header .in_header .menu_btn,
header .in_header .menu_close_btn {display: none;}

@media screen and (max-width: 1280px) {
    header .in_header .logo .busan {margin-right: 25px;}
    header .in_header .nav .nav_list li a {padding: 0 27px 35px 27px;}
}

@media screen and (max-width: 1025px) {
    header .in_header {width: 95%;}
    header .in_header .logo .busan {width: 126px; height: 35px; margin-right: 15px;}
    header .in_header .logo .anbu {width: 65px; height: 37px;}
    header .in_header .nav .nav_list {padding-top: 25px;}
    header .in_header .nav .nav_list li a {padding: 0 20px 25px 20px; font-size: 18px;}
}

@media screen and (max-width: 768px) {
    header .in_header {padding: 20px 0;}
    header .in_header .menu_btn,
    header .in_header .menu_close_btn {text-indent: -9999px; background-size: 100%; background-repeat: no-repeat;}
    header .in_header .menu_btn.active,
    header .in_header .menu_close_btn.active {display: block;}
    header .in_header .menu_btn {width: 32px; height: 23px; background-image: url('/humanframe/theme/anbu/assets/img/layout/menu_icon.png');}
    header.on .in_header .menu_btn,
    header.active .in_header .menu_btn {background-image: url('/humanframe/theme/anbu/assets/img/layout/menu_icon_on.png');}
    header .in_header .menu_close_btn {display: none; width: 24px; height: 24px; background-image: url('/humanframe/theme/anbu/assets/img/layout/menu_close.png');}
    header .in_header .nav .nav_list {flex-direction: column; position: fixed; top: 78px; left: 100%; width: 100%; height: 100vh; padding-top: 70px; background-color: #fff; transition: all 0.5s ease-in-out}
    header .in_header .nav .nav_list li {width: 100%;}
    header .in_header .nav .nav_list li a {font-weight: 600; font-size: 28px; color: #333333; padding: 0; text-align: center; line-height: 1; margin-bottom: 65px;}
    header .in_header .nav .nav_list li a::before {display: none;}
    header .in_header .nav .nav_list li a.active {color: #e3007f;}
}

@media screen and (max-width: 680px) {
    header .in_header .logo {width: 100%;}
}

@media screen and (max-width: 480px) {
    header .in_header {padding: 10px 0;}
    header .in_header .logo .busan {width: 115px; height: 30px; margin-right: 15px;}
    header .in_header .menu_btn {width: 25px; height: 18px;}
    header .in_header .menu_close_btn {width: 20px; height: 20px;}
    header .in_header .nav .nav_list {top: 58px; padding-top: 60px;}
    header .in_header .nav .nav_list li a {font-size: 24px; margin-bottom: 55px;}
}

/* top_btn */
.top_btn {position: fixed; bottom: 100px; right: 30px; width: 52px; height: 52px; border-radius: 50%; background: url('/humanframe/theme/anbu/assets/img/layout/top_btn.png') center center #e3007f no-repeat; z-index: 10;}

/* footer */
footer {width: 100%; position: relative; background-color: #353b45; color: #fff; padding: 50px 0; font-family: 'pretendard'; font-size: 16px; font-weight: 400;}
footer .container .copyBox {width: 65%; padding-right: 15px; box-sizing: border-box;}
footer .container .copyBox .txt {opacity: 0.7;}
footer .container .copyBox .logo {display: inline-block; margin-bottom: 20px;}
footer .container .copyBox .adress {margin-bottom: 5px;}

footer .container .callBox {position: absolute; top: 0; right: 0; width: 35%; height: 100%; display: flex; flex-direction: column; justify-content: center; background-color: #424954; font-family: "NotoSansKR"; padding-left: 75px; box-sizing: border-box; letter-spacing: -0.03em;}
footer .container .callBox .title {display: flex; color: #d3d4d6; font-size: 15px; font-weight: 400; margin-bottom: 10px;}
footer .container .callBox .title .tit {position: relative; margin-right: 8px; padding-right: 8px; box-sizing: border-box;}
footer .container .callBox .title .tit::before {content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 12px; top: 50%; margin-top: -6px; background-color: #d3d4d6;}
footer .container .callBox .tel {position: relative; display: flex; flex-direction: column; justify-content: center; padding-left: 70px; box-sizing: border-box;}
footer .container .callBox .tel::before {content: ''; position: absolute; top: 0; left: 0; width: 52px; height: 53px; background: url('/humanframe/theme/anbu/assets/img/layout/call_icon.png') no-repeat; background-size: 100%;}
footer .container .callBox .tel a {color: #ffffff; font-size: 22px; font-weight: 600;}

@media screen and (max-width: 1025px) {
	footer {padding: 35px 0;}

    footer .container .copyBox {width: 60%;}
    footer .container .callBox {width: 40%; padding-left: 50px;}
}

@media screen and (max-width: 768px) {
    footer {padding: 85px 0 25px 0;}
    footer .container {width: 100%;}
    footer .container .copyBox {width: 100%; padding-right: 0; text-align: center;}
    footer .container .callBox {width: 100%; height: auto; padding: 20px 0 20px 30px; flex-direction: row; justify-content: flex-start; align-items: center;}
    footer .container .callBox .title {margin-bottom: 0;}
    footer .container .callBox .tit {margin-bottom: 0; font-size: 18px; margin-right: 20px; padding-right: 20px; box-sizing: border-box;}
    footer .container .callBox .tel {flex-direction: row; align-items: center; padding-left: 0;}
    footer .container .callBox .tel::before {display: none;}
    footer .container .callBox .tel .name {margin-bottom: 0; font-size: 18px; margin-right: 20px;}

    footer .container .adress {display: none;}
    .top_btn {bottom: 30px;}
}

@media screen and (max-width: 680px) {
    footer .container .callBox .tit {font-size: 14px;}
    footer .container .callBox .tel .name {font-size: 14px;}
    footer .container .callBox .tel a {font-size: 17px;}
}

@media screen and (max-width: 480px) {
	footer {box-sizing: border-box; font-size: 14px;}
	footer .container {text-align: center;}
    footer .container .logo {margin-bottom: 15px;}
    footer .container .callBox {padding: 15px 10px; word-break: keep-all;}
}