/*
main
20251120-1
*/






#header-navbar-links > li.on > a,
.fixed #header-navbar-links > li.on > a {
    color: #000;
}


#header-navbar-utils li > a:hover,
.fixed #header-navbar-utils li > a:hover {
    color: var(--b24-blue);
}

.fixed #header-navbar-links > li > a > i {
    color: #000;
}
#header-navbar-links > li.on > a > i {
    color: var(--b24-blue);
}

/* #header-navbar-utils li > a:hover,
.fixed #header-navbar-utils li > a:hover {
    color: var(--b24-blue);
    color: #fff;
    font-weight: 800;
} */


.view_more {
    text-align: right;
    margin: 0;
}
.view_more a {
    display: inline-block;
    padding: 6px 1rem;
    background-color: #fff;
    color: var(--b24-bluebg-font);
    border: 1px solid var(--b24-blue4);
    font-size: 14px;
}




























#main-banner{
    position: relative;
    margin-top: 0;
}
#main-whole-banners{
    /* height: 500px; */
    height: 580px;
}
#main-whole-banners.swiper {
    /* overflow: visible; */

}



#main-whole-banners .swiper-pagination-bullet {
    background: #ffffff;
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);
}
#main-whole-banners .swiper-pagination-bullet-active {
    background: #3c84ff;
    opacity: 1;
}


.whole-banner-swiper-button-prev,
.whole-banner-swiper-button-next {
    position: absolute;
    z-index: 20;
    left: auto;
    bottom: -15px;
    top: auto;
    background-color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 5px #0000001a;
    display: flex;
    justify-content: center;
    align-items: center;
}
.whole-banner-swiper-button-prev { right: 60px; }
.whole-banner-swiper-button-next { right: 20px; }

.whole-banner-swiper-button-prev:after,
.whole-banner-swiper-button-next:after {
    display: inline-block;
    content: '';
    font-family: var(--font-awesome);
    font-size: 1rem;
    color: #000;
}

.whole-banner-swiper-button-prev:after{ content:'\f104'; }
.whole-banner-swiper-button-next:after{ content:'\f105'; }

.whole-banner {
    position: relative;
    width: 100%;
    height: 100%;
}
.whole-banner .img-c {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 100%;
    /* height: 0; */
    /* padding-bottom: calc(100vh - 60px + 34px); */
    overflow: hidden;
}
/* .whole-banner .img-c picture source, */
.whole-banner .img-c picture img {
    display: block;
    width: 100%;
    height: 580px;
    object-fit: cover;
    object-position: 50% 50%;
}

.whole-banner-txt-c {
    /* display: flex;
    flex-direction: column;
    position: absolute;
    left: 0;
    bottom: 2rem;
    padding: 1rem;
    z-index: 10;
    width: 100%;
    color: #fff; */

    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    /* align-items: flex-end; */
    /* justify-content: center; */

    margin: 0;
    padding: 0;
    width: 100%;
    height: calc(100% - var(--navbar-h) - 40px);
    /* max-width: 1200px; */
    max-width: var(--b-mwidth);

    position: absolute;
    bottom: auto;
    right: auto;
    z-index: 10;
    left: 50%;
    top: calc(var(--navbar-h) + 40px);
    transform: translate(-50%);

    color: #fff;
    padding: 3rem 1rem;
}
.whole-banner-txt-c a {
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
}
.whole-banner-txt-c .h-1 { align-items: flex-start; }
.whole-banner-txt-c .h-2 { align-items: center; }
.whole-banner-txt-c .h-3 { align-items: flex-end; }
.whole-banner-txt-c .v-1 { justify-content: flex-start; }
.whole-banner-txt-c .v-2 { justify-content: center; }
.whole-banner-txt-c .v-3 { justify-content: flex-end; }

.whole-banner-txt-c .hm-1 { align-items: flex-start; }
.whole-banner-txt-c .hm-2 { align-items: center; }
.whole-banner-txt-c .hm-3 { align-items: flex-end; }
.whole-banner-txt-c .vm-1 { justify-content: flex-start; }
.whole-banner-txt-c .vm-2 { justify-content: center; }
.whole-banner-txt-c .vm-3 { justify-content: flex-end; }



.whole-banner-txt-c h4,
.whole-banner-txt-c h1,
.whole-banner-txt-c h5 {
    display: flex;
    margin: 0;
    line-height: 130%;
    overflow: hidden;
    opacity: 0;
    word-break: keep-all;
}
.whole-banner-txt-c h4 {
    margin: 0 0 0 0;
    font-family: "gill-sans-nova", var(--font-family), sans-serif;
    letter-spacing: 0;
    font-size: 1.25rem;
}
.whole-banner-txt-c h5 {
    font-size: 1.1rem;
}
.whole-banner-txt-c h1 {
    margin: 0 0 0 0;
    font-size: 2rem;
    text-shadow: -1px 1px 3px #00000033;
    font-weight: 700;
}

@media (min-width:768px) {
    .whole-banner-txt-c h1 {
        font-size: 3rem;
    }
}

@media (min-width:992px) {
    .whole-banner-txt-c {
        padding: 6rem 2rem;
    }
    .whole-banner-txt-c h1 {
        font-size: 4rem;
    }

    .whole-banner-txt-c .hp-1 { align-items: flex-start !important; }
    .whole-banner-txt-c .hp-2 { align-items: center !important; }
    .whole-banner-txt-c .hp-3 { align-items: flex-end !important; }
    .whole-banner-txt-c .vp-1 { justify-content: flex-start !important; }
    .whole-banner-txt-c .vp-2 { justify-content: center !important; }
    .whole-banner-txt-c .vp-3 { justify-content: flex-end !important; }
}

.whole-banner-txt-c h5 {
    margin: 0 0 0 0;
    font-family: "gill-sans-nova", sans-serif;
    letter-spacing: 0;
}
.swiper-slide-active .whole-banner-txt-c h4,
.swiper-slide-active .whole-banner-txt-c h1,
.swiper-slide-active .whole-banner-txt-c h5 {
    opacity: 1;
}


.whole-banner-txt-c h4 .animate-c,
.whole-banner-txt-c h1 .animate-c,
.whole-banner-txt-c h5 .animate-c{
    display: inline-block;
    margin: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(15px);
    transition: none;
}

.whole-banner-txt-c .btn_detail {
    display: inline-block;
    margin: 15px 0 0 0;
    opacity: 0;
    border:2px solid #fff;
    background-color: transparent;
    padding: .5rem 1.2rem;
    border: 1px solid #fff;
    color: #fff;
}
.swiper-slide-active .whole-banner-txt-c h4 .animate-c {
    animation: rise-up 1s cubic-bezier(.26,.54,.32,1) .9s both;
    transform: translateY(0);
    font-weight: 400;
}
.swiper-slide-active .whole-banner-txt-c h1 .animate-c {
    animation: rise-up .8s cubic-bezier(.26,.54,.32,1) .3s both;
    transform: translateY(0);

}
.swiper-slide-active .whole-banner-txt-c h5 .animate-c {
    animation: rise-up 1s cubic-bezier(.26,.54,.32,1) 1.2s both;
    transform: translateY(0);
    font-weight: 400;
}
.swiper-slide-active .whole-banner-txt-c .btn_detail.animate-c {
    animation: fade-in 1.5s ease 1.5s both;
}

