﻿@charset "utf-8";

/************   margin     *********************/

.mt100{margin-top:100px !important}
.mt95{margin-top:95px !important}
.mt90{margin-top:90px !important}
.mt85{margin-top:85px !important}
.mt80{margin-top:80px !important}
.mt75{margin-top:75px !important}
.mt70{margin-top:70px !important}
.mt65{margin-top:65px !important}
.mt60{margin-top:60px !important}
.mt55{margin-top:55px !important}
.mt50{margin-top:50px !important}
.mt45{margin-top:45px !important}
.mt44{margin-top:44px !important}
.mt40{margin-top:40px !important}
.mt35{margin-top:35px !important}
.mt34{margin-top:34px !important}
.mt30{margin-top:30px !important}
.mt25{margin-top:25px !important}
.mt20{margin-top:20px !important}
.mt15{margin-top:15px !important}
.mt10{margin-top:10px !important}
.mt5{margin-top:5px !important}
.mt0{margin-top:0px !important}

.mr100{margin-right:100px !important}
.mr95{margin-right:95px !important}
.mr90{margin-right:90px !important}
.mr85{margin-right:85px !important}
.mr80{margin-right:80px !important}
.mr75{margin-right:75px !important}
.mr70{margin-right:70px !important}
.mr65{margin-right:65px !important}
.mr60{margin-right:60px !important}
.mr55{margin-right:55px !important}
.mr50{margin-right:50px !important}
.mr45{margin-right:45px !important}
.mr40{margin-right:40px !important}
.mr35{margin-right:35px !important}
.mr30{margin-right:30px !important}
.mr25{margin-right:25px !important}
.mr20{margin-right:20px !important}
.mr15{margin-right:15px !important}
.mr10{margin-right:10px !important}
.mr7{margin-right:7px !important}
.mr5{margin-right:5px !important}

.mb100{margin-bottom:100px !important}
.mb95{margin-bottom:95px !important}
.mb90{margin-bottom:90px !important}
.mb85{margin-bottom:85px !important}
.mb80{margin-bottom:80px !important}
.mb75{margin-bottom:75px !important}
.mb70{margin-bottom:70px !important}
.mb65{margin-bottom:65px !important}
.mb60{margin-bottom:60px !important}
.mb55{margin-bottom:55px !important}
.mb50{margin-bottom:50px !important}
.mb45{margin-bottom:45px !important}
.mb40{margin-bottom:40px !important}
.mb35{margin-bottom:35px !important}
.mb30{margin-bottom:30px !important}
.mb25{margin-bottom:25px !important}
.mb20{margin-bottom:20px !important}
.mb15{margin-bottom:15px !important}
.mb10{margin-bottom:10px !important}
.mb5{margin-bottom:5px !important}
.mb0{margin-bottom:0 !important}

.ml100{margin-left:100px !important}
.ml95{margin-left:95px !important}
.ml90{margin-left:90px !important}
.ml85{margin-left:85px !important}
.ml80{margin-left:80px !important}
.ml75{margin-left:75px !important}
.ml70{margin-left:70px !important}
.ml65{margin-left:65px !important}
.ml60{margin-left:60px !important}
.ml55{margin-left:55px !important}
.ml50{margin-left:50px !important}
.ml45{margin-left:45px !important}
.ml40{margin-left:40px !important}
.ml35{margin-left:35px !important}
.ml30{margin-left:30px !important}
.ml25{margin-left:25px !important}
.ml20{margin-left:20px !important}
.ml18{margin-left:18px !important}
.ml15{margin-left:15px !important}
.ml10{margin-left:10px !important}
.ml5{margin-left:5px !important}


/************   padding     *********************/

.pt100{padding-top:100px !important}
.pt95{padding-top:95px !important}
.pt90{padding-top:90px !important}
.pt85{padding-top:85px !important}
.pt80{padding-top:80px !important}
.pt75{padding-top:75px !important}
.pt70{padding-top:70px !important}
.pt65{padding-top:65px !important}
.pt60{padding-top:60px !important}
.pt55{padding-top:55px !important}
.pt50{padding-top:50px !important}
.pt45{padding-top:45px !important}
.pt40{padding-top:40px !important}
.pt35{padding-top:35px !important}
.pt30{padding-top:30px !important}
.pt25{padding-top:25px !important}
.pt20{padding-top:20px !important}
.pt15{padding-top:15px !important}
.pt10{padding-top:10px !important}
.pt5{padding-top:5px !important}
.pt0{padding-top:0px !important}

