body {
  font-size: 150%;
}

.display_price {
  border: 2px solid #007594;
  box-shadow: 3px 3px 3px rgba(#000, #000, #000, 0.5);
  width: 100%;
  height: auto;
  position: relative;
  padding: 10px;
  margin-bottom: 3em;
}

.display_price input[type="text"] {
  width: 100%;
  margin: 10px auto;
  line-height: 250%;
}

.display_price_error {
  display: inline;
  z-index: 100;
  width: 100%;
  height: auto;
  position: absolute;
  background-color: rgba(80, 80, 80, 0.8);
}
.error_area {
  display: block;
  position: relative;
  margin: 10px auto;
  width: 50%;
  background-color: #fefefe;
}

.btn {
  font-size: 1.4rem;
}

.form-control {
  font-size: 1.4rem;
}

.input-group-text {
  font-size: 1.4rem;
}

.NGarea {
  position: absolute;
  background-color: rgba(#000, #000, #000, 0.5);
  height: 100%;
  z-index: 100;
}

.table-estimate {
  border: 2px solid #ffffff;
  border-collapse: collapse;
  margin: 30px auto;
}

.table-estimate * {
  font-size: 1.8rem;
}

.table-estimate th {
  border: 2px solid#ffffff;
  width: 8em;
  line-height: 150%;
  vertical-align: middle;
  text-align: center;
  font-weight: bold;
  background-color: #cccccc;
}

.table-estimate .th-vertical {
  writing-mode: vertical-rl;
  width: 3em;
  text-align: center;
  color: #ffffff;
  background-color: #1d2088;
}

.table-estimate td {
  border: 2px solid #ffffff;
  padding: 10px;
  background-color: #e6e6e6;
  vertical-align: middle;
}

.table-estimate .td_img {
  border-right: none;
  width: 3em;
  padding-right: 0;
}
.td_img > image {
  width: 100%;
}
.table-estimate .td_img + td {
  border-left: none;
}

.table-estimate input {
  border: 2px solid #1d2088;
  line-height: 200%;
  width: 10em;
  text-align: center;
}

.table-estimate input + label {
  position: relative;
}

.table-estimate input:invalid {
  background-color: #ce8a8b;
  border: 2px solid #b93f33;
}

.table-estimate input:enabled {
  color: rgba(000, 000, 000, 0.7);
}

label[for*="resist"]::before,
label[for*="silk"]::before {
  position: absolute;
  display: block;
  width: 2em;
  line-height: 100%;
  z-index: 1;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
}
label[for="resistSurface1"]::before {
  content: url(../images/item_img_btn01.png);
}
label[for="resistSurface2"]::before {
  content: url(../images/item_img_btn02.png);
}
label[for="resistColor1"]::before {
  content: url(../images/item_img_btn03.png);
}
label[for="resistColor2"]::before {
  content: url(../images/item_img_btn04.png);
}
label[for="resistColor3"]::before {
  content: url(../images/item_img_btn05.png);
}
label[for="resistColor4"]::before {
  content: url(../images/item_img_btn06.png);
}
label[for="resistColor5"]::before {
  content: url(../images/item_img_btn07.png);
}
label[for="silkSurface1"]::before {
  content: url(../images/item_img_btn08.png);
}
label[for="silkSurface2"]::before {
  content: url(../images/item_img_btn09.png);
}
label[for="silkSurface3"]::before {
  content: url(../images/item_img_btn10.png);
}
label[for="silkColor1"]::before {
  content: url(../images/item_img_btn11.png);
}
label[for="silkColor2"]::before {
  content: url(../images/item_img_btn12.png);
}
label[for="silkColor3"]::before {
  content: url(../images/item_img_btn13.png);
}


.btn-check:checked + .btn-rounded {
  background-color: #1d2088;
  color: #ffffff;
  box-shadow: 2.6px 2.6px 2.8px rgba(000, 000, 000, 0.4);
}

.item_image {
  width: 2em;
  margin: 0 1em 0 0;
}

#estimate_area {
  position: relative;
}
@media (max-width: 780px) {
	#estimate_area {
	}
}	
#estimate_area h2 {
  position: relative;
  background-color: #1d2088;
  border-radius: 5px;
  font-size: 1.4em;
  text-align: center;
  color: #ffffff;
  line-height: 3em;
  margin: 3em 0;
}
#estimate_area h2::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;

  left: 0;
  right: 0;
  bottom: -0.5em;
  margin: auto;
}

