@charset "utf-8";
/* CSS Document */
/* -------------------- 슬라이드 배너 ------------------- */
#slide_banner{position: relative; top: 100px; width: 1300px; height: 750px; margin: 0 auto; background: #ccc;}
#slide_banner .swiper-container{height: 100%;}
#slide_banner .swiper-container .swiper-wrapper{}
#slide_banner .swiper-container .swiper-wrapper .swiper-slide.slide1{background: url("../img/main128.gif") 60% center no-repeat;}
#slide_banner .swiper-container .swiper-wrapper .swiper-slide.slide2{background: url("../img/main122.png") center center no-repeat;}
#slide_banner .swiper-container .swiper-wrapper .swiper-slide.slide3{background: url("../img/main118.png") 60% center no-repeat;}
#slide_banner .swiper-container .swiper-wrapper .swiper-slide.slide4{background: url("../img/main109.png") 65% center no-repeat;}
#slide_banner .swiper-container .swiper-wrapper .swiper-slide.slide5{background: url("../img/main100.png") center center no-repeat;}

/* 배너 텍스트 */
#slide_banner .text-box{position: absolute; left: 70px; top: 150px; width: 350px; word-break: keep-all;}
#slide_banner .text-box small{font-size: 16px; font-weight: 300;}
#slide_banner .text-box h3{font-size: 50px; padding: 10px 0;}
#slide_banner .text-box	p{font-size: 18px; padding: 30px 0;}
#slide_banner .text-box a{display: flex; justify-content: center; align-items: center; width: 180px; padding: 15px 0; border-radius: 5px; background: rgba(255,255,255,0.5);}

/* 더보기 버튼 */
#slide_banner .text-box a .more{transition: all 0.3s;}
#slide_banner .text-box a .circle{display: inline-block; width: 20px; height: 20px; margin-left: 20px; border-radius: 20px; background: rgba(119,119,119,0.5);}
#slide_banner .text-box a .circle .arrow{position: relative; left: -25px; top: -15px; transition: all 0.3s;}
#slide_banner .text-box a .circle .arrow img{width: 50px;}

#slide_banner .text-box a:hover .more{opacity: 0.7;}
#slide_banner .text-box a:hover .arrow{left: -5px;}

/* 배너 리스트 bullet */
#slide_banner .swiper-pagination.pagination-circle{position: absolute; top: 40%; right: 30px;}
#slide_banner .swiper-pagination-bullet{display: block; width: 10px; height: 10px; margin: 10px 0; background: rgba(255,255,255,0.5); opacity:1; transition: 0.3s;}
#slide_banner .swiper-pagination-bullet-active{background: #fff;}

/* 배너 목록 버튼 */
#slide_banner .btn{position: absolute; z-index: 2; left: 70px; bottom: 30px; width: 150px; height: 60px; border-radius: 70px; background: rgba(200,200,200,0.8);}
#slide_banner .btn button{}
#slide_banner .btn button.swiper-button-prev{background: url("../img/banner_left.png") center center no-repeat; background-size: 20px 30px;}
#slide_banner .btn button.swiper-button-next{background: url("../img/banner_right.png") center center no-repeat; background-size: 20px 30px;} 
#slide_banner .btn span{position: absolute; right: 50px; top: 17px; font-size: 20px; font-weight: 600; color: rgba(230,230,230,1);}
#slide_banner .swiper-slide .num{position: absolute; left: 120px; bottom: 48px; font-size: 20px; font-weight: 600; color: #000;}

/* 배너 리스트 fraction */
#slide_banner .swiper-pagination.pagination-num{position: absolute; left: 35px; top: 15px; width:	80px; font-family: "Lexend Deca"; font-size: 23px; color: rgba(255,255,255,0.8);}
#slide_banner .swiper-pagination.pagination-num .swiper-pagination-current{left: 10px; top: 0; font: inherit; color: #fff;}
#slide_banner .swiper-pagination.pagination-num .swiper-pagination-total{right: 12px; top: 0; font: inherit;} 


