/* 여기부터 PC ******************************************************************************/
.gnb-container {
    position: relative;
    width: 100%;
    border-bottom: 1px solid var(--color-Graydc);
}
.gnb-container:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: '';
}
.gnb-container .logo {
    margin-left: 3%;
    float: left;
    height: 76px;
    line-height: 76px;
}
.gnb-container .logo img {
    height: 42px;
    cursor: pointer;
}
.gnb-container .gnb {
    float: right;
    display: inline-block;
}
.gnb-container .gnb > ul:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: '';
}
.gnb-container .gnb > ul > li {
    height: 76px;
    line-height: 76px;
}
.gnb-container .gnb > ul > li:nth-child(1) {
    float: left;
    margin: 0 30px 0 0;
}
.gnb-container .gnb a.link {
    float: left;
    display: inline-block;
    height: 100%;
    width: 120px;
    text-align: center;
}
.gnb-container .gnb a.link:hover {
    color: var(--color-Red);
}
.gnb-container .gnb > ul > li:nth-child(2) {
    padding: 0 50px;
    float: left;
    background: var(--color-Red);
}
.gnb-container .gnb > ul > li:nth-child(2) .login_top_btn {
    position: relative;
    margin-top: -3px;
    height: 100%;
    color: var(--color-white);
    border: none;
    background: none;
}
.gnb-container .gnb > ul > li:nth-child(2) span.en_font2 {
    color: var(--color-white);
    margin: 0 13px;
}

.mobile_login_btn {
    margin-top: 1em !important;
    border-top: 1px solid #e1e1e1;
    padding-top: 0.5em;
}
.mobile_login_btn > li {
    padding: 1em 1.5em;
}
.mobile_login_btn span {
    display: inline-block;
    margin: 0 15px;
}
.mobile_login_btn .login_top_btn {
    width: 100%;
    text-align: left;
    border: none;
    background: none;
    color: #812922;
}

@media (max-width: 980px) {
    .gnb-container .gnb > ul > li:nth-child(1) {
        margin: 0 15px 0 0;
    }
    .gnb-container .gnb a.link {
        /* width: 80px; */
    }
    .gnb-container .gnb > ul > li:nth-child(2) {
        padding: 0 20px;
    }
}
@media (max-width: 740px) {
    .gnb-container {
        display: none;
    }
}

/* 여기부터 Mobile ******************************************************************************/

.mobile_gnb_logo {
    position: fixed;
    z-index: 999;
    top: 7vw;
    left: 3vw;
    display: inline-block;
}
.mobile_gnb_sc-bto {
    top: 0vw;
    left: 0;
    opacity: 0;
}
#mobilemenu {
    display: none;
    position: fixed;
    top: 0;
    right: -100%;
    background-color: rgba(0, 0, 0, 0);
    width: 100%;
    height: 100%;
    display: block;
    z-index: 10;
    -webkit-transition: 0s;
    transition: 0s;
}
#mobilemenu.active {
    right: 0;
    background-color: rgba(0, 0, 0, 0.8);
}

#mobilemenu a {
    text-decoration: none;
}

#mobilemenu a:active,
#mobilemenu a:hover {
    text-decoration: none;
}

#mobilemenu .mobilemenu-wrapper {
    position: relative;
    z-index: 999999;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: #fff;
    /* overflow-y: scroll;  mobile 에서 처리 할 것 */
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
#mobilemenu.active .mobilemenu-wrapper {
    right: 0%;
}
#mobilemenu .mobilemenu-wrapper .mobile-gnb {
    position: absolute;
    left: 15px;
    top: 20px;
    z-index: 2;
}
#mobilemenu .mobilemenu-wrapper .mobile-gnb a {
    display: inline-block;
}
#mobilemenu .mobilemenu-wrapper .mobile-gnb img {
    height: 40px;
}
#mobilemenu .mobilemenu-wrapper .mobilemenu-trigger {
    position: fixed; /* fixed */
    opacity: 1;
    top: 0;
    right: 0;
    width: 50px;
    height: 47px;
    line-height: 47px;
    z-index: 9999;
    cursor: pointer;
}
#mobilemenu .mobilemenu-wrapper .mobilemenu-trigger {
    display: none;
}

#mobilemenu .mobilemenu-wrapper .mobilemenu-trigger button {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: var(--color-Red);
}

#mobilemenu .mobilemenu-wrapper .mobilemenu-trigger button span.box {
    display: block;
    position: absolute;
    width: 26px;
    height: 26px;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}

#mobilemenu .mobilemenu-wrapper .mobilemenu-trigger button span.box span.bar {
    right: 0;
    width: 100%;
    height: 2px;
    position: absolute;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border-radius: 3px;
}
#mobilemenu span.bar {
    background-color: var(--color-black);
}
#mobilemenu span.bar {
    background-color: var(--color-white);
}

#mobilemenu span.bar.top {
    top: 2px;
}

#mobilemenu span.bar.middle {
    top: 50%;
    margin: -1px 0 0;
}

#mobilemenu
    .mobilemenu-wrapper
    .mobilemenu-trigger
    button
    span.box
    span.bar.bottom {
    bottom: 2px;
}

#mobilemenu
    .mobilemenu-wrapper
    .mobilemenu-trigger
    button.active
    span.box
    span.bar {
    width: 100% !important;
    background-color: var(--color-white);
}

#mobilemenu
    .mobilemenu-wrapper
    .mobilemenu-trigger
    button.active
    span.box
    span.bar.top {
    -webkit-transform: rotate(45deg) translate(8px, 7px);
    transform: rotate(45deg) translate(8px, 7px);
    top: 0;
}

