.component-modal{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100vw;height:100%;padding:40px;box-sizing:border-box;z-index:100}.component-modal *{box-sizing:border-box}.component-modal>.mask{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.6);pointer-events:none;transition:.5s ease}.component-modal>.modal-content-wrapper{position:relative;width:640px;height:510px;background-color:white;border-radius:4px;transition:.5s ease}@media screen and (max-height: 720px){.component-modal>.modal-content-wrapper{height:100%}}.component-modal>.modal-content-wrapper>.close{display:flex;align-items:center;position:absolute;top:24px;right:24px;cursor:pointer;z-index:100}.component-modal>.modal-content-wrapper>.close>.text{font-size:1rem;font-weight:500;line-height:1.57;letter-spacing:0.8px;color:#909090;margin-right:6px}@media (hover: hover){.component-modal>.modal-content-wrapper>.close:hover .text,.component-modal>.modal-content-wrapper>.close:active .text{color:#333}.component-modal>.modal-content-wrapper>.close:hover .icon.not-hover,.component-modal>.modal-content-wrapper>.close:active .icon.not-hover{display:none}.component-modal>.modal-content-wrapper>.close:hover .icon.hover,.component-modal>.modal-content-wrapper>.close:active .icon.hover{display:block}}.component-modal>.modal-content-wrapper>.close>.icon{display:flex;align-items:center;width:24px}.component-modal>.modal-content-wrapper>.close>.icon>img{width:24px;height:24px}.component-modal>.modal-content-wrapper>.close>.icon.hover{display:none}.component-modal>.modal-content-wrapper>.close>.icon.not-hover{display:block}.component-modal>.modal-content-wrapper>.content{position:relative;width:100%;height:100%;padding:40px;overflow-x:hidden;overflow-y:visible}.component-modal>.modal-content-wrapper>.content>.header{font-size:2rem;font-weight:bold;line-height:1.5;letter-spacing:0.8px;color:#333;margin-bottom:32px;margin-right:80px}.component-modal:not(.active){pointer-events:none}.component-modal:not(.active) *{pointer-events:none}.component-modal:not(.active)>.mask{opacity:0;pointer-events:none}.component-modal:not(.active)>.modal-content-wrapper{opacity:0;pointer-events:none}.component-modal:not(.active) .component-button.outline.disabled{color:#333;border-color:#333}@media screen and (max-width: 1023px){.component-modal.mobile-bottom-up{padding:0;align-items:flex-end}.component-modal.mobile-bottom-up>.modal-content-wrapper{width:100%;height:480px;max-height:80%;border-bottom-right-radius:0;border-bottom-left-radius:0;transform:translateY(0);box-shadow:0 1px #fff}.component-modal.mobile-bottom-up>.modal-content-wrapper>.close{left:12px;top:12px}.component-modal.mobile-bottom-up>.modal-content-wrapper>.close>.text{display:none}.component-modal.mobile-bottom-up>.modal-content-wrapper>.content{position:relative;height:100%;padding:0}.component-modal.mobile-bottom-up>.modal-content-wrapper>.content>.header{display:flex;width:100%;height:48px;justify-content:center;align-items:center;padding:0;margin:0;border-bottom:1px solid #e9e9e9;font-size:1.14286rem}.component-modal.mobile-bottom-up>.modal-content-wrapper>.content>.body{width:100%;height:calc(100% - 48px);overflow-x:hidden;overflow-y:scroll;overflow:overlay}.component-modal.mobile-bottom-up:not(.active)>.modal-content-wrapper{transform:translateY(480px)}}.component-modal.bottom-up{padding:0;align-items:flex-end}.component-modal.bottom-up>.modal-content-wrapper{width:100%;height:480px;max-height:80%;border-bottom-right-radius:0;border-bottom-left-radius:0;transform:translateY(0)}.component-modal.bottom-up>.modal-content-wrapper>.close{left:12px;top:12px}.component-modal.bottom-up>.modal-content-wrapper>.close>.icon img{width:24px;height:24px}.component-modal.bottom-up>.modal-content-wrapper>.close>.text{display:none}.component-modal.bottom-up>.modal-content-wrapper>.content{position:relative;height:100%;padding:0}.component-modal.bottom-up>.modal-content-wrapper>.content>.header{display:flex;width:100%;height:48px;justify-content:center;align-items:center;padding:0;margin:0;border-bottom:1px solid #e9e9e9;font-size:1.14286rem}.component-modal.bottom-up>.modal-content-wrapper>.content>.body{width:100%;height:calc(100% - 48px);overflow-x:hidden;overflow-y:auto}.component-modal.bottom-up:not(.active)>.modal-content-wrapper{transform:translateY(480px)}