.whole-banner-logo {
    margin-top: 2rem;
}
.whole-banner-logo img {
    max-width: 300px;
    max-height: 100px;
}


@media (min-width:992px) {
    #main-whole-banners{
        height: 830px;
    }
    .whole-banner .img-c picture img {
        height: 830px;
    }

    .whole-banner-logo {
        position: absolute;
        margin: 0;
        padding: 0;
        width: 100%;
    }
    .whole-banner-logo img {
        display: inline-block;
        max-width: 400px;
        max-height: 120px;
    }
    /*
    h -> x
    v -> y
    */
    .whole-banner-logo.h-1.v-1{left:0;top:0;text-align:left;}
    .whole-banner-logo.h-1.v-2{left:0;top:50%;transform:translateY(-50%);text-align:left;}
    .whole-banner-logo.h-1.v-3{left:0;bottom:0;text-align:left;}
    .whole-banner-logo.h-2.v-1{left:0;top:0;text-align:center;}
    .whole-banner-logo.h-2.v-2{left:0;top:50%;transform:translateY(-50%);text-align:center;}
    .whole-banner-logo.h-2.v-3{left:0;bottom:0;text-align:center;}
    .whole-banner-logo.h-3.v-1{left:0;top:0;text-align:right;}
    .whole-banner-logo.h-3.v-2{left:0;top:50%;transform:translateY(-50%);text-align:right;}
    .whole-banner-logo.h-3.v-3 {left:0;bottom:0;text-align:right;}
}

@media (min-width: 1400px) {
    .whole-banner-swiper-button-prev,
    .whole-banner-swiper-button-next {
        bottom: -20px;
        width: 40px;
        height: 40px;
        border-radius: 20px;
    }
    .whole-banner-swiper-button-prev { right: 100px; }
    .whole-banner-swiper-button-next { right: 50px; }
}


.banner_bg_video {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.banner_bg_video_frame {
    flex: 1;
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 250%;
    height: 100%;
}

@media (min-width:992px) {
    .banner_bg_video_frame {
        width: 100vw;
        height: 56.25vw;
        min-height: 100vh;
        min-width: 177.77vh;
        position: absolute;
        bottom: 50%;
        left: 50%;
        z-index: 10;
        transform: translate(-50%, 0%);
        bottom: 0;
        left: 50%;
        top: auto;
    }
}


@media (min-width:2000px) {
    .banner_bg_video_frame {
        width: 100vw;
        height: 56.25vw;
        min-height: 100vh;
        min-width: 177.77vh;
        position: absolute;
        bottom: 50%;
        left: 50%;
        z-index: 10;
        transform: translate(-50%, -56%);
        bottom: auto;
        top: 50%;
        left: 50%;
    }
}


.vimeo-bg {
    --bg-h: 830px;
    
    position: relative;
    width: 100%;
    height: var(--bg-h);
    overflow: hidden;
    background: #000;
}

.vimeo-bg iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100vw, calc(var(--bg-h) * 16 / 9));
    height: max(var(--bg-h), calc(100vw * 9 / 16));
    transform: translate(-50%, -50%);
    border: 0;
    pointer-events: none;
}

@media (max-width: 768px) {
    .vimeo-bg {
        --bg-h: 580px;
    }
    .vimeo-bg {
        height: 580px;
    }
    .vimeo-bg iframe {
        width: max(100vw, calc(580px * 16 / 9));
        height: max(580px, calc(100vw * 9 / 16));
    }
    #vimeo-bg-5 iframe {
        /* 여기를 조절 — X값을 -50%보다 더 음수로 */
        transform: translate(-60%, -50%);
    }
}














































.fixed-banner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    min-height: 580px;
}
.fixed-banner:has(.banner_bg_video) {
    height: 700px;
}

.fixed-banner .banner_bg_video_frame {
    transform: translate(-50%, -50%);
    bottom: 0;
    left: 50%;
    top: 50%;
}

.fixed-banner .img-c {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 100%;
    /* height: 0; */
    /* padding-bottom: calc(100vh - 60px + 34px); */
    overflow: hidden;
}
/* .fixed-banner .img-c picture source, */
.fixed-banner .img-c .scroll-bg {
    background-color: var(--b24-blue2);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 580px;
}
@supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
    .fixed-banner .img-c .scroll-bg {
        background-attachment: scroll;
        background-position: 50% 50%;
        background-size: cover;
    }
}


.fixed-banner .img-c picture img {
    display: block;
    width: 100%;
    height: 580px;
    object-fit: cover;
    object-position: 50% 50%;
}