/* 메인 영역 */
#main{}
/* -------------------- 섹션1 : 탄소 중립 실천 기업 ------------------- */
#eco{position: relative; width: 1300px; margin: 250px auto 0; letter-spacing: -0.075em;}
#eco>p{padding-bottom: 30px; text-align: center;}
#eco>p span.top_txt{padding: 12px 25px; border-radius: 25px; font-size: 20px; font-weight: 600; line-height: 1.4; background: rgb(50, 184, 164); background: linear-gradient(36deg, rgba(50, 184, 164, 1) 0%, rgba(144, 235, 168, 1) 100%); color: #fff;}
#eco p span.blink{display: block; padding: 30px 0 20px 0; font-size: 35px; font-weight: 600; animation: blink 0.5s ease-in-out infinite alternate;}
#eco p u{display: inline-block; text-decoration: none; height: 20px; line-height: 100%; font-size: 20px; font-weight: 700; background: linear-gradient(to top, #ffb400 22%, transparent 0%);}
#eco h2{padding: 10px 0 50px;}
#eco .story-box{}
#eco .story-box ul.eco_tabs{display: flex; justify-content: center; margin-bottom: 50px;}
#eco .story-box ul.eco_tabs li{margin: 0 10px;}
#eco .story-box ul.eco_tabs li button{display: flex; align-items: center; height: 100px; padding: 10px 30px; border: 3px solid var(--color-main); border-radius: 100px; font-size: 23px; font-weight: 500; background: #fff; transition: 0.3s;}
#eco .story-box ul.eco_tabs li button.on{background: var(--color-main); color: #fff;}
#eco .story-box ul.eco_tabs li button span{color: inherit;}
#eco .story-box ul.eco_tabs li button span .small{font-size: 19px; color: inherit;}

#eco .story-box ul.eco_tabs li:hover button{background: var(--color-main); color: #fff;}
#eco .story-box .eco_tab_wrap{height: 450px;}
#eco .story-box .eco_tab_wrap::after{content: ''; position: absolute; right: -4%; bottom: -5%; z-index: -1; width: 45%; height: 240px; border-radius: 50px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}


/* 탭 1 ----------------*/
#eco .story-box .eco_tab1{position: absolute; z-index: -999; display: flex; opacity: 0; width: 100%; height: 450px; justify-content: space-around; align-items: center;}
#eco .story-box .eco_tab1.on{z-index: 1; opacity: 1;}
#eco .story-box .eco_tab1 .eco_article{display: flex; align-items: center; width: 350px; padding-left: 10px;}
#eco .story-box .eco_tab1 .eco_article .article_wrap{}
#eco .story-box .eco_tab1 .eco_article .article_wrap h3{margin: 10px 0; font-size: 16px; line-height: 1.4; }
#eco .story-box .eco_tab1 .eco_article .article_wrap strong{font-size: 25px;}
#eco .story-box .eco_tab1 .eco_article .article_wrap p{margin: 25px 0;}


#eco .story-box .eco_tab1 .right_side{display: flex; justify-content: space-between; align-items: center; width: calc(100% - 370px); height: 430px; padding: 40px 30px 40px 40px; border-radius: 50px 5px 5px 5px; background: url("../img/se10_esg_bg01_2.jpg") center center no-repeat; background-size: cover;}
#eco .story-box .eco_tab1 .right_side::after{}
#eco .story-box .eco_tab1 .right_side .green{font-weight: bold; color: var(--color-green);}
#eco .story-box .eco_tab1 .right_side .txt-box{color: #fff;}
#eco .story-box .eco_tab1 .right_side .txt-box .text_1{font-size: 30px; font-weight: 600; color: inherit;}
#eco .story-box .eco_tab1 .right_side .txt-box .bar{display: inline-block; width: 40px; height: 2px; margin: 50px 0 10px 0; background: #fff;}
#eco .story-box .eco_tab1 .right_side .txt-box .text_2{font-size: 20px; font-weight: 600; margin-bottom: 20px; color: inherit;}
#eco .story-box .eco_tab1 .right_side .txt-box .text_3{font-size: 16px; color: inherit;}
#eco .story-box .eco_tab1 .right_side .frame{}
#eco .story-box .eco_tab1 .right_side .frame img{width: 370px;}

