@charset "utf-8";

/* 共通部分
------------------------------- */
html {
    font-size: 100%;
}

body{
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "BIZ UDPGothic", sans-serif;
    line-height: 1.7;
}
a {
    text-decoration: none;
}
img {
    max-width: 100%;
}

.link{
	color:#115C91;
	}

.link:hover{
  color:#1D96AE;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-style: normal;
}


/*************
/* ヘッダー
*************/

.page-header {
    display:flex;
    justify-content: center;
}



/* ヘッダーナビゲーション
------------------------------- */
.pc-nav{
text-align: center;
background-color:#1D96AE;
font-family: "Zen Kaku Gothic New", sans-serif;
font-weight: 700;
font-style: normal;
}
.pc-nav ul{
margin: 0 ;
padding: 0 ;
}
.pc-nav li{
list-style: none;
display: inline-block;
width: 15%;
min-width: 10vw;
padding-top:0.8vw;
padding-bottom:0.8vw;
font-size:2vw;
}
.pc-nav li:not(:last-child){
border-right:2px solid #ddd;
}
.pc-nav a{
text-decoration: none;
color: #ffffff;
}
.pc-nav a.current{
color: #00B0F0;
border-bottom:2px solid #00B0F0;
}
.pc-nav a:hover{
color:#F7CB4D;
border-bottom:2px solid #F7CB4D;
}

.sp-nav {display: none;
   }



/* ヘッダーカバー画像
------------------------------- */
.cover {
    background-size: cover;
    background-position: center bottom;
}

.cover-home {
    background-image:url(images/cover-p.png);
    background-repeat;no-repeat;
    width: 100vw;
    height: 60vw;
    }

/*************
/* 本文
*************/

main{
	margin:auto;
	}

h1{
	text-align: center;
	font-size:3rem;
}

h2 {
  position: relative;
  padding:0 1rem 1rem 1rem;
  background: #FFDD1A;
  margin:5rem 5rem 1rem 5rem;
  color:#000;
  font-size:1.2rem;
}

h2:before {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 100%;
  height: 100%;
  content: '';
  border: 3px solid #000;
}

h4{
	margin:0 10vw;
	font-size:1.5rem;
	}

h5{
	margin:0 10vw;
	font-size:1rem;
}

.time{
	margin:0 10vw;
	font-size:1.2rem;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	font-style: normal;
	}

.nav-page{
	margin:0 5vw;
	column-count: 4;
}

.nav-page li{
	list-style-type:none;
	font-size:1.5rem;
}

.nav-page li a{
	grid-template-columns: repeat(2, auto);
	color:#115C91;
	text-decoration: underline;
	}
	
.nav-page li a:hover {
  color: #999999;
}

p{
	margin:0 10vw;
	font-family: "Zen Kaku Gothic New", system-ui;
	font-weight: 400;
	font-style: normal;
	font-size:1rem;
	}

.attention{
	color:red;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;

}

.container {
  display: flex;
  gap: 0 43px;
  width: 100%;
  margin: 0 auto;
}

.item {
  width: 80%;
  margin:0 auto;
}

.item > img {
  width: 100%;
  height: 40vh;
  object-fit: cover;
}

.title{
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	
	}
.name{
	font-size:0.8rem;
}

iframe{
	width:80%
}

.iframe-goole{
	text-align: center;
}

.map{
	text-align: center;
}

/*************
/* フッター
*************/

.page-footer {
    background-image: url(images/footer.png);
    background-size: cover;
    background-position:auto;
    padding-top:6rem;
}

.footer-head{
text-align;center;
font-family: "Zen Kaku Gothic New", sans-serif;
font-weight: 700;
font-style: normal;
text-align: center;
font-size:1rem;
}

.info {
    width: 100%;
    max-width: 80vw;
    margin: auto;
    padding: 0 1.5rem;
    border-spacing: 0;
    vertical-align: bottom;
}
.info th,
.info td {
    border-bottom: 1px solid #000;
}
.info th {
    text-align: left;
    font-weight: normal;
    padding: 0.5vh;
    font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 1rem;
}
.info td {
    padding: 0.5vh 0;
    font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1rem;
}
.copyright {
    background-color:#555555;
    text-align: center;
    padding: 1vw 0;
    margin-top: 2.5vw;
    color: #fff;
}

/*****************************************************************
/* スマホ対応
******************************************************************/

@media screen and (max-width: 640px) {
   .pc-nav {
      display: none;
   }
   .sp-nav {
      z-index: 1;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      display: block;
      width: 100%;
      font-family: "Zen Kaku Gothic New", sans-serif;
      font-weight: 700;
      font-style: normal;
      background: rgba(0, 0, 0, .8);
      opacity: 0;
      transform: translateY(-100%);
      transition: all .2s ease-in-out;
   }
   .sp-nav li{
      color:white;
      list-style: none;
      }
      
    .sp-nav a{
    text-decoration: none;
    color: #ffffff;
    }
    
    .sp-nav a:hover{
    color:#F7CB4D;
    }
    
   #hamburger {
      position: relative;
      display: block;
      width: 30px;
      height: 25px;
      margin: 10px 10px 0 auto;
   }
   #hamburger span {
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 100%;
      height: 2px;
      background-color: #fff;
      transform: translateY(-50%);
   }
   #hamburger::before {
      content: '';
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: #fff;
   }
   #hamburger::after {
      content: '';
      display: block;
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 2px;
      background-color: #fff;
   }
   /*スマホメニュー*/
   .sp-nav ul {
      padding: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      height: 100%;
   }
   .sp-nav li {
      margin: 0;
      padding: 0;
   }
   .sp-nav li span {
      font-size: 15px;
      color: #fff;
   }
   .sp-nav li a, .sp-nav li span {
      display: block;
      padding: 20px 0;
   }
   /*-閉じるアイコンー*/
   .sp-nav .close {
      position: relative;
      padding-left: 20px;
   }
   .sp-nav .close::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 16px;
      height: 1px;
      background: #fff;
      transform: rotate( 45deg );
   }
   .sp-nav .close::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      display: block;
      width: 16px;
      height: 1px;
      background: #fff;
      transform: rotate( -45deg );
   }
   .toggle {
      transform: translateY( 0 );
      opacity: 1;
   }
   .main-visual {
      padding: 0 4%;
   }
   
   h1{
	text-align: center;
	font-size:1.6rem;
}
   
   h2 {
      line-height: 1.6;
      margin:2rem 2rem 1rem 2rem;
   }
   
	.item > img {
  width: 100%;
  height: 10rem;
  object-fit: cover;
}

.nav-page{
	margin:0 5vw;
	column-count: 2;
	}


.nav-page li {
	list-style-type:none;
	font-size:1rem;
}

h4{
margin:0 2rem 0 2rem;
font-size:1.5rem;
}

h5{
	margin:0 2rem 0 2rem;
	font-size:1rem;
}

}