@charset "utf-8";

    /* body::-webkit-scrollbar {display: none;} */
    /* 스크롤바 너비 설정::-webkit-scrollbar {width: 10px;} */
    /* 스크롤바 트랙 배경색 설정 */    
    /* ::-webkit-scrollbar-track {background: rgba(255, 255, 255, 0.1);} */

    /* 스크롤바 썸(움직이는 부분) 배경색 및 테두리 설정 */
    /* ::-webkit-scrollbar-thumb {background: #555;border: 1px solid #f1f1f1;border-radius: 10px;    } */

    /* 썸에 마우스를 올렸을 때 색상 변경 */
    /* ::-webkit-scrollbar-thumb:hover {background:var(--blue);} */


    

* {  box-sizing: border-box; }

html {scroll-behavior: smooth; background: var(--white);width: 100%; height: 100%; margin: 0;}
body {height: 100%;}
#wrap {width: 100%; height: 100%; margin: 0;}

.blur{backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); /* iOS Safari 지원 */ background-color: rgba(255, 255, 255, 0.61)}
button {
  appearance: none;
  -webkit-appearance: none; /* Safari/Chrome 호환성 */
  border: none;
  box-shadow: none;
}

.topbtn {background-color: var(--blue); position: fixed; bottom: 50%; right:0%;z-index: 200; transform: translateY(50%); border:rgba(255,255,255,0.1) solid 1px; border-radius: 5px 0px 0px 5px;}
.topbtn a{ display: flex; flex-direction: column; gap: 10px; padding: 20px 10px;}
.topbtn a:hover img:first-child {transform: rotate(360deg); transition: all 0.5s;;}

.topbtn .topbtn_arrow {width: 15px; height: 100%}
.topbtn .topbtn_txt{width: 13px;}


/* 슬라이드 */
#mainVisual{position:relative; overflow-x: hidden;}

#mainVisual .main_slide{position:relative; width:100%;}
#mainVisual .swiper-wrapper{height:100svh;}
#mainVisual .swiper-slide.bg01{position:relative;background:url(../img/main_v_01.jpg) no-repeat center / cover}
#mainVisual .swiper-slide.bg02{position:relative;background:url(../img/main_v_02.jpg) no-repeat center / cover}
#mainVisual .swiper-slide.bg03{position:relative;background:url(../img/main_v_03.jpg) no-repeat center / cover}

#mainVisual .textbox{position:absolute;top:5vh;left: 5%;z-index:101;width:100%; color:#fff;}
#mainVisual .main_txt{text-align:left;line-height:1.25;font-size: 3rem; color: #fff;font-weight: 800; margin-bottom: 15px;}
#mainVisual .sub_txt{text-align:left;font-size: 1rem; font-weight: 200;line-height: 1.5;}

/* Pager */
#mainVisual .pagerbox{position:absolute;bottom:4vh;left: 5%;z-index:101;width:auto;color:#fff;}
#mainVisual .pager{display:flex;justify-content:left;gap:15px; opacity: 1!important;visibility: visible!important;}
#mainVisual .pager button{opacity:1;position:relative;display:flex;justify-content:center;align-items:center;width:auto;height:auto;border-radius:50%;color:#fff;cursor:pointer;background:transparent;transition:.2s}
#mainVisual .pager button:after{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:5px;height:5px;border-radius:50%;background-color:#fff;content:"";transition:all .2s}
#mainVisual .pager button.on:after{opacity:0}
#mainVisual .pager .progress{transform:rotate(-90deg)}
#mainVisual .pager .circle-origin{fill:transparent;stroke:rgb(255, 255, 255);stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:all .2s}
#mainVisual .pager button.on .circle-origin{animation:progress 4.5s ease}
@keyframes progress{from{stroke-dashoffset:-38}to{stroke-dashoffset:0}}

/* menu */
#pc_menu {position: fixed; z-index: 200; bottom: 2.5vh; left: 50%; transform: translateX(-50%); } 
#pc_menu .navbox {align-items: center;display: flex; border-radius: 10px; height: 100%; ;
      background: linear-gradient(180deg,rgba(71, 71, 71, 0.05),rgba(129, 129, 129, 0.2));
     z-index: 1000; border: solid rgba(255, 255, 255, 0.1) 1px;}
#pc_menu .navbox a{color:rgb(138, 138, 138); font-size: 0.8rem; font-weight: 400; align-items: center; height: 100%; opacity: 100%; transition: all 0.1s; padding: 10px 5px; margin: 5px 10px;}
#pc_menu .navbox a:not(.logo):hover{opacity: 100%; transform: translateY(-3px);} 
#pc_menu .navbox .logo{background: url(../img/menulogo.svg)no-repeat center; height: 28px; width: 73px; opacity: 100%;}

