@charset "utf-8";

/*
 * File : layout.css
 *
 * SUMMARY:
 * 01) GLOBAL
 * 02) HEADER
 * 03) FOOTER
 * 04) CONTAINER
 * 05) PAGE
 * 06) 
 */


:root {
    --basic-text-color: #000;
    --black-text-color:#232527;
    --blue-text-color:#0084B5;
    --white-text-color: #fff;
    --white-gray-text-color: #fff;
    --gray-text-color: #767676;
    --gray-text-deep-color: #505050;
    --hover-text-color: #222;
    --body-bg: #fff;
    --body-sub-bg: #fafafa;
    --card-bg:#fff;
    --card-gray-bg:#f4f4f4;
    --btn-bg:#fff;
    --btn-gray-bg:#f5f5f5;
    --btn-text-color:#000;
    --menu-text-color: #767676;
    --header-menu-bg:#fff;
    --header-menu-tit-bg:#0084B5;
    --footer-bg: #fbfbfb;
    --footer-sub-bg: #fff;
    --border-color:#E5E5E5;
    --border-black-color:#232527;
    --border-blue-color:#0084B5;
    --main-banner-bg:#27415D;
    --blue-bg:#EDFAFF;
}

[data-theme="dark"], body.dark-mode {
    --basic-text-color: #fff;
    --black-text-color: #fff;
    --blue-text-color:#31b4e5;
    --white-text-color: #fff;
    --white-gray-text-color: #aaa;
    --gray-text-color: #aaa;
    --gray-text-deep-color: #bbb;
    --hover-text-color: #fff;
    --body-bg: #121212;
    --body-sub-bg: #121212;
    --card-bg:#1b1f24;
    --card-gray-bg:#121212;
    --btn-bg:#323847;
    --btn-gray-bg:#3e4149;
    --btn-text-color:#fff;
    --menu-text-color: #fff;
    --header-menu-bg:#1a1c23;
    --header-menu-tit-bg:#1b202b;
    --footer-bg: #16191a;
    --footer-sub-bg: #16191a;
    --border-color:#333;
    --border-black-color:#3c3e47;
    --border-blue-color:#333;
    --main-banner-bg:#2c3137;
    --blue-bg:#3f4e61;
}

