#mainGridContainer {
  background-color: #ffffff;
/*  overflow: hidden;*/
}

/* desktop */

@media all and (min-width: 960px) {

  #mainGridContainer {
    position: absolute;
    top: 11rem;
    left: 0;
    right: 0;
    display: grid;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: 1fr;
    grid-template-areas:
      "topImageContainer"
      "mainContentsGrid"
      "inquiryPc"
      "footer";
    display: -ms-grid;
    -ms-grid-rows: auto auto auto auto;
    -ms-grid-columns: 1fr;
  }

  #mainContentsGrid {
    grid-area: mainContentsGrid;
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }

  #mainContentsGrid.sideNavLeftRight {
/*
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 20.83vw 1fr 20.83vw;
    grid-template-areas:
      "leftNav mainContents rightNav";
    display: -ms-grid;
    -ms-grid-rows: auto;
    -ms-grid-columns: 20.83vw 1fr 20.83vw;
*/
  display: block;
  }

  #mainContentsGrid.sideNavLeft {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 20.83vw 1fr;
    grid-template-areas:
      "leftNav mainContents";
    display: -ms-grid;
    -ms-grid-rows: auto;
    -ms-grid-columns: 20.83vw 1fr;
  }

  #mainContentsGrid.sideNavRight {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 1fr 20.83vw;
    grid-template-areas:
      "mainContents rightNav";
    display: -ms-grid;
    -ms-grid-rows: auto;
    -ms-grid-columns: 1fr 20.83vw;
  }

  #mainContentsGrid.sideNavNone {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 100%;
    grid-template-areas:
      "mainContents";
    display: -ms-grid;
    -ms-grid-rows: auto;
    -ms-grid-columns: 100%;
  }

  #topImageContainer {
    grid-area: topImageContainer;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }

  #leftNav {
    grid-area: leftNav;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    display: none !important;
  }

  .sideNavNone #leftNav {
    display: none !important;
  }

  #mainContents {
    grid-area: mainContents;
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }

  .sideNavNone #mainContents {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }

  .sideNavLeft #mainContents {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
  }

  #rightNav {
    grid-area: rightNav;
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    display: none !important;
  }

  .sideNavNone #rightNav {
    display: none;
  }

  .sideNavLeft #rightNav {
    display: none;
  }

  #inquiryPc {
    grid-area: inquiryPc;
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }

  #footer {
    grid-area: footer;
    -ms-grid-row: 4;
    -ms-grid-column: 1;
  }

}

@media screen and (max-width: 1199px) {

  #mainGridContainer {
    top: 7rem;
  }
  
}

/* mobile */

@media screen and (max-width: 959px) {

  #mainGridContainer {
    position: absolute;
    top: 70px;
    left: 0;
    width: 100%;
  }

  #leftNav {
    position: fixed;
    top: 70px;
		bottom: 0;
    left: 0;
		width: 100%;
		display: none;
  }

  #rightNav {
		display: none;
  }

}

/* grid */

:root { --gridGap: 3rem; }
.gridGap0 { --gridGap: 0rem; }
.gridGap1rem { --gridGap: 1rem; }
.gridGap2rem { --gridGap: 2rem; }
.gridGap3rem { --gridGap: 3rem; }
.gridGap4rem { --gridGap: 4rem; }
.gridGap5rem { --gridGap: 5rem; }
.gridGap6rem { --gridGap: 6rem; }
.gridGap7rem { --gridGap: 7rem; }
.gridGap8rem { --gridGap: 8rem; }
.gridGap9rem { --gridGap: 9rem; }
.gridGap10rem { --gridGap: 10rem; }

_:-ms-lang(x)::-ms-backdrop, .gridGap0 { --gridGap: 3rem; } /* IE11の場合 */
_:-ms-lang(x)::-ms-backdrop, .gridGap1rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap2rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap3rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap4rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap5rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap6rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap7rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap8rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap9rem { --gridGap: 3rem; } 
_:-ms-lang(x)::-ms-backdrop, .gridGap10rem { --gridGap: 3rem; } 