.fixed-banner-container {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 11;
    width: 100%;
    height: 100%;
    max-width: var(--b-mwidth);
    margin: 0;
}
.fixed-banner-txt-c {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    color: #fff;
    padding: 3rem 1rem;
    width: 100%;
    height: 100%;
}
.fixed-banner-txt-c a {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.fixed-banner-txt-c .h-1 { align-items: flex-start; }
.fixed-banner-txt-c .h-2 { align-items: center; }
.fixed-banner-txt-c .h-3 { align-items: flex-end; }
.fixed-banner-txt-c .v-1 { justify-content: flex-start; }
.fixed-banner-txt-c .v-2 { justify-content: center; }
.fixed-banner-txt-c .v-3 { justify-content: flex-end; }

.fixed-banner-txt-c .hm-1 { align-items: flex-start; }
.fixed-banner-txt-c .hm-2 { align-items: center; }
.fixed-banner-txt-c .hm-3 { align-items: flex-end; }
.fixed-banner-txt-c .vm-1 { justify-content: flex-start; }
.fixed-banner-txt-c .vm-2 { justify-content: center; }
.fixed-banner-txt-c .vm-3 { justify-content: flex-end; }


.fixed-banner-txt-c h4,
.fixed-banner-txt-c h1,
.fixed-banner-txt-c h5,
.fixed-banner-txt-c a {
    display: inline-flex;
    margin: 0;
    overflow: hidden;
    word-break: keep-all;
    /* opacity: 0; */
}
.fixed-banner-txt-c h4 {
    margin: 0 0 0 0;
    font-family: "gill-sans-nova", var(--font-family), sans-serif;
    letter-spacing: 0;
}
.fixed-banner-txt-c h1 {
    margin: 0 0 0 0;
    font-size: 2rem;
    text-shadow: -1px 1px 3px #00000033;
    font-weight: 700;
}

@media (min-width:768px) {
    .fixed-banner-txt-c h1 {
        font-size: 3rem;
    }
}

@media (min-width:992px) {
    .fixed-banner {
        height: 500px;
    }
    .fixed-banner-txt-c {
        /* bottom: 6rem; */
        padding: 6rem 2rem;
    }
    .fixed-banner-txt-c h1 {
        font-size: 4rem;
    }
}

@media (min-width: 1400px) {
    .fixed-banner .img-c picture img {
        object-position: 50% 70%;
    }
}

.fixed-banner-txt-c h5 {
    margin: 0 0 1rem 0;
    font-family: "gill-sans-nova", sans-serif;
    letter-spacing: 0;
}


.fixed-banner-txt-c h4 .animate-c,
.fixed-banner-txt-c h1 .animate-c,
.fixed-banner-txt-c h5 .animate-c{
    display: inline-block;
    margin: 0;
    overflow: hidden;
}

.fixed-banner-txt-c .btn_detail.animate-c {
    border:2px solid #fff;
    background-color: transparent;
    padding: .5rem 1.2rem;
    border: 1px solid #fff;
    color: #fff;
}




/* .fixed-banner-txt-c.active h4 .animate-c {
    animation: rise-up 1s cubic-bezier(.26,.54,.32,1) 1s both;
    transform: translateY(0);
    font-weight: 400;
}
.fixed-banner-txt-c.active h1 .animate-c {
    animation: rise-up .8s cubic-bezier(.26,.54,.32,1) .3s both;
    transform: translateY(0);

}
.fixed-banner-txt-c.active h5 .animate-c {
    animation: rise-up 1s cubic-bezier(.26,.54,.32,1) 1.2s both;
    transform: translateY(0);
    font-weight: 400;

}
.fixed-banner-txt-c.active a .animate-c {
    animation: fade-in 1.5s ease 1.5s both;
} */

.fixed-banner-logo {
    margin-top: 2rem;
}
.fixed-banner-logo img {
    max-height: 30px;
}

@media (min-width:992px) {
    .fixed-banner .img-c picture img {
        height: 500px;
    }
    .fixed-banner .img-c .scroll-bg {
        min-height: 500px;
    }
    .fixed-banner-txt-c .hp-1 { align-items: flex-start !important; }
    .fixed-banner-txt-c .hp-2 { align-items: center !important; }
    .fixed-banner-txt-c .hp-3 { align-items: flex-end !important; }
    .fixed-banner-txt-c .vp-1 { justify-content: flex-start !important; }
    .fixed-banner-txt-c .vp-2 { justify-content: center !important; }
    .fixed-banner-txt-c .vp-3 { justify-content: flex-end !important; }

    .fixed-banner-logo {
        position: absolute;
        margin: 0;
        padding: 0;
        width: 100%;
        max-height: 40px;
    }
    .fixed-banner-logo img {
        display: inline-block;
    }
    /*
    h -> x
    v -> y
    */
    .fixed-banner-logo.h-1.v-1{left:0;top:1rem;text-align:left;}
    .fixed-banner-logo.h-1.v-2{left:0;top:50%;transform:translateY(-50%);text-align:left;}
    .fixed-banner-logo.h-1.v-3{left:0;bottom:1rem;text-align:left;}
    .fixed-banner-logo.h-2.v-1{left:0;top:1rem;text-align:center;}
    .fixed-banner-logo.h-2.v-2{left:0;top:50%;transform:translateY(-50%);text-align:center;}
    .fixed-banner-logo.h-2.v-3{left:0;bottom:1rem;text-align:center;}
    .fixed-banner-logo.h-3.v-1{left:0;top:1rem;text-align:right;}
    .fixed-banner-logo.h-3.v-2{left:0;top:50%;transform:translateY(-50%);text-align:right;}
    .fixed-banner-logo.h-3.v-3 {left:0;bottom:1rem;text-align:right;}
}























@keyframes spin{
    0%{
    transform:rotate(0deg);
    }

    to{
    transform:rotate(360deg);
    }
}

@keyframes preloading{
    0%{   transform-origin:0% 50%; transform:scaleX(0); opacity:0; }
    40%{  transform-origin:0% 50%; transform:scaleX(1); opacity:1; }
    41%{  transform-origin:100% 50%; transform:scaleX(1); opacity:1; }
    to{ transform-origin:100% 50%; transform:scaleX(0); opacity:1; }
}

@keyframes slideshowBars{
    0%{ transform:translateX(-100%); }
    to{ transform:translateX(0); }
}

@keyframes grid-product__loading{
    0%{ opacity:1; }
    60%{ opacity:0; }
    to{ opacity:1; }
}

@keyframes shine{
    to{
    left:-200%;
    }
}

@keyframes overlay-on{
    0%{ opacity:0; }
    to{ opacity:0.6; }
}

@keyframes overlay-off{
    0%{ opacity:0.6; }
    to{ opacity:0; }
}

@keyframes full-overlay-on{
    0%{ opacity:0; }
    to{ opacity:1; }
}

@keyframes full-overlay-off{
    0%{ opacity:1; }
    to{ opacity:0; }
}

@keyframes modal-open{
    0%{
    opacity:0;
    transform:translateY(30px);
    }
    to{
    opacity:1;
    transform:translateY(0);
    }
}

@keyframes modal-closing{
    0%{
    opacity:1;
    transform:scale(1);
    }
    to{
    opacity:0;
    transform:scale(0.9);
    }
}

@keyframes rise-up{
    0%{
    opacity:1;
    transform:translateY(120%);
    }
    to{
    opacity:1;
    transform:translateY(0%);
    }
}

@keyframes rise-up-out{
    0%{
    opacity:1;
    transform:translateY(0%);
    }
    to{
    opacity:1;
    transform:translateY(-120%);
    }
}

@keyframes fade-in{
    0%{
    opacity:0;
    }
    to{
    opacity:1;
    }
}

@keyframes fade-out{
    0%{
    opacity:1;
    }
    to{
    opacity:0;
    }
}

@keyframes zoom-fade{
    0%{
    opacity:0;
    transform:scale(1.3);
    }
    to{
    opacity:1;
    transform:scale(1);
    }
}

@keyframes placeholder-shimmer{
    0%{
    background-position:-150% 0;
    }
    to{
    background-position:150% 0;
    }
}



.section_title {
}
.section_title h1 {
    font-size: 2.4rem;
    font-weight: 500;
    font-family: "brandon-grotesque", "gill-sans-nova", "Spoqa Han Sans Neo", "Noto Sans KR", sans-serif;
    letter-spacing: 0px;
    text-transform: uppercase;
}
@media (min-width:992px) {
    .section_title h1 {
        font-size: 4rem;
    }
}
.section_title h5 {
    font-weight: 300;
}

.section_txt {
    margin: 3rem 0;
}
.section_txt h1 {
    font-size: 4rem;
    font-weight: 500;
}
.section_txt h5 {
    font-weight: 200;
}

.section_txt ul {}
.section_txt ul li {}

#consulting_point {
    display: flex;
    /* align-items: center; */
    align-items: flex-end;
}
#consulting_point .section_title h1 {
    font-weight: 200;
    font-size: 2.8rem;
    letter-spacing: -1px;
}
#consulting_point hr {
    margin: 1.4rem auto;
}