#mobilemenu
    .mobilemenu-wrapper
    .mobilemenu-trigger
    button.active
    span.box
    span.bar.middle {
    opacity: 0;
}

#mobilemenu
    .mobilemenu-wrapper
    .mobilemenu-trigger
    button.active
    span.box
    span.bar.bottom {
    -webkit-transform: rotate(-45deg) translate(8px, -7px);
    transform: rotate(-45deg) translate(8px, -7px);
    bottom: 2px;
}

#mobilemenu .mobilemenu-wrapper .logo {
    background-color: white;
    padding: 70px 30px 20px;
}

#mobilemenu .mobilemenu-wrapper .logo img {
    width: 100%;
}

#mobilemenu .mobilemenu-wrapper .mobilemenu-view {
    position: relative;
    z-index: 1;
}
@media (max-width: 740px) {
    #mobilemenu .mobilemenu-wrapper .mobilemenu-trigger {
        display: inline-block;
    }
    .mobile_gnb_logo {
        top: 9.5vw;
    }
    .mobilemenu-top {
        top: 8vw;
    }
}
/*
@media (max-width: 520px) {
    .mobile_gnb_logo {
        top: 12vw;
        left: 3vw;
    }
    .mobile_gnb_logo img {
        width: 100px;
    }
    #mobilemenu .mobilemenu-wrapper .mobilemenu-trigger {
        top: 9vw;
    }
    #mobilemenu .mobilemenu-wrapper .mobilemenu-trigger button span.box {
        height: 25px;
    }
    #mobilemenu
        .mobilemenu-wrapper
        .mobilemenu-trigger
        button
        span.box
        span.bar {
        height: 3px;
    }

    #mobilemenu
        .mobilemenu-wrapper
        .mobilemenu-trigger
        button.active
        span.box
        span.bar.top {
        -webkit-transform: rotate(45deg) translate(7px, 7px);
        transform: rotate(45deg) translate(7px, 7px);
        top: 0;
    }
    #mobilemenu
        .mobilemenu-wrapper
        .mobilemenu-trigger
        button.active
        span.box
        span.bar.bottom {
        -webkit-transform: rotate(-45deg) translate(7px, -7px);
        transform: rotate(-45deg) translate(7px, -7px);
        bottom: 2px;
    }
}
*****************/
/*
*, *:before, *:after {
	border-radius: 0;
	box-sizing: border-box;
	font-weight: normal;
	margin: 0;
	outline: none;
	padding: 0;
}

.social {
	margin: 2em auto;
	overflow: hidden;
}

.github, .tweet {
	float: left;
}
*/

/* Required styles; changing these may break the menu */

.slinky-menu {
    padding-top: 80px;
    overflow: hidden;
    transform: translateZ(0);
    transition: all 300ms ease;
}

.slinky-menu > ul {
    left: 0;
    position: relative;
    transform: translateZ(0);
    transition: all 300ms ease;
}

.slinky-menu ul,
.slinky-menu li {
    list-style: none;
    margin: 0;
}

.slinky-menu ul {
    width: 100%;
}

.slinky-menu a {
    display: block;
}

.slinky-menu li ul {
    display: none;
    left: 100%;
    position: absolute;
    top: 0;
}

.slinky-menu .header {
    position: relative;
}

.slinky-menu h2 ~ a.back {
    left: 0;
    position: absolute;
    width: 100%;
    top: 0;
    padding: 2em;
}

/* Default theme */

.slinky-menu {
}

.slinky-menu h2 {
    color: #000;
    padding: 1.15em 1.5em;
}

.slinky-menu li {
    line-height: 1;
}

.slinky-menu a {
    border: none;
    color: #353535;
    padding: 1.5em;
}
/*
.slinky-menu a:hover {
	background: none;
}
*/
.slinky-menu a.next:after {
    content: '\276f';
    margin-left: 1em;
    float: right;
}

.slinky-menu a.back:before {
    content: '\276e';
    margin-right: 1em;
    float: left;
}
.gnb_left {
    position: absolute;
    top: 4.5vw;
    left: 5.5vw;
    display: inline-block;
    color: #353535;
    text-align: center;
}
.gnb_left a.next:before {
    content: '\276e';
    margin-right: 1em;
}

.slinky-menu .depth_2 {
    background: #f7f7f7;
}
.slinky-menu .depth_2 > li {
    padding-left: 8vw;
}

.slinky-menu .depth_3 {
    background: #ececec;
}
.slinky-menu .depth_3 > li {
    padding-left: 8vw;
}

/**/
.mobile_gnb_utility_link {
    margin-top: 0;
    padding-top: 5vw;
    border-top: 1px solid #ddd;
}
.mobile_gnb_utility_link a {
    display: inline-block;
    padding: 2.5vw 2vw 2.5vw 7vw;
    width: 100%;
}
.mobile_gnb_utility_link span.icon_blank {
    display: inline-block;
    margin-right: 10px;
    width: 20px;
    height: 17px;
    background: url('../img/icon_blank_off.png') no-repeat 0 0;
    background-size: cover;
}
.mobile_gnb_utility_link a:hover {
    color: #812922;
}
.mobile_gnb_utility_link a:hover span.icon_blank {
    background: url('../img/icon_blank_on.png') no-repeat 100% 0;
    background-size: cover;
}

.mobilemenu-bto {
    top: 0vw !important;
    right: 0 !important;
    background: #000;
}

.active .mobilemenu-bto {
    top: 5vw !important;
    right: 0 !important;
    background: #fff;
}

/* 특정 페이지 모바일 우측 메뉴  */
.mobilemenu-bto button span.mobile_box_in span.bar {
    background: #fff !important;
}
.active .mobilemenu-bto button span.mobile_box_in span.bar {
    background: #000 !important;
}