@charset "utf-8";

:root {
  --main-text: #212529;
  --main-bg: #fff;
  --sub-bg:#fff;
  --relate_anker_border:#ddd;
  --blockq:#ddd;
}
@media (prefers-color-scheme: dark) {
  :root {
    --main-text: #ddd;
    --main-bg: #1A1A1A;
      --sub-bg:#282828;
      --relate_anker_border:#333;
        --blockq:#444;
  }
  img {
  filter: grayscale(50%) !important;
}
}
 
body {
  color: var(--main-text);
  background-color: var(--main-bg);
}




@media (prefers-color-scheme: dark) {
  body{
    background-color: var(--main-bg) !important;
  color: var(--main-text) !important;
  }
}





/* CSS Document */
a:hover,
a:hover  div{
opacity:0.5 !important;
  transition: .2s;
}
	
	a,button ,a > div, .touch_hover  {

    -webkit-tap-highlight-color:rgba(200,200,200,0.40);  !important;    
				 -webkit-touch-callout:none  !important;  

}

body{
font-family:
    'メイリオ',
    Meiryo,
    'Lucida Grande',
    Verdana,
    'ヒラギノ角ゴ Pro W3',
    'Hiragino Kaku Gothic Pro',
    Osaka,
    'ＭＳ Ｐゴシック',
    sans-serif;
	padding-top:100px;
	white-space:normal;
	word-break:break-all;
}
img{opacity:0.2;}
 pre{
 white-space:normal;
 }
 /* グローバルメニューの文字サイズ*/
 li.nav-item > a.nav-link{
 font-size:12px;
 }
  /* グローバルメニューのactive*/
 li.nav-item.active > a.nav-link{
  color:#FFCC00 !important;
}


.top_logo{
width:150px;
}

 /* 検索結果の文字*/
.search_found{
color:#FF0000;
background-color:#FFFF00;

}
/*　関連 　関連 　関連 　関連 　関連  */
/*-top of relate_link -*/


.list-group-item{
  background-color: var(--sub-bg);
}

.relate_anker{
display:block;
width:100%;
border:1px solid var(--relate_anker_border);
height:80px;
overflow:hidden;
background-color: var(--sub-bg);
padding-left:110px;
margin-bottom:20px;
background-size:100px auto;
background-position: left top;
background-repeat:no-repeat;
  padding-right: 10px;
  box-shadow: 2px 2px 2px rgba(0,0,0,0.1);
}
a.relate_anker > strong{
display:block;
font-weight:bold;
font-size:20px;
line-height:18px;
padding-top:5px;
}
a.relate_anker > span.relate_desc{
font-size:12px;
line-height:12px;
color:#666666;
}
.relate_image{
width:100px;
float:left;
margin-right:5px;
}
 a.relate_anker > span.site{
font-size:10px;
display:block;
}
/*-bottom of relate_link -*/

#adContent {
margin:50px 0;
}


 /* 各コーナー共通の下の～以外の最近の投稿*/
.bottom_recent .media{
background-color:var(--sub-bg);
  box-shadow: 2px 2px 2px rgba(0,0,0,0.1);
  height:100%;
  margin:10px;

}

.bottom_recent .media-body{
padding:0 10px 0 0;
}
.bottom_recent h5{
padding-top:10px;
font-size:16px;
}
.image_waku_bottom{

margin:0 12px 0px 0;
 }
 
 .image_waku_bottom img{
object-fit: cover;
  width: 190px;
  height: 100px;
 }
 .bottom_recent p{
 font-size:12px;
 margin:0;
 }
 
  /* youtubeyoutubeyoutubeyoutubeyoutubeyoutubeyoutube*/
  
      	.youtube {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	margin-bottom:20px;
}

.youtube iframe,  
.youtube object,  
.youtube embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

  /* pager pager pager pager pager pager pager pager pager pager pager pager*/
#pager {
width:100%;
}

#pager .btn{
white-space: normal; //bootstrapのbtnがノーラップ
}
    #pager a{
color:#fff;
width:100%;
margin:10px 0;
  }
  /* pager_default pager_default pager_default r*/
#pager_default{
margin:50px 0;

}

    #pager_default a{
color:#fff;
margin-right:5px;
  }
  
    /* pageToppageToppageToppageToppageTop*/
  
  #pageTop {

  position: fixed;
  bottom: 10px;
  right: 20px;
}

 

#pageTop a {
font-size:60px;
  display: block;
  z-index: 999;
color: #FF3366;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
    opacity: 0.7;
}

 

#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}

.footer_ad{
margin:50px 0;
}
@media (max-width: 575.98px)  { 
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto
{
  padding-right: 5px;
  padding-left: 5px;
}
article{
font-size: 1.4rem;
}
.top_logo{
width:270px;
padding-top:3px;
}

 /* グローバルメニューの文字サイズ*/
 li.nav-item > a.nav-link{
 font-size:20px;
 color:#fff !important;
 border-bottom:1px solid #333;
 }
 
 .nav-link .d-sm-none{
 font-size:9px;
 } 
 
 input.form-control.mr-sm-2{
 width:300px;
 }
 }