/* reset style */
* { margin: 0; padding: 0; box-sizing: border-box;
}
a  { color:inherit; text-decoration: none;}
li  { list-style: none;}
img { vertical-align: top; object-fit: cover; }
button { cursor: pointer; border: 0;
    font-family: "abril-fatface", serif;
    font-weight: 400;
    background-color: #fff;
}
:root { 
    --main_color:#441C16;
    --bg_color : #F6F6F4;
}
body { 
    overflow-x: hidden;
}

/* button sytle */
.btn { 
    font-family: "abril-fatface", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    padding: 20px;
    transition: 0.6s;
}
.brown { background-color: #441400;
    color: #fff;
}
.w320 {  width: 320px;}

button.btn.brown:hover{ 
    background-color:#fff ;
    color:#441400 ;
}

/* title style */
.title { font-size: 60px; color: #441C16;
    padding: 10px 0;
    font-family: "hello-bloomie-script", sans-serif;
    font-weight: 400;
    font-style: normal;
 }
.title.center {
    text-align:center;
 }

 /* inner style */
.inner1290 {
    width: 1290px;
    margin: auto;
}
.inner1140 {
    width: 1140px;
    margin: auto;
    text-align: center;
}
/* hero style */
#hero  { width: 100%; height:100vh;
    background: url(./img/hero_bg_img.jpg) no-repeat #F6F6F4 top center ;
    background-size: cover;
    overflow: hidden;
    position: relative; 
}

/*  video_bg */
/* #hero .video { position: absolute; left: 0; top: 0; }
#hero .video_mask {
    position: absolute;
        top: 0;
        left: 0;
        background-color: #F6F6F4;
        line-height: 100vh;
        width: 100%;
        text-align: center;
        mix-blend-mode: multiply;
    } */


.logo {  width: 100%;  padding: 10px 0;
    position: relative;
}
.logo_text { 
    padding-left: 10px;
}
.logo_text img {  width: 130px;}
.logo_sb { position: absolute;
    left: 50%; transform: translateX(-50%);
    bottom: -40px;
}
.logo_sb img { 
    width: 120px;
    padding: 0 10px;
}
.logo_text::before { 
    content: '';
    width: calc(50% - 50px);
    height: 1px;
    background-color: #fff;
    position: absolute;
    left: 0; bottom: 0;
}
.logo_text::after {
    content: '';
    width: calc(50% - 50px);
    height: 1px;
    background-color: #fff;
    position: absolute;
    right: 0;
    bottom: 0;
}
.hero_content { width: 100%; height: 100%;}
.hero_logobox, .hero_bottle_box, .hero_text_box { 
    position: absolute;
}
.hero_logobox { 
    top:30%; left: 20%; 
}
.hero_logobox img { width:250px;}

.hero_bottle_box {
    width: 100%; height: 100%;
    top:12%; left: 39%;
    position: relative;
 }
 .bottle { 
    position: absolute;
    left: 0; top:0;
    opacity: 0;
    transition: opacity 1s ease;
 }
 .bottle.acti{
     opacity: 1;
 }
.hero_bottle_box img { height: 700px; }
.hero_text_box { 
    color: #fff;
    font-family: "palast-variable", sans-serif;
    font-variation-settings: "opsz" 160, "wght" 500;
    width: 420px;
    left: 63%; top: 35%;
 }
 .hero_text_box p:nth-child(1) {
    font-size: 36px;
 }
.hero_text_box p:nth-child(2) {
    font-size: 60px;
 }
.hero_text_box:nth-child(3) {
      font-size: 70px;
  }

  /* section2 :: Best Seller TOP3 */

.best_title {
     font-size: 26px;
     padding: 5px 0;
     font-family: "abril-fatface", serif;
     font-weight: 400;
     font-style: normal;
     border-top: 1px solid #D6B4B4;
     border-bottom: 1px solid #D6B4B4;
     margin-bottom: 20px;
 }
.bset_seller { width: 100%; height: 960px;
    background-color: #F6F6F4;
    text-align: center;
}
.best_seller_wrap { 
    width: 1140px; height:660px ;
    margin-top: 50px;
}
.top3_container {
    width: 1140px; margin: auto;
    display: flex;
    align-items: center;
 }