#consulting_point li {}
#consulting_point li {
    display: flex;
}
#consulting_point li h4 {
    display: flex;
    font-size: 1.2rem;
    font-weight: 200;
}
#consulting_point li i {
    display: inline-block;
    width: 3.2rem;
    margin: 0;
    text-align: center;
    color: #eff7fd;
    font-size: 120%;
}

#consulting_point a {
    display: block;
    padding: 1rem;
    margin: 1rem auto 0 auto;
    max-width: 400px;
    text-align: center;
    border-bottom: 0;
    /* background-color: var(--b24-blue); */
    background-color: var(--consult);
    background: var(--consult-bg);
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
#consulting_point a:hover {
    border-bottom: 4px solid #fff;
    background-color: var(--b24-blue);
}
#consulting_point a:active {
    border-top: 4px solid #fff;
    border-bottom: 1px solid #0c377f;
}



#consulting_point a h4 {
    margin: 0;
    color: #fff;
    line-height: 160%;
}
#consulting_point a h4 i {
    display: inline-block;
    margin: 0 10px 0 0;
    color: #fff;
    text-align: center;
}


@media (min-width:1200px) {
    #consulting_point .section_title h1 {
        letter-spacing: -3px;
    }
    #consulting_point hr {
        margin: 1.8rem auto;
    }
    #consulting_point li h4 {
        font-size: 1.5rem;
    }
    #consulting_point li i {
        margin: 0 0 10px 0;
    }
    #consulting_point a {
        margin: 0;
        padding: 4.2rem 1rem;
        border-radius: 10px;
        border-bottom: 4px solid #fff;
    }

    #consulting_point a h4 i {
        display: block;
        margin: 0 auto 1rem auto;
        font-size: 4rem;
    }
}


#main-consulting {
    padding: 3rem 0;
    /* background-color: var(--b24-blue); */
    /* background-color: #0095dc; */
    color: #fff;
    /* background: var(--b24-blue2) url(/common/images/main202412/consult_mb_bg.webp) 50% 78% no-repeat; */
    background-color: var(--b24-blue2);
    background-image: url(/common/images/main202412/consult_mb_bg.webp);
    background-attachment: scroll;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

@supports (hanging-punctuation: first) and (font: -apple-system-body) and (-webkit-appearance: none) {
    #main-consulting {
        background-attachment: scroll;
        background-position: 50% 56%;
    }
}


#main-consulting .container {
    max-width: 1200px;
}
.anniversary_th {
    display: block;
    height: 50px;
    margin: 0;
    margin-bottom: 0;
}
@media (min-width:992px) {
    #main-consulting {
        margin: 0rem 0 6.5rem 0;
        padding: 7.5rem 0;
    }
    .anniversary_th {
        /* height: 200px; */
        /* margin: -200px auto 3rem auto; */
    }
}

.logo_c_100_bluebg {
    position: relative;
}
.logo_c_100_bluebg::after{
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    content: '';
    width: 100%;
    height: 14px;
    background-color: var(--b24-bluebg-font);
}
.logo_c_100_bluebg .blue24_logo_bluebg {
    display: block;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    height: 100px;
    background-color: #13469b;
}
.logo_c_100_bluebg .blue24_logo_bluebg g {
    fill: var(--b24-bluebg-font);
}




.logo_c_100_blue {
    position: relative;
}
.logo_c_100_blue::after{
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    content: '';
    width: 100%;
    height: 14px;
    background-color: var(--b24-blue);
}
.logo_c_100_blue .blue24_logo_blue {
    display: block;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    height: 100px;
    background-color: #ffffff;
}
.logo_c_100_blue .blue24_logo_blue g {
    fill: var(--b24-blue);
}



.logo_c_50_blue_w {
    position: relative;
}
.logo_c_50_blue_w::after {
    display: block;
    position: absolute;
    left: 0;
    top: 43px;
    z-index: 1;
    content: '';
    width: 100%;
    height: 7px;
    background-color: var(--b24-blue);
}
.logo_c_50_blue_w .logo_c_50_blue.right {
    display: flex;
    flex-direction: row-reverse;
}
.logo_c_50_blue .blue24_logo_blue {
    display: block;
    position: relative;
    z-index: 2;
    margin: 0;
    height: 50px;
    background-color: #ffffff;
}
.logo_c_50_blue .blue24_logo_blue g {
    fill: var(--b24-blue);
}




.logo_line_blue {
    position: relative;
}
.logo_line_blue::after {
    display: block;
    position: absolute;
    left: 0;
    top: 43px;
    z-index: 1;
    content: '';
    width: 100%;
    height: 7px;
    background-color: #fff;
}
.logo_line_blue .logo_c {
    display: flex;
    margin: 0 auto;
    max-width: var(--b-mwidth);
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-end;
    justify-content: space-between;
}
.logo_line_blue .logo_c.right {
    flex-direction: row-reverse;
}
.logo_line_blue .logo_c .logo_svg {
    display: block;
    position: relative;
    z-index: 2;
    margin: 0;
    height: 50px;
    background-color: var(--b24-blue);
}
.logo_line_blue .logo_c .logo_svg g {
    fill: #fff;
}



























.hr_logo_b {
    position: relative;
    margin: 3rem 0;
    text-align: center;
    overflow: hidden;
}
.hr_logo_b::after {
    display: block;
    position: absolute;
    left: 0;
    top: 17px;
    z-index: 1;
    content: '';
    width: 100%;
    height: 1px;
    background-color: var(--b24-blue-20);
}
.hr_logo_b .logo_svg {
    height: 20px;
    background-color: #fff;
    padding: 0 1rem;
    fill: #fff;
    position: relative;
    z-index: 2;
}
.hr_logo_b .logo_svg g {
    fill: var(--b24-blue);
}
.hr_logo_b .txt1 {
    margin: 14px 0 0 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--b24-blue-80);
    letter-spacing: -0.5px;
}
.hr_logo_b .txt2 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    position: relative;
    margin: 0 auto 0 auto;
    font-size: 10px;
    color: var(--b24-blue-40);
    letter-spacing: -0.5px;
    max-height: 50px;
}
.hr_logo_b .txt2::before,
.hr_logo_b .txt2::after {
    font-family: var(--font-awesome);
    width: 40px;
    font-size: 3rem;
    font-weight: 100;
    color: #e7e7e7;
}
.hr_logo_b .txt2::before {
    content: '\7b';
}
.hr_logo_b .txt2::after {
    content: '\7d';
}
/* .hr_logo_b .txt2 i {
    width: 50px;
    font-size: 3rem;
    color: #e7e7e7;
} */

