@charset "utf-8";
/* CSS Document */
body{
margin: 0px;
}
#container{
margin: 0 auto;        /* 左右中央に寄せる */
padding: 0;       /* スマホ時に左右がくっつかないよう余白を確保 */
box-sizing: border-box; /* paddingを含めて幅を計算する（重要！） */
}
@media (min-width: 768px){
#container{
width: 100%; 
max-width: 1440px;
}
}
@media (max-width: 767px){
#container{
width: 100%;
}
}

/* フッター */
#footer{
	padding: 40px;
	border-radius: 40px 40px 0 0;
}
#footer p{
	color: #fff;
	font-weight: bold;
	text-align: center;
}
.footer_link{
  display: flex;
  justify-content: center;
  gap: 20px;
  align-items: center; 
  padding: 20px;
}
.footer_link img{
  max-width: 45%;
  height: auto;
  object-fit: cover;
}

@media (min-width: 768px){
header{
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
#header-nav {
  display: flex;           /* 横並びの指定 */
  list-style: none;        /* 黒丸を消す */
  padding: 0;              /* デフォルトの余白をリセット */
  margin: 0;
}

/* 子要素：リスト項目 */
#header-nav li {
  /* ここでは横並びの制御のみ */
}

/* リスト内のリンク：ここをブロック要素にして余白を作る */
#header-nav li a {
  display: block;          /* ブロック要素化してクリック範囲を広げる */
  padding: 10px;           /* 指定の余白 10px */
  text-decoration: none;   /* 下線を消す */
  color: #000000;             /* 文字色 */
}

/* マウスを乗せた時の反応（おまけ） */
#header-nav li a:hover {
}
.right-boder{
		border-right: 1px solid #333;
	}
#site-header {
  display: flex;
  justify-content: space-between; /* 3つの要素を「左・中・右」に等間隔配置 */
  align-items: center;           /* 上下中央揃え */
  padding: 10px 20px;            /* 上下10px、左右20pxの余白 */
}
#btn-header {
  display: inline-block;
  padding: 10px 20px;
  text-decoration: none;
}
}
@media (max-width: 767px){
#header{
	background: url("../img/sp_bg.png");
	overflow: visible; 
}
}

#header-logo {
  text-align: center
}
#header-logo a {
  font-size: 24px;
  font-weight: 900;
  text-decoration: none;
  color: #000;
  letter-spacing: 2px;
}
.font_small {
  font-size: 16px;
}

/* ナビゲーション */
@media (max-width: 767px){
#nav{
display: none;
}
#header_sp{}
}

@media (min-width: 768px){
#header_sp{
display: none;
}
#nav{}
}
/* SPナビ overlay-styles.css */
.hamburger-overlay {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 1000;
  width: 48px;
  height: 48px;
  border: none;
  background: transparent;
  cursor: pointer;
}

.hamburger-overlay__line {
  position: absolute;
  left: 11px;
  width: 26px;
  height: 2px;
  background-color: #333;
  transition: all .6s;
}

.hamburger-overlay__line:nth-of-type(1) { top: 14px; }
.hamburger-overlay__line:nth-of-type(2) { top: 23px; }
.hamburger-overlay__line:nth-of-type(3) { top: 32px; }

.hamburger-overlay.active .hamburger-overlay__line {
  background-color: #333;
}

.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(1) {
  transform: translateY(9px) rotate(-45deg);
}
.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(2) {
  opacity: 0;
}
.hamburger-overlay.active .hamburger-overlay__line:nth-of-type(3) {
  transform: translateY(-9px) rotate(45deg);
}

.nav-overlay {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  visibility: hidden;
  opacity: 0;
  transition: all .6s;
  z-index: 900;
}

.nav-overlay.active {
  visibility: visible;
  opacity: 1;
}

.nav-overlay__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  text-align: center;
}

.nav-overlay__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-overlay__item {
  opacity: 0;
  transform: translateY(20px);
  transition: all .6s;
}

.nav-overlay.active .nav-overlay__item {
  opacity: 1;
  transform: translateY(0);
}

.nav-overlay.active .nav-overlay__item:nth-child(1) { transition-delay: 0.1s; }
.nav-overlay.active .nav-overlay__item:nth-child(2) { transition-delay: 0.2s; }
.nav-overlay.active .nav-overlay__item:nth-child(3) { transition-delay: 0.3s; }
.nav-overlay.active .nav-overlay__item:nth-child(4) { transition-delay: 0.4s; }
.nav-overlay.active .nav-overlay__item:nth-child(5) { transition-delay: 0.5s; }
.nav-overlay.active .nav-overlay__item:nth-child(6) { transition-delay: 0.6s; }

.nav-overlay__link {
  display: inline-block;
  padding: 20px;
  color: #333;
  font-size: 24px;
  text-decoration: none;
  transition: color .3s;
}

.nav-overlay__link:hover {
  color: #4a90e2;
}


/* top content*/

#content{}

#main-contents{
padding: 3px;
}



/* 2Column 3Column */
.field2 {
justify-content: space-between;
}
.field3 {
justify-content: space-between;
}
@media (min-width: 768px){
.field2 {
display: flex;
}
.field3 {
display: flex;
}
}
@media (max-width: 767px){
.field2 {
}
.field3 {
}
}
.card{

}
/* sonota */



/*-----ページトップへボタン-----*/
#page_top{
  position: fixed;
  display: flex;
	z-index: 5000;
}
@media screen and (min-width:769px){
#page_top{
	width: 10%;
	height: auto;
  padding: 1em ;
  right: 0;
  bottom: 10%;
}
}
@media screen and (max-width:768px){
#page_top{
	width: 15%;
	height: auto;
  padding: 0.2em;
  right: 0;
  bottom: 5%;
}
}