*,
:after,
:before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:
}

::-webkit-backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:
}

.container {
    width: 100%
}

@media (min-width:640px) {
    .container {
        max-width: 640px
    }
}

@media (min-width:768px) {
    .container {
        max-width: 768px
    }
}

@media (min-width:1024px) {
    .container {
        max-width: 1024px
    }
}

@media (min-width:1280px) {
    .container {
        max-width: 1280px
    }
}

@media (min-width:1536px) {
    .container {
        max-width: 1536px
    }
}

.pointer-events-none {
    pointer-events: none
}

.pointer-events-auto {
    pointer-events: auto
}

.visible {
    visibility: visible
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.right-6 {
    right: 1.5rem
}

.top-6 {
    top: 1.5rem
}

.z-\[-1\] {
    z-index: -1
}

.m-auto {
    margin: auto
}

.mx-0 {
    margin-left: 0;
    margin-right: 0
}

.mx-2 {
    margin-left: .5rem;
    margin-right: .5rem
}

.mx-5 {
    margin-left: 1.25rem;
    margin-right: 1.25rem
}

.mx-6 {
    margin-left: 1.5rem;
    margin-right: 1.5rem
}

.mx-\[96px\] {
    margin-left: 96px;
    margin-right: 96px
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.my-0 {
    margin-bottom: 0;
    margin-top: 0
}

.my-2 {
    margin-bottom: .5rem;
    margin-top: .5rem
}

.my-4 {
    margin-bottom: 1rem;
    margin-top: 1rem
}

.my-\[24px\] {
    margin-bottom: 24px;
    margin-top: 24px
}

.\!mr-4 {
    margin-right: 1rem !important
}

.-mb-1 {
    margin-bottom: -.25rem
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-\[24px\] {
    margin-bottom: 24px
}

.ml-1 {
    margin-left: .25rem
}

.ml-2 {
    margin-left: .5rem
}

.ml-6 {
    margin-left: 1.5rem
}

.ml-\[-10px\] {
    margin-left: -10px
}

.mr-1 {
    margin-right: .25rem
}

.mr-2 {
    margin-right: .5rem
}

.mr-6 {
    margin-right: 1.5rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-5 {
    margin-top: 1.25rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-\[16px\] {
    margin-top: 16px
}

.mt-\[24px\] {
    margin-top: 24px
}

.mt-\[30px\] {
    margin-top: 30px
}

.mt-\[52px\] {
    margin-top: 52px
}

.block {
    display: block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.table {
    display: table
}

.grid {
    display: grid
}

.hidden {
    display: none
}

.\!h-\[40px\] {
    height: 40px !important
}

.\!h-\[50px\] {
    height: 50px !important
}

.h-\[100vh\] {
    height: 100vh
}

.h-\[1px\] {
    height: 1px
}

.h-\[200px\] {
    height: 200px
}

.h-\[24px\] {
    height: 24px
}

.h-\[34px\] {
    height: 34px
}

.h-\[42px\] {
    height: 42px
}

.h-\[44px\] {
    height: 44px
}

.h-\[50px\] {
    height: 50px
}

.h-\[60px\] {
    height: 60px
}

.h-\[8px\] {
    height: 8px
}

.h-full {
    height: 100%
}

.h-screen {
    height: 100vh
}

.\!max-h-\[140px\] {
    max-height: 140px !important
}

.\!min-h-\[60px\] {
    min-height: 60px !important
}

.min-h-\[44px\] {
    min-height: 44px
}

.\!w-\[130px\] {
    width: 130px !important
}

.\!w-\[140px\] {
    width: 140px !important
}

.\!w-full {
    width: 100% !important
}

.w-2\/3 {
    width: 66.666667%
}

.w-\[100\%\] {
    width: 100%
}

.w-\[100px\] {
    width: 100px
}

.w-\[120px\] {
    width: 120px
}

.w-\[130px\] {
    width: 130px
}

.w-\[200px\] {
    width: 200px
}

.w-\[20px\] {
    width: 20px
}

.w-\[24px\] {
    width: 24px
}

.w-\[301\.25px\] {
    width: 301.25px
}

.w-\[305px\] {
    width: 305px
}

.w-\[367px\] {
    width: 367px
}

.w-\[400px\] {
    width: 400px
}

.w-\[418\.38px\] {
    width: 418.38px
}

.w-\[550px\] {
    width: 550px
}

.w-\[578px\] {
    width: 578px
}

.w-\[587px\] {
    width: 587px
}

.w-\[60px\] {
    width: 60px
}

.w-fit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.w-full {
    width: 100%
}

.w-max {
    width: -webkit-max-content;
    width: max-content
}

.\!min-w-\[140px\] {
    min-width: 140px !important
}

.\!min-w-\[300px\] {
    min-width: 300px !important
}

.\!min-w-\[80px\] {
    min-width: 80px !important
}

.min-w-\[100px\] {
    min-width: 100px
}

.min-w-\[140px\] {
    min-width: 140px
}

.min-w-\[150px\] {
    min-width: 150px
}

.min-w-\[170px\] {
    min-width: 170px
}

.min-w-\[200px\] {
    min-width: 200px
}

.min-w-\[300px\] {
    min-width: 300px
}

.min-w-\[313px\] {
    min-width: 313px
}

.min-w-\[63px\] {
    min-width: 63px
}

.min-w-\[70px\] {
    min-width: 70px
}

.min-w-\[96px\] {
    min-width: 96px
}

.\!max-w-\[180px\] {
    max-width: 180px !important
}

.max-w-\[1140px\] {
    max-width: 1140px
}

.max-w-\[13vw\] {
    max-width: 13vw
}

.max-w-\[250px\] {
    max-width: 250px
}

.max-w-\[317px\] {
    max-width: 317px
}

.max-w-\[373px\] {
    max-width: 373px
}

.max-w-\[517px\] {
    max-width: 517px
}

.max-w-\[565px\] {
    max-width: 565px
}

.max-w-\[7vw\] {
    max-width: 7vw
}

.grow {
    flex-grow: 1
}

.rotate-0 {
    --tw-rotate: 0deg
}

.rotate-0,
.rotate-180 {
    -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-180 {
    --tw-rotate: 180deg
}

.\!cursor-default {
    cursor: default !important
}

.cursor-not-allowed {
    cursor: not-allowed
}

.cursor-pointer {
    cursor: pointer
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.flex-row {
    flex-direction: row
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-col {
    flex-direction: column
}

.content-center {
    align-content: center
}

.items-start {
    align-items: flex-start
}

.items-center {
    align-items: center
}

.items-baseline {
    align-items: baseline
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.gap-2 {
    gap: .5rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-8 {
    gap: 2rem
}

.gap-\[167px\] {
    gap: 167px
}

.gap-\[20px\] {
    gap: 20px
}

.gap-x-2 {
    -webkit-column-gap: .5rem;
    column-gap: .5rem
}

.overflow-hidden {
    overflow: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.whitespace-pre-line {
    white-space: pre-line
}

.whitespace-pre-wrap {
    white-space: pre-wrap
}

.rounded-\[10px\] {
    border-radius: 10px
}

.border {
    border-width: 1px
}

.\!bg-\[\#F03D3E\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(240 61 62/var(--tw-bg-opacity)) !important
}

.bg-green {
    --tw-bg-opacity: 1;
    background-color: rgb(17 110 99/var(--tw-bg-opacity))
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.\!p-0 {
    padding: 0 !important
}

.p-0 {
    padding: 0
}

.p-2 {
    padding: .5rem
}

.p-3 {
    padding: .75rem
}

.p-5 {
    padding: 1.25rem
}

.p-6 {
    padding: 1.5rem
}

.p-\[40px\] {
    padding: 40px
}

.\!px-20 {
    padding-left: 5rem !important;
    padding-right: 5rem !important
}

.\!px-\[102px\] {
    padding-left: 102px !important;
    padding-right: 102px !important
}

.\!px-\[109px\] {
    padding-left: 109px !important;
    padding-right: 109px !important
}

.\!px-\[45px\] {
    padding-left: 45px !important;
    padding-right: 45px !important
}

.\!px-\[84\.25px\] {
    padding-left: 84.25px !important;
    padding-right: 84.25px !important
}

.\!px-\[85px\] {
    padding-left: 85px !important;
    padding-right: 85px !important
}

.\!px-\[88px\] {
    padding-left: 88px !important;
    padding-right: 88px !important
}

.width-120{
    width: 120px !important;
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.px-\[16px\] {
    padding-left: 16px;
    padding-right: 16px
}

.px-\[96px\] {
    padding-left: 96px;
    padding-right: 96px
}

.py-2 {
    padding-bottom: .5rem;
    padding-top: .5rem
}

.py-\[16px\] {
    padding-bottom: 16px;
    padding-top: 16px
}

.py-\[17px\] {
    padding-bottom: 17px;
    padding-top: 17px
}

.py-\[40px\] {
    padding-bottom: 40px;
    padding-top: 40px
}

.\!pr-0 {
    padding-right: 0 !important
}

.pb-1 {
    padding-bottom: .25rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pb-\[13px\] {
    padding-bottom: 13px
}

.pb-\[30px\] {
    padding-bottom: 30px
}

.pl-4 {
    padding-left: 1rem
}

.pl-\[30px\] {
    padding-left: 30px
}

.pr-4 {
    padding-right: 1rem
}

.pt-0 {
    padding-top: 0
}

.pt-\[14px\] {
    padding-top: 14px
}

.pt-\[24px\] {
    padding-top: 24px
}

.pt-\[30px\] {
    padding-top: 30px
}

.pt-\[50px\] {
    padding-top: 50px
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.align-sub {
    vertical-align: sub
}

.text-2xl {
    font-size: 20px;
    line-height: 28px;
}

.text-label-forgot-password {
    font-size: 1.5rem;
    line-height: 1.8rem;
    font-weight: 700;
    color: #12212E;
}

.text-forgot-password-des {
    font-weight: 500;
    font-size: 1rem;
    line-height: 25.6px;
    color: #525A68;
}

.text-\[16px\] {
    font-size: 14px
}

.text-\[18px\] {
    font-size: 18px
}

.text-\[24px\] {
    font-size: 24px
}

.text-\[20px\] {
    font-size: 20px
}

.text-base {
    font-size: 14px
}

.text-lg {
    font-size: 1.125rem
}

.text-lg,
.text-xl {
    line-height: 1.75rem
}

.text-xl {
    font-size: 1.25rem
}

.\!font-semibold {
    font-weight: 600 !important
}

.font-\[400\] {
    font-weight: 400
}

.font-\[500\] {
    font-weight: 500
}

.font-\[700\],
.font-bold {
    font-weight: 700
}

.font-medium {
    font-weight: 500
}

.font-normal {
    font-weight: 400
}

.capitalize {
    text-transform: capitalize
}

.leading-\[25\.6px\] {
    line-height: 25.6px
}

.text-\[\#0d102f40\] {
    color: #0d102f40
}

.text-\[\#525A68\] {
    --tw-text-opacity: 1;
    color: rgb(82 90 104/var(--tw-text-opacity))
}

.text-\[\#f03d3e\] {
    --tw-text-opacity: 1;
    color: rgb(240 61 62/var(--tw-text-opacity))
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(13 16 47/var(--tw-text-opacity))
}

.text-gray4 {
    --tw-text-opacity: 1;
    color: rgb(83 85 108/var(--tw-text-opacity))
}

.text-green {
    --tw-text-opacity: 1;
    color: rgb(17 110 99/var(--tw-text-opacity))
}

.text-greenGray {
    --tw-text-opacity: 1;
    color: rgb(184 212 208/var(--tw-text-opacity))
}

.text-lnk {
    --tw-text-opacity: 1;
    color: rgb(18 33 46/var(--tw-text-opacity))
}

.text-textError {
    --tw-text-opacity: 1;
    color: rgb(233 79 97/var(--tw-text-opacity))
}

.text-textGray {
    --tw-text-opacity: 1;
    color: rgb(82 90 104/var(--tw-text-opacity))
}

.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.text-yellow {
    --tw-text-opacity: 1;
    color: rgb(242 162 39/var(--tw-text-opacity))
}

.underline {
    text-decoration-line: underline
}

.opacity-20 {
    opacity: .2
}

.opacity-25 {
    opacity: .25
}

.opacity-70 {
    opacity: .7
}

.blur {
    --tw-blur: blur(8px)
}

.blur,
.drop-shadow-md {
    -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.drop-shadow-md {
    --tw-drop-shadow: drop-shadow(0 4px 3px rgba(0, 0, 0, .07)) drop-shadow(0 2px 2px rgba(0, 0, 0, .06))
}

.filter {
    -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: NotoSansJP, sans-serif -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    margin: 0
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
}

.hover\:cursor-not-allowed:hover {
    cursor: not-allowed
}

.hover\:cursor-pointer:hover {
    cursor: pointer
}

@media (min-width:640px) {
    .sm\:w-\[180px\] {
        width: 180px
    }
}

.ant-form-item-required:before {
    display: none !important
}

.ant-form-item-required .label-required:after {
    -webkit-margin-end: 18px;
    color: #ff4d4f;
    content: "(*)";
    display: inline-block;
    font-size: 14px;
    line-height: 1;
    margin-inline-end: 18px;
    margin-left: 4px
}

.ant-form-item-explain-error {
    margin: 8px 0 24px;
    text-align: start
}

.login .ant-form-item-explain-error {
    margin: 0 !important;
}
.login .validation-summary-errors {
    margin-top: 20px;
}
.login .validation-summary-errors ul {
    margin-bottom: 0 !important;
}
svg {
    vertical-align: initial
}

.ant-picker .ant-picker-suffix {
    cursor: pointer;
    pointer-events: auto
}

.ant-collapse-header .ant-collapse-header-text {
    color: #12212e;
    font-family: NotoSansJP, sans-serif; font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    text-transform: capitalize
}

body {
    overflow: hidden;
    font-family: myFirstFont;
}

    body a {
        color: #116E63;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 160%;
        text-decoration-line: underline;
    }

* {
    font-size: 14px;
    scrollbar-width: thin
}

::-webkit-scrollbar {
    height: 8px;
    width: 8px
}

::-webkit-scrollbar-thumb {
    background-color: #bdc1c6;
    border-radius: 4px
}

    ::-webkit-scrollbar-thumb:hover {
        background: #bdc1c6
    }

.base-modal .ant-modal-content {
    border-radius: 14px;
    height: auto;
    padding: 32px 24px
}

    .base-modal .ant-modal-content .ant-modal-close {
        margin-right: 5px;
        margin-top: 15px
    }

.wrapper-form-item .wrapper-label .icon {
    color: #f03d3e;
    margin-left: 4px;
    width: 26px
}

.wrapper-form-item .wrapper-label .label {
    color: #12212e;
    font-size: 14px;
    font-weight: 500;
    line-height: 25.6px
}

.wrapper-form-item .input-password {
    background: #fff;
    border: 1px solid #9e9fac;
    border-radius: 10px;
    height: 44px;
    width: 100%
}

    .wrapper-form-item .input-password .ant-input-suffix:hover {
        cursor: pointer
    }

.wrapper-form-item .ant-form-item-explain-error {
    color: #f03d3e;
    font-size: 14px;
    font-weight: 400;
    line-height: 25.6px;
    margin-bottom: 24px;
    margin-top: 8px;
}

.wrapper-form-item .ant-input-affix-wrapper-status-error {
    border-color: #f03d3e
}

.wrapper-modal .title {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 24px;
    padding-top: 40px
}

    .wrapper-modal .title > span {
        color: #12212e;
        font-size: 20px
        font-weight: 700;
        line-height: 29px;
        padding-top: 24px
    }

.wrapper-modal .wrapper-action {
    display: flex;
    flex-direction: row;
    margin-bottom: -29px
}

.base-button-container button {
    font-family: NotoSansJP, sans-serif !important;
    font-weight: 600;
    height: auto;
    min-width: 53px;
    padding: 8px 12px;
    width: auto
}

    .base-button-container button.primary {
        background-color: #116e63;
        color: #fff !important;
        border: none;
    }

        .base-button-container button.primary svg,
        .base-button-container button.primary svg path {
            fill: #fff
        }

        .base-button-container button.primary:hover:not([disabled]) {
            background-color: #589a92;
            cursor: pointer;
        }

        .base-button-container button.primary:disabled {
            background-color: #b8d4d0
        }

        .base-button-container button.primary:active:not([disabled]) {
            background-color: #0c4d45
        }

    .base-button-container button.secondary {
        background-color: #fff;
        border: 1px solid #116e63;
        color: #116e63
    }


    .base-button-container button.secondary1 svg,
    .base-button-container button.secondary1 svg path {
        fill: #116e63
    }

    .base-button-container button.secondary:hover:not([disabled]) {
        background-color: #e7f1ef;
        border: 1px solid #589a92;
        color: #589a92;
        cursor: pointer
    }


    .base-button-container button.secondary:disabled {
        border: 1px solid #b8d4d0;
        color: #b8d4d0
    }

        .base-button-container button.secondary:disabled svg,
        .base-button-container button.secondary:disabled svg path {
            fill: #b8d4d0
        }

    .base-button-container button.secondary:active:not([disabled]) {
        background-color: #e7f1ef;
        border: 1px solid #0c4d45;
        color: #0c4d45
    }

    .base-button-container button.tertiary {
        background-color: #fff;
        border: 1px solid #9e9fac;
        color: #12212e
    }

        .base-button-container button.tertiary svg,
        .base-button-container button.tertiary svg path {
            fill: #12212e
        }

        .base-button-container button.tertiary:hover:not([disabled]) {
            background-color: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #525a68
        }

            .base-button-container button.tertiary:hover:not([disabled]) svg,
            .base-button-container button.tertiary:hover:not([disabled]) svg path {
                fill: #525a68
            }

        .base-button-container button.tertiary:disabled {
            background-color: #f5f5f7;
            border: 1px solid #dbdbe0;
            color: #dbdbe0
        }

            .base-button-container button.tertiary:disabled svg,
            .base-button-container button.tertiary:disabled svg path {
                fill: #dbdbe0
            }

        .base-button-container button.tertiary:active:not([disabled]) {
            background-color: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #12212e
        }

            .base-button-container button.tertiary:active:not([disabled]) svg,
            .base-button-container button.tertiary:active:not([disabled]) svg path {
                fill: #12212e
            }

    .base-button-container button.danger {
        background-color: #f03d3e;
        color: #fff !important
    }

        .base-button-container button.danger svg,
        .base-button-container button.danger svg path {
            fill: #fff
        }

        .base-button-container button.danger:active:not([disabled]),
        .base-button-container button.danger:disabled,
        .base-button-container button.danger:hover:not([disabled]) {
            background-color: #ef6a6a
        }

    .base-button-container button.large {
        border-radius: 8px;
        font-size: 14px;
        height: 38px;
    }

    .base-button-container button.medium {
        border-radius: 10px;
        font-size: 14px;
        height: 40px
    }

    .base-button-container button.small {
        border-radius: 8px;
        font-size: 14px;
        height: 32px
    }

#app-header {
    height: 82px;
    padding: 0;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1
}

    #app-header .header {
        display: flex;
        height: 100%;
        justify-content: space-between;
        padding-right: 24px
    }

        #app-header .header .left-part {
            align-items: center;
            display: flex;
            gap: 5px;
            justify-content: center
        }

            #app-header .header .left-part #left-part-icon {
                left: -21px;
                position: absolute
            }

                #app-header .header .left-part #left-part-icon .anticon {
                    align-items: center;
                    display: flex;
                    justify-content: center
                }

        #app-header .header .left-part-user-login {
            font-size: 20px
            font-weight: 700px;
            margin-left: 20px
        }

        #app-header .header .right-part {
            align-items: center;
            display: flex;
            gap: 15px;
            justify-content: center
        }

            #app-header .header .right-part .right-part-icon {
                position: relative
            }

            #app-header .header .right-part .right-part-noti {
                background-color: #dc3545;
                border-radius: 12px;
                font-size: 13px;
                font-weight: 400;
                height: 21px;
                padding: 0 8px;
                position: absolute;
                right: -30px;
                top: -5px;
                width: 45px
            }

                #app-header .header .right-part .right-part-noti p {
                    color: #fff;
                    position: absolute;
                    right: 4px;
                    top: -38px
                }

            #app-header .header .right-part .right-part-avatar {
                align-items: center;
                background-color: #f6be68;
                border-radius: 50%;
                color: #fff;
                display: flex;
                font-size: 30px;
                height: 50px;
                justify-content: center;
                margin-left: 20px;
                width: 50px
            }

            #app-header .header .right-part .right-part-icon {
                align-items: center;
                background-color: #f5f5f7;
                border-radius: 28px;
                display: flex;
                height: 44px;
                justify-content: center;
                width: 44px
            }

        #app-header .header .right_part .user-login-right-part {
            font-size: 14px;
            font-weight: 500
        }

        #app-header .header .right_part .dropdown-arrow img {
            height: 7.5px;
            width: 15px
        }

.content-dropdown {
    font-size: 14px;
    font-weight: 400;
    padding-left: 16px
}

.over-lay-drop-down-header {
    border-radius: 14px;
    padding-top: 4px;
    width: 250px
}

    .over-lay-drop-down-header ul {
        padding: 24px 0 !important
    }

        .over-lay-drop-down-header ul li:hover {
            background-color: #e7f1ef !important
        }

@media screen and (max-width:812px) {
    .left-part-icon {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
}

.ant-layout-sider {
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px
}

.sider-container {
    height: 100vh;
    z-index: 1
}

    .sider-container .ant-menu-title-content {
        size: 16px;
        color: #9e9fac;
        font-weight: 700
    }

    .sider-container .flex-container {
        display: flex;
        flex-direction: column;
        height: calc(100vh - 102px);
        justify-content: space-between
    }

        .sider-container .flex-container .icon-up {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg)
        }

        .sider-container .flex-container .icon-down,
        .sider-container .flex-container .icon-up {
            transition: -webkit-transform .3s ease-in-out;
            transition: transform .3s ease-in-out;
            transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
        }

        .sider-container .flex-container .icon-down {
            -webkit-transform: rotate(180deg);
            transform: rotate(180deg)
        }

    .sider-container .ant-menu-item {
        border-radius: 14px
    }

    .sider-container .ant-menu-submenu-selected .ant-menu-submenu-title {
        background-color: #e7f1ef;
        border-radius: 14px
    }

    .sider-container .ant-menu-submenu .ant-menu-sub {
        background: none !important;
        padding-left: 50px !important
    }

        .sider-container .ant-menu-submenu .ant-menu-sub .ant-menu-item {
            height: 50px !important
        }

    .logo,
    .sider-container .ant-menu-inline-collapsed .ant-menu-item,
    .sider-container .ant-menu-inline-collapsed .ant-menu-submenu-title {
        display: flex
    }

.logo {
    align-items: center;
    background: hsla(0, 0%, 100%, .2);
    justify-content: center;
    margin: 20px 16px 14px
}

    .logo img {
        height: "32px";
        transition: "all 0.2s ease";
        width: "auto"
    }

.ant-menu-inline,
.ant-menu.ant-menu-vertical {
    -webkit-border-end: none !important;
    border-inline-end: none !important
}

.ant-menu-item-icon {
    align-items: center;
    display: flex;
    justify-content: center
}

.ant-menu-item,
.ant-menu-submenu > .ant-menu-submenu-title {
    height: 60px !important
}

    .ant-menu-item .sider__icon,
    .ant-menu-submenu > .ant-menu-submenu-title .sider__icon {
        min-width: -webkit-fit-content;
        min-width: -moz-fit-content;
        min-width: fit-content
    }

.active-item .ant-menu-item-active .ant-menu-item-active,
.ant-menu-item-selected,
.ant-menu-submenu-active > .ant-menu-submenu-title {
    background-color: #e7f1ef !important
}

    .active-item .ant-menu-item-active .ant-menu-item-active .sider__icon > path,
    .ant-menu-item-selected .sider__icon > path,
    .ant-menu-submenu-active > .ant-menu-submenu-title .sider__icon > path {
        stroke: #116e63 !important
    }

    .active-item .ant-menu-item-active .ant-menu-item-active .ant-menu-title-content,
    .ant-menu-item-selected .ant-menu-title-content,
    .ant-menu-submenu-active > .ant-menu-submenu-title .ant-menu-title-content {
        align-items: center;
        color: #116e63 !important
    }

.ant-menu-submenu-popup .ant-menu-sub .ant-menu-item {
    height: 50px !important
}

    .ant-menu-submenu-popup .ant-menu-sub .ant-menu-item span {
        vertical-align: middle !important
    }

.logout-modal .button-cancel,
.logout-modal .button-logout,
.logout-modal .button-modal {
    border-radius: 14px;
    box-shadow: none;
    font-size: 14px;
    height: 50px;
    width: 50%
}

.logout-modal .button-cancel {
    border: 1px solid #9e9fac;
    color: #12212e;
    font-weight: 600
}

.logout-modal .button-logout {
    color: #fff;
    font-weight: 700;
    margin-left: 16px !important
}

.logout-modal .modal-title {
    color: #12212e;
    font-size: 20px
    font-weight: 700;
    margin-bottom: 16px;
    margin-top: 16px;
    text-align: center
}

.logout-modal .image {
    display: flex;
    margin: 42px auto auto
}

.logout-modal .content-modal-style {
    color: #525a68;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 24px;
    padding: 0 60px;
    text-align: center;
    white-space: pre-line
}

.logout-modal .footer {
    display: flex
}

.loading-page {
    align-items: center;
    background-color: #fff;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    opacity: .8;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 99
}

.beauty-select {
    width: 168px
}

    .beauty-select .ant-select-selector {
        background: #fff;
        border: 1px solid #9e9fac;
        border-radius: 14px;
        height: 50px !important
    }

        .beauty-select .ant-select-selector:after {
            content: none !important
        }

    .beauty-select .ant-select-selection-item {
        display: flex;
        flex-direction: column;
        justify-content: center
    }

        .beauty-select .ant-select-selection-item .beauty-select-option {
            display: flex;
            justify-content: left;
            padding-top: 0
        }

            .beauty-select .ant-select-selection-item .beauty-select-option .select-item {
                width: 90% !important
            }

        .beauty-select .ant-select-selection-item:after {
            content: none !important
        }

    .beauty-select .icon-down {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    .beauty-select .icon-down,
    .beauty-select .icon-up {
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
    }

    .beauty-select .icon-up {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

option {
    display: block;
    font-size: 14px;
    height: 40px
}

#project-managment .project-container {
    background-color: #f5f5f7;
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative
}

#project-managment .project-container-breadcrumb {
    display: flex;
    gap: 15.5px;
    justify-content: left
}

#project-managment .project-container-breadcrumb-link {
    color: #9e9fac;
    font-size: 14px;
    font-weight: 400
}

    #project-managment .project-container-breadcrumb-link.active {
        color: #12212e;
        font-size: 14px;
        font-weight: 400
    }

#project-managment .project-container-title {
    align-items: center;
    display: flex;
    gap: 25px;
    justify-content: left
}