.top_item { 
    width: 360px;
    height: 480px;
    text-align: center;
    font-family: "abhaya-libre", sans-serif;
    transition: all 0.5s ease-in-out;
    opacity: 0;
}
.top_item .text_box p.name { 
    padding: 10px 0;
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 800;
    color: #222;
    border-bottom: 1px solid #AEAEAE;
    display: inline-block;
    
}
.top_item .text_box p.name_series { 
    font-size: 16px;
    color: #820B0B;
    font-weight: 800;
}
.top_item .text_box p.name_note {
    font-size: 14px;
    font-style: normal;
    color: #1F1F1F;
}

.swiper-slide-active {
     scale: 1.4;
     opacity: 1;
 }

.swiper-slide-prev,
.swiper-slide-next {
    filter: blur(4px);
    opacity: 1;
    transition: 0.6s;
}

.btn_small {
    padding: 5px;
    background-color: #fff;
    border: 1px solid #764141;
    color: #820B0B;
    transition: 1s;
}
.btn_small:hover{
    background-color: #764141;
    color: #fff;
}

.btn_small_more {
    border-bottom: 1px solid #764141;
    color: #820B0B;
    transition: 1s;
}
.btn_small_more:hover { 
    color: #333;
    border-bottom: none;
}

/* 공통 스타일 */
#legacy {
    width: 100%;
    height: 960px;
    background-color: #ffffff;
    display: flex; align-items: center;
}

.legacy_box {
    display: flex;
    /* flex-wrap: wrap; */
    width: 1600px;
    height: 770px;
    margin: auto;
    border: 1px solid #4B4444;
}

/* 왼쪽(25%) */
.left_wrap {
    width: 320px;
    border-right: 1px solid #C3B1B1;
    /* 최소 너비 설정 */
}

.content_box_left {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    
}

.content_box_left .text_wrap {
    padding: 10%;
    font-family: "Noto Sans", sans-serif;
    color: #6F3931;
    height: calc(100% + 130px);
}
.content_box_left .img_box { 
    height:100%;
}
.content_box_left .img_box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* height: auto; */
}
.text_wrap>.title3 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 36px;
}

.text_wrap>.sen {
    font-size: 12px;
    margin-bottom: 30px;
}


/* 오른쪽(75%) */
.right_wrap {
    /* width:75%; */
    width: 1280px;
}

.title_box {
    width: 100%;
    height: 130px;
    font-size: 60px;
    color: #441C16;
    background-color: #fff;
    text-align: center;
    padding: 10px 0;
    font-family: "hello-bloomie-script", sans-serif;
    font-weight: 400;
    border-bottom: 1px solid #C3B1B1;
}

