/* Generated by tools/build-assets.js. Do not edit directly. */

/* Source: CSS/src/fonts/fulltime.css */
/* Subset fonts for full-time recruitment pages. */
@font-face {
	font-family: 'Montserrat';
	src: url('../../fonts/Montserrat-500.woff2') format('woff2');
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: 'Montserrat';
	src: url('../../fonts/Montserrat-600.woff2') format('woff2');
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}

@font-face {
	font-family: 'Montserrat';
	src: url('../../fonts/Montserrat-700.woff2') format('woff2');
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: 'Montserrat';
	src: url('../../fonts/Montserrat-800.woff2') format('woff2');
	font-style: normal;
	font-weight: 800;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans TC';
	src: url('../../fonts/NotoSansTC-500.woff2?v=1.0.1') format('woff2');
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans TC';
	src: url('../../fonts/NotoSansTC-600.woff2?v=1.0.1') format('woff2');
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans TC';
	src: url('../../fonts/NotoSansTC-700.woff2?v=1.0.1') format('woff2');
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans TC';
	src: url('../../fonts/NotoSansTC-800.woff2?v=1.0.1') format('woff2');
	font-style: normal;
	font-weight: 800;
	font-display: swap;
}

/* Source: CSS/src/foundation.css */
/* ===== common-foundation.css ===== */
:root {
	--theme-primary-fulltime: #014DA2;
	--theme-primary-internship: #0074F6;
	--theme-primary-text-fulltime: #001F75;
	--theme-primary-text-internship: #00469D;
	--primary: var(--theme-primary-fulltime);
	--primary-text: var(--theme-primary-text-fulltime);
	--secondary: #E95C14;
	--text-dark: #323232;
	--white: #ffffff;
	--line: #B8BFCA;
	--tear: #AED4FF;
	--helper-text: #737373;
	--inner-background: #f9f9f9;
	--section-contactus-background-color: #013570;
	--contactus-dot-background-color: #0B53A4;
	--layout-footer-background-color: #002854;
	--footer-social-icon-color: #8CC3FF;
	--primary-gradient: linear-gradient(349deg, #E95C14 9.07%, #FF7A39 93.33%);
	--title-highlight-gradient: linear-gradient(90deg, rgba(231, 255, 81, 0.00) 0%, #E7FF51 39.9%, #E7FF51 55.29%, rgba(231, 255, 81, 0.00) 100%);
	--gradient-highlight-orange: linear-gradient(90deg, rgba(233, 92, 20, 0.00) 0%, rgba(233, 92, 20, 0.80) 30.77%, rgba(233, 92, 20, 0.80) 67.31%, rgba(233, 92, 20, 0.00) 100%);

	/* Spacing Variables */
	--spacing-4: 4px;
	--spacing-6: 6px;
	--spacing-8: 8px;
	--spacing-12: 12px;
	--spacing-16: 16px;
	--spacing-20: 20px;
	--spacing-24: 24px;
	--spacing-32: 32px;
	--spacing-40: 40px;
	--spacing-56: 56px;
	--spacing-60: 60px;
	--spacing-64: 64px;
	--spacing-80: 80px;
	--spacing-96: 96px;
	--spacing-120: 120px;

	/* Border Radius Variables */
	--radius-8: 8px;
	--radius-16: 16px;
	--radius-24: 24px;
	--radius-999: 999px;

	/* Transition Variables */
	--transition-base: 0.3s ease;
	--transition-short: 0.25s ease;
	--transition-long: 0.5s ease;
	--transition-color: color 0.3s ease-in-out;
	--transition-transform: transform 0.3s ease;
	--transition-all: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
	--header-height: 80px;
}

body.recruitment-theme-fulltime {
	--primary: var(--theme-primary-fulltime);
	--primary-text: var(--theme-primary-text-fulltime);
	--section-contactus-background-color: #013570;
	--contactus-dot-background-color: #0B53A4;
	--layout-footer-background-color: #002854;
	--footer-social-icon-color: #8CC3FF;
}

body.recruitment-theme-internship {
	--primary: var(--theme-primary-internship);
	--primary-text: var(--theme-primary-text-internship);
	--section-contactus-background-color: #11549F;
	--contactus-dot-background-color: #1065C5;
	--layout-footer-background-color: #1974E6;
	--footer-social-icon-color: #ADD4FF;
}

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale(0.9);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes fadeRight {
	from {
		opacity: 0;
		transform: translateX(-30px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes flipLeft {
	from {
		opacity: 0;
		transform: perspective(1200px) rotateY(-80deg);
	}

	to {
		opacity: 1;
		transform: perspective(1200px) rotateY(0deg);
	}
}

@keyframes flipRight {
	from {
		opacity: 0;
		transform: perspective(1200px) rotateY(80deg);
	}

	to {
		opacity: 1;
		transform: perspective(1200px) rotateY(0deg);
	}
}

.fade-up {
	opacity: 0;
	transform: translateY(30px);
}

.fade-up.animate {
	animation: fadeUp 0.6s ease forwards;
	animation-delay: var(--delay, 0s);
}

.zoom-in {
	opacity: 0;
	transform: scale(0.6);
}

.zoom-in.animate {
	animation: zoomIn 0.6s ease forwards;
	animation-delay: var(--delay, 0s);
}

.fade-right {
	opacity: 0;
	transform: translateX(-30px);
}

.fade-right.animate {
	animation: fadeRight 0.6s ease forwards;
	animation-delay: var(--delay, 0s);
}

.flip-left {
	opacity: 0;
	transform: perspective(1200px) rotateY(-80deg);
	transform-origin: center left;
	transform-style: preserve-3d;
	backface-visibility: hidden;
}

.flip-left.animate {
	animation: flipLeft 0.8s ease forwards;
	animation-delay: var(--delay, 0s);
}

.flip-right {
	opacity: 0;
	transform: perspective(1200px) rotateY(80deg);
	transform-origin: center right;
	transform-style: preserve-3d;
	backface-visibility: hidden;
}

.flip-right.animate {
	animation: flipRight 0.8s ease forwards;
	animation-delay: var(--delay, 0s);
}

.delay-1 {
	--delay: 0.1s;
}

.delay-2 {
	--delay: 0.2s;
}

.delay-3 {
	--delay: 0.3s;
}

.delay-4 {
	--delay: 0.4s;
}

.delay-5 {
	--delay: 0.5s;
}

.delay-6 {
	--delay: 0.6s;
}

/* Spacing */
.card-style {
	width: 100%;
	padding: var(--spacing-80);
	background-color: var(--white);
	border-radius: var(--radius-24);
	box-shadow: 0 0 40px 0 rgba(225, 204, 255, 0.70);
	position: relative;
}

.container {
	display: flex;
	height: 80px;
	justify-content: space-between;
	align-items: center;
	padding: 0 32px
}

.mb-40 {
	margin-bottom: var(--spacing-40);
}

.inner-background {
	width: 100%;
	background-color: var(--inner-background);
	padding: var(--spacing-40);
	border-radius: var(--radius-24);
}

.initial-loader {
	position: fixed;
	inset: 0;
	z-index: 20000;
	background-color: transparent;
	pointer-events: none;
	overflow: hidden;
}

.initial-loader-panel {
	position: absolute;
	inset: -1px;
	transition: transform 3.4s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: transform;
}

.initial-loader-panel-blue {
	background-color: var(--theme-primary-fulltime);
	clip-path: polygon(0 0, 100% 0, 0 100%);
}

.initial-loader-panel-orange {
	background-color: var(--secondary);
	clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.initial-loader.is-leaving .initial-loader-panel-blue {
	transform: translate(-115%, -115%);
}

.initial-loader.is-leaving .initial-loader-panel-orange {
	transform: translate(115%, 115%);
}

.initial-loader.is-hidden {
	display: none;
}

.shell-transition-overlay {
	position: fixed;
	top: var(--header-height);
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
	background-color: var(--primary);
	pointer-events: none;
	transform: translateY(100%);
	transition: transform 0.58s cubic-bezier(0.22, 1, 0.36, 1);
	visibility: hidden;
	will-change: transform;
}

.shell-transition-overlay.is-ready,
.shell-transition-overlay.is-visible {
	visibility: visible;
}

.shell-transition-overlay.is-visible {
	transform: translateY(0);
}

.shell-transition-overlay.is-leaving {
	transform: translateY(-100%);
	visibility: visible;
}

.shell-transition-logo {
	position: fixed;
	top: calc(var(--header-height) + (100vh - var(--header-height)) / 2 - 24px);
	left: 50%;
	z-index: 10000;
	width: clamp(220px, 44vw, 320px);
	aspect-ratio: 179 / 38;
	background-image: url("../../IMG/BG_Elemnet/logo-white.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%);
	visibility: hidden;
}

.shell-transition-logo.is-ready,
.shell-transition-logo.is-visible {
	visibility: visible;
}


/* ===== common-utilities.css ===== */
.inner-block-spacing {
	margin-top: 96px;
}


/* ===== common-header.css ===== */
/* header */
.navbar {
	width: 100%;
	position: fixed;
	top: 0;
	align-items: center;
	background: var(--white);
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.08);
	z-index: 10000;
	overflow: hidden;
}

.navbar::after {
	content: '';
	position: absolute;
	top: -2px;
	right: 40px;
	width: 431px;
	height: 84px;
	background-image: url(../../IMG/BG_Elemnet/header-bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	pointer-events: none;
	z-index: 0;
}

.navbar .container {
	position: relative;
	z-index: 1;
	height: 80px;
	padding: 0 24px;
}

.logo a {
	color: #fff;
	font-size: 20px;
	font-weight: bolder;
	text-indent: 101%;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	background-image: url(../../IMG/YuantaLogo.svg);
	width: 165px;
	height: 30px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.header-toggle {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px;
	background-color: #e9e9e9;
	border-radius: var(--radius-8);
}

.header-toggle::before {
	content: "";
	position: absolute;
	top: 4px;
	bottom: 4px;
	left: 4px;
	z-index: 0;
	width: calc((100% - 12px) / 2);
	border-radius: var(--radius-8);
	background-color: var(--secondary);
	transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.header-toggle.header-toggle-internship::before {
	transform: translateX(calc(100% + 4px));
}

.header-toggle-tab {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 80px;
	padding: 8px 24px;
	border: 0;
	border-radius: var(--radius-8);
	background-color: transparent;
	color: var(--helper-text);
	font-family: inherit;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.2s ease;
}

.header-toggle-tab:not(.is-active):hover {
	color: var(--secondary);
}

.header-toggle-tab.is-active {
	color: var(--white);
}



/* ===== common-layout.css ===== */
/* ContainerBlock */

.wrapper {
	max-width: 1440px;
	padding: var(--spacing-60) var(--spacing-120);
	margin: 0 auto;
	position: relative;
}

.block-title {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-20);
	margin-bottom: var(--spacing-64);
}

.Title {
	display: inline-block;
	text-align: center;
	position: relative;
	color: var(--primary-text);
	width: fit-content;
	margin: 0 auto;
	font-size: 40px;
	font-weight: 800;
	line-height: 1.3;
	z-index: 1;
}

.Title::after {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 16px;
	background: var(--title-highlight-gradient);
	left: 50%;
	transform: translateX(-50%);
	bottom: 10px;
	z-index: -1;
}

.Title-OnDark {
	color: var(--white);
}

.Title-OnDark::after {
	--title-highlight-gradient: var(--gradient-highlight-orange);
}

.SubTitle {
	display: inline-block;
	color: var(--primary);
	text-align: center;
	font-size: 32px;
	font-weight: 700;
}

.subtitle-container {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: var(--spacing-32);
	align-items: center;
	margin-bottom: var(--spacing-16);
}

.subtitle-container .line {
	flex: 1;
	height: 1px;
	background: var(--line);
}

.yuanta-content {
	font-size: 20px;
	font-weight: 500;
	text-align: center;
}

.TitleContent {
	color: var(--text-dark);
	font-size: 20px;
	font-weight: 500;
	text-align: center;
}

.Item {
	width: 20px;
	height: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	background-color: var(--primary);
	-webkit-mask: url("../../IMG/BG_Elemnet/star-deco.svg") center / contain no-repeat;
	mask: url("../../IMG/BG_Elemnet/star-deco.svg") center / contain no-repeat;
}

.Item img {
	display: none;
}

.hiring-title .Item {
	margin-top: 10px;
}

.star-orange,
.star-blue,
.star-deposit-training,
.star-management-track {
	width: 20px;
	height: 20px;
	background-color: var(--secondary);
	-webkit-mask: url("../../IMG/BG_Elemnet/star-deco.svg") center / contain no-repeat;
	mask: url("../../IMG/BG_Elemnet/star-deco.svg") center / contain no-repeat;
}

.star-blue {
	background-color: #0087F6;
}

.star-deposit-training,
.star-management-track {
	background-color: #0087F6;
}

.main-button-m,
.main-button-s {
	width: 260px;
	display: flex;
	justify-content: center;
	border: 0;
	background: var(--primary-gradient);
	border-radius: var(--radius-8);
	color: var(--white);
	padding: var(--spacing-16) 24px;
	font-weight: 600;
	font-size: 18px;
	font-family: inherit;
	margin: 0 auto;
	cursor: pointer;
	transition: var(--transition-all);
}

.main-button-s {
	width: fit-content;
	font-size: 18px;
	padding: 8px 12px;
	margin: 0 0;
}

/* hover */
.main-button-m:hover,
.main-button-s:hover {
	transform: translateY(-2px);
	filter: brightness(1.08);
	box-shadow: 0 12px 24px rgba(0, 0, 0, .18);
}

/* active） */
.main-button-m:active,
.main-button-s:active {
	transform: translateY(0);
	box-shadow: 0 6px 12px rgba(0, 0, 0, .15);
}

.text-link {
	display: inline;
	position: relative;
	transition: var(--transition-color);
	color: var(--secondary);
	font-weight: 600;
	text-decoration: underline;
}

/* Source: CSS/src/shared.css */
/* ===== common-tabs.css ===== */
/*------------primary-tab(sticky-tab)-------------*/
.tabs-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	position: relative;
}

.tab {
	appearance: none;
	border: 0;
	background: transparent;
	font-family: inherit;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	padding: 8px 24px;
	border-bottom: none;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	color: var(--tear);
	border-radius: var(--radius-16);
	line-height: 120%;
	transition: color 0.5s ease;
}

.tab:hover {
	color: var(--white);
}

.tab-mask {
	padding: var(--spacing-16) 0px;
	background-color: #003F87F2;
}

body.recruitment-theme-internship .tab-mask {
	background-color: rgba(0, 92, 196, 0.95);
}

.drop-angle {
	position: sticky;
	top: 79px;
	z-index: 100;
}

.tabs-switch-solid {
	width: 1440px;
	display: flex;
	padding: 0px 24px;
	gap: var(--spacing-8);
	margin: 0 auto;
	position: relative;
}

.tab-indicator {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background: var(--primary-gradient);
	border-radius: var(--radius-16);
	transition: transform 0.35s ease, width 0.35s ease;
	z-index: 0;
}

.tabs-switch-solid .tab {
	position: relative;
	z-index: 1;
}

.tab.active {
	/* background: var(--primary-gradient); */
	color: var(--white);
}

.tab-label-main,
.tab-label-sub {
	display: block;
}

.tab .internship-tab-mobile-break {
	display: block;
}

.tab-label-sub {
	margin-top: 0;
	color: rgba(255, 255, 255, 0.5);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
}

.internship-tabs-container .tabs-switch-solid {
	align-items: stretch;
	gap: var(--spacing-16);
	height: 74px;
	padding: 0 var(--spacing-40);
}

.internship-tabs-container .tab {
	flex-direction: column;
	align-self: stretch;
	height: auto;
	min-height: 74px;
	padding: 8px 24px;
	line-height: 1.2;
}

.tabs-dropdown-toggle {
	appearance: none;
	border: 0;
	padding: 0;
	background-color: transparent;
	width: 18px;
	height: 18px;
	background-image: url(../../IMG/angle-down_outline.svg);
	background-size: contain;
	background-repeat: no-repeat;
	align-items: center;
	justify-content: center;
	position: absolute;
	z-index: 999;
	top: 24px;
	right: 16px;
	display: none;
	transition: var(--transition-transform);
}

.tabs-container.open .tabs-dropdown-toggle {
	transform: rotate(180deg);
}

.toggle-mask {
	width: 56px;
	height: 65.5px;
	background-color: #003F87F2;
	top: 0;
	right: 0;
	position: absolute;
	z-index: 998;
	pointer-events: auto;
	display: none;
}

.tabs-container.open .toggle-mask {
	display: none;
}

.slogan-text {
	display: none;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 8px;
	line-height: 1.4;
	word-wrap: break-word;
	padding: 8px 0px 8px 32px;
}

.tabs-container.open .slogan-text {
	display: block;
}

.tabs-container.open .tabs-switch-solid {
	display: flex;
	flex-wrap: wrap;
	overflow: visible;
}

.tabs-container.open .tab-mask {
	overflow: visible;
}


/* ===== common-popup.css ===== */
/* ------popup------ */
.popup {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.9);
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.5s ease;
	z-index: 9999;
}

.popup.show {
	opacity: 1;
}

.popup.hide {
	opacity: 0;
}

.popup-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, calc(-50% + 50px));
	background: var(--white);
	width: 90%;
	max-width: 560px;
	max-height: 60%;
	padding: var(--spacing-32);
	overflow-y: auto;
	overscroll-behavior: none;
	overscroll-behavior-y: none;
	-webkit-overflow-scrolling: auto;
	touch-action: pan-y;
	opacity: 0;
	transition: transform 0.5s ease, opacity 0.5s ease;
	border-radius: var(--radius-24);
	box-shadow: 0 0 40px 0 rgba(225, 204, 255, 0.70);
}

.popup.show .popup-content {
	transform: translate(-50%, -50%);
	opacity: 1;
}

.popup.hide .popup-content {
	transform: translate(-50%, calc(-50% - 50px));
	opacity: 0;
}

.popup-close {
	appearance: none;
	border: 0;
	padding: 0;
	background-color: transparent;
	position: absolute;
	top: 26px;
	right: 24px;
	width: 24px;
	height: 24px;
	background-image: url("../../IMG/BG_Elemnet/close-outline.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	cursor: pointer;
	transition: transform 0.3s ease-in-out;
}

.popup-close:hover {
	transform: scale(1.1);
}

#popup-title {
	color: var(--text-dark);
	font-size: 24px;
	font-weight: 700;
	text-align: center;
	margin-top: 8px;
}

#popup-subtitle {
	font-size: 20px;
	font-weight: 500;
	margin-bottom: var(--spacing-24);
	text-align: center;
}

#popup-text {
	font-size: 18px;
	line-height: 1.5;
	padding: var(--spacing-16);
	background-color: var(--inner-background);
	border-radius: var(--radius-16);
}

.popup-dot {
	position: absolute;
	top: 20px;
	left: 16px;
	width: 64px;
	height: 40px;
}

.PopImgAdditional {
	display: block;
	width: 160px;
	height: 160px;
	margin: 0 auto;
	margin-top: var(--spacing-40);
}

.internship-apply-popup .popup-content {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-24);
	max-height: none;
	overflow: hidden;
}

.internship-apply-popup-heading {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-6);
	padding-top: 48px;
	text-align: center;
}

