@charset "utf-8";

.tp-backdrop { display: none; position: fixed; inset: 0px; background: rgb(18, 18, 20); z-index: 300000; opacity: 0; transition: opacity 0.25s linear; }

.tp-backdrop.tp-active { opacity: 0.9; }

.tp-modal .tp-close.tp-square { background: rgb(204, 204, 204); border-radius: 0px; border: 0px; top: 0px; right: -40px; }

.tp-modal .tp-close { pointer-events: none; position: absolute; top: -15px; right: -15px; width: 30px; height: 30px; background: url("data:image/svg+xml,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.51 7.208l-.706-.708-2.798 2.798L7.207 6.5l-.707.707 2.798 2.799L6.503 12.8l.707.707 2.796-2.795 2.792 2.792.707-.707-2.792-2.792 2.798-2.798z' fill='%23000' fill-opacity='.4'/%3E%3C/svg%3E") center center no-repeat rgb(255, 255, 255); border: none; box-shadow: rgba(28, 37, 68, 0.15) 0px 0px 10px; outline: none; z-index: 300100; border-radius: 40px; opacity: 0; cursor: pointer; appearance: none; transform: scale(1); }

.tp-modal .tp-modal-title { position: absolute; padding: 3px; top: 5px; left: -200em; }

.tp-modal .tp-close:hover, .tp-modal .tp-close:focus { box-shadow: rgba(28, 37, 68, 0.15) 0px 0px 10px 2px; }

.tp-modal .tp-close:focus { border: 1px solid; }

.tp-modal .tp-close.tp-active { display: block; opacity: 1; pointer-events: auto; }

