@charset "UTF-8";
*{margin: 0;padding: 0;}


body{
	font-family:　Lato, sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 16pt;
  margin: 0;
  padding: 0;
  background-color: #fff;
overflow-x: hidden;

}





/* メニューのスタイル */
.menu {
  position: fixed;
  top: 0;
  right: -100%; /* 初期状態では画面の外に隠れている */
  width: 300px;
  height: 100%;
  background-color: #ffffff;
  color: #333;
  transition: right 0.3s ease; /* スライドインのアニメーション */
  padding: 20px;
  box-sizing: border-box;
  z-index: 90;
}

/* メニューが開いているとき */
.menu.open {
  right: 0;

}

/* ボタンのスタイル */
.hamburger {
  position: fixed;
  top: 20px;
  right: 20px;
  width: 30px;
  cursor: pointer;
  z-index: 20;
  
}

.hamburger span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: #ffffff;
  margin: 5px 0;
  transition: 0.4s;
}

/* バツ印に変化するスタイル */
.hamburger.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
  background-color: #001D60;
}

.hamburger.active span:nth-child(2) {
  opacity: 0;
  background-color: #001D60;
}

.hamburger.active span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
  background-color: #001D60;
}

/* メニューリストのスタイル */
.menu ul {
  list-style-type: none;
  padding: 0;
  margin-top: 80px;
}

.menu li {
  padding: 20px 0;
  border-bottom: 3px solid #FFE000;
}

.menu li a {
  color: #001D60;
  text-decoration: none;
  display: block;
}

.menu li :hover {
  color: #FE21A6; /* ホバー時の色 */
  transition: 0.3s; /* 滑らかに変化 */
}


.back{
position: relative;
background-color: #cec302;
background-size: cover;
background-attachment: fixed;
width: 100%;
height: 300dvh;
overflow-x: hidden;
}

.header1 img{
  width: 100dvw;
}

.header1{
width: 100vw;
height: 100vh;
text-align: center;
margin: 0 auto;
position: absolute;
top: 0;
display: block;
}

.header2{
display: none;
}

.overlink{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-indent: -999px;
	z-index: 2;
}

.container {
position: absolute;
top: 0%;
left: 11%;
margin-top: 60%;
margin-left: 50%;
margin-right: 0%;
padding: 30px;
width: 100dvw;
}

.item2 {
position: relative;
background-color: #e9e8e1;

left: 10%;
width: 77dvw;
height: 7dvh;
margin-bottom: 5px;
margin-top: 10px;
margin-left: 0%;
margin-right: 0%;
padding: 0px;
}

.item2 a{
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);

text-align: center;
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin-bottom: 10%;
font-size: 14pt;
text-decoration: none;

}

.item2 img{
width: auto;
height: 95%;
}

.item2:hover{opacity: 0.5;}

.item1:hover{opacity: 0.5;}


.item1 {

text-align: center;
background-color: #17255c;
left: 10%;
width: 77dvw;
height: 7dvh;
margin-bottom: 5px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
}




.item1 a{
  height:60px;
  line-height:60px;

font-family: "Zen Maru Gothic", sans-serif;
font-style: normal;
font-weight: 500;
color: #cec302;
margin: auto;
font-size: 16pt;
text-decoration: none;
}


.in3{

z-index: 20;
position: absolute;
right: 0;
background-color: #245c1b;
width: 20dvw;
height: 7dvh;
}


.in3 a{
display: inline-block;
text-align: center;
padding-top: 35px;
color: #e9e8e1;
margin: auto;
font-size: 15pt;
}



.in2{
right: 0;
position: absolute;
z-index: 20;
background-color: #724f85;
width: 80px;
height: 7dvh;
}


.in2 a{
display: inline-block;
text-align: center;
padding-top: 35px;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}


.in1{
position: absolute;
right: 0;
z-index: 20;
background-color: #b13b07;
width: 80px;
height: 7dvh;
}



