.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; padding: 20px 0; -webkit-transition: background 0.3s ease, border 0.3s ease; transition: background 0.3s ease, border 0.3s ease; }
.header.black .header-logo { background-image: url(/assets/images/common/logo_black.svg); }
.header.black .header-nav__depth1 { color: #1d1d1b; }
.header.black .hamburger-btn > span { background-color: #1d1d1b; }
.header.active { background-color: transparent !important; border-bottom: none !important; }
.header.active .header-logo,
.header.active .header-nav { visibility: hidden !important; }
.header.active .hamburger-btn span { background-color: #fff !important; }
.header.scroll { background-color: #fff; border-bottom: 1px solid #ddd; }
.header.scroll .header-logo { background-image: url(/assets/images/common/logo_black.svg); }
.header.scroll .header-nav__depth1 { color: #1d1d1b; }
.header.scroll .hamburger-btn > span { background-color: #1d1d1b; }
.header-logo { width: 125px; height: 69px; background-image: url(/assets/images/common/logo_white.svg); background-repeat: no-repeat; background-size: cover; }
.header-inner { max-width: 1770px; margin-left: auto; margin-right: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.header-nav { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: -webkit-box; display: -ms-flexbox; display: flex; }
.header-nav > li { position: relative; }
.header-nav > li:not(:last-child) { margin-right: 98px; }
.header-nav__depth1 { color: #fff; font-size: 17px; }
.header-nav__depth2 { width: 220px; background-color: rgba(0, 0, 0, 0.6); border-radius: 7px; position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 40px; padding: 25px 0; display: none; opacity: 0; }
.header-nav__depth2 > a { display: block; color: rgba(255, 255, 255, 0.4); text-align: center; font-size: 16px; }
.header-nav__depth2 > a:hover { color: #fff; }
.header-nav__depth2 > a:not(:last-child) { margin-bottom: 15px; }
.hamburger-btn { width: 26px; height: 19px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; cursor: pointer; -webkit-transition: -webkit-transform 330ms ease-out; transition: -webkit-transform 330ms ease-out; transition: transform 330ms ease-out; transition: transform 330ms ease-out, -webkit-transform 330ms ease-out; }
.hamburger-btn > span { background-color: #fff; width: 100%; height: 2px; }
.hamburger-btn > span:nth-child(1) { width: 50%; -webkit-transition: -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57), -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); -webkit-transform-origin: right; transform-origin: right; }
.hamburger-btn > span:nth-child(3) { width: 50%; -ms-flex-item-align: end; align-self: flex-end; -webkit-transition: -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57), -webkit-transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57); -webkit-transform-origin: left; transform-origin: left; }
.hamburger-btn.active { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.hamburger-btn.active > span:nth-child(1) { -webkit-transform: rotate(-90deg) translateX(5px); transform: rotate(-90deg) translateX(5px); }
.hamburger-btn.active > span:nth-child(3) { -webkit-transform: rotate(-90deg) translateX(-5px); transform: rotate(-90deg) translateX(-5px); }
.sitemap { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 998; background-image: url(/assets/images/common/sitemap_bg.png); background-repeat: no-repeat; background-size: cover; display: none; opacity: 0; }
.sitemap ul { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.sitemap ul > li { width: 300px; }
.sitemap ul > li:not(:last-child) { margin-right: 60px; }
.sitemap-depth1 { color: #fff; font-size: 30px; font-weight: 600; padding-bottom: 35px; border-bottom: 1px solid rgba(255, 255, 255, 0.3); margin-bottom: 40px; }
.sitemap-depth2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.sitemap-depth2 > a { font-size: 16px; color: #a5a5a5; border-bottom: 1px solid transparent; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
.sitemap-depth2 > a:hover { border-color: #fff; -webkit-transform: translateX(5px); transform: translateX(5px); color: #fff; }
.sitemap-depth2 > a:not(:last-child) { margin-bottom: 24px; }
.footer { background-color: #000; padding: 50px 0 60px; position: relative; }
.footer .inner-big { display: -webkit-box; display: -ms-flexbox; display: flex; }
.footer-top-btn { position: absolute; top: -100px; right: 50px; cursor: pointer; }
.footer-logo { margin-right: 90px; display: block; width: 110px; }
.footer-info { font-size: 16px; color: #757575; line-height: 1.8em; }
.footer-info span { display: inline-block; }
.footer-info span:not(:last-child) { margin-right: 25px; position: relative; }
.footer-info span:not(:last-child)::before { content: ''; width: 1px; height: 12px; background-color: #757575; position: absolute; right: -12px; top: 4px; }
.footer-copy { font-size: 16px; color: #aaa; margin-top: 12px; }
.footer-mark { margin-left: auto; }
.footer-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-top: 23px; }
.footer-menu > a { color: #aaa; font-size: 16px; }
.footer-menu > a:not(:last-child) { margin-right: 25px; position: relative; }
.footer-menu > a:not(:last-child)::before { content: ''; width: 1px; height: 12px; background-color: #757575; position: absolute; right: -12px; top: 4px; }

.show-default { display: block !important; }
.hide-default { display: none !important; }

@media all and (max-width: 1800px){
 .footer .inner-big,
 .header { padding-left: 2%; padding-right: 2%; }
 .header-nav { width: 800px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
 .footer { padding-left: 0; padding-right: 0; }
 }
@media all and (max-width: 1500px){
 .sitemap-depth1 { font-size: 25px; }
 .sitemap ul > li:not(:last-child) { margin-right: 30px; }
 .sitemap ul > li { width: 250px; }
 }
@media all and (max-width: 1200px){
 .header-nav > li:not(:last-child) { margin-right: 25px; }
 .header-nav__depth1 { font-size: 16px; }
 .footer .inner-big { -ms-flex-wrap: wrap; flex-wrap: wrap; }
 .footer-mark { margin-top: 45px; margin-left: 0; width: 100%; }
 .footer-mark img { margin-left: auto; }
 .sitemap { padding: 150px 3.90625%; background-position: center; }
 .sitemap ul { width: 100%; position: static; top: auto; left: auto; -webkit-transform: none; transform: none; display: block; }
 .sitemap ul > li { width: auto; }
 .sitemap ul > li:not(:last-child) { margin-right: 0; margin-bottom: 75px; }
 .sitemap-depth1 { margin-bottom: 0px; padding-bottom: 0; border: none; }
 .sitemap-depth2 { margin-top: 25px; display: none; }
 .sitemap-depth2 > a { display: block; border: none !important; }
 }
@media all and (max-width: 1024px){
 .show-1024 { display: block !important; }
 .hide-1024 { display: none !important; }
 .header-nav { display: none; }
 }
@media all and (max-width: 768px){
 .show-768 { display: block !important; }
 .hide-768 { display: none !important; }
 .footer-logo { margin-right: 0; }
 .footer .inner-big { display: block; }
 .footer-info { margin-top: 45px; }
 .footer-mark img { margin-left: 0; }
 .footer-menu { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
 .footer-top-btn { display: none; }
 }
@media all and (max-width: 640px){
 .show-640 { display: block !important; }
 .hide-640 { display: none !important; }
 .header { padding: 15px 3.90625%; }
 .header-logo { width: 110px; height: 61px; }
 .footer { padding: 45px 3.90625%; }
 .footer-info { margin-top: 25px; font-size: 13px; }
 .footer-menu > a:not(:last-child),
 .footer-info span:not(:last-child) { margin-right: 20px; }
 .footer-menu > a:not(:last-child)::before,
 .footer-info span:not(:last-child)::before { right: -10px; top: 3px; }
 .footer-copy { font-size: 13px; }
 .footer-mark { margin-top: 25px; }
 .footer-menu { margin-top: 15px; }
 .footer-menu > a { font-size: 14px; }
 .sitemap { padding: 100px 3.90625%; }
 .sitemap ul > li:not(:last-child) { margin-bottom: 45px; }
 .sitemap-depth1 { font-size: 22px; }
 .sitemap-depth2 > a:not(:last-child) { margin-bottom: 15px; }
 }