#mo_menu , .mo_submenu  {display: none;}



/* ---- Business Inline Hover ---- */
.menu-business {position: relative;display: flex; align-items: center;}
.menu-business .submenu-inline {display: flex;  overflow: hidden; opacity: 0; max-width: 0; transform: translateX(8px);  transition: all .45s ease; /* ← 더 느리게 */}

/* hover 시 나타남 */
.menu-business:hover .submenu-inline {
    opacity: 1;  max-width: 150px;/* 메뉴2개 들어가는 최소폭만 확보 */  transform: translateX(0);}

.menu-business .submenu-inline a {color: rgb(173, 173, 173);font-size: 0.8rem;font-weight: 200;transition: opacity .2s;}
.menu-business .submenu-inline a:hover { opacity: 1;}



/* meat / seafood 개별 조정 */
#pc_menu .navbox a.meat {margin-right: 0px;/* 기존 20px → 10px로 줄여 meat/seafood 사이 좁히기 */}
#pc_menu .navbox a.seafood {margin-left:0px;  /* meat/seafood 사이 좁히기 */margin-right: 0px; /* navbox 끝에서 살짝 띄우기 */}


/* lang */
#lang {position: absolute;bottom: 3vh; right: 3%; z-index: 200;display: block;align-items: center;}
#lang .lang_menu {position: absolute; bottom: 3vh; right: 50%; transform: translate(50%); margin-bottom: 5px;}
#lang .lang_menu a{color: #fff; text-align: center; display: flex; padding: 5px; opacity: 70%;transition: all 0.3s}
#lang .lang_menu a:hover{opacity: 100%;}
#lang .lang_btn{padding: 10px 10px;}



/* brandStory */
#brandStory{background-color: var(--blue); min-height: 100%; display: flex; align-items: center; justify-content: center;}

#brandStory .logo_ani svg{ width: 100%; height:13vh; align-items: center;}
#brandStory .logo_ani .st0 {fill: #1e2380;}
#brandStory .logo_ani .st1 {fill: #fff;}



#brandStory .brand_txt{ text-align:center; color: white;opacity: 0;}
#brandStory .brand_txt .main{text-align:center;font-weight: 800;; font-size: 3rem;padding-top: 4rem; }
#brandStory .brand_txt .sub{text-align:center;font-weight: 500;font-size: 1.5rem;padding-top: 1.5rem;word-break:keep-all;}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.intro-text {
  animation: slideUp 1s ease-out forwards;
  opacity: 0;
}




/* value [시작]*/

#inc01 > p {opacity: 0;color: #fff; text-align: center; font-size: 1rem; }
/* Corevalue [시작] */
#inc01{width:100%; min-height: 100svh;height: 100%; background-color: var(--blue);  max-width: 2350px; margin: auto; display: flex; flex-direction: column;justify-content:center; gap: 50px; overflow: hidden;}
/* #inc01 .inc01_wrap{position:relative;width:90%;margin:200px auto 0;}
#inc01 .inc01_wrap .tit{display:flex;flex-direction:column;align-items:center}
#inc01 .inc01_wrap .tit a{border:2px solid #fff;background-color:#fff;transition:all .3s} */
#inc01 .cont_wrap{width:100%}
#inc01 .cont_wrap ul{position:relative;display:flex;justify-content:center;align-items:center;width:100%}
#inc01 .cont_wrap ul:after{content:"";position:absolute;top:50%;left:-40%;transform:translateY(-50%);width:calc(100% / 3);height:2px;background-color:#fff}
#inc01 .cont_wrap ul:before{content:"";opacity:0;position:absolute;top:50%;right:25%;transform:translateY(-50%);width:calc(100% / 3);height:2px;background-color:#fff}
#inc01 .cont_wrap.on ul:after{animation:bar_left_ani 0.9s ease-in forwards}
#inc01 .cont_wrap.on ul:before{animation:bar_right_ani 0.9s ease-in forwards;animation-delay:1.2s}
#inc01 .cont_wrap ul li{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;width:450px;height:450px;border-radius:50%;background-color:#1e2380}
#inc01 .cont_wrap ul li:first-child{z-index:1;right:-50px}
#inc01 .cont_wrap ul li:nth-child(2){z-index:2}
#inc01 .cont_wrap ul li:last-child{z-index:3;left:-50px}

#inc01 .cont_wrap ul li h3{font-size:2.5rem;font-weight:800;font-family:var(--e-font);text-align:center;color:#fff}
#inc01 .cont_wrap ul li p{margin-top: 20px; font-size: 1.1rem;text-align:center;color:rgb(255, 255, 255, 0.6)}

