/*
+----------------------------------------------------------------------+
| Copyright (c) 2010 - 2025 SPEAKINGMAX @ WEAVERSBRAIN.Co.Ltd
+----------------------------------------------------------------------+
| 작업일 : 2025-02-13
| 파일설명 : 맥스 AI 사이트 기업교육 제휴문의 페이지 CSS
+----------------------------------------------------------------------+
| 작업자 : 최진영   
+----------------------------------------------------------------------+
| 수정이력
| 20250812 기업수강 제휴문의 페이지 리디자인 by 김주이
| 20251114 메인 비쥬얼 이미지 수정, 제안서 다운로드 추가 by 최진영
| 20251201 전체 컨텐츠 수정 by 최진영
+----------------------------------------------------------------------+ 
*/

@charset "utf-8";

/* ====================================================================================
	MOBILE
==================================================================================== */
.b2bQnaWrap .vectorIconImg.pc {
	display: none;
}

/* bgColor */
.bgColor_000000 {
	background:#000;
}
.bgColor_fafafa {
	background:#fafafa;
}
.bgColor_fbfbfb_917FF3 {
	background: linear-gradient(180deg, #917FF3 -400%, #fbfbfb 100%);	
}
.bgColor_dab7f4_5d56c3{
	background: linear-gradient(105deg, #DAB7F4 -23.67%, #5D56C3 95.04%);
}

/* 페이지 레이아웃 */
.b2bQnaWrap {
	margin-top: var(--header-height);
}
.b2bQnaWrap .section {
	position: relative;
	overflow: hidden;
}
.b2bQnaWrap .section.pd {
	padding: 80px 40px;
}
.b2bQnaWrap .section .sectionTitle {
	margin-bottom: 40px;
	text-align: center;
	word-break: keep-all;
}
.b2bQnaWrap .section .sectionTitle.ta_left {
	text-align: left;
}
.b2bQnaWrap .section .sectionTitle .subText {
	color:#555555;
}
.b2bQnaWrap .section .sectionTitle .headText.point {
	color:#833ecf;
}
.b2bQnaWrap .section .highlight_purple {
	color: #9A5AE0;
	font-family: 'Pretendard-Bold';
}
.b2bQnaWrap .section .highlight_violet {
	color: #5148A9;
	vertical-align: top;
}
.b2bQnaWrap .section .sectionTitle .headText.white {
	color: #ffffff;
}
.b2bQnaWrap .section .sectionTitle .headText.mgB_10 {
	margin-bottom:10px;
}
.b2bQnaWrap .section .sectionTitle .subText.white {
	color: #ffffff;
}

/* 메인 영역 */
.b2bQnaWrap .section.sec01.pd {
	padding:0;
}
.b2bQnaWrap .section.sec01 {
	position:relative;
}
.b2bQnaWrap .section.sec01 .mainVideo.pc {
	display:none;
}
.b2bQnaWrap .section.sec01 .mainVideo.mo {
	display:block;
	width:100%;
}
.b2bQnaWrap .section.sec01 .bgDimBox {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:0;
	background-color:rgba(0, 0, 0, 0.6);
}
.b2bQnaWrap .section.sec01 .innerBox {
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 80px);
}
.b2bQnaWrap .section.sec01 .avatarImgBox {
	position:relative;
	width:255px;
	margin:0 auto;
}
.b2bQnaWrap .section.sec01 .avatarImgBox:before {
	content:'';
	display:block;
	position:absolute;
	bottom:7%;
	left:50%;
	transform:translateX(-50%) rotate(145deg);
	width:130%;
	height:60%;
	background: linear-gradient(0deg, #E962FF 0%, #5A2C8D 100%);
	border-radius:100%;
	opacity: 0.8;
}
.b2bQnaWrap .section.sec01 .avatarImgBox .avatarImg {
	display:block;
	position: relative;
	z-index: 1;
	width:100%;
}
.b2bQnaWrap .section.sec01 .sectionTitle .headText {
	font-size:36px;
	font-family: 'Pretendard-Bold';
	color:#fff;
	line-height:1.5;
}
.b2bQnaWrap .section.sec01 .sectionTitle .subText {
	margin-top:30px;
	font-size:16px;
	font-family: 'Pretendard-Regular';
	color:#fff;
	line-height:1.5;
}
.b2bQnaWrap .section.sec01 .btnBox {
	display:flex;
	gap:12px;
}
.b2bQnaWrap .section.sec01 .btnBox .btn {    
	padding:0 16px;
	height:54px;
	border-radius: 8px;
	border:1px solid transparent;
}
.b2bQnaWrap .section.sec01 .btnBox .btn.apply {
	background:#fff;
	color:#331858;
}
.b2bQnaWrap .section.sec01 .btnBox .btn.pdf {
	color:#fff;
	border-color:#fff;
}

/* 기업 로고 캐러셀 */
.b2bQnaWrap .section.sec02 {
	padding:15px 0;
}
.b2bQnaWrap .section.sec02 .swiper.slide {
	height:54px;
	margin-bottom:20px;
}
.b2bQnaWrap .section.sec02 .swiper.slide:last-child {
	margin-bottom:0;
}
.b2bQnaWrap .section.sec02 .swiper.slide .swiper-wrapper {
	transition-timing-function: linear !important;
}
.b2bQnaWrap .section.sec02 .swiper.slide .swiper-slide {
	display:inline-flex;
	justify-content: center;
	align-items: center;
}
.b2bQnaWrap .section.sec02 .swiper.slide .swiper-slide img {
	max-width:100%;
}

/* 후기 영역 */
.b2bQnaWrap .section.sec03 .sectionTitle .headText span {
	display:block;
}
.b2bQnaWrap .section.sec03 .btnBox{
	display:flex;
	flex-direction: column;
	gap: 20px;
}
.b2bQnaWrap .section.sec03 .btnBox a {
	display:block;
	width:100%;
}
.b2bQnaWrap .section.sec03 .btnBox .btnImg{
	display: block;
	width: 100%;        
}

/* 메달 영역 */
.b2bQnaWrap .section.sec04 {
	padding:80px 20px;
	background:#ededf0;
}
.b2bQnaWrap .section.sec04 .awardPointBox {
	margin-bottom: 30px;
	text-align: center;
}
.b2bQnaWrap .section.sec04 .awardPointBox .medalImg {
	width: 160px;
}
.b2bQnaWrap .section.sec04 .sectionTitle .headText {
	text-align: center;
}
.b2bQnaWrap .section.sec04 .sectionTitle .subText {
	text-align: center;
}
.b2bQnaWrap .section.sec04 .awardList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.b2bQnaWrap .section.sec04 .awardList .listItem {
	display: flex;
	flex-direction: column;
	align-items: center;
	width:22%;
	text-align: center;
}
.b2bQnaWrap .section.sec04 .awardList .listItem:nth-child(-n + 4) {
	margin-bottom:20px;
}
.b2bQnaWrap .section.sec04 .awardList .listItem img {
	width: 50px;
	margin-bottom: 12px;
}
.b2bQnaWrap .section.sec04 .awardList .listItem .awardText {
	color: #9a9a9a;
	word-break: keep-all;
}

/* 타사 비교 영역 */
.b2bQnaWrap .section.sec05 {
	padding: 80px 20px;
}
.b2bQnaWrap .section.sec05 .tableBox {
	padding:20px;
	box-shadow: 0px 0px 8.8px 0px #0000000D;
	border-radius: 30px;
	background:#fff;
	overflow-x:auto;
}
.b2bQnaWrap .section.sec05 .tableBox .table {
	table-layout: fixed;
	width:900px;
}
.b2bQnaWrap .section.sec05 .tableBox .table colgroup col:nth-child(1) {
	width: 70px;
}
.b2bQnaWrap .section.sec05 .tableBox .table colgroup col:nth-child(2),
.b2bQnaWrap .section.sec05 .tableBox .table colgroup col:nth-child(3),
.b2bQnaWrap .section.sec05 .tableBox .table colgroup col:nth-child(4),
.b2bQnaWrap .section.sec05 .tableBox .table colgroup col:nth-child(5) {
	width: calc((100% - 70px) / 4);
}
.b2bQnaWrap .section.sec05 .tableBox .table .bdr_t_l {
	border-top-left-radius: 30px;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bdr_t_r {
	border-top-right-radius: 30px;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bdr_b_l {
	border-bottom-left-radius: 30px;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bdr_b_r {
	border-bottom-right-radius: 30px;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bd_t {
	border-top:6px solid #A962FF;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bd_b {
	border-bottom:6px solid #A962FF;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bd_l {
	border-left:6px solid #A962FF;
}
.b2bQnaWrap .section.sec05 .tableBox .table .bd_r {
	border-right:6px solid #A962FF;
}
.b2bQnaWrap .section.sec05 .tableBox .table .purple {
	background:#FAF3FB;
}
.b2bQnaWrap .section.sec05 .tableBox .table .purple .box {
	display:flex;
	justify-content: center;
	height:100%;
}
.b2bQnaWrap .section.sec05 .tableBox .table th.purple .box {
	align-items: center;
}
.b2bQnaWrap .section.sec05 .tableBox .table th {
	height:70px;
	padding:0 10px;
	font-weight: 700;
	color:#2a2a2a;
}
.b2bQnaWrap .section.sec05 .tableBox .table th.purple {
	padding:0;
}
.b2bQnaWrap .section.sec05 .tableBox .table th .logoImg {
	width: 80px;
}
.b2bQnaWrap .section.sec05 .tableBox .table td {
	height:150px;
	font-size:14px;
	vertical-align: top;
}
.b2bQnaWrap .section.sec05 .tableBox .table td:not(.cell_1,.purple) {
	background:#FBFBFB;
}
.b2bQnaWrap .section.sec05 .tableBox .table td.cell_1 {
	vertical-align: top;
	padding-top:20px;
	padding-right:10px;
}
.b2bQnaWrap .section.sec05 .tableBox .table td.cell_1 .title {
	word-break: keep-all;
	font-size:14px;
	font-weight:600;
	color:#302B35;
}
.b2bQnaWrap .section.sec05 .tableBox .table td .desc {
	display:flex;
	flex-direction: column;
	gap:15px;
	padding:20px 10px;
}
.b2bQnaWrap .section.sec05 .tableBox .table td .desc li {
	position:relative;
	padding-left:8px;
	word-break: keep-all;
}
.b2bQnaWrap .section.sec05 .tableBox .table td .desc li:before {
	content:'';
	display:block;
	position:absolute;
	top:7px;
	left:0;
	width:2px;
	height:2px;
	background:#000;
	border-radius:100%;
}
.b2bQnaWrap .section.sec05 .tableBox .table td .desc .boldText {
	vertical-align: top;
	font-weight:700;
}

/* 기업 교육 서비스 영역 */
.b2bQnaWrap .section.sec06 {
	padding:80px 40px;
}
.b2bQnaWrap .section.sec06 .imgBox {
	display:flex;
	gap:20px;
}
.b2bQnaWrap .section.sec06 .imgBox .img {
	display:block;
	width:100%;
}
.b2bQnaWrap .section.sec06 .imgBox .img.pc {
	display:none;
}

/* 학습 솔루션 영역 */
.b2bQnaWrap .section.sec07 {
	background:#fafafa;
}
.b2bQnaWrap .section.sec07 .imgBox .img {
	display:block;
	width:100%;
}
.b2bQnaWrap .section.sec07 .textBox {
	margin-top: 40px;
	padding: 0 30px;
	font-size: 26px;
	font-weight:700;
	line-height:1.5;
	color:#584B6E;
	word-break: keep-all;
}

/* 프로세스 영역 */
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox {
	display: grid;
	grid-template-columns: 60px 1fr;
	grid-template-rows: auto auto;
	column-gap: 20px;
	row-gap: 2px;
	align-items: center;
	padding: 20px 20px;
	padding-left: 40px;
	margin-bottom: 20px;
	border-radius: 16px;
	background: linear-gradient(180deg, #FAF3FF 0%, #EDE4FF 100%);
}
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:last-child {
	margin-bottom: 0;
}
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .stepImg {
	width: 60px;
	height: 60px;
	padding: 10px;
	border-radius: 50%;
	background-color: #ffffff;
	grid-row: 1 / span 2;
}
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .stepText {
	color: #5249CA;
	align-self: end;
}
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .descText {
	color: #403E50;
	align-self: start;
}
.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .infoText br {
    display: none;
}

/* qna 영역 */
.b2bQnaWrap .section.qna {
	padding: 0 20px 80px;
}
.b2bQnaWrap .section.qna .toggleList .listItem {
	padding:20px;
	margin-bottom:20px;
	background:#fff;
	border-radius: 12px;
	cursor:pointer;
}
.b2bQnaWrap .section.qna .toggleList .listItem:last-child {
	margin-bottom:0;
}
.b2bQnaWrap .section.qna .toggleList .listItem .title {
	display: flex;
	justify-content: space-between;
	color:#555;
	word-break: keep-all;
}
.b2bQnaWrap .section.qna .toggleList .listItem .title .text {
	width:85%;
}
.b2bQnaWrap .section.qna .toggleList .listItem .title .toggleIcon {
	position:relative;
	width:24px;
	height:24px;
	background:transparent url('/assets/images/common/icon/icon_arrow_down_black.png') no-repeat 0 0/100%;
}
.b2bQnaWrap .section.qna .toggleList .listItem.on .title .toggleIcon {
	background-image:url('/assets/images/common/icon/icon_arrow_down_purple.png');
}
.b2bQnaWrap .section.qna .toggleList .listItem .contents {
	display:none;
	margin-top:10px;
	padding:20px;
	color:#555;
	background:#f5f5f5;
	border-radius: 12px;
	word-break: keep-all;
}
.b2bQnaWrap .section.qna .toggleList .listItem.on .title {
	color:#833ecf;
}


/* 띠배너 */
.fixedBanner {
	display: none;
	position: fixed;
	bottom: 20px;
	width: 0;
	left:50%;
	z-index: 6;
}
.fixedBanner.on .bannerImg {
	display:block;
	width:100%;
}
.fixedBanner.on {
	display:block;
	animation: bannerFadeIn 0.5s ease-in-out forwards;
}
@keyframes bannerFadeIn {
	from {
		width:0;
	}
	to {
		width:90%;
		left:5%;
	}
}

/* 리캐치 팝업 */
.recatchPopWrap {
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index: 4;
}
.recatchPopWrap .popBg {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, 0.7);
}
.recatchPopWrap .popInner {
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	width:90%;
	height:70%;
}
.recatchPopWrap .popInner .popCloseBtn {
	position:absolute;
	top:-40px;
	right:0;
}
.recatchPopWrap .popInner .popIframe {
	width:100%;
	height:100%;
	border:none;
	background:#fff;
	border-radius: 12px;
	overflow:hidden;
}

/* ====================================================================================
	TABLET
==================================================================================== */
@media only screen and (min-width : 768px) {

	/* 공통 */
	.b2bQnaWrap .section .innerBox {
		position:relative;
	}
	
	/* 메인 영역 */
	.b2bQnaWrap .section.sec01 .mainVideo.mo {
		display:none;
	}
	.b2bQnaWrap .section.sec01 .mainVideo.pc {
		display:block;
	}
	.b2bQnaWrap .section.sec01 .sectionTitle {
		margin-bottom:40px;
	}

	/* 후기 영역 */
	.b2bQnaWrap .section.sec03 .sectionTitle .headText {
		text-align: center;
	}
	.b2bQnaWrap .section.sec03 .sectionTitle .headText span {
		margin:0 2px;
	}
	.b2bQnaWrap .section.sec03 .sectionTitle .subText {
		text-align: center;
	}
	.b2bQnaWrap .section.sec03 .sectionTitle .headText span {
		display:inline;
	}
	.b2bQnaWrap .section.sec03 .btnBox{
		display:flex;
		flex-direction: row;
		gap: 20px;
	}
	.b2bQnaWrap .section.sec03 .btnBox a {
		width:50%;
	}

	/* 메달 영역 */
	.b2bQnaWrap .section.sec04 .awardPointBox .medalImg {
		width:260px;
	}
	.b2bQnaWrap .section.sec04 .awardList .listItem {
		width:auto;
	}
	.b2bQnaWrap .section.sec04 .awardList .listItem:nth-child(-n + 3) {
		margin-bottom:0;
	}
	
	
	/* 타사 비교 영역 */
	.b2bQnaWrap .section.sec05 .tableBox .table {
		width:100%;
	}

	/* 기업 교육 서비스 영역 */
	.b2bQnaWrap .section.sec06 .imgBox {
		flex-wrap: wrap;
	}
	.b2bQnaWrap .section.sec06 .imgBox .img.mo {
		display:none;
	}
	.b2bQnaWrap .section.sec06 .imgBox .img.pc {
		display:block;
	}
	.b2bQnaWrap .section.sec06 .imgBox .img.pc.w50 {
		width:calc(50% - 10px);
	}

	/* 학습 솔루션 영역 */
	.b2bQnaWrap .section.sec07 .innerBox {
		display:flex;
		justify-content: space-between;
		align-items: center;
		gap:20px;
	}
	.b2bQnaWrap .section.sec07 .innerBox .imgBox {
		width:40%;
	}
	.b2bQnaWrap .section.sec07 .innerBox .textBox {
		margin-top:0;
		width:60%;
		font-size:30px;
	}

	/* 프로세스 영역 */
	.b2bQnaWrap .section .stepListWrap {
		display:flex;
		justify-content: space-between;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox {
		display:block;
		position:relative;
		width:19%;
		margin-bottom:0;
		padding:40px 35px;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:nth-child(1) {
		z-index:5;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:nth-child(2) {
		z-index:4;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:nth-child(3) {
		z-index:3;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:nth-child(4) {
		z-index:2;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox:nth-child(5) {
		z-index:1;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .stepText {
		text-align:center;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .stepImg {
		display:block;
		margin:20px auto 40px;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .infoText {
		text-align:center;
		word-break: keep-all;
	}
	.b2bQnaWrap .section.sec08 .stepListWrap .stepImgBox .vectorIconImg.pc {
		position:absolute;
		top:50%;
		right:-10%;
		transform: translateY(-50%);
		display:block;
	}

	/* 띠배너 */
	.fixedBanner.on {
		display:block;
		bottom:40px;
		animation: bannerFadeIn2 0.5s ease-in-out forwards;
	}
	@keyframes bannerFadeIn2 {
		from {
			width:0;
		}
		to {
			width:60%;
			left:20%;
		}
	}

	/* 리캐치 팝업 */
	.recatchPopWrap .popInner {
		width:600px;
	}
}


/* ====================================================================================
	PC
==================================================================================== */
@media only screen and (min-width : 1000px) {

	/* 공통 */
	.b2bQnaWrap .section .innerBox {
		width: 1000px;
		margin: 0 auto;
	}

	/* 메인 영역 */
	.b2bQnaWrap .section.sec01.pd {
		padding:0;
	}
	.b2bQnaWrap .section.sec01 .innerBox {
		width:1000px;
	}
	.b2bQnaWrap .section.sec01 .avatarImgBox {
		bottom:-230px;
		width:438px;
	}
	.b2bQnaWrap .section.sec01 .sectionTitle {
		margin-bottom:50px;
	}
	.b2bQnaWrap .section.sec01 .sectionTitle .headText {
		font-family: 'Pretendard-SemiBold';
	}
	.b2bQnaWrap .section.sec01 .sectionTitle .subText {
		margin-top: 10px;
		font-size: 16px;
		font-family: 'Pretendard-Light';
	}
	.b2bQnaWrap .section.sec01 .btnBox .btn {
		height:54px;
		transition:all 0.3s ease;
	}
	.b2bQnaWrap .section.sec01 .btnBox .btn:hover {
		transform: translateY(-3px);
	}

	/* 띠배너 */
	.fixedBanner {
		cursor:pointer;
		transition:all 0.3s ease-in-out;
	}
	.fixedBanner:hover {
		opacity: 0.8;
	}
	.fixedBanner.on {
		display:block;
		bottom:40px;
		animation: bannerFadeIn2 0.5s ease-in-out forwards;
	}
	@keyframes bannerFadeIn2 {
		from {
			width:0;
		}
		to {
			width:600px;
			left:calc(50% - 300px);
		}
	}

	/* 리캐치 팝업 */
	.recatchPopWrap .popInner .popCloseBtn {
		cursor:pointer;
	}
}