.max{max-width:1520px; margin: 0 auto !important;} /* 반응형 사이즈 지정해야함 */
/* 기본 색상 변수에 담기 */
*{margin:0; padding:0;}
img {width: 100%;}

/* -----side_btn----- */

.fixed_btn {position: fixed; right: 15px; bottom: 15px; z-index: 10; text-align: center; border-radius: 50%; border: 2px solid #ffb1a9; backdrop-filter: blur(10px); padding: 12px 10px; cursor: pointer;}

.fixed_btn p {color: #ffb1a9; font-weight: 600;}

/* -----header----- */

.ham_btn, .mobile_menu {display: none;}

.header {width: 100%; position: fixed; z-index: 10; transition: all 0.3s ease-in-out;}
.header::after {content: ""; position: absolute; left: 0; top: 100%; right: 0; height: 0; background-color: white; transition: all 0.3s ease-in-out; z-index: -1; width: 100%;}
.header.active::after {height: 200px;}
.header .header_inner {display: flex; justify-content: space-between; align-items: center;}
.header .header_logo {width: 130px;}
.header .header_logo > img {display: none;} 

.header:hover .header_logo > picture {display: none;}
.header:hover .header_logo > img {display: block;}

.header .logo_sec {display: flex; gap: 10px; align-items: center;}
.header .lnb  {width: 65%; }
.header .gnb {width: 20%;}
.header .lnb > ul {display: flex; justify-content: space-around;}
.header .lnb ul > li {float: left; text-align: center; font-size: 18px; padding: 30px 20px; color: white; position: relative; width: 20%;}
.header .lnb ul > li.main_m {border-bottom: 2px solid transparent; transition: all 0.3s;}
.header .lnb ul > li.main_m:hover {border-bottom: 2px solid #ffb1a9;}


.header.active::after .sub_m li {color: black;}
.header .lnb ul li .sub_m {position: absolute; left: 0; top: 100%; padding: 10px 0; width: 100%; display: none; height: 200px;}
.header .lnb ul li .sub_m li {width: 100%; padding: 10px 0;}
.header .lnb ul li .sub_m a {display: block; font-size: 16px; transition: all 0.3s;}
.header .lnb ul li .sub_m a:hover {color: #ffb1a9;}
.header .lnb ul li a {display: block; font-weight: 200;}

.header .gnb ul {display: flex; justify-content: flex-end;}
.header .gnb ul li {display: inline-block; padding: 0 10px; font-size: 1em; color: white; line-height: 34px;}
.header .gnb ul li:last-child {padding-right: 0;}
.header .gnb ul li a {font-weight: 200;}
.header.on .gnb a {font-weight: 500;}
/* .header.on {background-color: white;}
.header.on .lnb ul li a {color: black; font-weight: 500;}
.header.on .lnb ul li span {color:#9C9C9C; }
.header .gnb ul {display: flex; flex-wrap: nowrap;}
.header.on .gnb ul li {color: black;} */

.on {background-color: white;}
.on .lnb ul li.main_m > a {color: black; font-weight: 500;}
.on .gnb ul li {color: black;}

.on .header_logo > picture {display: none;}
.on .header_logo > img {display: block;}

.header:hover {background-color: white;}
.header:hover .lnb .main_m a {color: black; font-weight: 500;}
.header:hover .gnb a {color: black; font-weight: 500;}

.goog-te-gadget {font-size: 0 !important;}
.goog-te-gadget .goog-te-combo {margin: 0 !important;}
.header select {width: 100px; padding: 8px 16px; border-radius: 100px; border: 2px solid #ffb1a9; background: url(https://pomesoft-s3.s3.ap-northeast-2.amazonaws.com/pomesoft/_uploads/HADDY/publishing/167692951275946.png) no-repeat 90% 50% !important; background-size: 12px 8px !important;}

[lang="de"] .header .lnb ul > li {width: 30%;}
[lang="de"] .join .join_inner .join_box .gender_box h1 {font-size: 23px;}
[lang="de"] .join .join_inner .join_box .gender_box > span {font-size: 14px;}

[lang="sv"] .header .lnb ul > li {width: 30%;}

/* -----footer----- */

footer {margin-top: 100px;}
footer .footer_wrap {padding: 25px 0; font-size: 14px;}
footer .footer_wrap {display: flex; justify-content: space-between;}
footer .footer_wrap .footer_info ul {margin-bottom: 15px;}
footer .footer_wrap .footer_info ul li {display: inline-block; padding: 0 10px;}
footer .footer_wrap .footer_info ul li:first-child {padding-left: 0;}
footer .footer_wrap .footer_info ul li a {color: #535353;}

footer .footer_wrap .footer_info span {color: #9c9c9c; line-height: 1.9; font-weight: 300;}

footer .footer_wrap .footer_info .copy {margin-top: 15px;}
footer .footer_wrap .footer_info .footer_logo { display: inline-block;}

footer .footer_wrap .footer_sns {display: flex; flex-direction: column; justify-content: flex-end;}
footer .footer_wrap .footer_sns a {display: inline-block; margin-right: 15px;}
footer .footer_wrap .footer_sns a:last-child {margin-right: 0;}
footer .footer_wrap .footer_sns p {color: #9C9C9C; margin-bottom: 10px; font-weight: 300;}

.loading .loading_img {top: 50%; left: 50%; transform: translate(-50%,-50%); margin: 0; width: 7%;}


/* 구글번역 */
.VIpgJd-ZVi9od-ORHb-OEVmcd{
    display: none !important;
}
.VIpgJd-ZVi9od-l4eHX-hSRGPd {
    display: none !important;
}
body{
    top: 0 !important;
}
/* 구글번역 */

@media screen and (max-width: 1520px) {
    .max {max-width: 100% !important;}
    .header .lnb ul > li {padding: 25px;}
    .header .gnb {width: 15%;}

    footer .footer_wrap {padding: 20px 20px;}

}

@media screen and (max-width: 1250px) {
    .header .lnb ul li {font-size: 16px;}
    .header .lnb ul li .sub_m a {font-size: 14px;}
    .header .gnb ul li {font-size: 14px; padding: 0 7px;}

    .header select {width: 94px; padding: 6px 10px;}

    [lang="de"] .header .lnb ul > li {font-size: 16px;}
    [lang="sv"] .header .lnb ul li {font-size: 16px;}
    [lang="es"] .header .lnb ul li {font-size: 16px;}
    [lang="sv"] .header .lnb ul > li {width: 38%;}

}

@media screen and (max-width: 1050px) {

    /* .header .lnb ul > li {padding:0 10px;}
    .header .lnb ul > li {padding: 25px;}
    .header .gnb ul li {line-height: 30px;} */

    .header {background-color: white;}
    .header .header_inner {padding: 10px 20px !important;}
    .header .header_inner .header_logo {width: 120px;}
    .header .header_inner .lnb {display: none;}
    .header .header_inner .gnb {display: none;}
    .ham_btn, .mobile_menu {display: block;}

    .header .header_inner .ham_btn {font-size: 30px;}
    .header .header_inner .mobile_menu {position: absolute; width: 80%; height: 100vh; top: 0; background-color: white; right: -80%; transition: all 0.5s ease-in-out;}
    .header .header_inner .mobile_menu .m_lnb>ul>li>a {display: flex; width: 100%; justify-content: space-between; padding: 20px 20px; font-weight: bold;}
    .header .header_inner .mobile_menu .m_lnb>ul>li>a::after {content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 600; }
    .header .header_inner .mobile_menu .m_lnb>ul>li>.sub_menu {display: none;  background-color: #f1f1f1;}
    

    .header .header_inner .mobile_menu .m_gnb {border-bottom: 1px solid #eee; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
    .header .header_inner .mobile_menu .m_gnb i {font-size: 25px;}
    .header .header_inner .mobile_menu .m_gnb ul {display: flex; }
    .header .header_inner .mobile_menu .m_gnb {padding: 30px 20px;}
    .header .header_inner .mobile_menu .m_gnb ul li a {padding: 15px; box-sizing: border-box; background-color: #85C1FF; border-radius: 20px; font-size: 14px; margin-right: 20px; color: white;}

    .header .header_inner .mobile_menu .m_lnb>ul>li {font-size: 18px; }
    .header .header_inner .mobile_menu .m_lnb ul li ul li {font-size: 16px; text-indent: 40px; }
    .header .header_inner .mobile_menu .m_lnb ul li ul li a {display: block; padding: 20px 0; font-weight: 400;}


    [lang="ru"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="ru"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="ru"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="ms"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="ms"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="ms"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="vi"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="vi"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="vi"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="sv"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="sv"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="sv"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="es"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="es"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="es"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    footer .footer_wrap {flex-direction: column;}
    footer .footer_sns {margin-top: 20px;}
}

@media screen and (max-width: 890px) {
    
    footer {margin-top: 80px;} 

    [lang="de"] .join .join_inner .join_box .gender_box h1 {font-size: 20px;}
    [lang="de"] .header .header_inner .mobile_menu .m_gnb ul li a {font-size: 12px; margin-right: 5px;}

    [lang="id"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="id"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="id"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="kk"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="kk"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="kk"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="pt"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="pt"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="pt"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="pl"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="pl"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="pl"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="fr"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="fr"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="fr"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="hi"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="hi"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="hi"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

}

@media screen and (max-width: 420px) {
    footer .footer_wrap .footer_info ul li a {font-size: 13px;}
    footer .footer_wrap .footer_info ul li {padding: 0 2px;}
    footer .footer_wrap .footer_info span {font-size: 13px;}

    [lang="ar"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="ar"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="ar"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="en"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="en"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="en"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="uz"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="uz"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="uz"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    
    [lang="uk"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="uk"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="uk"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="id"] .header .header_inner .mobile_menu .m_gnb {padding: 30px 5px;}
    [lang="id"] .header .header_inner .mobile_menu .m_gnb ul li a {font-size: 12px;}

    [lang="km"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="km"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="km"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="th"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="th"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="th"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="tr"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="tr"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="tr"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}

    [lang="fa"] .header .header_inner .mobile_menu .m_gnb ul {width: 100%; flex-direction: column; gap: 30px;}
    [lang="fa"] .header .header_inner .mobile_menu .m_gnb {flex-direction: column-reverse; width: 100%;}
    [lang="fa"] .header .header_inner .mobile_menu .m_gnb i {width: 100%; text-align: right;}
}