#estimate_area h3 {
  position: relative;
  width: 3.5em;
  height: 3em;
  color: #ffffff;
  font-size: 1.8em;
  z-index: 1;
  text-align: center;
  line-height: 110%;
  top: -0.5em;
  left: 0;
}
#estimate_area h3::before {
  content: "";
  position: absolute;
  background-color: #007594;
  width: 3.5em;
  height: 3em;
  z-index: -1;
  left: 0;
  top: 0;
  bottom: 0.75em;
  right: 0;
  margin: auto;
}

.estimate_ng_area {
  background-color: rgba(106, 104, 104,.9);
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.estimate_ng_area button{
  position:sticky;
  top: 100px;
}
#nomal_plan h3 {
  color: #ffffff;
}

#fast_plan h3,
#fast_plan button {
  color: #f4b4d0;
}

#fastest_plan h3,
#fastest_plan button {
  color: #fff100;
}

#estimate_area input {
  border: 2px solid #1d2088;
}

#estimate_area [id$="Date"] {
  width: 5em;
  line-height: 250%;
}

#nomal_plan button:disabled,
#fast_plan button:disabled,
#fastest_plan button:disabled {
  color: #dddddd;
}

#estimate_area input,
#estimate_area label {
  font-size: 0.9em;
  font-weight: bold;
}
.estimate_date {
  position: absolute;
  top: 0.2em;
  left: 8em;
  width: auto;
}

.btn-order {
  display: block;
  background-color: #1d2088;
  border: 2px solid #ffffff;
  color: #ffffff;
  box-shadow: 2.6px 2.6px 2.8px rgba(000, 000, 000, 0.4);
  padding: 20px;
  border-radius: 10px;
  display: block;
  margin: auto;
  margin-bottom: 10px;
  font-weight: bold;
}

.btn-order:disabled {
  background-color: #6a6868;
}
.form_required {
  background-color: #e83929;
  border-radius: 5px;
  font-size: smaller;
  font-weight: normal;
  box-shadow: 3px 3px 3px rgba(#000, #000, #000, 0.5);
  padding: 0 1em;
}
dt {
  font-weight: bold;
}
#order_info .container {
  position: relative;
  border: 2px solid #8cc9ec;
  border-radius: 20px;
  margin-bottom: 5em;
  padding-bottom: 3em;
}

#order_info dl {
  margin: 2em;
}

#order_info dd {
  margin: 0 1em;
}

#order_info dt {
  background-color: #b9def4;
  padding: 0.5em;
  margin: 1em;
}

#order_info input:not([type="file"]),
#order_info textarea {
  border: none;
  border-bottom: 1px solid #cccccc;
  width: 100%;
  font-size: 1.2em;
}
#order_info input[type="file"] {
  border: 2px solid #52b2ca;
  border-radius: 5px;
  width: 100%;
}
#order_info input[type="file"]::file-selector-button {
  background-color: #3a93db;
  color: #ffffff;
  border: none;
  padding: 0.5em 1em;
}

#order_info #zip {
  width: 5em;
}

#order_price input[type="text"] {
  color: #3a93d9;
  border-bottom: 1.5px solid #5aaee4;
  font-weight: bolder;
  line-height: 200%;
}