/* **************************************** *
 * GLOBAL
 * **************************************** */
 html { font-size: 6.25%; }
 html.safari.desktop { font-size: .06215040397762585vw; }
 
 body {position:relative; overflow-x: hidden;overflow-y: scroll;font-family: 'Noto-sans', sans-serif;font-size: 16rem;word-break: keep-all;color: var(--basic-text-color); letter-spacing: -0.02em;}
 body.dark-mode {background:#16191a}
 a {color: var(--basic-text-color);text-decoration: none;}
 [lang="en"] { font-family: 'Montserrat', sans-serif; letter-spacing:0;}

/*   *:focus { outline: 3px solid #000; outline-offset: 2px;} */

 /* WRAP */
 .wrap { max-width: 1440rem; margin: 0 auto; position: relative; }
 .page-home .wrap { max-width: 1440rem; }
 .wrap-middle { max-width: 860rem; margin: 0 auto; position: relative; }
 .wrap-narrow { max-width: 640rem; margin: 0 auto; position: relative; }

 .global-overlay {display:none; position: fixed;left: 0;top: 0;height: 100%;width: 100%;background: #000;background: rgba(0, 0, 0, .6);-webkit-transition: opacity 100ms;transition: opacity 100ms;-webkit-transition-delay: 0ms;transition-delay: 0ms;}
    

/* DARK MODE */
.dark-mode-switch {position: absolute;right: 0;display: flex;top: 13rem;padding-left: 26rem;}
.dark-mode-switch:before {font-family:'bluewave';content:'\e92e';font-style:normal;font-size: 18rem;color:#A0A0A0;position:absolute;left:0;top:50%;transform:translateY(-50%);}
.btn-dark-mode-switch {position:relative;top: 0;width: 36rem;height: 22rem;background-color:#A0A0A0;border: none;border-radius: 20rem;cursor: pointer;transition: background-color 0.3s ease;}
.btn-dark-mode-switch:after {content: "";position: absolute;top: 2rem;left: 2rem;width: 17rem;height: 17rem;background-color:#fff;border-radius: 50%;transition: transform 0.3s ease;}
.dark-mode-switch.active .btn-dark-mode-switch {background:transparent linear-gradient(104deg, #72BE59 0%, #009E9A 48%, #004EA1 100%) 0% 0% no-repeat padding-box;}
.dark-mode-switch.active .btn-dark-mode-switch:after {content: "";background-color: #fff;transform: translateX(14rem);}
.page-home .dark-mode-switch:before {color:var(--white-gray-text-color);}
.page-home.minimize .dark-mode-switch:before {color:#A0A0A0;}
.page-home.minimize.dark-mode .dark-mode-switch:before {color:#fff;}
.page-home.all-menu-open .dark-mode-switch:before {color:var(--gray-text-color);}



 /* **************************************** *
 * HEADER
 * **************************************** */
#header {width: 100%;/*position: fixed;top: 0;left: 0;*/padding-top: 0;background:var(--body-bg);border-bottom: 1rem solid var(--border-color);z-index: 500;}

.btn-goback {display:none;}

/* LOGO */
.header-logo {position: absolute;left: 0;top: 10rem;width: 160rem;height: 30rem;}
.header-logo a {display: block;width: 100%;height: 100%;}
.header-logo a svg, .header-logo a img { display: block; width: 100%; height: 100%; }

.header-logo .logo-white {display:none;}
.header-logo .logo {display:block;}
.page-home .header-logo .logo {display:none;}
.page-home .header-logo .logo-white {display:block;}
[data-theme="dark"] .header-logo .logo-white, .page-home.dark-mode .header-logo .logo-white {display:none;}
[data-theme="dark"] .header-logo .logo, .page-home.dark-mode .header-logo .logo {display:block;}

/* MENU */
.header-menu {height:100%;padding-top: 20rem;}
.header-menu__inner {height:100%;}
.global-menu-nav__wrap {display: flex;align-items: center;margin-top: 23rem;}
.page-home .global-menu-nav__wrap {margin-top: 14rem;}
.global-menu-util {position: relative; height:100%;}
.global-menu-util > ul {display:flex; align-items: center;margin-left: auto;position: absolute;right: 90rem;top: 10rem;}
.global-menu-util > ul > li {position:relative;}
.global-menu-util > ul > li + li {margin-left:16rem;padding-left:16rem;}
.global-menu-util > ul > li + li:before {width:1rem; height:10rem; background:var(--border-color); content:''; display:block; position:absolute; left:0; top:50%; margin-top:-3rem;}
.global-menu-util > ul > li a {color:var(--gray-text-color); font-size:14rem;}
.global-menu-util > ul > li.global-alarm {padding-left:0;}
.global-menu-util > ul > li.global-alarm button {padding:0; border:none; background:none; cursor:pointer;}
.global-menu-util > ul > li.global-alarm button:after {font-family:'bluewave';content:'\e938';font-style:normal;font-size: 21rem;color:var(--gray-text-color);margin-top: 4rem;display: block;}
.global-menu-util > ul > li.global-alarm i {width: 16rem;height: 16rem;line-height: 15rem;font-style:normal;font-size: 9rem;font-weight: 600;color:#fff;background:#FF5858;border-radius:50%;display: block;position: absolute;right: -8rem;top: -5rem;}
.global-menu-util > ul > li.global-message {}
.global-menu-util > ul > li.global-message button {padding:0; border:none; background:none; cursor:pointer;}
.global-menu-util > ul > li.global-message button:after {font-family:'bluewave';content:'\e933';font-style:normal;font-size: 21rem;color:var(--gray-text-color);margin-top: 4rem;display: block;}
.global-menu-util > ul > li.global-message i {width: 16rem;height: 16rem;line-height: 15rem;font-style:normal;font-size: 9rem;font-weight: 600;color:#fff;background:#FF5858;border-radius:50%;display: block;position: absolute;right: -8rem;top: -5rem;}
.global-menu-util > ul > li.global-zoom {padding-left:0;display: flex;align-items: center;justify-content: center;font-size:14rem;color:var(--gray-text-color);}
.global-menu-util > ul > li.global-zoom:before {display:none;}
.global-menu-util > ul > li.global-zoom > span {margin:0 5rem;}
.global-menu-util > ul > li.global-zoom > span > b {font-weight:normal;}
.global-menu-util > ul > li.global-zoom button {width:20rem;height:20rem;border:1rem solid var(--border-color);border-radius:50%;background:transparent;margin-top: 4rem;padding:0;cursor:pointer;}
.global-menu-util > ul > li.global-zoom button:before {font-family:'bluewave'; font-size:16rem; font-weight:normal; color:var(--gray-text-color);}
.global-menu-util > ul > li.global-zoom button.global-zoom--minus:before {content:'\e93b';}
.global-menu-util > ul > li.global-zoom button.global-zoom--plus:before {content:'\e93c';}
.page-home .global-menu-util > ul > li a {color:var(--white-gray-text-color);}
.page-home .global-menu-util > ul > li button:after {color:var(--white-gray-text-color)}
.page-home .global-menu-util > ul > li.global-zoom {color:var(--white-gray-text-color);}
.page-home .global-menu-util > ul > li.global-zoom button:before {color:var(--white-gray-text-color);}
.page-home .global-menu-util > ul > li.global-alarm i {border-color:#006E9E;}
[data-theme="dark"] .global-menu-util > ul > li.global-alarm i, .dark-mode.page-home .global-menu-util > ul > li.global-alarm i {border-color:#121212;}
.global-bluewave {display:block;}
.global-bluewave img {display:block;}

.menu-container { display: block; width: 100%; position: relative; font-size: 0; line-height: 1; text-align: center; z-index: 1; }
#menu {display: flex;font-size: 0;}
#menu a { display: block; line-height: 1.66; }

/* 1DEPTH */
#menu > li { display: inline-block; vertical-align: middle; position: relative; }
#menu > li > a {color: var(--menu-text-color);padding: 15rem 5rem 15rem;position: relative;font-size: 18rem;font-weight: 400;-webkit-transition: color .3s;transition: color .3s;}
#menu > li:last-child > a {padding-right:0;}
#menu > li > a > span {display: block;position: relative;padding: 0 8rem;}
#menu > li > a > span:after {content: '';display: block;width: 100%;height: 3rem;position: absolute;bottom: -14rem;left: 0;background: #0084B5;opacity: 0;transition: opacity .3s;}
#menu > li.menu-children--open > a { color: #004EA1; }
html.desktop #header.header--menu-hover #menu > li.menu-children--open > a {color: var(--blue-text-color); }
html.desktop #menu > li > a:hover {color: var(--blue-text-color);}
html.desktop #menu > li > a:hover > span:after {opacity:1}
#menu > li.active > a {color: var(--blue-text-color);font-weight:600;}
#menu > li.active > a > span:after {opacity:1;}
/*.page-home #menu > li > a {padding: 24rem 20rem;}*/
.page-home #menu > li > a {padding: 24rem 5rem;}
.page-home #menu > li > a > span:after {opacity:0;}

/* MOB MAIN MENU */
.mob-global-menu {display:none;}

/* SEARCH */
.global-search {display:none;}


/* GLOBAL ALL MENU */
.menu-bg {width:100%;height:100%;}
.menu-bg__title {position: absolute;left:0;width: 22.3%;height:100%;background:var(--header-menu-tit-bg);overflow: hidden;}
.menu-bg__title:before {content:'';display:block;position:absolute;right: -15rem;bottom: 0;width: 289rem;height: 311rem;background:url(../images/layout/header-bg-object.svg) no-repeat center;opacity: 0.45;}
.menu-bg__title p {font-size:32rem;font-weight:600;line-height: 1.4;color:#fff;padding:55rem 60rem;}

.mob-member, .mob-menu__bottom {display:none;}

.global-all-menu {display: block;position: relative;background:none;border:none;padding: 0;padding-left: 30rem; margin-right:30rem; font-size:18rem;color: var(--black-text-color);cursor: pointer;-webkit-transition: top .3s, transform .3s;transition: top .3s, transform .3s;}
.global-all-menu-btn {background: var(--black-text-color);content: '';display: block;height: 2rem;position: absolute;left: 0;top: 50%;transition: background ease .3s, top ease .3s .3s, transform ease .3s;width: 18rem;margin: 0 auto;transform: translateY(-50%);}
.global-all-menu-btn:before {top: -6rem;}
.global-all-menu-btn:after {top: 6rem;}
.global-all-menu-btn:before, .global-all-menu-btn:after {background: var(--black-text-color);content: '';display: block;height: 2rem;position: absolute;transition: background ease .3s, top ease .3s .3s, transform ease .3s;width: 100%;}
.global-all-menu.active .global-all-menu-btn {background:transparent;}
.global-all-menu.active .global-all-menu-btn:before, .global-all-menu.active .global-all-menu-btn:after { top: 0; transition: top ease .3s, transform ease .3s .3s;}
.global-all-menu.active .global-all-menu-btn:before { transform: rotate(45deg);}
.global-all-menu.active .global-all-menu-btn:after { transform: rotate(-45deg);}

.page-home #menu > li > a {color:#fff;}
.page-home .global-all-menu {color:#fff;}
.page-home .global-all-menu-btn__line {background:var(--body-bg);}
.page-home .global-all-menu:not(.active) .global-all-menu-btn, .page-home .global-all-menu-btn:before, .page-home .global-all-menu-btn:after {background:#fff;}
html.desktop .page-home #menu > li > a:hover {color:#fff;}
html.desktop .page-home #menu > li > a:hover > span:after {opacity:0;}

.all-menu-popup {opacity:0;visibility:hidden;width: 100%;position: absolute;top: 196rem;left: 0;right: 0;background:var(--header-menu-bg);border-top: 1rem solid var(--border-color);box-shadow: 0 10rem 12rem rgba(0, 0, 0, .12);z-index: 9999;}
body.has-top-banner .all-menu-popup {top:212rem;}

.all-menu__list-wrap {display: flex;padding-left: 233rem;/* padding-left: 158rem; */padding-bottom: 30rem;}
.all-menu__list {font-size:0;}
.all-menu__list > li {display: inline-block;vertical-align: top;width: calc(33.33% - 48rem);max-width: 240rem;margin: 20rem 24rem;text-align: left;}
.all-menu__list > li > a {display: block;padding: 15rem 0;font-size: 18rem;font-weight:600;white-space: nowrap;color: var(--basic-text-color);border-bottom: 1rem solid #b1b1b1;}
.all-menu__list > li > a > span { display: inline-block; position: relative; }
.all-menu__list > li > a > span:after { content: ''; display: block; width: 100%; height: 1rem; position: absolute; left: 0; bottom: 1rem; background: #666; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform .4s cubic-bezier(0.22, 0.61, 0.36, 1); transition: -webkit-transform .4s cubic-bezier(0.22, 0.61, 0.36, 1); transition: transform .4s cubic-bezier(0.22, 0.61, 0.36, 1); transition: transform .4s cubic-bezier(0.22, 0.61, 0.36, 1), -webkit-transform .4s cubic-bezier(0.22, 0.61, 0.36, 1); }
.all-menu__list .all-menu__sub-menu {margin-top:16rem; margin-left:5rem;}
.all-menu__list .all-menu__sub-menu > li {position:relative;}
.all-menu__list .all-menu__sub-menu > li + li {margin-top: 8rem;}
.all-menu__list .all-menu__sub-menu > li > a {display:block;font-size:15rem;}
.all-menu__list .all-menu__sub-menu > li > ul {margin-top: 5rem;margin-left:5rem;margin-bottom: 14rem;}
.all-menu__list .all-menu__sub-menu > li > ul > li {position:relative; padding-left:8rem;}
.all-menu__list .all-menu__sub-menu > li > ul > li:before {width:4rem; height:1rem; background:var(--gray-text-color); content:''; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.all-menu__list .all-menu__sub-menu > li > ul > li + li {margin-top: 8rem;}
.all-menu__list .all-menu__sub-menu > li > ul > li > a {display:block;font-size:14rem; color:var(--gray-text-color);}
.all-menu__list .toggle-menu .all-menu__sub-menu > li.has-sub-menu > a {position:relative;}
.all-menu__list .toggle-menu .all-menu__sub-menu > li.has-sub-menu > a:after {width: 20rem;height: 20rem;line-height: 21rem;text-align: center;font-family:'bluewave';content:'\e91e';font-size: 15rem;font-weight:normal;color:#000;position: absolute;right: 0;top: 50%;margin-top: -10rem; -webkit-transition: -webkit-transform 0.4s; transition: -webkit-transform 0.4s; transition: transform 0.4s; transition: transform 0.4s, -webkit-transform 0.4s;}
.all-menu__list .toggle-menu .all-menu__sub-menu > li.has-sub-menu.menu-children--open > a:after {-webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg);}
.other-menu {margin-top:35rem;margin-left: auto;}
.other-menu li + li {margin-top:10rem;}
.other-menu li a {display:block;width: 280rem;padding:15rem 20rem;font-size:16rem;border:1rem solid #004EA1;border-radius:8rem;}
.other-menu li span {display: block;position: relative;padding-left: 32rem;}
.other-menu li span:before {content:'';display:block;background-repeat:no-repeat;background-position: center;width: 25rem;height: 20rem;position: absolute;left: 0;top: 50%;transform: translateY(-50%);}
.other-menu li span:after {font-family:'bluewave';content:'\e93d';font-weight:normal;font-size: 10rem;display:block;background-repeat:no-repeat;background-position: center;position: absolute;right: 0;top: 50%;transform: translateY(-50%);} 
.other-menu li.link-home span:before {background-image:url(../images/icon/icon-symbol.svg);background-size: 16rem auto;}
.other-menu li.link-survey span:before {background-image:url(../images/icon/icon-survey.svg);background-size: 100% auto;}
.other-menu li.link-petition span:before {background-image:url(../images/icon/icon-petition.svg);}
html.desktop .all-menu__list > li:hover > a {color:var(--blue-text-color); font-weight:500; border-bottom-color:var(--blue-text-color);}
html.desktop .all-menu__list .all-menu__sub-menu > li > a:hover {font-weight:500; text-decoration:underline;}
html.desktop .all-menu__list .all-menu__sub-menu > li > ul > li > a:hover {font-weight:500; text-decoration:underline;}
body.page-home .all-menu-popup { top:196rem;}
body.page-home.has-top-banner .all-menu-popup { top:218rem;}
body.page-home .all-menu__list-wrap {padding-left: 233rem;}

body.page-home.all-menu-open:before {background:var(--body-bg); }
body.page-home.all-menu-open .header-logo .logo-white {display:none; }
body.page-home.all-menu-open .header-logo .logo {display:block; }
body.page-home.all-menu-open .global-search-form__input {background:var(--btn-gray-bg); }
body.page-home.all-menu-open .popular-search li a {color:var(--gray-text-color); }
body.page-home.all-menu-open .global-menu-util > ul > li a {color:var(--gray-text-color); }
body.page-home.all-menu-open .global-menu-util > ul > li.global-zoom {color:var(--gray-text-color); }
body.page-home.all-menu-open .global-menu-util > ul > li.global-zoom button:before {color:var(--gray-text-color); }
body.page-home.all-menu-open .global-menu-util > ul > li button:after {color:var(--gray-text-color); }
body.page-home.all-menu-open .global-all-menu {color: var(--basic-text-color); }
body.page-home.all-menu-open #menu > li > a {color: var(--basic-text-color); }
body.page-home.all-menu-open #menu > li > a:hover {color: #0084B5; }
body.page-home.all-menu-open #menu > li > a:hover > span:after {opacity: 1;}
body.page-home.all-menu-open .global-all-menu-btn:before, body.page-home.all-menu-open .global-all-menu-btn:after{background: var(--basic-text-color); }
body.page-home.all-menu-open .etc-link a {color:var(--gray-text-color); }


body.all-menu-open .all-menu-popup {opacity:1; visibility:visible; }
body.all-menu-open .all-menu-popup .all-menu-bg {opacity:1; visibility:visible; }
body.all-menu-open .menu-overlay { opacity:1;-webkit-transition: opacity .3s;transition: opacity .3s; top: 0; left: 0; right: 0;  height: 100vh;}


/* MOBILE */
#small-menu-btn, #small-menu-container, .small-menu__top { display: none; }


/* TOP BANNER */
.top-banner {position: relative;width:100%;top: 0;height: 60rem;background:#004EA1;font-size: 18rem;color: #fff;text-align: center;display: flex;align-items: center;justify-content: center;z-index:10;}
.top-banner a { display: flex; align-items: center; color: #fff; height: 100%; justify-content: center;}

.blinking{ -webkit-animation: blink 0.5s ease-in-out infinite alternate; -moz-animation: blink 0.5s ease-in-out infinite alternate; animation: blink 0.5s ease-in-out infinite alternate;}
@-webkit-keyframes blink{ 0% {opacity: 0;} 100% {opacity: 1;} }
@-moz-keyframes blink{ 0% {opacity: 0;} 100% {opacity: 1;} }
@keyframes blink{ 0% {opacity: 0;} 100% {opacity: 1;} }

/* GLOBAL SEARCH */
.global-search {position:relative;background:none;border:none;padding: 10rem;margin:0;cursor:pointer;}
.global-search:before {font-family:'bluewave';content:'\e914';font-style:normal;font-size: 21rem;color:var(--basic-text-color);}

#search-popup {display: none;}
.global-search-form {width: 420rem;margin: 0 auto; margin-left:26%; position: relative;margin-top: top;}
.global-search-form__input {width: 100%;height: 50rem;position: relative;background: var(--btn-gray-bg);border-radius: 30rem;}
.page-home .global-search-form__input {background:var(--btn-gray-bg);}
.global-search-field {font-size: 16rem;line-height: 1;color: var(--hover-text-color);}
.global-search-form input.global-search-field {display: block;width: 100%;height: 100%;padding: 0 50rem 0 28rem;position: relative;border: none;background: transparent;}
.global-search-field::-ms-clear {display: none;width: 0;height: 0;}
.global-search-submit {height: 100%;width: 70rem;padding: 0;position: absolute;right: 0;top: 0;background: none;border: none;cursor: pointer;}
.global-search-submit:after {display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;font-family: 'bluewave';content: '\e914';font-size: 21rem;line-height: 50rem;font-weight: normal;text-align: center;color: var(--basic-text-color);-webkit-transition: color 300ms;transition: color 300ms;-webkit-transition-delay: 0ms;transition-delay: 0ms;}
.popular-search {display: flex;margin-top: 10rem;}
.popular-search li + li {margin-left:10rem;}
.popular-search li a {display:block;border-radius:30rem;border: 1rem solid var(--border-color);padding: 5rem 12rem 6rem;font-size: 14rem;color: var(--gray-text-color);}
.page-home .popular-search li a {border-color:var(--border-color); color:var(--white-gray-text-color);}

/* ETC LINK */
.etc-link {display:flex; margin-left:auto; gap:10rem;}
.etc-link a {font-size:14rem; color:var(--gray-text-color); border:1rem solid var(--border-color); border-radius:6rem; padding:7rem 12rem 8rem;}
.page-home .etc-link a {color:var(--white-gray-text-color);}

/* **************************************** *
 * FOOTER
 * **************************************** */
#footer {width: 100%;position: relative;}
.footer-top {padding: 18rem 0 20rem;border-top:1rem solid var(--border-color);border-bottom:1rem solid var(--border-color); background:var(--body-bg);}
.footer-top .wrap {display:flex;}
.footer-menu {display:flex;align-items: center;}
.footer-menu li a {position: relative;padding: 0 36rem;display: block;color: var(--basic-text-color);}
.footer-menu li:first-child a {padding-left:0}
.footer-sns {margin-left:auto;display: flex;}
.footer-sns__mob {display:none;}
.footer-sns__item {position:relative;width: 34rem;height: 34rem;border-radius:50%;}
.footer-sns__item + .footer-sns__item {margin-left: 16rem;}
.footer-sns__item a {display:block;width: 100%;height: 100%; }
.footer-sns__item.sns-blog {background-color: #32A94A;}
.footer-sns__item.sns-facebook {background-color: #576CA7;} 
.footer-sns__item.sns-twitter {background-color: #6BAFF8;} 
.footer-sns__item.sns-instagram {background:transparent linear-gradient(135deg, #FAE100 0%, #FCB720 15%, #FF7950 30%, #FF1C74 50%, #6C1CD1 100%) 0% 0% no-repeat padding-box;}
.footer-sns__item.sns-kakao {background-color: #EED63D;}
.footer-sns__item.sns-youtube {background-color: #FF0000;}
.footer-sns__item.sns-blog {background-color: #32A94A;}
.footer-sns__item.sns-daily-minjoo{border:1rem solid #f5f5f5;}
.footer-sns__item a:before {font-family:'bluewave';font-style:normal;font-size: 18rem;color: #fff;position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.footer-sns__item.sns-blog a:before {content:'\e915';}
.footer-sns__item.sns-facebook a:before {content:'\e919';}
.footer-sns__item.sns-twitter a:before {content:'\e91f';}
.footer-sns__item.sns-instagram a:before {content:'\e917';}
.footer-sns__item.sns-kakao a:before {content:'\e918'; color:#5D5050}
.footer-sns__item.sns-youtube a:before {content:'\e916';}
.footer-sns__item.sns-blog a:before {content:'\e915'; font-size:22rem;}
.footer-sns__item.sns-daily-minjoo a:before {content:'';background: url(../images/layout/daily-minjoo.png) no-repeat; background-size:100% 100%; width: 100%;height: 100%; border-radius: 50%;}

.footer-bottom {padding:65rem 0;background:var(--footer-bg);}
.footer-bottom__inner {display:flex;}
.footer-info {display:flex;}
.footer-info__text {font-size:16rem;color:var(--gray-text-color);margin-left: 42rem;}
.footer-info__text ul:after {clear:both;content:'';display: block;}
.footer-info__text .info-list {font-size:0;}
.footer-info__text .info-list li {display:inline-block;margin-right: 14rem;padding-right: 14rem; font-size:16rem; position:relative;}
.footer-info__text .info-list li + li {margin-top: 4rem;}
.footer-info__text .info-list li:nth-child(1) {display:block;}
.footer-info__text .info-list li:nth-child(3) {width:50%;}
.footer-info__text .info-list li:nth-child(5) {width:50%}
.footer-info__text .info-list li:after {width:1rem;height:8rem;background: #707070;content:'';display:block;position:absolute;top:50%;right:0;transform:translateY(-50%);}
.footer-info__text .info-list li:nth-child(odd):after {display:none;}
.footer-copyright {margin-top: 20rem;}
.footer-logo {width:188rem;height:30rem;}
.footer-logo img {display:block; max-width:100%;}

.footer-content {margin-left:auto;}

/* FOOTER FAMILY */
.footer-family {display:flex;margin: 0 -9rem;}
.footer-family__select {flex: 1;position: relative;width: 220rem;margin: 0 9rem;}
.footer-select__title {-webkit-transition: 0.3s;transition: 0.3s;cursor: pointer;background: var(--btn-bg);border:none;padding: 12rem 20rem 13rem;padding-right: 30rem;border: 1rem solid var(--border-color);border-radius: 30rem;width: 100%;font-size: 14rem;color: var(--basic-text-color);text-align: left;position:relative;display: block;}
.footer-select__title span {position: relative;width: auto;line-height: 30rem;display: block;position: absolute;right: 0;top: 50%;margin-top: -15rem;}
.footer-select__title-button:after {position:absolute;right: 15rem;font-family: 'bluewave';content: '\e91d';font-size: 16rem;color: var(--basic-text-color);border: none;-webkit-transition: -webkit-transform 0.4s;transition: -webkit-transform 0.4s;transition: transform 0.4s;transition: transform 0.4s, -webkit-transform 0.4s;will-change: transform;}
.footer-family__select .scrollbar-inner {padding-right:0;}
.footer-select__box {position: absolute;bottom: 50rem;left: 0;font-size: 14rem;width: 100%;background: var(--btn-bg);border: 1rem solid var(--border-color);border-radius: 20rem;opacity:0;visibility:hidden;z-index: 100;-webkit-transition:opacity .3s, visibility .3s;transition:opacity .3s, visibility .3s;}
.footer-select__box .nicescroll-rails.nicescroll-rails-vr {opacity: 0 !important;}
.footer-select__box ul li a {-webkit-transition: 0.3s;transition:0.3s;padding: 8rem 14rem;display: block;color: var(--gray-text-color);font-size:15rem;line-height: 1;}
.footer-select__box ul li:first-child a { padding-top: 0;}
.footer-family__select.footer-select--open .footer-select__title-button:after{-webkit-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg);}
.footer-family__select.footer-select--open .footer-select__box {opacity:1; visibility:visible;}
.footer-family .scroll-wrapper {height: 20vh;}
.footer-family .scroll-wrapper > .scroll-content {padding: 20rem 0 10rem;}

html.desktop .footer-select__box ul li a:hover { color:var(--hover-text-color);}

.footer-cs-qr {display:flex;margin-top: 34rem;}
.footer-cs-qr > div {flex: 1;width: 50%;margin: 0 9rem;}
.footer-cs > p {font-size: 12rem;}
.footer-cs > b {font-size: 28rem;font-weight: 600;margin-top: 4rem;display: block;}
.footer-cs > span {display:block; margin-top:5rem; font-size: 12rem;}
.footer-cs > a {display:block; margin-top:5rem; font-size: 12rem;}
.footer-cs > a span {position:relative;padding-right: 17rem;}
.footer-cs > a span:after {font-family: 'bluewave';content: '\e91c';font-size: 16rem;font-weight: normal;position: absolute;top:50%;right: 0;transform: translateY(-50%);}
.footer-cs-qr > div.footer-qr {margin-left: 30rem; margin-right: 0;}
.footer-qr a {display:flex;align-items: center;}
.footer-qr img {max-width:52rem;}
.footer-qr p {margin-left:8rem;}
.footer-qr p > b { display:block; font-size:15rem;}
.footer-qr p > span {display:block;font-size:13rem;color: var(--gray-text-deep-color);}

.bottom-menu {display:none; position: fixed;bottom: 0;width: 100%;background: #fff;z-index: 10; box-shadow:0 -3rem 10rem rgba(0,0,0,0.05)}
.bottom-menu ul {display:flex;}
.bottom-menu ul li {text-align: center;flex: 1 1 20%;}
.bottom-menu ul li span {position:relative; padding-top:23rem; display:block;}
.bottom-menu ul li span:before {font-family: 'bluewave'; font-size:20rem; font-weight:normal; position:absolute; top:0; left:50%; transform:translateX(-50%);}
.bottom-menu ul li a {display:block;padding: 10rem 0;font-size: 14rem;}
.bottom-menu ul li.bottom-menu--home span:before { content:'\e942';}
.bottom-menu ul li.bottom-menu--popular span:before { content:'\e911';}
.bottom-menu ul li.bottom-menu--my span:before { content:'\e940';}
.bottom-menu ul li.bottom-menu--survey span:before { content:'\e941';}
.bottom-menu ul li.bottom-menu--alarm span:before { content:'\e93e';}
.bottom-menu ul li.active span, .bottom-menu ul li.active span:before {color:#004EA1;}
body.dark-mode .bottom-menu {background:#1b1f24;}
body.dark-mode .bottom-menu ul li.active span, body.dark-mode .bottom-menu ul li.active span:before { color:#0084B5}


/* **************************************** *
 * CONTAINER
 * **************************************** */
#container {overflow:hidden;padding-top: 26rem;padding-bottom:100rem;background:var(--body-sub-bg);}