#inc01 .cont_wrap ul li svg{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:455px;height:450px}
#inc01 .cont_wrap ul li svg path {stroke-width:1.2;fill:none;stroke-dasharray:610px;stroke-dashoffset:610px;stroke:#fff}
#inc01 .cont_wrap.on ul li svg path {animation:stroke_ani 0.9s ease-in forwards}
#inc01 .cont_wrap ul li:nth-child(1) svg path{animation-delay:0.5s}
#inc01 .cont_wrap ul li:nth-child(2) svg path{animation-delay:0.75s}
#inc01 .cont_wrap ul li:nth-child(3) svg path{animation-delay:1s}

@keyframes stroke_ani {0% {stroke-dashoffset:610px}100% {stroke-dashoffset:0}}
@keyframes stroke_ani_reverse {0% { stroke-dashoffset:0px}100% {stroke-dashoffset:610px}}
@keyframes bar_left_ani{0%{left:-40%} 100%{left:-10%}}
@keyframes bar_right_ani{0%{right:25%;opacity:0} 100%{right:-10%;opacity:1}}
@keyframes item_bar_odd{0%{left:-200%} 100%{left:-100%}}
@keyframes item_bar_even{0%{right:-200%} 100%{right:-100%}}
@keyframes item_bar_mo{0%{bottom:0px} 100%{bottom:-30px}}

