@charset "utf-8";



/* ============================================================================================

	base style

============================================================================================ */
html{
height:100%;
width:100%;
font-size:14px;
margin:0;
padding:0;
}

body{
margin:0;
padding:0;
line-height:140%;
}


/*---------------ハンバーガー----------*/

.sp {
width:100%;
  padding: 16px;
  background: #003399;
  position:fixed;
  z-index:900;
}


.h-menu{
position: relative;
}

/*inputのcheckboxは非表示に*/
.h-menuCheckbox {
  display:none;
}

/*ハンバーガーメニュー*/
.h-menu_icon {
    display: inline-block;
    width: 28px;
    height: 20px;
    vertical-align: middle;
}

/*3本線*/
.hamburger-icon, .hamburger-icon::before, .hamburger-icon::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 100;
    top:0;
    bottom:0;
	right:0;
    width: 28px;
    height: 3px;
    background: white;
    cursor: pointer;
}
.hamburger-icon:before {
    top: 10px;
}
.hamburger-icon:after {
    top: 20px;
}

/*メニュー以外を暗くする*/
#h-menu_black {
    display: none;
    position: fixed;
    z-index: 98;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
    transition: .7s ease-in-out;
}

/*中身*/
#h-menu_content {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    width: 100%;
    max-width: 320px;
    height: 100vh;
    padding: 16px 10px 10px;
    background: #F9F9F9;
    overflow: auto;
    transition: .3s ease-in-out;
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);
}

/*チェックボックスにチェックが入ったら表示*/
input:checked ~ .h-menu_icon .hamburger-icon{
    background: transparent;
}
input:checked ~ .h-menu_icon .hamburger-icon::before{
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top:10px;
    z-index:999;
}
input:checked ~ .h-menu_icon .hamburger-icon::after{
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top:10px;
    z-index:999;
}
input:checked ~ #h-menu_black {
    display: block;
    opacity: .8;
}
#h-menu_checkbox:checked ~ #h-menu_content {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
.h-menu_icon .hamburger-icon,
.h-menu_icon .hamburger-icon::before,
.h-menu_icon .hamburger-icon::after,
#h-menu_black,
#h-menu_content{
    -webkit-transition: all .3s;
    transition: all .3s;
}

#h-menu_content ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
#h-menu_content ul li{
    border-bottom: solid 1px #CCC;
}
#h-menu_content ul li ul{
	padding:0 0 0 20px;}
	
	
#h-menu_content ul li ul li:last-child{
    border-bottom: none;}
	
#h-menu_content li a {
    display: block;
    color: #333;
    font-size: 12px;
    padding: 10px;
    text-decoration: none;
    transition-duration: 0.2s;
}
#h-menu_content li a:hover {
    background: #3366EE;
    color: #FFF;
}


/*-------------------------------------*/
.mainSlideArea{
z-index:5;
}
.smenu{
margin:0;
padding:0;
background-color:#444;
}
.smenu ul{
color:#FFFFFF;
padding:0px 0px;
font-size:12px;
display:block;
}
.smenu li{
float:right;
padding:5px 15px 5px 15px;}

.smenu a{
text-decoration:none;
color:#FFFFFF;
}

.gnavi{
background:#003399;
opacity: 0.8;
height:40px;
width:100%;
margin:0;
padding:0;
z-index:999;
}

.nav{
	width:100%;
  margin: 0 auto;
  padding: 0;
  height: 40px;  display: flex;

}

.nav li{
  position: relative;
  list-style: none;
  width:20%;
z-index:999;} 

.nav li a{
  display: block;
  height: 40px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  line-height: 2.8;
  text-decoration: none;
  border-right: 1px solid #eee;
  box-sizing: border-box;}


.nav li ul {
  top: 40px;
  position: absolute;
  width:100%;
}
.nav li ul li {
  overflow: hidden;
  height: 0;
  width:100%;
}
.nav li ul li a {
  border-top: 1px solid #eee;
  width:100%;
background:#3399EE;
color:#FFFFFF;
text-align:center;
}
.nav li:hover > ul > li {
  overflow: visible;
  height: 40px;
}


