:root {
    --primary: #EAF0F3;
    --secondary: #E30F4B;
    --tertiary: #504E44;
    --quaternary: #35466B;
    --quinary: #333333;
    --senary: #003668
}

html,
body {
    overflow-x: auto;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 16px !important;
    color: var(--quinary);
}
.text-danger {
    font-size: 14px !important;
}
.pa-btn {
    width: 280px;
    height: 50px;
    font-size: 18px;
    border-radius: 30px;
    color: white;
    font-weight: bold;
    border: none;
}

.pa-cursor-pointer {
    cursor: pointer;
}

.pa-font-size-lg {
    font-size: 18px;
}

.pa-font-size-md {
    font-size: 14px;
}

.pa-font-size-sm {
    font-size: 13px;
}

.pa-btn-secondary {
    background-color: var(--secondary);
}

.pa-btn-secondary:hover {
    background-color: #be0b3e !important;
}

.pa-bg-primary {
    background-color: var(--primary);
}

.pa-bg-secondary {
    background-color: var(--secondary);
}

.pa-bg-tertiary {
    background-color: var(--tertiary);
}

.pa-bg-quaternary {
    background-color: var(--quaternary);
}

.pa-block-content-admin {
    width: 800px;
    min-height: 485px;
}
input {
    height: 50px;
    border-radius: 2px !important;
    border: 1px solid #AAADB3 !important;
}
/* Login start */
.pa-login-admin {
    padding: 50px 30px 60px 30px;
}

.pa-login-admin-title {
    margin-bottom: 40px;
}

.pa-login-admin-decription {
    margin-bottom: 40px;
}

.pa-login-btn {
    margin-top: 27px;
}

.pa-block-input {
    width: 316px;
}