/* 반응형 [시작] */
@media (hover:hover){#inc01 .inc01_wrap .tit a:hover{color:#fff;}}
@media (max-width:1480px){
#inc01 .cont_wrap ul li{width:400px;height:400px}
#inc01 .cont_wrap ul li svg{width:405px;height:400px}
}
@media (max-width:1380px){
#inc01 .inc01_wrap{width:95%}
#inc01 .cont_wrap ul li{width:350px;height:350px}
#inc01 .cont_wrap ul li svg{width:355px;height:350px}
#inc01 .cont_wrap ul li h3{font-size:2.3rem;}
#inc01 .cont_wrap ul li p{margin-top:20px;font-size:18px}
}
@media (max-width:1180px){
#inc01 .cont_wrap ul li{width:310px;height:310px}
#inc01 .cont_wrap ul li svg{width:315px;height:310px}
#inc01 .cont_wrap ul li h3{font-size:2rem;}
#inc01 .cont_wrap ul li p{margin-top:15px;font-size:18px}
}
@media (max-width:1024px){
#inc01 .inc01_wrap{margin:120px auto 0}
#inc01 .cont_wrap{margin-top:150px}
#inc01 .cont_wrap ul li{width:270px;height:270px}
#inc01 .cont_wrap ul li:first-child{right:-30px}
#inc01 .cont_wrap ul li:last-child{left:-30px}
#inc01 .cont_wrap ul li svg{width:275px;height:270px}
#inc01 .cont_wrap ul li h3{font-size:1.8rem;}
#inc01 .cont_wrap ul li p{margin-top:10px;font-size:16px}
}
@media (max-width:850px){
#inc01 .cont_wrap ul li{width:245px;height:245px}
#inc01 .cont_wrap ul li:first-child{right:-20px}
#inc01 .cont_wrap ul li:last-child{left:-20px}
#inc01 .cont_wrap ul li svg{width:250px;height:245px}
}


@media (max-width:768px){
#inc01 .inc01_wrap{margin:100px auto 0}
#inc01 .cont_wrap{margin-top:100px}
#inc01 .cont_wrap ul{flex-direction:column;align-items:center;gap:30px}
#inc01 .cont_wrap ul:after{display:none}
#inc01 .cont_wrap ul:before{display:none}
#inc01 .cont_wrap ul li{width:285px;height:285px}
#inc01 .cont_wrap ul li svg{width:287px;height:285px;}
#inc01 .cont_wrap ul li:nth-child(1){right:0px}
#inc01 .cont_wrap.on ul li:nth-child(1):after{content:"";position:absolute;top:50%;left:-200%;transform:translateY(-50%);width:100%;height:1.5px;background-color:#ffffff;animation:item_bar_odd  0.4s ease-in forwards}
#inc01 .cont_wrap.on ul li:nth-child(1):before{content:"";position:absolute;z-index:-1;bottom:0px;left:50%;transform:translateX(-50%);width:1.5px;height:30px;background-color:#ffffff;animation:item_bar_mo  0.4s ease-in forwards;animation-delay:1.2s}
#inc01 .cont_wrap ul li:nth-child(1) svg path{animation-delay:0.4s}
#inc01 .cont_wrap.on ul li:nth-child(2):after{content:"";position:absolute;top:50%;right:-200%;transform:translateY(-50%);width:100%;height:1.5px;background-color:#ffffff;animation:item_bar_even  0.4s ease-in forwards;animation-delay:0.8s}
#inc01 .cont_wrap.on ul li:nth-child(2):before{content:"";position:absolute;z-index:-1;bottom:0px;left:50%;transform:translateX(-50%);width:1.5px;height:30px;background-color:#ffffff;animation:item_bar_mo  0.4s ease-in forwards;animation-delay:1.8s}
#inc01 .cont_wrap ul li:nth-child(2) svg{transform:translate(-50%, -50%) scaleX(-1)}
#inc01 .cont_wrap ul li:nth-child(2) svg path{animation-delay:1.2s}
#inc01 .cont_wrap ul li:nth-child(3){left:0px}
#inc01 .cont_wrap.on ul li:nth-child(3):after{content:"";position:absolute;top:50%;left:-200%;transform:translateY(-50%);width:100%;height:1.5px;background-color:#ffffff;animation:item_bar_odd  0.4s ease-in forwards;animation-delay:1.6s}
#inc01 .cont_wrap ul li:nth-child(3) svg path{animation-delay:2s}
#inc01 .cont_wrap ul li h3{z-index:3;font-size:1.8rem;}
#inc01 .cont_wrap ul li p{z-index:3;margin-top:15px;font-size:16px}
}

@media (max-width:480px){
#inc01 .inc01_wrap{margin:80px auto 0}
#inc01 .cont_wrap{margin-top:80px}
#inc01 .cont_wrap ul{align-items:center;gap:30px}
#inc01 .cont_wrap ul li{width:250px;height:250px}
#inc01 .cont_wrap ul li svg{width:252px;height:250px}
#inc01 .cont_wrap ul li h3{font-size:1.8rem;}
#inc01 .cont_wrap ul li p{margin-top:20px;font-size:16px}


}
@media (max-width:380px){
#inc01 .inc01_wrap{margin:70px auto 0}
#inc01 .cont_wrap{margin-top:70px} 
#inc01 .cont_wrap ul li{width:225px;height:225px}
#inc01 .cont_wrap ul li svg{width:227px;height:225px}
#inc01 .cont_wrap ul li h3{font-size:1.5rem;}
#inc01 .cont_wrap ul li p{margin-top:15px;font-size:15px}
}
/* 반응형 [끝] */

/* Corevalue [끝] */

.meaning {opacity: 0;}
.meaning p{font-size: 1.5rem;line-height: 170%; font-weight: 200; color: #fafafa; max-width: 995px; margin: auto; word-break: keep-all;}



.cursorhide {--ti-cursor-color: transparent;}

/* business [시작] */
#business {width: 100%; background: var(--white); display: flex; flex-direction: column; justify-content: center;min-height: 100svh;height: 100%; }
#business .b_title{font-weight: 700; color: var(--black);font-size: 3rem; text-align: center; letter-spacing: -1px; padding-bottom: 50px; line-height: 130%;} 

#business_typing {word-break: keep-all;}

/* #business .meat_bg{ background: url(../img/b_bg01.jpg)  no-repeat center / cover ;}
#business .seafood_bg{ background: url(../img/b_bg02.jpg)  no-repeat center / cover ;} */

#business .b_tab{position:relative; opacity: 0; max-width:100%; overflow: none;}
#business .b_tab ul{display:flex;height:60svh;text-align:center}
#business .b_tab ul li{flex-grow: 1;transition:all .3s; display: flex; flex-direction: column;align-items: center;}
/*#business .b_tab ul li+li{border-left:1px solid rgba(255,255,255,.1)}*/
#business .b_tab a{position:relative;z-index:1;display:flex; flex-direction:column;justify-content:center;width:100%;height:100%;color:#fff;transition:all .3s;align-items: center; ;}
#business .b_tab h2{font-size:2rem;font-weight: 500;color:#fff;transform: translateY(-15%);padding-bottom: 15px;}
#business .b_tab p{font-size:1rem;font-weight: 300;color:#fff;line-height: 150%;padding-bottom: 15px;transform: translateY(-20%)}
#business .b_tab li .wrap{transition:all .3s}

/* #business .b_tab li .pl{ opacity:0;transition:all .3s;}
#business .b_tab ul li:hover .pl {opacity: 1; visibility: visible;} */

#business .b_tab li .pl{ display: none;}
#business .b_tab ul li:hover .pl {display: block;}

  

#business .b_tab li .pl .b_tabcont{max-width:450px;font-size: 1rem;font-weight: 300;color: rgba(255,255,255,.9);text-align: center;width: 100%;line-height: 150%;}
#business .b_tab li .pl button{ border: #fff 1px solid ; height: auto; padding: 5px 10px; border-radius: 3px;transform: translateY(-30%);font-weight: 500;}


#business .b_tab ul li:hover{flex-grow: 2; }
#business .b_tab ul li:hover a{background:rgba(0,0,0,.5)}
#business .b_tab li .pl button:hover {background-color: #000; color: #fff; transition: all 0.3s;}

 
#business .b_bg{overflow:hidden;position:absolute;width:auto; top:0;width: 100%; height:100%;background:var(--white);  display: block; margin: 0 auto;}
#business .b_bg img {width:100%;height: 100%; object-fit: cover;display: block;overflow: hidden;}

#meat {position:relative;height:auto; display: none;}
#seafood {position:relative;height:auto;display: none;}

.part_wrap {display: flex; width: 90%; margin: auto;}

.part_tab{position:sticky;top:80px;width:30%;height:100%; min-width: 250px;}
.part_tab h2{font-weight: 800;; font-size: 3rem;color: var(--blue);padding: 20px 0px}
.part_tab p {font-size: 1rem; color: var(--gray); padding-left: 3px; font-weight: 500;}

.part_tab ul{padding-top: 5%; min-height: 600px; 

}
.part_tab ul li{padding: 18px 5px;
    position: relative;
}
.part_tab ul li::before {
  content: '';
  position: absolute;
  left: 20px;
  z-index: 0; 
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ccc;
}


/* 첫 번째 li: 위쪽 선 제거 */
.part_tab ul li:first-child::before {top: 50%;}

/* 마지막 li: 아래쪽 선 제거 */
.part_tab ul li:last-child::before {bottom: 50%;}


.part_tab ul li a{font-weight:500; font-size: 1.5rem; color: var(--gray); z-index: 2; background-color: var(--white);
position: relative; /* 추가! */
}
/* .part_tab ul li:last-child{margin-bottom: 300px;} */

.part_tab ul li.on{transition: all 0.1s; ;}
.part_tab ul li.on a{color: var(--blue); font-weight: 700; transition: all 0.3s;}
.part_tab ul li.on .step-label{color: var(--blue); font-weight: 600; }

.step-label{font-size: 0.8rem; color: var(--gray); font-weight: 300; margin-right: 20px; background-color: var(--white); padding: 5px 0px; vertical-align: middle;}

.scroll a{display: flex;flex-direction: column; align-items: center; width: 80px; padding-bottom: 15px;margin-bottom: 80px; }
.scroll img {width: 45px; animation: UpDown 2s ease-in-out infinite;padding-bottom: 5px; }
.scroll p {font-size: 0.8rem; color: var(--gray); font-weight: 300; }

@keyframes UpDown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px); /* 아래로 이동 */
  }
  100% {
    transform: translateY(0); /* 원래 위치로 */
  }
}


