@charset "utf-8";
/* CSS Document */
:root {
--the_color:#930000;
--main_text: #111;
--sub_text:#4F4F4F;
--main_bg_dark: #f0f0f0;
--main_bg_light: #ffffff;
--main_bg_l3: #ffffff;
--main_bg_light_border: #eee;



}

a, a.page-link
{
  color: #cc0000;
		
		}
		
		a:hover{
  color: #CC3366;

}




@media (prefers-color-scheme: dark) {
  :root {
  --the_color:#4B0303;
--main_text: #eee;
--sub_text:#AEAEAE;
--main_bg_dark: #202023;
--main_bg_light: #2a2b2f;
--main_bg_l3: #40414654;
--main_bg_light_border: #222222;
--form_parts_back: #3b3d3e;
--form_parts_border: #48484a;
--link_color:#f9cbcb;
  }

  a, a.page-link
{
  color: #f0dede;
		
		}
		
		a:hover{
  color: #9c4f4f;

}


  }
  
  
  


.head_bg_color
{
  background-color: var(--the_color);
  color: #ffffff;
}


/* ライン 6 */
#left_col  .btn-primary:hover
{
  color: #ffffff;
  background-color: var(--the_color);
  border-top-color: var(--the_color);
  border-right-color: var(--the_color);
  border-bottom-color: var(--the_color);
  border-left-color: var(--the_color);
}


span.site_menu_esa{
background-color:var(--the_color);

}

span.site_menu_esa a{
color:#fff !important;
}



 .relate_sum{
	border:1px solid var(--main_bg_light_border);
	background-color:var(--main_bg_light);
	width:180px;
	}
		.relate_sum img{
width:100%;
}

	.relate_sum h4{
font-size:0.8rem ;
}

.ken{
font-size:0.7rem;
}

.list-group-item.cat1{
margin-left:0;
}


.list-group-item.cat1 > a{
  font-size: 1rem;
 color: #ffffff !important;
}

.list-group-item.cat1{
  background-color: var(--the_color);
}

.list-group.left_menu_l2
{
  margin-left: 0rem;
  font-size: 1rem;
}

 ul.list-group.left_menu_l2 > li.list-group-item{
	margin-left:0;
	}

.left_menu_l2 >.list-group-item,.left_menu_l3 >.list-group-item{
  border-radius: 0rem;
}

#left_col_esa .list-group-item.active{
  color: #ffffff !important;
  background-color: #333;
}

#left_col_esa .list-group.left_menu_l2 > li.list-group-item{
  background-color: #333;
		border:none;
}
#left_col_esa .list-group.left_menu_l2 > li.list-group-item > a{
  color: #ffffff !important;
}

#left_col_esa .list-group.left_menu_l3 > li.list-group-item{
  background-color: #555;
}
#left_col_esa .list-group.left_menu_l3 > li.list-group-item > a{
  color: #ffffff !important;
}
#left_col_esa .list-group-item.active{
border:none;
}

#left_col_esa .list-group-item,
#right_col .list-group-item{
padding-top: 0.5rem;
  padding-right: 0rem;
  padding-bottom: 0.25rem;
  padding-left: 1rem;

}



 div.footer_maker_names{
	width:200px;
	font-size:0.8rem;
	}
	
#migi .btn.btn-primary,
	.blog_finder_button{
	  color: #ffffff;
  background-color: #ff0c07;
  border-top-color: #ff0c07;
  border-right-color: #ff0c07;
  border-bottom-color: #ff0c07;
  border-left-color: #ff0c07;
	}
	
	
#spec th{
background-color:#ededed;
border-color:#CCCCCC;
}
	
	
	#spec td{
background-color:#fff;
border-color:#CCCCCC;
}
	
	
	/* ¥é¥¤¥ó 129 */
.opacity04.active{
  border-bottom-color: #FF0000;
}
	#blog #left_col{
background:none;
}
#blog #left_col h3,
#blog #left_col{
color:#212529;

}
#blog #left_col a{
  color: #cc0000;
}

#blog #left_col a:visited{
color: #330000;;
}
#blog_main .btn-primary
{

  background-color: #ff0c07;
  border-top-color: #ff0c07;
  border-right-color: #ff0c07;
  border-bottom-color: #ff0c07;
  border-left-color: #ff0c07;
}


/* カテゴリボタン全体のコンテナ */
#homepage_button .d-flex {
    gap: 8px;           /* ボタン同士の隙間 */
    padding-bottom: 8px; 
}

#homepage_button .dai_cat_button {
    /* 5列を維持しつつ隙間の分を引く計算 */
   flex: 0 0 calc(16.66% - 13.33px);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    
    /* 角丸を少し抑えた最新設定 */
    border-radius: 6px; 
    
    padding: 10px !important;
    border: 1px solid transparent;
}

#homepage_button .dai_cat_button a {
    display: block;
    text-decoration: none;
    height: 100%;
}

#homepage_button .dai_cat_button:hover {
    transform: translateY(-6px);
}

#homepage_button .dai_cat_button img {
    transition: transform 0.5s ease;
    filter: drop-shadow(0 8px 12px rgba(0,0,0,0.1));
}

#homepage_button .dai_cat_button:hover img {
    transform: scale(1.12) rotate(1deg);
}

#homepage_button .cat_name {
    font-size: 0.9rem;
    font-weight: 800;
    margin-top: 8px;
    letter-spacing: 0.02em;
}

/* ライトモード設定 */
@media (prefers-color-scheme: light) {
    #homepage_button .dai_cat_button {
        background: #ffffff;
        box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    }
    #homepage_button .dai_cat_button:hover {
        background: #fff;
        box-shadow: 0 16px 32px rgba(0,0,0,0.1);
        border-color: #f0f0f0;
    }
    #homepage_button .cat_name { color: #444; }
    #homepage_button .dai_cat_button:hover .cat_name { color: #d9534f; }
}

/* ダークモード設定 */
@media (prefers-color-scheme: dark) {
    #homepage_button .dai_cat_button {
        background: rgba(255, 255, 255, 0.03);
        border: 1px solid rgba(255, 255, 255, 0.08);
        box-shadow: 0 8px 16px rgba(0,0,0,0.3);
    }
    #homepage_button .dai_cat_button:hover {
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.2);
        box-shadow: 0 12px 28px rgba(0,0,0,0.5);
    }
    #homepage_button .cat_name { color: #ddd; }
    #homepage_button .dai_cat_button:hover .cat_name { color: #ff5e5e; }
}

/* スマホ表示（767px以下）の設定 */
@media (max-width: 767px) {
    #homepage_button .d-flex {
        gap: 10px; /* スマホでは隙間を少し狭くする */
    }

    #homepage_button .dai_cat_button {
         flex: 0 0 calc(33.33% - 6.7px);

        border-radius: 10px; /* スマホに合わせて角丸もさらに控えめに */
        padding: 8px !important;
    }

    #homepage_button .cat_name {
        font-size: 0.8rem; /* 文字がはみ出さないよう少し小さく */
    }
}