#project-managment .project-container-title-select-disable-click-event {
    pointer-events: none
}

    #project-managment .project-container-title-select-disable-click-event .ant-select-selector {
        background-color: transparent;
        border: none
    }

    #project-managment .project-container-title-select-disable-click-event .ant-select-arrow {
        display: none
    }

#project-managment .project-container-title h1 {
    color: #12212e;
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 10px
}

#project-managment .project-container-title span select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url(/static/media/SelectCaretDown.6962fd2d9d0acd6a964b.svg);
    background-position: right 10px center;
    background-repeat: no-repeat;
    border: 1px solid #9e9fac;
    border-radius: 14px;
    color: #f2a227;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
    height: 50px;
    padding: 8px 20px;
    width: 168px
}

#project-managment .project-container-title-select select:focus {
    outline: none
}

#project-managment .project-container-title button {
    background-color: #fff;
    background-image: url(/static/media/X.1e80ab6c6e47601310f1.svg);
    background-position: left 10px center;
    background-repeat: no-repeat;
    border: 1px solid #dc3545;
    border-radius: 14px;
    color: #dc3545;
    font-size: 14px;
    font-weight: 700;
    height: 50px;
    padding-left: 30px;
    position: absolute;
    right: 44px;
    width: 207px
}

#project-managment .project-container-info {
    display: flex;
    justify-content: space-between;
    width: 50%
}

    #project-managment .project-container-info div {
        display: flex;
        flex-direction: column
    }

        #project-managment .project-container-info div span {
            display: flex;
            font-size: 14px;
            font-weight: 400;
            gap: 10px;
            justify-content: left
        }

            #project-managment .project-container-info div span strong {
                font-weight: 700
            }

#project-managment .project-container-info-input {
    background-color: #fff;
    background-image: url(/static/media/PencilLine.71952eb26ebe47b15395.svg);
    background-position: left 16px center;
    background-repeat: no-repeat;
    border: 1px solid #9e9fac;
    border-radius: 10px;
    height: 52px;
    padding: 10px 16px 10px 50px;
    width: 100%
}

    #project-managment .project-container-info-input span form {
        display: flex;
        justify-content: space-between
    }

        #project-managment .project-container-info-input span form input {
            align-items: center;
            border: none;
            display: flex;
            height: 30px;
            justify-content: left;
            outline: none;
            width: 100%
        }

            #project-managment .project-container-info-input span form input:focus {
                border: none;
                outline: none
            }

        #project-managment .project-container-info-input span form span {
            display: flex;
            font-size: 13px;
            font-weight: 700;
            gap: 16px;
            justify-content: space-between
        }

#project-managment .project-container-info-tabpane {
    background-color: #fff;
    width: 100%
}

    #project-managment .project-container-info-tabpane .ant-tabs-tab-disabled {
        color: #dbdbe0 !important
    }

    #project-managment .project-container-info-tabpane .ant-tabs-tab {
        color: #12212e;
        font-size: 14px;
        font-weight: 500;
        padding: 17px 24px
    }

        #project-managment .project-container-info-tabpane .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
            color: #116e63
        }

#project-managment .project-container .project-infomation-label {
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%
}

#project-managment .project-container .ant-collapse-borderless {
    background-color: transparent
}

#project-managment .project-container .ant-tabs,
#project-managment .project-container .ant-tabs .ant-tabs-content,
#project-managment .project-container .ant-tabs .ant-tabs-tabpane {
    height: 100%
}

    #project-managment .project-container .ant-tabs .project-tabs-content {
        height: calc(100% - 50px);
        overflow-x: hidden;
        overflow-y: auto
    }

    #project-managment .project-container .ant-tabs .add-schedule,
    #project-managment .project-container .ant-tabs .container-required-document-tab,
    #project-managment .project-container .ant-tabs form {
        height: 100%
    }

.error-input {
    align-items: flex-start;
    display: flex;
    margin-top: 8px
}

    .error-input .error-text {
        font-size: 14px;
        font-weight: 400;
        line-height: 25.6px
    }

