@charset "utf-8";

/*mobile 시작*/

.inner{width: calc(100% - 32px); margin: 0 auto;}

/*mobile bottom 시작*/
.pc-header{display: none;}
.m-bottom{position: fixed; bottom: 0; left: 0; width: 100%; height: 60px; z-index: 999; border-top: 3px solid #73b042; background-color: #fff;}
.m-bottom ul{display: flex; justify-content: space-between;}
.m-bottom ul li a{display: block; padding: 30px 22px 5px; font-size: 12px; background-repeat: no-repeat; background-position: center 3px; width: 100px; text-align: center;}
.m-bottom ul li:hover a{color: #73b042;}
.m-bottom ul li:nth-child(1) a{background-image: url(../img/icon/m-home.png);}
.m-bottom ul li:nth-child(2) a{background-image: url(../img/icon/m-flab.png);}
.m-bottom ul li:nth-child(3) a{background-image: url(../img/icon/m-recipy.png);}
.m-bottom ul li:nth-child(4) a{background-image: url(../img/icon/m-my.png);}
.m-bottom ul li:nth-child(1):hover a{background-image: url(../img/icon/m-home-on.png);}
.m-bottom ul li:nth-child(2):hover a{background-image: url(../img/icon/m-flab-on.png);}
.m-bottom ul li:nth-child(3):hover a{background-image: url(../img/icon/m-recipy-on.png);}
.m-bottom ul li:nth-child(4):hover a{background-image: url(../img/icon/m-my-on.png);}
/*mobile bottom 끝*/

/*header 시작*/

#visual .fp-tableCell header{position: absolute; top: 0; left: 0; width: 100%;}
#visual header{padding: 17px 0; border-bottom: 3px solid #73b042; z-index: 999;}
#visual header .mobile{display: flex; justify-content: space-between;}
#visual header h1{width: 93px;}
#visual header h1 a img{width: 100%;}
#visual header .mobile{display: flex;}
#visual header .mobile fieldset{border: 0; width: calc(50%);}
#visual header .mobile fieldset legend{display: none;}
#visual header .mobile fieldset input{width: 100%; padding: 5px 15px; height: 30PX; border-radius: 10px; background-color: #fbfbfb; border: 1px solid #ccc;}
#visual header .open-menu a{display: block; width: 30px; height: 30px; padding: 5px 0;}
#visual header .open-menu a span{display: block; height: 2px; background-color: #000; margin: 6px 0;}
#visual header .open-menu a::before,
#visual header .open-menu a::after{content: ""; display: block; height: 2px; background-color: #000;}

#visual header .mobile .m-menuwrap{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; display: none;}
#visual header .mobile .m-menuwrap-header{padding: 17px 0;}
#visual header .mobile .m-menuwrap-header{display: flex; justify-content: space-between; }
#visual header .mobile .m-menuwrap-header > div{display: flex;}
#visual header .mobile .m-menuwrap-header .h-info ul{display: flex;}
#visual header .mobile .m-menuwrap-header .h-info ul li{width: 30px; height: 30px; margin-right: 15px;}
#visual header .mobile .m-menuwrap-header .h-info ul li a img{width: 100%;}
#visual header .close-menu a{display: block; width: 30px; height: 30px; position: relative; background: url(../img/icon/Close-menu.png) no-repeat center;}

#visual header .mobile nav > ul >li{border-bottom: 1px solid #b3b3b3; text-align: center; padding: 20px 0;}

#visual header .mobile nav ul li .depth01 a{font-size: 20px; transition: all 0.5s; display: flex; justify-content: center;}
#visual header .mobile nav ul li:hover .depth01 a{color: #289f5d;}
#visual header .mobile nav ul li.on .depth01 a{color: #289f5d; transition: all 0.5s;}
#visual header .mobile nav ul li .depth01 a span:last-child{display: block; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; margin-left: 5px;}



#visual header .mobile nav ul li:nth-child(1) a span:last-child,
#visual header .mobile nav ul li:nth-child(3) a span:last-child,
#visual header .mobile nav ul li:nth-child(4) a span:last-child,
#visual header .mobile nav ul li:nth-child(5) a span:last-child{background-image: url(../img/icon/menu-up.png); transition: all 0.5s;}
#visual header .mobile nav ul li:nth-child(2) .depth01 a span:last-child{background-image: url(../img/icon/menu-shopping.png);}
#visual header .mobile nav ul li:nth-child(1):hover .depth01 a span:last-child,
#visual header .mobile nav ul li:nth-child(3):hover .depth01 a span:last-child,
#visual header .mobile nav ul li:nth-child(4):hover .depth01 a span:last-child,
#visual header .mobile nav ul li:nth-child(5):hover .depth01 a span:last-child{background-image: url(../img/icon/menu-up.png);}
#visual header .mobile nav ul li:nth-child(1) .depth01.on a span:last-child,
#visual header .mobile nav ul li:nth-child(3) .depth01.on a span:last-child,
#visual header .mobile nav ul li:nth-child(4) .depth01.on a span:last-child,
#visual header .mobile nav ul li:nth-child(5) .depth01.on a span:last-child{background-image: url(../img/icon/menu-up-on.png); transform: rotate(180deg);}
#visual header .mobile nav ul li:nth-child(2) .depth01.on  a span:last-child{background-image: url(../img/icon/menu-shopping-on.png);}

#visual header .mobile nav ul.depth02{display: flex; flex-wrap: wrap; padding: 25px 0 10px;}
#visual header .mobile nav ul.depth02 li{width: 50%;}
#visual header .mobile nav ul.depth02 li:nth-child(2n){margin-bottom: 20px;}
#visual header .mobile nav ul.depth02 li:last-child{margin-bottom: 0;}
#visual header .mobile nav ul.depth02 li:hover a{color: #289f5d;}

/*header 끝*/


/*event 시작*/
#visual .event{position: relative; padding-top: 71px;}
#visual .event .m-event{margin-top: 30px;}
#visual .event .m-event .m-mySwiper{border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 15px 0; margin-bottom: 35px;}
#visual .event .m-event .m-mySwiper img{width: 100%; height: 100%; object-fit: cover; border-radius: 25px;}
#visual .event .m-event .m-mySwiper .m-swiper-pagination{text-align: center; padding-top: 20px;}
#visual .event .pc-event{display: none;}

#visual .event .m-btn{margin-bottom: 30px;}
#visual .event .m-btn ul{display: flex; justify-content: space-between;}
#visual .event .m-btn ul li{width: calc((100% - 27px) / 4);}
#visual .event .m-btn ul li img{width: 100%;}
#visual .event .m-btn ul li a{font-size: 14px; text-align: center;}

/*event 끝*/


/*best 시작*/
#best .m-best{height: 100%;}
#best .m-best .head-box{height: 72px; background: url(../img/head-box-bg.png) no-repeat right / cover;}
#best .m-best .head-box h2{font-size: 30px; color: #7f6846; line-height: 72px; font-family: OKGUNG;}
#best .m-best .con-box{height: calc(100% - 72px); padding-top: 35px; background: url(../img/shopping_bg.png) no-repeat -200px / cover;}
#best .m-best .con-box li{background-color: rgba(0, 0, 0, 0.65); padding: 25px 35px; max-height: 80%;}
#best .m-best .con-box .img-box{max-width: 256px; max-height: 256px; margin: 0 auto 10px;}
#best .m-best .con-box img{width: 100%; height: 100%; object-fit: cover;}
#best .m-best .con-box .txt-box{color: #fff; border-top: 3px solid #fff; padding: 5px 0; max-width: 256px; min-height: 250px; margin: 0 auto; position: relative; font-size: 15px;}
#best .m-best .con-box .txt-box h3{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; max-height: 70px;}
#best .m-best .con-box li:hover .txt-box h3{text-decoration: underline;}
#best .m-best .con-box .txt-box .sub-txt{font-size: 14px;}
#best .m-best .con-box .txt-box .price{font-size: 16px; font-weight: bold; text-align: right; position: absolute; bottom: 42px; right: 0px;}
#best .m-best .con-box .txt-box .star{font-size: 10px; text-align: right; display: flex; justify-content: right; position: absolute; bottom: 25px; right: 0px;}
#best .m-best .con-box .txt-box .star span:nth-child(1){display: block; width: 46px; height: 10px; background: url(../img/5star.png) no-repeat center / contain;}

#best .m-best .inner > h3{color: #fff; font-family: OKGUNG; font-weight: normal; font-size: 20px; position: absolute; bottom: 5%; left: 35px;}
#best .m-best .more{position: absolute; bottom: 5%; left: 50%; transform: translateX(-50%); z-index: 9;}
#best .m-best .more a{display: block; width: 30px; height: 30px; border: 2px solid #fff; border-radius: 50%; text-align: center; color: #fff; font-size: 25px; line-height: 1;}

#best .pc-best{display: none;}

/*best 끝*/


/*chef 시작*/
#chef .inner{overflow: hidden;}
#chef .head-box{text-align: center; margin-bottom: 30px; padding-top: 30px;}
#chef .head-box h2{font-size: 30px; font-family: OKGUNG;}
#chef .head-box p{display: none;}
#chef .m-chef .inner{max-width: 330px;}
#chef ul li{height: 410px; border: 2px solid #ddd; border-radius: 25px; background-color: #fff; display: block; padding-top: 23px; position: relative;}
#chef ul li .img-box{width: 250px; height: 250px; margin: 0 auto 20px;}
#chef ul li .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;}
#chef ul li .txt-box{width: 250px; margin: 0 auto;}
#chef ul li .txt-box h3{font-size: 25px; font-weight: bold; margin-bottom: 5px;}
#chef ul li .txt-box .heart{height: 22px; padding-left: 30px; background: url(../img/heart.png) no-repeat left; font-size: 18px; line-height: 1;}
#chef ul li .more{position: absolute; bottom: 50px; right: 40px;}
#chef ul li .more a{display: block; width: 40px; height: 40px; background: url(../img/icon/btn-more.png) no-repeat center / cover;}

#chef .pc-chef{display: none;}

#chef .fp-tableCell > .more{width: 200px; margin: 40px auto;}
#chef .fp-tableCell > .more a{display: block; font-size: 20px; height: 50px; border-radius: 25px; border: 3px solid #ddd; text-align: center; line-height: 50px; font-weight: bold;}
#chef .fp-tableCell > .more:hover a{background-color: #eee;}

/*chef 끝*/



/*recipe 시작*/
#recipe .head-box{text-align: center; margin-bottom: 30px; padding-top: 30px;}
#recipe .head-box h2{font-size: 30px; font-family: OKGUNG; margin-bottom: 10px;}
#recipe .head-box p{display: none;}
#recipe .head-box .more{text-align: right; height: 16px;}
#recipe .head-box .more a{font-size: 14px; padding-right: 20px; background: url(../img/icon/more-btn.png) no-repeat right / auto 16px; padding-bottom: 2px;}

#recipe .recipe-box .inner > ul{position: relative; height: 720px;}
#recipe .recipe-box ul li.card .cardbg{width: 100%; height: 320px; position: absolute; left: 0; border-radius: 25px; transition: all 0.5s; padding: 25px;}
#recipe .recipe-box ul li.card:nth-child(1) .cardbg{top: 0; background: url(../img/recipe_bg_01.jpg) no-repeat center / cover;}
#recipe .recipe-box ul li.card:nth-child(2) .cardbg{top: 100px; background: url(../img/recipe_bg_02.jpg) no-repeat center / cover;}
#recipe .recipe-box ul li.card:nth-child(3) .cardbg{top: 200px; background: url(../img/recipe_bg_03.jpg) no-repeat center / cover;}
#recipe .recipe-box ul li.card:nth-child(4) .cardbg{top: 300px; background: url(../img/recipe_bg_04.jpg) no-repeat center / cover;}
#recipe .recipe-box ul li.card:nth-child(5) .cardbg{top: 400px; background: url(../img/recipe_bg_05.jpg) no-repeat center / cover;}
#recipe .recipe-box ul li.card.aftercard .cardbg{transform: translateY(200px);}

#recipe .recipe-box .card .h-box{display: flex;}
#recipe .recipe-box .card .h-box .img-box{width: 65px; height: 65px; margin-right: 15px; margin-bottom: 12px;}
#recipe .recipe-box .card .h-box img{width: 100%;}
#recipe .recipe-box .card .h-box h3{color: #fff; width: 65px; height: 65px; line-height: 65px; font-size: 20px; font-weight: bold;}
#recipe .recipe-box .card ul{display: flex; flex-wrap: wrap;}
#recipe .recipe-box .card ul li{margin-right: 10px; margin-bottom: 10px; border: 2px solid #b3b3b3; border-radius: 35px; background-color: #fff;}
#recipe .recipe-box .card ul li a{padding: 5px 10px; color: #b3b3b3; font-size: 14px; font-weight: bold; line-height: 30px;}
#recipe .recipe-box .card ul li:hover{border: 2px solid #73b042;}
#recipe .recipe-box .card ul li:hover a{color: #73b042;}


/*recipe 끝*/



/*fodd lab 시작*/
#food_lab .head-box{text-align: center; margin-bottom: 30px; padding-top: 30px;}
#food_lab .head-box h2{font-size: 30px; font-family: OKGUNG; margin-bottom: 10px;}
#food_lab .head-box p{display: none;}
#food_lab .head-box .more{text-align: right; height: 16px;}
#food_lab .head-box .more a{font-size: 14px; padding-right: 20px; background: url(../img/icon/more-btn.png) no-repeat right / auto 16px; padding-bottom: 2px;}
#food_lab .m-fl-box dl{width: 296px; height: 384px; background: url(../img/lab_main_bg.png) no-repeat center; border-radius: 25px; padding: 10px 43px;}
#food_lab .m-fl-box dl dt h3{font-size: 20px; margin-bottom: 8px; font-weight: bold;}
#food_lab .m-fl-box dl dt p{font-size: 14px; color: #888; display: flex; justify-content: space-between; margin-bottom: 8px;}
#food_lab .m-fl-box dl dd .img-box{width: 150px; height: 150px; margin: 0 auto; margin-bottom: 14px;}
#food_lab .m-fl-box dl dd .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 25px;}
#food_lab .m-fl-box dl dd .txt-box p{font-size: 16px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; max-height: 110px;}

#food_lab .pc-fl-box{display: none;}

/*fodd lab 끝*/



/*footer 시작*/
footer .bottom-footer{display: none;}

footer .top-footer{padding: 35px 0;}
footer .top-footer .inner{max-width: 580px;}
footer .top-footer .download{width: 100%; margin: 0 auto 35px;}
footer .top-footer img{width: 100%; height: 100%; object-fit: cover;}
footer .top-footer .sns{margin-bottom: 35px;}
footer .top-footer .sns ul{display: flex; justify-content: space-between;}
footer .top-footer .sns ul li{width: 45px; height: 45px;}
footer .top-footer .txt-box ul li{margin-bottom: 10px;}
footer .top-footer .txt-box ul li p{font-size: 10px; color: #999; margin-bottom: 5px;}
footer .top-footer .txt-box ul li p span{padding-right: 10px; margin-right: 10px; border-right: 1px solid #999;}
footer .top-footer .txt-box ul li p span:last-child{border: 0;}
footer .top-footer .txt-box ul li p span a{color: #999;}
footer .top-footer .txt-box ul li p span a:hover{text-decoration: underline;}

/*footer 끝*/



/*mobile 끝*/







/*1024px ~ 1920px 시작*/
@media screen and (min-width : 1024px) {
  .m-bottom{display: none;}
  .inner{width: calc(100% - 40px);}


  /*side-navigation 시작*/
  #fp-nav ul li{margin-bottom: 10px;}
  #fp-nav ul li .fp-tooltip{color: #000; font-size: 15px; font-weight: bold;}
  #fp-nav{transform: translateX(-40px);}
  #fp-nav ul li .fp-tooltip.fp-left{text-align: right; left: -5px; transform: translateX(-100%);}
  body.fp-viewing-visual1 #fp-nav ul li:nth-child(1){animation: s-nav1 4s 0.4s backwards;}
  body.fp-viewing-visual1 #fp-nav ul li:nth-child(2){animation: s-nav1 4s 0.6s backwards;}
  body.fp-viewing-visual1 #fp-nav ul li:nth-child(3){animation: s-nav1 4s 0.8s backwards;}
  body.fp-viewing-visual1 #fp-nav ul li:nth-child(4){animation: s-nav1 4s 1s backwards;}
  body.fp-viewing-visual1 #fp-nav ul li:nth-child(5){animation: s-nav1 4s 1.2s backwards;}
  body.fp-viewing-best2 #fp-nav ul li:nth-child(1){animation: s-nav2 4s 0.4s backwards;}
  body.fp-viewing-best2 #fp-nav ul li:nth-child(2){animation: s-nav2 4s 0.6s backwards;}
  body.fp-viewing-best2 #fp-nav ul li:nth-child(3){animation: s-nav2 4s 0.8s backwards;}
  body.fp-viewing-best2 #fp-nav ul li:nth-child(4){animation: s-nav2 4s 1s backwards;}
  body.fp-viewing-best2 #fp-nav ul li:nth-child(5){animation: s-nav2 4s 1.2s backwards;}
  body.fp-viewing-chef3 #fp-nav ul li:nth-child(1){animation: s-nav3 4s 0.4s backwards;}
  body.fp-viewing-chef3 #fp-nav ul li:nth-child(2){animation: s-nav3 4s 0.6s backwards;}
  body.fp-viewing-chef3 #fp-nav ul li:nth-child(3){animation: s-nav3 4s 0.8s backwards;}
  body.fp-viewing-chef3 #fp-nav ul li:nth-child(4){animation: s-nav3 4s 1s backwards;}
  body.fp-viewing-chef3 #fp-nav ul li:nth-child(5){animation: s-nav3 4s 1.2s backwards;}
  body.fp-viewing-recipe4 #fp-nav ul li:nth-child(1){animation: s-nav4 4s 0.4s backwards;}
  body.fp-viewing-recipe4 #fp-nav ul li:nth-child(2){animation: s-nav4 4s 0.6s backwards;}
  body.fp-viewing-recipe4 #fp-nav ul li:nth-child(3){animation: s-nav4 4s 0.8s backwards;}
  body.fp-viewing-recipe4 #fp-nav ul li:nth-child(4){animation: s-nav4 4s 1s backwards;}
  body.fp-viewing-recipe4 #fp-nav ul li:nth-child(5){animation: s-nav4 4s 1.2s backwards;}
  body.fp-viewing-food_lab5 #fp-nav ul li:nth-child(1){animation: s-nav5 4s 0.4s backwards;}
  body.fp-viewing-food_lab5 #fp-nav ul li:nth-child(2){animation: s-nav5 4s 0.6s backwards;}
  body.fp-viewing-food_lab5 #fp-nav ul li:nth-child(3){animation: s-nav5 4s 0.8s backwards;}
  body.fp-viewing-food_lab5 #fp-nav ul li:nth-child(4){animation: s-nav5 4s 1s backwards;}
  body.fp-viewing-food_lab5 #fp-nav ul li:nth-child(5){animation: s-nav5 4s 1.2s backwards;}
  /*side-navigation 끝*/

  
  /*header 시작*/

  #visual header{background-color: #F5FCED;}
  #visual header .inner{position: relative; height: 125px;}
  #visual header .mobile{display: none;}
  #visual header .pc-header{display: block;}
  #visual header .pc-header h1{width: 186px; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
  #visual header .pc-header .h-wrap{position: absolute; top: 0; left: 50%; width: 50%; transform: translateX(-50%); min-width: 515px;}
  #visual header .pc-header .h-wrap fieldset{border: 0; display: flex; margin-bottom: 10px;}
  #visual header .pc-header .h-wrap fieldset legend{display: none;}
  #visual header .pc-header .h-wrap fieldset input{width: calc(100% - 60px); height: 47px; padding: 10px 20px; border-radius: 0; border: 1px solid #ccc;}
  #visual header .pc-header .h-wrap fieldset button{width: 56px; border: 0; background: url(../img/search.png) no-repeat center / cover; cursor: pointer;}

  #visual header .pc-header .h-wrap nav ul{display: flex; justify-content: space-between;}
  #visual header .pc-header .h-wrap nav ul li{width: calc(100% / 5); padding: 30px 0; text-align: center; transition: all 0.5s;}
  #visual header .pc-header .h-wrap nav ul li a{font-size: 20px;}
  #visual header .pc-header .h-wrap nav ul li:hover{background: url(../img/hover_bg.png) no-repeat center;}
  #visual header .pc-header .h-wrap nav ul li:hover a{color: #fff;}

  #visual header .pc-header .h-info{position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
  #visual header .pc-header .h-info ul{display: flex;}
  #visual header .pc-header .h-info ul li{width: 50px; height: 50px; margin-right: 20px;}
  #visual header .pc-header .h-info ul li:last-child{margin-right: 0;}
  
  /*header 끝*/


  /*event 시작*/
  #visual .event .m-event,
  #visual .event .m-btn{display: none;}
  #visual .fp-tableCell{position: absolute; top: 0; left: 0;}
  #visual .event .pc-event{display: block; padding-top: 154px;}
  #visual .event .pc-event .inner{position: relative; width: 984px; height: 482px;}
  #visual .event .pc-event img{width: 100%; height: 100%;}
  #visual .event .pc-event .Swiper3 img{object-fit: cover; object-position: -1000px;}
  #visual .event .pc-event .Swiper4 img{object-fit: cover; object-position: -1110px;}
  #visual .event .pc-event .Swiper1{display: none;}
  #visual .event .pc-event .Swiper2{width: 354px; height: 162px; position: absolute; top: 0; left: 0; border-radius: 25px;}
  #visual .event .pc-event .Swiper3{width: 356px; height: 434px; position: absolute; top: 0; left: 370px; border-radius: 25px;}
  #visual .event .pc-event .Swiper4{width: 232px; height: 434px; position: absolute; top: 0; right: 0; border-radius: 25px;}
  #visual .event .pc-event .Swiper5{display: none;}
  #visual .event .pc-event h2{position: absolute; bottom: 163px; left: 0; color: #289F5D; font-size: 60px; font-family: OKGUNG; font-weight: normal;}
  #visual .event .pc-event .swiper-btnbox{position: absolute;bottom: 70px; left: 250px; width: 100px; height: 40px;}
  #visual .event .pc-event .swiper-button-next{width: 40px; height: 40px; background: url(../img/icon/btn-next.png) no-repeat center / cover; left: 60px;}
  #visual .event .pc-event .swiper-button-prev{width: 40px; height: 40px; background: url(../img/icon/btn-prev.png) no-repeat center / cover;}
  #visual .event .pc-event .swiper-button-next::after,
  #visual .event .pc-event .swiper-button-prev::after{display: none;}
  #visual .event .pc-event .pagination-container{position: absolute; bottom: 95px; left: 0; width: 294px;}
  #visual .event .pc-event .pagination-container .swiper-pagination1{position: absolute; top: 0; left: 0;}
  #visual .event .pc-event .pagination-container .swiper-pagination2{position: absolute; top: 0; left: 20px; width: 190px;}
  .swiper-pagination1.swiper-pagination-fraction.swiper-pagination-horizontal{font-size: 0; color: transparent;}
  #visual .event .pc-event .pagination-container .swiper-pagination-current{position: absolute; top: -12px; left: 0px; font-size: 20px; color: #000; font-weight: bold;}
  #visual .event .pc-event .pagination-container .swiper-pagination-total{position: absolute; top: -12px; right: 58px; font-size: 20px; color: #000; font-weight: bold;}
  .swiper-pagination-progressbar{background: #000;}
  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#289F5D;}
  /*event 끝*/


  /*best 시작*/
  #best .m-best{display: none;}
  #best .pc-best{display: block; height: 100%;}

  #best .pc-best .head-box{height: 90px; background: url(../img/head-box-bg.png) no-repeat right / cover;}
  #best .pc-best .head-box h2{font-size: 60px; color: #7f6846; line-height: 90px; font-family: OKGUNG;}
  #best .pc-best .head-box p{display: none;}

  #best .pc-best .con-box{height: calc(100% - 90px); background: url(../img/shopping_bg.png) no-repeat center / cover; display: flex;}
  #best .pc-best .con-box .left-box{width: 25%; position: relative;}
  #best .pc-best .con-box .left-box h3{color: #fff; font-size: 30px; font-family: OKGUNG; position: absolute; bottom: 40px; left: 65px;}
  #best .pc-best .con-box .left-box .more{position: absolute; bottom: 90px; left: 65px;}
  #best .pc-best .con-box .left-box .more a{display: block; padding: 5px 0px 5px 45px; background: url(../img/icon/ham-btn-w.png) no-repeat left; color: #fff;}
  #best .pc-best .con-box .left-box .swiper-button-next::after{display: none;}
  #best .pc-best .con-box .left-box .swiper-button-prev::after{display: none;}
  #best .pc-best .con-box .left-box .swiper-button-next{width: 40px; height: 40px; background: url(../img/icon/best-btn-next.png) no-repeat center / cover; top: auto; bottom: 150px; left: 120px; }
  #best .pc-best .con-box .left-box .swiper-button-prev{width: 40px; height: 40px; background: url(../img/icon/best-btn-prev.png) no-repeat center / cover; top: auto; bottom: 150px; left: 65px;}
  #best .pc-best .con-box .bestSwiper{width: 75%;}
  #best .pc-best .con-box .bestSwiper ul li{background-color: rgba(0, 0, 0, 0.5); transition: all 0.3s; padding: 5% 5% 0; box-sizing: border-box;}
  #best .pc-best .con-box .bestSwiper ul li:hover{background-color: rgba(0, 0, 0, 0.65);}
  #best .pc-best .con-box .bestSwiper ul li .img-box{transition: all 0.5s; margin-bottom: 15px; padding-top: 150px;}
  #best .pc-best .con-box .bestSwiper ul li:hover .img-box{padding-top: 0px;}
  #best .pc-best .con-box .bestSwiper ul li .img-box img{width: 100%;}
  #best .pc-best .con-box .bestSwiper ul li .txt-box{border-top: 3px solid #fff; padding-top: 15px; color: #fff;}
  #best .pc-best .con-box .bestSwiper ul li .txt-box h3{font-size: 25px; font-weight: bold; margin-bottom: 25px; min-height: 169px;}
  #best .pc-best .con-box .bestSwiper ul li .txt-box .sub-txt{font-size: 18px; height: 0; transition: all 0.5s; overflow: hidden;}
  #best .pc-best .con-box .bestSwiper ul li:hover .txt-box .sub-txt{height: 150px;}
  #best .pc-best .con-box .bestSwiper ul li .txt-box .price{font-size: 32px; font-weight: bold; text-align: right; margin-bottom: 7px;}
  #best .pc-best .con-box .txt-box .star{font-size: 14px; text-align: right; display: flex; justify-content: right;}
  #best .pc-best .con-box .txt-box .star span:nth-child(1){display: block; width: 87px; height: 16px; background: url(../img/5star.png) no-repeat center / cover;}

  /*best 끝*/



  /*chef 시작*/
  #chef .m-chef{display: none;}
  #chef .pc-chef{display: block;}

  #chef .head-box h2{font-size: 60px;}
  #chef ul{position: relative; height: 410px;}
  #chef ul li{width: 330px; height: 410px; position: absolute; top: 0; transition: all 0.5s;}
  #chef ul li:nth-child(1){left: 20%; z-index: 1; transform: scale(0.8) translateX(-50%) rotate(8deg);}
  #chef ul li:nth-child(2){left: 35%; z-index: 2; transform: scale(0.8) translateX(-50%) rotate(-10deg);}
  #chef ul li:nth-child(3){left: 50%; z-index: 3; transform: scale(0.8) translateX(-50%) rotate(0deg);}
  #chef ul li:nth-child(4){left: 65%; z-index: 2; transform: scale(0.8) translateX(-50%) rotate(6deg);}
  #chef ul li:nth-child(5){left: 80%; z-index: 1; transform: scale(0.8) translateX(-50%) rotate(-15deg);}
  #chef ul li:hover{transform: scale(1) translateX(-50%) rotate(0); z-index: 5;}


  #chef ul li .txt-box h3{font-size: 25px; font-weight: bold; margin-bottom: 5px;}
  #chef ul li .txt-box .heart{height: 22px; padding-left: 30px; background: url(../img/heart.png) no-repeat left; font-size: 18px; line-height: 1;}
  #chef ul li .more{position: absolute; bottom: 50px; right: 40px;}
  #chef ul li .more a{display: block; width: 40px; height: 40px; background: url(../img/icon/btn-more.png) no-repeat center / cover;}

  /*chef 끝*/



  /*recipe 시작*/
  #recipe .head-box{margin-bottom: 100px;}
  #recipe .head-box h2{font-size: 60px;}
  #recipe .head-box .more{text-align: right; height: 16px;}
  #recipe .head-box .more a{font-size: 20px; font-weight: bold;}

  #recipe .recipe-box .inner > ul{width: 90%;height: auto; display: flex; justify-content: center; position: static; margin: 0 auto;}
  #recipe .recipe-box ul li.card{width: 100px; transition: all 0.3s; border-radius: 25px; padding: 20px 17.5px;}
  #recipe .recipe-box ul li.card .cardbg{height: 365px; position: static; padding: 0px; min-width: 96px; padding-top: 20px; display: flex; transition: all 0.3s;}
  #recipe .recipe-box ul li.card ul{width: 0; overflow: hidden; display: flex; flex-wrap: wrap;}  
  #recipe .recipe-box .card .h-box{display: block; padding: 0 17.5px}
  #recipe .recipe-box .card .h-box .img-box{margin-right: 0px; margin-bottom: 12px;}
  #recipe .recipe-box .card .h-box h3{width: 20px;height: 90px; writing-mode: vertical-lr; font-size: 25px; text-shadow: 0 0 5px #000000;}
  #recipe .recipe-box .card ul li{margin-right: 10px; margin-bottom: 10px; border: 2px solid #b3b3b3; border-radius: 35px; background-color: #fff; display: inline-block;}
  #recipe .recipe-box .card ul li a{padding: 5px 10px; color: #b3b3b3; font-size: 14px; font-weight: bold; line-height: 30px;}
  #recipe .recipe-box .card ul li:hover{border: 2px solid #73b042;}
  #recipe .recipe-box .card ul li:hover a{color: #73b042;}

  #recipe .recipe-box ul li.card:hover{width: 540px; height: 385px; background-color: #fff; -webkit-box-shadow: 0 0 10px 10px rgba(0,0,0,0.5); box-shadow: 0 0 10px 10px rgba(0,0,0,0.5); transform: translateY(-50px);}
  #recipe .recipe-box ul li.card:hover .cardbg{width: 100%; height: 350px;}
  #recipe .recipe-box ul li.card:hover ul{display: block; width: 500px;}
  #recipe .recipe-box ul li.card:hover ul li{animation: recipe 0.5s 0.3s backwards;}
  
  /*recipe 끝*/



  /*fodd lab 시작*/
  #food_lab .head-box{margin-bottom: 100px;}
  #food_lab .head-box h2{font-size: 60px;}
  #food_lab .head-box .more{text-align: right; height: 16px;}
  #food_lab .head-box .more a{font-size: 20px; font-weight: bold;}

  #food_lab .m-fl-box{display: none;}
  #food_lab .pc-fl-box{display: block;}
  #food_lab .pc-fl-box .inner{display: flex; justify-content: center;}
  #food_lab .pc-fl-box .fl-Swiper01,
  #food_lab .pc-fl-box .fl-Swiper05{display: none;}
  #food_lab .pc-fl-box .fl-Swiper02,
  #food_lab .pc-fl-box .fl-Swiper04{width: 200px; height: 200px; margin-top: 135px;}
  #food_lab .pc-fl-box .fl-Swiper03{width: 390px;}

  #food_lab .pc-fl-box .img-box{width: 200px; height: 200px;}
  #food_lab .pc-fl-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 25px;}
  #food_lab .pc-fl-box dl{width: 391px; height: 508px; background: url(../img/lab_main_bg.png) no-repeat center / cover; border-radius: 25px; padding: 15px 57px;}

  #food_lab .pc-fl-box dl dt h3{font-size: 25px; margin-bottom: 13px;}
  #food_lab .pc-fl-box dl dt p{font-size: 14px; color: #888; display: flex; justify-content: space-between; margin-bottom: 19px;}
  #food_lab .pc-fl-box dl dd .img-box{width: 200px; height: 200px; margin: 0 auto; margin-bottom: 19px;}
  #food_lab .pc-fl-box dl dd .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 25px;}
  #food_lab .pc-fl-box dl dd .txt-box p{font-size: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; max-height: 130px;}

  #food_lab .pc-fl-box .swiper-button-next{width: 40px; height: 40px; background: url(../img/icon/btn-next.png) no-repeat center / cover; transition: all 0.3s;}
  #food_lab .pc-fl-box .swiper-button-prev{width: 40px; height: 40px; background: url(../img/icon/btn-prev.png) no-repeat center / cover; transition: all 0.3s;}
  #food_lab .pc-fl-box .swiper-button-next:hover{background: url(../img/icon/food_lab-btn-next.png) no-repeat center / cover;}
  #food_lab .pc-fl-box .swiper-button-prev:hover{background: url(../img/icon/food_lab-btn-prev.png) no-repeat center / cover;}
  #food_lab .pc-fl-box .swiper-button-next::after,
  #food_lab .pc-fl-box .swiper-button-prev::after{display: none;}
  /*fodd lab 끝*/



  /*footer 시작*/


  footer .bottom-footer{display: block;}
  footer .top-footer{padding: 22px 0 245px;}
  footer .top-footer .inner{max-width: calc(100% - 40px); display: flex; flex-wrap: wrap; justify-content: space-between;}
  footer .top-footer .download{width: 355px; height: 78px; margin: 0;}
  footer .top-footer .sns{width: 585px; padding-top: 15px;}
  footer .top-footer .txt-box ul li p{font-size: 14px;}
  footer .top-footer .txt-box ul li p span{padding-right: 20px; margin-right: 20px;}
  
  footer .bottom-footer{width: 100%; height: 245px; background-color: #289f5d; position: absolute; bottom: 0; left: 0;}
  footer .bottom-footer .inner{background: url(../img/10000recipe_logo_f.png) no-repeat left center; position: relative; height: 100%;}
  footer .bottom-footer .count-box{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
  footer .bottom-footer .count-box ul{display: flex; justify-content: space-between;}
  footer .bottom-footer .count-box ul li{width: 125px; text-align: center; padding-top: 70px;}
  footer .bottom-footer .count-box ul li:nth-child(1){background: url(../img/footer_icon01.png) no-repeat top;}
  footer .bottom-footer .count-box ul li:nth-child(2){background: url(../img/footer_icon02.png) no-repeat top;}
  footer .bottom-footer .count-box ul li:nth-child(3){background: url(../img/footer_icon03.png) no-repeat top;}
  footer .bottom-footer .count-box ul li:nth-child(4){background: url(../img/footer_icon04.png) no-repeat top;}
  footer .bottom-footer .count-box ul li:nth-child(5){background: url(../img/footer_icon05.png) no-repeat top;}
  footer .bottom-footer .count-box ul li h4{color: #fff; font-size: 18px; font-weight: normal; margin-bottom: 15px;}
  footer .bottom-footer .count-box ul li p{color: #fdff51; font-size: 18px;}
  


  /*footer 끝*/


  
}
/*1024px ~ 1920px 시작*/







/*1920px ~ 시작*/
@media screen and (min-width : 1920px) {
  .inner{width: calc(100% - 400px);}

  /*header 시작*/
  /*header 끝*/


  /*event 시작*/
  #visual .event .pc-event .inner{width: 1920px; height: 926px;}
  #visual .event .pc-event .Swiper1,
  #visual .event .pc-event .Swiper5{display: block; position: absolute; border-radius: 25px;}
  #visual .event .pc-event .Swiper1{width: 400px; height: 400px; top: 0; left: 0; transform: translateX(-50%);}
  #visual .event .pc-event .Swiper2{width: 500px; height: 200px; top: 187px; left: 25%; transform: translateX(-50%);}
  #visual .event .pc-event .Swiper3{width: 430px; height: 568px; top: 0; left: 51%; transform: translateX(-50%);}
  #visual .event .pc-event .Swiper4{width: 390px; height: 390px; top: 48px; left: 70%; transform: translateX(-50%);}
  #visual .event .pc-event .Swiper5{width: 400px; height: 400px; top: 168px; left: 100%; transform: translateX(-50%);}
  #visual .event .pc-event img{width: 100%; height: 100%;}
  #visual .event .pc-event .Swiper1 img{object-fit: cover;}
  #visual .event .pc-event .Swiper3 img{object-fit: cover; object-position: -1000px;}
  #visual .event .pc-event .Swiper4 img{object-fit: cover; object-position: -820px;}
  #visual .event .pc-event .Swiper5 img{object-fit: cover; object-position: -1000px;}
  #visual .event .pc-event .swiper-btnbox{top: 55%; left: 80%; width: 100px; height: 40px;}
  #visual .event .pc-event .pagination-container{top: 56.5%; left: 67%;}
  .swiper-pagination1.swiper-pagination-fraction.swiper-pagination-horizontal{width: 290px;}
  #visual .event .pc-event .pagination-container .swiper-pagination-current{top: -12px; left: -40px;}
  #visual .event .pc-event .pagination-container .swiper-pagination-total{top: -12px; right: 38px;}
  #visual .event .pc-event .pagination-container .swiper-pagination2{top: 0; left: -20px; width: 250px;}
  #visual .event .pc-event h2{top: 5%; left: 12%;}
  /*event 끝*/


  /*best 시작*/
  #best .pc-best .head-box{height: 168px; padding: 25px 0;}
  #best .pc-best .head-box h2{font-size: 60px;line-height: 1; margin-bottom: 25px;}
  #best .pc-best .head-box p{display: block; font-size: 25px; color: #7f6846; line-height: 1;}
  #best .pc-best .con-box{height: calc(100% - 168px);}
  #best .pc-best .con-box .bestSwiper ul li{padding: 2% 5% 0;}
  #best .pc-best .con-box .bestSwiper ul li .txt-box h3{min-height: 102px;}
  /*best 끝*/



  /*chef 시작*/
  #chef .head-box p{display: block; font-size: 25px;}
  #chef ul{position: relative; height: 520px;}
  #chef ul li{width: 420px; height: 520px;}
  #chef ul li .img-box{width: 340px; height: 340px;}
  #chef ul li .txt-box{width: 340px;}
  #chef ul li .more{bottom: 70px;}

  /*chef 끝*/



  /*recipe 시작*/
  #recipe .head-box .f-wrap{position: relative; margin-bottom: 80px;}
  #recipe .head-box .f-wrap p{display: block; font-size: 25px;}
  #recipe .head-box .f-wrap .more{position: absolute; top: 0; right: 0;}


  #recipe .recipe-box ul li.card{width: 200px;; padding: 20px; min-width: 150px;}
  #recipe .recipe-box ul li.card .cardbg{width: 100%; height: 570px;}
  #recipe .recipe-box .card .h-box{padding: 0 20px; margin: 0 auto;}
  #recipe .recipe-box ul li.card:hover{width: 842px; height: 600px;}
  #recipe .recipe-box ul li.card:hover .cardbg{width: 100%; height: 555px;}


  /*recipe 끝*/



  /*fodd lab 시작*/

  #food_lab .head-box .f-wrap{position: relative; margin-bottom: 80px;}
  #food_lab .head-box .f-wrap p{display: block; font-size: 25px;}
  #food_lab .head-box .f-wrap .more{position: absolute; top: 0; right: 0;}

  #food_lab .pc-fl-box .fl-Swiper01,
  #food_lab .pc-fl-box .fl-Swiper05{display: block; width: 200px; height: 200px; margin-top: 135px;}

  /*fodd lab 끝*/



  /*footer 시작*/
  footer .top-footer{padding: 22px 0 490px;}
  footer .top-footer .inner{position: relative;}
  footer .top-footer .download{position: absolute; top: 0; right: 0; width: 493px; height: 109px;}
  footer .top-footer .sns{position: absolute; top: 200px; right: 100px; width: 320px; height: 150px;}
  footer .top-footer .sns ul{flex-wrap: wrap; justify-content: space-between;}
  footer .top-footer .sns ul li{margin: 0 45px 45px 0;}
  footer .top-footer .sns ul li:nth-child(4){margin: 0;}
  footer .top-footer .sns ul li:nth-child(5),
  footer .top-footer .sns ul li:nth-child(6),
  footer .top-footer .sns ul li:nth-child(7){margin: 0 30px;}
  footer .top-footer .txt-box{position: absolute; top: 0; left: 0;}



  /*footer 끝*/
  
}
/*1920px ~ 끝*/