.pr100{padding-right:100px !important}
.pr95{padding-right:95px !important}
.pr90{padding-right:90px !important}
.pr85{padding-right:85px !important}
.pr80{padding-right:80px !important}
.pr75{padding-right:75px !important}
.pr70{padding-right:70px !important}
.pr65{padding-right:65px !important}
.pr60{padding-right:60px !important}
.pr55{padding-right:55px !important}
.pr50{padding-right:50px !important}
.pr45{padding-right:45px !important}
.pr40{padding-right:40px !important}
.pr35{padding-right:35px !important}
.pr30{padding-right:30px !important}
.pr25{padding-right:25px !important}
.pr20{padding-right:20px !important}
.pr15{padding-right:15px !important}
.pr10{padding-right:10px !important}
.pr5{padding-right:5px !important}

.pb100{padding-bottom:100px !important}
.pb95{padding-bottom:95px !important}
.pb90{padding-bottom:90px !important}
.pb85{padding-bottom:85px !important}
.pb80{padding-bottom:80px !important}
.pb75{padding-bottom:75px !important}
.pb70{padding-bottom:70px !important}
.pb65{padding-bottom:65px !important}
.pb60{padding-bottom:60px !important}
.pb55{padding-bottom:55px !important}
.pb50{padding-bottom:50px !important}
.pb45{padding-bottom:45px !important}
.pb40{padding-bottom:40px !important}
.pb35{padding-bottom:35px !important}
.pb30{padding-bottom:30px !important}
.pb25{padding-bottom:25px !important}
.pb20{padding-bottom:20px !important}
.pb15{padding-bottom:15px !important}
.pb10{padding-bottom:10px !important}
.pb5{padding-bottom:5px !important}
.pb0{padding-bottom:0 !important}

.pl100{padding-left:100px !important}
.pl95{padding-left:95px !important}
.pl90{padding-left:90px !important}
.pl85{padding-left:85px !important}
.pl80{padding-left:80px !important}
.pl75{padding-left:75px !important}
.pl70{padding-left:70px !important}
.pl65{padding-left:65px !important}
.pl60{padding-left:60px !important}
.pl55{padding-left:55px !important}
.pl50{padding-left:50px !important}
.pl45{padding-left:45px !important}
.pl40{padding-left:40px !important}
.pl35{padding-left:35px !important}
.pl30{padding-left:30px !important}
.pl25{padding-left:25px !important}
.pl20{padding-left:20px !important}
.pl15{padding-left:15px !important}
.pl10{padding-left:10px !important}
.pl5{padding-left:5px !important}

.pd5 {padding:5px !important}

/****가로*****/
.w10 {width:10% !important}
.w12 {width:12% !important}
.w15 {width:15% !important}
.w20 {width:20% !important}
.w30 {width:30% !important}
.w40 {width:40% !important}
.w50 {width:50% !important}
.w60 {width:60% !important}
.w69 {width:69% !important}
.w70 {width:70% !important}
.w75 {width:75% !important}
.w80 {width:80% !important}
.w85 {width:85% !important}
.w90 {width:90% !important}
.w100 {width:100% !important}

.wp50 {width:50px !important}
.wp60 {width:60px !important}
.wp70 {width:70px !important}
.wp80 {width:80px !important}
.wp100 {width:100px !important}
.wp120 {width:120px !important}
.wp130 {width:130px !important}
.wp135 {width:135px !important}
.wp140 {width:140px !important}
.wp150 {width:150px !important}
.wp165 {width:165px !important}
.wp170 {width:170px !important}
.wp200 {width:200px !important}
.wp300 {width:300px !important}
.wp400 {width:400px !important}
.wp450 {width:450px !important}
.wp500 {width:500px !important}
.wp600 {width:600px !important}
.wp700 {width:700px !important}
.wp800 {width:800px !important}
.wp900 {width:900px !important}
.wp1000 {width:1000px !important}
.wp1100 {width:1100px !important}
.wp1150 {width:1150px !important}
.wp1200 {width:1200px !important}
.wp1300 {width:1400px !important}
.wp1500 {width:1500px !important}
.wp1660 {width:1660px !important}
.wp1800 {width:1800px !important}
.wp2000 {width:2000px !important}
.wp2200 {width:2200px !important}
.wp2600 {width:2600px !important}
.wp3000 {width:3000px !important}
.wp3300 {width:3300px !important}
.wp3400 {width:3400px !important}
.wp3600 {width:3600px !important}
.wp4000 {width:4000px !important}
.wp6813 {width:6813px !important}
.wp6933 {width:6933px !important}


