/* ********************************************* *
    header
* ********************************************* */
.mo_header{display: none;}

header{position: absolute; left: 0; top: 0; z-index: 99; width: 100%; height: 132px; }
.main-visual header{background-color: #00000060;}
.wrap header .logo{background-position: 0 0;}
/* header h1.logo{position: absolute; left: 0; top: 10px;} */
/* header .logo a{display: block; width: 300px;} */
header .logo a{display: block; }

header .logo a.logo-img{display: flex; align-items: center; justify-content: center; gap: 16px;}

/* 헤더 좌측 브랜드 로고만 투명 — right-logo(패밀리)는 표시 */
header .logo:not(.right-logo) a.logo-img,
header h1.logo:not(.right-logo) a.logo-img {
    opacity: 0 !important;
    /* keep layout slot so header doesn't jump; link still in DOM */
}

header .logo.right-logo a.logo-img,
header h1.logo.right-logo a.logo-img {
    opacity: 1 !important;
}

/* 뉴클락 */
header .logo a.logo-img span{cursor: pointer; display: block;  text-indent: -999999px; overflow: hidden; width: 80px; height: 100px; 
    background: url("/image/logo.png");  background-size: contain; background-repeat: no-repeat;}

/* 블라디 */
header .logo a.logo-img span{cursor: pointer; display: block;  text-indent: -999999px; overflow: hidden; width: 80px; height: 100px; 
      background: url("https://dla7jyqf0sx2z.cloudfront.net/static/image/logo2.png");  background-size: contain; background-repeat: no-repeat;}
  
header .logo.right-logo a.logo-img span{background-image: url("https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/170492313668251.png");}


.dis-i{display: inline;}

/* header .logo a img{left: 93px; top: 50%; transform: translateY(-50%); width: 270px;} */
header .logo a img{width: 250px;}

/* 블라디 > 훼미리로 수정0115, 복구시 하단 주석*/
header .right-logo a img{width: 350px;}

header .logo a img.color{display: none;}
.login header .logo a img.color{display: block;}
.login header .logo a img.white{display: none;}


header .header-title{ display: table-cell;  vertical-align: middle; padding-left: 20px;}
header .header-title .title1{font-size: 18px; letter-spacing: 2px;}
header .header-title .title1-1{font-size: 16px; font-weight: 300; letter-spacing: 3px;}
header .header-title .title2{font-weight: 400; font-size: 16px;}
header > div{height: 100%; display: flex; align-items: center; justify-content: space-between;}
/* .menuWrap{position: absolute; right: 0; top: 50px; text-align: right; } */
.menuWrap{display: flex; justify-content: center; align-items: center; flex-direction: column;}
.top_list{margin-bottom: 10px;}
/* .menuWrap .top_list{padding-bottom: 30px;} */
.menuWrap .top_list ul li{display: inline-block; vertical-align: top; font-weight: 600; text-transform: uppercase; color: #fff; padding-left: 28px; position: relative;}
.menuWrap .top_list ul li{font-size: 14px;}
.menuWrap ul li::before{position: absolute; left: 10px; border-radius: 100%; width: 3px; height: 3px; content: ""; top: 10px; background-color: #ddd;}
.menuWrap .top_list ul,.menuWrap .top_list .lng{display: inline-block;}
.menuWrap .top_list ul li>a{display: table-cell;}
.menuWrap a.lng-icon{width: 22px; height: 22px; display: block; position: relative; top: -2px;}
.menuWrap a.lng-icon img{width: 100%;}
.menuWrap a.lng-icon_b img{display: none;}
.menuWrap  ul.lang-list{position: absolute; left: 14px; border-radius: 5px; padding: 10px;  background-color: rgba(0,0,0,0.6); z-index: 10;}
.menuWrap ul.lang-list li{display: block; padding-left: 0;}
.menuWrap ul.lang-list li a{display: block;}
.menuWrap ul.lang-list li::before{display: none;}
.menuWrap ul li:nth-child(1)::before{display: none;}
.menuWrap ul li .lng-box{display: flex;}
.menuWrap ul li a.language{opacity: 0.5; position: relative; padding-right: 8px;}
.menuWrap ul li a.language::after{content: ""; width:1px; height: 5px; background-color: #fff; position: absolute; right: 2px; top: 8px;}
.menuWrap ul li a.language.on{opacity: 1;}
.menuWrap ul li a.language:last-child{padding-right: 0;}
.menuWrap ul li a.language:last-child::after{display: none;}
.menuWrap ul li a.language + a.language{margin-left: 4px;}
.menuWrap ul li a.language img{width: 30px;}
.menuWrap .mypage ul li.my_on::before{display: none;}


.menuWrap .bottom_list>ul>li{display: inline-block; vertical-align: top;  font-weight: 600; text-transform: uppercase; color: #fff; padding-left: 28px; position: relative;}
.menuWrap .bottom_list>ul>li:first-child{padding-left: 0;}
.menuWrap .bottom_list>ul>li>a{width: 100%; height: 100%; cursor: pointer; position: relative; display: block;}
.menuWrap .bottom_list>ul>li>a::before{content: ""; width: 0; height: 1px; background-color: #fff; position: absolute; bottom: 0; left: 0; transition: all .3s;}
.menuWrap .bottom_list>ul>li:hover a::before{width: 100%;}
.menuWrap .bottom_list .depth02 li::before{display: none;}
.bottom_list ul.depth02{transition: all .4s; opacity: 0;  padding: 0 20px; position: absolute; right: 0; height: 0;  overflow: hidden; background-color: rgba(0,0,0,0.4); }
.bottom_list ul.depth02 li{display: block; transition: all .3s; padding: 10px 0; line-height: 20px;}
.bottom_list ul.depth02 li a{font-size: 16px; font-weight: 400;  display: block; opacity: 0.7; width: 100%; height: 100%; transition: all .1s; color: #fff;}
:lang(ru) .bottom_list ul.depth02 li a{word-break: break-all;}
.bottom_list ul.depth02 li:hover a{opacity: 1;}
.bottom_list ul.depth02.dep-02{width: 200px;}
.bottom_list ul.depth02.dep-03{width: 140px;}
:lang(ru) .bottom_list ul.depth02.dep-03{width: 178px;}
.bottom_list ul.depth02.dep-04{width: 150px;}
.bottom_list ul.depth02.dep-05{width: 160px;}
:lang(ru) .bottom_list ul.depth02.dep-05{width: 174px;}
.bottom_list>ul>li:hover .depth02{ opacity: 1; height: auto; }


/* 모바일 */
.mo_header .logo a img.color{display: block;}
.mo_header .logo a img.white{display: none;}

/* #header .nav-open{display: none; z-index: 9999;  position: absolute; right: 16px; top: 40px; margin-top: -15px; width: 30px;  height: 30px;} */
#header .nav-open{display: none; right: 16px; top: 50%; transform: translateY(-50%); width: 30px;  height: 30px; position: absolute; z-index: 101;}
#header .nav-open .burger{position: absolute;  background-color: #2e2e2e; width:100%; height: 2px; display: block; left: 0; }
#header .nav-open .burger::before{position: absolute; content: ""; top: 10px; left: 0;}
#header .nav-open .burger::after{position: absolute; content: ""; bottom: 10px; left: 0;}
#header .nav-open .burger::before,#header .nav-open .burger::after{width: 100%; height: 2px; background-color: #2e2e2e; transition:all 0.3s ease-in-out; }
#header .nav-open.show .burger{background-color: #333;}
#header .nav-open.show .burger::before{position: absolute; content: ""; top:0; left: 0; transform: rotate(-45deg);background-color: #333}
#header .nav-open.show .burger::after{position: absolute; content: ""; bottom: 0; left: 0;  transform: rotate(45deg);background-color: #333}
/* #header .nav-open .burger.color{background-color: #143255;}
#header .nav-open .burger.color::before,#header .nav-open .burger.color::after{width: 100%; height: 2px; background-color: #143255; transition:all 0.1s ease-in-out; } */
#header .nav-open.show .burger.color{background-color: transparent}

.login #header .nav-open .burger{position: absolute;  background-color: #333; width:100%; height: 2px; display: block; left: 0; }
.login #header .nav-open .burger::before{position: absolute; content: ""; top: 10px; left: 0;}
.login #header .nav-open .burger::after{position: absolute; content: ""; bottom: 10px; left: 0;}
.login #header .nav-open .burger::before,.login #header .nav-open .burger::after{width: 100%; height: 2px; background-color: #333; transition:all 0.3s ease-in-out; }
.login #header .nav-open.show .burger{background-color: #333;}
.login #header .nav-open.show .burger::before{position: absolute; content: ""; top:0; left: 0; transform: rotate(-45deg);background-color: #333}
.login #header .nav-open.show .burger::after{position: absolute; content: ""; bottom: 0; left: 0;  transform: rotate(45deg);background-color: #333}
.login #header .nav-open.show .burger.color{background-color: transparent}
/* .login .menuWrap ul li::before{background-color:#333} */

.gnb>li>a{font-size: 24px; font-weight: 700; text-transform: uppercase;}
/* .gnb>li{padding-bottom: 30px;} */
.lang{padding:30px 0}
.lang li{font-size: 14px; cursor: pointer; float: left; padding-right: 15px; color: #bcbcbc;}
.lang li.on{color:#333}

.top-menu{padding-bottom: 20px;}
.top-menu li,.lang li{display: inline-block;}
.top-menu li{font-size: 16px; padding-right: 20px;}

.mo_header .menuWrap{width: 100%; opacity: 0; right: 0; visibility: hidden; transition: all .4s; position: fixed; padding: 50px; background-color: #fff; text-align: left; top: 0; height: 0; z-index: 100;}
.mo_header .menuWrap .inner{display: none;}
.mo_header .menuWrap nav .depth02{display: none;}
.mo_header .menuWrap nav .depth02 li{padding: 14px 20px;}
.mo_header .menuWrap .mo_lng-box{margin-bottom: 12px;}
.mo_header .menuWrap .mo_lng-box a img{width: 45px;}
.mo_header .menuWrap .mo_lng-box a + a{margin-left: 8px;}
.mo_header .menuWrap .mo_lng-box a.language{opacity: 0.4; position: relative; padding-right: 8px;}
.mo_header .menuWrap .mo_lng-box a.language:last-child::after{display: none;}
.mo_header .menuWrap .mo_lng-box a.language.on{opacity: 1;}
.mo_header .menuWrap .mo_lng-box a.language::after{content: ""; width:1px; height: 5px; background-color: #333; position: absolute; right: 2px; top: 9px;}



.gnb_li + .gnb_li{padding-top: 15px;}
.gnb li{padding-bottom: 10px;}
.shop-link_mo{padding: 15px 0 0 50px;display: block; width: 100%; color:#002c5f}

.menuWrap .depth03 li{width: 50%; float: left; }






/* ********************************************* *
   footer
* ********************************************* */
footer{width: 100%; border-top: 1px solid #ddd;}
footer .bd1440{height: 100%;}
footer .fo_logo{display: block; margin: 0 auto; text-align: center; padding: 30px 0 ;}
footer ul{text-align: center; padding-bottom: 30px;}
footer ul li{display: inline-block; padding: 0 30px; font-size: 14px; color: #333; position: relative;}
footer ul li::before{width: 1px; height: 14px; background-color: #a7a7a7; content: ""; position: absolute; left: 0; top: 3px; }
footer ul li:nth-child(1)::before{display: none;}
.footer_copy{text-align: center; padding: 6px 0; color:#a8a3a3; font-size: 13px; text-transform: uppercase;}
footer .rock{text-align: right;}
footer .footer-info{text-align: center; font-size: 13px; max-width: 960px; width: 100%; margin: 0 auto;}
footer .footer-info span{padding: 0 8px; display: inline-block;}
footer .footer-info span b{font-weight: bold;}
/* :lang(ru) footer .footer-info span b{font-weight: bold;} */
footer .bar{width: 100%; background-color: #eee; height: 1px; display: block; margin-bottom: 24px;}

/* ********************************************* *
    common banner
* ********************************************* */
.comm{position: relative; width: 100%;}
.comm .bd1440{height: 100%;}
.com_list{position: absolute; bottom: 20px; right: 0; text-align: right;}
.com_list li{display: inline-block; color:#fff; position: relative; font-size: 14px; opacity: 0.8; padding-left: 30px; font-weight: 600; text-transform: uppercase;}
.com_list li::before{content: "";width: 8px; height:8px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; position: absolute; left: 8px; top: 6px; transform:rotate(-45deg);}
.com_list li:nth-child(1)::before{display: none;}
.com_list li.nw{opacity: 1;}

.intro{height: 380px; background:url(https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/156555293981965.jpg) no-repeat;background-size: cover; background-position: 17%; }
.club{height: 380px; background:url(https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/156642136982295.jpg) no-repeat; background-size: cover;background-position:30%;}
.course_bg{height: 380px; background:url(https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/156642109613764.jpg) no-repeat;background-size: cover; background-position: 80% 100%;}
.offer{height: 380px; background:url(https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/156556569792018.jpg) no-repeat;background-size: cover; background-position: 48% 100%;}
/* .fa{height: 380px; background:url(https://dla7jyqf0sx2z.cloudfront.net/static/legacy-images/VLADIVOSTOK/156726696260615.jpg)no-repeat; background-size: cover;background-position: center;} */


/* 2025-01-10 */
header{height: max-content; padding: 16px 0;}
header > div{padding-right: 16px; padding-left: 16px;}
.main-visual header{background-color: #fff; border-bottom: 1px solid #eee;  position: relative; box-shadow: 0 0 10px rgba(0,0,0,.06);}
/* .menuWrap{order: 2; width: 100%; padding-top: 16px; margin-top: 16px; border-top: 1px solid #eee;} */
/* header > div{flex-wrap: wrap;}
.wrap header .logo{width: 50%;}
header .logo a.logo-img{width: 100%;} */
.main-visual header .menuWrap .top_list ul li, .main-visual header .menuWrap .bottom_list>ul>li{color: #333;}
.main-visual header .logo a img{display: none;}
.main-visual header .logo a img.color{display: block;}


/* ********************************************* *
 * 1700px max
 * ********************************************* */
 @media (max-width:1700px){

    .main-visual header{background-color: #fff; border-bottom: 1px solid #eee;}
    header > div{padding-right: 16px; padding-left: 16px;}
    .menuWrap{order: 2; width: 100%; padding-top: 16px; margin-top: 16px; border-top: 1px solid #eeeeee60; margin-right: -16px; margin-left: -16px;}
    .main-visual header .menuWrap{border-top: 1px solid #eee;}
    header > div{flex-wrap: wrap;}
    .wrap header .logo{width: 50%;}
    header .logo a.logo-img{width: 100%;}

 }



/* ********************************************* *
 * 1025px max
 * ********************************************* */
 @media (max-width:1440px){

    header > div{padding: 0 16px;}
    header .logo a{left: 16px;}
    .menuWrap,.com_list{right: 16px;}
}


/* ********************************************* *
 * 1025px max
 * ********************************************* */
 @media (min-width:1025px){

    
}

/* ********************************************* *
 * 1024px max
 * ********************************************* */
 @media (max-width:1024px){

    footer .rock{display: none;}
    .mo_header{display: block;}
    .pc_header{display: none;}

    footer .footer-info span{padding: 0;}

    .main-visual header{background-color: transparent; box-shadow: 0 0 10px rgba(0,0,0,.06);}

    /* 모바일 메뉴 */
    header{position: absolute; padding: 12px 0;}
    /* .wrap header .logo{width: 100%;} */

    header{position: relative; }
    header .logo a{width: 100%;}
    header .logo a.logo-img{width: max-content; gap: 10px;}
    header .logo a.logo-img span{width: 52px; height: 62px;}
    header .logo a img { width: 200px;}
    nav.gnb-area .depth01_Wrap{display: none;}
    #header .nav-open{display: block;}
    .menuWrap,#header .nav-open{display: block;}
    nav.gnb-area .top-gnb{display: none;}
    header{z-index: 99999;}
    header .logo a.logo-img span{position: relative; }
    
   /* 블라디 > 훼미리로 수정0115 */
    header .logo.right-logo a img{width: 252px;}

    .intro,.offer,.club,.course_bg,.offer,.fa{height: 200px;}

    header .header-title{text-align: center; padding-left: 14px;}
    header .header-title .title1{font-size: 13px; color:#666}
    header .header-title .title2{font-size: 12px; font-weight: 600;}
    
    .menuWrap{margin: 0;}

}


/* ********************************************* *
 * 768px max
 * ********************************************* */
 @media (max-width:768px){
    header .logo a.logo-img span{width: 40px; height: 51px; flex-shrink: 0;}
    /* header .logo a.logo-img im{width: 30vw; } */
    header .logo a img{width: 30vw;}

   /* 블라디 > 훼미리로 수정0115 */
    header .logo.right-logo a img{width: calc(30vw + 40px);}

 }


/* ********************************************* *
 * 500px max
 * ********************************************* */

 @media (max-width:500px){


    header .bd1440{padding: 0 10px;}

    header .logo a img{width: 180px;}

   
    footer ul li{padding: 0 8px;}
    footer ul.vl_list,footer .fo_logo{display: none;}
    footer .footer-info{text-align: left;}
    header.mo_header .logo{left: 10px;}
    #header .nav-open{right: 10px; width: 24px;}
    header .header-title .title2{font-size: 16px;}
    #header .nav-open .burger::before{top: 8px;}
    #header .nav-open .burger::after{bottom: 8px;}

    .mo_header .menuWrap{padding: 50px 20px;}
    header .logo a.logo-img span{ left: 0;}

    header .logo a.logo-img{}

    /* 0110 */
    header .logo a.logo-img{gap: 6px;}
    header .logo a.logo-img span{width: 34px; height: 45px; flex-shrink: 0;}
    /* header .logo a.logo-img im{width: 30vw; } */
    header .logo a img{width: 30vw;}

   /* 블라디 > 훼미리로 수정0115 */
   header .logo.right-logo a img{width: calc(30vw + 34px);}




}

/* ********************************************* *
 * 400px max
 * ********************************************* */
 @media (max-width: 400px){
    
    /* 0110 */
    header .logo a.logo-img span{width: 26px; height: 35px; flex-shrink: 0;}


}

/* ********************************************* *
 * 400px max
 * ********************************************* */
 @media (max-width: 350px){
    header .logo a img{width: 27vw;}

   /* 블라디 > 훼미리로 수정0115 */
   header .logo.right-logo a img{width: calc(27vw + 34px);}


 }