@charset "UTF-8";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

ol,
ul,
li {
    list-style: none;
}

a {
    color: inherit;
    text-decoration: none;
}

html {
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1.5;
    color: #222;
    cursor: auto;
    overflow-x: hidden;
}

html, body, * {
    user-select: none !important;
    -webkit-user-select: none !important;
}

img {
    -webkit-user-drag: none;
}

p {
    font-family: "Pretendard";
    letter-spacing: -.6px;
}

.img_pc {
    display: block !important;
}

.img_mo {
    display: none !important;
}

br.p_br {
    display: inline-block;
}

br.t_br {
    display: none;
}

br.m_br {
    display: none;
}

.inner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.wrap {
    position: relative;
}

.wrap .sec_tit h2 {
    margin-bottom: 50px;
    font-family: SangBleu Og Serif;
    font-size: 54px;
    font-weight: 400;
    text-align: center;
    line-height: 1;
}





/* 스크롤시 드롭 헤더 */
.wrap .drop_header {
    position: fixed;
    top: 0;
    left: 0;
    transform: translateY(-100%);
    z-index: 1001;
    display: flex;
    align-items: center;
    width: 100%;
    height: 80px;
    background: rgba(255, 255, 255, .8);
    transition: transform .5s ease, box-shadow .5s ease;
}

.wrap .drop_header.active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(34, 34, 34, .08);
}

.wrap .drop_header .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.wrap .drop_header .inner a.logo {
    line-height: 1;
}

.wrap .drop_header .inner a.logo img {
    width: 100%;
    max-width: 40px;
}

.wrap .drop_header .inner ul.header_main_menu {
    display: flex;
}

.wrap .drop_header .inner ul.header_main_menu li {}

.wrap .drop_header .inner ul.header_main_menu li a {
    padding: 0 30px;
    font-size: 18px;
    font-weight: bold;
}





/* 사이드 메뉴 nav */
.wrap nav.side_nav {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    height: 100vh;
}

.wrap nav.side_nav ul {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
}

.wrap nav.side_nav ul li {
    padding: 3px 0;
}

.wrap nav.side_nav ul li a {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 200;
    color: #fff;
}

.wrap nav.side_nav ul li a span {
    display: block;
    width: 8px;
    height: 8px;
    box-sizing: border-box;
    border: 1px solid #fff;
    border-radius: 4px;
    transition: background .5s;
}

.wrap nav.side_nav ul li:hover a span {
    background: #fff;
    transition: background .5s;
}

.wrap nav.side_nav ul li.active a span {
    height: 40px;
    background: #fff;
}

.wrap nav.side_nav ul li a p {
    opacity: 0;
    transition: opacity .5s;
}

.wrap nav.side_nav ul li:hover a p {
    opacity: 1;
    transition: opacity .5s;
}

.wrap nav.side_nav ul li.active a p {
    opacity: 1;
    /* transition: opacity .5s; */
}

/* 배경 밝을때는 색상 #222로 변경 */
.wrap nav.side_nav.light ul li a {
    color: #222;
}

.wrap nav.side_nav.light ul li a span {
    border: 1px solid #222;
}

.wrap nav.side_nav.light ul li:hover a span {
    background: #222;
}

.wrap nav.side_nav.light ul li.active a span {
    background: #222;
}






/* 메인비주얼 */
.wrap .main_visual {}

