@charset "utf-8";
/******************************
 price page
******************************/
.price-section-tariff {
    padding-bottom: 45px;
}
.price-section-simulation{
    padding:82px 0 120px;
    position:relative;
    overflow:hidden;
    background:#f0a400
}
.price-section-simulation:before{
    content:"";
    display:block;
    width:100%;
    height:90px;
    background:linear-gradient(180deg, rgb(186, 81, 16) 0%, rgb(240, 164, 0) 100%);
    position:absolute;
    top:0;
    left:0;
    right:0;
    opacity:.4
}
.price-simulation-content{
    padding:0 24px
}
.price-simulation-flex-right{
    display:flex;
    justify-content:flex-end;
    margin-top:15px
}
.price-simulation-price{
    text-align:right
}
.price-section-faq{
    padding-bottom:1px
}
.price-section-simulation .unit-title-01{
    margin-bottom:50px;
    position:relative;
    z-index:1
}
@media screen and (max-width: 768px){
    .price-section-tariff {
        padding: 40px 24px;
    }
    .price-section-simulation{
        padding:40px 0 60px
    }
    .price-section-simulation:before{
        height:45px
    }
    .price-section-simulation .unit-title-01{
        margin-bottom:30px
    }
}
.unit-simulation-01{
    padding:20px 70px;
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:10px 30px 30px rgba(176,82,45,.4);
    width:840px;
    margin-left:auto;
    margin-right:auto
}
.unit-simulation-01>.inner{
    padding:30px 0
}
.unit-simulation-01>.inner:nth-of-type(n+2){
    border-top:2px solid #dfdfdf
}
.unit-simulation-01>.inner .inner-flex{
    display:flex;
    justify-content:space-between;
    align-items:center
}
.unit-simulation-01>.inner .inner-flex+p{
    margin-top:1em
}
.unit-simulation-01 input[type=number],.unit-simulation-01 select{
    padding:15px 45px;
    width:180px;
    position:relative;
    background:#eee;
    border:2px solid #dfdfdf;
    border-radius:10px;
    overflow:hidden;
    font-weight:bold
}
.unit-simulation-01 .number-wrap{
    position:relative
}
.unit-simulation-01 .number-wrap input[type=number]::-webkit-outer-spin-button,.unit-simulation-01 .number-wrap input[type=number]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    appearance:none;
    margin:0
}
.unit-simulation-01 .number-wrap input[type=number]{
    appearance:textfield;
    text-align: center;
}
.unit-simulation-01 .number-wrap button{
    padding:0;
    position:absolute;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    z-index:2;
    border:none;
    font-size:0;
    background:rgba(0,0,0,0);
    color:inherit;
    cursor: pointer;
}
.unit-simulation-01 .number-wrap button:before{
    font-size:2rem;
    font-weight:bold;
    padding: 0.2em;
    border-radius: 50%;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
}
.unit-simulation-01 .number-wrap button.minus{
    left:15px
}
.unit-simulation-01 .number-wrap button.minus::before{
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    content:""
}
.unit-simulation-01 .number-wrap button.plus{
    right:15px
}
.unit-simulation-01 .number-wrap button.plus::before{
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    content:"+"
}
.unit-simulation-01 .number-wrap button:hover::before{
    color: #fff;
    background-color: #333;
    transition: .3s;
}
.unit-simulation-01 .number-wrap #output-number-of-unit{
    font-size:0;
    display:none;
    width:0;
    height:0
}
.unit-simulation-01 .select-wrap{
    position:relative
}
.unit-simulation-01 .select-wrap select{
    color:inherit
}
.unit-simulation-01 .select-wrap:before{
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    content:"";
    position:absolute;
    top:51%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    right:15px;
    z-index:1;
    pointer-events:none
}
@media screen and (max-width: 768px){
    .unit-simulation-01{
        width:100%;
        padding:20px
    }
    .unit-simulation-01>.inner .inner-flex{
        display:block
    }
    .unit-simulation-01 .number-wrap{
        display:inline-block
    }
    .unit-simulation-01 .select-wrap{
        display:inline-block
    }
}