.internship-apply-popup-title {
	color: var(--text-dark);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}

.internship-apply-popup-description {
	color: var(--text-dark);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.5;
	text-align: left;
}

.internship-apply-popup-info {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-6);
	padding: var(--spacing-16);
	background-color: var(--inner-background);
	border-radius: var(--radius-16);
}

.internship-apply-popup-actions {
	display: flex;
	gap: var(--spacing-8);
	width: 100%;
}

.internship-apply-popup-actions .main-button-m {
	flex: 1 1 0;
	width: auto;
	margin: 0;
}

.secondary-btn {
	background: linear-gradient(353.433deg, #014DA2 19.3%, #0E68CF 82.689%);
}

.internship-apply-popup-list {
	gap: var(--spacing-6);
}

.itmt-list.internship-apply-popup-list li {
	margin-bottom: 0;
	padding-left: 14px;
	line-height: 1.5;
}

.itmt-list.internship-apply-popup-list li::before {
	left: 0;
	top: 13px;
	width: 6px;
	height: 6px;
}

.internship-apply-popup-list strong {
	font-weight: 500;
}

.internship-apply-popup-copy-tail {
	display: inline-flex;
	align-items: center;
	gap: var(--spacing-8);
	white-space: nowrap;
}

.internship-apply-popup-copy {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 4px;
	border: 0;
	border-radius: var(--radius-999);
	background-color: #FDEFE6;
	color: #FF6A24;
	cursor: pointer;
	position: relative;
	transition: transform 0.2s ease;
	vertical-align: middle;
}

.internship-apply-popup-copy:hover {
	transform: scale(1.2);
}

.internship-apply-popup-copy svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

.internship-apply-popup-toast {
	position: absolute;
	left: 50%;
	bottom: calc(100% + 4px);
	transform: translate(-50%, 4px);
	padding: 4px 8px;
	border-radius: var(--radius-8);
	background-color: var(--text-dark);
	color: var(--white);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.internship-apply-popup-copy.is-copied .internship-apply-popup-toast {
	transform: translate(-50%, 0);
	opacity: 1;
}

body.no-scroll {
	overflow: hidden;
}

/* -----------ContactUS-itmt------------ */


/* ===== common-contact-actions.css ===== */

.contact-block {
	display: flex;
	justify-content: center;
	width: 100%;
	gap: var(--spacing-40);
}

.contact-item {
	border-radius: var(--radius-16);
	flex: 1 1 0;
	min-width: 0;
	padding: var(--spacing-24);
	background-color: var(--inner-background);
}

.contact-title {
	display: flex;
	align-items: center;
	gap: var(--spacing-8);
}

.contact-title p {
	color: var(--primary);
	font-size: 24px;
	font-weight: 700;
}

.contact-hand {
	width: 139px;
	height: auto;
	display: block;
	margin: -26px auto;
	position: relative;
	z-index: 2;
}

.phone,
.email {
	font-size: 20px;
	padding-left: 28px;
	word-wrap: break-word;
}



/* Footer */

.footer-content {
	background-color: var(--layout-footer-background-color);
	color: white;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-16);
	font-size: 14px;
	text-align: center;
	padding: var(--spacing-16) 24px;
}

.footer-social {
	display: flex;
	justify-content: center;
	gap: var(--spacing-16);
}

.footer-social-icon {
	display: block;
	width: 24px;
	height: 24px;
	background-color: var(--footer-social-icon-color);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	transition: transform 0.2s ease;
}

.footer-social-icon:hover {
	transform: scale(1.2);
}

.footer-social-facebook {
	-webkit-mask-image: url(../../IMG/Social/FB.svg);
	mask-image: url(../../IMG/Social/FB.svg);
}

.footer-social-linkedin {
	-webkit-mask-image: url(../../IMG/Social/Link.svg);
	mask-image: url(../../IMG/Social/Link.svg);
}

.footer-social-instagram {
	-webkit-mask-image: url(../../IMG/Social/IG.svg);
	mask-image: url(../../IMG/Social/IG.svg);
}

.footer-copy {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-8);
}

