@charset "utf-8";

/* -------------------------------------------------
   TRUST Card Layout (PC/Mobile)
   - 좌측: 배너 썸네일
   - 우측: 정보 카드
   - 하단: 2버튼(상세보기/바로가기)
--------------------------------------------------*/

.trust-m-container{
	display:flex;
	flex-direction:column;
	gap:14px;
	max-width: 1100px;
	margin: 0 auto;
}

.trust-m-item{
	display:flex;
	gap:14px;
	align-items:stretch;
}
@media (max-width: 991px){
  #at-body, .at-body, #at-main, .at-main, .at-container, #thema_wrapper{

    width:100% !important;
    max-width:100% !important;
  }
}
.trust-m-thumb{
	flex:0 0 170px;
	max-width: 220px;
	border-radius:12px;
	overflow:hidden;
	background:#0f1115;
	border:1px solid rgba(255,255,255,.08);
	box-shadow: 0 12px 30px rgba(0,0,0,.25);
}
.trust-m-thumb a{ display:block; width:100%;  }
.trust-m-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

.trust-m-noimg{
	width:100%; height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:11px;
	color:rgba(255,255,255,.6);
	background:#1b1b1b;
}

.trust-m-card{
	flex:1;
	min-width:0;
	position:relative;
	background: linear-gradient(180deg, #2b2f36, #22262c);
	border:1px solid rgba(255,255,255,.08);
	border-radius:12px;
	padding:14px 16px;
	display:flex;
	flex-direction:column;
}


/* 선택 체크박스(관리자용) */
.trust-m-check{
	position:absolute;
	top:12px;
	right:12px;
	margin:0;
}
.trust-m-check input{
	width:18px;
	height:18px;
	accent-color: #ffb200;
}

.trust-m-field{
	display:flex;
	align-items:center;
	gap:12px;
	padding:9px 0;
	border-bottom:1px solid rgba(255,255,255,.08);
}
.trust-m-field-last{ border-bottom:0; }

.trust-m-label{
	flex:0 0 72px;
	color:rgba(255,255,255,.70);
	font-weight:800;
	font-size:14px;
}

.trust-m-value{
	flex:1;
	color:rgba(255,255,255,.92);
	font-weight:800;
	font-size:15px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.trust-m-code{ color:#ffb200; }

.trust-m-actions{
	margin-top:auto;
	display:flex;
	gap:12px;
	padding-top:12px;
}

.trust-m-btn{
	flex:1;
	height:40px;
	border-radius:10px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-weight:800;
	font-size:14px;
	text-decoration:none !important;
	white-space:nowrap;
	transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.trust-m-btn i{ margin-left:6px; }

.trust-m-btn-detail{
	background:#3a3f47;
	color:#e6e9ee !important;
	border:1px solid rgba(255,255,255,.10);
}

.trust-m-btn-go{
	background:transparent;
	color:#ffb200 !important;
	border:1px solid #ffb200;
}

/* Hover(PC 중심) */
@media (hover:hover) {
	.trust-m-item:hover .trust-m-card{
		border-color: rgba(255,178,0,.28);
		box-shadow: 0 10px 26px rgba(0,0,0,.18);
	}
	.trust-m-item:hover .trust-m-btn-detail{ background:#444b55; }
	.trust-m-item:hover .trust-m-btn-go{ background:rgba(255,178,0,.08); }
	.trust-m-btn:hover{ transform: translateY(-1px); }
}

/* -------------------------------------------------
   Responsive
--------------------------------------------------*/

/* PC(넓은 화면): 조금 더 여유 있게 */
@media all and (min-width:992px) {
	.trust-m-container{ gap:18px; }
	.trust-m-item{ gap:18px; }
	.trust-m-thumb{ flex-basis: 190px; max-width: 240px; }
	.trust-m-card{ padding:16px 18px; }
	.trust-m-label{ flex-basis: 78px; font-size:14px; }
	.trust-m-value{ font-size:16px; }
	.trust-m-btn{ height:42px; font-size:14px; }
}

/* 태블릿/모바일: 썸네일/폰트/버튼 조금 작게 */
@media all and (max-width:991px) {
	.trust-m-container{ max-width:none; }
	.trust-m-thumb{  max-width:160px; border-radius:10px; }
	.trust-m-card{ border-radius:10px; padding:10px 12px; }
	.trust-m-label{ flex-basis:64px; font-size:13px; }
	.trust-m-value{ font-size:14px; }
	.trust-m-btn{ height:38px; border-radius:8px; font-size:13px; }
	.trust-m-actions{ gap:10px; padding-top:10px; }
	.trust-m-check{ top:10px; right:10px; }
	.trust-m-check input{ width:16px; height:16px; }
}

@media all and (max-width:420px) {
	.trust-m-thumb{ flex-basis:118px; }
	.trust-m-label{ flex-basis:58px; font-size:12px; }
	.trust-m-value{ font-size:13px; }
	.trust-m-btn{ height:36px; font-size:12px; }
}

/* 빈 목록 */
.list-none{ padding:30px 0; }