.select-container .ant-select-selector .ant-select-selection-item {
    -webkit-padding-end: 26px !important;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    padding-inline-end: 26px !important;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ant-select-dropdown .add-btn span {
    color: #116e63
}

.date-container {
    width: 100%
}

    .date-container .input-container {
        align-items: center;
        border: 1px solid;
        border-radius: 10px;
        display: flex;
        justify-content: center
    }

    .date-container .label-container {
        display: flex;
        flex-direction: row;
        font-size: 14px;
        font-weight: 500;
        line-height: 25.6px;
        margin-bottom: 8px;
        text-align: center
    }

        .date-container .label-container .require {
            color: #f03d3e;
            margin-left: 4px
        }

    .date-container .input-date {
        align-items: center;
        display: flex;
        font-size: 14px;
        font-weight: 400;
        width: 100%
    }

.text-field-container .input-container {
    border: 1px solid;
    border-radius: 10px;
    display: flex
}

.text-field-container .label-container {
    display: flex;
    flex-direction: row;
    font-size: 14px;
    font-weight: 500;
    line-height: 25.6px;
    padding-bottom: 8px;
    text-align: center
}

    .text-field-container .label-container .require {
        color: #f03d3e;
        margin-left: 4px
    }

.text-field-container .input-style {
    font-size: 14px !important;
    font-weight: 400
}

.add-schedule .schedule .btn-schedule {
    display: flex;
    justify-content: space-between
}

    .add-schedule .schedule .btn-schedule .btn-group {
        display: flex;
        margin-left: 60px
    }

        .add-schedule .schedule .btn-schedule .btn-group button {
            margin-right: 10px
        }

            .add-schedule .schedule .btn-schedule .btn-group button.btn-cancel-step {
                border: 1px solid #9e9fac;
                border-radius: 14px;
                order: 0
            }

            .add-schedule .schedule .btn-schedule .btn-group button.btn-cancel-step,
            .add-schedule .schedule .btn-schedule .btn-group button.btn-draft-step {
                align-items: center;
                background: #fff;
                box-sizing: border-box;
                display: flex;
                flex: none;
                flex-direction: row;
                flex-grow: 0;
                font-size: 14px;
                font-weight: 700;
                gap: 10px;
                height: 50px;
                justify-content: center;
                padding: 8px 16px;
                width: 140px
            }

            .add-schedule .schedule .btn-schedule .btn-group button.btn-draft-step {
                border: 1px solid #116e63;
                border-radius: 14px;
                color: #116e63 !important;
                order: 1
            }

                .add-schedule .schedule .btn-schedule .btn-group button.btn-draft-step:disabled {
                    border: 1px solid #b8d4d0 !important;
                    color: #b8d4d0 !important
                }

            .add-schedule .schedule .btn-schedule .btn-group button.btn-save-step {
                align-items: center;
                border: none;
                border-radius: 14px;
                display: flex;
                flex: none;
                flex-direction: row;
                flex-grow: 0;
                font-size: 14px;
                font-weight: 700;
                gap: 10px;
                height: 50px;
                justify-content: center;
                order: 2;
                padding: 8px 16px;
                width: 140px
            }

.add-schedule .schedule span.lb {
    color: #12212e;
    font-size: 14px;
    font-weight: 500;
    line-height: 160%
}

.add-schedule .schedule span.lb-star {
    color: #f03d3e
}

.add-schedule .schedule span.title {
    color: #12212e;
    display: block;
    font-size: 20px
    font-weight: 700;
    line-height: 120%;
    margin-bottom: 20px;
    text-transform: capitalize
}

.add-schedule .schedule .filter-template {
    align-items: center;
    background: #fff;
    border: 1px solid #9e9fac;
    border-radius: 10px 0 0 10px;
    display: flex;
    flex-direction: row;
    height: 44px;
    justify-content: space-between;
    margin-top: 10px;
    padding: 10px 16px;
    width: 1494px
}

    .add-schedule .schedule .filter-template .ant-select-selector {
        border: none
    }

.add-schedule .schedule .search {
    display: flex
}

    .add-schedule .schedule .search button {
        align-items: center;
        background: #fff;
        border: 1px solid #9e9fac;
        border-radius: 0 10px 10px 0;
        display: flex;
        flex-direction: row;
        gap: 8px;
        height: 44px;
        justify-content: space-between;
        margin-top: 10px;
        padding: 16px;
        width: 159px
    }

.add-schedule .parent-add-step {
    margin: auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

    .add-schedule .parent-add-step .add-step {
        display: flex;
        justify-content: center
    }

        .add-schedule .parent-add-step .add-step .list-schedule-container {
            height: -webkit-fit-content;
            height: -moz-fit-content;
            height: fit-content;
            position: relative
        }

            .add-schedule .parent-add-step .add-step .list-schedule-container .line {
                background-color: #116e63;
                height: 100%;
                left: 49px;
                position: absolute;
                top: 0;
                width: 2px
            }

        .add-schedule .parent-add-step .add-step .step-item-container {
            display: flex;
            flex-direction: column;
            position: relative;
            width: -webkit-fit-content;
            width: -moz-fit-content;
            width: fit-content
        }

            .add-schedule .parent-add-step .add-step .step-item-container .icon-add-new {
                cursor: pointer;
                display: flex;
                height: 31px;
                justify-content: flex-end;
                position: relative;
                width: 100%
            }

                .add-schedule .parent-add-step .add-step .step-item-container .icon-add-new .line-double {
                    border: 1px solid #116e63;
                    height: 6px;
                    position: absolute;
                    right: 29px;
                    top: 40%;
                    width: calc(100% - 68px)
                }

            .add-schedule .parent-add-step .add-step .step-item-container:first-child:after {
                background-color: #fff;
                content: "";
                height: calc(50% - 26px);
                left: 5px;
                position: absolute;
                top: 0;
                width: 10px;
                z-index: 1
            }

            .add-schedule .parent-add-step .add-step .step-item-container:last-child:not(:first-child):after {
                background-color: #fff;
                bottom: 0;
                content: "";
                height: calc(50% + 5px);
                left: 5px;
                position: absolute;
                width: 10px;
                z-index: 1
            }

        .add-schedule .parent-add-step .add-step .ant-card-bordered {
            background: #fff;
            border-radius: 14px;
            width: 768px
        }

        .add-schedule .parent-add-step .add-step .ant-card-body {
            border: 1px solid #dbdbe0;
            border-radius: 14px !important;
            box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08) !important;
            display: flex;
            width: 768px !important
        }

        .add-schedule .parent-add-step .add-step .content-step {
            flex: 1 1;
            margin-left: 30px
        }

            .add-schedule .parent-add-step .add-step .content-step span {
                color: #12212e;
                display: block;
                font-size: 14px;
                font-weight: 400;
                white-space: break-spaces;
                word-break: break-all
            }

                .add-schedule .parent-add-step .add-step .content-step span:first-child {
                    color: #12212e;
                    font-size: 18px;
                    font-weight: 500
                }

        .add-schedule .parent-add-step .add-step .editStep {
            align-items: center;
            display: flex
        }

            .add-schedule .parent-add-step .add-step .editStep .drag-icon {
                height: -webkit-fit-content;
                height: -moz-fit-content;
                height: fit-content;
                left: 50%;
                position: relative
            }

        .add-schedule .parent-add-step .add-step .line-step {
            background-color: #116e63;
            height: 50px;
            margin: 15px;
            width: 2px
        }

        .add-schedule .parent-add-step .add-step .line-step-template {
            background-color: #9e9fac;
            height: 50px;
            margin: 15px;
            width: 2px
        }

        .add-schedule .parent-add-step .add-step .delete-item {
            border-radius: 24px;
            height: 44px;
            margin-left: auto;
            padding: 10px;
            width: 44px
        }

            .add-schedule .parent-add-step .add-step .delete-item:hover {
                background-color: #dbdbe0;
                cursor: pointer
            }

        .add-schedule .parent-add-step .add-step .check-outlined {
            align-items: center;
            background-color: #e7f1ef;
            border-radius: 50%;
            color: #fff;
            display: flex;
            font-size: 14px;
            height: 35px;
            justify-content: center;
            width: 35px
        }

        .add-schedule .parent-add-step .add-step .check-outlined-template {
            align-items: center;
            background-color: #dbdbe0;
            border-radius: 50%;
            color: #525a68;
            display: flex;
            font-size: 14px;
            height: 35px;
            justify-content: center;
            width: 35px
        }

        .add-schedule .parent-add-step .add-step .check-outlined-confirm {
            align-items: center;
            background-color: #116e63;
            border-radius: 50%;
            color: #fff;
            display: flex;
            font-size: 14px;
            height: 35px;
            justify-content: center;
            width: 35px
        }

        .add-schedule .parent-add-step .add-step .anticon svg {
            color: #116e63;
            display: inline-block;
            height: 16.5px;
            width: 16.5px
        }

        .add-schedule .parent-add-step .add-step .anticon:hover {
            cursor: pointer
        }

        .add-schedule .parent-add-step .add-step .ant-form-item-control-input-content,
        .add-schedule .parent-add-step .add-step .content-add-step {
            width: 90%
        }

        .add-schedule .parent-add-step .add-step .ant-picker-input input {
            height: 36px;
            width: 90% !important
        }

        .add-schedule .parent-add-step .add-step .ant-picker-input > input::-webkit-input-placeholder {
            color: #999
        }

        .add-schedule .parent-add-step .add-step .ant-picker-input > input::placeholder {
            color: #999
        }

        .add-schedule .parent-add-step .add-step .newStep .ant-card-body {
            border-left: 8px solid #116e63;
            border-radius: 14px;
            box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
            box-sizing: border-box;
            display: flex;
            flex-direction: row;
            isolation: isolate;
            width: 768px
        }

            .add-schedule .parent-add-step .add-step .newStep .ant-card-body .left-content {
                margin-top: 40px
            }

        .add-schedule .parent-add-step .add-step .newStep .check-outlined {
            background: #dbdbe0;
            border-radius: 22px;
            color: #525a68;
            font-size: 18px;
            font-weight: 500
        }

        .add-schedule .parent-add-step .add-step .newStep .line-step {
            background-color: #9e9fac
        }

        .add-schedule .parent-add-step .add-step .newStep .content-add-step {
            margin-left: 25px;
            margin-top: 40px;
            width: 85%
        }

            .add-schedule .parent-add-step .add-step .newStep .content-add-step .ant-input {
                border-radius: 10px;
                height: 44px
            }

            .add-schedule .parent-add-step .add-step .newStep .content-add-step .ant-picker {
                border: 1px solid #9e9fac;
                border-radius: 10px;
                height: 44px
            }

            .add-schedule .parent-add-step .add-step .newStep .content-add-step .ant-select-selector {
                align-items: center;
                border: 1px solid #9e9fac;
                border-radius: 10px;
                height: 44px !important
            }

                .add-schedule .parent-add-step .add-step .newStep .content-add-step .ant-select-selector .ant-select-selection-placeholder {
                    margin-top: 5px
                }

        .add-schedule .parent-add-step .add-step .old-step {
            align-items: center;
            display: flex;
            position: relative;
            z-index: 10
        }

            .add-schedule .parent-add-step .add-step .old-step .ant-card-body {
                height: auto
            }

                .add-schedule .parent-add-step .add-step .old-step .ant-card-body .content-step,
                .add-schedule .parent-add-step .add-step .old-step .ant-card-body .left-content {
                    margin-top: 30px
                }

            .add-schedule .parent-add-step .add-step .old-step span.anticon.anticon-caret-left.arrow-left {
                box-shadow: 0 2px 4px rgba(24, 39, 75, .12), 0 4px 4px rgba(24, 39, 75, .08);
                color: #fff;
                left: 15px;
                position: relative;
                -webkit-transform: rotate(44deg);
                transform: rotate(44deg)
            }

                .add-schedule .parent-add-step .add-step .old-step span.anticon.anticon-caret-left.arrow-left svg {
                    color: #fff
                }

        .add-schedule .parent-add-step .add-step .dot-step {
            background-color: #116e63;
            border-radius: 50%;
            height: 21px;
            width: 21px
        }

        .add-schedule .parent-add-step .add-step .add-new-step {
            align-items: center;
            display: flex
        }

            .add-schedule .parent-add-step .add-step .add-new-step .drag-icon {
                height: -webkit-fit-content;
                height: -moz-fit-content;
                height: fit-content;
                left: 50%;
                position: relative
            }

            .add-schedule .parent-add-step .add-step .add-new-step .vector {
                left: 3px;
                margin-left: 6px;
                position: relative
            }

                .add-schedule .parent-add-step .add-step .add-new-step .vector svg {
                    vertical-align: middle
                }

            .add-schedule .parent-add-step .add-step .add-new-step .newStep .content-add-step label {
                color: #12212e;
                font-size: 14px;
                font-weight: 500
            }

        .add-schedule .parent-add-step .add-step button.btn-add-step {
            align-items: center;
            background: #fff;
            border: 1px solid #116e63;
            border-radius: 14px;
            box-sizing: border-box;
            color: #116e63;
            display: flex;
            flex-direction: row;
            float: right;
            font-size: 14px;
            font-weight: 500;
            gap: 12px;
            height: 50px;
            justify-content: center;
            margin-bottom: 10px;
            margin-left: 15px;
            margin-top: 10px;
            padding: 8px 16px;
            width: 768px
        }

.add-schedule .emptySchedule {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .add-schedule .emptySchedule .btn-empty-schedule {
        align-items: center;
        display: flex;
        flex-direction: row;
        height: 40px;
        justify-content: center;
        margin-top: 10px;
        padding: 8px 16px;
        width: 177px
    }

    .add-schedule .emptySchedule .createSchedule {
        color: #12212e;
        font-size: 18px;
        font-weight: 500;
        line-height: 140%;
        margin-top: 10px
    }

    .add-schedule .emptySchedule .createScheduleTitle {
        color: #525a68;
        font-size: 14px;
        font-weight: 400;
        line-height: 35px;
        margin-top: 10px;
        text-align: center
    }

.base-button-container .btn-export-pdf.tertiary {
    align-items: center;
    background: #fff;
    border: 1px solid #9e9fac;
    border-radius: 14px;
    box-sizing: border-box;
    display: flex;
    flex: none;
    flex-direction: row;
    flex-grow: 0;
    font-size: 14px;
    font-weight: 700;
    gap: 10px;
    height: 50px;
    justify-content: center;
    order: 0;
    padding: 8px 16px;
    width: 140px
}

    .base-button-container .btn-export-pdf.tertiary svg,
    .base-button-container .btn-export-pdf.tertiary svg path {
        fill: none !important;
        stroke: #12212e
    }

    .base-button-container .btn-export-pdf.tertiary:hover {
        background-color: #f5f5f7;
        border-color: #9e9fac;
        color: #525a68
    }

        .base-button-container .btn-export-pdf.tertiary:hover svg,
        .base-button-container .btn-export-pdf.tertiary:hover svg path {
            fill: none !important;
            stroke: #525a68
        }

    .base-button-container .btn-export-pdf.tertiary:disabled {
        border-color: #dbdbe0;
        color: #dbdbe0
    }

        .base-button-container .btn-export-pdf.tertiary:disabled svg,
        .base-button-container .btn-export-pdf.tertiary:disabled svg path {
            fill: none !important;
            stroke: #dbdbe0
        }

    .base-button-container .btn-export-pdf.tertiary:not([disabled]):active {
        background-color: #f5f5f7;
        border-color: #9e9fac;
        color: #12212e
    }

        .base-button-container .btn-export-pdf.tertiary:not([disabled]):active svg,
        .base-button-container .btn-export-pdf.tertiary:not([disabled]):active svg path {
            fill: none !important;
            stroke: #12212e
        }

.form-basic-information {
    background-color: #fff;
    color: #0d102f;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 10px 24px;
    text-align: left
}

    .form-basic-information .header-basic-information {
        align-items: center;
        display: flex;
        height: 50px;
        justify-content: space-between
    }

    .form-basic-information .icon {
        height: 24px;
        line-height: 25px;
        width: 24px
    }

    .form-basic-information .line-height-26 {
        line-height: 25px
    }

    .form-basic-information .wrapper-dragger .ant-upload-wrapper .ant-upload-drag {
        margin-bottom: 8px
    }

        .form-basic-information .wrapper-dragger .ant-upload-wrapper .ant-upload-drag :hover {
            cursor: context-menu
        }

    .form-basic-information .wrapper-dragger .upload-btn :hover {
        cursor: pointer !important
    }

    .form-basic-information .wrapper-dragger .ant-upload-drag {
        height: auto
    }

    .form-basic-information .wrapper-dragger .file-list {
        margin-top: 31px;
        max-height: 275px;
        overflow-x: hidden;
        overflow-y: scroll;
        padding-right: 8px;
        width: 50%
    }

        .form-basic-information .wrapper-dragger .file-list .file-info {
            align-items: center;
            display: flex;
            justify-content: space-between;
            margin-top: 4px
        }

        .form-basic-information .wrapper-dragger .file-list .file-name {
            font-size: 14px;
            font-weight: 400;
            margin-left: 13px
        }

        .form-basic-information .wrapper-dragger .file-list .file-item-uploading {
            color: #116e63
        }

            .form-basic-information .wrapper-dragger .file-list .file-item-uploading div span svg {
                height: 21px;
                width: 19px
            }

        .form-basic-information .wrapper-dragger .file-list .file-item-done {
            color: #12212e
        }

            .form-basic-information .wrapper-dragger .file-list .file-item-done div svg path {
                stroke: #076ce3
            }

        .form-basic-information .wrapper-dragger .file-list .file-item-error {
            color: #f03d3e
        }

        .form-basic-information .wrapper-dragger .file-list .ant-progress-line {
            margin-bottom: 0
        }

        .form-basic-information .wrapper-dragger .file-list .ant-progress-bg {
            height: 3px !important
        }

.memo {
    width: 100%
}

.memo-title-button {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 18px 24px 34px
}

    .memo-title-button span {
        align-items: center;
        display: flex;
        gap: 16px;
        justify-content: center
    }

        .memo-title-button span button {
            height: 50px;
            min-width: 140px
        }

    .memo-title-button h1 {
        font-size: 20px
        font-weight: 700;
        margin: 0
    }

.memo-textarea {
    padding: 0 24px 24px;
    width: 100%
}

    .memo-textarea .text-area-container .input-container textarea {
        border: 1px solid #9e9fac;
        border-radius: 10px;
        box-sizing: border-box;
        min-height: 472px;
        outline: none;
        padding: 10px 16px;
        width: 100%;
        z-index: 0
    }

.alert-notification {
    border-radius: 14px;
    bottom: 30px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    height: 50px;
    left: 50%;
    line-height: 160%;
    margin: 0;
    padding: 8px 16px;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1000
}

.alert-success {
    background: #ebf8f0
}

.alert-error {
    background: #feecec
}

.text-area-container .input-container {
    border: 1px solid;
    border-radius: 10px;
    display: flex
}

.text-area-container .label-container {
    display: flex;
    flex-direction: row;
    font-size: 14px;
    font-weight: 500;
    line-height: 25.6px;
    padding-bottom: 8px;
    text-align: center
}

    .text-area-container .label-container .require {
        color: #f03d3e;
        margin-left: 4px
    }

.text-area-container .input-style {
    font-size: 14px !important;
    font-weight: 400;
    max-height: 400px;
    overflow-y: auto;
    padding-top: 9px
}

    .text-area-container .input-style:placeholder-shown {
        display: inline-block;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

.question {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    font-weight: 400;
    gap: 24px;
    justify-content: left;
    padding: 0 24px 24px
}

    .question .ant-form-item {
        margin-bottom: 0
    }

    .question .ant-select-selector {
        height: 44px !important
    }

        .question .ant-select-selector .ant-select-selection-item,
        .question .ant-select-selector .ant-select-selection-placeholder {
            align-items: center;
            display: flex
        }

    .question .section-wrapper {
        margin: 0 96px
    }

        .question .section-wrapper .section-content {
            margin-top: 60px
        }

            .question .section-wrapper .section-content:not(:first-child) {
                margin-top: 90px
            }

    .question .question-card {
        background: #f5f5f7;
        border-radius: 14px;
        box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
        margin: 18px 0;
        padding: 20px 24px;
        width: 100%
    }

        .question .question-card .ant-select-selector {
            height: 40px !important
        }

    .question .question-card--error {
        background-color: #feecec;
        border-left: 6px solid #f03d3e
    }

    .question .question-card .text-border {
        border-bottom: 1px solid #9e9fac;
        border-radius: 0;
        padding: 8px 0
    }

    .question .question-card .ant-radio-wrapper .ant-radio-inner {
        height: 22px;
        width: 22px
    }

        .question .question-card .ant-radio-wrapper .ant-radio-inner:after {
            -webkit-margin-before: -14px;
            -webkit-margin-start: -14px;
            height: 28px;
            margin-block-start: -14px;
            margin-inline-start: -14px;
            width: 28px
        }

    .question .question-card .ant-checkbox-wrapper .ant-checkbox-inner {
        height: 22px;
        width: 22px
    }

        .question .question-card .ant-checkbox-wrapper .ant-checkbox-inner:after {
            height: 12px;
            width: 8px
        }

    .question .question-card .question-upload .button-upload svg,
    .question .question-card .question-upload .button-upload svg path {
        fill: none !important
    }

    .question .question-card .question-upload .button-upload:hover svg {
        opacity: .8
    }

    .question .question-card .question-upload .ant-upload-wrapper {
        display: flex;
        flex-direction: column-reverse;
        gap: 8px
    }

        .question .question-card .question-upload .ant-upload-wrapper .ant-upload-list {
            display: flex;
            flex-wrap: wrap;
            pointer-events: auto
        }

            .question .question-card .question-upload .ant-upload-wrapper .ant-upload-list .ant-upload-list-item-container {
                margin-bottom: 8px
            }

                .question .question-card .question-upload .ant-upload-wrapper .ant-upload-list .ant-upload-list-item-container .ant-upload-list-item {
                    background-color: #fff;
                    border: 1px solid #dbdbe0;
                    border-radius: 10px;
                    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
                    height: 100%;
                    margin-right: 8px;
                    padding: 8px;
                    width: 184px
                }

                    .question .question-card .question-upload .ant-upload-wrapper .ant-upload-list .ant-upload-list-item-container .ant-upload-list-item .ant-upload-icon svg {
                        color: #076ce3;
                        -webkit-transform: rotate(180deg);
                        transform: rotate(180deg)
                    }

            .question .question-card .question-upload .ant-upload-wrapper .ant-upload-list .ant-upload-list-item-undefined .ant-upload-list-item-action {
                opacity: 1
            }

    .question .question-card .question-dropdown {
        margin-top: 14px
    }

        .question .question-card .question-dropdown .ant-select {
            width: 408px
        }

    .question .action-button-wrapper svg,
    .question .action-button-wrapper svg path {
        fill: none !important
    }

    .question .label-required:after {
        -webkit-margin-end: 18px;
        color: #ff4d4f;
        content: "(*)";
        display: inline-block;
        font-size: 14px;
        line-height: 1;
        margin-inline-end: 18px;
        margin-left: 4px
    }

    .question .ant-picker-clear {
        background-color: #f5f5f7
    }

.text-icon-wrap svg {
    height: 24;
    margin-right: 8px;
    padding: 2px;
    width: 24
}

.container-card-section {
    background: #f5f5f7;
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
    border-top: 8px solid #116e63;
    border-top-right-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    position: relative;
    width: 100%
}

    .container-card-section .card-name {
        align-items: center;
        background: #116e63;
        border-radius: 14px 14px 0 0;
        display: flex;
        height: 50px;
        justify-content: center;
        min-width: 120px;
        position: absolute;
        top: -58px
    }

        .container-card-section .card-name > span {
            color: #fff;
            font-size: 14px;
            font-weight: 700;
            line-height: 25.6px;
            padding: 12px 16px;
            text-align: center;
            width: 100%
        }

    .container-card-section .card-content {
        display: flex;
        flex-direction: column;
        padding: 32px 24px
    }

        .container-card-section .card-content .title {
            color: #12212e;
            font-size: 20px
            font-weight: 700;
            line-height: 28.8px;
            padding-bottom: 16px
        }

        .container-card-section .card-content .content {
            color: #525a68;
            font-size: 14px;
            font-weight: 500;
            line-height: 25.5px
        }

#container-export .text-normal {
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%
}

#container-export .action-button-wrapper svg,
#container-export .action-button-wrapper svg path {
    fill: none !important
}

#container-export .template .ant-select-selector {
    height: 44px;
    padding: 4px 11px
}