@media (min-width:768px) {
    .hr_logo_b { margin: 7rem 0; }
    .hr_logo_b .logo_svg { height: 24px; }
    .hr_logo_b .txt1 { font-size: 18px }
    .hr_logo_b .txt2 { font-size: 12px }
}

@media (min-width:992px) {
    .hr_logo_b { margin: 7rem 0; }
    .hr_logo_b .logo_svg { height: 28px; }
    .hr_logo_b .txt1 { font-size: 20px }
    .hr_logo_b .txt2 { font-size: 12px }
}












#main-bestproducts {
    /* margin: 6rem 0; */
}
#main-bestproducts .container {
    position: relative;
}
#main-bestproducts .section_title {
    position: absolute;
    bottom: 1rem;
    z-index: 3;
    color: #fff;
    text-align: center;
    width: 100%;
}
#main-bestproducts .section_title h5{
    /* text-shadow: 1px 1px 0px #00000096; */
    font-weight: 300;
}
#main-bestproducts .section_title h1{
    /* text-shadow: 1px 1px 0px #00000096; */
    font-weight: 500;
}



.best_product_t1_el {}
.best_product_t1_el a {display:block;position:relative;}
.best_product_t1_el a .photo {position:relative;z-index:1;width:100%;height:0;padding-bottom:100%;overflow:hidden;}
.best_product_t1_el a .photo img {position: absolute;left: 0;top: 0;z-index: 1;width: 100%;height: 100%;object-fit: cover;object-position: center;}
.best_product_t1_el a .desc {
    position:absolute;left:0;top:0;z-index:2;padding:1rem;width:100%;color:#fff;
    background: #4d4d4d;
    background: linear-gradient(174deg, rgba(77, 77, 77, 1) 0%, rgba(255, 255, 255, 0) 52%);
}
.best_product_t1_el a .desc .subject {font-size: 1.2rem;font-weight:600}
.best_product_t1_el a .desc .schedule {}
.best_product_t1_el a .desc .price {}
.best_product_t1_el a .desc .detail {
    display: inline-block;
    margin: 10px 0 0 0;
    padding: 5px 20px;
    font-weight: 400;
    border: 1px solid #fff;
    color: #fff;
    font-size: 12px;
}


.best_product_t2_el {margin: 10px 0 0 0;}
.best_product_t2_el a {display:block;position:relative;}
.best_product_t2_el a .photo {position:relative;z-index:1;width:100%;height:0;padding-bottom:70%;overflow:hidden;}
.best_product_t2_el a .photo img {position:absolute;left:0;top:0;z-index:1;width: 100%;height: 100%;object-fit: cover;object-position: center;}
.best_product_t2_el a .desc {
    position: absolute;
    left: 0;
    top: auto;
    bottom: 0;
    z-index: 2;
    padding: 1rem;
    width: 100%;
    color: #fff;
    background: rgb(255, 255, 255);
    background: linear-gradient(346deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%);
}
.best_product_t2_el a .desc .subject {font-size: 1.2rem;font-weight:600}
.best_product_t2_el a .desc .schedule {}
.best_product_t2_el a .desc .price {font-weight:600px}
.best_product_t2_el a .desc .detail {
    display: inline-block;
    margin: 10px 0 0 0;
    padding: 5px 20px;
    font-weight: 400;
    border: 1px solid #fff;
    color: #fff;
    font-size: 12px;
}

@media (min-width:992px) {
    .best_product_t1_el a .desc {
        padding: 3rem;
    }
    .best_product_t2_el {
        margin: 0;
        border-left: 3px solid #fff;
        border-bottom: 3px solid #fff;
    }
    .best_product_t2_el a .photo {
        padding-bottom: 80%;
    }
    .best_product_t2_el a .desc {
        top: 0;
        bottom: auto;
        padding: 3rem;
    }
}


#best_product_t1 .swiper-pagination-bullet {
    background: #ffffff;
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);
}
#best_product_t1 .swiper-pagination-bullet-active {
    background: #3c84ff;
    opacity: 1;
}

#main-bestproducts .section_title.section_title_mobile {
    position: relative;
    bottom: auto;
}
#main-bestproducts .section_title.section_title_mobile h1 {
    font-family: "brandon-grotesque", sans-serif;
    font-weight: 700;
    color: var(--b24-darkblue);
}

@media (min-width:992px) {
    .best_product_t1_el a .photo {
        padding-bottom: 100%;
    }
    .best_product_t2_el a .photo {
        padding-bottom: 50%;
    }
}








.hr_logo_w {
    position: relative;
    margin: 3rem 0;
    text-align: center;
}
.hr_logo_w::after {
    display: block;
    position: absolute;
    left: 0;
    top: 17px;
    z-index: 1;
    content: '';
    width: 100%;
    height: 1px;
    background-color: #e9e9e9;
}
.hr_logo_w .logo_svg {
    padding: 0 1rem;
    height: 28px;
    background-color: #fff;
    fill: #fff;
    position: relative;
    z-index: 2;
}
.hr_logo_w .logo_svg g {
    fill: var(--b24-blue);
}
.hr_logo_w .txt1 {
    margin: 12px 0 0 0;
    font-size: 16px;
    font-weight: 500;
    color: #0c8cc9;
    letter-spacing: -0.5px;
}
.hr_logo_w .txt2 {
    margin: 10px 0 0 0;
    font-size: 12px;
    color: var(--b24-blue-40);
    letter-spacing: -0.5px;
}
@media (min-width:992px) {
    .hr_logo_w {
        margin: 7rem 0;
    }
    .hr_logo_w .txt1 {
        font-size: 20px;
    }
    .hr_logo_w .txt2 {
        font-size: 15px;
    }
}










#main-awards {}
#main-awards .container {
    background-color: #eeeeee5e;
    padding: 3rem 0;
}
#main-awards .section_title {
    text-align: center;
    margin: 0;
}
#main-awards .section_title h1 {
    font-family: "gill-sans-nova", sans-serif;
    font-size: 3.3rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: -2px;
    line-height: 1;
}
#main-awards .section_title h1 i {
    display: block;
    color: gold;
    border-radius: 50%;
    width: 80px;
    height: 60px;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
}
.awards {
    align-items: flex-end;
}
.awards-col {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    margin-bottom: 1rem;
}
.awards-col:last-child {
    margin-bottom: 0;
}

.awards-col h4 {
    display: inline-flex;
    margin: 2rem auto 0 auto;
    padding: 0 5px 5px 5px;
    border-bottom: 1px solid #e9e9e9;
    text-align: center;
    color: var(--b24-black);
    font-weight: 400;
}

ul.award-el {
    display: flex;
    justify-content: center;
    margin: 0 2.5rem 0 2.5rem;
}
@media (min-width:992px) {
    #main-awards .container {
        padding: 5rem 0;
    }
    ul.award-el {
        margin: 0 2.5rem 0 2.5rem;
    }

}
ul.award-el li {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 19%;
    min-height: 120px;
    text-align: center;
    
}