.pa-login-admin-input {
    border-radius: 2px;
    height: 50px;
}
/* Login end */
/* default start */
.pa-header, .pa-logout {
	height: 80px;
}
.pa-logout span {
    font-size: 13px;
}
.pa-logout img {
    height: 31px;
}
.pa-main {
	min-height: calc(100vh - 80px - 43px);
    padding-top: 20px;
    padding-bottom: 41px;
}
.pa-footer {
	height: 43px;
	background-color: #504E44;
	width: 100%;
    font-size: 9px;
}
.pa-logout button {
    height: 80px;
    width: 80px;
    padding: 0px 6px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
/* User ui start*/
.pa-user-container {
    width: 382px;
    min-height: 560px;
}

.pa-user-modal{
    width: 382px;
    min-height: 554px;
}

.pa-user-btn {
    margin-bottom: 47px;
}
.pa-user-container {
    padding: 0 30px;
}
.pa-user-title {
    font-size: 24px;
    margin-top: 45px;
    margin-bottom: 17px;
}
/* User ui end */
/* User login start */
.pa-user-login-email, .pa-user-login-password {
    margin-top: 25px;
}
.pa-user-login-email img, .pa-user-login-password img {
    width: 17px;
}
.pa-user-login-input {
    margin-top: 11px;
}
.pa-user-login-forgot-password {
    margin-top: 10px;
    margin-bottom: 35px;
}
.pa-user-login-forgot-password a {
    color: var(--senary);
}
.pa-user-login-btn {
    height: 50px;
    width: 280px;
    font-size: 18px;
    border-radius: 30px;
}
.pa-error-message {
    height: 23px;
}
/* User login end */
/* User contract start*/
.pa-user-contract-title {
    font-size: 20px;
}
.pa-user-contract-content {
    padding-top: 10px;
}
.pa-user-contract-hr {
    margin: 11px 0px;
}
.pa-user-contract-pdf-title {
    font-size: 18px;
}
.pa-user-contract-pdf {
    width: 17px;
}
.pa-user-contract-popup {
    width: 13px;
}
.pa-user-contract-content-bottom {
    margin-top: 40px;
}
.pa-user-contract-information-title {
    font-size: 15px;
    color: #656B79;
    margin-bottom: 6px;
}
.pa-user-contract-name {
    margin-top: 10px;
}
.pa-user-contract-icon-link {
    font-size: 12px;
}
.pa-user-contract-content-bottom a {
    color: var(--quinary);
}
.pa-user-contract-modal-btn {
    width: 148px;
    height: 48px;
    border-radius: 30px;
    margin-bottom: 35px;
    color:var(--senary);
    border-color: #828999;
}
.pa-user-modal-close {
    position: absolute;
    top: -36px;
    right: 0px;
    font-size: 35px;
    color: white;
}

.pa-content {
    height: 454px;
}
/* User contract start */
/* User forgot password start */
.pa-back-btn {
    margin-top: 15px;
    margin-bottom: 45px;
    border: 1px solid #828999;
    color: var(--senary);
    background-color: white;
    font-size: 16px;
}

.pa-back-btn:hover {
    background-color: #F7F7F7;
}

.pa-user-forgot-password-email {
    margin-top: 25px;
}
.pa-user-forgot-password-btn {
    margin-top: 20px;
}
.pa-user-password-change-content {
    height: 420px;
}
.pa-notification {
    background-color: #FFEDF3;
    padding: 20px;
}
.pa-forgot-password-notification {
    min-height: 398px;
}
/* User forgot password end */
/* Home start */
.pa-home-admin {
    padding-top: 50px;
}

.pa-admin-title {
    margin-bottom: 60px;
}
.pa-block-add {
    margin-right: 30px;
}
.pa-block-add,
.pa-block-members {
    border: 3px solid #E20040;
    border-radius: 20px;
    text-decoration: none;
    color: #000000;
    padding-top: 40px;
}

.pa-description {
    font-size: 15px;
    margin-top: 11px;
    margin-right: 30px;
    margin-left: 30px;
}

/* Home end */
/* search member start */
.pa-search-member-title {
    margin-bottom: 38px;
    font-size: 24px;
}

.pa-search-member-input {
    width: 236px;
    height: 50px;
    border-radius: 2px;
}

.pa-search-member-label {
    width: 64px;
}

.pa-search-member-btn {
    margin-top: 47px;
    width: 240px;
    height: 45px;
}
.pa-block-search-member {
    margin-bottom: 5px;
    padding-top: 50px;
    height: 374px;
}

.pa-block-list {
    padding: 39px 50px 50px 50px;
    width: 800px;
    height: auto;
    margin-top: 30px;
}

.pa-block-list table {
    min-width: 500px;
}

.pa-block-list td {
    border: 1px solid #D7D6D9;
    font-size: 15px;
    padding: 10px 10px;
    color: var(--senary);
}

.pa-tag {
    width: 146px;
    height: 26px;
    color: #ffffff;
    background-color: var(--senary);
    border-radius: 25px;
    font-size: 15px;
    border: none;
}

.pa-block-list tr:hover td {
    background-color: #EEF9FF;
    cursor: pointer;
}
/* search member end */
/* pagination start */
.pa-btn-page {
    height: 46px;
    border: none;
    background-color: white;
    font-size: 18px;
    color: #98A6B5;
}

.pa-page-active {
    color: var(--senary);
}

.pa-btn-left,
.pa-btn-right{
    border: none;
    background-color: white;
}

.pa-btn-left:disabled,
.pa-btn-right:disabled{
    opacity: 0.5;
}

.pa-btn-left:hover:disabled,
.pa-btn-right:hover:disabled{
    cursor: not-allowed;
}
/* pagination end */

/* detail member start */
.hr {
    background-color: #D7D6D9;
}

.pa-detail-member {
    padding: 50px;
    min-height: 648px;
    width: 800px;
}

.pa-detail-title {
    font-size: 24px;
    margin-bottom: 41px;
}

.pa-detail-info-title {
    width: 105px;
    font-size: 15px;
    color: #656B79;
    margin-bottom: 19px;
    margin-right: 24px;
}

.pa-btn-upload {
    background-color: var(--quaternary);
    color: white;
    width: 157px;
    height: 30px;
    border-radius: 25px;
    border: none;
}

.pa-btn-delete-member {
    width: 315px;
    height: 34px;
    border-radius: 25px;
    color: var(--senary);
    border: 1px solid #828999;
    background-color: white;
    margin-top: 49px;
}

.pa-btn-delete-pdf {
    width: 70px;
    height: 26px;
    background-color: white;
    border-radius: 13px;
    color: var(--senary);
    border: 1px solid #828999;
    font-size: 15px;
}
.pa-btn-delete-pdf img {
    margin-right: 2px;
}

#pdf-modal .modal-content {
    width: 100%;
    height: 637px;
}

