@charset "UTF-8";
@font-face {
    font-family: "Kanit";
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url("../assets/fonts/Kanit-Bold-subset.woff2") format("woff2");
}

:root {
    --spc: 1;
    --u: calc(1px * var(--spc));
    --font-body: "Kanit",Tahoma,sans-serif;
    --c-bg: #000;
    --c-white: #fff;
    --c-reg-text: #783400;
    --c-focus: #ffd035;
}

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

html,
body,
h1,
h2,
h3,
p,
ul,
ol,
li,
figure {
    margin: 0;
    padding: 0;
}

h1,
h2,
h3 {
    font-size: inherit;
    font-weight: inherit;
}

ul,
ol {
    list-style: none;
}

img {
    display: block;
    max-width: none;
    border: 0;
}

video {
    display: block;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

a {
    display: block;
    color: inherit;
    text-decoration: none;
}

[hidden] {
    display: none !important;
}

html {
    background: var(--c-bg);
}

body {
    min-width: calc(1920 * var(--u));
    background: var(--c-bg);
    color: var(--c-white);
    font-family: var(--font-body);
    -webkit-font-smoothing: antialiased;
}

:focus-visible {
    outline: calc(3 * var(--u)) solid var(--c-focus);
    outline-offset: calc(2 * var(--u));
}

.u-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.l-page {
    position: relative;
    width: 100%;
}

.sec {
    position: relative;
    width: 100%;
}

.sec:focus {
    outline: none;
}

.sec__in {
    position: absolute;
    top: 0;
    left: 50%;
    width: calc(1920 * var(--u));
    height: 100%;
    margin-left: calc(-960 * var(--u));
}

.abs {
    position: absolute;
}

.abs > img,
.abs > a > img,
.abs > button > img {
    width: 100%;
    height: 100%;
}

@media (min-width: 1921px) {
    .sec__in,
    .l-events__bg {
        -webkit-mask-image: linear-gradient(to right,transparent 0,#000 60px,#000 calc(100% - 60px),transparent 100%);
        mask-image: linear-gradient(to right,transparent 0,#000 60px,#000 calc(100% - 60px),transparent 100%);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}


.sec--top {
    height: calc(1080 * var(--u));
}

.l-events {
    position: relative;
}

.l-events__bg {
    position: absolute;
    top: 0;
    left: 50%;
    width: calc(1920 * var(--u));
    height: calc(2091 * var(--u));
    margin-left: calc(-960 * var(--u));
}

.l-events__bg img {
    width: 100%;
    height: 100%;
}

.sec--event1 {
    height: calc(1080 * var(--u));
}
.sec--event1 .sec__in {
    top: calc(-22 * var(--u));
    height: calc(1102 * var(--u));
    border-top: calc(22 * var(--u)) solid transparent;
}

.sec--event2 {
    height: calc(1011 * var(--u));
}

.sec--boss {
    height: calc(1767 * var(--u));
}

.sec--class3 {
    height: calc(1080 * var(--u));
}

.hero__bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reg__go,
.reg__done {
    width: 100%;
    height: 100%;
}

.reg__done {
    display: none;
    position: relative;
}

.reg.is-done .reg__go {
    display: none;
}

.reg.is-done .reg__done {
    display: block;
}

.reg__base {
    position: absolute;
    left: calc(1 * var(--u));
    top: calc(1 * var(--u));
    width: calc(369 * var(--u));
    height: calc(76 * var(--u));
    filter: grayscale(.35) brightness(.74);
}

.reg__text {
    position: absolute;
    left: 0;
    top: calc(14 * var(--u));
    width: 100%;
    font-family: var(--font-body);
    font-weight: 700;
    font-size: calc(36.65 * var(--u));
    line-height: calc(44 * var(--u));
    text-align: center;
    color: var(--c-reg-text);
    -webkit-text-stroke: calc(2 * var(--u)) rgba(255,255,255,.9);
    paint-order: stroke fill;
    transform: scaleY(.9);
    white-space: nowrap;
    cursor: default;
}

.job__panel {
    position: absolute;
    inset: 0;
}

.job__panel.is-anim {
    animation: th3-fade .2s ease-out;
}

@keyframes th3-fade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.job__pic--f,
.sec--class3 .sec__in.is-female .job__pic--m {
    display: none;
}

.sec--class3 .sec__in.is-female .job__pic--f {
    display: block;
}

.job__info {
    z-index: 1;
}

.job__skill {
    z-index: 2;
}

.job__pic {
    z-index: 3;
}

.job__genders,
.job__tabs {
    position: relative;
    z-index: 4;
}

.c3__badge {
    z-index: 4;
}

.job__tab img {
    position: absolute;
}

.job__tab .job__tab-off {
    left: calc(2 * var(--u));
    top: calc(2 * var(--u));
    width: calc(85 * var(--u));
    height: calc(94 * var(--u));
}

.job__tab .job__tab-on {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.job__tab[aria-selected="true"] .job__tab-off {
    opacity: 0;
}

.job__tab[aria-selected="true"] .job__tab-on {
    opacity: 1;
}

.fixed {
    position: fixed;
    top: 0;
    left: max(0px, calc(50% - 960 * var(--u)));
    z-index: 10;
    width: calc(1920 * var(--u));
    height: 0;
}

.nav__bar {
    display: none;
}

.nav__bar--normal,
.fixed__nav[data-current="event1"] .nav__bar--event1,
.fixed__nav[data-current="event2"] .nav__bar--event2,
.fixed__nav[data-current="boss"] .nav__bar--boss,
.fixed__nav[data-current="class3"] .nav__bar--class3 {
    display: block;
}

.fixed__nav[data-current] .nav__bar--normal {
    display: none;
}

.hero__bg {
    left: calc(0 * var(--u));
    top: calc(0 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(1080 * var(--u));
}

.hero__title {
    left: calc(453 * var(--u));
    top: calc(622 * var(--u));
    width: calc(1093 * var(--u));
    height: calc(272 * var(--u));
}

.hero__btn--site {
    left: calc(507 * var(--u));
    top: calc(911 * var(--u));
    width: calc(253 * var(--u));
    height: calc(69 * var(--u));
}

.hero__btn--event1 {
    left: calc(842 * var(--u));
    top: calc(911 * var(--u));
    width: calc(253 * var(--u));
    height: calc(69 * var(--u));
}

.hero__btn--class3 {
    left: calc(1160 * var(--u));
    top: calc(911 * var(--u));
    width: calc(253 * var(--u));
    height: calc(69 * var(--u));
}

.ev1__art {
    left: calc(0 * var(--u));
    top: calc(-22 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(1080 * var(--u));
}

.ev1__detail {
    left: calc(894 * var(--u));
    top: calc(772 * var(--u));
    width: calc(133 * var(--u));
    height: calc(16 * var(--u));
}

.reg {
    left: calc(776 * var(--u));
    top: calc(827 * var(--u));
    width: calc(371 * var(--u));
    height: calc(78 * var(--u));
}

.ev2__art {
    left: calc(340 * var(--u));
    top: calc(114 * var(--u));
    width: calc(1196 * var(--u));
    height: calc(906 * var(--u));
}

.ev2__detail {
    left: calc(841 * var(--u));
    top: calc(734 * var(--u));
    width: calc(236 * var(--u));
    height: calc(34 * var(--u));
}

.ev2__buy {
    left: calc(783 * var(--u));
    top: calc(775 * var(--u));
    width: calc(357 * var(--u));
    height: calc(98 * var(--u));
}

.boss__bg {
    left: calc(0 * var(--u));
    top: calc(0 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(1768 * var(--u));
}

.c3__bg {
    left: calc(0 * var(--u));
    top: calc(0 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(1080 * var(--u));
}

.c3__badge {
    left: calc(1236 * var(--u));
    top: calc(627 * var(--u));
    width: calc(284 * var(--u));
    height: calc(76 * var(--u));
}

.job__gender--m {
    left: calc(397 * var(--u));
    top: calc(662 * var(--u));
    width: calc(42 * var(--u));
    height: calc(42 * var(--u));
}

.job__gender--f {
    left: calc(452 * var(--u));
    top: calc(662 * var(--u));
    width: calc(42 * var(--u));
    height: calc(42 * var(--u));
}

.fixed__logo {
    left: calc(65 * var(--u));
    top: calc(96 * var(--u));
    width: calc(246 * var(--u));
    height: calc(251 * var(--u));
}

.fixed__presale {
    left: calc(65 * var(--u));
    top: calc(391 * var(--u));
    width: calc(227 * var(--u));
    height: calc(227 * var(--u));
}

.fixed__sns-fb {
    left: calc(1721 * var(--u));
    top: calc(290 * var(--u));
    width: calc(39 * var(--u));
    height: calc(40 * var(--u));
}

.fixed__sns-yt {
    left: calc(1721 * var(--u));
    top: calc(340 * var(--u));
    width: calc(39 * var(--u));
    height: calc(40 * var(--u));
}

.nav__bar--normal {
    left: calc(1726 * var(--u));
    top: calc(390 * var(--u));
    width: calc(139 * var(--u));
    height: calc(298 * var(--u));
}

.nav__bar--event1,
.nav__bar--event2,
.nav__bar--boss {
    left: calc(1723 * var(--u));
    top: calc(390 * var(--u));
    width: calc(142 * var(--u));
    height: calc(298 * var(--u));
}

.nav__bar--class3 {
    left: calc(1723 * var(--u));
    top: calc(390 * var(--u));
    width: calc(182 * var(--u));
    height: calc(298 * var(--u));
}

.nav__item {
    left: calc(1723 * var(--u));
    width: calc(182 * var(--u));
    height: calc(40 * var(--u));
}

.nav__item--event1 {
    top: calc(423 * var(--u));
}

.nav__item--event2 {
    top: calc(485 * var(--u));
}

.nav__item--boss {
    top: calc(546 * var(--u));
}

.nav__item--class3 {
    top: calc(607 * var(--u));
}

.job__tab--crusader_knight {
    left: calc(1172 * var(--u));
    top: calc(182 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--crusader_knight .job__pic--m {
    left: calc(737 * var(--u));
    top: calc(184 * var(--u));
    width: calc(374 * var(--u));
    height: calc(613 * var(--u));
}

.job__panel--crusader_knight .job__pic--f {
    left: calc(705 * var(--u));
    top: calc(198 * var(--u));
    width: calc(457 * var(--u));
    height: calc(610 * var(--u));
}

.job__panel--crusader_knight .job__info {
    left: calc(356 * var(--u));
    top: calc(334 * var(--u));
    width: calc(390 * var(--u));
    height: calc(308 * var(--u));
}

.job__panel--crusader_knight .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--abyss_knight {
    left: calc(1271 * var(--u));
    top: calc(182 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--abyss_knight .job__pic--m {
    left: calc(675 * var(--u));
    top: calc(220 * var(--u));
    width: calc(499 * var(--u));
    height: calc(500 * var(--u));
}

.job__panel--abyss_knight .job__pic--f {
    left: calc(633 * var(--u));
    top: calc(169 * var(--u));
    width: calc(523 * var(--u));
    height: calc(614 * var(--u));
}

.job__panel--abyss_knight .job__info {
    left: calc(356 * var(--u));
    top: calc(330 * var(--u));
    width: calc(382 * var(--u));
    height: calc(312 * var(--u));
}

.job__panel--abyss_knight .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--sword_emperor {
    left: calc(1369 * var(--u));
    top: calc(182 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--sword_emperor .job__pic--m {
    left: calc(745 * var(--u));
    top: calc(244 * var(--u));
    width: calc(460 * var(--u));
    height: calc(462 * var(--u));
}

.job__panel--sword_emperor .job__pic--f {
    left: calc(767 * var(--u));
    top: calc(249 * var(--u));
    width: calc(358 * var(--u));
    height: calc(501 * var(--u));
}

.job__panel--sword_emperor .job__info {
    left: calc(356 * var(--u));
    top: calc(330 * var(--u));
    width: calc(406 * var(--u));
    height: calc(312 * var(--u));
}

.job__panel--sword_emperor .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--asura {
    left: calc(1468 * var(--u));
    top: calc(182 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--asura .job__pic--m {
    left: calc(745 * var(--u));
    top: calc(198 * var(--u));
    width: calc(413 * var(--u));
    height: calc(555 * var(--u));
}

.job__panel--asura .job__pic--f {
    left: calc(705 * var(--u));
    top: calc(252 * var(--u));
    width: calc(471 * var(--u));
    height: calc(448 * var(--u));
}

.job__panel--asura .job__info {
    left: calc(356 * var(--u));
    top: calc(350 * var(--u));
    width: calc(382 * var(--u));
    height: calc(292 * var(--u));
}

.job__panel--asura .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--duelist {
    left: calc(1172 * var(--u));
    top: calc(287 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--duelist .job__pic--m {
    left: calc(784 * var(--u));
    top: calc(226 * var(--u));
    width: calc(372 * var(--u));
    height: calc(507 * var(--u));
}

.job__panel--duelist .job__pic--f {
    left: calc(796 * var(--u));
    top: calc(225 * var(--u));
    width: calc(321 * var(--u));
    height: calc(521 * var(--u));
}

.job__panel--duelist .job__info {
    left: calc(356 * var(--u));
    top: calc(340 * var(--u));
    width: calc(382 * var(--u));
    height: calc(302 * var(--u));
}

.job__panel--duelist .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--phantom_assassin {
    left: calc(1271 * var(--u));
    top: calc(287 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--phantom_assassin .job__pic--m {
    left: calc(743 * var(--u));
    top: calc(261 * var(--u));
    width: calc(426 * var(--u));
    height: calc(481 * var(--u));
}

.job__panel--phantom_assassin .job__pic--f {
    left: calc(744 * var(--u));
    top: calc(235 * var(--u));
    width: calc(414 * var(--u));
    height: calc(521 * var(--u));
}

.job__panel--phantom_assassin .job__info {
    left: calc(342 * var(--u));
    top: calc(317 * var(--u));
    width: calc(407 * var(--u));
    height: calc(325 * var(--u));
}

.job__panel--phantom_assassin .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--spirit_archer {
    left: calc(1369 * var(--u));
    top: calc(287 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--spirit_archer .job__pic--m {
    left: calc(765 * var(--u));
    top: calc(191 * var(--u));
    width: calc(361 * var(--u));
    height: calc(577 * var(--u));
}

.job__panel--spirit_archer .job__pic--f {
    left: calc(727 * var(--u));
    top: calc(257 * var(--u));
    width: calc(439 * var(--u));
    height: calc(466 * var(--u));
}

.job__panel--spirit_archer .job__info {
    left: calc(356 * var(--u));
    top: calc(321 * var(--u));
    width: calc(382 * var(--u));
    height: calc(321 * var(--u));
}

.job__panel--spirit_archer .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--arcane_gunslinger {
    left: calc(1468 * var(--u));
    top: calc(287 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--arcane_gunslinger .job__pic--m {
    left: calc(804 * var(--u));
    top: calc(198 * var(--u));
    width: calc(292 * var(--u));
    height: calc(554 * var(--u));
}

.job__panel--arcane_gunslinger .job__pic--f {
    left: calc(782 * var(--u));
    top: calc(216 * var(--u));
    width: calc(362 * var(--u));
    height: calc(530 * var(--u));
}

.job__panel--arcane_gunslinger .job__info {
    left: calc(356 * var(--u));
    top: calc(322 * var(--u));
    width: calc(407 * var(--u));
    height: calc(320 * var(--u));
}

.job__panel--arcane_gunslinger .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--master_chef {
    left: calc(1172 * var(--u));
    top: calc(393 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--master_chef .job__pic--m {
    left: calc(821 * var(--u));
    top: calc(196 * var(--u));
    width: calc(309 * var(--u));
    height: calc(565 * var(--u));
}

.job__panel--master_chef .job__pic--f {
    left: calc(788 * var(--u));
    top: calc(223 * var(--u));
    width: calc(342 * var(--u));
    height: calc(528 * var(--u));
}

.job__panel--master_chef .job__info {
    left: calc(346 * var(--u));
    top: calc(331 * var(--u));
    width: calc(430 * var(--u));
    height: calc(311 * var(--u));
}

.job__panel--master_chef .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--food_slayer {
    left: calc(1271 * var(--u));
    top: calc(393 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--food_slayer .job__pic--m {
    left: calc(746 * var(--u));
    top: calc(207 * var(--u));
    width: calc(389 * var(--u));
    height: calc(563 * var(--u));
}

.job__panel--food_slayer .job__pic--f {
    left: calc(820 * var(--u));
    top: calc(196 * var(--u));
    width: calc(336 * var(--u));
    height: calc(555 * var(--u));
}

.job__panel--food_slayer .job__info {
    left: calc(355 * var(--u));
    top: calc(325 * var(--u));
    width: calc(412 * var(--u));
    height: calc(317 * var(--u));
}

.job__panel--food_slayer .job__skill {
    left: calc(0 * var(--u));
    top: calc(709 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(371 * var(--u));
}

.job__tab--cryomancer {
    left: calc(1369 * var(--u));
    top: calc(393 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--cryomancer .job__pic--m {
    left: calc(826 * var(--u));
    top: calc(180 * var(--u));
    width: calc(260 * var(--u));
    height: calc(576 * var(--u));
}

.job__panel--cryomancer .job__pic--f {
    left: calc(809 * var(--u));
    top: calc(173 * var(--u));
    width: calc(300 * var(--u));
    height: calc(577 * var(--u));
}

.job__panel--cryomancer .job__info {
    left: calc(356 * var(--u));
    top: calc(330 * var(--u));
    width: calc(394 * var(--u));
    height: calc(312 * var(--u));
}

.job__panel--cryomancer .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}

.job__tab--pyromancer {
    left: calc(1468 * var(--u));
    top: calc(393 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--pyromancer .job__pic--m {
    left: calc(812 * var(--u));
    top: calc(182 * var(--u));
    width: calc(281 * var(--u));
    height: calc(563 * var(--u));
}

.job__panel--pyromancer .job__pic--f {
    left: calc(823 * var(--u));
    top: calc(173 * var(--u));
    width: calc(296 * var(--u));
    height: calc(588 * var(--u));
}

.job__panel--pyromancer .job__info {
    left: calc(356 * var(--u));
    top: calc(329 * var(--u));
    width: calc(393 * var(--u));
    height: calc(313 * var(--u));
}

.job__panel--pyromancer .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}

.job__tab--inquisitor {
    left: calc(1172 * var(--u));
    top: calc(498 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--inquisitor .job__pic--m {
    left: calc(799 * var(--u));
    top: calc(182 * var(--u));
    width: calc(273 * var(--u));
    height: calc(575 * var(--u));
}

.job__panel--inquisitor .job__pic--f {
    left: calc(827 * var(--u));
    top: calc(176 * var(--u));
    width: calc(263 * var(--u));
    height: calc(578 * var(--u));
}

.job__panel--inquisitor .job__info {
    left: calc(356 * var(--u));
    top: calc(330 * var(--u));
    width: calc(393 * var(--u));
    height: calc(312 * var(--u));
}

.job__panel--inquisitor .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}

.job__tab--saint {
    left: calc(1271 * var(--u));
    top: calc(498 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--saint .job__pic--m {
    left: calc(804 * var(--u));
    top: calc(201 * var(--u));
    width: calc(304 * var(--u));
    height: calc(528 * var(--u));
}

.job__panel--saint .job__pic--f {
    left: calc(800 * var(--u));
    top: calc(182 * var(--u));
    width: calc(323 * var(--u));
    height: calc(568 * var(--u));
}

.job__panel--saint .job__info {
    left: calc(356 * var(--u));
    top: calc(328 * var(--u));
    width: calc(382 * var(--u));
    height: calc(314 * var(--u));
}

.job__panel--saint .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}

.job__tab--demolition_engineer {
    left: calc(1369 * var(--u));
    top: calc(498 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--demolition_engineer .job__pic--m {
    left: calc(771 * var(--u));
    top: calc(243 * var(--u));
    width: calc(416 * var(--u));
    height: calc(474 * var(--u));
}

.job__panel--demolition_engineer .job__pic--f {
    left: calc(792 * var(--u));
    top: calc(221 * var(--u));
    width: calc(354 * var(--u));
    height: calc(502 * var(--u));
}

.job__panel--demolition_engineer .job__info {
    left: calc(356 * var(--u));
    top: calc(333 * var(--u));
    width: calc(416 * var(--u));
    height: calc(309 * var(--u));
}

.job__panel--demolition_engineer .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}

.job__tab--master_craftsman {
    left: calc(1468 * var(--u));
    top: calc(498 * var(--u));
    width: calc(89 * var(--u));
    height: calc(98 * var(--u));
}

.job__panel--master_craftsman .job__pic--m {
    left: calc(793 * var(--u));
    top: calc(220 * var(--u));
    width: calc(303 * var(--u));
    height: calc(503 * var(--u));
}

.job__panel--master_craftsman .job__pic--f {
    left: calc(794 * var(--u));
    top: calc(232 * var(--u));
    width: calc(346 * var(--u));
    height: calc(491 * var(--u));
}

.job__panel--master_craftsman .job__info {
    left: calc(356 * var(--u));
    top: calc(314 * var(--u));
    width: calc(389 * var(--u));
    height: calc(328 * var(--u));
}

.job__panel--master_craftsman .job__skill {
    left: calc(0 * var(--u));
    top: calc(682 * var(--u));
    width: calc(1920 * var(--u));
    height: calc(398 * var(--u));
}