ul.award-el li .legend-amount {
    font-family: "gill-sans-nova", sans-serif;
    font-weight: 300;
    letter-spacing: 0;
}
ul.award-el li .legend-name {
    margin: 5px 0 0 0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
    font-size: 12px;
}
ul.award-el li .graph-bar {
    margin: 0 auto;
    width: 40px;
    box-shadow: 3px 3px 3px #90acff47;
    background-color: #eee;
    border: 1px solid #ffffff;
}
ul.award-el li .graph-style-1 {
    background-color: var(--b24-bluebg-font);
    background: url(/common/images/pattern/pt8.png) 0 0 repeat;
}
ul.award-el li .graph-style-2 {
    background-color: var(--b24-blue-80);
    background: url(/common/images/pattern/pt3.png) 0 0 repeat;
}
ul.award-el li .graph-style-3 {
    background-color: var(--b24-blue-60);
    background: url(/common/images/pattern/bush.webp) 0 0 repeat;
}
ul.award-el li .graph-style-4 {
    background-color: var(--b24-blue-40);
    background: url(/common/images/pattern/morocco-blue.png) 0 0 repeat;
}
ul.award-el li .graph-style-5 {
    background-color: var(--b24-blue-20);
    background: url(/common/images/pattern/halftone-yellow.webp) 0 0 repeat;
}
























#spain_islands {
    /* background: url('/common/images/main202412/w100_banner_bg1.webp') 50% 100% no-repeat;
    background-size: cover; */
    position: relative;
}


.bg-video {
    position: absolute;
    left: 0;
    /* top: 0; */
    z-index: -1;
    width: 100%;
    min-height: 500px;
    overflow: hidden;
    margin: 0px auto;

    bottom: 0;
    left: 50%;
    z-index: 10;
    transform: translate(-50%, 24%);
}

.bg-video_c {
    height: 100%;
    width: 100%;
    object-fit: cover;
}


.bg_video_wrap {
    /* min-width: 177.77vh; */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
}

.bg_video {
    width: 100vw;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 177.77vh;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
}





#family_travel {
    background: url('/common/images/main202412/banner_family_trip.webp') 50% 50% no-repeat;
    background-size: cover;
}

#family_travel .container1 {
    position: relative;
    min-height: 500px;
    z-index: 1;
}

#family_travel .banner_w100 .banner_txt {
    display: inline-block;
    position: absolute;
    top: auto;
    right: auto;
    bottom: 0;
    left: auto;
    z-index: 2;
    margin: 5%;
    width: 90%;
    max-width: auto;
    max-height: auto;
    padding: 1rem;
    /* padding: calc(var(--bs-gutter-x)* .5); */
    border: 1px solid #111;
    background: rgb(255, 255, 255);
    text-align: center;
    color: #000;
    /* background: linear-gradient(197deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%); */
    /* transform: translate(0%, -50%); */
    /* border-radius: 20px; */
    /* box-shadow: 1px 1px 0px #000; */
}
@media (min-width:992px) {
    #family_travel .banner_w100 .banner_txt {
        top: 3rem;
        right: 3rem;
        bottom: auto;
        left: auto;
        padding: 2rem;
        margin: 0;
        max-width: 390px;
        max-height: 227px;
        top: 50%;
        transform: translateY(-50%);
    }
}

#family_travel .banner_w100 .banner_txt h6,
#family_travel .banner_w100 .banner_txt h1,
#family_travel .banner_w100 .banner_txt h5 {
    color: #111;
}
#family_travel .banner_w100 .banner_txt .links {
    color: #111;
}
#family_travel .banner_w100 .banner_txt .links .link1,
#family_travel .banner_w100 .banner_txt .links .link2 {
    color: #111;
    border: 1px solid #111;
}



















#main-mid-banner{
    position: relative;
    margin-top: 0;
}
#main-mid-whole-banners{
    height: 480px;
}
#main-mid-whole-banners.swiper {
}



#main-mid-whole-banners .swiper-pagination-bullet {
    background: #ffffff;
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);
}
#main-mid-whole-banners .swiper-pagination-bullet-active {
    background: #3c84ff;
    opacity: 1;
}


.mid-whole-banner-swiper-button-prev,
.mid-whole-banner-swiper-button-next {
    position: absolute;
    z-index: 20;
    left: auto;
    bottom: -15px;
    top: auto;
    background-color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 5px #0000001a;
    display: flex;
    justify-content: center;
    align-items: center;
}
.mid-whole-banner-swiper-button-prev { right: 60px; }
.mid-whole-banner-swiper-button-next { right: 20px; }

.mid-whole-banner-swiper-button-prev:after,
.mid-whole-banner-swiper-button-next:after {
    display: inline-block;
    content: '';
    font-family: var(--font-awesome);
    font-size: 1rem;
    color: #000;
}

.mid-whole-banner-swiper-button-prev:after{ content:'\f104'; }
.mid-whole-banner-swiper-button-next:after{ content:'\f105'; }

.mid-whole-banner {
    position: relative;
    width: 100%;
    height: 100%;
}
.mid-whole-banner .img-c {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.mid-whole-banner .img-c picture img {
    display: block;
    width: 100%;
    height: 480px;
    object-fit: cover;
    object-position: 50% 50%;
}

@media (min-width:992px) {
    #main-mid-whole-banners{
        height: 600px;
    }
    .mid-whole-banner .img-c picture img {
        height: 600px;
    }
}

@media (min-width: 1400px) {
    .mid-whole-banner-swiper-button-prev,
    .mid-whole-banner-swiper-button-next {
        bottom: -20px;
        width: 40px;
        height: 40px;
        border-radius: 20px;
    }
    .mid-whole-banner-swiper-button-prev { right: 100px; }
    .mid-whole-banner-swiper-button-next { right: 50px; }
}


























#mcarthur_glen_coupon {
    background: url('/common/images/main202412/w100_banner_bg1.webp') 50% 100% no-repeat;
    background-size: cover;

}

.banner_w100 .container {
    position: relative;
    min-height: 500px;
    z-index: 1;
}
.banner_w100 .banner_txt {
    position: absolute;
    left: 0;
    bottom: 3rem;
    z-index: 2;
    padding: calc(var(--bs-gutter-x)* .5);
    background: rgb(255, 255, 255);
    background: linear-gradient(197deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%);
}


.banner_w100 .banner_txt h6 {
    margin: 0;
    font-family: "gill-sans-nova", sans-serif;
    font-weight: 500;
    color: #fff;
}

.banner_w100 .banner_txt h1 {
    font-family: "gill-sans-nova", sans-serif;
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
    /* text-shadow: 0 1px 0 #00000061; */
}
@media (min-width:992px) {
    .banner_w100 .banner_txt h1 {
        font-size: 3.3rem;
    }
}
.banner_w100 .banner_txt h5 {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    font-weight: 400;
    color: #fff;
}

