/* section{position: relative;overflow: hidden;} */

/* new */
.new{padding: 20vw 0;}
.new_cont{max-width: 86.666vw;margin: 0 auto 20vw;}
.new_cont:last-child{margin-bottom: 0;}
.new_box{position: relative;overflow: hidden;}
.new_box02{width: 100%;height: 86.5333vw;}
.new_box_bg{width: 100%;height: 86.5333vw;}
.new_cont01 .new_box_bg{background-image: url('../img/page/brand/new_box_bg01.jpg');}
.new_cont02 .new_box_bg{background-image: url('../img/page/brand/new_box_bg02.jpg');}
.new_cont03 .new_box_bg{background-image: url('../img/page/brand/new_box_bg03.jpg');}
.new_cont04 .new_box_bg{background-image: url('../img/page/brand/new_box_bg04.jpg');}
.new_box_frame{width: 100%;height: 100%;}
.new_cont01 .new_box_frame{background-image: url('../img/page/brand/new_box_frame01.png');}
.new_cont02 .new_box_frame{background-image: url('../img/page/brand/new_box_frame02.png');}
.new_cont03 .new_box_frame{background-image: url('../img/page/brand/new_box_frame03.png');}
.new_cont04 .new_box_frame{background-image: url('../img/page/brand/new_box_frame04.png');}
.new_box .twrap{color: var(--red);padding-left: 6.6667vw;margin-bottom: 9.3333vw;}
.new_box .box_tit{margin-bottom: 5.3333vw;font-size: 6.6667vw;font-family: var(--est);letter-spacing: -0.03em;line-height: 1.24;font-weight: 900;}
.new_box .box_txt01{font-size: 4.6667vw;font-weight: 700;line-height: 1.34;letter-spacing: -0.05em;margin-bottom: 2vw;}
.new_box .box_txt02{font-size: 4vw;line-height: 1.4;letter-spacing: -0.05em;}
.new_cont03 .box_txt02:last-of-type{margin-top: 2vw;}

/* kind */
.kind{position: relative;height: 119.7333vw;overflow: hidden;}
.kind_bg{background-image: url('../img/page/brand/kind_bg.jpg');}
.kind .twrap{text-align: center;color: var(--red);padding-top: 20vw;}
.kind .twrap h2{font-family: var(--est);letter-spacing: -0.05em;}
.kind_tit01{font-size: 6.6667vw;font-weight: 500;}
.kind_tit02{margin-top: 2.4vw;font-size: 9.3333vw;font-weight: 900;}
.kind .detail{margin-top: 5.2vw;font-size: 4vw;line-height: 1.4;letter-spacing: -0.05em;}

/* meet */
.meet{padding-top: 20vw;padding-bottom: 20vw;}
.meet .sub{font-size: 4.6667vw;font-weight: 700;letter-spacing: -0.05em;margin-top: 5.2vw;}
.meet .detail{font-size: 4vw;letter-spacing: -0.05em;line-height: 1.4;margin-top: 2vw;}
.meet_list{max-width: 73.3333vw;width: 100%;margin: 9.3333vw auto 0;box-sizing: border-box;}
.meet_li{position: relative;margin-bottom: 8vw;}
.blinks .blink{position: absolute;left: 50%;transform: translateX(-50%);top: 0;width: 19.0667vw;height: 19.0667vw;}
.blinks .blink img{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}