/** 세로 **/
.hnone {height:auto !important}
.h20    {height:20px !important;}
.h30    {height:30px !important;}
.h40    {height:40px !important;}
.h50    {height:50px !important;}
.h60    {height:60px !important;}
.h70    {height:70px !important;}
.h80    {height:80px !important;}
.h90    {height:90px !important;}
.h100    {height:100px !important;}
.h110    {height:110px !important;}
.h120    {height:120px !important;}
.h130    {height:130px !important;}
.h140    {height:140px !important;}
.h150    {height:150px !important;}
.h180    {height:180px !important;}
.h190    {height:190px !important;}
.h200    {height:200px !important;}
.h210    {height:210px !important;}
.h220    {height:220px !important;}
.h230    {height:230px !important;}
.h240    {height:240px !important;}
.h250    {height:250px !important;}
.h260    {height:260px !important;}
.h270    {height:270px !important;}
.h280    {height:280px !important;}
.h290    {height:290px !important;}
.h300    {height:300px !important;}
.h310    {height:310px !important;}
.h320    {height:320px !important;}
.h330    {height:330px !important;}
.h340    {height:340px !important;}
.h350    {height:350px !important;}
.h360    {height:360px !important;}
.h370    {height:370px !important;}
.h380    {height:380px !important;}
.h390    {height:390px !important;}
.h400    {height:400px !important;}
.h410    {height:410px !important;}
.h420    {height:420px !important;}
.h430    {height:430px !important;}
.h440    {height:440px !important;}
.h441    {height:441px !important;}
.h450    {height:450px !important;}
.h460    {height:460px !important;}
.h470    {height:470px !important;}
.h480    {height:480px !important;}
.h490    {height:490px !important;}
.h500    {height:500px !important;}

/* 요소간의 간격*/
.gap5 {gap: 5px !important}
.gap10 {gap: 10px !important}
.gap15 {gap: 15px !important}
.gap20 {gap: 20px !important}
.gap25 {gap: 25px !important}


.noMG{margin: 0 !important}
.noPG{padding: 0 !important}
.noBD{border:none !important}

.fl {float:left}
.fr {float:right}
.tac {text-align:center !important}
.tar {text-align:right !important}
.tal {text-align:left !important}
.dib {display:inline-block !important}
.dih {display:none !important}
.disF {display:flex !important}
.vat {vertical-align:top !important}

.pointer {cursor:pointer;}