.footer-inline {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	gap: var(--spacing-16);
}

.address {
	font-style: normal;
}

.goTop {
	appearance: none;
	border: 0;
	padding: 0;
	background-color: transparent;
	display: block;
	position: fixed;
	z-index: 999;
	right: 72px;
	bottom: 24px;
	width: 48px;
	height: 48px;
	background-image: url("../../IMG/BG_Elemnet/goTop.svg");
	background-size: 100% auto;
	background-repeat: no-repeat;
	opacity: 0;
	pointer-events: none;
	transform: translateY(12px);
	transition: opacity 0.3s ease, transform 0.3s ease, filter 0.3s ease;
}

.goTop:hover {
	transform: scale(1.1);
	filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.3));
}

.goTop.is-visible,
.fixed-button.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);
}

.fixed-button {
	position: fixed;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-16);
	z-index: 999;
	bottom: 96px;
	right: 40px;
	opacity: 0;
	pointer-events: none;
	transform: translateY(12px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.apply-icon {
	width: 32px;
	height: 32px;
}

.square-button {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: var(--spacing-8);
	width: 108px;
	height: 108px;
	color: var(--white);
	font-size: 18px;
	font-weight: 700;
	border-radius: var(--radius-24);
}

.apply-button {
	border: 2px solid #FFCBB1;
	background: var(--primary-gradient);
	text-align: center;
	line-height: 1.3;
	position: relative;
	transition:
		filter 0.25s ease,
		border-color 0.25s ease;
}

.apply-button:hover {
	filter: brightness(1.08) saturate(1.05);
}

.drop-angle {
	transition: transform 0.35s ease;
}

.drop-angle.is-hidden {
	transform: translateY(-120%);
}

/* ===== common-decorative.css ===== */
/* img */

.bg-deco {
	position: absolute;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -1;
}

.job-img_left,
.job-img_right {
	background-image: url(../../IMG/BG_Elemnet/job-img_1.png);
	top: 0;
	left: -106px;
	width: 106px;
	height: 460px;
}

.job-img_right {
	background-image: url(../../IMG/BG_Elemnet/job-img_2.png);
	left: auto;
	top: auto;
	bottom: 5%;
	right: -106px;
}

.intern-img_left,
.intern-img_right {
	width: 106px;
	height: 577px;
	background-image: url(../../IMG/Intern/intern-img_left.png);
	background-size: 100% 100%;
	top: 0;
	left: -106px;
}

.intern-img_right {
	background-image: url(../../IMG/Intern/intern-img_right.png);
	top: auto;
	left: auto;
	bottom: 5%;
	right: -106px;
}

.intern-tech-img_left,
.intern-tech-img_right {
	width: 64px;
	height: 442px;
	background-image: url(../../IMG/Intern/tech-img.png);
	background-size: 100% 100%;
	top: 2%;
	right: -80px;
}

.intern-tech-img_left {
	top: auto;
	right: auto;
	bottom: 18%;
	left: -80px;
}

.intern-share_left,
.intern-share_right {
	width: 106px;
	height: 640px;
	background-image: url(../../IMG/Intern/intern-share_left.png);
	background-size: 100% 100%;
	top: 7%;
	left: -106px;
}

.intern-share_right {
	height: 643px;
	background-image: url(../../IMG/Intern/intern-share_share.png);
	top: 22%;
	left: auto;
	right: -106px;
}

.intern-share_down {
	width: 280px;
	height: 246px;
	background-image: url(../../IMG/Intern/intern-share_down.png);
	background-size: 100% 100%;
	bottom: -130px;
	left: -96px;
}

.intern-system_dark,
.intern-faq_dark {
	width: 64px;
	height: 442px;
	background-image: url(../../IMG/Intern/intern-dark.png);
	background-size: 100% 100%;
	z-index: 0;
}

.internship-system-card-wrap {
	position: relative;
}

.internship-system-card-wrap .card-style {
	position: relative;
	z-index: 1;
}

.intern-system_dark {
	top: 18%;
	left: -80px;
}

.intern-system_setting {
	width: 140px;
	height: 151px;
	background-image: url(../../IMG/Intern/intern-setting.png);
	background-size: 100% 100%;
	top: 36px;
	right: -70px;
	z-index: 0;
}

.internship-faq-section .accordion-block {
	position: relative;
}

.internship-faq-section .accordion {
	position: relative;
	z-index: 1;
}

.intern-faq_icon {
	width: 130px;
	height: 196px;
	background-image: url(../../IMG/Intern/intern-faq.png);
	background-size: 100% 100%;
	top: 7%;
	left: -96px;
	z-index: 0;
}

.intern-faq_dark {
	top: -20%;
	right: -80px;
}

.tech-img_left,
.tech-img_right {
	width: 64px;
	height: 442px;
	top: 6%;
	left: -80px;
	background-image: url(../../IMG/BG_Elemnet/tech-img.png);
	z-index: -1;
}

.tech-img_right {
	top: auto;
	left: auto;
	bottom: 0;
	right: -80px;
	background-image: url(../../IMG/BG_Elemnet/tech-img.png);
}

.circle-star {
	width: 114px;
	height: 214px;
	background-image: url(../../IMG/BG_Elemnet/circle-star.png);
	top: 50%;
	right: -114px;
	transform: translateY(-50%);
}

.line-chart {
	width: 162px;
	height: 142px;
	background-image: url(../../IMG/BG_Elemnet/line-chart.png);
	bottom: -120px;
	left: -100px;
	z-index: -1;
}

.circle-star_left {
	width: 118px;
	height: 257px;
	background-image: url(../../IMG/BG_Elemnet/circle-star_left.png);
	bottom: 10%;
	left: -118px;
	z-index: -1;
}

.light-img {
	width: 120px;
	height: 216px;
	background-image: url(../../IMG/BG_Elemnet/light-img.png);
	top: 10%;
	right: -120px;
	z-index: -1;
}

.file-img {
	width: 175px;
	height: 214px;
	background-image: url(../../IMG/BG_Elemnet/file-img.png);
	bottom: 20%;
	right: -118px;
}

.safe-img {
	width: 236px;
	height: 335px;
	background-image: url(../../IMG/BG_Elemnet/safe-img.png);
	bottom: -14%;
	left: -200px;
}

.circle-star_bottom {
	width: 351px;
	height: 224px;
	background-image: url(../../IMG/BG_Elemnet/circle-star_bottom.png);
	bottom: -10%;
	left: 2%;
}


.FAQ .tech-img_left {
	left: 24px;
	top: 0;
}

.FAQ .tech-img_right {
	right: 24px;
	bottom: 20%;
}



/* ===== common-responsive.css ===== */
/* breakpoint:1439px */

@media (max-width: 1439px) {

	:root {
		--header-height: 64px;
	}

	.container,
	.Join-container {
		width: 100%;
	}

	.container {
		height: 64px;
	}

	.navbar .container {
		height: 64px;
	}

	.navbar::after {
		right: 24px;
		width: 345px;
		height: 67px;
	}

	.header-toggle-tab {
		min-width: 72px;
		font-size: 20px;
	}

	.TitleContent br {
		display: none;
	}

	.tabs-switch-solid {
		width: 100%;
	}

	.tab {
		font-size: 20px;
	}

	.job-img_left,
	.job-img_right,
	.intern-img_left,
	.intern-img_right,
	.intern-tech-img_left,
	.intern-tech-img_right,
	.intern-share_left,
	.intern-share_right,
	.intern-share_down,
	.intern-system_dark,
	.intern-system_setting,
	.intern-faq_icon,
	.intern-faq_dark,
	.tech-img_left,
	.tech-img_right,
	.circle-star,
	.circle-star_left,
	.line-chart,
	.light-img,
	.file-img,
	.circle-star_bottom,
	.safe-img {
		display: none;
	}

	.drop-angle {
		top: 64px;
	}

}

@media (max-width: 1279px) {

	.wrapper {
		width: 100%;
		padding: var(--spacing-60) 40px;
	}

	.card-style {
		padding: var(--spacing-64);
	}

	.yuanta-content br {
		display: none;
	}

	.tab {
		font-size: 18px;
	}

	.tab-mask {
		padding: 12px 0px;
	}

}

/* breakpoint:1023px */

@media (max-width: 1023px) {

	.wrapper {
		padding: var(--spacing-32) 32px;
	}

	.card-style {
		padding: var(--spacing-40);
	}

	.contact-block {
		gap: var(--spacing-24);
	}

	.inner-block-spacing {
		margin-top: 64px;
	}

	.tab-mask {
		overflow: visible;
		white-space: normal;
	}

	.tabs {
		gap: 4px;
	}

	.tab-indicator {
		display: none;
	}

	.tab.active {
		background: var(--primary-gradient);
	}

	.tab br {
		display: block;
	}

	.tabs-switch-solid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--spacing-8);
		padding: 0 32px;
	}

	.tab {
		padding: 10px 12px;
		white-space: normal;
		border-radius: var(--radius-8);
		background-color: #123760;
	}

	.tabs-dropdown-toggle {
		display: none;
	}

	.fixed-button {
		right: 24px;
	}

	.square-button {
		font-size: 18px;
		width: 110px;
		height: 110px;
	}

	.apply-icon {
		width: 28px;
		height: 28px;
	}

	.goTop {
		right: 52px;
	}

	.toggle-mask {
		display: none;
	}

	.TitleContent br,
	.train-word br {
		display: none;
	}

	.inner-background {
		padding: var(--spacing-24);
	}

	.tabs-switch-solid::after {
		content: none;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {

	.tab-indicator {
		display: block;
	}

	.tabs-switch-solid {
		width: 100%;
		display: flex;
		padding: 0 24px;
	}

	.tab {
		flex: 1;
		padding: 10px 12px;
		border-radius: var(--radius-16);
		background-color: transparent;
		font-size: 18px;
		font-weight: 600;
		color: var(--tear);
	}

	.tab.active {
		background: none;
		color: var(--white);
	}
}

/* breakpoint:767px */

@media (max-width: 767px) {

	:root {
		--header-height: 58px;
	}

	.wrapper {
		width: 100%;
		padding: var(--spacing-32) 16px;
	}

	.card-style {
		padding: var(--spacing-24) 16px;
		box-shadow: 0 0 20px 0 rgba(225, 204, 255, 0.70);
	}

	.Title::after {
		bottom: 6px;
	}

	.block-title {
		gap: var(--spacing-16);
		margin-bottom: var(--spacing-32);
	}

	.Join-Card {
		padding: var(--spacing-24) 16px;
	}

	.yuanta-content {
		font-size: 20px;
	}

	.card-block,
	.yuanta-content {
		text-align: left;
	}

	.SubTitle {
		font-size: 26px;
	}

	.subtitle-container {
		gap: var(--spacing-16);
		margin-bottom: 12px;
	}

	.Title {
		font-size: 28px;
	}

	.container {
		width: 100%;
		padding: 0 24px;
		height: 56px;
	}

	.goTop {
		width: 48px;
		right: 24px;
		bottom: 80px;
	}

	.contact-block {
		flex-direction: column;
		gap: var(--spacing-24);
	}

	.tab-mask {
		top: 58px;
	}

	.tabs-switch-solid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		gap: 6px 4px;
		padding: 0 16px;
	}

	.tab {
		grid-column: span 2;
		font-size: 14px;
		font-weight: 700;
		line-height: 1.15;
		padding: 8px;
		background-color: #123760;
		color: rgba(255, 255, 255, 0.82);
		box-shadow: none;
	}

	.tab.active {
		background: linear-gradient(135deg, #ff6b00 0%, #ff7f45 100%);
		color: var(--white);
	}

	.tab:hover {
		color: var(--white);
	}

	.internship-tabs-container .tabs-switch-solid {
		display: flex;
		align-items: stretch;
		flex-wrap: nowrap;
		grid-template-columns: none;
		gap: 4px;
		height: auto;
		padding: 0 16px;
	}

	.internship-tabs-container .tab {
		flex: 1 1 0;
		align-self: stretch;
		grid-column: auto;
		height: auto;
		min-height: 0;
		min-width: 0;
		padding: 6px 8px;
		background-color: #0B509E;
	}

	.internship-tabs-container .tab-label-sub {
		font-size: 12px;
		line-height: 1.4;
	}

	.tab:nth-child(4) {
		grid-column: 2 / span 2;
	}

	.tab:nth-child(5) {
		grid-column: 4 / span 2;
	}

	.phone,
	.email {
		padding-left: 32px;
	}

	.footer-inline {
		width: 100%;
		flex-direction: column;
		gap: var(--spacing-8);
	}

	.fixed-button {
		bottom: 0;
		right: 0;
		width: 100%;
		flex-direction: row;
		gap: 0;
	}

	.square-button {
		width: 100%;
		flex-direction: row;
		height: 63px;
		border-radius: 0;
		font-size: 18px;
	}

	.apply-icon {
		width: 20px;
		height: 20px;
	}

	.apply-button {
		border: none;
		border-top: 2px solid #FFCBB1;
	}

	.drop-angle {
		top: 58px;
	}

	.inner-background,
	.popup-content {
		padding: var(--spacing-24) 16px;
	}

	.footer {
		padding-bottom: 63px;
	}

	.footer.footer-compact {
		padding-bottom: 0;
	}

	body.recruitment-theme-internship .footer.footer-compact {
		padding-bottom: 63px;
	}

	body.recruitment-theme-internship.internship-no-floating-apply .footer.footer-compact {
		padding-bottom: 0;
	}

	.main-button-m {
		width: 100%;
		box-sizing: border-box;
	}

	.submit-btn {
		padding-left: 32px;
	}

	.hiring-title .Item {
		margin-top: 6px;
	}

	.contact-title p {
		font-size: 20px;
	}

	.logo a {
		font-size: 16px;
		width: 143.478px;
		height: 26.039px;
	}

	.navbar .container {
		height: 58px;
		padding: 12px 16px;
	}

	.navbar::after {
		top: 0;
		right: 0;
		width: 100%;
		height: 58px;
		background-image: url(../../IMG/BG_Elemnet/header-bg-mobile.png);
		background-size: cover;
	}

	.header-toggle {
		padding: 2px;
		gap: 2px;
	}

	.header-toggle::before {
		top: 2px;
		bottom: 2px;
		left: 2px;
		width: calc((100% - 6px) / 2);
	}

	.header-toggle.header-toggle-internship::before {
		transform: translateX(calc(100% + 2px));
	}

	.header-toggle-tab {
		min-width: 64px;
		padding: 4px 12px;
		font-size: 20px;
	}

	}

/* Source: CSS/src/components.css */
/* http://meyerweb.com/eric/tools/css/reset/ 
 v2.0 | 20110126
 License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

html,
body {
	overscroll-behavior: none;
	overscroll-behavior-y: none;
}

body {
	width: 100%;
	margin: 0 auto;
	line-height: 1.5;
	overflow-x: hidden;
	-webkit-overflow-scrolling: auto;
	touch-action: pan-y;
	background-color: var(--primary);
	color: var(--text-dark);
	font-weight: 500;
	font-family: 'Montserrat', 'Noto Sans TC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

}

ol,
ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

a {
	text-decoration: none;
}

img {
	max-width: 100%;
	height: auto;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

/*css resset end*/

.News-text,
.tab,
a,
.goTop,
.apply-btn,
.map-link img,
.popup-close,
.accordion-label,
.ma-card,
.tabs-dropdown-toggle {
	cursor: pointer;
}

/* KV */
.KV {
	margin-top: 80px;
	position: relative;
	background-color: white;
}

.kv-carousel {
	position: relative;
	width: 100%;
	height: 800px;
	margin-bottom: 44px;
	background-color: var(--white);
}

.internship-kv .kv-carousel {
	margin-bottom: 0;
}

.kv-track {
	position: relative;
	height: 100%;
}

.kv-slide {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s ease, visibility 0.6s ease;
}

.kv-slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 1;
}