.wrap .main_visual a.logo {
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.wrap .main_visual a.logo img {
    width: 100%;
    max-width: 60px;
}

.wrap .main_visual .main_visual_swiper {}

.wrap .main_visual .main_visual_swiper .swiper-wrapper {}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide {
    position: relative;
    width: 100%;
    height: 100vh;
}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_img {}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_img img.pc_img {}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_img img.mb_img {}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_title {
    position: absolute;
    bottom: 15%;
    right: 10%;
    z-index: 10;
    text-align: right;
    color: #fff;
}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_title h1 {
    font-family: "SangBleu OG Sans";
    font-size: 84px;
    font-weight: 500;
    line-height: 1.3;
}

.wrap .main_visual .main_visual_swiper .swiper-wrapper .swiper-slide .visual_title p {
    margin-top: 40px;
    font-family: "Preteadard";
    font-size: 24px;
}

.wrap .main_visual .main_visual_swiper .swiper-pagination {
    position: absolute;
    bottom: 0;
}

.wrap .main_visual .main_visual_swiper .swiper-pagination-visual {
    display: flex;

}

/* bullet을 바처럼 보이게 만들기 */
.wrap .main_visual .main_visual_swiper .swiper-pagination-visual.swiper-pagination-bullets {
    position: absolute;
    left: 50%;
    bottom: 0;
    /* 위치는 취향대로 조정 가능 */
    transform: translateX(-50%);
    display: flex;
    gap: 2px;
    width: 100%;
}

.wrap .main_visual .main_visual_swiper .swiper-pagination-visual .swiper-pagination-bullet {
    position: relative;
    width: 100%;
    /* 바 길이 */
    height: 4px;
    /* 바 두께 */
    border-radius: 0;
    background: rgba(34, 34, 34, .5);
    /* 빈 바 배경 */
    opacity: 1;
    /* Swiper 기본 opacity 무시 */
    margin: 0;
    /* 기본 여백 제거 */
    overflow: hidden;
}

/* 안에서 실제로 차오르는 부분 */
.wrap .main_visual .main_visual_swiper .swiper-pagination-visual .swiper-pagination-bullet::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform-origin: left center;
    transform: scaleX(0);
    /* 기본은 0 (비어 있음) */
    background: #ffffff;
    /* 채워지는 바 색상 */
}

/* 활성화된 슬라이드의 바만 5초 동안 채워짐 */
.wrap .main_visual .main_visual_swiper .swiper-pagination-visual .swiper-pagination-bullet-active::after {
    animation: barFill 5s linear forwards;
}

@keyframes barFill {
    from {
        transform: scaleX(0);
    }

    to {
        transform: scaleX(1);
    }
}




/* 플로팅 lang */
.wrap .floating {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 10000;
}

.wrap .floating>div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* gap: 5px; */
    width: 50px;
    height: 50px;
    margin-bottom: 15px;
    /* font-family: "Pretendard"; */
    /* font-size: 14px; */
    line-height: 1;
    color: #fff;
    background: #52453b;
    border-radius: 50%;
    opacity: 0.7;
}

.wrap .floating>div span {}

.wrap .floating>div span:first-child {}

.wrap .floating>div span:last-child {}

.wrap .floating>div span img {}

.wrap .floating>div>img {}

.wrap .floating div.switch {
    transform: translateY(65px);
    transition: transform .8s, opacity .4s;
    opacity: 0;
    pointer-events: none;
}

.wrap .floating.on div.switch {
    transform: translateY(0px);
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
}

.wrap .floating div.switch_en {
    transition-delay: .1s;
}

.wrap .floating div.switch_jp {
    transition-delay: .05s;
}

.wrap .floating div.switch_cn {
    transition-delay: .0s;
}

.wrap .floating div.floating_btn {
    background: #d2c6bc;
    transition: all .8s;
    cursor: pointer;
}

.wrap .floating.on div.floating_btn {
    background: #52453b;
    opacity: 0.7;
}

.wrap .floating div.floating_btn img {
    transition: all .8s;
}

.wrap .floating.on div.floating_btn img {
    transform: rotate(45deg);
}





/* sec magazine */
.wrap .magazine {
    position: relative;
    cursor: url("../img/magazine_cursor.png") 0 0, auto;
}

.wrap .magazine .sec_tit {
    text-align: center;
}

.wrap .magazine .sec_tit h2 {
    margin-bottom: 30px;
    line-height: 1.5;
}

.wrap .magazine .sec_tit .thumb_click {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    padding: 15px 30px;
    border: 1px solid #222;
    border-radius: 100px;
}