.mainSlideArea img{
width:100%;}

.mainbox{
margin:20px auto 20px auto;
max-width:1024px;
}

h2{
border-bottom:1px dotted #aaa;
font-size:16px;
font-weight:bold;
padding:20px 0 10px 0;
margin:40px 0 40px 0;
}
h2 span{
background-color:#FFFFFF;
padding:0 20px 0 0;
}

.newscont{
margin:30px 0 30px 0px}


.newsin{
margin:30px 40px 0 0;
border-left:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
}
.newsin img{
width:100%;
}
.logo img{
position:absolute;
z-index:5;}


.newtxt{
padding:20px;}

.newday{
background-color:#1861AE;
padding:3px 20px 2px 10px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
color:#FFFFFF;
font-size:10px;
float:left;
}

.newicon{
color:#FF0000;
font-size:12px;
float:right;
}

.newtxt h3{
margin:20px 0 10px 0;
}

.newtxt p{
color:#666666;
font-size:12px;
margin:20px 0 0 0;
}

.newsbox h3 .newsbox p{
width:100%;}

.newsbt{
padding:15px 30px 15px 30px;
font-size:16px;
border:1px solid #CCCCCC;
font-weight:bold;
display:inline;
margin:40px 0 40px 0;
float:right;
}
.newsbt a{
text-decoration:none;
color:#000000;
display:block;
}
.newsbt a hover{
display:block;
background-color:#66AAFF;
}


.mein2{
background-color:#F2F3F9;
}
.contbox{
margin:60px auto 0px auto;
padding:40px 0 80px 0;
max-width:1024px;
}

.contbox h2{
border-bottom:1px solid #CCCCCC;
font-weight:bold;
margin:40px 0 40px 0;
}
.contbox h2 span{
background-color:#F2F3F9;
padding:0 20px 0 0;
}
.bt_box{
margin:40px 0 0 0;
float:left;
}



a:hover .btcont {
background-color:#99CCFF;
transition: background 2s;

}

.btcont{
position: relative;
background-color:#FFFFFF;
font-size:12px;
border-radius: 50%;
color:#666666;
text-align:center;
}
.btcont img{
    text-align: center;
    margin: -40px 0 0 0;
width:90%;
}
.btcont p{
	position: absolute;
    left: 0;
    top: 60%;
    margin: -.5em 0 0;
    width: 100%;
    text-align: center;
    color:#006699;
	font-size:16px;

}
#footer{
background-color:#666666;
color:#FFFFFF;
}
.futlogo{
margin:0 0 10px 0;
}
.futlogo img{
width:100%;
}

.fcont{
max-width:1024px;
margin:0 auto 0 auto;
}
.fnavi{

}
.fnavi a{
text-decoration:none;
color:#FFFFFF;

}
.fbt{
color:#FFFFFF;
font-size:14px;
text-align:center;
background-color:#323332;
padding:5px 20px 5px 20px;
border-radius: 10px;
}
.fbt a{
color:#FFFFFF;
font-size:14px;
text-decoration:none;
}

.copy{
background-color:#333333;
text-align:center;
color:#FFFFFF;
margin:10px auto 0px auto;
padding:3px;
font-size:10px;
display:block;
}

.clear{
 clear:both;
}


.floating {
  position: fixed;
  display: none;
  top:0;
  width:100%;
}
.floating a {
  display: block;
  text-decoration: none;
}
.floating a:hover {
  opacity: 1;
}

.floating2 {
  position: fixed;
  display: block;
  top:0;
  width:100%;
  z-index:999;
}
.floating2 a {
  display: block;
  text-decoration: none;
}
.floating2 a:hover {
  opacity: 1;
}


.smenu2{
margin:0;
padding:0;
background-color:#444;
z-index:999;
}
.float_logo img{
width:25%;
max-width:300px;
float:left;
padding:5px 0 0 15px;
}

