/*공통가이드박스*/
.guide_box{position: relative; padding-bottom:200px;}
.guide_box.ty1{padding-bottom:50px;}
.guide_box > img{width:100%;height:400px; object-fit: cover;}
.guide_box .txt{position:absolute; top:250px; left:50%;  transform: translateX(-50%);; width:70%; background:#fff; padding:30px; text-align:center;}
.guide_box .txt strong{display: flex; align-items: center; justify-content: center;     color:var(--color1); font-weight:700; font-size:3rem;  margin-bottom:20px; gap:15px; }
.guide_box .txt strong span.logo{display:inline-block; font-size:0; text-indent: -999rem; width:130px; height:70px;background:url('/assets/img/sub/img_sub0104_1.png') no-repeat; background-size:100% auto}


.guide_box .txt a.btn{ display:inline-flex; justify-content:center;  align-items:center;  margin:20px auto; background:#222; border:1px solid #000; color:#fff; text-align:center; font-size:1.6rem;  line-height:1.8rem; padding:25px 40px;  transition:background .2s ease,color .2s ease,border-color .2s ease;}
.guide_box .txt a.btn:hover{
  background:#fff;
  color:#222;
  border-color:#000;
}


	@media (max-width: 1024px){ 
		.guide_box > img{height:300px;}
		.guide_box{padding-bottom:100px;}
		.guide_box .txt{width:90%; bottom:unset; top:150px;}
	}
	@media (max-width: 640px){ 
		.guide_box > img{height:200px;}
		.guide_box, .guide_box.ty1{padding-bottom:0;}
		.guide_box .txt{position:unset; width:100%; transform:none; padding: 25px 0; text-align:left; }
		.guide_box .txt strong{ font-size:2.2rem; }
		.guide_box .txt strong .logo{ width:110px; height:60px; font-size:2rem;}
	}
	
/*이미지3열 나열*/	
.img_typ3 ul{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:50px; margin-top:50px;}
.img_typ3 ul li{position: relative;  aspect-ratio: 3 / 2; overflow: hidden; }
.img_typ3 ul li img{width: 100%; height: 100%; object-fit: cover;  display: block;transition: transform .4s ease;}
.img_typ3 ul li > strong{display:block; font-size:2rem; text-align:center; margin-bottom:15px;}
.img_typ3 li:hover img{ transform: scale(1.04);}

@media (max-width: 1024px){
  .img_typ3 ul{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
}
@media (max-width: 640px){
  .img_typ3 ul{ grid-template-columns: 1fr; gap: 18px; }
}

/*이미지4열 나열*/	
.img_typ4 ul{display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:50px; margin-top:50px;}
.img_typ4 ul li{position: relative;  overflow: hidden; }
.img_typ4 ul li img{width: 100%; height: auto; object-fit: cover;  display: block;transition: transform .4s ease;}
.img_typ4 ul li > strong{display:block; font-size:2rem; text-align:center; margin-bottom:15px; height:70px;}
.img_typ4 li:hover img{ transform: scale(1.04);}

@media (max-width: 1024px){
 .img_typ4 ul li > strong{height:50px;}
  .img_typ4 ul{ grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
}
@media (max-width: 640px){
  .img_typ4 ul{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
}


/*인사말*/
.gretting{ 
	display:flex;
	align-items:flex-start;
	justify-content:flex-start;
	gap:70px;
	 flex-wrap: nowrap; 
	 margin:0 20px;
	}

.gretting .img{  flex: 1 1 0; min-width: 0;  }
.gretting .img{position: relative;width: 100%;}

.gretting .img img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  position:relative;
  z-index:100;
}

/* 오른쪽/아래 포인트 바 */
.gretting .img::after{
  content: "";
  position: absolute;
  background: var(--color1);
  z-index: -1;
  width:100%;
  height:100%;
  bottom:-20px;
  right:-20px;
}

.gretting .con{flex: 1.3 1 0;   min-width: 0;}
.gretting .con h4{font-weight:700; font-size:3rem; margin:25px 0 35px 0}
.gretting .con p{margin-bottom:25px;}
.gretting .con .name{display:inline-block; margin-top:50px; padding: 25px 130px 25px 0 ; background:url('/assets/img/sub/img_sub0101_2.png') no-repeat right 0}
.gretting .con .name strong{font-size:3.2rem; letter-spacing:1.5rem; display:inline-block;  padding-left:20px;}

	@media (max-width: 640px){
		.gretting{flex-wrap: wrap;}
		.gretting .img,
		.gretting .con{flex: 1 1 100%;}
	}


/*연혁*/
.history{ display:flex; align-items:flex-start; justify-content:flex-start; gap:70px; flex-wrap: nowrap; }
.history > div.con{flex: 1 1 0; min-width:0;}
.history h4.year{color:var(--color1); font-weight:700; font-size:4rem; }
.history h4.year span{font-size:2rem;}
.history ul{position: relative; padding:25px 0 0 5px;}
.history ul:before{content:''; display:block; width:1px; height:460px;; background:#dbdbdb; position:absolute; left:15px; top:65px;}
.history ul li{position:relative; margin-top:30px; padding-left:40px;}
.history ul li:before{content:''; display:block; width:20px; height:20px; background:#fff;  border:5px solid var(--color1); border-radius: 50%; box-shadow: 0 0 0 2px #fff; position:absolute; top:12px; left:0;}
.history ul li span{font-weight:700; color:var(--color2); font-size:2rem; margin-bottom:10px;}

	@media (max-width: 640px){
		.history{flex-wrap: wrap;}
		.history > div.con{ flex: 1 1 100%;}
		.history ul{padding:0}
		.history ul:before{left:10px; top:25px; height:300px;}
		.history ul li{margin-top:15px; padding-left:30px;}
	}


.vison{text-align:center;}
.vison img{max-width:100%;}


/*part*/
.part ul {display:grid; gap:50px;  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));}
.part ul li{ height:165px;  border:1px solid #dbdbdb;  display:flex; align-items:center; justify-content:center;transition:box-shadow .2s, transform .2s, border-color .2s;}
.part ul li:hover{ box-shadow:0 8px 18px rgba(0,0,0,.08); transform:translateY(-2px);   border-color:#ddd;}
.part ul li img{max-width:70%;max-height:60%; object-fit:contain;display:block;}

@media (max-width:480px){
  .partners ul li{ height:120px; }
}




/*수출현황*/
.export{display:grid; grid-template-columns: 1.8fr 1fr; gap:50px;  align-items: stretch; }
.export .img{border:1px solid #dbdbdb; background:#fff;  box-shadow: 0 10px 24px rgba(0,0,0,.08);  padding:50px; display:flex;   align-items:center; justify-content:center;}
.export .img img{width:100%; object-fit: contain;}
.export .con{display:flex;  justify-content:center;  align-items:center; border:1px solid #dbdbdb; background:#f8f8f8;}
.export .con ul{padding: 28px 36px;  display: grid; grid-template-columns: 1fr 1fr; gap: 50px 100px;}
.export .con li{margin: 2px 0;padding-left: 10px; line-height: 1.6; position:relative}
.export .con li:before{content:''; width:3px; height:3px; background:#000; display:block; position:absolute; top:50%; left:0px;}

/* 반응형: 태블릿/모바일에서 세로 스택 */
@media (max-width: 1024px){
  .export{ grid-template-columns: 1fr; gap: 28px; }
  .export .img{padding:20px;}
  .export .con ul{ grid-template-columns: 1fr 1fr; gap:25px 60px;} /* 태블릿 두 열 유지 */
}


/*찾아오시는길*/
.location{display:grid; grid-template-columns: 1fr 1fr 1fr; gap:50px;  align-items: center; }
.location > div{background-repeat:no-repeat; background-size:70px auto; background-position: 0 50%; padding:25px 0 25px 90px;}
.location > div.add{background-image:url('/assets/img/sub/ico_add.png')}
.location > div.tel{background-image:url('/assets/img/sub/ico_tel.png')}
.location > div.fax{background-image:url('/assets/img/sub/ico_fax.png')}
.location > div strong{font-size:2rem; margin-bottom:10px;}


@media (max-width: 768px){
  .location{ grid-template-columns: 1fr; gap: 28px; }
  .location > div{padding:15px 0 15px 90px}
}


/*제품소개*/

.product_01 { display: flex; flex-wrap: wrap;  justify-content: space-between; }
.product_01 .probox {width: calc(33.333% - 20px); margin-top:50px}
.product_01 .probox h4 {font-size: 24px; font-weight: 600; margin-bottom: 15px;}
.product_01 .probox h4 .eng{color:#666;  font-size:18px; display:inline-block; margin-left:5px;}
.product_01 .probox .img{  border: 1px solid #dbdbdb;}
.product_01 .probox .img img {width: 100%;display: block;margin: 0 auto 20px;}
.product_01 .probox ul.st1{display: flex; flex-wrap: wrap;  justify-content: space-between;  background:#f2f2f2; padding:25px; }
.product_01 .probox ul.st1 li {margin-bottom: 8px;  width:40% }
.product_01 .probox  ul.st1 li:nth-child(2n){width:58%}
.product_01 .probox  ul li strong {color: #0057A3;font-weight: 700;}
.product_01 .probox ul.st2{background:#f2f2f2; padding:25px; }
.product_01 .probox ul.st2 p{color:#666; font-size:1.6rem;}


	@media (max-width: 1024px) {
		.product_01 .probox {width: calc(50% - 15px); margin-top:20px}
		.product_01 .probox ul.st1 li:nth-child(2n), .product_01 .probox  ul.st1 li{width:100%; margin-bottom:0}
		.product_01 .probox ul.st2{padding:15px;}
		.product_01 .probox h4 .eng{margin-left:0; display:block; margin-top:5px;}
	}

	/* 모바일: 1열 */
	@media (max-width: 480px) {
		.product_01 .probox {width: 100%;}
		
		
	}



.tabs-nav {display: flex; }
.tabs-nav .tab-item {width:33.333%; padding: 25px 20px; cursor: pointer; text-align:center; background:#000; color:#fff; font-size:1.8rem; border-right:1px solid #fff;}
.tabs-nav .tab-item:last-child{border-right:0}
.tabs-nav .tab-item.active {background:#fff; color:#000; border:1px solid #000; font-weight:bold}
.tabs-content .tab-panel {display: none;padding: 50px 0;}
.tabs-content .tab-panel.active {display: block;}


.fish-group { margin-bottom: 50px;}
.fish-title {font-size:2.4rem; font-weight: bold; margin-bottom:20px;}
.fish-table-wrap {width: 100%;overflow-x: auto;}
.fish-table { width: 100%;border-collapse: collapse;min-width: 780px; }
.fish-table thead th {background: #5f8db0; color:#fff; padding: 15px;font-weight: 600;border: 1px solid #fff; }
.fish-table tbody th{background:#edf2f5; border: 1px solid #dbdbdb;t}
.fish-table tbody td {padding: 15px;  border: 1px solid #dbdbdb;text-align: center;}




/*떡볶이*/
.product_02{display:grid; grid-template-columns: repeat(3, 1fr); gap:80px;    align-items: start;  margin-top:50px;}
.product_02 .pro-box { display: flex; flex-direction: column;  align-items: center;}
.product_02 strong{font-size:2.8rem; display:block; margin-bottom:15px; text-align:left;}
.product_02 .img{overflow:hidden; }
.product_02 .img img{width:100%;object-fit: cover; }
.product_02 .con p{margin-top:15px;padding:30px; background:#f0f0f0}


	@media (max-width: 1024px) {
		.product_02{ grid-template-columns: repeat(2, 1fr);  gap:20px;    }
		.product_02 strong{font-size:2.2rem; }
	}

	/* 모바일: 1열 */
	@media (max-width: 480px) {
		.product_02{grid-template-columns: repeat(1, 1fr);  }
		
		
	}



.movie {margin-top:50px;}
.movie .video_item { width: 100%;height: auto; display: block;}



.btn_bo_user a.btn_b01,
.btn_bo_user a.btn_admin,
.btn_bo_sch,
.btn_bo_user button {
    display: inline-block !important;
}

.msg_sound_only, .sound_only{font-size:18px !important}