@charset "utf-8";

#contentsindex {
  margin-bottom: 85px;
}

#contentsindex .department__title {
  font-weight: bold;
  padding: 5px 25px;
  border: 2px solid #1d4c85;
  -webkit-box-shadow: 3px 3px 4px rgba(29, 76, 133, 0.3);
          box-shadow: 3px 3px 4px rgba(29, 76, 133, 0.3);
  border-radius: 0px 0px 10px 10px;
  border-top: none;
  width: 100%;
  margin-bottom: 30px;
  background:initial;
}

.department__title {
  position: relative;
  display: inline-block;
  max-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.department__title::before {
  content: "";
  position: absolute;
  bottom: -22px;
  left: 5%;
  margin-left: -9px;
  border: 9px solid transparent;
  border-top: 15px solid #fff;
  z-index: 2;
  -webkit-transform: skewX(-50deg);
      -ms-transform: skewX(-50deg);
          transform: skewX(-50deg);
  -webkit-filter: drop-shadow(3px 3px 4px rgba(29, 76, 133, 0.3));
          filter: drop-shadow(3px 3px 4px rgba(29, 76, 133, 0.3));
}

.department__title::after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 5%;
  margin-left: -17px;
  border: 12px solid transparent;
  border-top: 18px solid #1d4c85;
  z-index: 1;
  -webkit-transform: skewX(-50deg);
      -ms-transform: skewX(-50deg);
          transform: skewX(-50deg);
  -webkit-filter: drop-shadow(3px 3px 4px rgba(29, 76, 133, 0.3));
          filter: drop-shadow(3px 3px 4px rgba(29, 76, 133, 0.3));
}

#table__area {
  margin-bottom: 96px;
}

#hayamihyo__box {
  max-width: 650px;
  margin: 0 auto;
}

#hayamihyo__table {
  width: 100%;
  text-align: center;
}

#hayamihyo__table th {
  height: 30px;
  width: calc(100% / 3);
  background: #1d4c85;
  color: #fff;
}

#hayamihyo__table td {
  height: 50px;
  border-bottom: 1px solid rgba(29, 76, 133, 0.5);
  font-weight: bold;
}

p.explanation__firstline {
  margin-right: 0;
  margin-bottom: 28px;
  margin-left: 0;
  width: 100%;
}

.calculation__example__box {
  padding: 22px 53px;
  background-color: #f4f4f4;
  font-size: 14px;
  font-weight: bold;
  width: 47.777778%;
  margin: 0 auto;
  text-align: center;
  line-height: 1.64285714;
  position: relative;
}

.calculation__example__box::before {
  position: absolute;
  content: "計算例";
  top: 0;
  left: 0;
  padding: 4px 19px;
  background: #1d4c85;
  color: #fff;
}

.calculation__example__box p {
  margin: 0;
  width: 100%;
}

#howtocalculation__tom,
#howtocalculation__totsubo {
  margin-top: 36px;
  line-height: 1.57142857;
}

#howtocalculation__tom p,
#howtocalculation__totsubo p {
  margin: 0;
  width: 100%;
  letter-spacing: 0.01em;
}

.howtocalculation__emphasis {
  display: block;
  font-weight: bold;
  margin-top: 25px;
  margin-bottom: 25px;
}

#explanation__totsubo {
  margin-top: 94px;
}

.area_unit_box {
  margin: 10px auto 96px;
}

.title {
  color: #333;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 28px;
}

.calculator_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.calculator_form {
  /* padding: 0 62px 0 0;
  background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2214%22%20height%3D%2236%22%20viewBox%3D%220%200%2014%2036%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M13.6197%2017.439C13.8494%2017.7777%2013.8494%2018.2223%2013.6197%2018.561L2.32779%2035.2218C1.7749%2036.0375%200.500003%2035.6462%200.500003%2034.6607L0.500003%201.33927C0.500003%200.353807%201.77491%20-0.0375288%202.32779%200.778227L13.6197%2017.439Z%22%20fill%3D%22%23DCDCDC%22%2F%3E%3C%2Fsvg%3E);
  background-position: right 24px top 50px; */
  width: 46.5%;
  background: #f4f4f4;
}

.calculator_form_inner {
  padding: 22px 43px 22px 38px;
}

.calculator_title_box {
  /* display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
  margin-bottom: 12px;
  -webkit-transition: .3s;
  transition: .3s; */
  margin-bottom: 12px;
}

.calculator_title {
  font-size: 16px;
  font-weight: bold;
  color: #333;
}

.calculator_title_explanation {
  font-size: 12px;
  font-weight: normal;
}

.calculator_input_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 14px;
}

.calculator_input {
  width: 126px;
  border-radius: 5px;
  background: #fff;
  border: 1px solid #707070;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px 16px;
  font-size: 16px;
  color: #333;
}

.calculator_input_radio_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.calculator_input_box span {
  font-size: 16px;
  line-height: 21px;
  color: #333;
  font-weight: bold;
}