.smenu2 ul{
color:#FFFFFF;
padding:0px 0px;
font-size:12px;
display:block;
}
.smenu2 li{
float:right;
padding:5px 15px 5px 15px;}

.smenu2 a{
text-decoration:none;
color:#FFFFFF;
}

.gnavi2{
background:#003399;
opacity: 1;
height:30px;
width:100%;
margin:0;
padding:0;
z-index:999;
}

.gnavi2 .nav{
	width:100%;
  margin: 0 auto;
  padding: 0;
  height: 30px;  display: flex;
z-index:999;

}

.gnavi2 .nav li{
  position: relative;
  list-style: none;
  width:20%;} 

.gnavi2 .nav li a{
  display: block;
  height: 30px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  line-height: 2.4;
  text-decoration: none;
  border-right: 1px solid #eee;
  box-sizing: border-box;}


.gnavi2 .nav li ul {
  top: 30px;
  position: absolute;
  width:100%;
}
.gnavi2 .nav li ul li {
  overflow: hidden;
  height: 0;
  width:100%;
}
.gnavi2 .nav li ul li a {
  border-top: 1px solid #eee;
  width:100%;
background:#3399EE;
color:#FFFFFF;
text-align:center;
}
.gnavi2 .nav li:hover > ul > li {
  overflow: visible;
  height: 30px;
}

/* 2nd page  */

.sbhed{
background-image:url(../img/2ndbg.png);
height:200px;
width:100%;
margin:60px auto 0 auto;
position:relative;
text-align:center;
background-position: 50% 50%; /* 画像中央を起点に表示 */
background-size: cover; /* 縦横比を維持しながら全体を覆うように表示 */
z-index:2;

}

.sbtitle{
color:#333333;
font-weight:bold;
font-size:26px;
letter-spacing:0.5rem;
margin:0px auto 0 auto;
padding:100px 0 0 20px;
max-width:1024px;
text-align:left;
}

.container{
margin:60px auto 0px auto;
padding:0px 0 80px 0;
max-width:1024px;
}

.inner{
padding:0px 0 10px 0px;
margin: 0 0 20px 0;
border-bottom:1px solid #CCCCCC;
}
.container h1{
border-left:5px solid #006699;
padding:5px 0 5px 20px;
font-size:20px;
font-weight:bold;
}

.news_date{
text-align:right;
font-size:12px;
color:#666666;
margin:0px 0 40px 0;
}


.inner:not(:first-child){
margin: 60px 0 60px 0;
}

.container li{
margin:0 0 15px 20px;
line-height:2.1;
list-style:circle outside;
}

.container  h3{
font-size:16px;
font-weight:bold;
color:#0066CC;
margin:0 0 30px 0;
}
.container  h3:not(:first-child){
margin:60px 0 30px 0;
}

.container  p{
font-size:14px;
line-height:2.1;
margin:0 0 30px 0;
}
/*  */
.tabmenu{
max-width:1024px;
margin:30px auto 30px auto;
padding:0 0 30px 0;
text-align:center;}

.tab1{
width:50%;
float:left;}

.tab2{
width:50%;
float:left;}

.tab1 a ,.tab2 a{
width:70%;
text-align:center;
margin:0 auto 0 auto;
background-color:#0066CC;
padding:10px 0 10px 0;
color:#FFFFFF;
font-size:14px;
border-radius: 20px;
text-decoration:none;
display:block;
}

.tab1 a:hover ,.tab2 a:hover{
background-color:#0099CC;
}

.facilitybox{
margin:60px 0 30px 0;
padding-bottom:0px;
}
.facilityimg{

margin:0 auto 0 auto;
padding:0 0 0px 0;
float:left;
text-align:center;
width:40%;
}
.facilityimg img{
max-width:90%;
max-height:300px;
object-fit:cover;
margin:0 auto 0 auto;
}
.facilit_r{
width:60%;
float:left;
}