#container-export .template .require {
    color: #f03d3e
}

#container-export .template .title {
    color: #12212e
}

#container-export .template-panel-header {
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    text-transform: capitalize
}

#container-export .ant-collapse-content .ant-collapse-content-box {
    max-height: 900px;
    overflow-y: auto;
    padding: 0 24px
}

#container-export .ant-collapse-borderless {
    background-color: #fff
}

#container-export .ant-collapse .ant-collapse-item {
    background-color: #fff;
    border-bottom: none
}

    #container-export .ant-collapse .ant-collapse-item .ant-collapse-header {
        align-items: center;
        padding: 30px 24px
    }

#container-export #additional-documents .ant-table-wrapper table,
#container-export #reference-documents .ant-table-wrapper table,
#container-export #required-documents-table .ant-table-wrapper table {
    border: 1px solid #dbdbe0;
    border-radius: 16px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08)
}

    #container-export #additional-documents .ant-table-wrapper table thead tr th,
    #container-export #reference-documents .ant-table-wrapper table thead tr th,
    #container-export #required-documents-table .ant-table-wrapper table thead tr th {
        -webkit-border-end: 1px solid #dbdbe0;
        border-bottom: 1px solid #dbdbe0;
        border-inline-end: 1px solid #dbdbe0;
        overflow-wrap: normal
    }

        #container-export #additional-documents .ant-table-wrapper table thead tr th:first-child,
        #container-export #reference-documents .ant-table-wrapper table thead tr th:first-child,
        #container-export #required-documents-table .ant-table-wrapper table thead tr th:first-child {
            -webkit-border-end: none;
            border-inline-end: none;
            border-radius: 14px 0 0 0
        }

        #container-export #additional-documents .ant-table-wrapper table thead tr th:last-child,
        #container-export #reference-documents .ant-table-wrapper table thead tr th:last-child,
        #container-export #required-documents-table .ant-table-wrapper table thead tr th:last-child {
            border-radius: 0 14px 0 0
        }

    #container-export #additional-documents .ant-table-wrapper table tbody tr:last-child td:first-child,
    #container-export #reference-documents .ant-table-wrapper table tbody tr:last-child td:first-child,
    #container-export #required-documents-table .ant-table-wrapper table tbody tr:last-child td:first-child {
        border-radius: 0 0 0 14px
    }

    #container-export #additional-documents .ant-table-wrapper table tbody tr:last-child td:last-child,
    #container-export #reference-documents .ant-table-wrapper table tbody tr:last-child td:last-child,
    #container-export #required-documents-table .ant-table-wrapper table tbody tr:last-child td:last-child {
        border-radius: 0 0 14px 0
    }

    #container-export #additional-documents .ant-table-wrapper table tr td.ant-table-selection-column,
    #container-export #reference-documents .ant-table-wrapper table tr td.ant-table-selection-column,
    #container-export #required-documents-table .ant-table-wrapper table tr td.ant-table-selection-column {
        padding: 25px 1px 25px 25px
    }

    #container-export #additional-documents .ant-table-wrapper table td,
    #container-export #reference-documents .ant-table-wrapper table td,
    #container-export #required-documents-table .ant-table-wrapper table td {
        border-bottom: 1px solid #dbdbe0
    }

        #container-export #additional-documents .ant-table-wrapper table td:first-child,
        #container-export #reference-documents .ant-table-wrapper table td:first-child,
        #container-export #required-documents-table .ant-table-wrapper table td:first-child {
            -webkit-border-end: none;
            border-inline-end: none
        }

        #container-export #additional-documents .ant-table-wrapper table td:not(:first-child),
        #container-export #reference-documents .ant-table-wrapper table td:not(:first-child),
        #container-export #required-documents-table .ant-table-wrapper table td:not(:first-child) {
            -webkit-border-end: 1px solid #dbdbe0;
            border-inline-end: 1px solid #dbdbe0
        }

#container-export #additional-documents th.ant-table-cell,
#container-export #reference-documents th.ant-table-cell,
#container-export #required-documents-table th.ant-table-cell {
    padding: 25px 1px 25px 25px
}

    #container-export #additional-documents th.ant-table-cell:nth-child(2),
    #container-export #reference-documents th.ant-table-cell:nth-child(2),
    #container-export #required-documents-table th.ant-table-cell:nth-child(2) {
        padding: 25px 25px 25px 16px
    }

#container-export #additional-documents .add-line-table .ant-table-cell:last-child,
#container-export #reference-documents .add-line-table .ant-table-cell:last-child,
#container-export #required-documents-table .add-line-table .ant-table-cell:last-child {
    position: relative
}

#container-export #additional-documents .add-line-table .add-icon-container > span,
#container-export #reference-documents .add-line-table .add-icon-container > span,
#container-export #required-documents-table .add-line-table .add-icon-container > span {
    display: none
}

#container-export #additional-documents .add-line-table tr:last-child:hover:after,
#container-export #reference-documents .add-line-table tr:last-child:hover:after,
#container-export #required-documents-table .add-line-table tr:last-child:hover:after {
    left: 2px !important
}

#container-export #additional-documents .add-line-table tr:not(:last-child):hover,
#container-export #reference-documents .add-line-table tr:not(:last-child):hover,
#container-export #required-documents-table .add-line-table tr:not(:last-child):hover {
    position: relative
}

    #container-export #additional-documents .add-line-table tr:not(:last-child):hover:after,
    #container-export #reference-documents .add-line-table tr:not(:last-child):hover:after,
    #container-export #required-documents-table .add-line-table tr:not(:last-child):hover:after {
        background-color: #116e63;
        bottom: 6px;
        content: "";
        display: block;
        height: 1px;
        left: 0;
        position: absolute;
        right: 0
    }

    #container-export #additional-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span,
    #container-export #reference-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span,
    #container-export #required-documents-table .add-line-table tr:not(:last-child):hover .add-icon-container > span {
        bottom: -12px;
        cursor: pointer;
        display: block;
        position: absolute;
        right: -12px;
        z-index: 1
    }

        #container-export #additional-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg,
        #container-export #reference-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg,
        #container-export #required-documents-table .add-line-table tr:not(:last-child):hover .add-icon-container > span svg {
            background-color: #116e63;
            border-radius: 14px;
            font-size: 20px
        }

            #container-export #additional-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:first-child,
            #container-export #reference-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:first-child,
            #container-export #required-documents-table .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:first-child {
                color: #fff
            }

            #container-export #additional-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:last-child,
            #container-export #reference-documents .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:last-child,
            #container-export #required-documents-table .add-line-table tr:not(:last-child):hover .add-icon-container > span svg path:last-child {
                color: #116e63
            }

    #container-export #additional-documents .add-line-table tr:not(:last-child):hover .ant-table-cell-row-hover,
    #container-export #reference-documents .add-line-table tr:not(:last-child):hover .ant-table-cell-row-hover,
    #container-export #required-documents-table .add-line-table tr:not(:last-child):hover .ant-table-cell-row-hover {
        border-bottom: 1px solid #116e63
    }

