/* 767px 해상도 미만(모바일) */
html{font-size:50%;}

header
/* index메인 */
.container{padding: 0 2rem; height: 80px; width: 100%; box-sizing: border-box;}
.container h1 a{width: 80px;}
.container nav{display: none;}
.container{position: relative;}
.container nav{position: absolute; top: 80px; left: 0; width: 100%; background: #F8F5EE; text-align: center; z-index: 9999;}
.container nav ul li{display: block; margin-left: 0;}
.container .hamburger_menu{display: block;}

.visual_banner{height: 600px;}
.visual_banner .bg_banner01{background: url(../images/banner01_m.jpg) no-repeat center top 8% / cover;}
.visual_banner .bg_banner01 .banner_conts1{position: static; display: flex; flex-direction: column; justify-content: center; margin-left: 3rem; left: auto; top: auto; width: 100%; height: 100%; transform: translate(0, 0);}
.visual_banner .bg_banner01 .banner_conts1 .best_recom .recom_products{width: 360px;}

.visual_banner .bg_banner02{background: url(../images/banner02_m.jpg) no-repeat center top 8% / cover;}
.visual_banner .bg_banner03{background: url(../images/banner03_m.jpg) no-repeat center top 8% / cover;}
.visual_banner .bg_banner04{background: url(../images/banner04_m.jpg) no-repeat center top 8% / cover;}
.visual_banner .bg_banner05{background: url(../images/banner05_m.jpg) no-repeat center top 8% / cover;}
.visual_banner .bg_banner03 .banner3_conts{display: block;}
.visual_banner .bg_banner02 .banner2_conts{display: block;}

.event_banner{background: url(../images/event_banner01_m.jpg) no-repeat center / cover;}

/* About page */
.brand_story aside{padding: 0 3rem; word-break: keep-all;}
.brand_story aside h3,
.brand_story aside p{line-height: 1.4;}

.visual_footer aside{padding: 1rem 0 1rem 1rem;}
.brand_story aside .brand_logo{width: 100px;}
.visual_footer aside:last-child{padding-right: 1rem;}

.maca_box img{max-width: 90px;}

/* products_detail page */
.how_banner article{flex-direction: column;}
.how_banner article > div{width: 100%;}

.visual_banner .swiper-button-prev{display: none;}
.visual_banner .swiper-button-next{display: none;}

@media screen and (max-width: 725px){
  .visual_banner .bg_banner01 .banner_conts1 strong{margin-bottom: 7rem;}
  .visual_banner .bg_banner01 .banner_conts1 .best_recom .recom_products{width: 200px; height: auto;}
  .visual_banner .bg_banner01 .banner_conts1 .best_recom .recom_products .list_wrap{position: static; padding: 1rem; top: auto; left: auto; transform: translateY(0);}
  .visual_banner .bg_banner01 .banner_conts1 .best_recom .recom_products p{display: block; text-align: center; line-height: 1.6;}
  

  /* products page */
  .products_banner{background: none; height: auto;}
  .products_banner video{width: 100%;}

}
@media screen and (max-width: 660px){
  /* index메인 */
  .visual_banner{ height: 500px;}
  main section.best_products{padding: 0rem;}
  .best_products h2{margin-bottom: 2rem;}
  .best_products article{flex-direction: column;}
  .best_products article .items{padding: 2rem 5rem;}
  main section.gift_set{padding: 2rem;}
  main section.sec_vid{padding: 0;}

  .how_eat_wrap{padding: 20rem 2rem;}
  .sec_every_wrap{padding: 15rem 2rem;}

  .sec_vid > .vid_right{min-width: auto;}

  /* About page */
  .maca_box{left: 0%; width: 100%; background: rgba(255, 255, 255, 0.8)}
  .visual_footer aside:nth-child(1),
  .visual_footer aside:nth-child(2){display: none;}

  /* products page */
  .product_contents .all_products{padding: 10rem 2rem 5rem ;}
  .all_products .product_item a.item_img{padding: 5rem; box-sizing: border-box;}
  .all_products .product_item a.item_img .back_detail{padding: 5rem; box-sizing: border-box;}

}

@media screen and (max-width: 520px){
  .all_products .item_wrap > .product_item{width: 100%;} 
  /* products detail page */
  .item_title article{flex-direction: column;}
  .item_title article > div{margin: 0 auto; width: 100%}
  .item_title article .item_info{margin-top: 2rem; text-align: center;}
  .item_title article .item_info em{text-align: center;}
  .item_pic .swiper-slide{padding: 5rem; box-sizing: border-box;}
}

@media screen and (max-width: 500px){
  
  .visual_banner p {width: 100%;}
  .visual_banner p b{font-size: 3rem;}
  .visual_banner p strong{width: 300px; font-size: 1.8rem;}
  .brand_info_wrap{padding: 10rem 2rem;}
  
  .all_products .item_wrap > .product_item{width: 100%;} 

  .visual_banner p article{padding: 10rem 4rem; top: auto; left: auto; width: 100%; height: 100%; transform: translate(0%, 0%); background: rgba(255, 255, 255, 0.4); box-sizing: border-box;}
  .visual_banner .bg_banner01 .banner_conts1{margin-left: 0rem; padding-left: 2rem; box-sizing: border-box;}
  .visual_banner .bg_banner01 .banner_conts1 b .store_txt{font-size: 4rem;}
  .visual_banner .bg_banner01 .banner_conts1 strong{font-size: 1.9rem;}


}

@media screen and (max-width: 490px){
  .visual_banner .bg_banner01 .banner_conts1{padding-left: 0; align-items: center; background: rgba(0, 0, 0, .2);}
  
}

@media screen and (max-width: 425px){
  .visual_banner{height: 300px;}
  
}