.kv-slide-primary {
	background-image: url(../../IMG/Banner/KV_1440.webp);
}

.kv-slide-secondary {
	background-image: url(../../IMG/Banner/ITMT_1440.webp);
}

.kv-slide-intern {
	background-image: url(../../IMG/Banner/Intern_1440.webp);
}

.kv-control {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 56px;
	height: 56px;
	border: none;
	border-radius: 50%;
	background: rgba(31, 35, 42, 0.78);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 28px 28px;
	z-index: 2;
	transition: background-color 0.3s ease, transform 0.3s ease;
	cursor: pointer;
}

.kv-control:hover {
	transform: translateY(-50%) scale(1.1);
}

.kv-control span {
	display: none;
}

.kv-control-prev {
	left: 40px;
	background-image: url(../../IMG/carousel-left.png);
}

.kv-control-next {
	right: 40px;
	background-image: url(../../IMG/carousel-right.png);
}

.kv-pagination {
	position: absolute;
	left: 50%;
	top: calc(100% + 16px);
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 12px;
	z-index: 2;
}

.kv-dot {
	width: 12px;
	height: 12px;
	border: none;
	border-radius: 50%;
	background: #c8c8c8;
	transition: background-color 0.3s ease, width 0.3s ease, border-radius 0.3s ease, transform 0.3s ease;
	cursor: pointer;
}