.wrap .magazine .sec_tit .thumb_click p {}

.wrap .magazine .sec_tit .thumb_click span {}

.wrap .magazine .sec_tit .thumb_click span img {}

.wrap .magazine .sec_con {
    padding-top: 50px;
    overflow: hidden;
}

.wrap .magazine .sec_con ul.rolling_img {
    display: flex;
    gap: 30px;
}

.wrap .magazine .sec_con ul.rolling_img li {}

.wrap .magazine .sec_con ul.rolling_img li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    min-width: 320px;
    overflow: visible;
    cursor: url("../img/magazine_cursor.png") 0 0, auto;
}

.wrap .magazine .sec_con ul.rolling_img li a img {
    width: 100%;
    transition: box-shadow .3s ease, transform .3s ease;
}

.wrap .magazine .sec_con ul.rolling_img li:hover a img {
    transform: translateY(-6px);
    box-shadow: 0 15px 30px rgba(34, 34, 34, .18);
}

.wrap .magazine .sec_con ul.rolling_img li a span {}

.wrap .magazine .magazine_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: url(../img/magazine_bg.png) no-repeat center center / cover;
}

.wrap .magazine .magazine_bg .border {
    position: absolute;
    display: inline-block;
    padding: 30px;
    line-height: 1;
}

.wrap .magazine .magazine_bg .border_tl {
    top: 0;
    left: 0;
}

.wrap .magazine .magazine_bg .border_tr {
    top: 0;
    right: 0;
    transform-origin: center center;
    transform: rotate(90deg);
}

.wrap .magazine .magazine_bg .border_bl {
    bottom: 0;
    left: 0;
    transform-origin: center center;
    transform: rotate(-90deg);
}

.wrap .magazine .magazine_bg .border_br {
    bottom: 0;
    right: 0;
    transform-origin: center center;
    transform: rotate(180deg);
}

.wrap .magazine .magazine_bg .border img {
    max-width: 34px;
}






/* sec01 Cheongdam Circle's Specialty */
.wrap .sec {
    width: 100%;
    padding: 200px 0;
}

.wrap .sec.specialty {}

.wrap .sec.specialty .sec_tit {}

.wrap .sec.specialty .sec_tit h2 {}

.wrap .sec.specialty .sec_con {
    position: relative;
}

.wrap .sec.specialty .sec_con .specialty_swiper {}

.wrap .sec.specialty .sec_con .specialty_swiper .swiper-wrapper {}

.wrap .sec.specialty .sec_con .specialty_swiper .swiper-wrapper .swiper-slide {}

.wrap .sec.specialty .sec_con .specialty_swiper .swiper-wrapper .swiper-slide img {
    width: 100%;
}

.wrap .sec.specialty .sec_con .specialty_1 {
    position: relative;
}

.wrap .sec.specialty .sec_con .specialty_1 img {}

.wrap .sec.specialty .sec_con .specialty_1>p {
    position: absolute;
    font-family: "Sangbleu Og Serif";
    font-size: 28px;
    font-weight: 500;
    cursor: pointer;
}

.wrap .sec.specialty .sec_con .specialty_1 p.doc_suh {
    top: 10%;
    left: 10%;
}

.wrap .sec.specialty .sec_con .specialty_1 p.doc_ahn {
    top: 10%;
    right: 9%;
}

.wrap .sec.specialty .sec_con .specialty_1>p::after {
    content: "+";
    display: block;
    width: 30px;
    height: 30px;
    font-family: "Pretendard";
    font-size: 35px;
    text-align: center;
    line-height: 26px;
    color: #222;
    border: 1px solid #222;
    border-radius: 15px;
}

.wrap .sec.specialty .sec_con .specialty_1 p.doc_suh::after {
    margin: 0 0 0 auto;
}