.part_contbox{width: 75%; padding:5% 10%;max-width: 1250px;}
.part_contbox li{ border-bottom: rgba(0,0,0,.1) 1px solid; padding: 10% 0px;}
.part_contbox li:last-child{ border-bottom: none; padding-bottom: 0;}
.part_txtbox h3{font-weight:700; font-size: 1.5rem; color: var(--black);padding-bottom: 1rem; padding-top: 20px;}
.part_txtbox p{font-size:1rem;font-weight: 300; line-height: 1.8; color: var(--black);}

.meat_img01{width: 100%; height: 50svh; background: url(../img/meat_01.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px; } 
.meat_img02{width: 100%; height: 50svh; background: url(../img/meat_02.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px;} 
.meat_img03{width: 100%; height: 50svh; background: url(../img/meat_03.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px;} 
.meat_img04{width: 100%; height: 50svh; background: url(../img/meat_04.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px;} 
.meat_img05{width: 100%; height: 50svh; background: url(../img/meat_05.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px;} 

.seafood_img01{width: 100%; height: 50svh; background: url(../img/seafood_img01.jpg)  no-repeat center / cover ;border-radius: 8px;padding-top: 50px;  } 
.seafood_img02{width: 100%; height: 50svh; background: url(../img/seafood_img02.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px;  } 
.seafood_img03{width: 100%; height: 50svh; background: url(../img/seafood_img03.jpg)  no-repeat center / cover ;border-radius: 8px; padding-top: 50px; } 



.point_wrap{position: relative; background-color: rgb(0, 0, 20); width: 100%; height: 100%; overflow: hidden; min-height: 0;}

/* 블러 효과만 담당하는 요소 */
.spotlight-glow {
position: absolute;
width: 500px;
height: 500px;
border-radius: 60%;
pointer-events: none;
background: radial-gradient(
    circle,
    rgba(0, 0, 255, 0.9) 0%, /* 중심은 반투명 블루 */
    rgba(0, 0, 255, 0) 90%   /* 바깥쪽은 완전 투명 */
    );
      filter: blur(150px); /* 부드러운 번짐 효과 */
      transition: transform 0.05s ease;
      z-index: 0; /* 텍스트보다 뒤에 위치 */
    }


.point_cont{position: relative;z-index: 1; color:#fff;display: flex; flex-direction: column; align-items: center; padding: 5% 20%; min-height: 100svh;}

.point_cont .point_title{color: #fff; text-align: center; font-size: 1rem; height: 100%; }
.point_cont ul{width: 100%; margin-top: 5%;}
.point_cont ul li{border-bottom: #fff 1px solid; width: 100%; align-items: center;}

.accordion li > button {width: 100%;;color: #fff; text-align: left;background: none; border: none; padding: 30px 0px; display: flex; align-items: center; justify-content: space-between;}
.accordion li button > div {display: flex; align-items: center;}
.accordion li button > div p {font-size: 1rem; padding-right: 1.5dvw; }
.accordion li button > div h3{font-weight: 700; font-size: 3rem; letter-spacing: -1px; color: #fff; flex-grow: 0.9; padding: 1rem 0px; word-break:keep-all;}

.p_content {display:none;overflow: hidden;padding: 0 3px; transition:padding 0.3s ease;}
.p_content p {font-size:1rem;font-weight: 300; line-height: 1.8; color:#fff; padding-bottom: 30px;}


.plus_wrap{padding:0px}
.plus{position:relative;width:51px;height:51px;transform: rotate(0deg);}
.plus .line1:before{display:block;content:"";position:absolute;left:25px;top:0;width:3px;height:50%;background:#fff;transition:all .2s}
.plus .line1:after{display:block;content:"";position:absolute;left:25px;bottom:0;width:3px;height:50%;background:#fff;;transition:all .2s}

.plus .line2:before{display:block;content:"";position:absolute;left:0;top:24px;width:50%;height:3px;background:#fff;;transition:all .2s}
.plus .line2:after{display:block;content:"";position:absolute;right:0;bottom:24px;width:50%;height:3px;background:#fff;;transition:all .2s}

.plus:hover .line1:before{height:31px;left:40px;transform:rotate(-45deg);}
.plus:hover .line1:after{height:31px;left:40px;transform:rotate(45deg)}

.minus .line1:before{height:31px;left:40px;opacity: 0;}
.minus .line1:after{height:31px;left:40px;opacity: 0;}

/* === Brand logo sequence === */
.logo_ani .st1 {
  fill:#fff;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.8s ease-in-out;
}

.logo_ani .st0 {
  opacity:0;
  transition: opacity .8s ease;
}



/* 푸터 */
#footer {background-color: #0a0a0a; width: 100%;}
#footer p {color: #5c5c5c; font-size: 0.8rem; text-align: center;}
#footer a {color:  #5c5c5c; font-size: 0.8rem; text-align: center;}

.foot1{display: flex; flex-direction: column; padding: 30px 50px 20px 50px; border-bottom: rgba(255, 255, 255, 0.05) 1px solid;}
.footer_logo {margin: auto;}
.footer_logo img {width: 100px; opacity: 0.5;}
.info {padding-top: 1.5%; width: 100%; margin: auto;}
.info li {padding: 0.3rem;}

.foot2{padding-top: 20px; display: flex; padding-bottom: 100px; margin: auto; justify-content: center;}
.foot2 li {padding: 2px 10px;}
.foot2 li:first-child {border-right: #7e7e7e solid 1px}
.foot2 li a:hover {color:#a5a5a5 !important;}
.foot2 a{text-align: center;}



@media all and (max-width:1024px){
.meaning {padding: 8% 15%;  }
.meaning p{font-size: 1.3rem; max-width: 600px;}

#brandStory .brand_txt .sub {font-size: 1.2rem;}

#business .b_title{font-size: 2.5rem;}

.point_cont{padding: 10% 10%;}
.point_cont ul li h3{font-size: 3rem;}

}


@media all and (max-width:768px){

#lang {display: none;} 
#pc_menu{display: none;} 

.topbtn {bottom: 50%; right:0%;z-index: 200; transform: translateY(50%);}
.topbtn a{ padding: 15px 8px;}

.topbtn .topbtn_arrow {width: 13px; height: 100%}
.topbtn .topbtn_txt{width: 10px;}
.topbtn a:hover img:first-child {transform: none;}


/* 모바일 메뉴 */

#mo_menu {display: block;position: fixed;top: 0;  z-index: 200; width: 100%; z-index: 301;}
#mo_menu .mo_navbox{background: linear-gradient(180deg,rgba(255, 255, 255, 0.479),rgba(255, 255, 255, 0.452));border-bottom: solid rgba(223, 223, 223, 0.404) 1px; height: 40px; align-items: center; padding-left: 5%;padding-right: 5%;}
#mo_menu .mo_navbox_R a{ font-size: 0.8rem; font-weight: 700; align-items: center; }
#mo_menu .mo_navbox {display: flex; justify-content:space-between;}
#mo_menu .logo{background: url(../img/menulogo.svg)no-repeat center; align-items: center; padding: 30px;}
.mo_navbox li:first{width: 100px;}

.mo_navbox_R{display: flex; gap: 10px; align-items: center;}
.mo_navbox_R li{padding: 10px;}
.mo_navbox_R li:last-child {padding: 0;}


/* 모바일 서브메뉴 */
.mo_submenu {display: none;}
.mo_submenu {position: fixed; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.61); color: #fff; z-index: 300; top: 0; align-content: center;}
.mo_submenu a{color: var(--blue); display:block; text-align: center; font-size: 2.8rem; font-weight: 800; padding: 5%;}



.mo_navbox_R .menu_btn {position: absolute; width: 23px; height: 24px; right: 0px; top: 50%; margin-top: -12px;}
.mo_navbox_R .menu_btn span {position: absolute; width: 100%; height: 2px; background-color: #222222; left: 0px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
.mo_navbox_R .menu_btn span:nth-child(1) {top: 0px;}
.mo_navbox_R .menu_btn span:nth-child(2) {top: 11px;}
.mo_navbox_R .menu_btn span:nth-child(3) {bottom: 0px;}
.mo_navbox_R .menu_btn.on span:nth-child(1) {transform: rotate(135deg); top: 50%; margin-top: -1px;}
.mo_navbox_R .menu_btn.on span:nth-child(2) {opacity: 0;}
.mo_navbox_R .menu_btn.on span:nth-child(3) {transform: rotate(-135deg); bottom: auto; top: 50%; margin-top: -1px;}


#mainVisual .main_slide{position:relative;width:100%;height:100svh;}
#mainVisual .swiper-wrapper{height:100svh;}

#mainVisual .textbox{position:absolute;bottom:5%;top: auto;left: 5%;z-index:101;width:auto; color:#fff; }
#mainVisual .main_txt{font-size: 2.8rem;}

#mainVisual .pagerbox{position:absolute;bottom:4vh;right:5%; width: auto; z-index:101;width:auto;color:#fff;}
#mainVisual .pager{display:flex; flex-direction: column; align-items: flex-end ;gap:15px; opacity: 1!important;visibility: visible!important;}

#brandStory .logo_ani svg{ width: 100%; height:10vh; align-items: center;}
#brandStory .brand_txt .main{font-size: 2.8rem; margin: auto; width: 400px; line-height: 120%;padding-top: 5rem; }
#mainVisual .sub_txt{max-width: 100%;}


#inc01 {display: block; gap: 0;}

.meaning {padding: 8% 5% 20% 5%;}
.meaning p{font-size: 1.2rem;}

#business {display: block; height: auto;}
#business .b_title{font-size: 2.2rem;width: 400px;margin: auto;line-height: 120%;padding-top: 30%;}
#business .b_tab ul{flex-direction: column;}


#business .b_tab a{border-left: none; border-bottom: 1px solid #fff;}
#business .b_tab ul {gap: 10px;}
#business .b_tab ul li:hover{flex-grow: 1;}
#business .b_tab li .pl button:hover , #business .b_tab li .pl button {background-color: #fff; color: var(--black); appearance: none; -webkit-appearance: none;}

#business .b_tab li .pl{ display: block;}
#business .b_tab ul {background: var(--white);}
#business .b_tab ul li:hover a{background: none;}

#b_tab ul li:first-child a {background: url(../img/b_bg01_m.jpg) no-repeat center / cover !important; min-height: 200px;}
#b_tab ul li:last-child a {background: url(../img/b_bg02_m.jpg) no-repeat center / cover!important; min-height: 200px;}

#business .b_bg{display: none;}
#b_tab ul li{background: none;}

#business .b_tab a{border-left:none;}

.part_wrap {flex-direction: column;width: 100%;}

.part_tab{position:sticky;top:0px;width:100%;height:100%; background-color: var(--white); padding-top: 50px; padding-bottom: 20px;  border-bottom: 1px solid rgba(0,0,0,0.05);}

.part_tab > div {overflow-x:auto; -ms-overflow-style: none; scrollbar-width: none;}
.part_tab > div::-webkit-scrollbar{display: none;}

.part_tab ul{display: flex; justify-content: left;align-items:center;gap:20px;padding-top: 3%; min-height: 0;margin: 0 auto; padding:0 5%;  width: fit-content;}
.part_tab ul li{ text-align: left; position: relative; align-items: center; padding: 18px 0px;}



/* 모바일에서도 step 사이에 선 표시 */
.part_tab ul li::before {
  content: '';
  position: absolute;
  top: 35%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #ccc;
  z-index: 0;
}

/* 첫 번째 li: 왼쪽 선 제거 */
.part_tab ul li:first-child::before {

  top:35%
}

/* 마지막 li: 오른쪽 선 제거 */
.part_tab ul li:last-child::before {
background: none;
} 

/* 텍스트가 선 위에 오도록 */
.part_tab ul li a {
  position: relative;
  z-index: 2;
}


.part_tab ul li a{font-size: 1rem; white-space: nowrap; }
.part_tab ul li.on a{padding-left: 0px;color: var(--blue); border-left:none;font-weight: 700;}
.part_tab ul li:last-child{margin-bottom: 0px;}

.part_tab h2 {padding: 10px 0px;}


.part_tab h2 , .part_tab p {text-align: center; }
.scroll{display: none;}

.step-label{padding-right:10px ;display: block; width:fit-content;} 

.part_contbox{width: 100%; padding:5% 5%;}
.part_contbox li{ border-bottom: none; padding: 0; min-height: 60vh;}
.part_contbox li:last-child{ border-bottom: none; margin-bottom: 0vh;}

  .part_contbox li {
    display: none;
  }

  .part_contbox li.active {
    display: block;
    margin-top: 0;
  }


.meat_img01 , .meat_img02 , .meat_img03 ,.meat_img04 , .meat_img05 , .seafood_img01 , .seafood_img02 , .seafood_img03
{width: 100%;height: 30vh;margin-bottom: 20px; margin-top: 10px;} 

.point_cont{padding: 15% 5% 10% 5%;  gap: 20px; min-height: 50svh;}

.accordion li button {padding: 10px 0px;}
.accordion li button > div p {font-weight: 400;font-size: 1rem; padding-right: 10px;}
.accordion li button > div h3{font-weight: 700;font-size: 1.8rem;padding: 0.9rem 0px;}

.plus_wrap{scale: 0.7;}


}






@media all and (max-width:480px){

  #pc_menu{display: none;}


  #mainVisual .main_txt{font-size: 2rem;}
  #mainVisual .swiper-wrapper{height:100%}

  #brandStory{height:90vh}
  #brandStory .brand_txt .main{font-size: 2.3rem; width: 100%;text-align: center;}
  .meaning p{font-size: 1rem; line-height: 1.6;}


  #business .b_tab ul li:hover{flex-grow: 1; }
  #business .b_tab ul li:hover a{background: none;}

  #business {height: auto;}
  #business .b_title{font-size: 1.8rem; width: 80%; text-align: center;padding-bottom: 30px; line-height: 1.8rem; }
  #business .b_tab li .pl .b_tabcont{font-size: 0.8rem; padding: 5px;}
  #business .b_tab h2{font-size:1.2rem;}

  #business .b_tab li .wrap{padding-top: 10px;}   
  #business .b_tab ul li:hover .pl {padding-bottom: 0px;}
  #business .b_tab ul li:hover{flex-grow: 1; }
  #business .b_tab ul li:hover a{background: none;}
  #business .b_tab li .pl button:hover , #business .b_tab li .pl button {background-color: #fff; color: var(--black); appearance: none; -webkit-appearance: none;}


  .part_txtbox p{line-height: 1.6;}
  .part_txtbox span{font-size: 0.2rem;}
  .part_tab h2{font-size: 2.5rem; padding: 5px 0px 5px 0px; }

  #b_tab ul li:first-child a {min-height: 200px;}
  #b_tab ul li:last-child a {min-height: 200px;}
/* display: flex; flex-wrap: wrap; */
  .part_tab{padding-top: 60px; padding-bottom: 20px;}

  
  .part_txtbox h3{font-size: 1.2rem; }
  .point_cont ul li h3{font-weight: 700;font-size: 1.5rem;}

  .point_cont ul li > button {padding: 10px 0px;}
  .plus_wrap{scale: 0.5;}




  #business .b_tab ul li:hover a{background: none;}

  #business .b_bg{display: none;}
  #b_tab ul li{background: none;}

  .point_wrap{height: 100%;}

  .foot1{padding: 30px 10px 20px 10px;}
}