@charset "UTF-8";
.wrap{position: relative;overflow: hidden;}
main, .container{position: relative;}
/*header*/
#skipNav{position: absolute;top: -1000px;left: 0; width: 100%; height: 0;z-index: 1000;line-height: 0;font-size: 0;}
#skipNav a{display: block; text-align: center;width: 100%; line-height:0;font-size: 0;}
#skipNav a:hover, #skipNav a:focus, #skipNav a:active{position: absolute;top: 1000px;left: 0;padding: 16px 0;display: block;box-sizing: border-box;height: 36px;background: #666;color: #fff;font-size: 1.6rem;}

header{position: relative;width: 100%;height: 65px;padding: 0 0;background-color: #fff;}
header::after{display: none;position:absolute;top: 65px;left: 0;content: "";width: 100%;height: 190px;background-color: #fff;z-index: 1;border-top: 1px solid #dbdbdb;border-bottom: 1px solid #dbdbdb;z-index: 2;}
header.on::after{display: block;}
header .header_box{display: flex;align-items: center;width: 1350px;margin: 0 auto;height: 100%;}
header .logo{display: inline-block;background: url(../../images/multi_lng/common/logo.png) no-repeat center;width: 130px;height: 50px;margin-right: 0;background-size: 100%;}
header .nav_pc{height: 100%;flex-grow: 1;}
header nav{margin-right: 0;height: 100%;}
header nav .depth1_box{display: flex;gap: 5px;height: 100%;align-items: center;}
header nav .depth1_box li{position: relative;flex-grow: 1;text-align: center;}
/*독일어*/
.header_long .depth1_box li:nth-of-type(1){flex-basis: 18%;min-width: 18%;}
/*//독일어*/
header nav .depth1_box>li>a{display: inline-block;padding: 10px 0;font-size: 1.8rem;font-weight: 600;color: #000;height: 100%;}
header nav .depth2_box{display: none;position: absolute;top: 59px;left: 0;width: 100%;height: 190px;z-index: 3;}
header nav .depth2_box.on{display: block;}
header nav .depth2_box li{text-align: center;}
header nav .depth2_box li~li{}
header nav .depth2_box li a{display: inline-block;width: 100%;padding: 10px;word-break: keep-all;line-height: 18px;color: #000;font-size: 1.4rem;}
header nav .depth2_box li a:hover{background: #a57a44;color: #fff;}
header .right_box{}
header .right_box ul.list{position: relative;top: 8px;display: inline-block;margin-left: 10px;}
header .right_box ul.list > li{float: left;position: relative;}
header .right_box ul.list li a{padding: 0 5px 0 25px;color: #222;font-size: 1.4rem;background-position: 4px center;background-repeat: no-repeat;}
header .right_box ul.list li a.home{background-image: url(../../images/multi_lng/common/icon_home.png);}
header .right_box ul.list li .vodClick{background: url(../../images/multi_lng/common/icon_lngg.png) no-repeat 2px center;}
header .right_box ul.list li .vodClick::after{content: "";display: inline-block;background-image: url(../../images/eng/common/icon_select.gif ); background-repeat: no-repeat; background-position:center right;width: 21px;height: 10px;background-size: 13px;}
header .right_box ul.list li .vodClick[name="active"]::after{transform: rotate(180deg);background-position: center left;}
header .right_box ul.list li .vodList{position: absolute;top: 25px;left: 0;background: #fff;z-index: 5;width: 100%;border: 1px solid #999;/* border-top: 0 none; */}
header .right_box ul.list li .vodList a{display: block;padding: 5px 0;width: 100%;text-align: center;}
header .right_box ul.list li .vodList a:hover{background: #f3f3f3;}
header .right_box ul.list li .vodList{position: absolute;top: 25px;left: 0;background: #fff;z-index: 5;width: 100%;border: 1px solid #999;/* border-top: 0 none; */}
header .right_box ul.list li .vodList a{display: block;padding: 5px 0;width: 100%;text-align: center;}
header .right_box ul.list li .vodList a:hover{background: #f3f3f3;}
header .right_box ul.list li a.home{background-image: url(../../images/multi_lng/common/icon_home.png);}
header .btn_menu{display: none;width: 40px;height: 85px;font-size: 0px;border: none;border-radius: 0px;background-size: 30px 25px;background-repeat: no-repeat;background-position: right center;background-image: url(../../images/multi_lng/common/icon_gnb_open.png);}
#mobileGnb { display: none; }
footer{ padding:30px 0;background-color: #212939;}
footer .footer_box{display: flex;align-items: center; justify-content: space-between;width: 1300px;margin: 0 auto;}
footer .footer_box p br{display: none;}
footer .footer_box a{display: block; }
footer .footer_box a img{width: 130px; height: 50px;object-fit: contain;}
footer address{margin-left: -400px;font-size: 1.6rem; font-weight: 300;color: #fff;}

@media screen and (max-width:1600px){
    header{height: 100px;padding: 5px;}
    header::after{top: 100px;}
    header .header_box,
    footer .footer_box{width: 100%;justify-content: space-around}
    header nav .depth2_box{top: 74px;}
    header .logo,
    header nav{margin-right: 0;}
    footer address{margin: 0;}
}
@media screen and (max-width:1300px){
    header .logo{width: 150px;background-size: 100%;}
    header nav .depth1_box>li>a{}
    header nav .depth2_box li a{padding: 10px 0; font-size: 1.5rem;}
}
@media screen and (max-width:1200px){
    header .header_box{gap:20px}
    header .nav_pc{flex-grow: 1;}
    header nav .depth1_box{justify-content: space-evenly;}
    header .header_box > .right_box ul.list{display: block;margin: 0;}
    header .header_box > .right_box ul.list li a{padding: 0 20px 0 50px ;}
}

@media screen and (max-width:1280px){

}

@media screen and (max-width:1024px){
    header{height: 80px;padding: 5px 30px;}
    header .nav_pc,
    header .header_box > .right_box{display: none;}
    header .header_box{justify-content: space-between;}
    header .btn_menu{ display: inline-block; }
    #mobileGnb { position: fixed; inset: 0px; width: 100%; height: 100%; z-index: 9999; }
    #mobileGnb .gnb_content { position: absolute; top: 0px; right: -100%; bottom: 0px; width: 100%; height: 100%; background-color: rgb(255, 255, 255); overflow-y: auto; }
    #mobileGnb .gnb_content .gnbTop {position: relative;height: 80px;padding: 8px;border-bottom: 2px solid #a57a44;background: #a57a44;}
    #mobileGnb .gnb_content .logo{width: 100px;height: 50px;}
    #mobileGnb .gnb_content .right_box{display: flex;justify-items: center;align-items: center;flex-direction: column;gap: 5px;}
    #mobileGnb .gnb_content .right_box ul.list{top: 25px;margin: 0;}
    #mobileGnb .gnb_content .gnbTop .close {width: 54px;height: 85px;position: absolute;top: 0;right: 15px;font-size: 0px;background-repeat: no-repeat;background-position: center center;background-image: url(../../images/multi_lng/common/icon_gnb_close.png);background-size: 25px 25px;}
    #mobileGnb .gnb_content .gnb_list { padding: 10px; }
    #mobileGnb .gnb_content .gnb_list li { border-bottom: 1px solid rgb(238, 238, 238); }
    #mobileGnb .gnb_content .gnb_list ul li > a {position: relative;display: block;padding: 0px 5px;font-size: 1.8rem;font-weight: 500;color: rgb(34, 34, 34);height: 45px;line-height: 45px;text-align: left;border: 0 none;}
    #mobileGnb .gnb_content .gnb_list li .depthTit::after {position:absolute;right:25px;font-family: "remixicon";content: "\ea4e";top:50%;transform:translateY(-50%);transition:.3s;font-size:20px;}
    #mobileGnb .gnb_content .gnb_list li .depthTit.active::after {content: "\ea78";}
    #mobileGnb .gnb_content .gnb_list li .depth02 { display: none; padding: 0px 10px; margin: 0px 10px; border-top: 1px dashed rgb(238, 238, 238); }
    #mobileGnb .gnb_content .gnb_list li .depth02 li { border-bottom: none; margin-top: 9px; }
    #mobileGnb .gnb_content .gnb_list li .depth02 li:first-child { margin-top: 0px; }
    #mobileGnb .gnb_content .gnb_list li .depth02 li a{color: #555;font-weight: 400;}
    #mobileGnb .gnb_content .gnb_list li .depth02 li .btn {height: 40px;line-height: 39px;font-weight: 300; color: rgb(102, 102, 102); }
    header .sns-bx { padding-top: 5px; margin-right: 0px; }
}
@media screen and (max-width:764px){
    .header{position: fixed;top: 0;left: 0;z-index: 10;}
    header .btn_menu{display: inline-block;}
    footer .footer_box{flex-wrap:wrap;gap: 20px;}
footer .footer_box p br{display: block;}
    footer .footer_box p~p{margin-top: 5px;}
/*footer .footer_box a{width: 80px;}*/
    footer .footer_box a:first-of-type{order: 1;}
    footer .footer_box a:last-of-type{order: 2;}
    footer .footer_box >div{order: 3;}
    .container{margin-top: 80px;}
}

@media screen and (max-width:530px){
#mobileGnb .gnb_content .gnbTop{padding: 8px 0;}
    
    footer{padding: 20px;}

}
/*footer*/