.pa-btn-delete-pdf-modal {
    width: 120px;
    height: 34px;
    background-color: white;
    border-radius: 25px;
    color: var(--senary);
    border: 1px solid #828999;
    margin-bottom: 47px;
    margin-top: 12px;
}
.pa-detail-member .pa-contract-label {
    margin-top: 41px;
}

.pa-pdf-file span {
    color: #333333;
    text-decoration: underline;
}
/* detail member end */
/* create member start */
.pa-create-member-label {
    width: 112px;
    height: 50px;
    line-height: 50px;
}

.pa-block-upload-pdf {
    border: 1px dashed #B8BDBF;
    background-color: #F7F7F7;
    min-height: 65px;
    padding-left: 30px;
    padding-right: 30px;
}

.pa-block-upload-pdf div {
    min-height: 65px;
}

.pa-create-member-btn {
    width: 240px;
    height: 45px;
    margin-top: 40px;
}

.pa-create-member {
    padding: 50px;
    min-height: 648px;
    width: 800px;
}

.pa-create-member .pa-contract-label {
    margin-top: 60px;
    margin-bottom: 8px;
}
/* create member end */
/* create password start */
.pa-create-password {
    padding: 50px;
    min-height: 500px;
    width: 800px;
}
/* create password end */
/* confirm modal start */
.pa-btn-confirm-modal {
    min-width: 110px;
    background-color: var(--quaternary);
    border: none;
    color: white !important;
    min-height: 33px;
    border-radius: 25px;
}
.pa-btn-cancel-modal {
    min-width: 110px;
    background-color: #797979;
    border: none;
    color: white !important;
    min-height: 33px;
    border-radius: 25px;
}
.pa-btn-confirm-modal:hover,
.pa-btn-confirm-modal:active,
.pa-btn-cancel-modal:hover,
.pa-btn-cancel-modal:active {
    opacity: 0.75;
}
/* confirm modal end */

/* reset password start */
.pa-block-regulation {
    padding: 14px 8px 11px 0px;
    background-color: #FFEDF3;
}
.pa-block-regulation li::marker {
    font-size: 13px;
}
.pa-symbols {
    color: #E20040;
}
.pa-reset-password {
    min-height: 642px;
}
/* reset password end */
.pa-header-label {
    line-height: 1;
    height: 20px;
    padding-top: 2px;
    padding-bottom: 0;
    border-radius: 4px;
    color: #ffffff;
}
@media (max-width: 500px) {
    .pa-main {
		min-height: calc(100vh - 60px - 43px);
	}
	.pa-footer {
		font-size: 9px;
	}
	.pa-header, .pa-logout {
		height: 60px;
	}
	.pa-logout button {
		width: 60px;
		padding: 0;
		height: 60px;
		font-size: 11px;
	}

	.pa-header-logo {
		height: 27px;
	}

    .pa-logout img {
        height: 22px;
    }

    .pa-logout span {
        font-size: 11px;
    }

	.pa-logout button {
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}

}
@media (max-width: 800px) {
    .pa-create-member,
    .pa-detail-member,
    .pa-create-password,
    .pa-block-content-admin,
    .pa-block-search-member,
    .pa-block-list {
        width: 100%;
    }
}

.pa-text-back {
    color: var(--senary);
    font-weight: bold;
}

.swal2-confirm:focus {
    outline: none;
    box-shadow: none;
}