.facilithead{
margin:0;
padding:5px 0 10px 0;
font-size:16px;
font-weight:bold;
border-bottom:1px solid #000000;
}
.facilittxt{
padding:10px;
}
.facilittxt li{
font-size:12px;
line-height:1.8;
padding:5px 0 5px 0;
list-style:none;
margin:0;
border-bottom:1px dotted #666666;
}
.facilittxt dl{
border-bottom:1px dotted #666666;
}
.facilittxt dt:first-child{
font-size:12px;
line-height:1.8;
font-weight:bold;
clear:both;
float:left;
width:30%;
padding:5px 0 5px 0;
border:none;
}
.facilittxt dd:first-of-type{
font-size:12px;
line-height:1.8;
font-weight:nomal;
float:left;
width:70%;
padding:5px 0 5px 0;
border:none;
}

.facilittxt dt{
font-size:12px;
line-height:1.8;
font-weight:bold;
clear:both;
float:left;
width:30%;
padding:5px 0 5px 0;
border-top:1px dotted #666666;
}
.facilittxt dd{
font-size:12px;
line-height:1.8;
font-weight:nomal;
float:left;
width:70%;
padding:5px 0 5px 0;
border-top:1px dotted #666666;
}




.newslist{
  padding: 20px 0 0px 0;
  border-bottom: 1px solid #DDD;
}
  .newslist li{
  border-bottom: 1px solid #DDD;
  list-style:none;
  }
  .newslist li.normal{
  font-size: 14px;
  line-height: 180%;
  padding: 30px;
  }
  .newslist li:last-child{
  border-bottom: none;
  }
  .newslist li a{
  display: table;
  width: 100%;
  padding: 20px 0px;
  /*font-size: 14px;*/
  font-size: 14px;
  text-decoration: none;
  }
  .newslist li a *{
  line-height: 180%;
  display: table-cell;
  vertical-align: middle;
  }
  .newslist li .date{
  padding-right: 15px;
  width: 140px;
  font-weight:bold;
  color:#0066FF;
  }
  .newslist li .attribute{
  padding-right: 0px;
  border:1px solid #666;
  color:#666;
  text-align:center;
  width: 160px;
  }
  .newslist li p{
  padding-left: 30px;
  width:auto;
  }
.pc { display: block !important; }
.sp_img { display: none !important; }


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

.pc { display: block !important; }
.sp_img { display: none !important; }

.newslist{
	width:100%;
}
  .newslist li{
  list-style:none;
  padding:0;
  margin:0;
  }
  .newslist li.normal{
  font-size: 12px;
  line-height: 0%;
  padding: 30px;
  }
  .newslist li a{
  display:block;
  width: 100%;
  padding: 20px 0px;
  /*font-size: 14px;*/
  font-size: 12px;
  text-decoration: none;
  }
.newslist li a *{
  line-height: 180%;
	width:100%;
  display:inline-table;
  vertical-align: middle;
  }
  .newslist li .date{
  padding-right: 15px;
	width:30%;
  font-weight:bold;
  color:#0066FF;
  }
  .newslist li .attribute{
	width:70%;
  padding: 5px 10px 5px 10px;
  margin:0;
  border:1px solid #666;
  color:#666;
  text-align:center;
  width: auto;
  }
.newslist li p{
  padding: 0px 0 0 0!important;
  margin:10px 0 0 0;
  text-align:left;
  text-indent:0;
  }
  .news_sp{
  display:none;
  }

.mainSlideArea{
padding-top:50px;
}
.floating{
display:none!important;}


.floating2{
display:none!important;}

.facilityimg{
margin:0; padding:0;
float:none;
width:100%;
text-align:center;
}
.facilityimg img{
max-width:80%;
max-height:300px;
object-fit:cover;
margin:0 auto 0 auto;
}
.facilit_r{
width:100%;
float:none;
margin:10px 0 0 0;
}

.logo{
display:none;}

