@charset "utf-8";
/* CSS Document */

/* 탑 제목 */
.webinar_title-area {position: relative; min-height:384px; background-size: cover; background-repeat: no-repeat; background-position: center;}
.webinar_title-area img {max-width:100%;}

.webinar_title-wrapper {padding:80px 0px;}
.webinar_title-wrapper h2 {margin-bottom: 50px;}
.webinar_title-wrapper h3 {color: #131022; font-size:42px; font-weight:900; line-height: 1.3; margin-bottom: 20px; letter-spacing: -0.1rem;}
.webinar_title-wrapper h3 span {display:block; font-weight:900;}

/* 강연자 */
.project-cart .projects__content { 
	min-height: 416px;
	width: 373px;
 }
 .project-video {
	height: 100%;
    min-height: 416px; /* 기존 510px에서 변경 */
    display: flex;
    flex-direction: column;
 }
.project-cart .projects__content h3 { font-size:22px; margin-top:5px; margin-bottom:17px; font-weight:800; }
.project-cart .projects__content li {color: #838694; font-size: 16px; line-height: 26px;}
.project-cart .projects__manager .name h5 {margin-bottom:5px; font-weight:800; }
.project-cart .projects__manager .name address { line-height: 1.5;}
.project-cart .line-top {border-top: 1px solid #e7e7e7; padding-top: 20px;}

.project-video .project-img::before {background:#281c40; opacity: 0.8;}

.blog-post-area {padding-top:30px; border-top: 2px solid #e7e7e7; border-bottom:none;}
.blog-post-area h4 {font-weight: 800; line-height: 1.4;}
.blog-post-area h5 {font-size: 16px;}
.blog-post-area p {font-size: 14px; color: #838694; line-height: 1.4;}
.blog-post-area .stitle {}
.blog-post-area ul li {list-style: disc; margin-left: 15px; color: #838694; font-size:14px; line-height: 24px;}

.reviewer__content h5 { font-size:22px; font-weight: 800; }
.reviewer__content h5 span {font-size: 16px;}
.reviewer__content .title {font-size: 18px; color: #1a1e2d; font-weight:bold;}
.reviewer__content .title span {font-size: 16px; color: #1a1e2d; font-weight:bold; display:inline;}
.reviewer__content p {font-size:15px; font-weight: normal; color:#838694; line-height:1.6;}
.reviewer__content p span {display: block; font-size:15px; color:#838694;}

.reviewer__img {margin-right: 30px;}

/* 이벤트 */
.blog-wrapper {margin-right:32px;}
.blog-wrapper .section-title p {margin-bottom:20px; font-size:16px; font-weight:500; color:#292a2e; }
.blog-wrapper .section-title p span { display: block;}
.blog-wrapper .section-title ul {margin:15px 0;}
.blog-wrapper .section-title ul li {list-style: disc; margin-left: 15px; margin-bottom:5px; color: #ee6b5b; font-size:16px; line-height:1.3;}

.blog-wrapper .theme_btn2 {background:#ee8073; color: #fff;}

@media only screen and (min-width: 768px) and (max-width: 991px) {    
	/* 탑 제목 */
    .project-image-area {background-position :72% 0%;}
	.webinar_title-wrapper {padding:75px 25px;}
	.webinar_title-wrapper h3 {font-size:32px;  line-height: 1.1; margin-bottom:20px;}
	.webinar_title-wrapper p {font-size:16px;}
	
	/* 동영상 */
	.project-cart .new-tag {font-size:12px;}
	.project-cart .projects__content h3 {font-size:22px;}

	
	/* 강연자 */
	.blog-post-area h4 {font-size:21px;}
    .reviewer__content p span {display:inline;}
	
	/* 이벤트 */
	.blogs__thumb img { width: 100%;}	
	.blog-wrapper .section-title { margin-right:0px;}
	.blog-wrapper .section-title h2 {font-size:30px; margin-bottom:10px;}
	.blog-wrapper .section-title h2 span {font-size: 18px; font-weight: bold; display: block;}
	.blog-wrapper .section-title h6 {font-size:18px;}
	.blog-wrapper .section-title ul li {margin-bottom:10px; line-height:1.3;}
	.blog-wrapper .section-title p span {display:inline;}	
}
@media (max-width: 767px) {	
	/* 탑 제목 */	
    .project-image-area.m_bg { background:url(../img/640x540.jpg) no-repeat center bottom !important; background-size:cover !important; }
	.webinar_title-wrapper {padding:60px 25px;}
	.webinar_title-wrapper h3 {font-size:31px; line-height: 1.3;  text-align: center; margin-bottom: 0px;}
	.webinar_title-wrapper h3 span {display: block;}
    .webinar_title-wrapper p {font-size: 30px; line-height: 1.3; text-align: center;}
    .webinar_title-wrapper p span {display: inline;}
	
	/* 동영상 */
	.project-cart .new-tag {font-size:12px;}
	.project-cart .projects__content h3 {font-size:20px;}
	.project-cart .projects__content h3 span {display: block;}
	
	/* 강연자 */
	
	.reviewer .reviewer__img { text-align: center;}	
	.reviewer__content h5 {text-align: center}	
	.reviewer__content .title {text-align: center}
    .reviewer__content .title span {display: block;}
	.reviewer ul {padding-left:0 !important;}
	.blog-post-area h4 {font-size:20px;}
	.blog-post-area h4 span {display: block;}
	/* 이벤트 */
	.blog-wrapper {margin:0px; padding: 0 20px;}
	.blog-wrapper .section-title h2 {font-size:26px; margin-bottom:10px;}
	.blog-wrapper .section-title h2 span {font-size: 18px; font-weight: bold; display: block;}
	.blog-wrapper .section-title h6 {padding-left:0px; padding-right:0px; font-size: 20px;}
	.blog-wrapper .section-title ul li {margin-bottom:10px; line-height:1.3;}
	.blog-wrapper .section-title p span {display:inline;}	
	.blogs__thumb {/*height:150px;*/ overflow: hidden; margin-bottom:0px; text-align: center;}
	.blogs__thumb img {width:100%; height: auto; }
	/*.event-img {display: none;}*/
}

.btn-primary {
	background-color : #1a1886;
	border-color: #1a1886;
	border-radius: 100px;
}

.footer-bottom-flex {
    display: flex;
    align-items: center;       /* 세로 중앙 정렬 */
    justify-content:间;  /* 텍스트와 버튼 사이 간격 조절 (선택 사항) */
    gap: 20px;                 /* 텍스트와 버튼 사이 여백 */
    margin-top: 20px;
}

.footer-bottom-flex p {
    margin-bottom: 0;          /* p태그 기본 하단 여백 제거 */
    flex: 1;                   /* 텍스트가 남은 공간을 차지하도록 설정 */
}

.footer-bottom-flex .blogs__thumb {
    flex-shrink: 0;            /* 버튼 크기가 줄어들지 않도록 설정 */
	margin-top: -20px;
}

/* 모바일에서는 다시 위아래로 나오게 설정 (반응형) */
@media (max-width: 767px) {
    .footer-bottom-flex {
        flex-direction: column;  /* 위아래 정렬 */
        align-items: flex-start; /* 왼쪽 정렬 */
        gap: 15px;
    }
}


/* webinar_plateer.css 하단에 추가 */

/* 강연자 프로필 영역 완벽한 수직 중앙 정렬 */
.project-cart .projects__manager {
    display: flex !important;
    align-items: center !important; /* 위아래 중앙 정렬 */
}

/* 이미지 컨테이너 여백 초기화 */
.project-cart .projects__manager .manager-img {
    margin-bottom: 0;
    line-height: 0; /* 이미지 하단 미세 공백 제거 */
	margin-top : -20px;
}

/* 텍스트 컨테이너 여백 초기화 및 정렬 */
.project-cart .projects__manager .name {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.project-cart .projects__manager .name h5 {
    margin-bottom: 3px !important; /* 이름과 소속 사이 간격 최소화 */
}

.project-cart .projects__manager .name address {
    margin-bottom: 0 !important; /* address 기본 하단 여백 완벽 제거 */
}

.service_bold {
	font-weight: 700;
}

@media (min-width: 1200px) {
.row > .video-col {
        flex: 0 0 740px !important;
        max-width: 740px !important;
    }

    .row > .info-col {
        flex: 1 !important;
        max-width: calc(100% - 740px) !important;
    }
}

/* 왼쪽 동영상 영역 높이 및 이미지 채우기 */
.video-col .project-video {
    height: 100%;
    min-height: 416px;
    display: flex;
    flex-direction: column;
}

.video-col .project-img {
    height: 100%;
    flex: 1;
}

.video-col .project-img img {
    width: 100%;
    height: 100%;
}

/* 오른쪽 카드 영역 높이 맞춤 */
.info-col .project-cart {
    height: 100%;
}

.info-col .projects__content { 
    height: 100%;
    box-sizing: border-box;
}

/* ==========================================================================
   RED HAT DRAFT SPECIFIC STYLES (레드햇.jpg 시안 전용 추가 스타일)
   ========================================================================== */

/* 1. Hero Banner (상단 검은색 메인 배너) */
.redhat-hero-section {
  background-color: #000000;
  color: #ffffff;
  padding: 60px 0;
  text-align: center;
}
.hero-brand-logos {
  margin-bottom: 25px;
}
.brand-logo-img {
  max-width: 220px;
  height: auto;
}
.hero-main-title {
  color: #ffffff;
  font-size: 37px;
  font-weight: 800;
  margin-bottom: 20px;
  letter-spacing: -0.5px;
}
.hero-sub-title {
  color: #fff;
  font-size: 26px;
  line-height: 1.6;
  font-weight: 400;
  max-width: 800px;
}

/* 2. Breadcrumb (경로 안내) */
.redhat-breadcrumb {
  font-size: 14px;
  color: #6c757d;
}
.redhat-breadcrumb a {
  color: #6c757d;
}
.redhat-breadcrumb i {
  font-size: 11px;
  margin: 0 6px;
}
.redhat-breadcrumb .active {
  color: #111111;
  font-weight: 700;
}

/* 3. Video & Speaker Card Container (메인 비디오 및 우측 연사 요약 박스) */
.redhat-video-card {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 380px;
  background-color: #111;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-overlay-btn {
  position: absolute;
  z-index: 2;
}
.btn-register-play {
  background-color: #ee0000;
  color: #ffffff !important;
  font-weight: 700;
  padding: 14px 28px;
  border-radius: 4px;
  display: inline-block;
  font-size: 15px;
  box-shadow: 0 4px 15px rgba(238, 0, 0, 0.4);
  transition: transform 0.2s, background-color 0.2s;
}
.btn-register-play:hover {
  background-color: #cc0000;
  transform: translateY(-2px);
}

.redhat-speaker-card {
  background-color: #f8f9fa;
  border-radius: 8px;
  padding: 35px 22px;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid #e9ecef;
}
.card-headline {
  font-size: 24px;
  font-weight: 800;
  line-height: 1.35;
  color: #111111;
  margin-bottom: 20px;
}
.speaker-name-title strong {
  display: block;
  font-size: 18px;
  color: #111111;
  font-weight: 700;
}
.speaker-name-title span {
  display: block;
  font-size: 13px;
  color: #6c757d;
  margin-top: 3px;
  margin-bottom: 15px;
}
.card-desc {
  font-size: 14px;
  color: #495057;
  line-height: 1.6;
}

.btn-redhat-yellow {
  background-color: #ffc107;
  color: #111111 !important;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 25px;
  display: inline-block;
  font-size: 14px;
  transition: all 0.3s ease;
}
.btn-redhat-yellow:hover {
  background-color: #e0a800;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* 4. Agenda Section (3단 아젠다 카드) */
.section-heading {
  font-size: 22px;
  font-weight: 500;
  color: #111111;
}
.section-subtext {
  font-size: 15px;
  color: #313133;
}

.agenda-card {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 30px 25px;
  height: 100%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
  transition: transform 0.3s, box-shadow 0.3s;
}
.agenda-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}
.agenda-num {
  font-size: 13px;
  font-weight: 800;
  color: #ee0000;
  display: block;
  margin-bottom: 40px;
  letter-spacing: 0.5px;
}
.agenda-title {
  font-size: 21px;
  font-weight: 600;
  color: #111111;
  margin-bottom: 12px;
}
.agenda-desc {
  font-size: 14px;
  color: #666666;
  line-height: 1.4;
  margin: 0;
}

/* 5. Speaker Instruction Section (연사 원형 프로필) */
.speaker-profile-box {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #ffffff;
}

.speaker-profile-box .speaker-avatar {
  flex-shrink: 0; /* flex 레이아웃 내 크기 축소 방지 */
  width: 111px;
  height: 111px;
}

.speaker-profile-box .speaker-avatar img {
  width: 111px !important;
  height: 111px !important;
  border-radius: 50% !important;
  border: 1px solid #EBEBEB !important; /* 요청하신 #EBEBEB 테두리 추가 */
  object-fit: cover !important;
  display: block;
}

.speaker-name {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 4px;
}
.speaker-role {
  font-size: 14px;
  color: #6c757d;
  margin: 0;
}

/* 6. Red Banner (e-Book 다운로드 레드 영역) */
.redhat-resource-banner {
  background-color: #cc0000;
  color: #ffffff;
  padding: 35px 0;
}
.resource-flex-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
}
.resource-left {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.resource-badge {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  display: inline-block;
  width: fit-content;
  margin-bottom : 20px;
}
.resource-content {
  display: flex;
  align-items: center;
  gap: 20px;
}
.resource-cover-img img {
  width: 137px;
  height: auto;
  border-radius: 4px;
}
.resource-text h3 {
  color: #ffffff;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 6px;
}
.resource-text p {
  color: rgba(255, 255, 255, 0.9);
  font-size: 15px;
  margin: 0;
}
.btn-download-black {
  background-color: #000000;
  color: #ffffff !important;
  font-size: 17px;
  font-weight: 500;
  padding: 20px 63px;
  border-radius: 30px;
  display: inline-block;
  transition: background-color 0.3s;
}
.btn-download-black:hover {
  background-color: #222222;
}

/* 7. Event Section (보라색 그라데이션 경품 영역) */
.redhat-event-section {
  background: linear-gradient(135deg, #673ab7 0%, #512da8 100%);
  color: #ffffff;
}
.event-gift-icon {
  font-size: 24px;
  font-weight: 800;
  color: #ffffff;
}
.event-desc {
  color: rgba(255, 255, 255, 0.9);
  font-size: 16px;
  margin: 0;
}
.event-prizes-flex {
  display: flex;
  justify-content: flex-end;
  gap: 20px;
}
.prize-card {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 8px;
  padding: 15px 20px;
  text-align: center;
  width: 140px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.prize-img img {
  max-width: 60px;
  height: 60px;
  object-fit: contain;
  margin-bottom: 8px;
}
.prize-name {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #333333;
}