.banner_w100 .banner_txt .links {}
.banner_w100 .banner_txt .links .link1,
.banner_w100 .banner_txt .links .link2 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 6px 0 0;
    padding: 1rem 2rem;
    font-size: 12px;
    border: 1px solid #111;
    color: #fff;
    border-color: #Fff;
    letter-spacing: .5px;
}














#main-newproducts {}
#main-newproducts .section_title {}
#main-newproducts .section_title h1 {
    display: inline-block;
    margin: 0;
    font-size: 3rem;
    font-weight: bold;
    font-family: "gill-sans-nova", sans-serif;
    letter-spacing: 0px;
    /* padding: 5px 1rem; */
    /* background-color: var(--b24-blue); */
    /* color: #fff; */
}
#main-newproducts .section_title h5 {
    color: var(--b24-black-60);
}
#main-newproducts .section_title h5::before {
    display: block;
    content: '\f86c';
    margin: 1rem 0;
    font-family: var(--font-awesome);
    font-size: 2rem;
    color: var(--b24-blue1);
}

.product-el {
    position: relative;
}
.product-el a {
    display: block;
    color: #fff;
}
.product-el .photo {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
}

.product-el .photo img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.product-el .txt {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    padding: 1rem;
    color: #fff;
    background: rgb(255, 255, 255);
    background: linear-gradient(327deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%);
}
@media (min-width:992px) {
    .product-el .txt {
        padding: 3rem;
    }
}
.product-el .txt .name {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
}
.product-el .txt .path {}
.product-el .txt .price {}
.product-el .txt .btn-link {
    display: inline-block;
    margin: 1rem 0 0 0;
    padding: 5px 0px;
    font-weight: 400;
    border: 1px solid #fff;
    color: #fff;
    font-size: .9rem;
    width: 85px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    background-color: transparent;
}















#main-reviews {}
#main-reviews .section_title {
    margin: 0 0 3rem 0;
    text-align: center;
}
#main-reviews .section_title h1{
    position: relative;
    font-family: "gill-sans-nova", sans-serif;
}
#main-reviews .section_title h1::after{
    display: block;
    content: '';
    margin: 1rem auto;
    width: 50px;
    height: 4px;
    background-color: var(--b24-bluebg-font);
}

#main-reviews .section_title h5{
    position: relative;
}


.review-el {
    display: block;
    /* grid-template-columns: repeat(24, 1fr); */
}
@media (min-width:992px) {
    .review-el {
        display: grid;
        grid-template-columns: repeat(24, 1fr);
    }
    #main-reviews .section_title h1::after{
        margin: 1rem auto 3rem auto;
    }
}
.review-el .photo {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 70%;
    grid-column: 1 / 16;
    grid-row: 1;
}

.review-el .photo img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.review-el .txt {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 1rem;
    z-index: 1;
    margin-top: -80px;
    margin-left: 5%;
    margin-bottom: 2rem;
    width: 90%;
    background-color: #fff;
    box-shadow: -2px -2px 4px #cbcbcb1c;
}
@media (min-width:992px) {
    .review-el .txt {
        position: relative;
        display: flex;
        grid-column: 11 / 25;
        grid-row: 1;
        margin-top: 2.4rem;
        margin-bottom: 0rem;
        padding: 0;
        z-index: 1;
        flex-direction: column;
        width: 100%;
        padding: 3rem;
        background-color: #fff;
        box-shadow: -2px -2px 4px #cbcbcb1c;
    }
}
.review-el .txt .subject {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
}
.review-el .txt .summary {}
.review-el .txt .writer {
    margin: 0 0 1rem 0;
    color: #7f7f7f;
}
.review-el .txt .btn-link {
    display: inline-block;
    margin: 2rem 0 0 0;
    padding: 5px 0px;
    font-weight: 400;
    border-bottom: 1px solid var(--b24-black);
    color: var(--b24-black);
    font-size: .9rem;
    width: 85px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
}











#main-hotel .section_title {
    margin-bottom: 2rem;
}
#main-hotel .view_more {
    margin:0 0 1rem 0;
    text-align: left;
}
#main-hotel .view_more a {

}

.hotel-el {
    position: relative;
}
.hotel-el .photo {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 130%;
}

.hotel-el .photo img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: none;
}

.hotel-el .txt {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    padding: 3rem;
    color: #fff;
    background: rgb(255, 255, 255);
    background: linear-gradient(327deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%);
}
.hotel-el .txt .name_en,
.hotel-el .txt .name_ko {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
    margin: 0;
}
.hotel-el .txt .grade {
    margin: 0 0 10px 0;
    color: gold;
}
.hotel-el .txt .desc {}
.hotel-el .txt .btn-link {
    display: inline-block;
    margin: 1rem 0 0 0;
    padding: 5px 0px;
    font-weight: 400;
    border: 1px solid #fff;
    color: #fff;
    font-size: .9rem;
    width: 85px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
}


#hotels_slider .swiper-pagination-bullet {
    background-color: #fff;
    /* opacity: var(--swiper-pagination-bullet-inactive-opacity, .4); */
}
#hotels_slider .swiper-pagination-bullet-active {
    background-color: var(--b24-blue);
}






.main_best_city{}
.main_best_city h3{display:inline-block;padding:5px;font-size:1rem;background-color:#1e6f51;color:#fff}
.main_best_city h4{}
.main_best_city h4 strong{}
.main_best_city h4 span{}
.main_best_city .photo{position:relative;width:100%;height:0px;padding-bottom:67%}
.main_best_city .photo img{position:absolute;left:0px;top:0px;width:100%;object-fit: contain;}
.main_best_city .conts{margin-top: 8px;}
.main_best_city .conts .tit{font-size:1.2rem;font-weight: bold;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;}
.main_best_city .conts .desc{}
.main_best_city .conts .goodsLink{margin:10px 0;display:inline-block;padding:5px 10px;background-color: #000;color:#fff;}







#main-community .section_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* margin-bottom: 10px; */
}

#main-community .section_title h2 {
    margin: 0;
    font-family: "gill-sans-nova", "Spoqa Han Sans Neo", "Noto Sans KR", sans-serif;
}
#main-community .section_title h2::after {
    display: block;
    content: '\f86c';
    margin: 1rem 0;
    font-family: var(--font-awesome);
    font-size: 1.3rem;
    color: var(--b24-blue1);
}

#main-community .view_more {
    margin:0;
    text-align: left;
}
#main-community .view_more a {

}

.blog-el {
    position: relative;
    margin-bottom: 2.5rem;
}
.blog-el .photo {
    position: relative;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 60%;
}

