@font-face {
    font-family: 'HarmonyOS_Sans_Thin';
    src: url('../fonts/HarmonyOS_Sans_Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
.section-bg {position:absolute;top: -54px;left:0;width:100%;display: none;}

.career-kv { position:relative;}
.career-kv-text {position:absolute;top: 42%;left: 16%;font-size:calc(100vw * 48 / 1920);color:#FFF;font-weight: 300;}
.career-text {position:absolute;top: 20%;left: 11%;color:#FFF;}
.career-text h2 {font-size:calc(100vw * 42 / 1920);font-weight: 300;margin-bottom: 5vw;letter-spacing: 5px;}
.career-text p {font-size:calc(100vw * 36 / 1920);font-weight:250;padding-bottom: 0.6vw;}
.career-text h1 { position:relative; font-size:calc(100vw * 64 / 1920);}
.career-kv-text:before {content:'';position:absolute;width:12.5vw;height:12.5vw;background:url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQyIiBoZWlnaHQ9IjI0MiIgdmlld0JveD0iMCAwIDI0MiAyNDIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTI0MSA4OFYxSDFWMjQxLjVIMjQxVjE0NyIgc3Ryb2tlPSJ3aGl0ZSIvPjwvc3ZnPg==');background-size: contain;top: 50%;transform: translateY(-50%);left: -5.8vw;}

.career-teaser1 {padding: 5vw 0;position: relative;width: 80%;margin: auto;display: flex;justify-content: space-between;}
.career-teaser1 h1 {/* text-align: center; */font-size: calc(100vw * 42 / 1920);width: 50%;}
.career-teaser1 .p1 {width: 50%;}
.career-teaser1 h2 {font-size: calc(100vw * 36 / 1920);line-height: 1.34;letter-spacing: 4px;padding-bottom: 2vw;}
.career-teaser1 p {font-size: calc(100vw * 20 / 1920);line-height: 1.6;padding-bottom: 2vw;}
.career-teaser1 .p2 {position:absolute;right:0;bottom: 2.2vw;}

.career-teaser2 {width: 100%;margin:auto;position:relative;}
.career-teaser2 .text {position:absolute;top:50%;left: 2.4%;transform: translateY(-50%);display:flex;flex-direction: column;color: #FFF;font-weight:300;gap: 1.2vw;}
.career-teaser2 .text p {display:flex;flex-direction: column;}
.career-teaser2 .text span {font-size: calc(100vw * 20 / 1920);}
.career-teaser2 .text .a1 {font-size: calc(100vw * 36 / 1920);line-height: 1;display: flex;align-items: baseline;}
.career-teaser2 .text .a1 i {font-size: 5.6vw;}

.career-teaser3 {width: 60%;margin: auto auto 5vw auto;display:flex;justify-content: space-between;min-width: 1000px;}
.career-teaser3 .career-item {display:flex;gap: 1%;flex-direction: column;justify-content: center;width: 300px;height: 300px;border: 1px solid #84868A;}
.career-teaser3 .career-item .a1 { text-align: center; font-size:calc(100vw * 16 / 1920);}
.career-teaser3 .career-item .a2 { text-align: center; font-size:calc(100vw * 40 / 1920)!important;}
.career-teaser3 .career-item .a2 span {font-size: calc(100vw * 80 / 1920);letter-spacing: -3px;font-family:"HarmonyOS_Sans_Thin";margin-right: 7px;font-weight: 500;}
.career-teaser3 .career-item:last-child .a2 { text-align: center; font-size:calc(100vw * 20 / 1920);}

.career-teaser4 {width:92%;margin:auto;padding-top: 5vw;}
.career-teaser4 h1 {text-align: center;font-size: calc(100vw * 42 / 1920);padding-bottom: 4.2vw;}
.career-teaser4 .p1 {display:flex;flex-wrap: wrap;justify-content: space-between;gap: 1rem;}
.career-teaser4 .p1 .career-item {width: calc(33% - 0.5rem);position: relative;color: #FFF;}
.career-teaser4 .p1 .career-item .career-item-text {position:absolute;top: 7%;left: 4%;width: 92%;height: 86%;display: flex;flex-direction: column;justify-content: space-between;}
.career-teaser4 .p1 .career-item .career-item-text h2 {font-size: calc(100vw * 36 / 1920);}
.career-teaser4 .p1 .career-item .career-item-text p {font-size: calc(100vw * 20 / 1920);letter-spacing: 1px;}

.career-teaser5 {width:92%;margin:auto;padding: 5vw 0;text-align: center;}
.career-teaser5 .con02 { position:relative;}
.career-teaser5 .con02 .text01 { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}

.careerSwiper { height:100vh;}
.careerSwiper img { position:relative; top:50%; transform:translateY(-50%);}
.careerSwiper .culture-text {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:78%;color: #FFF;}
.careerSwiper .culture-text h2 {font-size: calc(100vw * 36 / 1920);font-weight: 250;}
.careerSwiper .culture-text h1 {font-size: calc(100vw * 64 / 1920);display: flex;justify-content: space-between;padding-bottom: 2vw;}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {bottom:10%;text-align: left;left: 11%;width: auto;}
.swiper-pagination-bullet{background:none;opacity:1;margin:0 6px;width: 8px;height: 8px;position:relative;outline:none;vertical-align:middle;transition-duration: 0.3s; transition-timing-function:linear;}
.swiper-pagination-bullet:before { content:''; position:absolute; top:0; left:0; width:100%; height:100%; border-radius: 4px; background:rgba(255,255,255,0.3);}
.swiper-pagination-bullet span{ width: 8px; height: 8px; background:transparent; display:block; border-radius:50%;}
.swiper-pagination-bullet i{ background:rgba(255,255,255,0.3);height:8px; width:100%; border-radius:4px; position:absolute; top:0; z-index:3;}
.swiper-pagination-bullet-active { width:96px;}
.swiper-pagination-bullet-active i{	background:rgba(255,255,255,1); animation:middle 9s;}
.swiper-pagination-bullet:first-child.swiper-pagination-bullet-active i{ animation:first 8s;}
.swiper-pagination-bullet:last-child.swiper-pagination-bullet-active i{	animation:last 9s;}	

@media only screen and (max-width: 1440px){
	
	
}
@media only screen and (max-width: 1024px) and (orientation: portrait),only screen and (max-width: 768px){
    .sections h2 {font-size: 24px;}
    
    .career-kv { margin-top:54px;}
	.career-kv-text {margin-left: auto;left:10%;width: 80%;text-align: center;top: 24%;}
    .career-kv-text h1 {font-size: 32px;letter-spacing: 11px;}
	.career-kv-text:before { content:none;}

    .career-teaser1 {padding: 2rem 0 3.6rem;display: flex;flex-direction: column;}
    .career-teaser1 h1 {font-size: 28px;text-align: center;width: 100%;}

    .career-teaser1 .p1 {padding: 2rem 0 0;width: 100%;}
    .career-teaser1 h2 {line-height: 1.6;padding-bottom: 1.6rem;display: none;}
    .career-teaser1 p {font-size:14px;line-height: 2.2;text-align: center;padding-bottom: 1rem;}
    .career-teaser1 .p2 { display:none;}

    .career-teaser2 {display:flex;flex-direction: column-reverse;}
    .career-teaser2 .text {position: relative;width:100%;color: #002A39;transform: translate(0px, 0px);top: auto;left: auto;display: block;flex-wrap: wrap;gap: 0;flex-direction: row;}
    .career-teaser2 .text:after{clear:both;content:"";display:block;height:0;visibility:hidden;}
    .career-teaser2 .text span {font-size: 12px;}
    .career-teaser2 .text .a1 { font-size:18px;}
    .career-teaser2 .text .a1 i {font-size: 3.6rem;letter-spacing: -2px;}
    .career-teaser2 .text p {width: 60%;float: left;padding: 0.4rem 0 1.2rem;}
    .career-teaser2 .text p:nth-child(3) {float:right;width: 35%;position: absolute;right: 0;}
    .career-teaser2 .text p:nth-child(4) {float:right;width: 35%;}

    .career-teaser3 {margin-top: 1rem;gap: 1rem;display: flex;flex-direction: column;align-items: center;min-width: auto;}
    .career-teaser3 .career-item {width: 160px;height: 160px;gap: 0;}
    .career-teaser3 .career-item .a1 { font-size:12px;}
    .career-teaser3 .career-item .a2 { font-size:20px!important;}
    .career-teaser3 .career-item .a2 span {font-size:40px;}
    .career-teaser3 .career-item:last-child .a2 {font-size: 12px!important;}

    .career-teaser4 {padding-top: 2rem;}
    .career-teaser4 h1 {font-size: 28px;padding-bottom: 1.6rem;}
    .career-teaser4 .p1 { gap:0.6rem;}
    .career-teaser4 .p1 .career-item { width:100%;}
    .career-teaser4 .p1 .career-item .career-item-text {top:10%;left: 5%;width: 90%;height: 70%;}
    .career-teaser4 .p1 .career-item .career-item-text h2 {font-size: 24px;}
    .career-teaser4 .p1 .career-item .career-item-text p {font-size: 12px;}

    .career-teaser5 {padding: 2rem 0 4rem;}

    .careerSwiper {height: 100%;margin-top: 5rem;}
    .careerSwiper img { top:0; transform:translateY(0%);}
    .careerSwiper .culture-text {top: 10%;transform: translate(-50%, 0);}
    .careerSwiper .culture-text h2 {font-size: 20px;text-align: center;padding-bottom: 6rem;}
    .careerSwiper .culture-text h1 {display:flex;flex-direction: column;font-size: 36px;text-align: center;}
    .careerSwiper .culture-text p { text-align: center;}

    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {bottom:4%;left: 50%;transform: translateX(-50%);}
}