.calculator_input_radio_box input {
  display: none;
}
input[type="checkbox"],
input[type="radio"] {
  margin-right: 3px;
}
[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

.calculator_input_radio_box label {
  margin-left: 22px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.calculator_input_radio_box label::before {
  content: "";
  display: block;
  height: 24px;
  width: 24px;
  border: 1px solid #b6b6b6;
  margin-right: 8px;
  border-radius: 24px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background: #fff;
}

.calculator_input_radio_box input[type="radio"]:checked + label::after {
  opacity: 1;
}
.calculator_input_radio_box label::after {
  content: "";
  display: block;
  height: 14px;
  width: 14px;
  background: #1d4c85;
  border-radius: 14px;
  opacity: 0;
  position: absolute;
  top: 5px;
  left: 5px;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.area_unit_box .calculator_box .calculator_form .calculator_button {
  width: 100%;
}

.calculator_img {
  width: 4.225%;
}

.calculator_result {
  width: 46.5%;
  background: #f4f4f4;
  position: relative;
}

.calculator_result::after {
  position: absolute;
  content: "";
  background: url(/img/calculate_deco.png) no-repeat center center / contain;
  width: 125px;
  height: 190px;
  top: -65%;
  right: 0;
}

.calculator_button button {
  color: #fff;
  padding: 10px 34px;
  border-radius: 5px;
  background: #1d4c85;
  border: none;
  font-size: 16px;
  font-weight: bold;
  width: 100%;
}

.calculator_button button:disabled {
  background: #b6b6b6;
  pointer-events: none;
}

.calculator_result_inner {
  padding: 30px 40px 20px 40px;
}

.calculator_result_box {
  border: 1px solid #707070;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 5px;
  padding: 25px 0px;
  margin-bottom: 13px;
  background: #fff;
}

/* .area_unit_box .calculator_box .calculator_result .calculator_result_box .title {
  color: #dcdcdc;
  font-weight: 700;
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  margin-bottom: 15px;
} */

.result_text_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.result_text {
  font-weight: bold;
  font-size: 18px;
  line-height: 20px;
  color: #dcdcdc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.result_equal {
  font-size: 18px;
  padding-right: 5px;
  padding-left: 5px;
}

.read_text {
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  color: #dcdcdc;
}

.area_unit_box .calculator_box .calculator_result .result_annotation {
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}
.area_unit_box .calculator_box .calculator_result .result_annotation {
  font-size: 10px;
  line-height: 15px;
  color: #3f3f3f;
}

#calculator_img_pc {
  display: block;
}

#calculator_img_pc.hide_arrow {
  display: none;
}

#calculator_img_pc_after.hide_arrow {
  display: none;
}

#calculator_img_pc_after {
  display: block;
}

#calculator_img_sp,
#calculator_img_sp_after {
  display: none;
}

.area_unit_box .calculator_box .calculator_result .calculator_result_box.active .read_text,
.area_unit_box .calculator_box .calculator_result .calculator_result_box.active .result_equal,
.area_unit_box .calculator_box .calculator_result .calculator_result_box.active .result_text {
  color: #1d4c85;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.is-sp {
  display: none;
}

@media (max-width: 768px) {
  /* レイアウト調整 */
  /* div#wrap_all {
    min-width: auto;
  }

  ol#breadcrumb {
    display: none;
  } */

  div#wrap_breadcrumb {
    margin-top:80px;
    margin-bottom:0px !important;
  }
  #contentsindex {
    width: 100%;
  }

  #fixed_nav {
    height: 100%;
  }

  #header_inner_new h1 {
    height:15px;
    overflow:hidden;
  }
  /* #h_logo {
    display: none;
  } */
  /* レイアウト調整ここまで */

  .is-sp {
    display: block;
  }

  div#container {
    width: auto;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-top: 20px;
    margin-right: 10px;
    margin-left: 10px;
  }

  #contentsindex .department__title {
    padding: 5px 20px;
  }

  .title {
    text-align: center;
  }

  .calculator_box {
    display: block;
  }

  .calculator_form {
    width: 100%;
  }

  .calculator_form_inner {
    padding: 10px;
  }

  .calculator_img {
    margin: 15px auto;
  }

  #calculator_img_pc,
  #calculator_img_pc_after {
    display: none;
  }

  .calculator_result::after {
    display: none;
  }

  #calculator_img_sp {
    display: block;
  }

  #calculator_img_sp.hide_arrow_sp {
    display: none;
  }

  #calculator_img_sp_after.hide_arrow_sp {
    display: none;
  }

  #calculator_img_sp_after {
    display: block;
  }

  .calculator_result {
    width: 100%;
  }

  .calculator_result_inner {
    padding: 20px;
  }

  .area_unit_box {
    margin-bottom: 80px;
  }

  #table__area {
    margin-bottom: 80px;
  }

  .calculation__example__box {
    width: auto;
    padding: 30px 20px;
  }

  #explanation__totsubo {
    margin-top: 80px;
  }
}