.blog-el .photo img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.blog-el .txt {
    position: relative;
    /* left: 0; */
    /* bottom: 0; */
    z-index: 2;
    margin: -5rem 2rem 0 2rem;
    padding: 3rem;
    border-bottom: 1px solid #d3d3d3;
    color: #000000;
    background: rgb(255, 255, 255);
    /* background: linear-gradient(327deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 0%) 50%, rgb(0 0 0 / 33%) 100%); */
}
.blog-el .txt .subject {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
    margin: 0 0 1rem 0;
}
.blog-el .txt .desc {}
.blog-el .txt .btn-link {
    display: inline-block;
    margin: 1rem 0 0 0;
    padding: 5px 0px;
    font-weight: 400;
    border-bottom: 1px solid var(--b24-black);
    color: var(--b24-black);
    font-size: .9rem;
    width: 85px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
}

#blogs_slider .swiper-pagination-bullet {
    background-color: #fff;
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .4);
}






#main-qna {
    padding-left: 0;
}
#main-qna .view_more {
    text-align: right;
}
@media (min-width:992px) {
    #main-qna {
        padding-left: 2rem;
    }
}
#main-qna-list {
    margin-bottom: 1rem;
    padding: 9px 0;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
}
#main-qna-list li {
    border-bottom: 1px solid #eee;
}
#main-qna-list li:last-child {
    border-bottom: 0;
}
#main-qna-list li a {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding: 7px 10px;
}
#main-qna-list li a .subject {
    display: flex;
    align-items: center;
    margin: 0;
}
#main-qna-list li a .subject::before {
    display: inline-block;
    font-family: var(--font-awesome);
    content: '\f56b';
    margin-right: 5px;
    color: #18bb18;
}
#main-qna-list li a .txt {
    /* display: flex; */
    /* flex-direction: row-reverse; */
}
#main-qna-list li a .txt .regdate {
    color: #858585;
    margin-left: 10px;
    text-align: right;
    margin: 0 0 0 10px;
}
#main-qna-list li a .txt .writer {
    color: #858585;
    text-align: right;
    margin: 0;
}

@media (min-width:992px) {
    #main-qna-list {
        margin-bottom: 2.5rem;
    }
}




.s_bg_txt {
    position: relative;
    overflow: hidden;
}
.s_bg_txt img {
    position: absolute;
    z-index: 1;
    width: 100%;
    object-fit: cover;
    height: 300px;
    object-position: center bottom;
}
.s_bg_txt .text {
    display: flex;
    justify-content: center;
    align-items: center;
    /* position: absolute;
    left: 50%;
    top: 50%; */
    position: relative;
    z-index: 2;
    height: 300px;
    color: #fff;
    /* transform: translate(-50%, -50%); */
    /* text-align: center; */
    max-width: var(--b-mwidth);
    margin: 0 auto;
    padding: 1rem;
    line-height: 160%;
    /* font-size: 1.2rem;
    font-weight: 500; */
}

@media (min-width:992px) {
    .s_bg_txt img {
        height: 500px;
    }
    .s_bg_txt .text {
        padding: 1.5rem;
        /* font-size: 1.9rem; */
        height: 500px;
    }
}

.h-left {
    justify-content: flex-start !important;
}
.h-center {
    justify-content: center !important;
}
.h-right {
    justify-content: flex-end !important;
}
.v-top {
    align-items: flex-start !important;
}
.v-middle {
    align-items: center !important;
}
.v-bottom {
    align-items: flex-end !important;
}












.btn_list_more {
    display: inline-block;
    position: relative;
    /* padding: 5px 0px; */
    font-weight: 400;
    border: 1px solid #fff;
    color: #000000;
    font-size: 1rem;
    /* width: 85px; */
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    background-color: transparent;
}

.btn_list_more a {
    display: inline-block;
    margin: 0;
    padding: 8px 16px;
    border: 1px solid #3c9a69;
    color: #096061;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.btn_list_more a:hover {
    background-color: #096061;
    color: #fff;
    /* font-size: 1.2rem; */
}


#right_floating_box {
    display: none;
}
@media (min-width:992px) {
    #right_floating_box {
        display: block;
        left: auto;
        right: 20px;
        bottom: 20px;
        margin: 0;
        width: 70px;
    }
}
/*
left: 50%;
top: 50%;
transform: translate(-50%, -50%);

-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;

overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
word-wrap:normal;

font-family: var(--font-awesome);
content: '\f127';

:after {
    display: block;
    content: '';
    clear: both
}

.item_block:hover {
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 10px 1px rgb(199 199 199);
    -moz-box-shadow: 0px 0px 10px 1px rgba(199, 199, 199, 1);
    box-shadow: 0px 0px 10px 1px rgb(199 199 199);
}

.item_block .item_block_image {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 66.66666%;
}

.item_block .item_block_image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.item_block:hover .item_block_image img {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
}

xs @media (min-width:576px) {}
sm @media (min-width:768px) {}
md @media (min-width:992px) {}
lg @media (min-width:1200px) {}
xl @media (min-width:1400px) {}
xxl


--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
width: 100%;
padding-right: calc(var(--bs-gutter-x)* .5);
padding-left: calc(var(--bs-gutter-x)* .5);
margin-right: auto;
margin-left: auto;


<link rel="stylesheet" href="https://use.typekit.net/iba4qqo.css">


Gill Sans Nova UltraLight
font-family: "gill-sans-nova", sans-serif;
font-weight: 200;
font-style: normal;


Gill Sans Nova Light
font-family: "gill-sans-nova", sans-serif;
font-weight: 300;
font-style: normal;


Gill Sans Nova Medium
font-family: "gill-sans-nova", sans-serif;
font-weight: 500;
font-style: normal;


Gill Sans Nova SemiBold
font-family: "gill-sans-nova", sans-serif;
font-weight: 600;
font-style: normal;


Gill Sans Nova Bold
font-family: "gill-sans-nova", sans-serif;
font-weight: 700;
font-style: normal;


Gill Sans Nova Heavy
font-family: "gill-sans-nova", sans-serif;
font-weight: 800;
font-style: normal;


Gill Sans Nova ExtraBold
font-family: "gill-sans-nova", sans-serif;
font-weight: 900;
font-style: normal;




Brandon Grotesque Thin
font-family: "brandon-grotesque", sans-serif;
font-weight: 100;
font-style: normal;

Brandon Grotesque Light
font-family: "brandon-grotesque", sans-serif;
font-weight: 300;
font-style: normal;

Brandon Grotesque Regular
font-family: "brandon-grotesque", sans-serif;
font-weight: 400;
font-style: normal;

Brandon Grotesque Medium
font-family: "brandon-grotesque", sans-serif;
font-weight: 500;
font-style: normal;

Brandon Grotesque Bold
font-family: "brandon-grotesque", sans-serif;
font-weight: 700;
font-style: normal;

Brandon Grotesque Black
font-family: "brandon-grotesque", sans-serif;
font-weight: 900;
font-style: normal;





*/



/* 

#cv_wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    pointer-events: none;
    overflow: hidden;
}

#cv_video {
    width: 100vw;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 177.77vh;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    transform: translate(-50%, -50%);
} */