/* 탭 2 ----------------*/
#eco .story-box .eco_tab2{position: absolute; z-index: -999; display: flex; opacity: 0; width: 100%; height: 450px; justify-content: space-around; align-items: center;}
#eco .story-box .eco_tab2.on{z-index: 1; opacity: 1;}
#eco .story-box .eco_tab2 .eco_article{display: flex; align-items: center; width: 350px; padding-left: 10px;}
#eco .story-box .eco_tab2 .eco_article .article_wrap{}
#eco .story-box .eco_tab2 .eco_article .article_wrap>img{display: block; width: 60px;}
#eco .story-box .eco_tab2 .eco_article .article_wrap h3{margin: 10px 0; font-size: 16px; line-height: 1.4; }
#eco .story-box .eco_tab2 .eco_article .article_wrap strong{font-size: 25px;}
#eco .story-box .eco_tab2 .eco_article .article_wrap p{margin: 25px 0;}


#eco .story-box .eco_tab2 .right_side{display: flex; justify-content: space-between; align-items: center; width: calc(100% - 370px); height: 430px; padding: 40px 30px 40px 40px; border-radius: 50px 5px 5px 5px; background: url("../img/se10_esg_bg01.jpg") center center no-repeat; background-size: cover;}
#eco .story-box .eco_tab2 .right_side::after{content: ''; position: absolute; right: -4%; bottom: -10%; z-index: -1; width: 45%; height: 240px; border-radius: 50px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}
#eco .story-box .eco_tab2 .right_side .green{font-weight: bold; color: var(--color-green);}
#eco .story-box .eco_tab2 .right_side .txt-box{color: #fff;}
#eco .story-box .eco_tab2 .right_side .txt-box .text_1{font-size: 30px; font-weight: 600; color: inherit;}
#eco .story-box .eco_tab2 .right_side .txt-box .bar{display: inline-block; width: 40px; height: 2px; margin: 70px 0 10px 0; background: #fff;}
#eco .story-box .eco_tab2 .right_side .txt-box .text_2{font-size: 20px; font-weight: 600; margin-bottom: 20px; color: inherit;}
#eco .story-box .eco_tab2 .right_side .txt-box .text_3{font-size: 16px; color: inherit;}
#eco .story-box .eco_tab2 .right_side .frame{}
#eco .story-box .eco_tab2 .right_side .frame img{width: 370px;}

/* 탭 3 -------------*/
#eco .story-box .eco_tab3{position: absolute; z-index: -999; display: flex; opacity: 0;  width: 100%; height: 500px; justify-content: space-around; align-items: center;}
#eco .story-box .eco_tab3.on{z-index: 1; opacity: 1;}
#eco .story-box .eco_tab3 .eco_article{display: flex; align-items: center; width: 350px; padding-left: 10px;}
#eco .story-box .eco_tab3 .eco_article .article_wrap{}
#eco .story-box .eco_tab3 .eco_article .article_wrap>img{display: block; width: 60px;}
#eco .story-box .eco_tab3 .eco_article .article_wrap h3{margin: 10px 0; font-size: 16px; line-height: 1.4; }
#eco .story-box .eco_tab3 .eco_article .article_wrap strong{font-size: 25px;}
#eco .story-box .eco_tab3 .eco_article .article_wrap p{margin: 25px 0;}

#eco .story-box .eco_tab3 .right_side{display: flex; justify-content: space-between; align-items: center; width: calc(100% - 370px); height: 500px; border-radius: 50px 5px 5px 5px; overflow: hidden; background: #000;}
#eco .story-box .eco_tab3 .right_side::after{content: ''; position: absolute; right: -4%; bottom: -10%; z-index: -1; width: 45%; height: 240px; border-radius: 50px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}
#eco .story-box .eco_tab3 .right_side video{width: 100%; height: 100%;}

/* 탭 4 -------------*/
/* display none으로 숨기지 말고, position, z-index, opacity 등으로 없애기 (스와이퍼랑 충돌함) */
#eco .story-box .eco_tab4{position: absolute; z-index: -999; display: flex; width: 100%; height: 450px; margin-bottom: 250px; justify-content: space-around; align-items: center; opacity: 0;}
#eco .story-box .eco_tab4.on{z-index: 1; opacity: 1;}
#eco .story-box .eco_tab4 .eco_article{display: flex; align-items: center; width: 350px; padding-left: 10px;}
#eco .story-box .eco_tab4 .eco_article .article_wrap{}
#eco .story-box .eco_tab4 .eco_article .article_wrap .logo_grid{display: grid; grid-template-columns: repeat(4, 60px); grid-gap: 10px;}
#eco .story-box .eco_tab4 .eco_article .article_wrap .logo_grid img{display: block; width: 60px; border-radius: 60px; box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);}
#eco .story-box .eco_tab4 .eco_article .article_wrap h3{margin: 10px 0; font-size: 16px; line-height: 1.4;}
#eco .story-box .eco_tab4 .eco_article .article_wrap strong{font-size: 25px;}
#eco .story-box .eco_tab4 .eco_article .article_wrap p{margin: 25px 0;}

