/* Set the size of the div element that contains the map */

/* JGKS0010 レイアウト start */
#map {
	width: 100%;
	height: 100%;
}
#parent {
	display: flex;
	margin-bottom: var(--size5);
}
#child1 {
	width: 650px;
	height: 500px;
	margin-left: var(--size5);
}
#child2 {
	width: 500px;
	height: 400px;
	margin-left: var(--size5);
	overflow-y: scroll;
}
#searchResultArea {
    display: none;
}
#dynamicText {
text-align: right;
}

aside {
    display: block;
    unicode-bidi: isolate;
}
.border1 {
	outline: 2px solid #A7A9BC;
}
ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
    unicode-bidi: isolate;
}
.information {
    display: none;
    grid-template-columns: 1fr;
    grid-template-rows: max-content 1fr;
    gap: 0px 0px;
    margin: 0 var(--size6) var(--size4) var(--size6);
    padding: var(--size2) var(--size2) var(--size2) calc(var(--size6) +(var(--size2)* 2));
    background: url(img/icon_info.svg) no-repeat var(--size2) var(--size2) / 24px auto transparent;
    border: 1px solid #81E3CF;
    background-color: #ffffff;
}
.information.show{
  display: grid;
}
.information header{
	display:flex;
	align-items:center;
}
.information header h1{
	flex-grow:1;
	font-size:16px;
	font-weight:bold;
}
.information > header .close{
	width:14px;
	height:14px;
	align-self:flex-start;
	margin-left:var(--size3);
}
.toggleSection {
        margin: var(--size4) var(--size6) 0 var(--size6);
}
.toggleSection > header{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    background-color: #E7EAED;
    padding: 0 var(--size4);
    min-height: var(--size7);
}
.toggleSection > header > .toggle{
    order: 1;
    width: var(--size5);
    height: var(--size5);
}
.toggleSection > header > h1{
    margin: 0;
    font-size: 16px;
    font-weight: normal;
    order: 2;
    margin-left: var(--size4);
    width: calc(100% - var(--size5) - var(--size2) - 1rem);
}
.toggleSection > header > h1:only-child{
    margin-left: 0;
}
.toggleSection > header > button + h1{
    margin-left:var(--size2);
    margin-right:1rem;
}
.toggleSection > div > p{
	margin:0  var(--size1);
	padding: var(--size2);
	border-bottom:2px solid #A7A9BC;
}
section.hide > div{
	display:none;
}
.JGKS0010Layout>div {
	padding: var(--size2) 0 0 0;
}
.JGKS0010Layout>div>label {
	margin-right: var(--size3);
}
.JGKS0010Layout>div>label>input {
	margin-right: var(--size2);
	cursor: pointer;
}
.JGKS0010Layout>div>input {
	margin-right: var(--size2);
}
.JGKS0010Layout>dl>dd>input {
	width: 400px;
}
.toggleSection>.JGKS0010SearchResult {
	margin-top: var(--size6);
}
.JGKS0010SearchResult>div {
	margin-left: 170px;
	padding: var(--size3);
}
.JGKS0010SearchResult>div>button {
	margin-left: var(--size4);
}
.rightAlignCommands{
    display: grid; 
    grid-template-columns: max-content; 
    grid-template-rows: 1fr; 
    gap: 0px var(--size4);
    grid-auto-flow: column;
    grid-auto-columns: max-content; 
    justify-content: end; 
    justify-items: end;
    margin: 0 var(--size6) 0 0;
    flex: 0 0 auto;
    box-sizing: border-box;
}
.rightAlignCommands{
    margin: 0 calc(var(--size4) * -1) 0 0;
}
button {
    appearance: auto;
    text-rendering: auto;
    color: buttontext;
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    align-items: flex-start;
    cursor: default;
    box-sizing: border-box;
    background-color: buttonface;
    margin: 0em;
    padding-block: 1px;
    padding-inline: 6px;
    border-width: 2px;
    border-style: outset;
    border-color: buttonborder;
    border-image: initial;
}
button.iconOnly.reversal{
	transform:rotate(180deg);
}
button.iconOnly{
	justify-content:flex-start;
	width:var(--size7);
	height:var(--size7);
	min-width:0;
	padding:0;
	border:0 none;
	overflow:hidden;
	text-indent:calc(var(--size8) * 2);
	white-space:nowrap;
	transform-origin:50% 50%;
	transform:rotate(0);
	background-size:75% auto,75% auto;
}
.close {
    background-image: url(img/icon_close.svg), url(img/icon_close_hover.svg);
}
.toggle{
	background-image:url("img/icon_toggle.svg"),url("img/icon_toggle_hover.svg");
}
/* JGKS0010 レイアウト end */
:root {
	--size1:4px;
	--size2:8px;
	--size3:12px;
	--size4:16px;
	--size5:20px;
	--size6:24px;
	--size7:32px;
	--size8:40px;
	--size9:48px;
	--size10:56px;
	--size11:64px;
	--layoutChassisInfoDt:150px;
	--textareaRow:9;
}