.meet .bi_box{max-width: 92vw;margin: 20vw auto 0;}
.meet .bi_box .box_tit{letter-spacing: 0;}
.meet .bi_box .mask{padding-top: 20vw;padding-bottom: 20vw;background-color: #f5f5f5;}
.meet .bi_box_list{width: 100%;margin: 10.2667vw auto 0;}
.meet .bi_box_list li{width: 78.6667vw;margin: 0 auto;}
.meet .bi_box .top_txt{font-size: 3.7333vw;font-weight: 700;letter-spacing: 0;line-height: 8vw;border-bottom: 1px solid var(--red);}
.meet_bi_box_logo{width: 40.2667vw;margin: 9.3333vw auto;}
.meet_bi_symbol{width: 24.1333vw;margin: 9.3333vw auto 0;}

/* needs */
.needs{width: 100%;color: #fff;overflow: hidden;}
.needs_in{position: relative;padding-top: 20vw;padding-left: 13.333vw;padding-right: 13.333vw;box-sizing: border-box;}
.needs_in01{height: 196vw;background-image: url('../img/page/brand/needs_bg.jpg');background-size: cover;background-position: center;background-repeat: no-repeat;}
.needs_in02{height: 260.3333vw;background-image: url('../img/page/brand/needs_bg02.jpg');background-size: cover;background-position: center;background-repeat: no-repeat;}
.needs_in03{height: 214vw;background-image: url('../img/page/brand/needs_bg03.jpg');background-size: cover;background-position: center;background-repeat: no-repeat;}
.needs_bg_deco{position: absolute;top: 54.6667vw;left: 50%;transform: translateX(-50%);width: 100%;}
.needs_bg_deco .bg_txt{font-family: 'EASTARJET';font-size: 16vw;font-weight: 900;white-space: nowrap;text-align: center;color: #201209;opacity: 0.65;}
.needs_sl{position: relative;}
.needs_tit{line-height: 1.2;margin-bottom: 6.6667vw;}
.needs_object{width: 33.3333vw;margin: 0 auto 6.8vw;}

.needs .hover_txts{width: 100%;height: auto;color: var(--est);align-items: center;margin-bottom: 7.7333vw;}
.needs .hover_txt{position: relative;}
.needs .hover_txts .bean{width: 9.3333vw;margin-right: 6vw;}
.needs .hover_txt .flex{align-items: center;}
.needs .hover_txt.on{display: block;}
.needs .hover_txt01{letter-spacing: -0.05em;}
.needs .hover_txt .sub_tit{font-size: 4.6667vw;margin-bottom: 2vw;}
.needs .hover_txt .detail{font-size: 4vw;line-height: 1.4;}

.needs_in02 .taste{width: 73.333vw;margin-top: 7.333vw;}


.btm_txts{margin-top: 8vw;}
.needs .btm_tit{font-size: 6vw;margin-bottom: 3.4667vw;line-height: 1.26;}
.needs .btm_txt01{font-size: 4.6667vw;margin-bottom: 2vw;font-weight: 700;}
.needs .btm_txt02{font-size: 4vw;line-height: 1.4;margin-bottom: 8vw;}
.needs_sl02 .btm_txt02{margin-bottom: 0;}
.needs .drink_hover{display: flex;top: 70vw;}
.needs .drink_hover li{width: 24vw;height: 24vw;margin-right: 1.3333vw;border-radius: 50%;border: 1px solid transparent;background-size: cover;background-position: center;box-sizing: border-box;
-webkit-background-size: cover;
background-clip: content-box;
}
.needs .drink_hover li.swiper-pagination-bullet-active{border: 0.4vw solid #efd7b0;}

.needs_in01 .drink_hover li:first-child{background-image: url('../img/page/brand/needs_hover01_01_new.png');}
.needs_in01 .drink_hover li:nth-child(2){background-image: url('../img/page/brand/needs_hover01_02_new.png');}

.needs_in02 .drink_hover li:first-child{background-image: url('../img/page/brand/needs_hover02_01_new.png');}
.needs_in02 .drink_hover li:nth-child(2){background-image: url('../img/page/brand/needs_hover02_02_new.png');}
.needs_in02 .drink_hover li:nth-child(3){background-image: url('../img/page/brand/needs_hover02_03_new.png');}

/* coffee */
.coffee{height: 93.3333vw;overflow: hidden;}
.coffee_bg{background-image: url('../img/page/brand/coffee_bg.jpg');}

/* how */
.how{padding-top: 20vw;padding-bottom: 20vw;background-color: var(--red);border-bottom: 1px solid #fff;}
.how .tit{letter-spacing: -0.03em;color: #fff;}
.how .detail{margin-top: 4.6667vw;line-height: 1.4;}
.brand_youtube_zone{padding-top: 7.2vw;max-width: 86.6667vw;margin: 0 auto;}
.brand_youtube_zone .left{width: 86.6667vw;}
.youtube_playing_box_wrap{position: relative;width: 100%;height: 76.933vw;}
.youtube_playing_box{width: 100%;height: 48.8vw;background-color: #000;}
.youtube_playing_box iframe{object-fit: cover;}

/* .youtube_playing_box_wrap .mb_paging{position: absolute;bottom: 5.333vw;left: 50%;transform: translateX(-50%);} */
.youtube_playing_box_wrap .mb_paging{padding-top: 3.333vw;}
.youtube_playing_box_wrap .mb_paging li{position: relative;z-index: 1;background-size: cover;width: 4vw;height: 4vw;margin-left: 2.666vw;background-image: url('../img/main/mb_paging01.png');}
.youtube_playing_box_wrap .mb_paging li:nth-child(1n){transform: rotate(0deg);}
.youtube_playing_box_wrap .mb_paging li:nth-child(2n){margin-left: 2.666vw;background-image: url('../img/main/mb_paging01.png');transform: rotate(180deg);}
.youtube_playing_box_wrap .mb_paging li:nth-child(3n){margin-left: -1.333vw;background-image: url('../img/main/mb_paging01.png');transform: rotate(0deg);}
.youtube_playing_box_wrap .mb_paging li:nth-child(4n){margin-left: 2.666vw;background-image: url('../img/main/mb_paging01.png');transform: rotate(90deg);}
.brand_youtube_zone .mb_paging li:nth-child(5n){margin-left: -1.333vw;transform: rotate(270deg);}
.youtube_playing_box_wrap .mb_paging li.on{background-image: url('../img/main/mb_paging01_on.png');}

.youtube_playing_title{margin-top: 5.2vw;font-size: 6vw;letter-spacing: -0.03em;font-weight: 900;font-family: var(--est);line-height: 1.3;}
.youtube_info{display: inline-flex;align-items: center;justify-content: center;margin-top: 3.8667vw;padding: 0 1.6vw;background-color: #fff;font-size: 4vw;line-height: 7.3333vw;color: var(--red);}
.youtube_info span{font-weight: 700;white-space: nowrap;}
.youtube_info .region{max-width: 33.333vw;margin: 0;margin-right: 1.6vw;box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;}
.youtube_info .point{max-width: 18vw;margin: 0;margin-left: 1.6vw;overflow: hidden;text-overflow: ellipsis;}
.youtube_detail{margin-top: 4vw;line-height: 1.4;}
.go_youtube_btn{display: block;width: 24vw;height: 24vw;padding-top: 7.2vw;border-radius: 50%;border: 1px solid rgba(255,255,255,0.5);box-sizing: border-box;font-size: 3.7333vw;font-weight: 700;letter-spacing: 0;text-align: center;}
.go_youtube_btn img{margin-bottom: 2vw;}
.how_play_ico{width: 2.6667vw;}
.brand_youtube_zone .youtube_search form{display: flex;}
.brand_youtube_zone .youtube_search input[type="text"]{width: 34.1333vw;height: 10.6667vw;border: none;border-right: 1px solid var(--red);border-radius: 5.3333vw 0 0 5.3333vw;padding-left: 5.0667vw;box-sizing: border-box;}
.brand_youtube_zone .youtube_search input[type="text"]::placeholder {
    color: var(--red);font-size: 3.7333vw;font-family: 'SUIT';letter-spacing: -0.05em;font-weight: 400;opacity: 0.5;}
.brand_youtube_zone .youtube_search select{
    width: 21.0667vw;height: 10.6667vw;padding: 0 2.6667vw;border: none;box-sizing: border-box;font-size: 3.7333vw;letter-spacing: -0.05em;font-family: 'SUIT';color: var(--red);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('../img/page/brand/select_arr.png'); /* 화살표 이미지 파일 경로 */
    background-size: 2vw 1.3333vw;
    background-position: 85% center; /* 화살표 위치 설정 */
    background-repeat: no-repeat; /* 화살표 반복 설정 */
    padding-right: 2.6667vw;
}
.brand_youtube_zone .youtube_search select:nth-child(3){border-right: 1px solid var(--red);}
.brand_youtube_zone .youtube_search select option{color: #000;}
.brand_youtube_zone .youtube_search .region_btn{width: 10.6667vw;height: 10.6667vw;border-radius: 0 5.3333vw 5.3333vw 0;background-color: #000;border: none;font-size: 0;
    background-image: url('../img/page/brand/sch_ico.png');
    background-size: 4.6667vw 4.6667vw; /* 배경 이미지 크기 조절 */
    background-repeat: no-repeat;
    background-position: 45% 47%;
}
.brand_youtube_zone .right{margin-top: 13.3333vw;}
.youtube_lists{flex-wrap: wrap;width: 100%;margin: 8vw 0;box-sizing: border-box;justify-content: space-between;}
.youtube_list{width: 42vw;margin-bottom: 3.3333vw;}
.youtube_list:nth-child(odd){margin-right: 0;}
.youtube_list:nth-last-child(-n+2){margin-bottom: 0;}
.youtube_list .thumb{position: relative;width: 100%;height: 23.6vw;background-color: #000;}
.youtube_list .text{height: 10vw;}
.youtube_list .text p{font-size: 4vw;white-space: nowrap;}
.youtube_list .nickname{margin-left: 1.333vw;text-overflow: ellipsis;overflow: hidden;}

.youtube_list_paging{height: 6.6667vw;margin-top: 8vw;}
.youtube_list_paging .paging_list{align-items: center;}
.youtube_list_paging button{width: 1.7333vw;height: 3.3333vw;margin: 1.6vw;}
.youtube_list_paging .paging_list li{width: 6.6667vw;height: 6.6667vw;}
.paging_list li a{display: block;text-align: center;width: 100%;height: 100%;line-height: 6vw;font-size: 3.7333vw;}
.youtube_list_paging button{background-image: url('../img/page/brand/youtube_list_prev_btn.png');background-repeat: no-repeat;background-size: contain;}
.youtube_list_paging .paging_list li{display: flex;align-items: center;justify-content: center;border: 1px solid rgba(255,255,255,.5);margin-right: 2vw;box-sizing: border-box;}
.youtube_list_paging .paging_list li:first-child{margin-left: 10px;}
.youtube_list_paging .paging_list li.on{border: none;background-color: #fff;color: var(--red);}
.youtube_list_paging button.next_btn{transform: rotateY(180deg);}
.paging_list .paging_ul {display: flex;}