/* 탭 4 슬라이드 */
.eco_tab4 .venture_tea{position: relative; width: calc(100% - 370px); height: 430px;}
#eco .story-box .eco_tab4 .venture_tea::after{content: ''; position: absolute; right: -5%; bottom: -10%; z-index: -1; width: 60%; height: 240px; border-radius: 50px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}

/* 공통 속성 */
.eco_tab4 .swiper-container{height: 100%; border-radius: 50px 5px 5px 5px;}
.eco_tab4 .swiper-container .swiper-wrapper{}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide{display: flex; justify-content: space-between; align-items: center; padding: 40px 30px 40px 40px; background-color: #412a0a;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box{display: flex; flex-wrap: wrap; width: 50%; height: 100%; color: #fff;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box .text_top{font-size: 30px; font-weight: 600; color: inherit;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box .text_bottom{color: #fff;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box .text_bottom .bar{display: inline-block; width: 40px; height: 2px; margin: 30px 0 10px 0; background: #fff;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box .text_bottom .text_2{font-size: 20px; font-weight: 600; margin-bottom: 20px; color: inherit;}
.eco_tab4 .swiper-container .swiper-wrapper .swiper-slide .text-box .text_bottom .text_3{font-size: 16px; color: inherit;}

.eco_tab4 .swiper-container .swiper-pagination{}
.eco_tab4 .swiper-container .swiper-pagination-bullet{background: #fff;}
.eco_tab4 .swiper-pagination-bullet-active{background: #fff;}

/* 개별 속성 */
.eco_tab4 .swiper-container .swiper-wrapper .slide1{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg.jpg);}
.eco_tab4 .swiper-container .swiper-wrapper .slide2{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg.jpg);}
.eco_tab4 .swiper-container .swiper-wrapper .slide3{}
.eco_tab4 .swiper-container .swiper-wrapper .slide4{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_JAS.png); background-position: 100% 50%; background-size: cover;}
.eco_tab4 .swiper-container .swiper-wrapper .slide5{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_vegan.png); background-position: 72% 50%; background-size: cover;}
.eco_tab4 .swiper-container .swiper-wrapper .slide6{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_ceylon.png); background-position: 65% 50%; background-size: cover;}
.eco_tab4 .swiper-container .swiper-wrapper .slide7{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_rainforest.png); background-position: 110% 50%; background-size: cover;}
.eco_tab4 .swiper-container .swiper-wrapper .slide8{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_EU.png); background-position: 80% 50%; background-size: cover;}
.eco_tab4 .swiper-container .swiper-wrapper .slide9{background-image: url(https://pic.dessert39.com/www/img/franchise/competitiveness/se10_tea_bg_ozone.png); background-position: 80% 50%; background-size: cover;}

.eco_tab4 .swiper-container .swiper-slide .frame{}
.eco_tab4 .swiper-container .swiper-slide .frame img{width: 420px;}
.eco_tab4 .txt_top{position: absolute; z-index: 1; left: 40px; top: 40px; font-size: 30px; font-weight: 600; line-height: 1.3; color: #fff;}



/* -------------------- 섹션 2 : 디저트 + 음료 (공통 속성) ------------------- */
#product{width: 1300px; margin: 200px auto 0; text-align: center; letter-spacing: -0.075em;}
#product h2{margin-bottom: 80px;}
#product .swiper-container{width: 85%; margin-bottom: 30px;}
#product .swiper-container .swiper-wrapper{}
#product .swiper-container .swiper-wrapper .swiper-slide{}
#product .swiper-container .swiper-wrapper .swiper-slide .inner_img{padding: 40px;}
#product .swiper-container .swiper-wrapper .swiper-slide .inner_img img{width: 80%;}
#product .swiper-container .swiper-wrapper .swiper-slide .inner_txt{padding: 0 50px;}
#product .swiper-container .swiper-wrapper .swiper-slide .inner_txt h3{font-size: 16px; font-weight: 600;}
#product .swiper-container .swiper-wrapper .swiper-slide h3 span{background-image: linear-gradient(transparent calc(100% - 2px), #1c1c1c 2px); background-repeat: no-repeat; background-size: 0 100%; transition: background-size 0.7s;}

#product .btn_slider_box{position: relative; display: flex; justify-content: space-between; align-items: center; width: 100%; height: 50px; margin-bottom: 30px;}
#product .btn_slider_box button{position: static; display: block; width: 35px; height: 35px; margin-top: 2px;}
#product .btn_slider_box button.swiper-button-prev{background: url("../img/btn-slider-arrow.svg") center center no-repeat; background-size: 35px 35px; transform: rotate(180deg);}
#product .btn_slider_box button.swiper-button-next{background: url("../img/btn-slider-arrow.svg") center center no-repeat; background-size: 35px 35px;}
#product .btn_slider_box .swiper-pagination{position: static; width: 85%; height: 2px; margin: 0 auto;}
#product .btn_slider_box .swiper-pagination-progressbar{}
#product .btn_slider_box .swiper-pagination-progressbar-fill{background: #555;}

#product .swiper-container .swiper-wrapper .swiper-slide:hover img{animation: menu_ani 0.8s ease alternate;}
#product .swiper-container .swiper-wrapper .swiper-slide:hover .inner_txt h3 span{background-size: 100% 100%;}


/* 섹션 2 개별 속성 */
#beverage h2{margin: 150px 0 30px 0;}
#beverage>p{margin-bottom: 80px; font-weight: 500;}


/* -------------------- 섹션 3 : introduction ------------------- */
#intro{width: 1300px; margin: 200px auto 100px;}
#intro h2{margin-bottom: 50px;}
#intro .intro_wrap{display: flex; align-items: center;}
#intro .intro_wrap>div{position: relative; padding: 60px;}
#intro .intro_wrap .left{display: flex; flex-wrap: wrap; width: 50%;}
#intro .intro_wrap .left::before{content: ""; display: block; position: absolute; left: 0; top: 0; width: 80%; height: 30%; border-radius: 40px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}
#intro .intro_wrap .right{display: flex; flex-wrap: wrap; flex-direction: column-reverse; width: 50%; border-left: 1px solid #d3d3d2;}
#intro .intro_wrap .right::before{content: ""; display: block; position: absolute; right: 0; bottom: 0; width: 80%; height: 30%; border-radius: 40px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}
#intro .intro_wrap .left .img_box{border-radius: 50px 5px 5px 5px; overflow: hidden;}
#intro .intro_wrap .right .img_box{border-radius: 5px 5px 50px 5px; overflow: hidden;}
#intro .intro_wrap .img_box img{display: block; width: 100%; transform: scale(1); transition: 0.5s linear;}
#intro .intro_wrap .img_box img.active{transform: scale(1.05);}

#intro .intro_wrap .txt_box{padding: 30px 0;}
#intro .intro_wrap .txt_box h3{font-size: 33px; font-weight: 500;}
#intro .intro_wrap .txt_box p{padding: 10px 0 20px 0; font-size: 19px;}
#intro .intro_wrap .txt_box p span{font-weight: 700;}
#intro .intro_wrap .txt_box a{}

/* -------------------- 섹션 4 : Store Interior ------------------- */
#interior{width: 1300px; margin: 100px auto;}
#interior .interior_wrap{display: flex; padding: 80px 0;}
#interior .interior_wrap .left{position: relative; width: 50%;}
#interior .interior_wrap .left::after{content: ""; position: absolute; right: 15px; bottom: -80px; display: block; width: 200px; height: 500px; border-radius: 200px; background: url("../img/store_interior_bg.jpg") center center no-repeat; background-size: cover;}
#interior .interior_wrap .left .swiper-container{width: 540px; height: 540px; margin: 0;}
#interior .interior_wrap .left .swiper-container .swiper-slide{}
#interior .interior_wrap .left .swiper-container .swiper-slide .img_frame{position: relative; width: 100%; height: 100%; border-radius: 50% 50% 0 0; overflow: hidden;}
#interior .interior_wrap .left .swiper-container .swiper-slide .img_frame img{display: block; width: 100%;}

#interior .interior_wrap .right{position: relative; width: 50%; padding: 70px 50px;}
#interior .interior_wrap .right h2{text-align: left;}
#interior .interior_wrap .right a.arrow_more{width: 145px; margin-top: 50px;}
#interior .interior_wrap .right a.arrow_more .circle{margin-left: 20px;}
#interior .interior_wrap .right a.arrow_more .arrow{left: -25px; top: -15px; width: 50px; height: 50px;}
#interior .interior_wrap .right a.arrow_more .arrow img{width: 100%; height: 100%;}
#interior .interior_wrap .right a.arrow_more:hover .arrow{left: -5px;}

#interior .interior_wrap .right .btn_slider_box{display: flex;  width: 100%; height: 50px; margin-top: 180px;}
#interior .interior_wrap .right .btn_slider_box button{position: static; height: 100%; margin: 0; background: none;}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-prev{}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-prev::before{content: ""; position: relative; left: 0; top: 3px; display: block; width: 25px; height: 4px; background: #333; border-radius: 10px; transform: rotate(-45deg); transform-origin: left;}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-prev::after{content: ""; position: relative; left: 0; top: -3px;  display: block; width: 25px; height: 4px; background: #333; border-radius: 10px; transform: rotate(45deg); transform-origin: left;}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-next{transform: rotate(180deg)}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-next::before{content: ""; position: relative; left: 0; top: 3px; display: block; width: 25px; height: 4px; background: #333; border-radius: 10px; transform: rotate(-45deg); transform-origin: left;}
#interior .interior_wrap .right .btn_slider_box button.swiper-button-next::after{content: ""; position: relative; left: 0; top: -3px;  display: block; width: 25px; height: 4px; background: #333; border-radius: 10px; transform: rotate(45deg); transform-origin: left;}
#interior .interior_wrap .right .btn_slider_box .swiper-pagination{position: static; width: 25%;}
#interior .interior_wrap .right .btn_slider_box .swiper-pagination-fraction{font-size: 30px; line-height: 50px; font-family: "Lexend Deca", san-serif; font-weight: 500;}
#interior .interior_wrap .right .btn_slider_box .swiper-pagination-fraction .swiper-pagination-current{font-family: inherit;}
#interior .interior_wrap .right .btn_slider_box .swiper-pagination-fraction .swiper-pagination-total{font-family: inherit; color: #777;}
#interior .interior_wrap .right img.logo{position: absolute; right: 200px; bottom: 70px; height: 210px;}


/* -------------------- 섹션 5 : Event & News ------------------- */
#event{background: #f9fafb; padding: 50px 0;}
#event .inner{position: relative; width: 1300px; margin: 0 auto;}
#event h2{margin-bottom: 45px;}
#event .swiper-container{width: 1100px; margin: 50px auto;}
#event .swiper-container .swiper-slide{width: 25%; padding: 15px 0;}
#event .swiper-container .swiper-slide a{display: block; border-radius: 30px; overflow: hidden; background: #fff; box-shadow: 5px 5px 10px 0 rgba(0,0,0,0.1);}
#event .swiper-container .swiper-slide a .content{}
#event .swiper-container .swiper-slide a .content img{width: 100%;}
#event .swiper-container .swiper-slide a .content .text_box{padding: 20px;}
#event .swiper-container .swiper-slide a .content .text_box h3{margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-all;}
#event .swiper-container .swiper-slide a .content .text_box h3 span{color: #1c1c1c; font-size: 20px; letter-spacing: -1px; background-image: linear-gradient(transparent calc(100% - 2px), #1c1c1c 2px); background-repeat: no-repeat; background-size: 0 100%; transition: background-size 0.7s;}
#event .swiper-container .swiper-slide a .content .text_box small{color: #676767; font-size: 15px; font-weight: 300;}

#event .swiper-container .swiper-slide a:hover .content .text_box h3 span{background-size: 100% 100%;}

#event .arrow_btn{}
#event .arrow_btn button{display: flex; justify-content: center; align-items: center; width: 60px; height: 60px; border-radius: 60px; background: #c0c0c0;}
#event .arrow_btn button .arrow{}
#event .arrow_btn button.swiper-button-prev{left: 0;}
#event .arrow_btn button.swiper-button-prev .arrow{display: block; width: 80%; height: 80%; background: url("../img/btn-slider-arrow-white.svg") center center no-repeat; background-size: cover; transform: rotate(180deg);}
#event .arrow_btn button.swiper-button-next{right: 0;}
#event .arrow_btn button.swiper-button-next .arrow{display: block; width: 80%; height: 80%; background: url("../img/btn-slider-arrow-white.svg") center center no-repeat; background-size: cover;}

/* -------------------- main shortcut : New Store ------------------- */
#new_store{background: #242424;}
#new_store .inner{display: flex; justify-content: center; align-items: center; width: 1300px; height: 100%; margin: 0 auto; padding: 20px 0;}
#new_store .left_text{display: inline-block; width: 20%; color: #fff; letter-spacing: -1px;}
#new_store .left_text h3{color: inherit; font-size: 35px; font-weight: 300;}
#new_store .left_text h3 span{color: inherit; font-weight: 500;}

#new_store .right_cont{width: 80%;}
#new_store .right_cont h4{padding-bottom: 15px; font-size: 17px; font-weight: 300; color: #fff;}
#new_store .right_cont h4 span{font-weight: 500; color: inherit;}
#new_store .right_cont h4 strong{color: inherit;}
#new_store .right_cont .swiper-container{width: 100%;}
#new_store .right_cont .swiper-container .swiper-slide{width: auto;}
#new_store .right_cont .swiper-container .swiper-slide h5{display: inline-block; padding: 6px 25px; border-radius: 100px; background: #fff; font-size: 17px; font-weight: 500;}

/* -------------------- 섹션 6 : Instagram ------------------- */
#insta{padding: 100px 0;}
#insta .inner{width: 1300px; margin: 0 auto;}
#insta h2{margin-bottom: 60px;}
#insta .content{display: flex; width: 100%; height: 100%;}
#insta .content .left{margin-right: 30px;}
#insta .content .left .follow_box{width: 225px; height: 225px; padding: 35px 0; border: 1px solid #1c1c1c;}
#insta .content .left .follow_box .follow_inner{height: 100%; display: flex; justify-content: space-between; align-items: center; flex-direction: column;}
#insta .content .left .follow_box .follow_inner h3{text-align: center;}
#insta .content .left .follow_box .follow_inner h3 img{width: 20%;}
#insta .content .left .follow_box .follow_inner h3 span{display: block; font-weight: 300; font-size: 16px; letter-spacing: 0.025em;}
#insta .content .left .follow_box .follow_inner a.arrow_more{display: flex; width: 100%; text-align: center;}
#insta .content .left .follow_box .follow_inner a.arrow_more span.eng{}
#insta .content .left .follow_box .follow_inner a.arrow_more span.sqaure{border: 1px solid #1c1c1c; border-radius: 0px; background: none;}
#insta .content .left .follow_box .follow_inner a.arrow_more span.arrow{top: -16px;}
#insta .content .right{position: relative; width: 100%;}
#insta .content .right .swiper-container{width: 1045px; height: 225px;}
#insta .content .right .swiper-container .swiper-slide{width: 225px; height: 225px;}
#insta .content .right .swiper-container .swiper-slide a{}
#insta .content .right .swiper-container .swiper-slide a .box{position: relative; width: 225px; height: 225px;}
#insta .content .right .swiper-container .swiper-slide a .box .box_hover{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0); transition: 0.3s;}
#insta .content .right .swiper-container .swiper-slide a .box .box_hover .hover_icon{}
#insta .content .right .swiper-container .swiper-slide a .box .box_hover .hover_icon img{width: 100%; height: 100%; transform: scale(0.6); opacity: 0; transition: 0.3s;}
#insta .content .right .swiper-container .slide1 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img1.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide2 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img2.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide3 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img3.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide4 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img4.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide5 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img5.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide6 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img6.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .swiper-container .slide7 a .box .bg{width: 225px; height: 225px; background: url("../img/insta_img7.jpg") center center no-repeat; background-size: cover;}
#insta .content .right .progress_container{display: flex; align-items: flex-end; width: 100%; height: 40px; margin: 0 auto;}
#insta .content .right .swiper-pagination{position: static; width: 100%; height: 100%;}
#insta .content .right .swiper-pagination-progressbar{height: 2px;}
#insta .content .right .swiper-pagination-progressbar-fill{background: #555;}

#insta .content .right .swiper-container .swiper-slide a .box:hover .box_hover {background: rgba(0,0,0,0.3);}
#insta .content .right .swiper-container .swiper-slide a .box:hover .box_hover .hover_icon img{opacity: 1;}