@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans+Condensed:wght@900&display=swap');:root{--input-height:40px;--color-main:hsl(186,33%,51%);--color-basic:hsl(163,36%,56%);--color-income:hsl(111,34%,62%);--color-outcome:hsl(356,48%,64%);--color-investment:hsl(204,52%,64%);--color-hover:hsla(26,100%,54%,0.75);--color-focus:hsl(26,100%,54%);--size-min-piece:22.5rem;}*{font-weight:normal;}html,body{overflow-x:hidden;}#fire{display:none;text-align:center;width:100%;}#fire header{padding:64px var(--nurume-size-32);background:var(--color-main);margin-bottom:var(--nurume-size-48);display:flex;flex-direction:column;align-items:center;}#fire header img{user-select:none;-webkit-user-drag:none;}#fire header img.icon{width:clamp(64px,10vw,96px);margin-bottom:clamp(24px,4vw,36px);}#fire h1{width:clamp(280px,50%,320px);}#fire header p{margin-top:16px;font-size:clamp(var(--nurume-size-14),2vw,var(--nurume-size-16));color:#fff;}#fire main{padding:0 32px;}#fire h2{margin-bottom:24px;font-size:var(--nurume-size-24);filter:brightness(80%);}#fire section{margin-bottom:64px;}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}input[type="number"]{-moz-appearance:textfield;}input[type="number"],.month-value{font-family:"Sofia Sans Condensed","Kosugi Maru",sans-serif;}section ul{list-style:none;margin-bottom:16px;text-align:left;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--size-min-piece),1fr));gap:16px;}section li{width:100%;border-radius:8px;display:block;overflow:hidden;}section li>hgroup{display:flex;height:32px;align-items:center;justify-content:space-between;backdrop-filter:saturate(80%) brightness(80%);padding-left:16px;}section li>hgroup>h4{color:#fff;cursor:pointer;}section li>hgroup>a{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:rgba(0,0,0,0.25);}section li>hgroup>a:before{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:24px;line-height:1;content:'close';}section li>hgroup>a:hover{color:#fff;background:rgba(0,0,0,0.5);}section li>.content{padding:16px;border:none;display:flex;align-items:center;justify-content:space-between;}section li.sliding{position:absolute;z-index:2;}section li.dummy{border:8px dashed rgba(0,0,0,0.75);opacity:0.25;width:100%;}.variable li>.content>form>div{display:flex;align-items:center;justify-content:flex-start;}.variable li>.content>form>div:nth-child(2){margin-top:16px;}li>.content>nav{display:inline-flex;flex-direction:column;}li>.content>nav>input[type='button']{appearance:none;border:none;font-family:'Material Symbols Outlined';color:#fff;cursor:pointer;user-select:none;display:inline-flex;align-items:center;justify-content:center;opacity:1;min-width:20px;width:20px;height:18px;border-radius:none;font-size:var(--nurume-size-16);background:transparent;}li:first-child input[type='button'].up,li:last-child input[type='button'].down{cursor:default;opacity:0.25;pointer-events:none;}li>.content>nav>input[type='button']:hover{background:transparent;color:rgba(255,255,255,0.5);}h2{font-size:var(--nurume-size-24);}h3{font-size:var(--nurume-size-18);}select{height:var(--input-height);}input[type="number"].years{width:40px;}input[type="number"].money{width:60px;}input[type="number"].per{width:50px;}input[type="radio"]{appearance:none;width:0;}label:has(input){height:var(--input-height);padding:0 16px;display:inline-flex;align-items:center;color:rgba(0,0,0,0.5);cursor:pointer;line-height:1;}label:not(:has(input:checked)):hover{color:rgba(0,0,0,1);}label:has(input:checked){background:var(--color-focus);color:#fff;cursor:default;}label:has(input):before{font-family:'Material Symbols Outlined';margin-right:4px;content:'radio_button_unchecked';display:inline-block;line-height:1;font-weight:normal;font-style:normal;font-size:var(--nurume-size-22);}label:has(input:checked):before{content:'radio_button_checked';color:#fff;}.radios{display:inline-flex;margin-right:16px;border-radius:8px;background:#fff;overflow:hidden;}.month-value{display:inline-flex;border-radius:8px;background:transparent;align-items:center;height:var(--input-height);cursor:pointer;font-size:var(--nurume-size-16);overflow:hidden;border:none;padding:0;}.month-value .value{display:inline-flex;padding:8px;align-items:baseline;font-weight:bold;white-space:nowrap;}.month-value>div{height:100%;display:inline-flex;align-items:center;}.month-value .month{background:#fff;}.month-value .age{background:rgba(60,60,60,0.65);color:#fff;}.month-value .age .value:after{content:'歳';font-size:var(--nurume-size-11);}.month-value .unit{font-size:var(--nurume-size-11);}.month-value.till{margin-left:4px;}.input-with-unit{display:inline-flex;border-radius:8px;background:#fff;overflow:hidden;align-items:center;padding:0 8px;height:var(--input-height);gap:4px;cursor:pointer;}.input-with-unit:has(input:focus){outline:2px solid var(--color-focus);}.input-with-unit>input{border:none;outline:none;padding:8px 0;text-align:right;flex-grow:1;flex-shrink:1;cursor:pointer;}.input-with-unit>input:focus{cursor:text;}.input-with-unit>span{flex-grow:0;flex-shrink:0;color:#666;font-size:var(--nurume-size-14);}.month-value:hover,.input-with-unit:hover{outline:4px solid var(--color-hover);transition:0s;}.prefix{font-size:var(--nurume-size-14);color:#fff;margin-right:4px;}.suffix{font-size:var(--nurume-size-12);color:#fff;margin-left:2px;line-height:1;}.variable a.btn-add{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;color:#fff;font-size:var(--nurume-size-24);border-radius:100%;}.variable a.btn-add:before{font-family:'Material Symbols Outlined';content:'add';}.variable a.btn-add:hover{filter:hue-rotate(30deg) saturate(80%);}#month-picker .age{text-align:center;font-size:var(--nurume-size-18);margin:8px 0;}#month-picker .age:after{content:"歳";font-size:var(--nurume-size-16);}#basic form{width:100%;}#basic li{background:var(--color-basic);}#basic h2{color:var(--color-basic);}#income li,#income a.btn-add,#summary ul.income li{background:var(--color-income);}#income h2{color:var(--color-income);}#outcome li,#outcome a.btn-add,#summary ul.outcome li{background:var(--color-outcome);}#outcome h2{color:var(--color-outcome);}#investment li,#investment a.btn-add,#summary ul.investment li{background:var(--color-investment);}#investment h2{color:var(--color-investment);}#basic h3{color:#fff;font-size:var(--nurume-size-16);}.btn{width:75%;max-width:320px;height:48px;color:#fff !important;border:none !important;}.btn:hover{filter:hue-rotate(30deg) saturate(80%);}#btn-simulate{background:#5dab5d;}#btn-share{background:#46869d;margin-top:16px;}#result{display:none;}#result .placard{display:none;font-size:var(--nurume-size-56);color:#fff;--fuchi-width:6px;margin-bottom:24px;}#result .placard.success{--fuchi-color:hsl(342,80%,72%);}#result .placard.fail{--fuchi-color:hsl(279,25%,54%);letter-spacing:4px;}#result .comment{font-size:var(--nurume-size-20);}#graph{width:100%;max-width:1024px;height:auto;margin-top:16px;border-radius:4cqw;}#thinking{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 32px;}#thinking>h3{line-height:1;}#thinking>ul{display:grid;gap:2px;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,1fr);margin-top:32px;border:4px solid #999;border-radius:4px;padding:4px;}#thinking>ul>li{width:6px;height:6px;display:inline-block;}#thinking>div{display:inline-flex;width:72px;height:6px;border-radius:0 0 4px 4px;background:#999;margin-top:2px;align-items:center;justify-content:center;}#thinking>div>div{background:#fff;width:8px;height:2px;border-radius:1px;display:inline-block;}#summary{margin-top:48px;}#summary>p{text-align:left;}#summary ul{margin-top:8px;color:#fff;}#summary li{padding:16px;}#summary h5{margin-bottom:4px;font-size:var(--nurume-size-14);}#summary ul.income,#summary ul.outcome{margin-bottom:32px;}#summary ul .detail{display:flex;align-items:center;justify-content:flex-start;gap:8px;font-size:var(--nurume-size-16);}#summary ul .result{font-size:var(--nurume-size-24);text-align:right;margin-top:4px;font-weight:bold;}#summary ul .result span{font-size:var(--nurume-size-14);margin-right:4px;font-weight:normal;}#summary ul .detail div{text-align:right;}#summary ul.outcome .detail .cycle{text-align:center;flex-grow:0;flex-shrink:0;}#note{margin-top:32px;}#note p{font-size:var(--nurume-size-11);}@media (max-width:480px){#fire main{padding:0 16px;}}@media (max-width:calc(22.5rem * 2 + (32px * 2 + 16px - 1px))){#basic ul{grid-template-columns:repeat(auto-fit,minmax(calc(var(--size-min-piece) + 16px),1fr));gap:0;}#basic li{border-radius:0;border-bottom:1px dashed rgba(255,255,255,0.4);}#basic li:first-child{border-radius:8px 8px 0 0;}#basic li:last-child{border-radius:0 0 8px 8px;border:none;}}