/* 콘텐츠 박스 */
.content_box {
    width: 100%;
    display: flex;
    /* flex-wrap: wrap; */
}
.content_box>div { 
    /* width: 50%; */
    width: 640px;
}
.content_left {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.content_right {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.content_right>div {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
}

.content_right1 { 
    height: 100%;
    border-right: 1px solid #D6B4B4;
}
.itembox {
    width:320px;
    height: 320px;
    /* min-width: 250px; */
}

.itembox.textbox {
    color:var(--main_color);
    font-size:12px ;
    padding: 30px;
}
.itembox.textbox>.title1 { 
    font-size: 26px; 
    margin-bottom: 15px;
    font-weight: 700;
}
.itembox.textbox>.title2 { 
    font-size: 16px;
    margin-bottom: 15px;
}
.itembox.textbox>ul { 
    margin-bottom: 30px;
}
.itembox.textbox>ul>li { 
    list-style: disc;
    padding: 2px 0;
}
.itembox .title_artist
{
    font-family: "tenez", sans-serif;
    font-size:50px;
    font-weight: 700;
    font-style: italic;
    line-height: 0.7em;
}
.itembox .title_artist2 {
    font-family: "Noto Sans KR", sans-serif;
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 20px;
    display: block;

}
.imgbox { overflow: hidden;}
.imgbox img { transition: 0.5s; }
.imgbox:hover img {
    transform: scale(1.2);
}

.artist>div { width: 100%;
    height:calc(100% / 6); 
    border-bottom: 1px solid #C3B1B1;
}
.artist>div:last-child { 
    border-bottom: 0;
}
/* .itembox.artist>div {
    width: 100%;
    height: calc(100% / 6);
    background-color: #9b1515; 
} */
.artist_box { 
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    color:var(--main_color);
    border-bottom: 1px dotted #C2C2C2;
    padding-left: 25px;
    cursor: pointer;
    transition: 1s;
}

.artist_box>.contry { 
    font-size: 14px;
    font-weight: 700;
}
.artist_box>.name { 
    font-size: 20px;
    font-family: "Playball", cursive;
    font-weight: 400;
    font-style: normal;
}
.artist_box:hover { 
    background-color: var(--main_color);
    color: #fff;
}
.se { margin-bottom: 30px;}



/* section4 :: history */

#history { width: 100%; height: 960px;
 background-color:var(--bg_color) ;
 display: flex; justify-content: center;
 align-items: center;

}
.history_wrap { 
    width:1290px; height:640px ;
    margin: auto;
    /* align-items: center; */
    display: flex;
    border: 1px solid #441C16;
}
.history_title { 
    width: 50px; height: 100%;
    font-family: "philosopher", sans-serif;
    writing-mode: vertical-rl;
    font-size: 20px; font-weight: 600;
    border-right: 1px solid #441C16;
    display:flex;
    justify-content:left;
    align-items: center;
    padding: 2% 0;
    cursor: pointer;
    transition: 0.5s;
}
.history_title:hover { 
    background-color: #805B56;
    color: #fff;
}
.history_title:last-child {
    border-right: none;
}

/* .history_content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateX(-50px);
    /* transition: opacity 0.5s ease, transform 0.5s ease;
    z-index: 1;
} */

/* .history_content.active {
    opacity: 1;
    visibility: visible;
    position: relative;
    transform: translateX(0);
    z-index: 2;
} */

.history_content {
    width: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: width 0.6s ease, opacity 0.3s ease;
    
}

.history_content.active {
    width: 100%;
    opacity: 1;
    visibility: visible;
}

.h_contents { 
    padding: 15% 26% 15% 15%;
    height: 100%;
    border: 1px solid #441C16;
    position: relative;
    color: #dfdfdf;
    overflow: hidden;
    background-color: #2B1414;
}
.h_contents:last-child { 
    border-right: none;
}
.h_contents>.year { 
    font-family: "philosopher", sans-serif;
    font-size: 14em;        
    position: absolute;
    right: 20%; 
    top:30%;
    /* writing-mode: vertical-lr; */
    color: rgba(255,255,255,0.9);
    transform: rotate(-90deg);
        transform-origin: right top;
        /* display: inline-block; */
}
.active {
    background-color: #805B56;
    color: #fff;
}

.h_title_gr { 
    padding-bottom: 30px;
    border-bottom: 1px solid #805B56;
    margin-bottom: 30px;
    display: flex; justify-content: space-between;
    align-items: baseline;
    line-height: 3em;
}
.his_title {
    font-size: 3.3em;
    font-weight: bold;
    text-transform: uppercase;
}
.his_title2 { font-size: 16px;
    font-weight: 600;
 }
.h_content_story_wd { 
    display: flex;
    font-size: 12px;
    line-height: 1.6em;
}
.h_content_story_wd img { 
    width: 180px; height: 180px;
    object-fit: center cover;
    margin-right: 60px;
}
.h_content_story { 
    font-size: 12px;
    line-height: 1.6em;
}
.h_content_story img {
    margin-bottom: 30px;
}

/* section5 :: collection */
#collection { 
    width: 100%;
    height: 960px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.collection_wrap {
    width: 100%;
    height: 780px;
    margin: auto;
}

/* collention tap menu */
.tab_btns_collection { 
    width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   border: 1px solid #2B1414;
}
.tab_btns_collection li { 
    width: calc(100% / 4);
    color: var(--main_color);
    height: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "abril-fatface", serif;
    font-weight: 400;
    font-style: normal;
    cursor: pointer;
    border-right: 1px solid #2B1414;
}
.tab_btns_collection li:last-child {
    border-right:0;
}
.tab_btns_collection li:hover { 
    background-color: #2B1414;
    color: #fff;
}
.tab_btns_collection li.active { 
    background-color: #2B1414;
    color: #fff;
}

/* section :: product */
.collection_slide {
    width: 100%;
    height: 600px;
    position: relative;
    display: none;
    margin-top: 5%;
 }
.collection_slide.show { 
    display: block;
}
.coll_title_box { 
    width: 100%;
    position: absolute;
    left:18%; top:20% ;
 }
.coll_title { 
    font-family: "hello-bloomie-script", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 80px;
    color: #4F4F4F;
    line-height: 1.5em;
}
.coll_title p:last-child { 
    padding-left: 40px;
}
.collection_slide .img_box {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1
}
.coll_text {
    font-size:14px ;
    width: 20%;
    color: #441C16;
    margin-left: 5%;
    margin-top: 3%;
  }

.product_title { position: absolute;
    font-family: var(--bg_color);
    font-size: 32px;
    font-family: "bodoni-urw", serif;
    font-weight: 400;
    font-style: normal;
    left: 58%; top: 24%;
}
.product_title p:first-child {
    margin-bottom: 15px;
}
.product_title p:last-child { 
    font-size: 20px;
}
.product_info { 
    position: absolute;
    left: 50% ; top: 40%;
    width: 50%;
    height: 52%;
    background-color:#A1B81C;
    padding-left:8%;
    color: #fff;
}
.tasting_title { 
    font-size:16px;
    margin: 30px 0 20px;
}
.tasting_notes_wrap { 
    display:flex;
    gap: 30px;
}
.tasting_notes p { 
    width: 200px;
    font-size: 12px;
    margin-bottom: 20px;
}
.tasting_notes>h3 { 
    margin: 10px 0;
    font-size:24px;
    font-family: "bodoni-urw", serif;
    font-weight: 400;
    border-bottom: 1px solid #fff;
    padding-bottom: 10px;
    text-transform: uppercase;
}
.more_view { padding: 5px; background-color: #ffffff;}

.collection_slide.grand .product_info { 
    background-color: #866536;
}
.collection_slide.time .product_info { 
    background-color: #DC4405;
}
.collection_slide.per .product_info { 
    background-color: #8D4675;
}


/* Section6 :: Signature */
#signature { 
    width: 100%;
    height: 960px;
    display:flex ;
    /* align-items: center; */
    background-color: #FAF5F1;
}
.signature_wrap { 
    width: 100%;
    margin: auto;
}
.signature_slide { 
    width: 100%; height: 100%;
    /* gap: 5px; */
    /* display: flex;
    align-items: center;
    justify-content: space-between; */
    margin-top: 100px;

}
#signature .swiper-slide-active {
    scale: 1.2;
    opacity: 1;
    position: relative;
    z-index: 99;
}
#signature .swiper-slide-prev,
#signature .swiper-slide-next {
    filter: blur(0);
    opacity: 1;
    transition: 0.6s;
}

