@charset "UTF-8";
/* CSS Document */
.pcOnly {  }
.spOnly { display:none; }
img { width: auto; max-width: 100%; height: auto;}
.comingSoon { cursor: default;}
.content { width:100%; max-width:1000px; box-sizing:border-box; padding:0 20px; margin:0 auto; }
#main .content { margin:0 auto 60px auto; }
.moreBtn { display:block; width:100%; max-width:320px; margin:0 auto; }

#guideBox,
#access,
#plan { padding:20px 20px 80px 20px; background:url(../img/common/line_common_01.png) bottom center / calc(100% - 20px) auto no-repeat;  }

.flexBox { display: flex; flex-wrap: wrap; justify-content: space-between;}
.flexBox > * { flex-grow:0; flex-shrink: 1; }

/* HEADER */
#header { padding:10px 0; }
#header .content { display:flex; justify-content:space-between; align-items:center; }
#header h1 { flex-grow:0; flex-shrink:1; flex-basis:334px; }
#header .btnBox { fkex-grow:0; flex-shrink:1; flex-basis:550px}
#header .btnBox > ul { display:flex; flex-wrap:no-wrap; justify-content:space-between; margin:0 0 10px 0; }
#header .btnBox > ul li { flex-grow:0; flex-shrink:1; flex-basis:136px;}
#header .btnBox > ul li:nth-of-type(3) { flex-basis:248px; }
#header .btnBox > ul li:nth-of-type(4) { display:none; }
#header .btnBox > ul li a { display:block; }
#header .btnBox > ul li a:hover ,
#header .btnBox > ul li a.active{ opacity:0.7; }
#header .btnBox > ul li a.comingSoon{ opacity:0.3; }


#gNavi { background:url(../img/outline/bg_outline_01.jpg) center top / cover no-repeat; border-bottom:#fff solid 1px; }
#topNavi  { background:url(../img/outline/bg_outline_01.jpg) center top / cover no-repeat; border-bottom:#fff solid 1px; margin:0 auto; max-width:1920px;}
#gNavi ul,
#topNavi ul{ display:flex; flex-wrap:no-wrap; justify-content:center; width:100%; max-width:1400px; box-sizing:border-box; padding:20px; margin:0 auto; }
#gNavi ul li,
#topNavi ul li  { display:block; flex-grow:0; flex-shrink:1; flex-basis:calc( (100% - 40px) / 5); }
#gNavi ul li a,
#topNavi ul li a { display:block; padding:0.5em 0.25em; font-size:16px; color:#fff; text-decoration:none; line-height:1; text-align:center; box-sizing:border-box; border-left:#fff solid 1px; border-right:#fff solid 1px; font-weight:bold; }
#gNavi ul li a:hover,
#topNavi ul li a:hover { color:#fcc800; text-decoration:none; opacity:1 }
#gNavi ul li a.comingSoon,
#gNavi ul li a.comingSoon:hover,
#topNavi ul li a.comingSoon,
#topNavi ul li a.comingSoon:hover { color:#000; text-decoration:none; opacity:0.3 }
#gNavi .spMenuBtn { display:none;  }
#page_top #gNavi ul li:nth-of-type(1) a{ color:#fcc800; text-decoration:none; opacity:1}
#page_access #gNavi ul li:nth-of-type(2) a { color:#fcc800; text-decoration:none; opacity:1 }
#page_plan #gNavi ul li:nth-of-type(3) a { color:#fcc800; text-decoration:none; opacity:1 }
#page_structure #gNavi ul li:nth-of-type(5) a { color:#fcc800; text-decoration:none; opacity:1; }
#page_outline #gNavi li:nth-of-type(7) a { color:#fcc800; text-decoration:none; opacity:1; }
#page_facility #gNavi li:nth-of-type(6) a { color:#fcc800; text-decoration:none; opacity:1; }
/* CONTENT */



/* PAGE TOP */
#pageTop { position:fixed; right:20px; bottom:20px; width:149px; height:27px; z-index:10; }
#pageTop a { position:relative; z-index:2; }