.subTitleCut{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

.bdh {border-width: 0;} /* outline 테두리 없애기 */

.videoBox{width:100%; height:100%;}
.imgBox {width:100%; height:100%; object-fit:cover;}
.imgBoxFill {width:100%; height:100%; object-fit:fill;}
.imgBoxCont {width:100%; height:100%; object-fit: contain;}


 /*페이지네비*/
.pagination {-webkit-box-align: center;align-items: center;display: flex;justify-content: center;position: relative;}
.pagination li a {transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease;display:block;margin:0 3px;float:left;width:34px;height:34px;-webkit-box-align: center;align-items: center;display: flex;justify-content: center;text-align:center;font-size:16px;color:#333333;font-weight: 500;text-decoration:none;letter-spacing: -1px;border-radius: 5px;line-height: 1;}
.pagination li.active a {background-color:#5d5e65;color:#fff;} 
.pagination li.first {margin-right: 4px;}
.pagination li.first a {background-image:url('../../img/sub/page_pprev.png');background-repeat: no-repeat;background-position: center center;background-color: #fff;opacity: 0.8;margin-left:0;font-size: 0;text-indent: -9999px;width: 34px;height: 34px;}
.pagination li.prev {margin-right:5px;}
.pagination li.prev a {background-image:url('../../img/sub/page_prev.png');background-repeat: no-repeat;background-position: center center;background-color: #fff;opacity: 0.8;margin-left:0;font-size: 0;text-indent: -9999px;width: 34px;height: 34px;}
.pagination li.last {margin-left: 4px;}
.pagination li.last a {background-image:url('../../img/sub/page_nnext.png');background-repeat: no-repeat;background-position: center center;background-color: #fff;opacity: 0.8;margin-left:0;font-size: 0;text-indent: -9999px;width: 34px;height: 34px;}
.pagination li.next {margin-left:5px;}
.pagination li.next a {background-image:url('../../img/sub/page_next.png');background-repeat: no-repeat;background-position: center center;background-color: #fff;opacity: 0.8;margin-left:0;font-size: 0;text-indent: -9999px;width: 34px;height: 34px;}
.pagination a:hover,
.pagination a.active {background-color:#5d5e65;color:#fff;} 



/* 제품상세 페이지 유튜브 용*/
.vid {height: 70.41px;background-position: 0 0;background-size: cover;background-repeat: no-repeat;position: relative;border-radius: 10px;}
.vid .play {position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
.vid .play img {width: 40px;}


/* 제품 이미지 스크롤 */
.image_roll {max-width: 840px;margin: 0 auto;position: relative;}
.image_roll .item {border-radius: 15px;}
.image_roll .item img {border-radius: 15px;}
.image_roll .owl-carousel .owl-nav button.owl-next,
.image_roll .owl-carousel .owl-nav button.owl-prev {width: 26px;height: 42px;background-repeat: no-repeat;background-position: center center;position: absolute;top: 60px;margin-top: -21px;z-index: 10;}
.image_roll .owl-carousel .owl-nav button.owl-prev {left: -60px;background-image: url('../../img/sub/sc_prev.png');}
.image_roll .owl-carousel .owl-nav button.owl-next {right: -60px;background-image: url('../../img/sub/sc_next.png');}
.image_roll .owl-carousel .owl-nav button.owl-next span,
.image_roll .owl-carousel .owl-nav button.owl-prev span {display: none;}
.image_roll .owl-dots {display: flex;align-items: center;justify-content: center;gap: 5px;margin-top: 20px;}
.image_roll .owl-carousel button.owl-dot {width: 12px;height: 12px;border-radius: 50%;background-color: #e1dfdf;display: flex;align-items: center;justify-content: center;}
.image_roll .owl-carousel button.owl-dot.active {background-color: #5463e2;}


/* Suppliers 아이콘 선택 */
.selected-item {background-color: #D9E1FA !important}


/* Mypage Inquiry 팝업 관련 */
.p_buyer_box {border-radius: 15px;padding: 15px;background-color: #f5f7fb;}
.p_buyer_boxin {display: flex;align-items: center;}
.p_buyer_boxin .img {flex-shrink: 0;width: 250px;border: 1px solid #ddd;border-radius: 15px;background-color: #fff;padding: 15px;}
.p_buyer_boxin .img img {border-radius: 15px;}
.p_buyer_boxin .info {flex-grow: 1;padding-left: 30px;}
.p_buyer_boxin .info .p_bb_tit {font-size: 18px;color: #333;font-weight: 500;}
.p_table {border-collapse:collapse;border-spacing:0;width: 100%;border-top: 1px solid #000;}
.p_table td,
.p_table th {border-bottom: 1px solid #dddddd;vertical-align: middle;padding: 15px 15px;}
.p_table td {font-weight: 400;font-size: 18px;color: #666666;}
.p_table th {background-color: #ececec;font-weight: 700;font-size: 18px;color: #111111;text-align: center;}
.p_table .tleft {text-align: left;}
.p_table .tright {text-align: right;}
.p_table .link {color: #333333;font-weight: 700;}
.p_table .link:hover {text-decoration: underline;}
.p_table .tr_link {cursor: pointer;}
.p_table .p_th {width: 150px;}
.p_table_hscroll {overflow-y: auto;overflow-x: hidden;-webkit-overflow-scrolling: touch;max-height: 400px;}
.p_tit_box {border-radius: 15px;padding: 15px;background-color: #f5f7fb;}
.p_tit_box .tit {font-size: 22px;color: #333;font-weight: 600;margin-bottom: 10px;}
.p_tit_box .date {font-size: 18px;color: #333;font-weight: 400;}
.ptextarea {border: 1px solid #ddd;border-radius: 5px;height: 90px;width: 100%;padding: 0 10px;font-size: 15px;color: #000;font-weight: 500;}

/*카테고리*/
.search_summary {display: flex;align-items: center;justify-content: center;border: 1px solid #ddd;border-radius: 15px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);}
.search_summary .th {flex-shrink: 0;width: 220px;font-size: 22px;color: #fff;font-weight: 700;background-color: #5463e2;padding: 25px;border-radius: 15px 0 0 15px;text-align: center;height: 100%;display: flex;align-items: center;justify-content: center;}
.search_summary .td {flex-grow: 1;overflow: hidden;height: 100%;}
.search_summary .td .item {float: left;width: 100%;border-right: 1px solid #ddd;height: 100%;}
.search_summary .td .item:last-child {border-right: none;}
.search_summary .td .item,
.search_summary .td .item ul {height: 100%;}
.search_summary .td .item li {display: flex;align-items: center;justify-content: space-between;font-size: 18px;color: #333;font-weight: 500;border-bottom: 1px solid #ddd;padding: 15px 25px;height: 20%;}
.search_summary .td .item li span {color: #5463e2;font-weight: 700;font-size: 16px;}
.search_summary .td .item li:last-child {border-bottom: none;}

/* 검색 결과 섹션 */
.search_results { margin-bottom: 60px; }
.result_section { background-color: #fff; border: 1px solid #ddd; border-radius: 10px; padding: 25px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.section_header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 2px solid #f0f0f0; }
.section_title { font-size: 22px; font-weight: 700; color: #333; margin: 0; }
.section_count { background-color: #5463e2; color: #fff; padding: 8px 15px; border-radius: 20px; font-size: 14px; font-weight: 600; margin-left: auto; margin-right: 15px; }
.more_link { color: #5463e2; font-size: 15px; font-weight: 500; text-decoration: none; transition: all 0.3s ease;display: flex;align-items: center; }
.more_link:after {content: '';display: block;width: 14px;height: 14px;background-image: url('../../img/sub/ico_blueplus.svg');background-repeat: no-repeat;background-size: 14px auto;margin-left: 5px;}
.more_link:hover { color: #3a4bc7; text-decoration: underline; }
.result_list { margin-top: 15px; }
.result_item { padding: 12px 0; border-bottom: 1px solid #f0f0f0; transition: all 0.3s ease; }
.result_item:last-child { border-bottom: none; }
.result_item:hover { background-color: #f8f9fb; padding-left: 10px; border-radius: 5px; }
.result_link { color: #333; font-size: 16px; font-weight: 500; text-decoration: none; line-height: 1.5; transition: all 0.3s ease; }
.result_link:hover { color: #5463e2; text-decoration: underline; }

/* 상품이미지 */
.zoom-image {
	transition: transform 0.3s ease;
	cursor: zoom-in;
}		
.zoom-image.zoomed {
	transform: scale(1.5); /* 1.5배 확대 */
	z-index: 10;
}
		
/* 공통 썸네일 박스: 크기 통일 + 테두리 */
.supplers_info_wrap .thumb .owl-carousel .item a {
	display: block;
	aspect-ratio: 1.5 / 1;       /* 정사각형 비율 고정 */
	position: relative;        /* 버튼 오버레이 기준 */
	border: 1px solid #ddd;
	border-radius: 12px;
	overflow: hidden;
	height:70px;
}
		
/* 내부 이미지: 꽉 채우기 + 비율 유지 */
.supplers_info_wrap .thumb .owl-carousel .item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
		
/* 재생 버튼 오버레이: 중앙 정렬 */
.supplers_info_wrap .thumb .owl-carousel .item .play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none; /* 클릭은 a로 전달 */
	z-index: 2; 			/* 이미지 위로 */
}
		
/* 재생 버튼 아이콘 크기 고정 */
.supplers_info_wrap .thumb .owl-carousel .item .play img {
	width: 40px !important;  /* 가로 크기 고정 */
	height: auto !important; /* 세로는 비율 유지 */
	max-width: none;         /* 기존 max-width 규칙 무시 */
	max-height: none;        /* 기존 max-height 규칙 무시 */
}


/* ----- qr 관련 -----*/
.qrdiv {
	display: flex;
	justify-content: center; /* 가로 중앙 */
	align-items: center;     /* 세로 중앙 */
	gap: 15px !important
}
 