.in1 a{
display: inline-block;
text-align: center;
padding-top: 35px;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}








.kankei{
top: 75dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #17255c;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;

}

.kankei a{
font-family: "Zen Maru Gothic", sans-serif;
font-style: normal;
font-weight: 500;
color: #cec302;
margin: auto;
font-size: 16pt;
text-decoration: none;
}

.kankei:hover{opacity: 0.5;}

.za{
top: 91dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;


}

.za:hover{opacity: 0.5;}

.za img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}
.za a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 14pt;
text-decoration: none;
}



.zain{
background-color: #245c1b;
width: 10dvw;


}

.zain a{
display: inline-block;
text-align: center;
padding-top: 4dvh;
color: #e9e8e1;
margin: auto;
font-size: 15pt;
}


.sv12{
top: 106dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv12:hover{opacity: 0.5;}

.sv12 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv12 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv12in{
background-color: #b13b07;
width: 10dvw;

}

.sv12in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv11{
top: 121dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;

}
.sv11 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}





.sv11:hover{opacity: 0.5;}

.sv11 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}


.sv11in{
background-color: #b13b07;
width: 10dvw;

}

.sv11in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv10{
top: 136dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;

}

.sv10 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv10:hover{opacity: 0.5;}


.sv10 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv10in{
background-color: #b13b07;
width: 10dvw;

}

.sv10in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}


.sv9{
top: 151dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv9 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}


.sv9:hover{opacity: 0.5;}


.sv9 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv9in{
background-color: #b13b07;
width: 10dvw;

}

.sv9in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv8{
top: 166dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv8 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}


.sv8:hover{opacity: 0.5;}

.sv8 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}


.sv8in{
background-color: #b13b07;
width: 10dvw;

}

.sv8in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv7{
top: 181dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv7 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv7:hover{opacity: 0.5;}

.sv7 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv7in{
background-color: #b13b07;
width: 10dvw;

}

.sv7in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv6{
top: 196dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv6 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv6:hover{opacity: 0.5;}

.sv6 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv6in{
background-color: #b13b07;
width: 10dvw;

}

.sv6in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}


.sv5{
top: 211dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}


.sv5 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv5:hover{opacity: 0.5;}

.sv5 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv5in{
background-color: #b13b07;
width: 10dvw;

}

.sv5in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv4{
top: 226dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv4:hover{opacity: 0.5;}

.sv4 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}




.sv4 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv4in{
background-color: #724f85;
width: 10dvw;

}

.sv4in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv3{
top: 241dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}


.sv3 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv3:hover{opacity: 0.5;}

.sv3 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv3in{
background-color: #b13b07;
width: 10dvw;

}

.sv3in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv2{
top: 256dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv2 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}


.sv2:hover{opacity: 0.5;}

.sv2 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}



.sv2in{
background-color: #724f85;
width: 10dvw;


}

.sv2in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}

.sv1{
top: 271dvh;
position: absolute;
margin: 30px;
display: flex;
background-color: #e9e8e1;
width: 55dvw;
height: 13dvh;
text-align: center;
left: 20%;
}

.sv1 img{
  margin-left: 10px;
  padding-top: 0px;
  width: auto;
  height:  100%;
  left: 0px;
}



.sv1:hover{opacity: 0.5;}

.sv1 a{
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-weight: 400;
color: black;
margin: auto;
font-size: 15pt;
text-decoration: none;
}




.sv1in{
background-color: #b13b07;
width: 10dvw;

}

.sv1in a{
display: inline-block;
text-align: center;
padding-top: 4.5dvh;
color: #e9e8e1;
margin: auto;
font-size: 13pt;
}


footer{
text-align: center;
background-color: #17255c;
width: 100vw;

}

footer p{

text-align: center;
font-family: "M PLUS 2", sans-serif;
font-style: normal;
font-size: 9pt;
font-weight: 300;
color: #ada14d;
padding: 20px;
}









/*スマホ用*/

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