.kv-dot.is-active {
	background: #f66b1f;
	width: 28px;
	border-radius: 999px;
}

.kv-carousel[data-carousel-enabled="false"] .kv-control,
.kv-carousel[data-carousel-enabled="false"] .kv-pagination {
	display: none;
}

.kv-carousel[data-carousel-enabled="false"] .kv-slide:not(.is-active) {
	display: none;
}

.kv-carousel[data-carousel-enabled="false"] {
	margin-bottom: 0;
}

@media (min-width: 2048px) {

	.kv-carousel {
		height: auto;
		aspect-ratio: 12 / 5;
		margin-bottom: 44px;
	}

	.internship-kv .kv-carousel {
		margin-bottom: 0;
	}

	.kv-slide {
		background-size: 100% auto;
		background-position: top center;
	}

	.kv-pagination {
		top: calc(100% + 16px);
	}
}

/* ===== components-primitives.css ===== */
/* Component primitives */

.FeatureCard,
.event,
.school-item,
.data-block .itmt-list,
.marketing-block .itmt-list {
	background-color: #fefefe;
}

.FeatureCard,
.event,
.data-block .itmt-list,
.marketing-block .itmt-list {
	border-radius: var(--radius-16);
}

.FeatureCard,
.train-block,
.train-card,
.Step1,
.Step2,
.card-content,
.date,
.apply-block,
.apply-list,
.video-title,
.activity-block,
.local-item,
.accordion,
.data-block,
.marketing-block,
.list-item,
.apply-item {
	display: flex;
	flex-direction: column;
}

.FeatureCard,
.train-block,
.train-mentor,
.train-card,
.Step1,
.Step2,
.card-content,
.card-title,
.ma-life,
.ma-video,
.date,
.apply-list,
.event,
.list-item {
	width: 100%;
}

.chip,
.train-chip,
.new {
	width: fit-content;
	font-weight: 500;
	border-radius: var(--radius-999);
}

.chip,
.train-chip {
	padding: 4px 8px;
	font-size: 16px;
}

.responsive-video iframe,
.video-cover-wrapper,
.video-iframe-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* ===== components-separated.css ===== */
.separated-grid {
	display: grid;
	justify-content: center;
	gap: var(--spacing-8);
	grid-template-rows: 1fr;
	grid-auto-flow: column;
}

.separated-label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-8);
	padding: 12px 24px;
	border-radius: var(--radius-8);
	background: #e9e9e9;
	color: #737373;
	font-size: 20px;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.separated-label:hover {
	background: #dadada;
	color: #4e4e4e;
}

.separated-content {
	display: none;
}

.separated-label.active {
	background-color: var(--secondary);
	color: var(--white);
}

.separated-content.active {
	display: block;
}


/* ===== components-feature.css ===== */
/* Feature */

.FeatureTitle {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 4px;
}

.FeatureTitle h2,
.FeatureTitle h3 {
	font-weight: 700;
	color: var(--primary);
	font-size: 24px;
	white-space: nowrap;
	line-height: 1.4;
}

.card-block {
	display: flex;
	gap: var(--spacing-16);
}

.FeatureCard {
	justify-content: flex-start;
	gap: var(--spacing-8);
	text-align: center;
	font-size: 18px;
	font-weight: 500;
	padding: var(--spacing-16);
}

.FeatureCard .Item {
	width: 20px;
	height: 20px;
}

.PointBlock {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: var(--spacing-40);
	gap: var(--spacing-16);
}

.point-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.point-content {
	font-weight: 500;
	font-size: 18px;
	text-align: center;
}

.point-number {
	text-align: center;
	width: 100%;
}

.line {
	flex: 1;
	height: 1px;
	background-color: var(--line);
}

.point-number p {
	color: var(--text-dark);
	font-weight: 600;
}

.number {
	display: inline-flex;
	align-items: flex-end;
	justify-content: center;
	gap: 2px;
	color: var(--secondary);
	line-height: 1;
	margin-top: var(--spacing-16);
}

.metric-main {
	position: relative;
	display: inline-flex;
	align-items: flex-end;
}

.metric-value {
	color: var(--secondary);
	font-size: 48px;
	font-weight: 800;
	line-height: 0.95;
}

.metric-suffix {
	position: absolute;
	top: -5px;
	right: -20px;
	color: var(--secondary);
	font-size: 26px;
	font-weight: 800;
}

.metric-unit {
	color: var(--secondary);
	font-size: 20px;
	font-weight: 800;
	line-height: 1;
	margin-bottom: 2px;
	margin-left: 6px;
}

.StepBlock h3 {
	font-weight: 700;
	font-size: 24px;
}


/* ===== components-training.css ===== */
/* -------------Training------------- */

.train-block {
	align-items: center;
	background-color: white;
}

.train-mentor {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: var(--spacing-16);
}

.train-card {
	align-items: center;
	padding: var(--spacing-16);
	background-color: #E8F5FF;
	text-align: center;
	border-radius: var(--radius-16);
}

.train-text p,
.train-item p {
	font-weight: 500;
	font-size: 20px;
}

.train-card h3 {
	color: var(--primary);
	font-weight: 700;
	margin-top: 8px;
	font-size: 20px;
}

.train-pic {
	width: 66px;
}

.intro-pioneer .train-card {
	justify-content: center;
	min-width: 0;
	padding: var(--spacing-16);
	background-color: #e9f2fa;
	border-radius: var(--radius-16);
}

.intro-pioneer .train-pic {
	width: 72px;
	height: 72px;
}

.intro-pioneer .train-card h3 {
	margin-top: 0;
	color: var(--primary);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5;
	white-space: nowrap;
}

.train-word {
	font-weight: 500;
	font-size: 18px;
	text-align: center;
	padding: var(--spacing-40) 0px var(--spacing-24) 0px;
}

.training-note {
	margin-top: 12px;
}

.StepBlock {
	width: 100%;
	display: flex;
	gap: var(--spacing-24);
}

.career-step-render {
	width: 100%;
}

.career-badge {
	margin: 0 auto var(--spacing-40);
}

.Step1,
.Step2 {
	flex: 1 1 0;
	min-width: 0;
	text-align: center;
	padding: var(--spacing-24) 56px;
	border-radius: var(--radius-16);
	background-color: #DEEDFA;
}

.Step2 {
	background-color: #FAE7DF;
}

.step-title {
	display: flex;
	gap: var(--spacing-8);
	align-items: center;
	justify-content: center;
}

.train-item {
	display: flex;
	gap: 10px;
	justify-content: center;
	text-align: center;
	padding: 10px 16px;
	color: #0087F6;
	background-color: #F5FAFD;
	margin-top: var(--spacing-16);
	border-radius: var(--radius-8);
	flex: 1;
	align-items: center;
}

.train-chip {
	background-color: #0087F6;
	color: white;
}

.Step2 .train-item {
	color: var(--secondary);
	background-color: #FFF3EE;
}

.Step1 h3 {
	color: #0087F6;
}

.Step2 h3 {
	color: var(--secondary);
}

/* -------------carrer------------- */

.chart-text {
	font-size: 18px;
	text-align: center;
	margin-top: var(--spacing-40);
}


/* ===== components-chips.css ===== */
/* --------------chip------------ */

.skill,
.skill-itmt {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-16);
	padding: var(--spacing-24) 0px 40px 0px;
}

.chip-line {
	display: flex;
	justify-content: center;
	gap: var(--spacing-8);
}

.chip {
	color: #EB6100;
	background-color: #FDEFE6;
	font-size: 18px;
	text-align: center;
	height: fit-content;
	white-space: nowrap;
}

.skill-text {
	text-align: center;
	font-size: 18px;
	font-weight: 500;
}

.new {
	padding: 2px 4px;
	color: var(--white);
	background-color: #DE0606;
	text-align: center;
	height: fit-content;
	font-size: 10px;
}


/* ===== components-ma-profile.css ===== */
/* about-MA */

.ma-card {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--spacing-20);
	transition: background-color 0.3s ease-in-out;
}

.ma-card img {
	transition: transform 0.4s ease;
}

/* hover 卡片 → 圖片 zoom in */
.ma-card:hover img {
	transform: scale(1.04);
}

.ma-pic {
	margin: 0 auto;
	max-width: none;
	width: 160px;
	height: 160px;

}

.name-link {
	display: flex;
	justify-content: flex-start;
	gap: var(--spacing-8);
	align-items: center;
}

.solid-right {
	width: 28px;
	height: 28px;
	display: block;
}

.ma-card .solid-right {
	transform: translateX(0);
	transition: transform 0.3s ease-in-out;
}

.ma-card:hover .solid-right {
	transform: translateX(8px);
}

.Name {
	color: var(--text-dark);
	font-size: 24px;
	font-weight: 700;
	white-space: nowrap;
	position: relative;
	display: inline-block;
}

.Name::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: var(--secondary);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s ease-out;
}

.ma-card:hover .Name::after {
	transform: scaleX(1);
}

.card-content {
	font-size: 18px;
	font-weight: 500;
	gap: 6px;
}

.card-title {
	justify-content: space-between;
}

.ma-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto auto;
	grid-gap: 64px;
}

.ma-intro {
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	padding: var(--spacing-16);
	color: #005BAC;
	background-color: #E9F2FA;
	border-radius: var(--radius-16);
	margin-top: var(--spacing-40);
}

.reaserch-image {
	max-width: 620px;
	height: auto;
	display: block;
	margin: 0 auto;
}

.ma-life {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto auto;
	gap: var(--spacing-24);
	margin-top: var(--spacing-24);
}

.ma-video {
	display: flex;
	gap: var(--spacing-12);
	align-items: flex-start;
}

.hiring-place{
	font-size: 18px;
	color: var(--helper-text);
}

.responsive-video {
	position: relative;
	width: auto;
	flex: 0 0 52%;
	aspect-ratio: 16 / 9;
	height: auto;
	border-radius: var(--radius-16);
	overflow: hidden;
	display: block;
}