.tp-modal .tp-iframe-wrapper[dir="rtl"] .tp-close { right: initial; left: -20px; }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close { top: 0px; right: 0px; width: 64px; height: 64px; box-shadow: none; outline: none; border-radius: 0px; border-left: 1px solid rgba(15, 15, 21, 0.2); background: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg %3E%3Cpath d='M3 3L13 13M13 3L3 13' stroke='%230F0F15' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A") center center no-repeat; }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close.tp-active { opacity: 0.3; }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close.tp-active:hover, .tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close.tp-active:focus, .tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close.tp-active:focus-visible { border-top: none; border-right: none; border-bottom: none; border-image: initial; border-left: 1px solid rgba(15, 15, 21, 0.06); opacity: 1; box-shadow: none; }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2 .tp-close.tp-active:focus-visible::after { content: ""; width: 24px; height: 24px; border-radius: 4px; border: 1px solid rgb(59, 103, 178); position: absolute; top: 19px; left: 18px; display: inline-block; }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2[dir="rtl"] .tp-close { right: auto; left: 0px; border-left: none; border-right: 1px solid rgba(15, 15, 21, 0.2); }

.tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2[dir="rtl"] .tp-close:hover, .tp-modal .tp-iframe-wrapper.piano-id-modal-ver-2[dir="rtl"] .tp-close:focus { border-left: none; border-right: 1px solid rgba(15, 15, 21, 0.06); }

.tp-modal { z-index: 300050; }

@media screen and (max-width: 650px) {
  .tp-modal .tp-close { right: 0px; }
  .tp-modal .tp-iframe-wrapper[dir="rtl"] .tp-close { right: initial; left: 0px; }
}

.tp-modal .tp-iframe-wrapper.tp-curtain { width: 600px; height: 480px; }

.tp-modal-open { height: 100vh; overflow: hidden !important; }

.tp-modal-open.tp-modal-resizing { }

.tp-modal-close { overflow: auto; }

.tp-iframe-wrapper { position: relative; margin: 50px auto; box-shadow: rgba(0, 0, 0, 0.21) 0px 0px 10px; }

.tp-iframe-wrapper.no-shadow { box-shadow: unset; }

.tp-modal { overflow-x: hidden; display: none; position: fixed; inset: 0px; transform: translateZ(0px); overflow-y: scroll !important; }

.tp-modal .tp-message { font-family: "Graphik Web Regular", Helvetica, Arial, sans-serif; padding: 10px; }

.tp-modal .tp-btn-container { padding-left: 10px; padding-bottom: 10px; }

.tp-cxense-placeholder-modal { width: 100%; background-color: rgb(255, 255, 255); max-width: 912px; display: block; overflow: hidden; height: auto; opacity: 1; }

.tp-widget-placeholder > div::after { display: block; content: ""; clear: both; }

.tp-btn { text-decoration: none; cursor: pointer; padding: 0px 18px; line-height: 40px; border-collapse: separate; border-radius: 4px; text-align: center; vertical-align: middle; display: inline-block; color: rgb(255, 255, 255); border: none; box-shadow: rgba(216, 218, 221, 0) 0px -1px inset; background: center bottom rgb(56, 120, 216); text-shadow: none; font-family: "Graphik Web Regular", Helvetica, Arial, sans-serif; white-space: nowrap; outline: 0px; }

.tp-please-wait.tp-active { display: block; opacity: 0.9; transition: opacity 0.25s linear; }

.tp-please-wait { position: absolute; top: 0px; left: 0px; background-color: rgb(153, 153, 153); opacity: 0; width: 100%; height: 100%; display: none; text-align: center; color: rgb(255, 255, 255); font-weight: lighter; font-family: "Open Sans", sans-serif; font-size: 15px; }

.tp-please-wait.tp-overlap { position: fixed; z-index: 300150; }

.tp-please-wait.tp-local-overlap { position: absolute; }

.tp-please-wait > .tp-icon { width: 80px; height: 80px; margin: 100px auto 20px; }

.pn-spinner { color: gray; display: inline-block; position: relative; width: 80px; height: 80px; }

.pn-spinner div { transform-origin: 40px 40px; animation: 1.2s linear 0s infinite normal none running pn-spinner; }

.pn-spinner div::after { content: " "; display: block; position: absolute; top: 3px; left: 37px; width: 6px; height: 18px; border-radius: 20%; background: rgb(255, 255, 255); }

.pn-spinner div:nth-child(1) { transform: rotate(0deg); animation-delay: -1.1s; }

.pn-spinner div:nth-child(2) { transform: rotate(30deg); animation-delay: -1s; }

.pn-spinner div:nth-child(3) { transform: rotate(60deg); animation-delay: -0.9s; }

.pn-spinner div:nth-child(4) { transform: rotate(90deg); animation-delay: -0.8s; }

.pn-spinner div:nth-child(5) { transform: rotate(120deg); animation-delay: -0.7s; }

.pn-spinner div:nth-child(6) { transform: rotate(150deg); animation-delay: -0.6s; }

.pn-spinner div:nth-child(7) { transform: rotate(180deg); animation-delay: -0.5s; }

.pn-spinner div:nth-child(8) { transform: rotate(210deg); animation-delay: -0.4s; }

.pn-spinner div:nth-child(9) { transform: rotate(240deg); animation-delay: -0.3s; }

.pn-spinner div:nth-child(10) { transform: rotate(270deg); animation-delay: -0.2s; }

.pn-spinner div:nth-child(11) { transform: rotate(300deg); animation-delay: -0.1s; }

.pn-spinner div:nth-child(12) { transform: rotate(330deg); animation-delay: 0s; }

@keyframes pn-spinner { 
  0% { opacity: 1; }
  100% { opacity: 0; }
}

.tp-please-wait > .tp-icon.tp-centered { margin: 0px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

.tp-iframe-wrapper.no-width .tp-close, .tp-iframe-wrapper.no-height .tp-close, .tp-modal.no-width .tp-close, .tp-modal.no-height .tp-close { display: none; }

.tp-banner { position: fixed; bottom: 0px; left: 0px; width: 100%; }

.tp-banner > .tp-container-inner, .tp-banner > .tp-container-inner > iframe { width: inherit !important; }

.tp-modal-overscroll-prevented { overscroll-behavior: contain; width: 100%; overflow-x: unset; overflow-y: scroll; }

.tp-scroll-prevented { height: 100vh; overflow: hidden; touch-action: none; }

.tp-body-scroll-prevented { touch-action: none; }

.piano-widget-container-fade { opacity: 0; animation: 0.5s ease-in-out 0s 1 normal none running piano-widget-fade; }

@keyframes piano-widget-fade { 
  0% { opacity: 1; }
  100% { opacity: 0; }
}