@charset "UTF-8";
/*  TOP
================================================ */
/* this-site is PC-first : until 600px
================================================== */
/*! #mainImg メイン画像
---------------------------------------- */
#mainImg { background-image: url(../img/fee/simulation/bg_main01.png); }
@media screen and (max-width: 599px) { #mainImg .titMain { font-size: 20px; } }

#service { margin-bottom: 60px; }
#service .item { margin-bottom: 25px; }

/*! #calculation
---------------------------------------- */
#calculation { margin-bottom: 60px; }
#calculation .titIntro { line-height: 1.42; margin-bottom: 50px; font-weight: 500; font-size: 38px; text-align: center; }
#calculation .attention { line-height: 1.71; margin: 15px 0 0; color: #666; font-size: 14px; }

#calculation .queryWrap { position: relative; margin: 40px auto; max-width: 600px;}
#calculation .queryWrap:before { display: block; position: absolute; top: -42px; left: 50%; width: 0; height: 0; margin-left: -60px; }
#calculation .queryWrap table { width: 100%; border: 1px solid #cac2b6; }
#calculation .queryWrap th , #calculation .queryWrap td { border: 1px solid #cac2b6; }
#calculation .queryWrap thead th { width: 33.33%; line-height: 1; padding: 13px 0 12px; background-color: #f7f6f4; font-weight: normal; font-size: 14px; text-align: center; }
#calculation .queryWrap tbody th { padding: 6px 10px 6px; font-weight: normal; font-size: 14px; text-align: left; vertical-align: middle; }
#calculation .queryWrap tbody td { padding: 6px 10px 6px; font-weight: 700; font-size: 18px; text-align: right; vertical-align: middle; }
#calculation .queryWrap tfoot { background-color: #fff9ef; }
#calculation .queryWrap tfoot th { line-height: 1; padding: 24px 20px 20px; font-weight: normal; font-size: 14px; text-align: left; }
#calculation .queryWrap tfoot td { padding: 13px 20px; font-weight: 700; font-size: 18px; text-align: right; vertical-align: middle; }
#calculation .queryWrap .inputWrap { position: relative; width: 280px; margin: 2px auto; }
#calculation .queryWrap .inputWrap:after { display: block; position: absolute; top: 50%; right: 12px; width: 0; height: 0; margin-top: -5px; }
#calculation .queryWrap .inputWrap input { width: 100%; padding: 8px 10px; border: 2px solid #cac2b6; font-size: 20px; text-align: center;}
#calculation .queryWrap .inputWrap input::-ms-expand { display: none; }
#calculation .queryWrap .selectWrap { position: relative; width: 280px; margin: 2px auto; }
#calculation .queryWrap .selectWrap:after { display: block; position: absolute; top: 50%; right: 12px; width: 0; height: 0; margin-top: -5px; border-width: 9px 6px 0 6px; border-style: solid; border-color: #333 transparent transparent transparent; pointer-events: none; content: ""; }
#calculation .queryWrap .selectWrap select { width: 100%; line-height: 1.5; padding: 11px 12px; border: 2px solid #cac2b6; font-size: 16px; text-align: left; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
#calculation .queryWrap .selectWrap select::-ms-expand { display: none; }
#calculation .queryWrap .buttonWrap { position: relative; margin: 5px auto;}
#calculation .queryWrap .buttonWrap button {
    margin: 0 auto;
    font-size: 1.2em;
    padding: 4px 60px;
    position: relative;
    display: -webkit-box;
    font-weight: 700;
    text-decoration: none;
    color: #ffffff;
    background: #ff9000;
    transition: .4s;
    border-radius: 5px;
    box-shadow: 0 2px 1px 1px rgba(102, 102, 102, .2);
}
#calculation .queryWrap .buttonWrap button:hover {
    background: #ff9000;
    opacity: 0.5;
    color: #ffffff;
}
#calculation .queryWrap .buttonWrap button::-ms-expand { display: none; }


#calculation .resultWrap { position: relative; margin: 62px auto;}
#calculation .resultWrap:before { display: block; position: absolute; top: -42px; left: 50%; width: 0; height: 0; margin-left: -60px; border-width: 22px 60px 0 60px; border-style: solid; border-color: #e4e0da transparent transparent transparent; content: ""; }
#calculation .resultWrap table { width: 100%; border: 1px solid #cac2b6; }
#calculation .resultWrap th , #calculation .resultWrap td { border: 1px solid #cac2b6; }
#calculation .resultWrap thead th { width: 33.33%; line-height: 1; padding: 13px 0 12px; background-color: #f7f6f4; font-weight: normal; font-size: 14px; text-align: center; }
#calculation .resultWrap tbody th { padding: 18px 20px 16px; font-weight: normal; font-size: 14px; text-align: left; vertical-align: middle; }
#calculation .resultWrap tbody td { padding: 14px 20px 13px; font-weight: 700; font-size: 18px; text-align: right; vertical-align: middle; }
#calculation .resultWrap tfoot { background-color: #fff9ef; }
#calculation .resultWrap tfoot th { line-height: 1; padding: 24px 20px 20px; font-weight: normal; font-size: 14px; text-align: left; }
#calculation .resultWrap tfoot td { padding: 13px 20px; font-weight: 700; font-size: 18px; text-align: right; vertical-align: middle; }