.responsive-video iframe {
	aspect-ratio: 16 / 9;
	border: none;
}

.video-cover-wrapper {
	z-index: 10;
	cursor: pointer;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: block;
	transition: opacity 0.3s ease;
	border-radius: var(--radius-16);
	overflow: hidden;
}

.video-cover-wrapper:hover {
	opacity: 0.95;
}

.video-cover-wrapper.hidden {
	display: none !important;
	z-index: -1;
	pointer-events: none;
}

.video-iframe-wrapper {
	z-index: 5;
	border-radius: var(--radius-16);
	overflow: hidden;
}

.video-iframe-wrapper iframe {
	width: 100%;
	height: 100%;
	border: none;
}

.video-cover-wrapper::after {
	/* red rounded pill with white triangle (SVG data URI) */
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 40px;
	background-color: #FF0034;
	border-radius: 8px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23fff' d='M8 5v14l11-7z'/></svg>");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 44%;
	transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
	pointer-events: none;
}
/* 
.video-cover-wrapper:hover::after {
	transform: translate(-50%, -50%) scale(1.08);
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
} */

.video-title {
	color: var(--text-dark);
	justify-content: space-between;
	flex-grow: 1;
	align-self: stretch;
}

.day {
	font-size: 16px;
	color: var(--helper-text);
}

.video-title .day {
	margin-top: auto;
}

.video-content h3 {
	font-size: 24px;
	font-weight: 700;
}

.video-content p {
	font-size: 18px;
	font-weight: 500;
}


/* ===== components-apply-timeline.css ===== */
/*--------------- apply ---------------*/

.apply-block {
	align-items: center;
}

.apply-line {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-8);
}

.apply-list {
	justify-content: flex-start;
}

.dead-line {
	font-size: 32px;
	font-weight: 800;
	color: var(--secondary);
	text-align: center;
}

.apply-list>*:first-child {
	margin-top: 0;
}

.apply-date {
	display: flex;
	gap: 6px;
	justify-content: center;
}

.deadline-group {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	white-space: nowrap;
}

.apply-date span {
	font-size: 20px;
	font-weight: 600;
	margin-top: 13px;
}

.apply-title,
.hiring-title {
	display: flex;
	align-items: center;
	gap: var(--spacing-8);
	font-size: 24px;
	font-weight: 700;
	color: var(--primary);
}

.apply-title h2 {
	font-size: 24px;
	font-weight: 700;
}

.itmt-list {
	display: flex;
	flex-direction: column;
}

.custom-list li,
.itmt-list li {
	text-align: left;
	font-weight: 500;
	position: relative;
	margin-bottom: var(--spacing-16);
	font-size: 18px;
	padding-left: 56px;
	width: 100%;
}

.custom-list li::before,
.itmt-list li::before {
	content: "";
	position: absolute;
	left: 32px;
	top: 15px;
	transform: translateY(-50%);
	width: 8px;
	height: 8px;
	background-color: var(--primary);
	border-radius: 50%;
}

/* DayLine */

.date-line {
	display: flex;
	align-items: stretch;
	gap: var(--spacing-8);
	margin-top: var(--spacing-24);
}

.date {
	justify-content: space-between;
	text-align: center;
	background-color: var(--inner-background);
	padding: var(--spacing-24) 10px;
	gap: 4px;
	color: var(--text-dark);
	border-radius: var(--radius-16);
}

.date h3 {
	font-weight: 700;
	font-size: 20px;
	color: var(--secondary);
}

.date p {
	font-weight: 600;
	font-size: 20px;
}

.goright {
	height: 13px;
	align-self: center;
}


/* ===== components-activity.css ===== */
/*----------- Activity----------- */

.activity-block {
	align-items: center;
	gap: var(--spacing-32);
}

.event {
	display: flex;
	flex-direction: row;
	gap: var(--spacing-40);
	padding: var(--spacing-40);
	margin-top: var(--spacing-32);
}

.event-name {
	width: 50%;
}

.event-name p {
	padding-left: 32px;
}

.event-time {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.hiring-title {
	font-size: 24px;
	font-weight: 700;
	color: var(--primary);
	align-items: flex-start;
}

.time-item {
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	gap: var(--spacing-8);
	margin-top: 4px;
}

.school-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--spacing-24);
	margin-top: var(--spacing-32);
}

.school-title {
	display: flex;
	align-items: center;
	gap: var(--spacing-8);
}

.school-content {
	padding-left: 28px;
	font-size: 20px;
	font-weight: 500;
}

.school-time {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 4px;
	margin-top: 8px;
}

.school-item {
	padding: var(--spacing-24) 16px;
	border-radius: var(--radius-24);
}

.event p {
	font-weight: 500;
	font-size: 20px;
}

.reminder {
	color: var(--text-dark);
	background: linear-gradient(transparent calc(100% - 10px),
			#F3D8CB 0);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.apply-time {
	display: flex;
	align-items: center;
	color: var(--text-dark);
	gap: var(--spacing-8);
	font-size: 20px;
	font-weight: 500;
}

.local-item h3 {
	font-size: 24px;
	font-weight: 700;
}

.map-link {
	display: flex;
	justify-content: center;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	padding: 4px;
	background-color: #FDEFE6;
	border-radius: var(--radius-999);
	width: fit-content;
	height: fit-content;
}

.map-link img {
	width: 20px;
	height: 20px;
}

.map-link:hover {
	transform: scale(1.1) translateY(-5px);
}

.local-marker {
	color: var(--text-dark);
	display: flex;
	align-items: center;
	gap: var(--spacing-8);
	font-size: 28px;
	font-weight: 700;
}

.local-marker p {
	margin: 0;
	display: inline;
}

.event-line {
	width: 1px;
	background-color: var(--line);
	align-items: center;
}

.section {
	width: 50%;
}


/* ===== components-faq.css ===== */
/* FAQ */

.accordion>*:first-child {
	margin-top: 0;
}

.accordion-input {
	display: none;
}

.accordion-content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.5s ease;
}

.accordion-content p {
	padding: var(--spacing-24) 40px 32px 72px;
	border-top: 1px solid var(--line);
	font-size: 18px;
	font-weight: 500;
}

.accordion-input:checked+.accordion-label+.accordion-content {
	max-height: 200px;
}

.accordion-label {
	display: flex;
	align-items: flex-start;
	padding: var(--spacing-24) 32px 24px 32px;
	color: var(--text-dark);
	font-size: 24px;
	font-weight: 600;
	position: relative;
	gap: var(--spacing-16);
}

.accordion-label::after {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-image: url(../../IMG/angle-down_outline.svg);
	background-size: contain;
	transition: var(--transition-transform);
	background-repeat: no-repeat;
	object-fit: cover;
	padding-left: 16px;
	position: absolute;
	right: 32px;
	top: 28px;
}

.accordion-input:checked+.accordion-label::after {
	transform: rotate(180deg);
}

.accordion-item {
	overflow: hidden;
	border-radius: var(--radius-16);
	background-color: var(--white);
}

.accordion-item .Item {
	margin-top: 7px;
}

/* Source: CSS/src/sections.css */
.contactus,
.internship-faq-section {
	position: relative;
	isolation: isolate;
}

.contactus {
	--title-highlight-gradient: var(--gradient-highlight-orange);
	background-color: var(--section-contactus-background-color);
}

.contactus::before,
.internship-faq-section::before {
	content: '';
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: 1200px;
	margin-inline: auto;
	background-color: var(--contactus-dot-background-color);
	-webkit-mask: url(../../IMG/BG_Elemnet/dot-bg_W.svg) center bottom / 100% auto no-repeat;
	mask: url(../../IMG/BG_Elemnet/dot-bg_W.svg) center bottom / 100% auto no-repeat;
	pointer-events: none;
	z-index: 0;
}

.contactus .wrapper,
.internship-faq-section .wrapper {
	z-index: 1;
}

.contactus .wrapper {
	padding: 60px 120px 26px 120px;
	margin-top: 60px;
}

.accordion {
	gap: var(--spacing-20);
}

.contactus .TitleContent {
	color: var(--white);
}

.contactus .Title {
	color: var(--white);
}

.contactus .Title::after {
	background: var(--title-highlight-gradient);
}

.internship-apply .block-title {
	gap: var(--spacing-12);
}

.internship-title-availability {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-12);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
}

.internship-title-availability-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-4);
	padding: 4px 8px;
	border-radius: var(--radius-999);
	background: #8390A2;
	color: var(--white);
}

.internship-title-availability-chip-open {
	background: var(--primary);
}

.internship-title-availability-period {
	color: var(--helper-text);
}

.internship-title-availability-number {
	font-family: 'Montserrat', 'Noto Sans TC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.internship-title-mobile-break {
	display: none;
}

.contactus .card-style {
	max-width: 960px;
	margin: 0 auto;
	padding: 48px 64px;
}

.slogan {
	--slogan-bg-desktop: url(../../IMG/BG_Elemnet/Slogan_W.png);
	--slogan-bg-mobile: url(../../IMG/BG_Elemnet/Slogan_M.png);
	margin: 60px 0px;
	background-color: var(--secondary);
	text-align: center;
	position: relative;
	background-image: var(--slogan-bg-desktop);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.slogan-wrapper {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--spacing-80) 0px;
	color: var(--white);
	font-size: 40px;
	font-weight: 800;
}

.internship-slogan {
	--slogan-bg-desktop: url(../../IMG/BG_Elemnet/Slogan_W.png);
	--slogan-bg-mobile: url(../../IMG/BG_Elemnet/Slogan_M.png);
}

.internship-system-section {
	--title-highlight-gradient: var(--gradient-highlight-orange);
	background-color: var(--section-contactus-background-color);
	padding: 0;
}

.internship-faq-section {
	--title-highlight-gradient: var(--gradient-highlight-orange);
	background-color: var(--section-contactus-background-color);
	padding-top: 0;
	overflow: hidden;
}

.internship-system-section .block-title,
.internship-faq-section .block-title {
	margin-bottom: var(--spacing-40);
}

.internship-system-section .Title,
.internship-faq-section .Title {
	color: var(--white);
	letter-spacing: 2.4px;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.internship-system-section .card-style {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-64);
}