.signature_item {
    width:auto;
    height: 490px;
    flex-shrink: 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    /* transform: scale(0.8); */
    transition: transform 0.3s ease;
    transition: all 0.5s ease-in-out;
}
.sig_title {
    margin-top: 30px;
    font-size: 18px;
    color: #333;
    font-weight: bold;
 }
 .category_name { 
    font-family: "bodoni-urw", serif;
    color: #715050;
 }
.sg01 { background-color: #F1CACA; }
.sg02 { background-color: #EE8884; }
.sg03 { background-color: #722D4C;
}
.sg04 { background-color: #FFC4C4; }
.sg05 { background-color: #F2A0B8; }
.sg03>.sig_title { 
    color: #fff;
}
.add_cart {
    text-align: right;
    width: 100%;
    padding: 10px 15px;
     border-top: 3px solid #fff;}

/* section6 :: experience */
#experience { 
width: 100%;
height: 960px;
background: url(./img/bg_ok.png) no-repeat;
background-position: bottom right;
}

.experience_wrap {
width:100%;
height: 100%;
margin: auto;
display: flex;
align-items: center;
}

.exper_text {
font-size: 14px;
margin: 30px 0 50px;
}
.tour_wrap { 
    display: flex;
    gap: 50px;

}
.tour_item { 
    width:300px; 
    height: 448px;
    padding: 24px;
    color: #fff;
    position: relative;
    font-size: 14px;
 }
.tour_title { 
    font-size:30px ;
    font-weight: 500;
    font-family: "bodoni-urw", serif;
    border-bottom: 1px solid #fff;
    margin: 20px 0;
}
.tour_item.classic { background-image: url(./img/exper_bg01.png); }
.tour_item.explorers { background-image: url(./img/exper_bg02.png); }
.tour_item.pioneers { background-image: url(./img/exper_bg03.png); }
.tour_item .tit { font-size: 14px; padding: 5px 0;}
.tour_item li { padding: 5px 0;
    font-size: 12px;
}
.tour_item li:nth-child(even) { 
    border-bottom: 1px solid rgba(255,255,255,0.6);
}

.btn_tour { 
    width: 220px;
    height:40px;
    background-color: #fff;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 50%; bottom: 30px;
    transform: translateX(-50%);
    transition: 1s;
}
.btn_tour:hover { 
    background-color: rgba(255,255,255,0.6);
}
/* section8 :: contact us */
#contact_us { 
    width: 100%;
    height: 960px;
    background: url(./img/bg_contact_us.png);
    background-position: center;
}
.contact_wrap { 
    width: 100%; height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.title.wt { color: #fff;}

.collective_wrap { 
    display: flex;
    align-items: center;
    justify-content: center;
    gap:20px;
}
.collective { position: relative;}
.collective_form { 
    width:589px ;
    height: 569px;
    background: url(./img/contact_bg.png) no-repeat;
    color: #fff;
    padding: 20px;
}
.collec_title { 
    font-family: "Noto Sans", sans-serif;
        font-size: 22px;
        font-weight: 500;
}
.collective_form label { 
    font-family: "bodoni-urw", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 22px;
}

.collective_form>div { 
    margin: 10px 0 ;
}
.collective_form input {
    /* display: block; */
    width: 100%;
    height: 50px;
    border:1px solid #fff;
    background-color: #D75408;
    margin-top: 10px;
}
.inputbox_name { 
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap:20px;
}
.agr_text { 
    font-size: 16px;
    color: rgba(255,255,255,0.5);
    text-align: center;
}
.visit, .tours {
    background-color: #fff;
    width: 310px; height: 560px;
    position: relative;
}

.visit>.img_box, .tours>.img_box { 
    border-top: 1px solid #fff;
}
.visit>.text_box, .tours>.text_box { 
    padding: 30px;
    font-size: 12px;
}
.collec_title { font-size:22px ;
    letter-spacing: -1px;
    text-transform: uppercase;
    margin-bottom: 20px;

}
/* button style */
.btn_contact { 
    font-family: "abril-fatface", serif;
    width: 255px; height: 50px;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    background-color:#D75408 ;
    color: #fff;
    transition: 0.4s;
}

.collective .btn_contact { 
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 30px;
}

.btn_contact:hover {
    border:1px solid #D75408;
    background-color: #fff;
    color: #D75408;
}

.wt { color: #fff;}
.collective .wt { 
    color:#D75408;
    background-color: #fff;
    transition: 0.4s;
}
.collective .wt:hover {
    color: #fff;
    background-color: #D75408;
    border: 1px solid #fff;
}
.visit .btn_contact, .tours .btn_contact { 
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 30px;
}
footer { 
    width:100%; height: 700px;
    background-color: #1E1A1A;
}
.footer_wrap { 
    width: 80%;
    padding-top: 120px;
    margin: 0 auto; 
    color: #fff;
    position: relative;
}
.footer_menu { 
    display: flex;
    gap: 80px;
    text-transform: uppercase;
    margin-bottom: 80px;
    font-size: 22px;
}
.sns_group { 
    display: flex;
    gap: 150px;
    margin-bottom: 70px;
}
.sns_title { 
    font-size:14px ;
    font-weight: 400;
    text-transform:uppercase;
    margin-bottom: 20px;
}
.sns_list { 
    display: flex;
    gap: 50px;
    font-size: 20px;
    font-weight: 600;
}
.copyright { color: rgba(255,255,255,0.5);
    font-weight: 400;
}
.copy01 { margin-bottom: 15px;
}
.copy02 { font-size: 12px;}
.footer_logo { 
    position: absolute;
    right: 0;
    bottom: 0;
}