@charset "utf-8";



.sub .wrap-header {background:#fff;border-bottom: 1px solid #c5c5c573;}
.sub .wrap-header .head-navi .a_1,  .sub .wrap-header .head-logo span, .sub .wrap-header .top-util ul li a {color:#000} 
.sub .wrap-header .head-util li.btn-mgnb, .sub .wrap-header .head-util .menu-open {background: url(/sites/test19/images/common/menu-c.png) center right no-repeat !important; /*padding: 0 40px;*/}
.sub .wrap-header img.white {display:none !important;}
.sub .wrap-header img.color {display:block !important;}
  




.left-menu {position: relative;z-index: 5;min-width: 250px;margin-right: 3%;} 
.left-menu nav h2 {height: 140px;width: 100%;text-align: center;font-size: 28px;color: #fff;line-height: 1.2;letter-spacing: -0.5px;font-weight: 600;background: #213152;background-size: cover;display: flex;flex-direction: column;justify-content: center;border-radius: 30px;border-top-left-radius: 10px;border-bottom-right-radius: 10px;} 
.left-menu nav .a_2 {display: block;padding: 15px 23px 15px 18px;font-size: 16px;color:#333333;line-height: 1.2;border: 1px solid #e3e3e3;border-radius: 10px;position: relative;}
.left-menu nav .a_2:before {content:'';position:absolute;background: url(../../images/common/arrow_1_b.png) center no-repeat;width: 23px;height: 23px;right: 10px;top: 50%;transform: translateY(-50%);background-size: 26% !important;border-radius: 50px;border: 1px solid #9b9b9b;background-position-x: 9px !important;opacity: 0.7;}
.left-menu nav .a_2._active {color: #224188;background: #eceef4 url(../../images/sub_gnb_on.png) no-repeat 90% center;border: 1px solid #6b88b9;font-weight: bold;}
.left-menu nav .a_2._active:before {border-color: #3e5275;background: #213152 url(../../images/common/arrow_1_w.png) center no-repeat;}
.left-menu nav .div_3 {overflow: hidden; max-height: 0;}
.left-menu nav .ul_2 > li {margin-bottom: 10px;}
.left-menu nav .li_2._active .div_3 {max-height: 1000px;background: #f8f9fa;}
.left-menu nav .ul_3 {padding: 5px 15px;border-top: 0px; }
.left-menu nav .ul_3 li {border-bottom: 1px dashed #d9d9d9;}
.left-menu nav .a_3 {position: relative; padding: 10px 15px;background:url("../../images/sub_menu_on.png") no-repeat left center;font-size: 16px;color: #666666;display: block; }
.left-menu nav a[target="_blank"] {background: url(/sites/test19/images/common/nw_icon.png) no-repeat center right; background-position: right 13px top 17px;}
.left-menu nav a[target="_blank"]:before {display:none}
.left-menu nav .a_3:hover, .left-menu nav .a_3._active {color: #3474c9;font-weight: bold;}
.left-menu nav .a_3:hover::before, .left-menu nav .a_3._active::before {content: "";position: absolute;width: 5px;height: 2px; left: 0;top: 15px;}


.left-menu nav .sub_div {margin-top: 25px;} 
.left-menu nav .sub_div ul li:last-child {border-bottom:0;margin-bottom: 0;}



.sub-content {width: calc(100% - 250px);}
.sub-title {height: 140px;margin-bottom: 25px;display: flex;flex-direction: column;justify-content: flex-end;}
.sub-title h2 {border-bottom: 2px solid #e3e3e3;padding: 0px 5px;padding-bottom: 25px;font-weight: bold;font-size: 30px; }
.sub-location { position: absolute;right: 0;top: 10px;}
.sub-location ul {display: flex;justify-content: center;background: #f3f5fa;border-radius: 50px;border: 1px solid #b9c1d1;padding-right: 10px;} 
.sub-location ul li {padding: 15px 12px;margin-left: 0 !important;line-height: 1;}
.sub-location ul li span {text-indent:-9999px;position: relative;}
.sub-location ul li span:before {content:'';position:absolute;top: 7px;left: -10px;width: 3px;height: 3px;background: #656565;border-radius: 50px;}
.sub-location ul li.home {text-indent:-9999px;position:relative;padding-right: 35px;margin-right: 3px;}
.sub-location ul li.home:before {content:'\f015';position:absolute;font-size:20px;width: 80%;h;height: 80%;background: #fff url(../../images/sub/home.png) center no-repeat;left: 4px;top: 50%;transform: translateY(-50%);border-radius: 50px;background-size: 60%;}



/*컨텐츠*/
.wrap-contents{margin-top: 150px;min-height: 700px;padding: 0 20px;}
.wrap-contents .container{position:relative;max-width: 1600px;margin: 0 auto 70px auto;display: flex;}
.wrap-contents .tab_div ul {display: flex;border-bottom: 1px solid #ddd;}
.wrap-contents .tab_div ul li {width: auto !important;border: none;margin: 0;background: none !important;}
.wrap-contents .tab_div ul li a {height: auto;padding: 13px 30px;position: relative;}.wrap-contents .tab_div ul li._active a:before {content:''; position:absolute; bottom:0; left:0; width:100%; border-top:2px solid #213152;}
.wrap-contents .tab_div ul li._active a {color: #0a3688; font-weight: bold;}



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

  .wrap-contents {margin-top: 100px;} 

}

@media all and (max-width: 1024px){
  
  .sub-content {float: none; width: 100%;}
  .left-menu {display: none;}

  .sub-title h2{text-align:center;padding-top: 30px;border-width: 1px;}
  .sub-title {height:auto;}
  .sub-location {left: 50%;transform: translate(-50%);width: 100%;right: auto;}
  .sub-location ul {border: none;background: none;} 
  .sub-location ul li {padding: 0 10px;} 
  .sub-location ul li.home {margin-right: 0;} 

  
}
@media all and (max-width: 420px){
  .sub-location ul {flex-wrap: wrap; gap: 10px 0;}
  .sub-title h2 {padding-top: 55px; padding-bottom: 40px;}
}




/* 인사말 */
#greeting{position:relative;padding-bottom: 80px;word-break: keep-all;}
#greeting .inner .top-box{position:relative;margin: 0 0 80px;}
#greeting .inner .top-box .img{overflow:hidden;display:flex;position:relative;border-radius: 25px;}
#greeting .inner .top-box .img > img{max-width:100%;}
#greeting .inner .top-box .tit{position:absolute;right: 0;bottom:-62px;width:512px;padding: 80px 54px 51px 54px;border-radius:20px 20px 20px 50px;background: url(/sites/healthcare/images/sub/greeting_bg.png) 0 0 no-repeat;background-size: cover;}
#greeting .inner .top-box .tit:before{content:""; position:absolute; right:30px; bottom:-10px; width:143px; height:186px;  background-size:100%;}
#greeting .inner .top-box .tit span{position:relative; line-height:1.3; font-weight:normal; letter-spacing:0; color:#fff;}
#greeting .inner .top-box .tit span small{display:block;margin-bottom:15px;font-family: "Sora", sans-serif;color: #fffcce;font-size: 20px;letter-spacing: -.5px;}
#greeting .inner .top-box .tit span big{display:block;font-size:28px;letter-spacing: -.5px;}
#greeting .inner .top-box .tit span big strong{display:block;font-weight: bold;font-size:34px;}
#greeting .inner .bottom-box .text-area strong{line-height:1.3;margin-bottom:33px;font-weight: 500;color: #224188;font-size:34px;letter-spacing: -.5px;}
#greeting .inner .bottom-box .text-area strong em{font-style:normal; margin:0 7px; font-size:24px;}
#greeting .inner .bottom-box .text-area .flex-wr{display:flex;margin-top: 40px;align-items: flex-start;}
#greeting .inner .bottom-box .text-area .p-img{border-radius:25px; box-shadow: 19px 23px 30px 0px rgba(0, 0, 0, 0.2);}
#greeting .inner .bottom-box .text-area .txt{padding-left: 80px;}
#greeting .inner .bottom-box .text-area p{font-size: 20px;line-height: 1.6;letter-spacing: -0.9px;text-align: left;font-weight: 400;color: #666;word-break: keep-all;}
#greeting .inner .bottom-box .text-area p + p{margin-top:30px;}
#greeting .ceo-name{margin-top: 40px;line-height:1.3;display:flex;letter-spacing: -.5px;align-items:flex-end;gap: 15px;flex-direction:row;justify-content:flex-end;font-weight: 500;color: #222;font-size: 22px;}
#greeting .ceo-name span{font-size: 24px;color:#101010;text-align:right;}
#greeting .ceo-name span > b{font-weight: 500;color: #224188;letter-spacing: -1px;}
#greeting .ceo-name > strong{font-size: 38px;color:#000;font-weight: normal;line-height:1;padding-bottom:1px;font-family: 'kdg_Medium';}

@media (max-width: 1170px){
	#greeting {padding-bottom: 60px;}
	#greeting .inner .bottom-box .text-area .flex-wr {display: block;}
	#greeting .inner .bottom-box .text-area .p-img{float:left; margin:0 60px 40px 0;}
	#greeting .inner .bottom-box .text-area .txt {padding-left: 0;}
	#greeting .inner .top-box .tit {position: absolute; width: 50%; padding: 40px;}
	#greeting .inner .top-box .tit span big strong {font-size: 30px;}
	#greeting .inner .bottom-box .text-area strong {font-size: 28px;}
}
@media (max-width: 767px){
	#greeting{padding-bottom: 40px;}
	#greeting .inner .top-box {margin: 0 0 30px;}
	#greeting .inner .top-box .img {border-radius: 15px 15px 0 0;}
	#greeting .inner .top-box .tit {position: relative;text-align: center;bottom: auto;width: 100%;padding: 20px;border-radius: 0 0 15px 15px;background-position: 50% bottom;}
	#greeting .inner .top-box .tit span small {margin-bottom: 5px; font-size: 16px;}
	#greeting .inner .top-box .tit span big {font-size: 20px;}
	#greeting .inner .top-box .tit span big strong {font-size: 24px;}
	
	#greeting .inner .bottom-box .text-area strong { margin-bottom: 20px; font-size: 20px;}
	#greeting .inner .bottom-box .text-area strong br{display:none;}
	#greeting .inner .bottom-box .text-area .flex-wr {margin-top:30px; text-align:center;}
	#greeting .inner .bottom-box .text-area .p-img{float:none; margin:0 auto 30px; border-radius:15px; max-width:100%;}
	#greeting .inner .bottom-box .text-area p {font-size: 17px;}
	#greeting .inner .bottom-box .text-area p + p {margin-top: 25px;}
  
@media (max-width: 767px){
  #greeting .ceo-name {
    margin-top: 20px;
    justify-content: center;
    flex-direction: column; /* 세로 정렬 */
    align-items: center;    /* 가운데 정렬 */
    text-align: center;
    gap: 5px;               /* 줄 사이 간격 */
  }
  #greeting .ceo-name span,
  #greeting .ceo-name b,
  #greeting .ceo-name strong {
    display: block;   /* 블록 처리 → 줄바꿈 */
    font-size: 20px;
  }
  #greeting .ceo-name strong {
    font-size: 28px;  /* 이름은 더 크게 */
  }
}
}

#gre{position:relative;padding: 0 0 80px 0;}
#gre .greeting{margin:0 auto;position:relative;}
#gre .greeting > ul{}
#gre .greeting > ul > li{position:relative;}
#gre .greeting > ul > li + li{margin-top:100px;}
#gre .greeting > ul > li:nth-child(even) .img-area{left:auto; right:0;}
#gre .greeting > ul > li:nth-child(even) .text-area{padding-left:0; padding-right:200px;}
#gre .greeting > ul > li:nth-child(even) .text-area .text{padding-right: 120px;}
#gre .greeting > ul > li:nth-child(even) .text-area .title{padding-left: 50px;padding-right:150px;}
#gre .greeting > ul > li:nth-child(even) .text-area .text p.first-text{padding-left:0; padding-right:100px;}
#gre .greeting > ul > li:nth-child(even) .ceo-name{padding-left:50px;}
#gre .greeting .img-area{z-index:5;overflow:hidden;position:absolute;top:0;left:0;width:300px;border-radius: 25px;box-shadow:0 5px 20px 0 rgba(75, 96, 118, 0.15);}
#gre .greeting .img-area img{width:100%; max-width:100%;}
#gre .greeting .btn-area{padding-left:60px; font-size:0; line-height:0; text-align:right;}
#gre .greeting .text-area{padding: 30px 0 0 250px;}
#gre .greeting .text-area .title{padding-left: 100px;position:relative;padding-bottom: 30px;font-size:38px;line-height:1.3;color:#161515;word-break: keep-all;}
#gre .greeting .text-area .title big{display:block;color: #212121;font-size:40px;font-weight: 600;letter-spacing: -1px;}
#gre .greeting .text-area .title big strong{color: #f78f1e;font-weight: 600;}
#gre .greeting .text-area .text{padding-left: 50px;padding-right: 50px;padding-top:40px;padding-bottom:50px;word-break: keep-all;position:relative;}
#gre .greeting .text-area .text:before{background: #f0f2f4;top:0;right:0;width: 100%;height:100%;border-radius:30px;display:block;content: "";z-index:-10;position:absolute;}
#gre .greeting .text-area .text p.first-text{font-size: 24px;padding-left: 50px;line-height: 1.5;font-weight: 500;color: #000;letter-spacing: -1px;word-break:keep-all;}
#gre .greeting .text-area .text p.first-text span{display:inline-block; font-style:normal; position:relative; z-index:1; font-weight:600;}
#gre .greeting .text-area .text p.first-text span:before{position:absolute; left:-3px; right:-3px; width:100%; bottom:6px; height:11px; content:""; z-index:-1; background-color:#ffe9e9;}
#gre .greeting .text-area .text .first-text + p{}
#gre .greeting .text-area .text p{font-size: 19px;line-height:1.6;color: #444;letter-spacing: -.5px;word-break:keep-all;}
#gre .greeting .text-area .text p + p{margin-top: 30px;}
#gre .greeting .ceo-name{text-align: left;padding-left:300px;margin-top: 40px; display: block; font-weight: 500; color: #222; font-size: 22px;}
#gre .greeting .ceo-name b{font-weight: 500;color: #f78f1e;letter-spacing: -1px;}
#gre .greeting .ceo-name strong{font-size: 34px;color:#000;font-family: 'kdg_Medium';font-weight: normal;margin-left: 10px;}

@media (max-width: 1024px){
	#gre {padding: 0 0 60px;}
	#gre .greeting .img-area{position:relative; width:100%; max-width:300px; margin:0 auto;}
	#gre .greeting .text-area{padding:0;}
	#gre .greeting .text-area .title{padding:30px 0;}
	#gre .greeting .text-area .title big{text-align:center}
	#gre .greeting .text-area .text p.first-text{padding-left:0;}
	#gre .greeting .ceo-name{text-align:right;padding-left:0;margin-top: 20px;}
}
@media (max-width: 767px){
	#gre{padding-bottom:20px;}
	#gre .greeting .img-area{border-radius:15px;}
	#gre .greeting .text-area .title{padding:20px 0;}
	#gre .greeting .text-area .title big{font-size:24px;}
	#gre .greeting .text-area .title big br{display:none;}
	#gre .greeting .text-area .text{padding:20px;}
	#gre .greeting .text-area .text:before {border-radius: 15px;}
	#gre .greeting .text-area .text p.first-text{font-size:19px;}
	#gre .greeting .text-area .text p{font-size:17px;}
	#gre .greeting .text-area .text p + p{margin-top:20px;}
@media (max-width: 767px){
  #greeting .ceo-name {
    margin-top: 20px;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    gap: 5px;
  }
  #greeting .ceo-name span {
    display: block;
  }
  #greeting .ceo-name span b {
    display: block;   /* b 태그도 블록으로 분리 */
    margin-top: 3px;
  }
  #greeting .ceo-name strong {
    display: block;
    font-size: 28px;
    margin-top: 5px;
  }
}
}


/* 연혁&설립목적 - 설립목적 */
#greeting {position: relative;padding: 80px 20px;background-color: #fff;}
.greeting-wr {display: flex;justify-content: flex-start;align-items: flex-start;max-width: 1200px;margin: 0 auto;gap: 40px;position: relative;}

.greeting-wr::before {content: '';position: absolute;top: 17%;left: 16.75%; /* 이미지(33.5%)의 절반 */width: calc(83.25% - 20px);height: 100%;background: #f9f9f9;border-radius: 24px;z-index: -1;}

.greeting-img {width: 33.5%;max-width: 380px;flex-shrink: 0;}
.greeting-img > img {width: 100%;border-radius: 20px;box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);display: block;}

.greeting-box {flex: 1;padding: 40px 40px 40px 0;}
.gree-tit-wrap {display: inline-block;padding: 0;border-radius: 0;margin-bottom: 30px;}
.gree-tit {font-size: 28px;color: #003366;font-weight: 600;line-height: 1.4;margin: 0;}
.gree-tit > strong {color: #003366;font-weight: 700;}

.circle-text {display: inline-flex;gap: 4px;margin-left: 8px;}
.circle-text span {position: relative;font-weight: 700;font-size: 28px;color: #003366;display: inline-block;}
.circle-text span::before {content: '';position: absolute;top: -12px;left: 50%;transform: translateX(-50%);width: 6px;height: 6px;background-color: #f58b00;border-radius: 50%;}

.gree-txt {position: relative;}
.gree-txt p {font-size: 20px;font-family: 'Pretendard', sans-serif;color: #454545;line-height: 1.9;word-break: keep-all;}
.gree-txt p + p {margin-top: 30px;}

.greeting-box .gree-sign {display: block;margin-top: 50px;text-align: right;font-size: 18px;color: #222;font-weight: 600;}
.greeting-box .gree-sign span {display: block;margin-top: 4px;}

@media (max-width: 1280px) {
  .greeting-wr {flex-direction: column;gap: 30px;padding: 0;}
  .greeting-wr::before {display: none;}
  
  .greeting-img {width: 100%;max-width: 400px !important; margin: 0 auto;}
  .greeting-box {width: 100%;background: #f9f9f9;border-radius: 20px;padding: 30px 20px;}
  .gree-tit-wrap {margin-bottom: 20px;}
  .gree-tit {font-size: 24px;}
  .circle-text span {font-size: 24px;}
  .gree-txt p {font-size: 17px;}
  .greeting-box .gree-sign {font-size: 16px;}
}

@media (max-width: 660px) {
  .gree-tit {font-size: 22px;}
  .circle-text span {font-size: 22px;}
  .gree-txt p + p {margin-top: 20px;}
  .circle-text span::before {top: -10px;width: 5px;height: 5px;}
  .greeting-img {width: 100%;max-width: 260px !important; /* 모바일에서 최대 크기 제한 */margin: 0 auto;   /* 가운데 정렬 */}
  .greeting-img > img {width: 100%;height: auto;border-radius: 16px;}
}
.emphasis-underline {background: linear-gradient(transparent 60%, #fff3cc 60%);font-weight: 700;color: #ff8c00;}

@media (max-width: 430px) {
  .circle-text {margin-left: 0; margin-top: 20px;}
}


/* 참여교수 */
:root {--accent:#004a9a;--sky:#cce7ff;--sky-dark:#7bbef7;--border:#e0e6ef;}
.prof ul {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:20px 12px;box-sizing:border-box;margin:0;}
.prof ul li {display:flex;position:relative;padding:24px;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 6px 14px rgba(0,0,0,0.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.prof ul li:hover {transform:translateY(-6px);border-color:var(--sky-dark);box-shadow:0 10px 20px rgba(124,181,255,.25);}
.prof .img {flex-shrink:0;width:180px;height:250px;overflow:hidden;border-radius:12px;}
.prof .img img {width:100%;height:100%;object-fit:cover;display:block;}
.prof .cnt {flex:1 1 auto;padding-left:24px;min-width:0;}
.prof .cnt h1 {font-size:24px;font-weight:700;color:#222;margin:0;}
.prof .cnt h3 {margin:8px 0 10px;font-size:18px;font-weight:600;color:var(--accent);}
.prof .prof-info {margin:0;padding:0;list-style:none;display:block;}
.prof .prof-info li {display:flex;align-items:center;gap:8px;margin:4px 0;font-size:16px;font-weight:500;line-height:1.5;color:#444;border:none !important;background:none !important;box-shadow:none !important;padding:0 !important;width:auto !important;min-height:auto !important;}
.prof .prof-info li::before {content:'';width:6px;height:6px;border-radius:50%;background:var(--sky-dark);flex:0 0 6px;}
.prof .prof-info a,.prof .prof-info a:active,.prof .prof-info a:focus,.prof .prof-info a:visited {position:static !important;top:auto !important;transform:none !important;transition:color .25s,text-decoration .25s !important;}
.prof .prof-info li a.email {color:#333;text-decoration:none;}
.prof .prof-info li a.email:hover,.prof .prof-info li a.email:focus-visible {color:var(--accent);text-decoration:underline;outline:none;}

@media (max-width:1024px){
  .prof ul {grid-template-columns:1fr;}
}
@media (max-width:720px){
  .prof ul li {flex-direction:column;padding:20px;}
  .prof .img {margin:0 auto;}
  .prof .cnt {padding-left:0;margin-top:12px;text-align:center;}
  .prof .prof-info li::before {display:none;}
  .prof .prof-info li {padding-left:0;}
}
@media (max-width:600px){
  .prof .img {width:100%;max-width:200px;height:auto;}
  .prof .img img {width:100%;height:auto;object-fit:cover;}
  .prof .cnt h1 {font-size:20px;}
}
.prof .prof-info li,.prof .prof-info li:hover,.prof .prof-info li:active {transform:none !important;box-shadow:none !important;border-color:transparent !important;position:static !important;top:auto !important;}


/* 핵심 연구주제 */
:root {--accent:#004a9a;--sky:#cce7ff;--sky-dark:#7bbef7;--border:#e0e6ef;}
.step-lt {display:flex;flex-wrap:wrap;gap:36px;padding:30px 16px;box-sizing:border-box;overflow:visible;}
.step-lt > li {flex:1 1 100%;width:100%;overflow:visible;}
.step-lt .lt-item {display:flex;align-items:center;padding:20px;border-radius:15px;background:#fff;border:1px solid var(--border);box-shadow:0 6px 14px rgba(0,0,0,0.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.step-lt .lt-item:hover {transform:translateY(-6px);border-color:var(--sky-dark);box-shadow:0 10px 20px rgba(124,181,255,0.25);}
.step-lt .lt-tit {display:flex;align-items:center;font-size:22px;font-weight:normal;color:#222;margin:0;}
.step-lt .lt-tit img {width:300px;height:200px;object-fit:cover;border-radius:10px;flex-shrink:0;transition:transform .35s ease;}
.step-lt .lt-item:hover .lt-tit img {transform:scale(1.03);}
.step-lt .lt-tit span {display:inline-block;padding-left:24px;}
.step-lt .lt-tit em {font-style:normal;font-weight:700;color:var(--accent);padding:0 4px 2px;border-radius:2px;background-image:linear-gradient(180deg,transparent 60%,var(--sky) 0%);background-repeat:no-repeat;background-size:calc(100% + 10px) 100%;background-position:-5px 0;-webkit-box-decoration-break:clone;box-decoration-break:clone;}

@media (max-width:1024px){
  .step-lt {gap:28px;padding:24px 14px;}
  .step-lt .lt-tit {font-size:20px;}
  .step-lt .lt-tit img {width:260px;height:170px;}
}
@media (max-width:720px){
  .step-lt {gap:20px;padding:20px 12px;}
  .step-lt > li {flex:1 1 100%;width:100%;}
  .step-lt .lt-item {padding:16px;flex-direction:column;align-items:stretch;}
  .step-lt .lt-tit {display:flex;flex-direction:column;align-items:stretch;font-size:18px;line-height:1.55;text-align:center;}
  .step-lt .lt-tit img {width:100%;height:auto;aspect-ratio:16/9;border-radius:12px;}
  .step-lt .lt-tit span {padding-left:0;margin-top:12px;text-align:center;}
}
@media (hover:none) and (pointer:coarse){
  .step-lt .lt-item:hover {transform:none;border-color:var(--border);box-shadow:0 6px 14px rgba(0,0,0,0.06);}
}


/* 산학협력 및 MOU 현황 */
.card-wrap {display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;}
.card {flex:0 1 calc(50% - 12px);background:#fff;border:1px solid #ddd;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.05);display:flex;flex-direction:column;}
.card-top {background:#003366;padding:16px 20px;text-align:center;border-top-left-radius:12px;border-top-right-radius:12px;}
.card-title-wrap {display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;}
.card-title {font-size:20px;font-weight:700;color:#ffffff;line-height:1.4;letter-spacing:0.5px;}
.card-date {color:#e0e0e0;font-size:14px;font-weight:400;line-height:1.4;}
.card-bottom {padding:16px;display:flex;justify-content:center;align-items:center;background-color:#f9f9f9;}
.card-bottom img {width:100%;height:auto;max-width:100%;display:block;object-fit:cover;}

@media (max-width:768px){
  .card {flex:0 1 100%;}.card-title-wrap {flex-direction:column;align-items:flex-start;text-align:left;}.card-title,.card-date {width:100%;}.card-bottom {padding:12px;min-height:auto;}.card-bottom img {width:100%;height:auto;object-fit:contain;max-height:70vh;}
}