#container-export #additional-documents .ant-table-wrapper table tr.warning td.ant-table-cell,
#container-export #required-documents-table .ant-table-wrapper table tr.warning td.ant-table-cell {
    background: #fef6e9 !important
}

#container-export #additional-documents .ant-table-wrapper table tr.danger td.ant-table-cell,
#container-export #required-documents-table .ant-table-wrapper table tr.danger td.ant-table-cell {
    background: #feecec !important
}

#container-export .disabled-hover:hover:after {
    display: none !important
}

#container-export .disabled-hover:hover .ant-table-cell-row-hover {
    border-bottom: 1px solid #dbdbe0 !important
}

#container-export .disabled-hover td:first-child {
    border-right: 1px solid #dbdbe0 !important;
    padding: 16px 16px 16px 25px !important
}

#container-export .border-column-header table thead tr th:first-child {
    border-right: 1px solid #dbdbe0 !important
}

.base-table {
    font-family: NotoSansJP, sans-serif;
    height: 100%
}

    .base-table .delete-btn svg {
        fill: none !important;
        vertical-align: text-top
    }

        .base-table .delete-btn svg path {
            fill: none !important
        }

    .base-table .ant-table-column-sorter-down {
        margin-top: -.6em !important
    }

    .base-table .ant-table-wrapper .ant-table-container {
        border: none !important
    }

    .base-table .base-table-data .ant-table-thead > tr > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]):before,
    .base-table .base-table-data .ant-table-wrapper .ant-table-thead > tr > td:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]):before {
        background-color: #dbdbe0;
        height: 1.9em;
        width: 1px !important
    }

    .base-table .base-table-data th.ant-table-cell {
        border-bottom: 1px solid #dbdbe0;
        color: #525a68;
        height: 56px !important;
        padding: 16px
    }

    .base-table .base-table-data thead th {
        background-color: #f5f5f7
    }

    .base-table .base-table-data tbody .ant-table-tbody,
    .base-table .base-table-data tbody th.ant-table-cell {
        background-color: #f5f5f7 !important
    }

    .base-table .base-table-data tr.ant-table-row {
        height: 60px
    }

        .base-table .base-table-data tr.ant-table-row td.ant-table-cell {
            background: #fff
        }

    .base-table .base-table-data tr:hover > td {
        background: #f5f5f7 !important
    }

    .base-table .base-table-data .ant-checkbox-wrapper .ant-checkbox-inner:after:not(.ant-checkbox-disabled) {
        background-color: #116e63
    }

    .base-table .ant-pagination.ant-table-pagination {
        margin-right: 40px
    }

        .base-table .ant-pagination.ant-table-pagination .ant-pagination-item-active {
            background-color: #fff;
            border: 1px solid #116e63 !important;
            border-radius: 10px;
            color: #116e63 !important;
            display: flex;
            height: 40px;
            justify-content: center;
            width: 40px
        }

            .base-table .ant-pagination.ant-table-pagination .ant-pagination-item-active a {
                color: #116e63;
                font-weight: 500
            }

        .base-table .ant-pagination.ant-table-pagination li.ant-pagination-next,
        .base-table .ant-pagination.ant-table-pagination li.ant-pagination-prev {
            height: 40px;
            width: 40px
        }

            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-next svg,
            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-prev svg {
                vertical-align: middle
            }

        .base-table .ant-pagination.ant-table-pagination .ant-pagination-item {
            display: flex;
            height: 40px;
            justify-content: center;
            width: 40px
        }

            .base-table .ant-pagination.ant-table-pagination .ant-pagination-item a,
            .base-table .ant-pagination.ant-table-pagination .ant-pagination-item-active a {
                align-self: center;
                font-size: 14px
            }

        .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options {
            display: block;
            height: 40px
        }

            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options .ant-pagination-options-size-changer,
            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options .ant-pagination-options-size-changer .ant-select-selector {
                height: 100%
            }

                .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options .ant-pagination-options-size-changer .ant-select-selector .ant-select-selection-item {
                    align-items: center;
                    display: flex;
                    font-size: 14px;
                    font-weight: 400;
                    justify-content: center;
                    line-height: 160%
                }

            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options .ant-select-selector {
                border: 1px solid #dbdbe0;
                border-radius: 10px;
                height: 40px;
                width: 159px
            }

            .base-table .ant-pagination.ant-table-pagination li.ant-pagination-options .ant-select-arrow {
                position: absolute;
                right: 18px;
                top: 21px
            }

.add-line-table .ant-table-cell:last-child {
    position: relative
}

.add-line-table .add-icon-container > span {
    display: none
}

.add-line-table tr:last-child.hovered-row:after {
    left: 2px !important
}

.add-line-table tr:not(:last-child).hovered-row {
    position: relative
}

    .add-line-table tr:not(:last-child).hovered-row:after {
        background-color: #116e63;
        bottom: 6px;
        content: "";
        display: block;
        height: 1px;
        left: 0;
        position: absolute;
        right: 0
    }

    .add-line-table tr:not(:last-child).hovered-row .add-icon-container > span {
        bottom: -12px;
        cursor: pointer;
        display: block;
        position: absolute;
        right: -12px;
        z-index: 1
    }

        .add-line-table tr:not(:last-child).hovered-row .add-icon-container > span svg {
            background-color: #116e63;
            border-radius: 14px;
            font-size: 20px
        }

            .add-line-table tr:not(:last-child).hovered-row .add-icon-container > span svg path:first-child {
                color: #fff
            }

            .add-line-table tr:not(:last-child).hovered-row .add-icon-container > span svg path:last-child {
                color: #116e63
            }

    .add-line-table tr:not(:last-child).hovered-row .ant-table-cell-row-hover {
        border-bottom: 1px solid #116e63
    }

.react-resizable-handle {
    bottom: 0;
    cursor: col-resize;
    height: 100%;
    position: absolute;
    right: -5px;
    width: 10px;
    z-index: 1
}

.select-container {
    width: 100%
}

    .select-container .input-container {
        border: 1px solid;
        border-radius: 10px;
        display: flex
    }

        .select-container .input-container .ant-select-disabled .ant-select-arrow svg path {
            stroke: #dbdbe0
        }

    .select-container .label-container {
        display: flex;
        flex-direction: row;
        font-size: 14px;
        font-weight: 500;
        line-height: 25.6px;
        margin-bottom: 8px;
        text-align: center
    }

        .select-container .label-container .require {
            color: #f03d3e;
            margin-left: 4px
        }

    .select-container .select-input {
        align-items: center;
        display: flex;
        font-size: 14px;
        font-weight: 400;
        width: 100%
    }

    .select-container .ant-select-selection-item {
        display: flex
    }

    .select-container .right-children {
        border-left: 1px solid #9e9fac
    }

.dropdown-custom {
    min-width: 445px !important
}

    .dropdown-custom .ant-input-affix-wrapper {
        width: 100%
    }

    .dropdown-custom .add-new-option {
        color: #116e63
    }

.upload-file-container .btn-upload {
    align-items: center;
    background: #fff;
    border: 1px solid #116e63;
    border-radius: 6px;
    color: #116e63;
    display: flex;
    font-family: NotoSansJP, sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    height: 32px;
    justify-content: center;
    line-height: 160%
}

    .upload-file-container .btn-upload:disabled {
        background: #fff;
        border: 1px solid #b8d4d0;
        color: #b8d4d0
    }

.upload-file-container .upload-file-item {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    color: #12212e;
    cursor: pointer;
    height: 40px;
    padding: 7px
}

.upload-file-container .upload-file-item,
.upload-file-container .waiting-approve-label {
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.upload-file-container .waiting-approve-label {
    color: #f2a227;
    margin-bottom: 6px
}

.upload-file-container .name-file {
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}

.upload-file-container .upload-file-item-watting-for-approved {
    border: 1px solid #f2a227
}

.upload-file-container .upload-file-item-approved {
    border: 1px solid #36b368
}

.upload-file-container .upload-file-item-rejected {
    border: 1px solid #f03d3e
}

.upload-file-container .file-public {
    border: 1px solid #dbdbe0
}

.modal-confirm-upload-file .modal-confirm-upload-file-title {
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    padding: 16px;
    text-align: center;
    text-transform: capitalize
}

.modal-confirm-upload-file .modal-confirm-upload-file-des {
    color: #525a68;
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    text-align: center
}

.btn-modal-confirm-upload-file {
    border-radius: 14px;
    height: 50px
}

.cancel-confirm-popup-content .base-button {
    border-radius: 14px
}

    .cancel-confirm-popup-content .base-button .ant-btn-primary.ant-btn-dangerous {
        background-color: #f03d3e
    }

.required-document-pdf {
    font-family: Noto Sans JP
}

    .required-document-pdf .file-header {
        color: #12212e;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%
    }

    .required-document-pdf .file-body .title {
        color: #12212e;
        font-size: 20px
        font-style: normal;
        font-weight: 700;
        line-height: 120%;
        margin: 24px 0;
        text-transform: capitalize
    }

    .required-document-pdf .warning td {
        background-color: #fef6e9 !important
    }

        .required-document-pdf .warning td:first-child {
            border-left: 8px solid #f2a227 !important
        }

    .required-document-pdf .danger td {
        background-color: #feecec !important
    }

        .required-document-pdf .danger td:first-child {
            border-left: 8px solid #f03d3e !important
        }

    .required-document-pdf table td.ant-table-cell .upload-file-container div div:nth-child(2) {
        text-align: left
    }

    .required-document-pdf .ant-table-wrapper .ant-table-tbody > tr > td,
    .required-document-pdf .base-table .base-table-data th.ant-table-cell {
        text-align: center
    }

.login {
    display: flex
}

    .login .login-form {
        margin: auto;
        text-align: center;
        top: 150px;
        position: relative;
    }

        .login .login-form .title {
            color: #12212e;
            font-size: 40px;
            font-weight: 700;
            /*margin: 19px 0 24px;*/
            text-align: center;
            letter-spacing: 3.5px;
        }

        .login .login-form .error-message {
            color: #f03d3e;
            font-size: 14px;
            font-weight: 400;
            /*margin-bottom: 24px*/
        }

        .login .login-form .form {
            width: 100%;
        }
       

            .login .login-form .form .form-item {
                margin-bottom: 24px
            }

                .login .login-form .form .form-item.ant-form-item .ant-form-item-label > label.ant-form-item-required:before {
                    content: none
                }

                .login .login-form .form .form-item.ant-form-item .ant-form-item-explain-error {
                    margin-left: -8px !important;
                    color: #f03d3e;
                    text-align: left
                }

            .login .login-form .form .password {
                margin-bottom: 8px !important;
            }

                .login .login-form .form .password.ant-form-item .ant-form-item-explain-error {
                    /*margin: 7px 0 8px 0 !important*/
                }

                    .login .login-form .form .password.ant-form-item .ant-form-item-explain-error #user_password {
                        margin-top: 7px !important;
                        /*margin-left: 10px !important;*/
                    }

                    .login .login-form .form .password.ant-form-item .ant-form-item-explain-error .val-error-message {
                        margin-left: 0px !important;
                        margin-top: 4px !important
                    }

            .login .login-form .form .forgot-your-password {
                text-align: left
            }

                .login .login-form .form .forgot-your-password span {
                    color: #116e63;
                    font-size: 14px;
                    font-weight: 600;
                    text-decoration: underline
                }

                    .login .login-form .form .forgot-your-password span:hover {
                        cursor: pointer
                    }

            .login .login-form .form .input {
                font-size: 14px;

*/
            }
            .login .login-form .form input {
                font-size: 14px;
                height: 38px !important;
                /*    padding: 10px 16px
*/
            }


    .login .image-banner {
        display: flex;
        height: 100vh;
        width: 50%
    }

    .login .icon {
        color: #f03d3e
    }

    .login .label {
        color: #12212e;
        font-size: 14px;
        font-weight: 500
    }

.login-modal {
    width: 570px !important
}

    .login-modal .modal-title {
        color: #12212e;
        font-size: 20px
        font-weight: 700;
        margin-bottom: 16px;
        text-align: center
    }

    .login-modal .image {
        display: flex;
        margin: 12px auto auto
    }

    .login-modal .content-modal-style {
        color: #525a68;
        font-size: 14px;
        font-weight: 500;
        margin-bottom: 24px;
        padding: 0 60px;
        text-align: center;
        white-space: pre-line
    }

    .login-modal .footer {
        display: flex;
        margin-bottom: 12px
    }

.wrapper {
    display: flex;
    height: 100vh
}

    .wrapper .wrapper-content {
        margin: auto;
        text-align: center
    }

        .wrapper .wrapper-content .registration-content {
            color: #12212e;
            font-size: 20px
            font-weight: 700;
            margin-top: 11px
        }

        .wrapper .wrapper-content .please-try-again-content {
            color: #525a68;
            font-size: 14px;
            font-weight: 500;
            margin: 16px 0 24px;
            white-space: pre-line
        }