@media screen and (min-width: 560px) and (max-width: 959px) {

.ts_gridGap0 { --gridGap: 0; }
.ts_gridGap1rem { --gridGap: 1rem; }
.ts_gridGap2rem { --gridGap: 2rem; }
.ts_gridGap3rem { --gridGap: 3rem; }
.ts_gridGap4rem { --gridGap: 4rem; }
.ts_gridGap5rem { --gridGap: 5rem; }
.ts_gridGap6rem { --gridGap: 6rem; }
.ts_gridGap7rem { --gridGap: 7rem; }
.ts_gridGap8rem { --gridGap: 8rem; }
.ts_gridGap9rem { --gridGap: 9rem; }
.ts_gridGap10rem { --gridGap: 10rem; }

}

@media screen and (max-width: 559px) {

.ms_gridGap0 { --gridGap: 0; }
.ms_gridGap1rem { --gridGap: 1rem; }
.ms_gridGap2rem { --gridGap: 2rem; }
.ms_gridGap3rem { --gridGap: 3rem; }
.ms_gridGap4rem { --gridGap: 4rem; }
.ms_gridGap5rem { --gridGap: 5rem; }
.ms_gridGap6rem { --gridGap: 6rem; }
.ms_gridGap7rem { --gridGap: 7rem; }
.ms_gridGap8rem { --gridGap: 8rem; }
.ms_gridGap9rem { --gridGap: 9rem; }
.ms_gridGap10rem { --gridGap: 10rem; }

}

.gridRows {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
	margin-left: calc(var(--gridGap) / 2 * -1);
	margin-right: calc(var(--gridGap) / 2 * -1);
}

.gridRowsCenter {
  justify-content: center;
}

.gridRowsReverse {
	flex-direction: row-reverse;
}

