/* PHP 8.2 inquiry form additions. The site frame and colors come from the
   original ONEPA stylesheets loaded immediately before this file. */
#form_area .notice { margin: 0 0 12px; padding: 10px; border: 1px solid #bbb; }
#form_area .notice.error, .field-error { color: #b00000; }
#form_area .notice.error { border-color: #c66; background: #fff1f1; }
#form_area fieldset { margin: 0 0 15px; padding: 0; border: 0; }
#form_area .field {
  display: grid;
  grid-template-columns: 189px minmax(0, 1fr);
  box-sizing: border-box;
  width: 585px;
  margin-left: 1px;
  border: 1px solid #ccc;
  border-top: 0;
  background: #fff;
}
#form_area fieldset > .Heading3 + .field { border-top: 1px solid #ccc; }
#form_area .label { padding: 10px; background: #f5f5f5; }
#form_area .label strong { color: #d00; font-weight: normal; }
#form_area .control { min-width: 0; padding: 10px; }
#form_area .field-hint { line-height: 1.5em; }
#form_area .control input[type="text"],
#form_area .control input[type="email"],
#form_area .control input[type="tel"],
#form_area .control input[type="url"] { width: 270px; max-width: 95%; }
#form_area .control textarea { width: 350px; max-width: 95%; height: 99px; }
#form_area .control select { max-width: 95%; }
#form_area .options label { display: block; margin-bottom: 5px; }
#form_area .inline-options label { display: inline; margin-right: 10px; margin-bottom: 0; }
#form_area .control input.TextBoxH { width: 169px; }
#form_area .control input.TextBoxS { width: 50px; }
#form_area .field-error { margin: 4px 0 0; }
#form_area .confirmation { width: 588px; margin: 0 0 15px; border: 1px solid #ccc; }
#form_area .confirmation div { display: grid; grid-template-columns: 190px minmax(0, 1fr); border-top: 1px solid #ccc; }
#form_area .confirmation div:first-child { border-top: 0; }
#form_area .confirmation dt, #form_area .confirmation dd { margin: 0; padding: 10px; }
#form_area .confirmation dt { background: #f5f5f5; }
#form_area .FormButton button { min-height: 34px; cursor: pointer; }
#thanks_area .notice { margin-bottom: 20px; }

@media (max-width: 760px) {
  body, div#header_area { box-sizing: border-box; width: 100% !important; min-width: 0 !important; max-width: 100%; }
  div#header_area, div#header_position { height: auto !important; }
  div#footer_area { min-width: 0 !important; }
  div#header_position, div#content_area, div#footer_area { box-sizing: border-box; width: 94% !important; max-width: 94%; }
  div#header_position { min-height: 0 !important; }
  div#header_position div#logo, div#header_position h1#logo { position: static !important; width: auto !important; height: auto !important; min-height: 50px; }
  div#header_position div#logo img, div#header_position h1#logo img { max-width: 100%; height: auto; }
  div#header_position div#logo span, div#header_position h1#logo span { position: static !important; display: block; }
  ul#header_navi { position: static !important; display: flex; flex-wrap: wrap; justify-content: flex-end; }
  div#main_menu { position: static !important; width: 100% !important; max-width: 100%; height: auto !important; }
  div#main_menu ul { display: flex; flex-wrap: wrap; width: 100% !important; max-width: 100%; height: auto !important; }
  div#main_menu ul li { flex: 1 1 150px; float: none !important; }
  div#main_menu ul li a { box-sizing: border-box; width: 100% !important; max-width: 100%; background-position: center top; }
  div#content_area div#main_area { float: none !important; width: 100% !important; }
  div#content_area div#side_area { display: none; }
  div#page_title, div.Heading2, div.Heading3 { box-sizing: border-box; width: 100% !important; max-width: 100%; }
  div#footer_area ul { position: static !important; box-sizing: border-box; width: 100% !important; max-width: 100%; margin-right: 0 !important; margin-left: 0 !important; }
  div#footer_area address { box-sizing: border-box; width: 100% !important; max-width: 100%; }
  div#page_top { box-sizing: border-box; width: auto !important; max-width: 94%; margin-right: auto; margin-left: auto; }
  #form_area .field, #form_area .confirmation div { grid-template-columns: 1fr; }
  #form_area .field, #form_area .confirmation, #form_area .agreement,
  div#main_area div#phone_area, div#form_area div.FormButton { width: auto; max-width: 100%; }
  div#phone_area dl dd { font-size: 24px; }
  div#phone_area div#phone_message { box-sizing: border-box; width: auto !important; max-width: 100%; }
  #form_area .control input, #form_area .control textarea, #form_area .control select { box-sizing: border-box; width: 100%; max-width: 100%; }
}