.color-main label{display:inline-block;margin-bottom:0.5rem;font-weight:bold}
.color-main input{padding:0.5rem;border:1px solid #acb4b9;border-radius:.5rem}
.color-main button{padding:0.5rem 1rem;cursor:pointer;background-color:var(--border-color);border-radius:.5rem}
.color-main .orcolorPicker{padding:0.01rem 0.03rem;border-radius:0;width:200px}
.color-main .color-preview{margin-top:1rem;width:200px;height:50px;border:1px solid #ccc}
.color-main .color-info{margin-top:1rem;padding:1rem;border:1px solid var(--border-color);border-radius:5px;background:var(--content-bg-color)}
.color-main .color-info div{font-size:90%}
.color-main .swatch-container{margin-top:2rem}
.color-main .swatch-item{display:flex;align-items:center;margin-bottom:4px}
.color-main .swatch-item.highlight .percentage-label,
.color-main .swatch-item.highlight .swatch-info{font-weight:bold;color:var(--link-color)}
.color-main .percentage-label{width:40px;text-align:right;margin-right:1rem}
.color-main .color-box{width:160px;height:24px;margin-right:1rem;border:1px solid #ccc}
.color-main .swatch-info{font-size:0.9rem;display:flex}
.color-main .color-info,
.color-main .percentage-label,
.color-main .swatch-info{font-family:Consolas,'Courier New',monospace}
.rgbaplus{display:none}
@media (min-width:768px){ /* .md\: */
	.rgbaplus{display:block}
}


.css-main{max-width:768px;margin:0 auto}
.css-main button{padding:11px 18px;font-size:16px;position:relative;display:inline-flex;justify-content:center;align-items:center;margin:0;font-weight:600;line-height:26px;color:#4e5968;white-space:nowrap;text-align:center;vertical-align:middle;background-color:#f2f4f6;background-image:none;border:0 solid transparent;user-select:none;transition:background .2s ease,color .1s ease;text-decoration:none;border-radius:8px}
.css-main button:hover{color:#4e5968;background-color:#d1d6db}
.css-main .css-h2{font-size:32px;line-height:1.3;margin:40px 0 12px}
.css-main .css-h2 small{color:#b6bec8;font-size:13px;font-family:Consolas,'Courier New',monospace;letter-spacing:-1px}
.css-main .css-p-sub{margin:0 0 24px}
.css-main .loan-form{background-color:#fafafe;border-radius:15px;padding:42px 50px 39px}
.css-main .loan-form>div{align-items:flex-start;display:flex;flex-direction:row;-webkit-box-pack:start;justify-content:flex-start;margin-top:5px}
.css-main .css-input{display:flex;align-items:center;margin-bottom:10px}
.css-main .css-input label{width:100px;margin-right:14px;text-align:right;display:inline-block;padding:6px 0;position:relative;font-size:1rem}
.css-main .input-field{position:relative;display:flex;align-items:center;width:100%;height:48px;margin:1px auto 0;font-size:15px;line-height:20px;color:#333d4b;background-color:#fff;border:none;outline:none;box-shadow:inset 0 0 0 1px rgba(0,27,55,.1);appearance:none;overflow:hidden;transition:background .2s ease,color .1s ease,box-shadow .2s ease;border-radius:8px}
.css-main .input-field input{flex-grow:1;outline:0;border:0;background:none;line-height:48px;font-size:inherit;padding:0 18px;margin:0;color:inherit;width:100%;height:100%;min-width:0}
.css-main .Unit{white-space:nowrap;margin:0 18px 0 -8px;font-size:15px;line-height:48px;padding:0;width:32px}
.css-main .css-btn{align-items:flex-start;display:flex;flex-direction:row;-webkit-box-pack:start;justify-content:flex-start}
.css-main .css-btn button{width:70px;height:48px;margin-left:15px;padding:12px 0;border-radius:8px;border:1px solid #e5e8eb;text-align:center;background-color:#ffffff;font-size:15px;font-weight:400}
.css-main .css-btn button:hover{color:#4e5968;background-color:#d1d6db}
.css-main .css-label{align-items:flex-start;display:flex;flex-direction:row;-webkit-box-pack:start;justify-content:flex-start;margin:33px 0 34px 0}
.css-main .css-result-2{display:none;padding:37px 36px 28px 35px;border-radius:15px;background-color:#fafafe;overflow-x:scroll;scrollbar-width:none}
.css-main .open2 .css-result-2{display:block}
.css-main #result{display:none}
.css-main .css-label{align-items:flex-start;display:flex;flex-direction:row;-webkit-box-pack:start;justify-content:flex-start;margin:33px 0 34px 0}
.css-main .css-label>span{margin-left:3px;margin-right:14px;text-align:right}
.css-main .css-radio{position:relative;display:flex;align-items:center;gap:16px}
.css-main .css-radio input[type="radio"]{display:inline-block;appearance: auto}
.css-main .loan-form>div.btn-area{display:flex;justify-content:center;gap:18px}
.css-main .btn-area button.clear{color:#3182f6;background-color:transparent}
.css-main .btn-area button.clear:hover{color:#2272eb;background-color:#e8f3ff}
.css-main .btn-area button.fill{color:#f9fafb;background-color:#3182f6}
.css-main .btn-area button.fill:hover{color:#fff;background-color:#1b64da}
.css-main .btn-area button.fill:disabled{cursor:not-allowed;color:#fff;background-color:#90c2ff}
.css-main [type=button]:not(:disabled),
button:not(:disabled){cursor:pointer}
.css-main .css-result-1{padding:25px 35px 21px;background-color:#3182f6;border-radius:15px}
.css-main .css-result-1-tit{color:#c9e2ff;font-size:20px;line-height:1.6}
.css-main .css-result-1-inner{-webkit-box-align:center;align-items:center;display:flex;flex-direction:row;-webkit-box-pack:justify;justify-content:space-between}
.css-main .e1dx22{font-size:48px;line-height:1.3;color:#fff}
.css-main .e1dx22k1{font-size:15px}
.css-main .css-result-1-section{margin-top:24px;padding-top:24px;border-top:1px solid rgba(209,214,219,.3)}
.css-main #result-data{line-height:1.6;color:#fff}
.css-main #result-data p{margin:0;padding:0}
.css-main #result-data .data1{font-size:20px;color:#c9e2ff}
.css-main #result-data .data2{font-size:32px}
.css-main .css-result-2-tit{font-size:15px;line-height:1.6;color:#4e5968;font-weight:700}
.css-main .css-result-2 .table{border-collapse:separate;border-spacing:0;table-layout:auto;width:100%;margin-top:21px;padding:16px;background-color:#fff;border-radius:8px}
.css-main .table-cell{position:relative;font-weight:400;line-height:40px;color:#4e5968;font-size:15px;min-height:40px;height:40px;transition:background-color .2s ease,border-color .2s ease;padding:6px}
.css-main .text--center{text-align:center}
.css-main .table-header-cell{height:24px;min-height:24px;line-height:1;font-weight:700;font-style:1rem;min-width:fit-content;white-space:nowrap;overflow:hidden;transition:background-color .2s ease;position:relative}
.css-main .css-1hqobqe{color:#3182f6}