.internship-system-image {
	background-color: #FEFEFE;
	border-radius: var(--radius-16);
	margin: 0;
	overflow: hidden;
}

.internship-system-image img {
	display: block;
	height: auto;
	width: 100%;
}

.internship-share-grid {
	grid-template-rows: auto;
}

.internship-apply-note {
	color: var(--text-dark);
	font-size: 24px;
	font-weight: 500;
	margin-top: 12px;
	margin-bottom: 40px;
	text-align: center;
}

.internship-schedule-content {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-8);
	padding-left: 28px;
}

.internship-schedule-label {
	align-items: center;
	display: flex;
	gap: var(--spacing-8);
}

.internship-schedule-label h4 {
	color: var(--text-dark);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
}

.internship-schedule-list {
	counter-reset: internship-schedule;
	gap: var(--spacing-8);
	list-style: none;
	margin: 0;
	padding-left: 28px;
}

.itmt-list .internship-schedule-item {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-8);
	margin-bottom: 0;
	padding-left: 24px;
}

.itmt-list .internship-schedule-item::before {
	background: none;
	border-radius: 0;
	color: var(--text-dark);
	content: counter(internship-schedule) ".";
	counter-increment: internship-schedule;
	font-size: 18px;
	font-weight: 500;
	height: auto;
	left: 0;
	top: 0;
	transform: none;
	width: auto;
}

.internship-schedule-text {
	display: inline-flex;
	line-height: 1.7;
}

.internship-schedule-chip {
	font-size: 14px;
	line-height: 1.5;
}

.internship-share-card .ma-pic {
	object-fit: cover;
}

.internship-life-inner {
	margin-top: var(--spacing-40);
}

.internship-life-gallery {
	display: grid;
	gap: var(--spacing-24);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.internship-life-image {
	aspect-ratio: 16 / 9;
	border-radius: var(--radius-16);
	margin: 0;
	overflow: hidden;
}

.internship-life-image img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* yuanta */

.else-item {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 8px;
}

.marketing-block .else-item {
	padding-left: 0;
}

.fintech-block {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--spacing-40);
	align-items: stretch;
	padding-left: 36px;
}

.data-block,
.marketing-block {
	align-items: stretch;
}

.data-block .itmt-list,
.marketing-block .itmt-list {
	flex-grow: 1;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 16px;
}

.list-title {
	font-size: 24px;
	font-weight: 700;
	display: flex;
	align-items: center;
	gap: var(--spacing-8);
	color: var(--primary);
}

.list-title-chip {
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1.5;
}

.list-item {
	justify-content: flex-start;
	gap: var(--spacing-12);
}

.data-block .itmt-list li,
.marketing-block .itmt-list li {
	padding-left: 24px;
}

.data-block .itmt-list li::before,
.marketing-block .itmt-list li::before {
	left: 0;
}

.data-block .itmt-list li:last-child,
.marketing-block .itmt-list li:last-child {
	margin-bottom: 0;
}

.job-item {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-24);
}

.apply-btn {
	width: fit-content;
	margin: var(--spacing-40) auto 0;
}

.apply-btn:has(.internship-apply-availability:not([hidden])) {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-8);
}

.main-button-m.is-disabled {
	width: 264px;
	min-height: 59px;
	background: #C4C4C4;
	color: #4F4F4F;
	opacity: 0.3;
	cursor: not-allowed;
}

.apply-btn:has(.main-button-m.is-disabled) {
	cursor: not-allowed;
}

.main-button-m.is-disabled:hover,
.main-button-m.is-disabled:active {
	transform: none;
	filter: none;
	box-shadow: none;
}

.internship-apply-availability {
	color: var(--helper-text);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
}

.apply-btn[hidden],
.main-button-m[hidden],
.internship-apply-availability[hidden],
.fixed-button[hidden] {
	display: none !important;
}

.submit-btn {
	margin-top: 12px;
}

.intro-pioneer .SubTitle br {
	display: none;
}

.itmt-grid {
	display: grid;
	grid-template-columns: repeat(4, auto);
	grid-template-rows: repeat(1, auto);
	gap: var(--spacing-16);
}

.itmt-list p {
	font-size: 18px;
	font-weight: 500;
	padding-left: 28px;
	margin-bottom: 12px;
}

.itmt-job-before-list {
	font-size: 18px;
	font-weight: 500;
	padding-left: 28px;
	margin-bottom: 12px;
}

.intro-pioneer .Title br,
.trainee-intro br,
.trainee-hiring br {
	display: none;
}

.internship-apply {
	padding-top: var(--spacing-32);
}

.separated-component {
	margin-top: var(--spacing-40);
}

.apply-item {
	gap: var(--spacing-12);
}


/* ===== join-section.css ===== */
.share,
.training,
.apply,
.FAQ,
.contactus,
.job-itmt {
	position: relative;
}

.Join-container {
	background-color: var(--white);
	padding: var(--spacing-64) 0px;
	background-image: url(../../IMG/BG_Elemnet/join-container_w.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.Join-Card {
	max-width: 1200px;
	margin: 0 auto;
	background-color: white;
	display: flex;
	flex-direction: column;
	padding: var(--spacing-40);
	border-radius: var(--radius-24);
	box-shadow: 0 0 24px 0 rgba(43, 51, 69, 0.10);
}

.Join-Content {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--spacing-40);
	background-color: var(--white);
}

.AboutUs {
	display: flex;
	gap: var(--spacing-40);
	align-items: center;
}

.AboutUs span {
	width: 100%;
	font-size: 18px;
}

.AboutUs a img {
	width: 20px;
	height: 20px;
	vertical-align: middle;
	margin-bottom: 4px;
}

.Join-Logo {
	width: 220px;
	height: 40px;
}

.Join-News {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	justify-content: space-around;
	gap: var(--spacing-24);
}

.News {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: var(--spacing-4);
	color: var(--text-dark);
	padding-right: var(--spacing-24);
	border-right: 1px solid var(--line);
}

.News-text {
	font-size: 20px;
	font-weight: 600;
	transition: var(--transition-color);
}

.News-text:hover {
	color: var(--secondary);
}

.News:nth-child(4n) {
	border-right: none;
}

.News span {
	font-weight: 500;
	color: #737373;
}


/* ===== browser-section.css ===== */
.browser {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100vh;
}

.browser .wrapper {
	margin-top: 80px;
}

.browser-logos {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
	margin-bottom: 0;
	background-color: var(--inner-background);
	padding: 32px 64px;
	border-radius: 24px;
}

.browser-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: var(--primary);
	font-size: 20px;
	font-weight: 600;
}

.browser-item img {
	width: 80px;
	height: 80px;
	margin-bottom: 12px;
	object-fit: contain;
}

/* Source: CSS/src/responsive.css */
/* ===== responsive-1439.css ===== */
@media (min-width: 1440px) and (max-width: 1599px) {
	.kv-slide-intern {
		background-image: url(../../IMG/Banner/Intern_1600.webp);
	}
}

@media (max-width: 1439px) {

	.KV{
		margin-top: 64px;
	}

	.kv-carousel {
		height: auto;
		aspect-ratio: 12 / 5;
	}

	.point-container p br {
		display: none;
	}

	.train-word br {
		display: none;
	}

	.internship-system-section .train-item br {
		display: none;
	}

	.accordion-label {
		padding: var(--spacing-24) 80px 24px 32px;
	}

	.feature-itmt .chip {
		font-size: clamp(14px, 1.1vw, 16px);
	}

	.itmt-grid {
		grid-template-columns: repeat(2, auto);
		grid-template-rows: repeat(2, auto);
	}
}


/* ===== responsive-1279.css ===== */
@media (max-width: 1279px) {

	.skill-text br {
		display: none;
	}

	.Join-container {
		padding: var(--spacing-40) 32px;
	}

	.contactus .wrapper {
		padding: 60px 40px 26px 40px;
	}

	.train-text p {
		font-size: 18px;
	}

	.ma-video {
		flex-direction: column;
	}

	.responsive-video {
		width: 100%;
		flex-basis: auto;
		padding-bottom: 56%;
	}

	.time-item {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
	}

	.feature-itmt .chip {
		font-size: clamp(12px, 1.1vw, 16px);
	}

	.slogan-wrapper {
		padding: var(--spacing-60) 0px;
	}
}


/* ===== responsive-1023.css ===== */
@media (max-width: 1023px) {

	.kv-control {
		width: 32px;
		height: 32px;
		background-size: 16px 16px;
	}

	.itmt-list {
		grid-template-columns: repeat(1, 1fr);
	}

	.custom-list li,
	.itmt-list li {
		font-size: 18px;
	}

	.fintech-block {
		grid-template-columns: 1fr;
		gap: var(--spacing-24);
	}

	.Join-News {
		width: 100%;
		grid-template-columns: repeat(1, 1fr);
		gap: var(--spacing-16);
	}

	.AboutUs {
		width: 100%;
		align-items: center;
		gap: var(--spacing-16);
		flex-direction: column;
	}

	.News {
		padding-bottom: 16px;
		border-right: none;
		border-bottom: 1px solid var(--line);
		padding-right: 0;
	}

	.News:nth-child(4n) {
		border-bottom: none;
		padding-bottom: 0;
	}

	.FeatureCard {
		gap: var(--spacing-8);
	}

	.PointBlock {
		grid-template-columns: repeat(3, 1fr);
		padding: 0;
	}

	.train-mentor {
		width: 100%;
		gap: var(--spacing-16);
	}

	.Step1,
	.Step2 {
		padding: var(--spacing-24) 16px;
	}

	.ma-pic {
		margin: 0;
	}

	.card-title {
		gap: var(--spacing-12);
	}

	.ma-life {
		gap: var(--spacing-24);
	}

	.video-title p {
		margin-top: 0;
		margin-bottom: 0;
	}

	.date {
		padding: 8px;
	}

	.date-line {
		gap: 4px;
	}

	.date p {
		font-size: 18px;
	}

	.goright {
		width: 10px;
		height: 14px;
		margin: 0 auto;
	}

	.event {
		padding: var(--spacing-24);
		gap: var(--spacing-24);
	}

	.event-name p {
		font-size: 18px;
	}

	.hiring-title {
		font-size: 24px;
	}

	.contactus .wrapper {
		padding: var(--spacing-32) 32px 26px 32px;
	}

	.name-link {
		justify-content: center;
	}

	.ma-card {
		width: 100%;
		flex-direction: column;
		text-align: center;
		justify-content: flex-start;
	}

	.apply-time {
		font-size: 20px;
	}

	.local-marker {
		font-size: 24px;
	}

	.browser-logos {
		grid-template-columns: repeat(2, 1fr);
		gap: 24px;
	}

	.slogan-wrapper {
		padding: var(--spacing-24);
		background-size: contain;
		font-size: 32px;
	}

	.slogan-wrapper br {
		display: none;
	}

	.slogan {
		background-image: var(--slogan-bg-mobile);
	}

	.separated-label {
		padding: 10px 12px;
		font-size: 18px;
	}
}