.back{
position: relative;
background-color: #cec302;
background-size: cover;
background-attachment: fixed;

width: 100%;
height: 150vh;} 


.header2 img{
width: 100dvw;
}
  

.header2{
width: 100dvw;
text-align: center;
margin: 0 auto;
position: absolute;
top: 0;
display: block;
}

.header1{
display: none;
}


.container {

margin-left: 0px;
margin-right: 0px;
padding: 0px;
width: 100dvw;
}

.item2 {

left: 0;
width: 77dvw;
height: 7dvh;
margin-bottom: 10px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
}





.item1 {


left: 0;
width: 77dvw;
height: 7dvh;
margin-bottom: 5px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
}

.item img{
width: auto;
height: 95%;
}




























.kankei{

top: 28dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;
font-size: 8pt;
}

.kankei a{ 
font-size: 14pt;
}

.za{

top: 36dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.za a{font-size: 10pt;
}

.za img{
  margin-left: 0px;
  padding: 2px;
	width: auto;
  height:  95%;
	left: 0px;
}

.zain a{
font-size: 11pt;
padding-top: 2dvh;}


.zain{
width: 70px;
}

.sv12{
top: 44dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;
}


.sv12 a{font-size: 10pt;
}

.sv12 img{
  margin-left: 0px;
  padding: 2px;
  width: auto;
  height:   95%;
}


.sv12in a{
padding-top: 2.3dvh;
font-size: 9pt;
}

.sv12in{
width: 70px;
}


.sv11{
top: 52dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv11 a{font-size: 10pt;
}

.sv11 img{
  margin-left: 0px;
  padding: 2px;
  width: auto;
  height:   95%;
}

.sv11in{
width: 70px;
}

.sv11in a{padding-top: 2.3dvh;
font-size: 9pt;
}

.sv10{
top: 60dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv10 a{font-size: 10pt;
}

.sv10 img{
  margin-left: 0px;
  padding: 2px;
  width: auto;
  height:   95%;}

.sv10in{
width: 70px;
}

.sv10in a{
font-size: 9pt;
padding-top: 2.3dvh;}


.sv9{
top: 68dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv9 a{font-size: 10pt;
}

.sv9 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}

.sv9in{
width: 70px;
}

.sv9in a{
font-size: 9pt;
padding-top: 2.3dvh;}


.sv8{
top: 76dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv8 a{font-size: 10pt;
}
.sv8 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}

.sv8in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv8in{
width: 70px;
}


.sv7{
top: 84dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv7 a{font-size: 10pt;
}

.sv7 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}
.sv7in{
width: 70px;
}

.sv7in a{
font-size: 9pt;
padding-top: 2.3dvh;}


.sv6{
top: 92dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv6 a{font-size: 10pt;
}

.sv6 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}


.sv6in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv6in{
width: 70px;
}

.sv5{
top: 100dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv5 a{font-size: 10pt;
}

.sv5 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;}

.sv5in{
width: 70px;
}

.sv5in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv4{
top: 108dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv4 a{font-size: 10pt;
}

.sv4 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}

.sv4in{
width: 70px;
}

.sv4in a{
font-size: 9pt;
padding-top: 2.3dvh;}


.sv3{
top: 116dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv3 a{font-size: 10pt;
}

.sv3 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}


.sv3in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv3in{
width: 70px;
}


.sv2{
top: 124dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv2 a{font-size: 10pt;
}

.sv2 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
}

.sv2in{
width: 70px;
}

.sv2in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv1{
top: 132dvh;
width: 77dvw;
height: 7dvh;
left: 4dvw;
position: absolute;

}

.sv1 a{font-size: 10pt;
}

.sv1 img{
  margin-left: 0px;
 padding: 2px;
  width: auto;
  height:   95%;
	
}

.sv1in a{
font-size: 9pt;
padding-top: 2.3dvh;}

.sv1in{
width: 70px;
}


footer{
text-align: center;
background-color: #001D60;

}








 


}