.wrap .sec.specialty .sec_con .specialty_1 p.doc_ahn::after {
    margin: 0 auto 0 0;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: none;
    max-width: 600px;
    height: 100%;
    max-height: 500px;
    padding: 50px;
    border-radius: 40px;
    background: rgba(255, 255, 255, .9);
    box-shadow: 7px 7px 20px rgba(0, 0, 0, .1);
    overflow: hidden;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_suh_con {
    right: 0;
    margin-right: 30px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_ahn_con {
    left: 0;
    margin-left: 30px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner {
    height: 100%;
    overflow-y: auto;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner::-webkit-scrollbar {
    display: none;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li {
    font-family: "Pretendard";
    font-size: 18px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li>p {
    font-size: 20px;
    margin-bottom: 5px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul {}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul li {
    margin: 0 0 5px 10px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul li p {
    display: flex;
    align-items: center;
    gap: 10px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul li p.tiny_circle span {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background: #222;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul li p.more_tiny_circle {
    margin-left: 16px;
    font-size: 16px;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scroll_inner>ul>li ul li p.more_tiny_circle span {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 2px;
    border: 1px solid #666;
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scrollbar {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    width: 6px;
    height: 80%;
    border-radius: 3px;
    background: rgba(34, 34, 34, .1);
}

.wrap .sec.specialty .sec_con .specialty_1 .doc_con .scrollbar .scroll_thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* min-height: 40px; */
    border-radius: 3px;
    background: rgba(34, 34, 34, .5);
}





.wrap .sec.specialty .sec_con .specialty_prev,
.wrap .sec.specialty .sec_con .specialty_next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.wrap .sec.specialty .sec_con .specialty_prev img,
.wrap .sec.specialty .sec_con .specialty_next img {
    max-width: 24px;
}

.wrap .sec.specialty .sec_con .specialty_prev {
    left: -8%;
}

.wrap .sec.specialty .sec_con .specialty_next {
    right: -8%;
}

.wrap .sec.specialty .sec_con .specialty_prev::after,
.wrap .sec.specialty .sec_con .specialty_next::after {
    content: none;
}




/* sec02 Signature Treatments */
.wrap .sec.signature {
    background: url(../img/signature_bg.png) no-repeat;
    background-size: cover;
}

.wrap .sec.signature::after {}

.wrap .sec.signature .sec_tit {}

.wrap .sec.signature .sec_con {
    /* position: relative; */
}

.wrap .sec.signature .sec_con>div {
    position: relative;
}

.wrap .sec.signature .sec_con .signature_tabnav {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 30px;
    padding-bottom: 5px;
}

.wrap .sec.signature .sec_con .signature_tabnav::after {}

.wrap .sec.signature .sec_con .signature_tabnav li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100% / 7);
    height: 60px;
    font-family: "Pretendard";
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    letter-spacing: -.6px;
    color: #888;
}

.wrap .sec.signature .sec_con .signature_tabnav li:first-child {
    width: calc(100% / 5);
}

.wrap .sec.signature .sec_con .signature_tabnav li.active {
    position: relative;
    font-family: "Pretendard";
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -.6px;
    color: #222;
}

.wrap .sec.signature .sec_con .signature_tabnav li.active::after {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 3px;
    background: #222;
}

.wrap .sec.signature .sec_con .signature_prev,
.wrap .sec.signature .sec_con .signature_next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.wrap .sec.signature .sec_con .signature_prev img,
.wrap .sec.signature .sec_con .signature_next img {
    max-width: 8px;
}

.wrap .sec.signature .sec_con .signature_prev {
    left: -2%;
}

.wrap .sec.signature .sec_con .signature_next {
    right: -2%;
}

.wrap .sec.signature .sec_con .signature_swiper {}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper {}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide {
    display: flex;
    align-items: center;
    gap: 60px;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .thumbnail {
    position: relative;
    width: 40%;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .thumbnail::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    box-sizing: border-box;
    width: 100%;
    height: 95%;
    border: 1px solid #d0a575;
    opacity: 1;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .thumbnail img {
    width: 100%;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt {
    width: 60%;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p {}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.little_wide {
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 10px;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.main_title {
    margin: 45px 0 40px;
    font-size: 54px;
    font-weight: 600;
    color: #d0a575;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.sub_title {
    font-size: 24px;
    font-weight: 400;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.sub_title i {}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.disc {
    /* margin: 30px 0 35px; */
    margin: 30px 0 0;
    font-size: 20px;
    font-weight: 300;
    color: #666;
}

.wrap .sec.signature .sec_con .signature_swiper .swiper-wrapper .swiper-slide .txt p.disc b {}






/* sec03 ban */
.wrap .sec.bna {
    overflow: hidden;
}

.wrap .sec.bna .inner {
    display: flex;
    align-items: center;
}

.wrap .sec.bna .inner>div {}

.wrap .sec.bna .bna_left {
    flex: 0 0 50%;
    max-width: 50%;
    padding-right: 50px;
}

.wrap .sec.bna .bna_left .sec_tit {}

.wrap .sec.bna .bna_left .sec_tit h2 {
    margin-bottom: 20px;
    text-align: left;
    line-height: 1.3;
}

.wrap .sec.bna .bna_left .sec_tit p {
    font-size: 24px;
    font-weight: 300;
    color: #444;
    margin-bottom: 50px;
}

.wrap .sec.bna .bna_left ul.bna_tab {}

.wrap .sec.bna .bna_left ul.bna_tab li {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    font-family: "Pretendard";
    font-size: 18px;
    font-weight: 300;
    color: #888;
    border-bottom: 1px solid rgba(34, 34, 34, .3);
    cursor: pointer;
}

.wrap .sec.bna .bna_left ul.bna_tab li.active {
    font-size: 24px;
    color: #fff;
    background: #d0a575;
    border-bottom: none;
}

.wrap .sec.bna .bna_left .bna_notice {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 50px;
    padding: 15px 20px;
    border: 2px solid #f4f4f4;
}

.wrap .sec.bna .bna_left .bna_notice img {}

.wrap .sec.bna .bna_left .bna_notice p {
    font-weight: 200;
    color: #c5c5c5;
}

.wrap .sec.bna .bna_right {
    flex: 1;
    width: 50%;
    margin-right: calc((100vw - 1240px) / -2) !important;
}

.wrap .sec.bna .bna_right .bna_swiper {
    display: none;
}

.wrap .sec.bna .bna_right .bna_swiper.active {
    display: flex;
}

.wrap .sec.bna .bna_right .bna_swiper .bna_progress {
    top: 0;
    width: 50%;
    height: 4px;
    margin-left: -10px;
    border-radius: 0;
    background: rgba(34, 34, 34, .15);
}

.wrap .sec.bna .bna_right .bna_swiper .bna_progress .swiper-scrollbar-drag {
    border-radius: 0;
    background: #d0a575;
    transition: width .25s ease, transform .25s ease;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper {
    width: 100%;
    display: flex;
    margin-top: 20px;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide {
    width: fit-content;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div {
    display: flex;
    gap: 30px;
    width: fit-content;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div div {
    min-width: 440px;
    width: calc(100% / 3);
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div img {
    width: 100%;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div p {
    width: 160px;
    margin: 10px auto 0;
    text-align: center;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div.img_top {}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div.img_top p {
    margin-bottom: 30px;
}

.wrap .sec.bna .bna_right .bna_swiper .swiper-wrapper .swiper-slide>div.img_bottom {
    margin-top: 30px;
}

.wrap .sec.bna .bna_notice_mo {
    display: none;
}





/* sec04 Instagram */
.wrap .sec.instagram {
    position: relative;
    padding-bottom: 0;
}

.wrap .sec.instagram .sec_tit h2 {
    margin-bottom: 40px;
}

.wrap .sec.instagram .sec_con {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 100px 0;
}

.wrap .sec.instagram .sec_con::after {
    content: "";
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    border-style: solid;
    border-width: 30px 30px 0 30px;
    border-color: #fff transparent transparent transparent;
}

.wrap .sec.instagram .sec_con h5 {
    margin-bottom: 20px;
    font-family: "Pretendard";
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    color: #fff;
}

.wrap .sec.instagram .sec_con div.insta_content {
    display: flex;
    align-items: flex-end;
    width: 100%;
    max-width: 1240px;
}

.wrap .sec.instagram .sec_con div.insta_content>div {}

.wrap .sec.instagram .sec_con div.insta_content .blank {
    width: 30%;
}

.wrap .sec.instagram .sec_con div.insta_content .main_img {
    width: 40%;
}

.wrap .sec.instagram .sec_con div.insta_content .main_img a {}

.wrap .sec.instagram .sec_con div.insta_content .main_img a img {
    display: block;
    width: 70%;
    margin: 0 auto;
    border-radius: 20px;
    box-shadow: 2px 5px 20px rgba(0, 0, 0, .2);
}

.wrap .sec.instagram .sec_con div.insta_content .instagram_links {
    width: 30%;
}

.wrap .sec.instagram .sec_con div.insta_content .instagram_links ul {}

.wrap .sec.instagram .sec_con div.insta_content .instagram_links ul li {
    margin: 5px 0;
}

.wrap .sec.instagram .sec_con div.insta_content .instagram_links ul li a {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Pretendard";
    font-size: 18px;
}

.wrap .sec.instagram .sec_con div.insta_content .instagram_links ul li a img {
    max-width: 25px;
}

.wrap .sec.instagram .sec_con div.instagram_bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    width: 100%;
    height: 100%;
}

.wrap .sec.instagram .sec_con div.instagram_bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





/* sec05 About Circle */
.wrap .sec.about_circle {}

.wrap .sec.about_circle .sec_tit h2 {
    margin-bottom: 20px;
}

.wrap .sec.about_circle .sec_con {}

.wrap .sec.about_circle .sec_con .about_circle_swiper {}

.wrap .sec.about_circle .sec_con .about_circle_swiper .swiper-wrapper {}

.wrap .sec.about_circle .sec_con .about_circle_swiper .swiper-wrapper .swiper-slide {
    transform: scale(.75);
    transition: transform .6s;
}

.wrap .sec.about_circle .sec_con .about_circle_swiper .swiper-wrapper .swiper-slide-active {
    transform: scale(.9);
    filter: drop-shadow(5px 3px 10px rgba(0, 0, 0, .20));
}

.wrap .sec.about_circle .sec_con p {
    margin-top: 20px;
    font-family: "SangBleu Og Serif";
    font-size: 24px;
    font-weight: 400;
    text-align: center;
}





/* sec06 Branding */
.wrap .sec.branding {
    position: relative;
    background: url(../img/branding_bg.png) no-repeat center;
    background-size: cover;
    overflow: hidden;
}

.wrap .sec.branding::before,
.wrap .sec.branding::after {
    position: absolute;
    font-family: "Marcellus";
    font-size: 204px;
    line-height: 1;
    color: rgba(34, 34, 34, .04);
}

.wrap .sec.branding::before {
    content: "CiRCLE's";
    top: 0;
    left: -40px;
}

.wrap .sec.branding::after {
    content: "BRANDING";
    bottom: 0;
    right: -40px;
}

.wrap .sec.branding .branding_video {
    width: 100%;
    max-width: 1240px;
    aspect-ratio: 1920 / 1080;
}

.wrap .sec.branding .branding_video video {
    width: 100%;
}

.wrap .sec.branding p {
    margin-top: 10px;
    font-family: "SangBleu Og Serif";
    font-size: 24px;
    font-weight: 400;
    text-align: center;
}





/* sec07 Location */
.wrap .sec.location {}

.wrap .sec.location .sec_con {
    display: flex;
    align-items: center;
    gap: 50px;
}

.wrap .sec.location .sec_con>div {
    width: 50%;
}

.wrap .sec.location .sec_con .map {
    font-size: 54px;
    color: #fff;
    text-align: center;
}

.wrap .sec.location .sec_con .map img {
    width: 100%;
}

.wrap .sec.location .sec_con .map_txt {}

.wrap .sec.location .sec_con .map_txt>ul.map_tab {
    display: flex;
    width: 100%;
}

.wrap .sec.location .sec_con .map_txt>ul.map_tab li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 20px 0;
    font-family: "Pretendard";
    font-size: 20px;
    color: #aaa;
    border-bottom: 2px solid #ddd;
    cursor: pointer;
}

.wrap .sec.location .sec_con .map_txt>ul.map_tab li.active {
    font-weight: 600;
    color: #222;
    border: 2px solid #222;
}

.wrap .sec.location .sec_con .map_txt div.map_content {}

.wrap .sec.location .sec_con .map_txt div.map_content ul {
    display: none;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul.active {
    display: block;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li {
    display: flex;
    width: 100%;
    padding: 50px 0;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li:last-child {
    padding-bottom: 0;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li.address {
    border-bottom: 1px solid #3f3f3f;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li h5 {
    width: 40%;
    font-family: "Pretendard";
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li>p {
    width: 100%;
    font-size: 18px;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart {
    width: 100%;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart table tr:first-child {
    border-top: 1px solid rgba(63, 63, 63, .3);
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart table tr {
    border-bottom: 1px solid rgba(63, 63, 63, .3);
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart table tr td {
    padding: 15px 0;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart table tr td:first-child {
    width: 40%;
    border-right: 1px solid rgba(63, 63, 63, .3);
}

.wrap .sec.location .sec_con .map_txt div.map_content ul li .chart p {
    margin-top: 10px;
}

.wrap .sec.location .sec_con .map_txt div.map_content ul.map_main {}

.wrap .sec.location .sec_con .map_txt div.map_content ul.map_lounge {}






/* sec08 reservation */
.wrap .sec.reservation {
    position: relative;
    background: #f9f9f9;
    overflow: hidden;
}

.wrap .sec.reservation .sec_con {}

.wrap .sec.reservation .sec_con ul.sns_list {
    display: flex;
    justify-content: space-between;
}

.wrap .sec.reservation .sec_con ul.sns_list li {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 35px;
    width: 100%;
}

.wrap .sec.reservation .sec_con ul.sns_list li::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 260px;
    background: #222;
    opacity: 0.2;
}

.wrap .sec.reservation .sec_con ul.sns_list li:last-child::after {
    content: none;
}

.wrap .sec.reservation .sec_con ul.sns_list li div {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.wrap .sec.reservation .sec_con ul.sns_list li div img {}

.wrap .sec.reservation .sec_con ul.sns_list li div p {}

.wrap .sec.reservation .sec_con ul.sns_list li div.sns_logo {}

.wrap .sec.reservation .sec_con ul.sns_list li div.sns_logo img {}

.wrap .sec.reservation .sec_con ul.sns_list li div.sns_logo p {
    font-size: 20px;
    font-weight: 600;
}

.wrap .sec.reservation .sec_con ul.sns_list li div.qr_img {}

.wrap .sec.reservation .sec_con ul.sns_list li div.qr_img img {}

.wrap .sec.reservation .sec_con ul.sns_list li div.qr_img p {
    font-size: 18px;
    font-weight: 500;
}

.wrap .sec.reservation .bg_logo {
    position: absolute;
    bottom: -100px;
    left: -50px;
    opacity: .2;
}





/* footer */
.wrap .footer {}

.wrap .footer .inner {
    display: flex;
    padding: 55px;
    align-items: center;
    gap: 80px;
}

.wrap .footer .logo {}

.wrap .footer .logo img {}

.wrap .footer .txt {}

.wrap .footer .txt p {
    font-size: 14px;
    font-weight: 500;
}

.wrap .footer .txt p span {}

.wrap .footer .txt p span.line {
    margin: 0 15px;
}

.wrap .footer .txt p.copyright {
    margin-top: 10px;
    font-size: 12px;
    font-weight: 400;
    color: rgba(34, 34, 34, .5);
}