.g100 { flex-basis: calc(100% - var(--gridGap)); max-width: calc(100% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g95 { flex-basis: calc(95% - var(--gridGap)); max-width: calc(95% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g90 { flex-basis: calc(90% - var(--gridGap)); max-width: calc(90% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g85 { flex-basis: calc(85% - var(--gridGap)); max-width: calc(85% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g80 { flex-basis: calc(80% - var(--gridGap)); max-width: calc(80% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g75 { flex-basis: calc(75% - var(--gridGap)); max-width: calc(75% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g70 { flex-basis: calc(70% - var(--gridGap)); max-width: calc(70% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g65 { flex-basis: calc(65% - var(--gridGap)); max-width: calc(65% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g60 { flex-basis: calc(60% - var(--gridGap)); max-width: calc(60% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g55 { flex-basis: calc(55% - var(--gridGap)); max-width: calc(55% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g50 { flex-basis: calc(50% - var(--gridGap)); max-width: calc(50% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g45 { flex-basis: calc(45% - var(--gridGap)); max-width: calc(45% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g40 { flex-basis: calc(40% - var(--gridGap)); max-width: calc(40% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g35 { flex-basis: calc(35% - var(--gridGap)); max-width: calc(35% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g30 { flex-basis: calc(30% - var(--gridGap)); max-width: calc(30% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g25 { flex-basis: calc(25% - var(--gridGap)); max-width: calc(25% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g20 { flex-basis: calc(20% - var(--gridGap)); max-width: calc(20% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g15 { flex-basis: calc(15% - var(--gridGap)); max-width: calc(15% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g10 { flex-basis: calc(10% - var(--gridGap)); max-width: calc(10% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g05 { flex-basis: calc(5% - var(--gridGap)); max-width: calc(5% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

.g66 { flex-basis: calc(66.66% - var(--gridGap)); max-width: calc(66.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g33 { flex-basis: calc(33.33% - var(--gridGap)); max-width: calc(33.33% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
.g16 { flex-basis: calc(16.66% - var(--gridGap)); max-width: calc(16.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

@media screen and (min-width: 560px) and (max-width: 959px) {

  .ts_g100 { flex-basis: calc(100% - var(--gridGap)); max-width: calc(100% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g95 { flex-basis: calc(95% - var(--gridGap)); max-width: calc(95% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g90 { flex-basis: calc(90% - var(--gridGap)); max-width: calc(90% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g85 { flex-basis: calc(85% - var(--gridGap)); max-width: calc(85% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g80 { flex-basis: calc(80% - var(--gridGap)); max-width: calc(80% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g75 { flex-basis: calc(75% - var(--gridGap)); max-width: calc(75% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g70 { flex-basis: calc(70% - var(--gridGap)); max-width: calc(70% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g65 { flex-basis: calc(65% - var(--gridGap)); max-width: calc(65% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g60 { flex-basis: calc(60% - var(--gridGap)); max-width: calc(60% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g55 { flex-basis: calc(55% - var(--gridGap)); max-width: calc(55% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g50 { flex-basis: calc(50% - var(--gridGap)); max-width: calc(50% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g45 { flex-basis: calc(45% - var(--gridGap)); max-width: calc(45% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g40 { flex-basis: calc(40% - var(--gridGap)); max-width: calc(40% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g35 { flex-basis: calc(35% - var(--gridGap)); max-width: calc(35% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g30 { flex-basis: calc(30% - var(--gridGap)); max-width: calc(30% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g25 { flex-basis: calc(25% - var(--gridGap)); max-width: calc(25% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g20 { flex-basis: calc(20% - var(--gridGap)); max-width: calc(20% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g15 { flex-basis: calc(15% - var(--gridGap)); max-width: calc(15% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g10 { flex-basis: calc(10% - var(--gridGap)); max-width: calc(10% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g05 { flex-basis: calc(5% - var(--gridGap)); max-width: calc(5% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

  .ts_g66 { flex-basis: calc(66.66% - var(--gridGap)); max-width: calc(66.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g33 { flex-basis: calc(33.33% - var(--gridGap)); max-width: calc(33.33% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ts_g16 { flex-basis: calc(16.66% - var(--gridGap)); max-width: calc(16.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

}

@media screen and (max-width: 559px) {

  .ms_g100 { flex-basis: calc(100% - var(--gridGap)); max-width: calc(100% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g95 { flex-basis: calc(95% - var(--gridGap)); max-width: calc(95% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g90 { flex-basis: calc(90% - var(--gridGap)); max-width: calc(90% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g85 { flex-basis: calc(85% - var(--gridGap)); max-width: calc(85% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g80 { flex-basis: calc(80% - var(--gridGap)); max-width: calc(80% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g75 { flex-basis: calc(75% - var(--gridGap)); max-width: calc(75% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g70 { flex-basis: calc(70% - var(--gridGap)); max-width: calc(70% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g65 { flex-basis: calc(65% - var(--gridGap)); max-width: calc(65% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g60 { flex-basis: calc(60% - var(--gridGap)); max-width: calc(60% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g55 { flex-basis: calc(55% - var(--gridGap)); max-width: calc(55% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g50 { flex-basis: calc(50% - var(--gridGap)); max-width: calc(50% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g45 { flex-basis: calc(45% - var(--gridGap)); max-width: calc(45% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g40 { flex-basis: calc(40% - var(--gridGap)); max-width: calc(40% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g35 { flex-basis: calc(35% - var(--gridGap)); max-width: calc(35% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g30 { flex-basis: calc(30% - var(--gridGap)); max-width: calc(30% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g25 { flex-basis: calc(25% - var(--gridGap)); max-width: calc(25% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g20 { flex-basis: calc(20% - var(--gridGap)); max-width: calc(20% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g15 { flex-basis: calc(15% - var(--gridGap)); max-width: calc(15% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g10 { flex-basis: calc(10% - var(--gridGap)); max-width: calc(10% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g05 { flex-basis: calc(5% - var(--gridGap)); max-width: calc(5% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

  .ms_g66 { flex-basis: calc(66.66% - var(--gridGap)); max-width: calc(66.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g33 { flex-basis: calc(33.33% - var(--gridGap)); max-width: calc(33.33% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }
  .ms_g16 { flex-basis: calc(16.66% - var(--gridGap)); max-width: calc(16.66% - var(--gridGap)); margin-left: calc(var(--gridGap) / 2); margin-right: calc(var(--gridGap) / 2); }

}