/*! #serviceFees
---------------------------------------- */
#serviceFees { margin-bottom: 45px; }
#serviceFees .titIntro { line-height: 1.42; margin-bottom: 10px; font-weight: 500; font-size: 38px; text-align: center; }
#serviceFees .txt{ margin: 0 0 20px; font-size: 14px; text-align: center; }
#serviceFees .tableWrap { position: relative; margin: 30px 0 30px; }
#serviceFees .tableWrap table { width: 100%; border: 1px solid #cac2b6; }
#serviceFees .tableWrap th , #serviceFees .tableWrap td { border: 1px solid #cac2b6; }
#serviceFees .tableWrap thead th {
    width: 33.33%;
    line-height: 1;
    padding: 13px 0 12px;
    background-color: #f7f6f4;
    font-weight: normal;
    font-size: 14px;
    text-align: center;
}
#serviceFees .tableWrap tbody th {
    padding: 18px 20px 16px;
    font-weight: normal;
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
}
#serviceFees .tableWrap tbody td {
    padding: 14px 20px 13px;
    font-weight: 700;
    font-size: 18px;
    text-align: center;
    vertical-align: middle;
}
#serviceFees .tableWrap tfoot {
    background-color: #fff9ef;
}
#serviceFees .tableWrap tfoot th {
    line-height: 1;
    padding: 24px 20px 20px;
    font-weight: normal;
    font-size: 14px;
    text-align: center;
}
#serviceFees .tableWrap tfoot td {
    padding: 13px 20px;
    font-weight: 700;
    font-size: 18px;
    text-align: center;
    vertical-align: middle;
}

#serviceFees .attention { line-height: 1.71; margin: -15px 0 30px; color: #666; font-size: 14px; }
#serviceFees .tableWrap.column02 thead th{ width:50%; vertical-align: middle;}
#serviceFees .tableWrap.column04 thead th{ width:25%; vertical-align: middle;}

/* forSP */
@media screen and (max-width: 599px) { #calculation { margin-bottom: 30px; }  #calculation .titIntro { line-height: 1.24; margin-bottom: 30px; font-size: 20px; }  #calculation .areaSelect { padding: 10px 30px; }  #calculation .areaSelect .selectWrap { width: 100%; }  #calculation .areaSelect .selectWrap:after { top: 50%; right: 10px; }  #calculation .areaSelect .selectWrap select { padding: 6px 5px; }  #calculation .tableWrap { margin-top: 30px; }  #calculation .tableWrap:before { display: block; position: absolute; top: -21px; left: 50%; width: 0; height: 0; margin-left: -50px; border-width: 18px 50px 0 50px; border-style: solid; border-color: #e4e0da transparent transparent transparent; content: ""; }  #calculation .tableWrap thead th { padding: 10px 0 9px; }  #calculation .tableWrap tbody th { padding: 10px 10px 9px; }  #calculation .tableWrap tbody td { padding: 10px 10px 9px; font-size: 16px; }  #calculation .tableWrap tfoot th { padding: 10px 10px 9px; vertical-align: middle; }  #calculation .tableWrap tfoot td { padding: 10px 10px 9px; font-size: 16px; }  #calculation .attention { font-size: 12px; } 
                                       /*! #serviceFees
                                       ---------------------------------------- */
                                       #serviceFees { margin-bottom: 30px; }  #serviceFees .titIntro { line-height: 1.24; margin-bottom: 15px; font-size: 20px; }  #serviceFees .txt{ margin: 0 0 10px; font-size: 12px; text-align: center;
                                       } #serviceFees .tableWrap { margin-top: 30px; } #serviceFees .tableWrap thead th { padding: 10px 0 9px;     vertical-align: middle;}  #serviceFees .tableWrap tbody th { padding: 10px 5px 9px; font-size: 14px;}  #serviceFees .tableWrap tbody td { padding: 10px 2px 9px; font-size: 14px; }  #serviceFees .tableWrap tfoot th { padding: 10px 10px 9px; vertical-align: middle; }  #serviceFees .tableWrap tfoot td { padding: 10px 10px 9px; font-size: 16px; }  #serviceFees .attention { font-size: 12px; } 
}
/*# sourceMappingURL=maps/simulation.css.map */