.sp_logo img{
width:70%;
top:20px;
    position: absolute;
}
.sp{
display:block;
}

.h-menu{
display:block;
}
.gnavi{
display:none;
}

.smenu{
display:none;
}
.mainbox{
width:90%;
}


.mein2{
display:none;}

.contbox{
display:none;}

.btcont{
width:50%;
}

.newsbox{
width:100%;
margin:0 auto 0 auto;
float:none;}

.newsin{
width:100%;
margin:0 auto 30px auto;
}

.newsin img{
}

.contbox h2{
width:90%;
margin:40px auto 40px auto;
}

.contbox p{
width:90%;
margin: 0 auto 0 auto;
}

.futbox1{
width:80%;
margin:0px auto 0px auto;
float:none;
padding:20px;
font-size:12px;}

.futbox2{
/*width:80%;
margin:0px auto 20px auto;
float:none;
padding:20px;*/

display:none;}

.fnavi{
display:none;
}
.container{
margin:80px auto 0px auto;
padding:0px 0 0 0; 
width:90%;
}

.sbhed{
background-image:url(../img/2ndbg.png);
height:50px;
width:100%;
top:50px;
margin:0px auto 0 auto;
padding:0px 0 0 0;
position:relative;
text-align:center;
background-position: 50% 50%; /* 画像中央を起点に表示 */
background-size: cover; /* 縦横比を維持しながら全体を覆うように表示 */

}

.sbtitle{
color:#333333;
font-weight:bold;
font-size:20px;
letter-spacing:0.5rem;
margin:0px auto 0 auto;
padding:15px 0 0 20px;
max-width:1024px;
text-align:left;
}

.container{
margin:80px auto 0px auto;
padding:0px 0 80px 0;
max-width:1024px;
font-size:12px;
}

.container  h3{
font-size:14px;
}
  .newslist li p{
  padding-left: 30px;
  clear:both;
  width:100%;
  }

}

@media only screen and (min-width:769px) and (max-width:1024px) {
.gnavi{
margin:-46px 0 0 0;
}
.sp{
display:none;
}

.h-menu{
display:none;
}

.gnavi li a{
font-size:14px;
color:#FFFFFF;
text-decoration:none;}

.mainbox{
width:90%;
}
.contbox h2{
width:90%;
margin:40px auto 40px auto;
}

.newsbox{
width:50%;
float:left;}

.contbox p{
width:90%;
margin: 0 auto 0 auto;
}

.newscont{}

.newsbox{
width:33.3%;
float:left;}

.bt_box{
width:33.3%;
}

.btcont{
width:70%;
height: 100%;
padding: 22% 25% 35% 25%;

margin:0 auto 0 auto;
}

.btcont p{
	position: absolute;
    left: 0;
    top: 60%;
    margin: -.5em 0 0;
    width: 100%;
    text-align: center;
    color:#0066CC;
	font-size:14px;
}

.contbox h2 .contbox p{
width:90%;
}

.futbox1{
width:40%;
float:left;
padding:20px;
font-size:12px;}

.futbox2{
width:60%;
float:left;
padding:20px;
font-size:12px;}

.fbt{
margin:20px 0 0 0;
width:60%;
}

/* 2nd page  */
.container{
margin:60px auto 0px auto;
width:90%;
}

}

@media only screen and (min-width:1023px){
.gnavi{
margin:-46px 0 0 0;
}
.sp{
display:none;
}

.h-menu{
display:none;
}

.newscont{}
.newsbox{
width:33.3%;
float:left;}

.bt_box{
width:33.3%;
}

.btcont{
width:70%;
height: 100%;
padding: 22% 25% 35% 25%;

margin:0 auto 0 auto;
}

.futbox1{
width:33%;
float:left;
padding:20px;
font-size:12px;}

.futbox2{
width:67%;
float:left;
padding:20px;
font-size:12px;}

.fbt{
margin:20px 0 0 0;
width:50%;
}

}