.privacy-policy {
    display: flex;
    height: 100vh;
    text-align: left;
    background: url("../img/background_privacy.svg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

    .privacy-policy .content,
    .privacy-policy .privacy-policy-content .content-next,
    .privacy-policy .privacy-policy-content .content-one {
        color: #12212e;
        font-size: 14px;
        font-weight: 400
    }

    .privacy-policy .privacy-policy-content {
        box-shadow: 0 8px 22px -6px rgba(24, 39, 75, .01), 0 14px 64px -4px rgba(24, 39, 75, .12);
        display: flex;
        flex-direction: column;
        margin: auto;
        padding: 0;
        width: 874px
    }

        .privacy-policy .privacy-policy-content .title {
            background: #116e63;
            border-radius: 14px 14px 0 0;
            color: #fff;
            font-size: 20px;
            font-weight: 700;
            padding: 24px 0 24px 24px;
            text-align: left
        }

        .privacy-policy .privacy-policy-content .content-one {
            margin: 24px 24px 0
        }

        .privacy-policy .privacy-policy-content .content-next {
            margin: 16px 24px 0
        }

        .privacy-policy .privacy-policy-content .footer {
            align-items: center;
            display: flex;
            justify-content: center;
            padding-bottom: 24px;
            padding-top: 24px
        }

.project-list {
    background: #f5f5f7;
    display: flex;
    flex-direction: column;
    font-family: Noto Sans JP;
    max-height: 996px
}

    .project-list .project-list-pg-header .top {
        display: flex;
        justify-content: space-between;
        padding-bottom: 24px
    }

        .project-list .project-list-pg-header .top .base-button-container button {
            align-items: center;
            display: flex;
            gap: 10px;
            justify-content: center
        }

        .project-list .project-list-pg-header .top .title {
            color: #12212e;
            font-size: 32px;
            font-style: normal;
            font-weight: 700;
            line-height: 120%;
            text-transform: capitalize
        }

        .project-list .project-list-pg-header .top .add-new-btn {
            align-items: center;
            background: #116e63;
            border-radius: 14px;
            color: #fff;
            cursor: pointer;
            display: flex;
            flex-direction: row;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            gap: 12px;
            height: 50px;
            justify-content: center;
            line-height: 160%;
            padding: 8px 16px;
            text-transform: capitalize;
            width: 128px
        }

    .project-list .project-list-pg-header .bottom {
        color: #12212e;
        display: flex;
        justify-content: space-between;
        padding-bottom: 16px
    }

        .project-list .project-list-pg-header .bottom .search {
            position: relative
        }

            .project-list .project-list-pg-header .bottom .search input {
                background: #fff;
                border: 1px solid #9e9fac;
                border-radius: 10px;
                height: 40px;
                padding: 8px 48px;
                width: 493px
            }

                .project-list .project-list-pg-header .bottom .search input:focus-visible {
                    outline: none
                }

            .project-list .project-list-pg-header .bottom .search svg {
                left: 15px;
                position: absolute;
                top: 8px
            }

        .project-list .project-list-pg-header .bottom .fitler-btn > span {
            align-items: center;
            background: #fff;
            border: 1px solid #9e9fac;
            border-radius: 10px;
            cursor: pointer;
            display: flex;
            flex-direction: row;
            gap: 12px;
            height: 40px;
            justify-content: space-between;
            padding: 8px 16px 8px 20px;
            width: 180px
        }

    .project-list .page-data {
        padding-top: 16px
    }

        .project-list .page-data .base-table tr td:first-child {
            padding-left: 16px
        }

        .project-list .page-data .base-table tr .ant-table-cell.visiable-hover {
            position: relative
        }

            .project-list .page-data .base-table tr .ant-table-cell.visiable-hover .hover-actions {
                align-items: center;
                background: none;
                display: flex;
                flex-direction: row;
                gap: 24px;
                height: 57px;
                justify-content: center;
                left: 86px;
                padding: 16px;
                position: absolute;
                top: 0;
                visibility: hidden;
                width: 136px;
                z-index: 10
            }

                .project-list .page-data .base-table tr .ant-table-cell.visiable-hover .hover-actions svg {
                    cursor: pointer
                }

        .project-list .page-data .base-table tr:hover .hover-actions {
            visibility: visible !important
        }

    .project-list .filter-button button {
        border: 1px solid #9e9fac;
        color: #12212e;
        font-family: NotoSansJP, sans-serif;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 160%
    }

    .project-list .filter-button svg path {
        fill: none !important
    }

    .project-list .filter-button .filter-number {
        align-items: center;
        background: #f03d3e;
        border: 2px solid #fff;
        border-radius: 12px;
        color: #fff;
        display: flex;
        flex-direction: column;
        font-size: 13px;
        font-weight: 700;
        height: 21px;
        justify-content: center;
        position: absolute;
        right: -10px;
        top: -9px;
        width: 26px;
        z-index: 1
    }

    .project-list .icon-down {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    .project-list .icon-down,
    .project-list .icon-up {
        transition: -webkit-transform .3s ease-in-out;
        transition: transform .3s ease-in-out;
        transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
    }

    .project-list .icon-up {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

.mot-pick .mot-pick-select {
    width: 130px
}

    .mot-pick .mot-pick-select .ant-select-selector {
        border: 1px solid #9e9fac;
        border-radius: 14px;
        height: 50px
    }

        .mot-pick .mot-pick-select .ant-select-selector .ant-select-selection-item {
            display: flex;
            flex-direction: column;
            justify-content: center
        }

            .mot-pick .mot-pick-select .ant-select-selector .ant-select-selection-item:after {
                content: none
            }

.icon-down {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

.icon-down,
.icon-up {
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
}

.icon-up {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.beauty-select-option,
.beauty-select-option .select-item {
    display: flex;
    justify-content: center
}

    .beauty-select-option .select-item {
        border: 1px solid #000;
        border-radius: 10px;
        flex-direction: column;
        height: 40px;
        text-align: center;
        width: 80%
    }

        .beauty-select-option .select-item.blank {
            background: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #525a68
        }

        .beauty-select-option .select-item.processing {
            background: rgba(7, 108, 227, .1);
            border: 1px solid #076ce3;
            color: #076ce3
        }

        .beauty-select-option .select-item.inactive {
            background: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #525a68
        }

        .beauty-select-option .select-item.new {
            background: #fef6e9;
            border: 1px solid #f2a227;
            color: #f2a227
        }

        .beauty-select-option .select-item.completed {
            background: rgba(54, 179, 104, .1);
            border: 1px solid #36b368;
            color: #36b368
        }

        .beauty-select-option .select-item.cancel {
            background: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #525a68
        }

        .beauty-select-option .select-item.progress {
            background: rgba(7, 108, 227, .1);
            border: 1px solid #076ce3;
            color: #076ce3
        }

        .beauty-select-option .select-item.unfinished {
            background: rgba(240, 61, 62, .1);
            border: 1px solid #f03d3e;
            color: #f03d3e
        }

        .beauty-select-option .select-item.active {
            background: rgba(54, 179, 104, .1);
            border: 1px solid #36b368;
            color: #36b368
        }

        .beauty-select-option .select-item.not-start {
            background: #f5f5f7;
            border: 1px solid #9e9fac;
            color: #525a68
        }

        .beauty-select-option .select-item.visa-issuance {
            background: rgba(123, 97, 255, .1);
            border: 1px solid #7b61ff;
            color: #7b61ff
        }

.filter {
    background-color: #fff;
    border-radius: 14px;
    box-shadow: 0 8px 22px -6px rgba(24, 39, 75, .01), 0 14px 64px -4px rgba(24, 39, 75, .12);
    box-sizing: border-box;
    font-family: NotoSansJP, sans-serif;
    height: 778px;
    padding: 32px 24px;
    width: 798px
}

    .filter .header {
        font-size: 20px;
        font-weight: 700;
        line-height: 140%;
        margin-bottom: 24px;
        text-align: left
    }

    .filter .row {
        display: flex;
        justify-content: space-between;
        margin-bottom: 15px;
        width: 100%
    }

        .filter .row .ant-select-selection-placeholder {
            align-items: center;
            display: inline-flex
        }

        .filter .row span.spacer {
            align-self: center;
            background: #525a68;
            display: inline-block;
            height: 2px;
            margin-top: 20px;
            width: 18px
        }

        .filter .row .item {
            height: 87px;
            width: 367px
        }

            .filter .row .item label {
                color: #12212e;
                font-size: 14px;
                font-weight: 600
            }

            .filter .row .item .ant-picker {
                width: 100%
            }

            .filter .row .item .created-date .ant-form-item {
                padding-top: 30px !important
            }

            .filter .row .item .disabled-reset {
                background: #f5f5f7;
                border: 1px solid #dbdbe0;
                border-radius: 14px;
                color: #dbdbe0;
                cursor: not-allowed
            }

            .filter .row .item input[type=text] {
                border-radius: 10px;
                height: 44px;
                padding-left: 16px
            }

        .filter .row .ant-picker,
        .filter .row .ant-select-selector {
            border: 1px solid #9e9fac;
            border-radius: 10px;
            height: 44px
        }

            .filter .row .ant-picker:after,
            .filter .row .ant-select-selector:after {
                content: none
            }

            .filter .row .ant-picker .ant-select-selection-item,
            .filter .row .ant-select-selector .ant-select-selection-item {
                display: flex;
                flex-direction: column;
                justify-content: center
            }

                .filter .row .ant-picker .ant-select-selection-item:after,
                .filter .row .ant-select-selector .ant-select-selection-item:after {
                    content: none
                }

        .filter .row .schedule-travel-date {
            width: 347px
        }

            .filter .row .schedule-travel-date.created-date .ant-form-item {
                margin-top: 30px
            }

.filter-items {
    display: flex;
    flex-wrap: wrap;
    gap: 16px
}

    .filter-items .item {
        align-items: center;
        background: #dbdbe0;
        border-radius: 10px;
        display: inline-flex !important;
        flex-direction: row;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        gap: 8px;
        height: 40px;
        line-height: 160%;
        padding: 8px 16px
    }

        .filter-items .item svg {
            cursor: pointer
        }

.template-list {
    height: 996px
}

    .template-list .page-header {
        align-items: center;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        margin-bottom: 24px;
        padding: 0
    }

        .template-list .page-header .title {
            color: #12212e;
            font-size: 32px;
            font-style: normal;
            font-weight: 700;
            line-height: 120%;
            text-transform: capitalize
        }

        .template-list .page-header button {
            align-items: center;
            display: flex;
            gap: 10px;
            justify-content: center
        }

    .template-list .page-content .delete-rows-info {
        display: flex;
        justify-content: space-between
    }

        .template-list .page-content .delete-rows-info .number-items {
            align-items: center;
            color: #12212e;
            display: flex;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 160%
        }

        .template-list .page-content .delete-rows-info .trash-items {
            align-items: center;
            background: #fff;
            border: 1px solid #9e9fac;
            border-radius: 10px;
            cursor: pointer;
            display: flex;
            flex-direction: row;
            gap: 12px;
            height: 40px;
            justify-content: center;
            padding: 8px 20px 8px 16px;
            width: 107px
        }

    .template-list .page-content .data-table {
        padding-top: 16px
    }

        .template-list .page-content .data-table thead th:nth-child(2) {
            padding-left: 8px
        }

        .template-list .page-content .data-table tbody tr.table-toggle-header td {
            background: #e7f1ef;
            border-bottom: 1px solid #dbdbe0
        }

            .template-list .page-content .data-table tbody tr.table-toggle-header td:nth-child(2) {
                padding-left: 8px
            }

            .template-list .page-content .data-table tbody tr.table-toggle-header td.ant-table-cell svg.icon-toggle {
                left: -32px;
                position: absolute;
                top: 25px;
                transition: -webkit-transform .5s;
                transition: transform .5s;
                transition: transform .5s, -webkit-transform .5s
            }

            .template-list .page-content .data-table tbody tr.table-toggle-header td.ant-table-cell svg.expand {
                -webkit-transform: rotate(180deg);
                transform: rotate(180deg)
            }

            .template-list .page-content .data-table tbody tr .ant-table-cell.ant-table-cell-with-append button.ant-table-row-expand-icon,
            .template-list .page-content .data-table tbody tr.table-toggle-header td.ant-table-selection-column label {
                display: none
            }

        .template-list .page-content .data-table tbody tr .ant-table-cell a.base-table-template-name {
            text-decoration: underline
        }

        .template-list .page-content .data-table tbody tr .ant-table-cell.visiable-hover {
            position: relative
        }

            .template-list .page-content .data-table tbody tr .ant-table-cell.visiable-hover .hover-actions {
                align-items: center;
                background: #f5f5f5;
                bottom: 0;
                display: flex;
                flex-direction: row;
                gap: 24px;
                height: 57px;
                justify-content: center;
                left: 0;
                margin: auto;
                padding: 16px;
                position: absolute;
                right: 0;
                top: 0;
                visibility: hidden;
                width: 136px;
                z-index: 10
            }

                .template-list .page-content .data-table tbody tr .ant-table-cell.visiable-hover .hover-actions svg {
                    cursor: pointer
                }

        .template-list .page-content .data-table tbody tr:hover .hover-actions {
            visibility: visible !important
        }

        .template-list .page-content .data-table .d-none {
            display: none
        }

    .template-list .base-table-data .ant-table-row .ant-table-cell {
        padding-left: 8px
    }

    .template-list .base-table-data .ant-table-row .ant-table-row-indent {
        padding-left: 0 !important
    }

.base-filter {
    font-family: NotoSansJP, sans-serif
}

    .base-filter .filter-data {
        align-items: flex-start;
        display: flex;
        flex-direction: row;
        gap: 16px;
        justify-content: space-between;
        padding: 0;
        width: 100%
    }

        .base-filter .filter-data .keyword {
            align-items: center;
            display: flex;
            flex-direction: row;
            position: relative
        }

            .base-filter .filter-data .keyword input {
                align-items: center;
                background: #fff;
                border: 1px solid #9e9fac;
                border-radius: 10px;
                display: flex;
                flex-direction: row;
                gap: 8px;
                height: 40px;
                padding: 8px 48px;
                width: 493px
            }

                .base-filter .filter-data .keyword input:focus {
                    outline: none
                }

            .base-filter .filter-data .keyword svg {
                left: 15px;
                position: absolute;
                top: 8px
            }

        .base-filter .filter-data .dropdown {
            align-items: center;
            background: #fff;
            border: 1px solid #9e9fac;
            border-radius: 10px;
            cursor: pointer;
            display: flex;
            flex-direction: row;
            gap: 12px;
            justify-content: space-between;
            min-width: 180px;
            padding: 8px 16px 8px 20px;
            position: relative
        }

            .base-filter .filter-data .dropdown .number-items {
                align-items: center;
                background: #f03d3e;
                border: 2px solid #fff;
                border-radius: 12px;
                color: #fff;
                display: flex;
                font-size: 13px;
                font-style: normal;
                font-weight: 400;
                gap: 10px;
                height: 21px;
                justify-content: center;
                line-height: 160%;
                padding: 0 4px;
                position: absolute;
                right: -11px;
                text-align: center;
                top: -12px;
                width: 26px
            }

    .base-filter .fiter-items {
        padding-top: 16px
    }

        .base-filter .fiter-items .item {
            align-items: center;
            background: #dbdbe0;
            border-radius: 10px;
            color: #12212e;
            display: inline-flex !important;
            flex-direction: row;
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            gap: 8px;
            line-height: 160%;
            margin-right: 16px;
            padding: 8px 16px
        }

            .base-filter .fiter-items .item svg {
                cursor: pointer
            }

        .base-filter .fiter-items .clear-btn {
            align-items: center;
            background: #fff;
            border: 1px solid #116e63;
            border-radius: 10px;
            color: #116e63;
            cursor: pointer;
            display: inline-flex !important;
            flex-direction: row;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            gap: 10px;
            justify-content: center;
            line-height: 160%;
            padding: 8px 16px
        }

.template-filter-form {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 8px 22px -6px rgba(24, 39, 75, .01), 0 14px 64px -4px rgba(24, 39, 75, .12);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    font-family: Noto Sans JP;
    height: 472px;
    padding: 32px 24px;
    width: 640px
}

    .template-filter-form .header {
        color: #12212e;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: 140%;
        margin-bottom: 24px;
        text-transform: capitalize
    }

    .template-filter-form .row {
        display: flex;
        justify-content: space-between;
        margin-bottom: 24px
    }

        .template-filter-form .row .ant-select-selection-item {
            align-items: center;
            display: flex
        }

        .template-filter-form .row .ant-form-item-label {
            align-items: flex-start;
            display: flex;
            flex-direction: row;
            gap: 4px;
            height: 26px;
            padding: 0;
            width: 112px
        }

            .template-filter-form .row .ant-form-item-label > label {
                color: #12212e;
                font-size: 14px;
                font-style: normal;
                font-weight: 500 !important;
                line-height: 160%
            }

        .template-filter-form .row .row-item {
            height: 78px !important;
            width: 288px
        }

            .template-filter-form .row .row-item button {
                align-items: center;
                border-radius: 14px;
                display: flex;
                flex-direction: row;
                font-size: 14px;
                font-weight: 700;
                height: 50px;
                justify-content: center;
                line-height: 160%;
                padding: 8px 16px;
                text-transform: capitalize;
                width: 288px
            }

            .template-filter-form .row .row-item .btn-aply {
                background: #116e63;
                color: #fff
            }

            .template-filter-form .row .row-item .btn-reset {
                border: 1px solid #dbdbe0;
                color: #12212e;
                font-weight: 600
            }

            .template-filter-form .row .row-item .disabled {
                background: #f5f5f7;
                color: #dbdbe0;
                cursor: not-allowed
            }

            .template-filter-form .row .row-item .ant-input {
                background: #fff;
                border-radius: 10px;
                font-size: 14px;
                height: 44px;
                padding: 10px 16px
            }

            .template-filter-form .row .row-item .ant-select-selector {
                background: #fff;
                border: 1px solid #9e9fac;
                border-radius: 10px;
                font-size: 14px;
                height: 44px
            }

                .template-filter-form .row .row-item .ant-select-selector input {
                    height: 100%
                }

                .template-filter-form .row .row-item .ant-select-selector .ant-select-selection-placeholder {
                    align-items: center;
                    display: inline-flex
                }

            .template-filter-form .row .row-item .ant-form-item-control-input .ant-picker {
                background: #fff;
                border: 1px solid #9e9fac;
                border-radius: 10px;
                height: 44px;
                width: 100%
            }

        .template-filter-form .row .ant-picker .ant-picker-input input {
            font-size: 14px
        }

.ant-modal-content {
    font-family: Noto Sans JP;
    height: 411px;
    padding: 32px 24px;
    text-align: center;
    width: 565px
}

    .ant-modal-content .modal-content .img {
        margin-bottom: 16px;
        margin-top: 40px
    }

    .ant-modal-content .modal-content .title {
        color: #12212e;
        font-size: 20px
        font-style: normal;
        font-weight: 700;
        line-height: 120%;
        margin-bottom: 16px;
        text-transform: capitalize
    }

    .ant-modal-content .modal-content .description {
        color: #525a68;
        font-size: 14px;
        font-weight: 500;
        line-height: 160%;
        margin-bottom: 24px;
        text-align: center
    }

    .ant-modal-content .ant-modal-footer {
        display: flex;
        justify-content: space-between
    }

        .ant-modal-content .ant-modal-footer button {
            align-items: center;
            border-radius: 14px;
            font-size: 14px;
            font-style: normal;
            font-weight: 600;
            gap: 10px;
            height: 50px;
            line-height: 160%;
            padding: 8px 16px;
            text-transform: capitalize;
            width: 250.5px
        }

        .ant-modal-content .ant-modal-footer .btn-cancel {
            background: #fff;
            border: 1px solid #9e9fac;
            color: #12212e
        }

        .ant-modal-content .ant-modal-footer .btn-confirm {
            background: #f03d3e;
            color: #fff
        }

.no-data {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-family: Noto Sans JP;
    height: 469px;
    justify-content: center;
    padding: 40px 0;
    width: 100%
}

    .no-data svg.icon-no-data {
        margin-bottom: 16px
    }

    .no-data .title {
        color: #12212e;
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 140%;
        margin-bottom: 16px
    }

    .no-data .description {
        color: #525a68;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 160%;
        margin-bottom: 16px;
        text-align: center
    }

    .no-data .add-btn button {
        align-items: center;
        background: #116e63;
        border: none;
        border-radius: 14px;
        color: #fff;
        cursor: pointer;
        display: flex;
        font-size: 14px;
        font-weight: 700;
        height: 50px;
        justify-content: space-between;
        line-height: 160%;
        padding: 8px 20px 8px 16px;
        text-transform: capitalize;
        width: 132px
    }

.template-layout .template-panel-header {
    color: #12212e;
    font-family: NotoSansJP, sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    text-transform: capitalize
}

.template-layout .ant-collapse-content .ant-collapse-content-box {
    max-height: 900px;
    overflow-y: auto;
    padding: 30px 24px
}

.template-layout .ant-collapse .ant-collapse-item,
.template-layout .ant-collapse-borderless {
    background-color: #fff
}

    .template-layout .ant-collapse .ant-collapse-item .ant-collapse-header {
        align-items: center;
        padding: 30px 24px
    }

.template-layout .ant-table-wrapper .ant-table-container .ant-table-header table {
    border-radius: 16px 16px 0 0
}

    .template-layout .ant-table-wrapper .ant-table-container .ant-table-header table tr th {
        padding: 16px
    }

.template-layout .ant-table-wrapper .ant-table-container .ant-table-body table {
    border-radius: 0 0 16px 16px
}

    .template-layout .ant-table-wrapper .ant-table-container .ant-table-body table tr td.ant-table-selection-column {
        padding: 16px
    }

.template-layout .ant-table-wrapper .ant-table-container table {
    border: 1px solid #dbdbe0;
    border-radius: 16px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08)
}

    .template-layout .ant-table-wrapper .ant-table-container table thead tr th:first-child {
        border-radius: 14px 0 0 0
    }

    .template-layout .ant-table-wrapper .ant-table-container table thead tr th:last-child {
        border-radius: 0 14px 0 0
    }

    .template-layout .ant-table-wrapper .ant-table-container table tbody tr:last-child td:first-child {
        border-radius: 0 0 0 14px
    }

    .template-layout .ant-table-wrapper .ant-table-container table tbody tr:last-child td:last-child {
        border-radius: 0 0 14px 0
    }

.template-layout .template-filter-ref {
    border-left: 1px solid #ccc
}

.template-header {
    height: 100px
}

.template-content {
    height: calc(100% - 100px);
    overflow-y: auto
}

main .container-breadcrumb {
    display: flex;
    gap: 15.5px;
    justify-content: left
}

main .container-breadcrumb-link {
    color: #9e9fac;
    font-size: 14px;
    font-weight: 400
}

    main .container-breadcrumb-link.hover-underline:hover {
        text-decoration: underline
    }

    main .container-breadcrumb-link.cursor-unset {
        cursor: default
    }

    main .container-breadcrumb-link.active {
        color: #12212e;
        font-size: 14px;
        font-weight: 400
    }

main .container .container-breadcrumb-link {
    cursor: pointer
}

    main .container .container-breadcrumb-link:hover {
        text-decoration: underline
    }

.disabled-link {
    pointer-events: none
}

.container-title {
    align-items: center;
    color: #fff;
    display: flex;
    gap: 17px;
    line-height: 0;
    margin-bottom: 25px;
    margin-top: 25px;
    position: relative
}

    .container-title a img {
        margin-top: 5px
    }

    .container-title h1 {
        color: #12212e;
        font-size: 31px;
        font-weight: 700
    }

        .container-title h1.h1-create-new {
            color: #9e9fac
        }

    .container-title button.container-title-btn {
        padding: 8px 16px
    }

    .container-title button.btn-create,
    .container-title button.container-title-btn {
        background-color: #116e63;
        background-image: none;
        border: none;
        border-radius: 14px;
        color: #fff;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        height: 50px;
        position: absolute;
        right: 0;
        width: 158px
    }

    .container-title button.btn-create {
        align-items: center;
        background-image: url(/static/media/Plus.0f90715f634094d3c41f.svg);
        background-position: center left 16px;
        background-repeat: no-repeat;
        display: flex;
        padding: 8px 16px 8px 50px
    }

    .container-title span {
        display: flex;
        gap: 16px;
        position: absolute;
        right: 0
    }

        .container-title span button {
            background-color: #116e63;
            background-image: none;
            border: none;
            border-radius: 14px;
            color: #fff;
            cursor: pointer;
            font-size: 14px;
            font-weight: 700;
            height: 50px;
            padding: 8px 16px;
            width: 158px
        }

            .container-title span button.btn-cancel,
            .container-title span button.btn-delete {
                background-color: #fff;
                color: #12212e
            }

.questionnaire .input_answer {
    border-radius: 0 !important
}

    .questionnaire .input_answer:focus,
    .questionnaire .input_answer:hover {
        border-bottom: 2px solid #116e63 !important
    }

.questionnaire .input-options:disabled {
    color: rgba(13, 16, 47, .878) !important
}

    .questionnaire .input-options:disabled:focus,
    .questionnaire .input-options:disabled:hover {
        border-bottom: none !important
    }

.questionnaire .select_children .ant-select-selector {
    height: 40px !important
}

    .questionnaire .select_children .ant-select-selector .ant-select-selection-item,
    .questionnaire .select_children .ant-select-selector .ant-select-selection-placeholder {
        align-items: center;
        display: flex
    }

.questionnaire .seclect--ellipsis .ant-select-selector .ant-select-selection-placeholder {
    display: inline-block !important;
    padding-top: 10px !important
}

.questionnaire .text-primary {
    color: #116e63
}

.questionnaire .text-yellow {
    color: #f2a227
}

.questionnaire .question_child_tree {
    position: relative
}

    .questionnaire .question_child_tree:before {
        border-bottom: 1px solid #9e9fac;
        border-left: 1px solid #9e9fac;
        content: "";
        counter-increment: item;
        height: 41px;
        left: 11px;
        position: absolute;
        top: -25px;
        width: 20px
    }

    .questionnaire .question_child_tree:after {
        border-left: 1px solid #9e9fac;
        border-top: 1px solid #9e9fac;
        content: "";
        height: 100%;
        left: 11px;
        position: absolute;
        top: 16px;
        width: 14px
    }

    .questionnaire .question_child_tree .option_child_tree {
        position: relative
    }

        .questionnaire .question_child_tree .option_child_tree:before {
            border-bottom: 1px solid #9e9fac;
            border-left: 1px solid #9e9fac;
            content: "";
            counter-increment: item;
            height: 46px;
            left: -14px;
            position: absolute;
            top: -13px;
            width: 15px
        }

        .questionnaire .question_child_tree .option_child_tree:after {
            border-left: 1px solid #9e9fac;
            border-top: 1px solid #9e9fac;
            content: "";
            height: 100%;
            left: -14px;
            position: absolute;
            top: 33px;
            width: 14px
        }

        .questionnaire .question_child_tree .option_child_tree:last-of-type:after,
        .questionnaire .question_child_tree:last-child:after {
            display: none
        }

.questionnaire .ant-collapse-header {
    align-items: center !important
}

.questionnaire .ant-form-item {
    margin-bottom: 4px
}

.questionnaire .border-bottom {
    border-bottom: 1px solid #9e9fac;
    border-radius: 0 !important
}

.questionnaire .section__title__header {
    background-color: #0c4d45;
    border-radius: 14px 14px 0 0;
    color: #fff;
    height: 50px;
    padding: 8px 16px;
    width: auto
}

.questionnaire .section__title__content {
    background-color: #f5f5f7;
    border-radius: 0 14px 14px 14px;
    border-top: 8px solid #0c4d45;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    display: flex;
    flex-direction: column;
    justify-content: left;
    padding: 24px
}

.questionnaire .section__questions .question-card {
    display: flex;
    flex-direction: column;
    justify-content: left;
    margin-top: 24px;
    position: relative
}

.questionnaire .section__questions .question-card__content {
    background-color: #f5f5f7;
    border-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 24px
}

.questionnaire .section__questions .question-card__content__header .ant-select-selector {
    height: 60px !important
}

    .questionnaire .section__questions .question-card__content__header .ant-select-selector .ant-select-selection-item,
    .questionnaire .section__questions .question-card__content__header .ant-select-selector .ant-select-selection-placeholder {
        align-items: center;
        display: flex
    }

.questionnaire .section__questions .question-card__content__answer .ant-select-selector {
    height: 40px !important
}

    .questionnaire .section__questions .question-card__content__answer .ant-select-selector .ant-select-selection-item,
    .questionnaire .section__questions .question-card__content__answer .ant-select-selector .ant-select-selection-placeholder {
        align-items: center;
        display: flex
    }

.questionnaire .section__questions .question-card__action {
    align-items: center;
    background: #fff;
    border: 1px solid #f5f5f7;
    border-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    display: flex;
    flex-direction: column;
    height: 133px;
    justify-content: space-around;
    position: absolute;
    right: -96px;
    top: 0;
    width: 72px
}

.questionnaire .section__questions .question-card__action-button {
    align-items: center;
    border-radius: 50%;
    display: flex;
    height: 40px;
    justify-content: center;
    width: 40px
}

    .questionnaire .section__questions .question-card__action-button:hover {
        background-color: #dbdbe0;
        cursor: pointer
    }

.questionnaire .section .active {
    border-left: 8px solid #116e63
}

.questionnaire .svg-disabled:hover {
    cursor: not-allowed
}

.confirm-modal {
    width: 570px !important
}

    .confirm-modal .modal-title {
        color: #12212e;
        font-size: 20px
        font-weight: 700;
        margin-bottom: 16px;
        text-align: center
    }

    .confirm-modal .image {
        display: flex;
        margin: 12px auto auto
    }

    .confirm-modal .content-modal-style {
        color: #525a68;
        font-size: 14px;
        font-weight: 500;
        margin-bottom: 24px;
        padding: 0 60px;
        text-align: center;
        white-space: pre-line
    }

    .confirm-modal .footer {
        display: flex;
        margin-bottom: 12px
    }

    .confirm-modal .btn_modal_confirm:hover {
        border-color: #f03d3e !important
    }

.text_date {
    padding: 10px 0 0;
    width: 305px
}

    .text_date .ant-picker-input {
        border-bottom: 1px solid #9e9fac;
        font-weight: 500;
        padding: 8px 0
    }

        .text_date .ant-picker-input::-webkit-input-placeholder {
            font-weight: 500
        }

        .text_date .ant-picker-input::placeholder {
            font-weight: 500
        }

.title-h3 {
    font-size: 20px
    line-height: 29px
}

.title-h3,
.title-h4 {
    color: #0d102f;
    font-family: NotoSansJP, sans-serif;
    font-style: normal;
    font-weight: 700
}

.title-h4 {
    font-size: 20px;
    line-height: 28px
}

.subtitle-1 {
    font-family: NotoSansJP, sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 25.2px
}

.subtitle-2 {
    font-weight: 500
}

.body-2,
.subtitle-2 {
    font-family: NotoSansJP, sans-serif;
    font-size: 14px;
    font-style: normal;
    line-height: 25.6px
}

.body-2 {
    font-weight: 400
}

* {
    font-family: NotoSansJP, sans-serif
}

main .container {
    background-color: #f5f5f7;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    gap: 24px;
    max-width: 100%;
    width: auto
}

    main .container h1,
    main .container h3,
    main .container p {
        margin: 0;
        padding: 0
    }

    main .container a,
    main .container button,
    main .container select,
    main .container svg {
        cursor: pointer
    }

main .container-title {
    align-items: center;
    color: #fff;
    display: flex;
    gap: 17px;
    line-height: 0;
    margin-bottom: 10px;
    position: relative
}

    main .container-title a img {
        margin-top: 5px
    }

    main .container-title a h1 {
        color: #12212e;
        font-size: 31px;
        font-weight: 700
    }

    main .container-title button#container-title-btn {
        background-color: #116e63;
        background-image: none;
        border: none;
        border-radius: 14px;
        color: #fff;
        cursor: pointer;
        font-size: 14px;
        font-weight: 700;
        height: 50px;
        padding: 8px 16px;
        position: absolute;
        right: 40px;
        width: 158px
    }

main .container-basic {
    background-color: #fff;
    border-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08)
}

    main .container-basic h3 {
        border-bottom: 1px solid #dbdbe0;
        border-radius: 14px 14px 0 0;
        display: flex;
        font-size: 20px;
        font-weight: 700;
        justify-content: left;
        padding: 32px 24px
    }

main .container-detail {
    background-color: #fff;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 24px
}

    main .container-detail h3 {
        border-bottom: 1px solid #dbdbe0;
        border-radius: 14px 14px 0 0;
        display: flex;
        font-size: 20px;
        font-weight: 700;
        justify-content: left;
        padding: 32px 24px
    }

main .container-detail-info {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 24px 24px 0
}

    main .container-detail-info span {
        display: flex;
        flex-direction: column;
        gap: 8px;
        justify-content: left;
        width: 50%
    }

        main .container-detail-info span label {
            display: flex;
            font-family: NotoSansJP, sans-serif;
            font-size: 14px;
            font-style: normal;
            font-weight: 500;
            justify-content: left
        }

        main .container-detail-info span input {
            background-color: #f5f5f7;
            border: 1px solid #dbdbe0;
            border-radius: 10px;
            height: 44px;
            outline: none;
            padding: 16px;
            width: 100%
        }

        main .container-detail-info span span {
            display: flex;
            flex-direction: row;
            gap: 0;
            width: 100%
        }

            main .container-detail-info span span select {
                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
                background-color: #f5f5f7;
                background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAALCAYAAAByF90EAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACySURBVHgBnc+9EcIwDAXgJ1WUGSEjsEI2cMmlcsNdyrBNOkIFHdkgIwAbZARqCgvbd3D82I7hdZal7yTARqm2wJ95zJLSuuDb4uQexqAaDt2UjdTrJROPYujMQ99fIb5eMmNUq6b8BYGQ2+jCfhNBZbEpF3tFRLA77ruWnp92mAkjCA6ZYmcGEO3q9NY0g8WQLyiFpZAgFMSENsxmG0OiUADziSFJ6BNLIVlxmKobPdd3B/w9dNWWMh50AAAAAElFTkSuQmCC);
                background-position: center right 16px;
                background-repeat: no-repeat;
                border: 1px solid #dbdbe0;
                border-radius: 10px;
                border-radius: 10px 0 0 10px;
                color: #525a68;
                flex: 3 1;
                font-size: 14px;
                font-weight: 400;
                height: 44px;
                outline: none;
                padding: 9px 16px;
                width: 100%
            }

                main .container-detail-info span span select option {
                    color: #9e9fac
                }

            main .container-detail-info span span span {
                align-items: center;
                background-color: #f5f5f7;
                border: 1px solid #dbdbe0;
                border-radius: 0 10px 10px 0;
                color: #9e9fac;
                display: flex;
                flex: 1 1;
                font-family: NotoSansJP, sans-serif;
                font-size: 14px;
                font-style: normal;
                font-weight: 500;
                gap: 8px;
                justify-content: left;
                justify-content: center
            }

main .container-detail-schedule {
    background-color: #fff;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 24px
}

    main .container-detail-schedule h3 {
        align-items: center;
        border-bottom: none;
        border-radius: 14px 14px 0 0;
        display: flex;
        font-size: 20px;
        font-weight: 700;
        gap: 15px;
        justify-content: left;
        padding: 0 24px
    }

main .container-detail-schedule-info {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center
}

main .container-detail-schedule-info-inprogress span {
    align-items: center;
    display: flex;
    gap: 21px;
    justify-content: left;
    padding-top: 10px 0
}

    main .container-detail-schedule-info-inprogress span h3 {
        align-items: center;
        background-color: #dbdbe0;
        border-radius: 22px;
        color: #525a68;
        display: flex;
        font-size: 10px;
        font-weight: 500;
        height: 25px;
        justify-self: center;
        padding: 10px;
        width: 25px
    }

    main .container-detail-schedule-info-inprogress span p {
        color: #12212e;
        font-size: 18px;
        font-weight: 500
    }

    main .container-detail-schedule-info-inprogress span span {
        display: flex;
        flex-direction: column;
        gap: 0;
        height: auto;
        justify-content: left;
        margin: 10px 0;
        padding-left: 45px;
        position: relative;
        white-space: pre
    }

        main .container-detail-schedule-info-inprogress span span p {
            color: #12212e;
            display: flex;
            font-size: 14px;
            font-weight: 400;
            justify-content: left;
            width: 150px
        }

        main .container-detail-schedule-info-inprogress span span:after {
            border-left: 1px solid #9e9fac;
            content: "";
            height: 56px;
            left: 12px;
            position: absolute;
            top: 8px
        }

        main .container-detail-schedule-info-inprogress span span.no-line-left:after {
            border-left: none;
            content: ""
        }

main .container-detail-require-document {
    background-color: #fff;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 24px
}

    main .container-detail-require-document h3 {
        align-items: center;
        border-bottom: none;
        border-radius: 14px 14px 0 0;
        display: flex;
        font-size: 20px;
        font-weight: 700;
        gap: 15px;
        justify-content: left;
        padding: 0 24px
    }

main .container-detail-require-document-tbl {
    padding: 24px
}

    main .container-detail-require-document-tbl table {
        border-collapse: collapse;
        box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
        color: #525a68;
        font-size: 14px;
        font-weight: 400;
        width: 100%
    }

        main .container-detail-require-document-tbl table thead {
            border: none
        }

        main .container-detail-require-document-tbl table input[type=checkbox] {
            background: #f5f5f7;
            border: 1px solid #dbdbe0;
            border-radius: 4px;
            box-sizing: border-box;
            height: 22px;
            width: 22px
        }

        main .container-detail-require-document-tbl table select {
            background: none;
            border: none;
            color: #525a68;
            font-size: 14px;
            height: auto;
            padding: 0
        }

        main .container-detail-require-document-tbl table tr th {
            background-color: #f5f5f7;
            border-left: 1px solid #dbdbe0;
            font-weight: 500;
            padding: 16px 24px;
            text-align: left;
            text-transform: uppercase
        }

            main .container-detail-require-document-tbl table tr th span {
                display: flex;
                justify-content: space-between
            }

                main .container-detail-require-document-tbl table tr th span.tbl-no {
                    align-items: center;
                    display: flex;
                    gap: 17px;
                    justify-content: left
                }

            main .container-detail-require-document-tbl table tr th:first-child {
                border-left: none;
                border-radius: 14px 0 0 0
            }

            main .container-detail-require-document-tbl table tr th:last-child {
                border-radius: 0 14px 0 0
            }

        main .container-detail-require-document-tbl table tr td {
            border: 1px solid #dbdbe0;
            padding: 16px 24px;
            text-align: left
        }

            main .container-detail-require-document-tbl table tr td span {
                align-items: center;
                display: flex;
                gap: 17px;
                justify-content: left
            }

            main .container-detail-require-document-tbl table tr td input[type=date]::-webkit-calendar-picker-indicator {
                display: none
            }

            main .container-detail-require-document-tbl table tr td input[type=date] {
                -webkit-appearance: none;
                appearance: none;
                background-image: url(/static/media/dateTime.203f80ae66ebe966a316.svg);
                background-position: center right 2px;
                background-repeat: no-repeat;
                border: none;
                cursor: pointer;
                height: auto;
                padding: 0;
                width: 100%
            }

            main .container-detail-require-document-tbl table tr td button {
                align-items: center;
                background-color: #fff;
                background-image: url(/static/media/UploadSimple.cda391856ddd9ff9ca7d.svg);
                background-position: center left 10px;
                background-repeat: no-repeat;
                border: 1px solid #b8d4d0;
                border-radius: 6px;
                color: #b8d4d0;
                display: flex;
                font-size: 13px;
                font-weight: 700;
                height: 32px;
                justify-content: right;
                max-width: 142px;
                min-width: 100px;
                padding: 8px 16px 8px 40px
            }

        main .container-detail-require-document-tbl table tbody {
            background-color: #fff
        }

main .container-detail-require-document-question {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 0 184px 0 124px
}

main .container-detail-require-document-question-section1 {
    display: flex;
    flex-direction: column
}

    main .container-detail-require-document-question-section1 p {
        background-color: #116e63;
        border-radius: 14px 14px 0 0;
        color: #fff;
        height: 50px;
        padding: 8px 16px;
        width: 158px
    }

    main .container-detail-require-document-question-section1 span {
        background-color: #f5f5f7;
        border-radius: 0 14px 14px 14px;
        border-top: 8px solid #116e63;
        box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
        color: #12212e;
        display: flex;
        font-size: 20px
        font-weight: 700;
        justify-content: left;
        padding: 32px 24px
    }

        main .container-detail-require-document-question-section1 span p {
            align-items: center;
            background-color: transparent;
            color: #525a68;
            display: flex;
            font-size: 14px;
            font-weight: 500;
            padding: 0;
            width: auto
        }

        main .container-detail-require-document-question-section1 span.section2 {
            box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
            display: flex;
            flex-direction: column;
            padding-top: 16px
        }

            main .container-detail-require-document-question-section1 span.section2 h3 {
                font-size: 20px
                padding: 0
            }

main .container-detail-require-document-question-name-school {
    background-color: #f5f5f7;
    border-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px
}

    main .container-detail-require-document-question-name-school span {
        align-items: center;
        border-radius: 14px;
        border-top: none;
        display: flex;
        gap: 10px
    }

        main .container-detail-require-document-question-name-school span h3 {
            padding: 0
        }

        main .container-detail-require-document-question-name-school span strong.long-dash {
            letter-spacing: .3em
        }

    main .container-detail-require-document-question-name-school div {
        display: flex;
        flex-direction: column;
        gap: 24px;
        justify-content: left
    }

        main .container-detail-require-document-question-name-school div span {
            display: flex;
            flex-direction: row;
            gap: 10px
        }

            main .container-detail-require-document-question-name-school div span input {
                background-color: #fff;
                border: 1px solid #9e9fac;
                box-sizing: border-box;
                height: 22px;
                width: 22px
            }

            main .container-detail-require-document-question-name-school div span label {
                color: #12212e;
                font-size: 14px;
                font-weight: 500
            }

    main .container-detail-require-document-question-name-school input {
        background-color: #f5f5f7;
        border: none;
        border-bottom: 1px solid #9e9fac;
        outline: none;
        padding: 8px 0;
        width: 420px
    }

        main .container-detail-require-document-question-name-school input[type=date] {
            border-bottom: 1px solid #dbdbe0;
            border-radius: 0
        }

    main .container-detail-require-document-question-name-school button {
        background-color: #fff;
        background-image: url(/static/media/UploadSimpleActive.25d9a4a89690aa9546f3.svg);
        background-position: center left 10px;
        background-repeat: no-repeat;
        border: 1px solid #116e63;
        border-radius: 14px;
        color: #116e63;
        height: 50px;
        padding: 8px 16px 8px 26px;
        width: 160px
    }

    main .container-detail-require-document-question-name-school select {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background-color: #f5f5f7;
        background-color: #fff;
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAALCAYAAAByF90EAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACySURBVHgBnc+9EcIwDAXgJ1WUGSEjsEI2cMmlcsNdyrBNOkIFHdkgIwAbZARqCgvbd3D82I7hdZal7yTARqm2wJ95zJLSuuDb4uQexqAaDt2UjdTrJROPYujMQ99fIb5eMmNUq6b8BYGQ2+jCfhNBZbEpF3tFRLA77ruWnp92mAkjCA6ZYmcGEO3q9NY0g8WQLyiFpZAgFMSENsxmG0OiUADziSFJ6BNLIVlxmKobPdd3B/w9dNWWMh50AAAAAElFTkSuQmCC);
        background-position: center right 16px;
        background-repeat: no-repeat;
        border: 1px solid #dbdbe0;
        border-radius: 10px;
        color: #525a68;
        color: #9e9fac;
        font-size: 14px;
        font-weight: 400;
        height: 46px;
        outline: none;
        padding: 9px 16px;
        width: 100%;
        width: 408px
    }

    main .container-detail-require-document-question-name-school p {
        color: #525a68;
        display: flex;
        justify-content: left
    }

main .container-detail-require-document-question-lost-passport {
    background-color: #f5f5f7;
    border-radius: 14px;
    box-shadow: 0 2px 4px -2px rgba(24, 39, 75, .12), 0 4px 4px -2px rgba(24, 39, 75, .08);
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 24px
}

    main .container-detail-require-document-question-lost-passport span {
        align-items: center;
        display: flex;
        gap: 11px;
        justify-content: left
    }

        main .container-detail-require-document-question-lost-passport span h3 {
            color: #12212e;
            font-size: 20px;
            font-weight: 700;
            padding: 0
        }

    main .container-detail-require-document-question-lost-passport div {
        align-items: flex-start;
        display: flex;
        gap: 8px;
        justify-content: left;
        position: relative
    }

        main .container-detail-require-document-question-lost-passport div input[type=radio] {
            border: 6px solid #116e63;
            box-sizing: border-box;
            height: 24px;
            width: 24px
        }

            main .container-detail-require-document-question-lost-passport div input[type=radio]:checked ~ .checkmark {
                background-color: #fff;
                border: 6px solid #116e63;
                border-radius: 50%;
                height: 24px;
                left: 5px;
                position: absolute;
                top: 3px;
                width: 24px
            }

        main .container-detail-require-document-question-lost-passport div span.checkmark {
            background-color: #fff;
            border-radius: 50%;
            height: 24px;
            left: 5px;
            pointer-events: none;
            position: absolute;
            top: 3px;
            width: 24px
        }

        main .container-detail-require-document-question-lost-passport div label.answering-staff {
            color: #525a68;
            margin-left: -30px
        }

        main .container-detail-require-document-question-lost-passport div span {
            align-items: flex-start;
            color: #12212e;
            display: flex;
            flex-direction: column;
            font-size: 14px;
            font-weight: 500;
            gap: 22px;
            justify-content: center
        }

            main .container-detail-require-document-question-lost-passport div span input {
                background: transparent;
                border: none;
                border-bottom: 1px solid #9e9fac;
                height: 26px;
                width: 410px
            }

.if-have-password {
    font-weight: 500;
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
}

.lable-forgot-password {
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
    color: #FFFFFF;
    text-align: center;
}

.back-login {
    width: 32px;
    height: 26px;
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
}

.btn-expire {
    font-weight: 600;
    font-size: 14px;
    line-height: 22.4px;
    color: #FFFFFF;
}

.des-expire div {
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
    font-weight: 400;
}
/*# sourceMappingURL=main.d851a94a.css.map*/
.if-have-password {
    font-weight: 500;
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
}

.lable-forgot-password {
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
    color: #FFFFFF;
    text-align: center;
}

.back-login {
    width: 32px;
    height: 26px;
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
}

.btn-expire {
    font-weight: 600;
    font-size: 14px;
    line-height: 22.4px;
    color: #FFFFFF;
}

.des-expire div {
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
    font-weight: 400;
}
/*# sourceMappingURL=main.d851a94a.css.map*/
.if-have-password {
    font-weight: 500;
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
}

.lable-forgot-password {
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
    color: #FFFFFF;
    text-align: center;
}

.back-login {
    width: 32px;
    height: 26px;
    font-weight: 700;
    font-size: 14px;
    line-height: 25.6px;
}

.btn-expire {
    font-weight: 600;
    font-size: 14px;
    line-height: 22.4px;
    color: #FFFFFF;
}

.des-expire div {
    font-size: 14px;
    line-height: 22.4px;
    color: #525A68;
    font-weight: 400;
}
/*# sourceMappingURL=main.d851a94a.css.map*/

.login .login-form .form .input-password {
    /*height: 44px !important;*/
    width: 517px;
}

/*# sourceMappingURL=main.d851a94a.css.map*/

/*NgocND1 fix css 16/08/2023*/
.login .login-form .title-change-password {
    color: #12212e;
    font-size: 20px
    font-weight: 700;
    margin: 19px 0 24px;
    text-align: center;
    line-height: 28.8px;
}

.base-button-container button.btn-change-password {
    line-height: 25.6px;
}

.btn-login button {
    font-weight: 700;
    font-family: "Noto Sans JP";
    font-style: normal;
    font-weight: 600;
    line-height: 160%;
}

.wrapper-icon-exit{
        border-bottom: none;
        padding-top: 32px;
        justify-content: flex-end;
}




#myModal button.redirect:hover {
    background-color: #589a92;
    opacity: 0.8;
}
#myModal #redirect-forgotpassword:active {
    background-color: #0c4d45 !important;
}



.wrapper-action-footer {
    align-items: center;
    display: flex;
    justify-content: center;
    padding-bottom: 24px;
    padding-top: 4px
}

.wrapper-action-footer button{
    width: 250px;
}