/* ===== responsive-959.css ===== */
@media (max-width: 959px) {
	.card-block {
		flex-direction: column;
	}

	.school-grid {
		gap: var(--spacing-16);
		grid-template-columns: 1fr;
	}

	.feature-itmt .chip {
		font-size: clamp(12px, 3.5vw, 16px);
	}
}


/* ===== responsive-767.css ===== */
@media (max-width: 767px) {
	.desktop-break {
		display: none;
	}

	.internship-apply-note {
		font-size: 20px;
	}

	.contactus::before,
	.internship-faq-section::before {
		-webkit-mask-image: url(../../IMG/BG_Elemnet/dot-bg_M.svg);
		mask-image: url(../../IMG/BG_Elemnet/dot-bg_M.svg);
	}

	.contactus .wrapper {
		padding: 32px 16px 26px 16px;
		margin-top: var(--spacing-32);
	}

	.contactus .card-style {
		padding: var(--spacing-24) 16px;
	}

	.slogan {
		min-height: 0;
		margin: 32px 0px;
	}

	.slogan-wrapper {
		height: auto;
		padding: var(--spacing-24);
		background-size: contain;
		font-size: 24px;
	}

	.apply-line {
		flex-direction: column;
		gap: 4px;
	}

	.apply-btn {
		width: 100%;
	}

	.apply-btn .main-button-m {
		width: 100%;
	}

	.job-item {
		flex-direction: column;
	}

	.KV {
		margin-top: 58px;
	}

	.kv-carousel {
		height: auto;
		aspect-ratio: 360 / 386;
	}

	.kv-slide-primary {
		background-image: url(../../IMG/Banner/KV_360.webp);
	}

	.kv-slide-secondary {
		background-image: url(../../IMG/Banner/ITMT_360.webp);
	}

	.kv-slide-intern {
		background-image: url(../../IMG/Banner/Intern_360.webp);
	}

	.kv-control {
		width: 32px;
		height: 32px;
		background-size: 16px 16px;
	}

	.kv-control-prev {
		left: 16px;
	}

	.kv-control-next {
		right: 16px;
	}

	.kv-control span {
		display: none;
	}

	.kv-pagination {
		top: calc(100% + 16px);
		gap: 10px;
	}

	.kv-dot {
		width: 12px;
		height: 12px;
	}

	.kv-dot.is-active {
		width: 24px;
	}

	.Join-Logo {
		width: 160px;
		height: auto;
	}

	.Join-container {
		padding: var(--spacing-32) 16px;
	}

	.separated-component {
		margin-top: var(--spacing-32);
	}

	.separated-label {
		padding: 8px 6px;
	}

	.separated-grid {
		gap: 6px;
	}

	.share .separated-grid {
		display: flex;
		flex-wrap: wrap;
	}

	.video-grid.separated-grid {
		display: grid !important;
		grid-template-columns: repeat(3, 1fr) !important;
	}

	.activity-block .separated-grid,
	.job-itmt .separated-grid {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
	}

	.Join-News {
		gap: var(--spacing-16);
	}

	.News {
		gap: 0;
	}

	.News span {
		font-size: 14px;
	}

	.FeatureCard {
		gap: var(--spacing-8);
	}

	.number {
		gap: 4px;
	}

		.card-block {
			gap: var(--spacing-16);
		}

	.ma-grid {
		grid-template-columns: 1fr;
		gap: var(--spacing-40);
	}

	.PointBlock {
		margin-top: var(--spacing-24);
		margin-bottom: 0;
		gap: var(--spacing-8);
	}

	.point-number {
		padding-right: 8px;
	}

		.metric-value {
			font-size: clamp(28px, 8vw, 48px);
		}

		.point-number p {
			font-size: clamp(11px, 3.1vw, 48px);
			text-align: center;
		}

		.point-number .number .metric-unit {
			font-size: clamp(14px, 4vw, 18px);
			margin-bottom: 2px;
			margin-left: 4px;
		}

		.metric-suffix {
			font-size: 18px;
			top: -6px;
			right: -14px;
		}

	.train-mentor {
		flex-direction: column;
	}

	.train-pic {
		width: 64px;
	}

	.train-card {
		padding: 16px 24px;
		gap: 0;
	}

	.train-item p {
		font-size: 18px;
	}

		.StepBlock {
			flex-direction: column;
		}

		.Step1,
		.Step2 {
			width: 100%;
		}

		.chip-line {
			gap: 4px;
	}

	.chip {
		font-size: clamp(12px, 3.5vw, 16px);
		padding: 4px 8px;
	}

	.ma-life {
		margin-top: var(--spacing-40);
		grid-template-columns: 1fr;
	}

	.ma-card{
		gap: var(--spacing-12);
	}

	.card-content{
		gap: var(--spacing-4);
	}

	.ma-pic {
		margin: 0 auto;
		width: 160px;
		height: 160px;
	}

	.ma-intro {
		text-align: left;
	}

	.card-title {
		gap: var(--spacing-12);
	}

	.date-line {
		flex-direction: column;
		gap: var(--spacing-8);
	}

	.card-content p {
		font-size: 18px;
	}

	.ma-video {
		padding: 0;
		flex: 1;
	}

	.skill-text {
		text-align: left;
	}

	.reaserch-image {
		max-width: none;
		width: 100%;
	}

	.StepBlock h3 {
		font-size: 20px;
	}

	.video-content h3 {
		font-size: 20px;
	}

	/* apply */

	.apply-title {
		margin-bottom: 0;
	}

	.apply-item {
		text-align: center;
	}

	.local-item h3 {
		font-size: 20px;
	}

	.itmt-text br {
		display: none;
	}

	.date {
		width: auto;
		padding: 8px 0;
	}

		.apply-date {
			flex-direction: column;
			align-items: center;
			gap: 4px;
		}

		.apply-date span {
			margin-top: 0;
		}

	.custom-list {
		margin-top: 12px;
	}



	.apply-item span {
		margin-top: 10px;
	}

	.goright {
		rotate: 90deg;
	}

	.dead-line {
		font-size: 28px;
	}

	.custom-list li {
		margin-bottom: 6px;
	}

	.date p br {
		display: none;
	}

	/* activity*/

	.event {
		flex-direction: column;
		padding: var(--spacing-24) 16px;
		gap: var(--spacing-24);
	}



	.list-title {
		font-size: 20px;
	}

	.hiring-title {
		margin-bottom: 0;
	}

	.internship-system-section .block-title {
		margin-bottom: var(--spacing-24);
	}

	.internship-system-section .Title,
	.internship-faq-section .Title {
		font-size: 32px;
		letter-spacing: 1.6px;
	}

	.internship-system-section .card-style {
		gap: var(--spacing-32);
		padding: var(--spacing-24);
	}

	.internship-life-gallery {
		grid-template-columns: 1fr;
	}

	.event-name {
		width: 100%;
	}

	.event-time {
		gap: 0;
		padding-left: 32px;
	}

	.time-item {
		flex-direction: column;
		align-items: flex-start;
	}

	.section {
		width: 100%;
	}

	.local-item {
		margin-top: 4px;
	}

	/* accordion */

	.accordion-label {
		font-size: 20px;
		gap: var(--spacing-8);
		padding: var(--spacing-24) 56px var(--spacing-24) 20px;
	}

	.accordion-content p {
		padding: var(--spacing-24) 40px 32px 48px
	}

	.accordion-label::after {
		top: 28px;
		right: 16px;
	}

	.accordion-item .Item {
		margin-top: 3px;
	}

	.accordion-input:checked+.accordion-label+.accordion-content {
		max-height: 800px;
	}

	.local-marker {
		font-size: 24px;
	}

	.intro-pioneer .SubTitle br {
		display: block;
	}

	.itmt-grid {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		gap: var(--spacing-16);
	}

	.chart-text {
		margin-top: var(--spacing-16);
	}

	.trainee-intro br,
	.trainee-hiring br {
		display: block;
	}

	.event-line {
		transform: rotate(180deg);
		width: 100%;
		height: 1px;
	}

	.browser-logos {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.browser-item {
		padding: 32px 20px;
	}

	.browser-item img {
		width: 64px;
		height: 64px;
	}

	.browser-item p {
		font-size: 18px;
	}

	.browser .wrapper {
		margin-top: 58px;
	}

	.browser .footer {
		padding-bottom: 0;
	}

	.internship-apply .block-title {
		gap: var(--spacing-12);
	}

	.internship-title-availability {
		flex-wrap: wrap;
		gap: 8px var(--spacing-12);
		font-size: 16px;
		white-space: normal;
	}
}


/* ===== responsive-640.css ===== */
/* Slightly reduce button size on small screens */
@media (max-width: 640px) {
	.video-cover-wrapper::after {
		width: 52px;
		height: 34px;
		border-radius: 7px;
		background-size: 42%;
	}
}


/* ===== responsive-500.css ===== */
@media (max-width: 500px) {
	.internship-title-mobile-break {
		display: block;
	}
}


/* ===== responsive-469.css ===== */
@media (max-width: 469px) {
	.school-time {
		gap: 0;
	}

	.intro-pioneer .Title br {
		display: block;
	}
}


/* ===== responsive-360.css ===== */
@media (max-width: 360px) {
	.internship-title-availability {
		flex-direction: column;
	}
}