@charset "utf-8";
/* CSS Document */

.calcurationBox { position: relative; padding-bottom: 100px;}
.calcurationBox button.buttonRdo { display: inline-block; margin: 5px 5px; width: auto; background-color: transparent;    border: none;     line-height: 220%;
 cursor: pointer; outline: none; padding: 0 5px; appearance: none; border: 1px solid #ccc; background-color: #efefef; border-radius: 3px; color: #111; font-size: 73%;
}
.calcurationBox button.buttonRdo.on { background-color: #70a6ff ; }
.calcurationBox button.buttonChk { display: inline-block; margin: 5px 5px; width: auto; background-color: transparent; border: none; line-height: 220%; cursor: pointer; outline: none; padding: 0 5px; appearance: none; border: 1px solid #ccc; background-color: #efefef; border-radius: 3px; color: #111; font-size: 73%;
}
.calcurationBox button.buttonChk.on { background-color: #70a6ff ; }
.calcurationBox h4{}
.calcurationBox h6{ }
#shopSelectBox,#rankSelectBox,#courseSelectBox,#optionSelectBox { margin-bottom: 50px;}
@media (max-width: 767px) {
#shopSelectBox,#rankSelectBox,#courseSelectBox,#optionSelectBox { margin-bottom: 35px;}
}
#rankSelectBox div { display: none; }
#courseSelectBox div { display: none; }
#optionSelectBox div { display: none; }

.calcurationBox h4 {
    font-size: 110%;
    font-weight: bold; padding-bottom: 5px; padding-left: 5px;
    border-left: #579bf3 10px solid; border-bottom: #579bf3 5px solid;
}
.calcurationBox h6 span{
    display: inline-block;
    font-size: 90%;
    padding: 7px 12px;
    margin-bottom: 15px;
    border: 1px solid #222222;
    border-bottom: 4px solid #222222;
    font-weight: bold;
    color: #222222;
    border-radius: 5px; margin-top: 15px ; margin-bottom: 15px;
}
.calcurationBox .result{ width: 240px; background: rgba(255, 255, 255, 0.95); border: 2px solid #111 ; padding: 10px; position: fixed; bottom: 55px ; left: 20px ; font-size: 115%; font-weight: 700;}