/* FOOTER  */
#footerBnr {  display:flex; justify-content:space-between; margin:0 auto 40px auto; }
#footerBnr a { display:block; flex-grow:0; flex-shrink:1; flex-basis:460px; text-align:center; box-sizing:border-box; padding:1em 0; font-size:24px; text-decoration:none; color:#fff; }
#footerBnr a:nth-of-type(1) { background:#ff9900;  }
#footerBnr a:nth-of-type(2) { background:#29abe2; }
#footerBnr a:nth-of-type(1):hover,
#footerBnr a:nth-of-type(2):hover { background:#ccc; color:#fff; text-decoration:none; }

/* #footerBnr a:nth-of-type(2)::before { content:'coming soon'; position:absolute; width:100%; z-index:2; bottom:calc(50% - 0.6em); line-height:1.2; left:0; text-align:center; color:#fff; font-size:14px; } */
#footer { background:#fff; border-top:#ccc solid 2px; }
#footer > .content { display:flex; justify-content:flex-start; flex-wrap:no-wrap; padding:20px }
#footer > .content .logoBox { flex-grow:0; flex-shrink:1; flex-basis:320px; margin:0 40px 0 0;  }
#footer > .content .telBox { flex-grow:0; flex-shrink:1; flex-basis:306px; }
#footer #copyRight { background:#000; color:#fff; text-align:center; line-height:1; padding:5px 0 90px 0; font-size:12px; }

#footerSpBnr { display:none; background:#00b7ee; position:fixed; bottom:0; left:0; width:100%; margin:0; padding:0; z-index:99999999; }
#footerSpBnr ul { width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; }
#footerSpBnr ul li { margin:0; }
#footerSpBnr ul li:nth-of-type(1)  { flex-grow:0; flex-shrink:1; flex-basis:40%; }
#footerSpBnr ul li:nth-of-type(2)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(3)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(4)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li a,
#footerSpBnr ul li a:hover { display:block;  text-align:center; line-height:1; }
#footerSpBnr ul li a img { width:100%; height:auto; }

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

}

@media screen and (max-width:768px) {
/* HEADER */
#header > .content {  flex-wrap:no-wrap; justify-content:space-between; padding:0 10px; }
#header h1 { flex-grow:1; flex-shrink:1; flex-basis:160px; margin:0 10px 10px 0; }
#header .btnBox { flex-grow:1; flex-shrink:1; flex-basis:340px; }
#header .btnBox > ul li { flex-grow:1; flex-shrink:1; flex-basis:43%; }
#header .btnBox > ul li:nth-of-type(3) { display:none ;}
#header .btnBox > ul li:nth-of-type(4) { display:block; flex-basis:14%; position:relative; background:url(../img/common/bg_header_01.jpg) center center / 100% 100% no-repeat;}
#header .btnBox > ul li  a img { display:block; width:100%;}
#header .btnBox > ul li:nth-of-type(4) a { display:block; width:100%; top:calc(50% - 0.75em); position:absolute; left:0; text-align:center; font-size:5vw; color:#fff; line-height:1.5em; text-decoration:none;}
#gNavi { display:none; }
#gNavi.active { display:block; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(255,255,255,0.9); z-index:99999999; }
#gNavi ul { display:block; text-align:center; padding:20px; box-sizing:border-box; }
#gNavi ul li { display:block; text-align:center; font-size:3vw; }
#gNavi ul li:not(:last-of-type) { border-bottom:#666 solid 1px; border-right:none; }
#gNavi ul li a { font-size:5vw; line-height:1; padding:1em 0; font-weight:bold; color:#000; }
#gNavi .spMenuBtn { display:block; width:calc(100% - 40px); margin:0 auto; background:#000; color:#fff; font-size:5vw; line-height:1; padding:0.25em 0; text-decoration:none; text-align:center; }

/* FOOTER */
#footer { padding-bottom:20%; }
#footer > .content { -webkit-flex-wrap:wrap; -webkit-justify-content:center; flex-wrap:wrap; justify-content:center; }
#footer > .content .logoBox { margin:0 0 20px 0; }
#footer > .content .telBox { flex:0 1 100%; } 
#footer #copyRight  { padding:5px 0; }

#pageTop { bottom:25vw; }

.pcOnly { display:none;  }
.spOnly { display:block; }

#footerSpBnr { display:block; }
}