@charset "utf-8";

body {
  font-family: 'メイリオ',
  'Hiragino Kaku Gothic Pro', sans-serif
}

body {
  margin: 0;
  padding: 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
}

img {
  vertical-align: bottom;
}

body {
  font-family: 'Paytone+One', serif;
}

ul {
  margin: 0;
  padding: 0;
}

ul {
  list-style: none;
}

ul {
  width: 100%;
  height: 100vw
}
a {
  text-decoration: none
}

a:hover {
  text-decoration: underline
}

body {
  font-family: 'Bitter', serif;
  font-weight: bold;
  text-align: center
}

body img {
  margin-bottom: 20px
}

.logo img {
  width: 100%
}

.menu li a {
  line-height: 8;
}

ul li {
  text-align: center;
}

.menu {
  background-color: #444444
}

/*ボタン*/

.menu {
  display: inline-block;
}

a:hover img {
  opacity: 0.50;
  filter: alpha(opacity=50);
  -ms-filter: "alpha( opacity=50 )";
  -moz-opacity: 0.50;
}

/*375px始まり*/

@media(max-width: 375px) {
  .menu {
    background-color: #444444
  }
  .logo {
    width: 375px
  }
  .menu ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
  }
  .menu li {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
  }
  .menu {
    height: 320px
  }
  .menu li {
    height: 70px
  }
  .box1 {
    margin: 0px;
    text-align: center
  }
  .demo1 {
    background: url(../image/e.bottom/concept.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on50.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.50.png) no-repeat;
    padding: 40px 30px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.50.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.on50.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on50.png)no-repeat
  }
  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on50.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off50.png) no-repeat;
    padding: 42px 30px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on50.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
   .yoyaku{
    background: url(../image/e.bottom/yoyaku_boton_off190.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/e.bottom/yoyaku_boton_on190.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin:0 auto;
         margin-left: 50px;
         }
  .yoyaku1{margin-top:50px }
    /*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:375px}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;}
  .top{-ms-grid-column:1;
      -ms-grid-row:2}
  .google{-ms-grid-column:1;
         -ms-grid-row:3}
  .tenki{-ms-grid-column:1;
         -ms-grid-row:4}
  .tizu{-ms-grid-column:1;
  -ms-grid-row:5}
  .car{-ms-grid-column:1;
     -ms-grid-row:6}
  .train{-ms-grid-column:1;
  -ms-grid-row:7}
  .tel{-ms-grid-column:1;
  -ms-grid-row:8}
  .small{-ms-grid-column:1;
  -ms-grid-row:9}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas: "side" "head" "main1" "main" "main4" "foot1" "foot2" "foot" "down";
    grid-template-columns: 375px;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width: 375px;
  }
  .menu {
    height: px
  }

  .maps {
    margin: 0 auto;
    position: relative;
    width: 100%;
    padding-top: 56.25%;
  }
  iframe{width: 375px}
  .maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 375px !important;
    height: 100% !important;
  }
  .car img {
    margin: 0;
    margin-right: px
  }
  .root {
    width: 375px;
  }
  .car p {
    margin: 0;
    margin-left: px
  }
  .car {
    margin: px
  }
  .car {
    border-bottom: solid 1px;
    margin-right: px
  }
  .top {
    margin: px;
    text-align: center;
    margin-left: px;
    border-bottom: solid 1px;
  }
  .tenki {
    margin: 0px;
    border-bottom: solid 1px;
    padding: px;
    width: 375px
  }
  .train img {
    margin: 0;
    margin-top: px;
    margin-bottom: px;
  }
  .rosen {
    width: 375px
  }
  .train {
    margin-left: px;
    border-bottom: solid 1px
  }
  .p h6 {
    font-size: 15px
  }
  .train p {
    font-size: 15px;
    margin-left: 1px
  }
  h1 {
    font-size: 25px;
    text-align: center
  }
  .top p {
    display: inline-block;
    font-size: 15px;
    text-align: center;
    margin: 5px
  }
      #page-top {
    position: fixed;
    bottom: 20px;
    right: 0px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 80px;
    padding: 20px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
   .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 15px;
    width: 180px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 10px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
}


/*375px終わり*/

/*iphone7始まり*/

@media (min-width:376px) and (max-width: 599px) {
  .menu {
    background-color: #444444
  }
  .logo {
    width: 414px
  }
  .menu ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
  }
  .menu li {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
  }
  .menu {
    height: 350px
  }
  .menu li {
    height: 70px
  }
  .ul {
    height: 200px
  }
  .box1 {
    margin: 0px;
    text-align: center
  }
  iframe{width: 375px}
  .demo1 {
    background: url(../image/e.bottom/concept.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on50.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.50.png) no-repeat;
    padding: 40px 30px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.50.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.on50.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on50.png)no-repeat
  }
  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off50.png) no-repeat;
    padding: 40px 30px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on50.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off50.png) no-repeat;
    padding: 42px 30px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on50.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
   .yoyaku{
    background: url(../image/bottom/yoyaku_boton_off190.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/bottom/yoyaku_boton_on190.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin:0 auto;
         margin-left: 50px;
         }
  .yoyaku1{margin-top:50px }
  /*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:414px}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;}
  .top{-ms-grid-column:1;
      -ms-grid-row:2}
  .google{-ms-grid-column:1;
         -ms-grid-row:3}
  .tenki{-ms-grid-column:1;
         -ms-grid-row:4}
  .tizu{-ms-grid-column:1;
  -ms-grid-row:5}
  .car{-ms-grid-column:1;
     -ms-grid-row:6}
  .train{-ms-grid-column:1;
  -ms-grid-row:7}
  .tel{-ms-grid-column:1;
  -ms-grid-row:8}
  .small{-ms-grid-column:1;
  -ms-grid-row:9}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas: "side" "head" "main1" "main" "main4" "foot1" "foot2" "foot" "down";
    grid-template-columns: 414px;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width: 414px;
  }
  .menu {
    height: px
  }
  .maps {
    margin: 0 auto;
    position: relative;
    width: 100%;
    padding-top: 56.25%;
  }
  .maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 414px !important;
    height: 100% !important;
  }
  .car img {
    margin: 0;
    margin-right: px
  }
  .root {
    width: 414px;
  }
  .car p {
    margin: 0;
    margin-left: px
  }
  .car {
    margin: px
  }
  .car {
    border-bottom: solid 1px;
    margin-right: px
  }
  .top {
    margin: px;
    text-align: center;
    margin-left: px;
    border-bottom: solid 1px;
  }
  .tenki {
    margin: 0px;
    border-bottom: solid 1px;
    padding: px;
    width: 414px
  }
  .train img {
    margin: 0;
    margin-top: px;
    margin-bottom: px;
  }
  .rosen {
    width: 414px
  }
  .train {
    margin-left: px;
    border-bottom: solid 1px
  }
  .p h6 {
    font-size: 15px
  }
  .train p {
    font-size: 15px;
    margin-left: 1px
  }
  h1 {
    font-size: 25px;
    text-align: center
  }
  .top p {
    display: inline-block;
    font-size: 15px;
    text-align: center;
    margin-left: 0px
  }
      #page-top {
    position: fixed;
    bottom: 20px;
    right: 0px;
    font-size: 77%;
}
   .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 13px;
    width: 150px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 10px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 80px;
    padding: 20px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
}

/*iphone7終わり*/

/*ipad始まり*/

@media (min-width:600px) and (max-width: 774px) {
  .demo1 {
    background: url(../image/e.bottom/concept.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off.png) no-repeat;
    padding: 50px 40px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off.png) no-repeat;
    padding: 50px 40px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on.png)no-repeat
  }
  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off.png) no-repeat;
    padding: 31px 40px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off.png) no-repeat;
    padding: 40px 40px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
  .yoyaku{
    background: url(../image/e.bottom/yoyaku_boton_off.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/e.bottom/yoyaku_boton_on.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin-left: auto;
    margin-right: auto;
         }
  .logo {
    width: 100px;
  }
  .menu {
    width: 100px;
    height:
  }
  .yoyaku1{margin-top:50px }
  .kannrenn{margin-top: 50px}
  /*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:100px 1fr}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;
       -ms-grid-row:7}
  .top{-ms-grid-column:2;
      -ms-grid-row:1}
  .google{-ms-grid-column:2;
         -ms-grid-row:2}
  .tenki{-ms-grid-column:2;
         -ms-grid-row:3}
  .tizu{-ms-grid-column:2;
  -ms-grid-row:4}
  .car{-ms-grid-column:2;
     -ms-grid-row:5}
  .train{-ms-grid-column:2;
  -ms-grid-row:6}
  .tel{-ms-grid-column:2;
  -ms-grid-row:7}
  .small{-ms-grid-column:1;
   -ms-grid-column-span:2;
  -ms-grid-row:8}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas: "side head " "side main1 " "side main   " "side main4 " "side foot1 " "side foot2" "side foot " "down down ";
    grid-template-columns: 100px 1fr;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width: 800px;
  }
  .menu {
    height: 1500px
  }
  .car img {
    margin: 0;
    margin-right: px
  }
  .root {
    width: 760px;
  }
  .car p {
    margin: 0;
    margin-left: 100px
  }
  .car {
    margin: px
  }
  .car {
    border-bottom: solid 1px;
    margin-right: px
  }
  .top {
    margin: 10px;
    text-align: center;
    margin-left: 90px;
    border-bottom: solid 1px;
  }
  .tenki {
    margin: 20px;
    border-bottom: solid 1px;
    padding: px;
    width: 770px
  }
  .train img {
    margin: 0;
    margin-top: px;
    margin-bottom: px;
  }
  .rosen {
    width: 790px
  }
  .train {
    margin-left: px;
    border-bottom: solid 1px
  }
  .p h6 {
    font-size: 15px
  }
  .train p {
    font-size: ;
    margin-left: 100px
  }
  h1 {
    text-align: center
  }
  .top p {
    display: inline-block;
    text-align: left
  }
  .side {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 150px;
    margin: auto
  }
   .kannrenn{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;}
  .kannrenn p{margin-left: 1px;
              margin-right: 10px}
     #page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
   .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 13px;
    width: 150px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 10px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 120px;
    padding: 30px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
 .box1 {
  position: fixed;
  top: 0;
  z-index: 9999;
}
}

/*ipad終わり*/

/*950px始まり*/

@media (min-width:775px) and (max-width: 950px) {
  .demo1 {
    background: url(../image/e.bottom/concept.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off.png) no-repeat;
    padding: 50px 40px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off.png) no-repeat;
    padding: 50px 40px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on.png)no-repeat
  }
  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off.png) no-repeat;
    padding: 31px 40px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off.png) no-repeat;
    padding: 40px 40px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
  .yoyaku{
    background: url(../image/e.bottom/yoyaku_boton_off.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/e.bottom/yoyaku_boton_on.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin:0 auto;
         margin-left: 0px;
         }
  .yoyaku1{margin-top:50px }
  .kannrenn{margin-top: 50px}
  .logo {
    width: 100px;
  }
  .menu {
    width: 100px;
    height:
  }
  /*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:100px 1fr}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;
       -ms-grid-row:7}
  .top{-ms-grid-column:2;
      -ms-grid-row:1}
  .google{-ms-grid-column:2;
         -ms-grid-row:2}
  .tenki{-ms-grid-column:2;
         -ms-grid-row:3}
  .tizu{-ms-grid-column:2;
  -ms-grid-row:4}
  .car{-ms-grid-column:2;
     -ms-grid-row:5}
  .train{-ms-grid-column:2;
  -ms-grid-row:6}
  .tel{-ms-grid-column:2;
  -ms-grid-row:7}
  .small{-ms-grid-column:1;
   -ms-grid-column-span:2;
  -ms-grid-row:8}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas: "side head " "side main1 " "side main   " "side main4 " "side foot1 " "side foot2" "side foot " "down down ";
    grid-template-columns: 100px 1fr;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .top {
    margin: 20px
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width: 800px;
  }
  .menu {
    height: 1500px
  }
  .car img {
    margin: 0;
    margin-right: px
  }
  .root {
    width: 600px;
  }
  .car p {
    margin: 0;
    margin-right: px
  }
  .car {
    margin: px
  }
  .car {
    border-bottom: solid 1px;
    margin-right: px
  }
  .top {
    margin: 10px;
    margin-right: auto;
    margin-left: auto;

    border-bottom: solid 1px;
  }
  .tenki {
    margin: 20px;
    border-bottom: solid 1px;
    padding: px;
    width: 700px
  }
  .train img {
    margin: 0;
    margin-top: px;
    margin-bottom: px;
  }
  .rosen {
    width: 700px
  }
  .google{width: 600px}
  .train {
    margin-right: 100px;
    border-bottom: solid 1px
  }
  .train p {
    margin: 0;
  }

  .p h6 {
    font-size: 15px
  }
  .top h5 {
    text-align: left;
    margin-left: 180px
  }
  .train p {
    font-size:
  }
  h1 {
    text-align: center
  }
  .top {
    text-align: center
  }
  .top p {
    display: inline-block;
    text-align: left
  }
  .side {
    position: absolute;
    top: 0px;
    right: 0px;
    left:100px;
    margin: auto
  }
    .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 15px;
    width: 180px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 10px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
  .kannrenn{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;}
  .kannrenn p{margin-left: 15px;
              margin-right: 15px}
  .root{width: 700px}
     #page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 120px;
    padding: 30px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
  .box1 {
  position: fixed;
  top: 0;
  z-index: 9999;
}
}

/*950px終わり*/

/*ipadpro1024始まり*/

@media (min-width:951px) and (max-width: 1024px) {
  .demo1 {
    background: url(../image/e.bottom/concept.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off.png) no-repeat;
    padding: 50px 40px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off.png) no-repeat;
    padding: 50px 40px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on.png)no-repeat
  }
  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off.png) no-repeat;
    padding: 31px 40px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off.png) no-repeat;
    padding: 40px 40px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
  .yoyaku{
    background: url(../image/e.bottom/yoyaku_boton_off.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/e.bottom/yoyaku_boton_on.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin:0 auto;
         margin-left: 0px;
         }
  .yoyaku1{margin-top: }
  .logo {
    width: 150px;
  }
  .yoyaku1{margin-top:50px }
  .kannrenn{margin-top: 50px}
  .menu {
    width: 150px;
    height:
  }
  /*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:150px 1fr}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;
       -ms-grid-row:7}
  .top{-ms-grid-column:2;
      -ms-grid-row:1}
  .google{-ms-grid-column:2;
         -ms-grid-row:2}
  .tenki{-ms-grid-column:2;
         -ms-grid-row:3}
  .tizu{-ms-grid-column:2;
  -ms-grid-row:4}
  .car{-ms-grid-column:2;
     -ms-grid-row:5}
  .train{-ms-grid-column:2;
  -ms-grid-row:6}
  .tel{-ms-grid-column:2;
  -ms-grid-row:7}
  .small{-ms-grid-column:1;
   -ms-grid-column-span:2;
  -ms-grid-row:8}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas: "side head " "side main1 " "side main   " "side main4 " "side foot1 " "side foot2" "side foot " "down down ";
    grid-template-columns: 150px 1fr;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .top {
    margin: 20px
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width: 850px;
  }

  .menu {
    height: 1500px
  }
  .car img {
    margin: 0;
    margin-right: px
  }
  .root {
    width: 850px;
  }
  .car p {
    margin: 0;
    margin-right: px
  }
  .car {
    margin: 10px
  }
  .car {
    border-bottom: solid 1px;
    margin-right: px
  }
  .top {
    margin: 10px;
    margin-right: 0px;
    border-bottom: solid 1px;
  }
  .tenki {
    margin: 20px;
    border-bottom: solid 1px;
    padding: px;
    width: 800px
  }
  .train img {
    margin: 0;
    margin-top: px;
    margin-bottom: px;
  }
  .rosen {
    width: 850px
  }
  .train {
    margin-right: 100px;
    border-bottom: solid 1px
  }
  .train p {
    margin: 0;
  }

  .p h6 {
    font-size: 15px
  }
  .top h5 {
    text-align: left;
    margin-left: 180px
  }
  .train p {
    font-size:
  }
  h1 {
    text-align: center
  }
  .top {
    text-align: center
  }
  .top p {
    display: inline-block;
    text-align: left
  }
  .side {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 150px;
    margin: auto
  }
   .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 15px;
    width: 180px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 10px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
  .kannrenn{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;}
  .kannrenn p{margin-left: 15px;
              margin-right: 15px}
  .root{width: 800px}
     #page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 120px;
    padding: 30px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
  .box1 {
  position: fixed;
  top: 0;
  z-index: 9999;
}
}

/*ipadpro1024終わり*/

/*1025始まり*/

@media (min-width:1025px) {
  .demo1 {
    background: url(../image/e.bottom/concept.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo1:hover {
    background: url(../image/e.bottom/concept.on.png)no-repeat
  }
  .demo1:hover img {
    opacity: 0.5;
  }
  .demo2 {
    background: url(../image/e.bottom/room.off.png) no-repeat;
    padding: 40px 40px
  }
  .demo2:hover {
    background: url(../image/e.bottom/room.on.png)no-repeat
  }
  .demo2:hover img {
    opacity: 0.5;
  }
  .demo3 {
    background: url(../image/e.bottom/fun.off.png) no-repeat;
    padding: 50px 40px
  }
  .demo3:hover {
    background: url(../image/e.bottom/fun.png)no-repeat
  }
  .demo3:hover img {
    opacity: 0.5;
  }
  .demo4 {
    background: url(../image/e.bottom/pc_nav_05_off.png) no-repeat;
    padding: 50px 40px
  }
  .demo4:hover {
    background: url(../image/e.bottom/pc_nav_05_on.png) no-repeat}

  .demo4:hover img {
    opacity: 0.5;
  }
  .demo5 {
    background: url(../image/e.bottom/access.off.png) no-repeat;
    padding: 31px 40px
  }
  .demo5:hover {
    background: url(../image/e.bottom/access.on.png)no-repeat
  }
  .demo5:hover img {
    opacity: 0.5;
  }
  .demo6 {
    background: url(../image/e.bottom/pc_nav_08_off.png) no-repeat;
    padding: 40px 40px
  }
  .demo6:hover {
    background: url(../image/e.bottom/pc_nav_08_on.png)no-repeat
  }
  .demo6:hover img {
    opacity: 0.5;
  }
  .yoyaku{
    background: url(../image/e.bottom/yoyaku_boton_off.png) no-repeat;
    padding: 40px 120px;
  }
  .yoyaku:hover {
    background: url(../image/e.bottom/yoyaku_boton_on.png)no-repeat
  }
  .yoyaku:hover img {
    opacity: 0.5;
  }
  .yoyaku1{margin:0 auto;
         margin-left: 0px;
         }
  .yoyaku1{margin-top: 40px}
  .logo {
    width: 150px;
  }
  .menu {
    width: 150px;
    height:
  }
  .setumei1 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    word-wrap: break-word;
    text-align: justify
  }
  .setumei2 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    word-wrap: break-word;
    text-align: justify
  }
  .setumei3 {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    word-wrap: break-word;
    text-align: justify
  }

  .gaiyou {
    text-align: justify;
    padding: 20px
  }
/*古い規格のグリッド*/
  body{display: grid;
  -ms-grid-columns:150px 1fr}
  .box1{-ms-grid-column:1;
       -ms-grid-row:1;
       -ms-grid-row:7}
  .top{-ms-grid-column:2;
      -ms-grid-row:1}
  .google{-ms-grid-column:2;
         -ms-grid-row:2}
  .tenki{-ms-grid-column:2;
         -ms-grid-row:3}
  .tizu{-ms-grid-column:2;
  -ms-grid-row:4}
  .car{-ms-grid-column:2;
     -ms-grid-row:5}
  .train{-ms-grid-column:2;
  -ms-grid-row:6}
  .tel{-ms-grid-column:2;
  -ms-grid-row:7}
  .small{-ms-grid-column:1;
   -ms-grid-column-span:2;
  -ms-grid-row:8}
/*グリッド*/
  body {
    display: grid;
    grid-template-areas:
      "side head "
      "side main1 "
      "side main   "
      "side main4 "
      "side foot1 "
      "side foot2"
      "side foot "
      "down down ";
    grid-template-columns: 150px 1fr;
    grid-template-rows:
  }
  .box1 {
    grid-area: side
  }
  .top {
    grid-area: head
  }
  .google {
    grid-area: main1;
  }
  .tenki {
    grid-area: main;
  }
  .tizu {
    grid-area: main4;
  }
  .car {
    grid-area: foot1;
  }
  .train {
    grid-area: foot2
  }
  .tel {
    grid-area: foot;
  }
  .top {
    margin: 20px
  }
  .site {
    display:
  }
  .small {
    grid-area: down;
  }
  .tel img {
    width:
  }
  .menu {
    height: 1500px
  }
  .car img {
    margin: 0
  }
  .car p {
    margin: 0;
  }
  .car {
    margin: 40px
  }
  .car {
    border-bottom: solid 1px
  }
  .top {
    margin: 40px;
    border-bottom: solid 1px;
  }
  .tenki {
    margin: 40px;
    border-bottom: solid 1px;
    padding: 10px
  }
  .train img {
    margin: 0;
    margin-top: 20px;
    margin-bottom: 10px;
  }
  .train {
    margin: 40px;
    border-bottom: solid 1px
  }
  .train p {
    margin: 0;
  }
  .rosen{width:950px}
  .p h6 {
    font-size: 15px
  }
  .top h5 {
    text-align: left;
    margin-left: 180px
  }
  .train p {
    font-size:
  }
  h1 {
    text-align: center
  }
  .top {
    text-align: center
  }
  .top p {
    display: inline-block;
    text-align: left
  }
  .side {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 150px;
    margin: auto
  }
   .btn a{background-color: #009cd3;
    color:#ffffff;
    font-size: 20px;
    width: 200px;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #009cd3;
    margin-left:auto;
  margin-right:auto;
     margin-top: 30px
  }
  .btn a:hover{background-color: #ffffff;
    color: #009cd3;
    cursor:pointer;}
  a:hover{text-decoration: none}
  .kannrenn{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;}
  .kannrenn p{margin-left: 20px;
              margin-right: 20px}
  .root{width: 900px}
   #page-top {
    position: fixed;
    bottom: 20px;
    right: 50px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
  .box1 {
  position: fixed;
  top: 0;
  z-index: 9999;
}
}

/*1025終わり*/