#order_info #estimate {
  position: absolute;
  background-color: #3a93db;
  color: #ffffff;
  border-radius: 5px;
  display: block;
  width: 15em;
  height: 3em;
  right: -1em;
  bottom: -1.5em;
  z-index: 100;
  text-align: left;
  text-indent: 2em;
  font-size: 1.2em;
  font-weight: bold;
  box-shadow: 2px 3px 3px rgba(000, 000, 000, 0.5);
}
#order_info #estimate::before {
  content: "";
  /*邨ｶ蟇ｾ驟咲ｽｮ縺ｧ荳狗ｷ壹 菴咲ｽｮ繧呈ｱｺ繧√ｋ*/
  position: absolute;
  top: 1.6em;
  right: 1em;
  /*荳狗ｷ壹 蠖｢迥ｶ*/
  width: 18%;
  height: 2px;
  background: #ffffff;
}
#order_confirmation h3 {
  display: inline-block;
  color: #013388;
  font-size: 2em;
  font-weight: bold;
  position: relative;
  margin-bottom: 1em;
  line-height: 150%;
}

#order_confirmation h3::before {
  content: "";
  position: absolute;
  height: 5px;
  bottom: 0;
  right: 0;
  background-color: #013388;
  margin: 0 0 0 0;
  width: 100vw;
}

#order_info #estimate::after {
  content: "";
  /*邨ｶ蟇ｾ驟咲ｽｮ縺ｧ遏｢蜊ｰ縺ｮ菴咲ｽｮ繧呈ｱｺ繧√ｋ*/
  position: absolute;
  top: 1.2em;
  right: 1em;
  /*遏｢蜊ｰ縺ｮ蠖｢迥ｶ*/
  width: 15px;
  height: 2px;
  background: #ffffff;
  transform: rotate(45deg);
}

#order_confirmation table {
  border: 2px solid #81caed;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 10px;
  margin-bottom: 3em;
  font-size: 1.2em;
  overflow: hidden;
}

#order_confirmation th,
#order_confirmation td {
  border-collapse: collapse;
  line-height: 250%;
  padding: 0 1em;
}
#order_confirmation th,
#order_confirmation td {
  border-bottom: 2px solid #81caed;
}
#order_confirmation tr:last-child th,
#order_confirmation tr:last-child td {
  border-bottom: none;
}
#order_confirmation th {
  width: 20em;
  background-color: #b2dff4;
  font-weight: bold;
  vertical-align: middle;
}

#order_confirmation td {
  width: calc(100%-20em);
  border-left: 2px solid #81caed;
}

#EstimateBtn {
  position: relative;
  background-color: #3a93db;
  color: #ffffff;
  border-radius: 5px;
  display: block;
  width: 15em;
  height: 3em;
  right: -1em;
  bottom: -1.5em;
  z-index: 100;
  text-align: left;
  text-indent: 2em;
  font-size: 1.2em;
  font-weight: bold;
  box-shadow: 2px 3px 3px rgba(000, 000, 000, 0.5);
  margin: 0 auto 2em;
}

#EstimateBtn:disabled {
  background-color: #6a6868;
}

#EstimateBtn::before {
  content: "";
  /*邨ｶ蟇ｾ驟咲ｽｮ縺ｧ荳狗ｷ壹 菴咲ｽｮ繧呈ｱｺ繧√ｋ*/
  position: absolute;
  top: 1.6em;
  right: 1em;
  /*荳狗ｷ壹 蠖｢迥ｶ*/
  width: 18%;
  height: 2px;
  background: #ffffff;
}

#EstimateBtn::after {
  content: "";
  /*邨ｶ蟇ｾ驟咲ｽｮ縺ｧ遏｢蜊ｰ縺ｮ菴咲ｽｮ繧呈ｱｺ繧√ｋ*/
  position: absolute;
  top: 1.2em;
  right: 1em;
  /*遏｢蜊ｰ縺ｮ蠖｢迥ｶ*/
  width: 15px;
  height: 2px;
  background: #ffffff;
  transform: rotate(45deg);
}

.rules_area {
  overflow-y: scroll;
  width: 100%;
  height: 10em;
  background-color: #f2f2f2;
  padding: 1em 0 1em 1em;
}