* {
  margin : 0px;
  padding : 0px;
}
img{
	height: auto;
}
iframe{
width : 100%;
max-width : 680px;
}
a{
  color : rgb(0, 0, 0);
  text-decoration : none;
}
a:hover{
  text-decoration: underline;
}
h2 {
	font-size: 1.3rem;
	font-weight: normal;
	margin-bottom: 20px;
	padding-top: 10px;
    padding-bottom: 5px;
	clear: both;
    border-bottom: solid 1px #ccc;
    position: relative;
}

h3 {
  clear: both;
  font-size: 1.2rem;
  font-weight : normal;
  border-left : 4px solid;
  padding-left: 0.5rem;
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left : 2%;
}
h4 {
  padding : 0.5%;
  clear : both;
  border-left: 4px solid #c03;
  font-weight: normal;
}
h5 {
  clear : both;
  color : #2b2b2b;
  background-color: #f3f3f3;
  padding : 0.5%;
}
h6 {
  clear : both;
  font-weight: normal;
}
dt{
  font-weight: bold;
  margin-bottom : 1%;
}
hr{
  clear : both;
}
/****************/
body {
  font-size: 100%;
  font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
  line-height: 1.8em;
  border-top-width : 5px;
  border-top-style : solid;
  border-top-color : rgb( 80, 80, 80);
  padding-top : 1%;
  border-bottom-width : 2px;
  border-bottom-style : solid;
  border-bottom-color : rgb(80, 80, 80);
}
#wrap {
  width : 90%;
  max-width : 1180px;
  margin-left : auto;
  margin-right : auto;
  overflow : hidden;
}
#header{
  width : 100%;
  overflow : hidden;
  padding-bottom : 3%;
}
#header a{
  color : rgb(0, 0, 0);
  text-decoration : none;
}
#header h1{
font-weight: normal;
	float: left;
	
	background-repeat: no-repeat;
    background-size : contain;
	text-align: center;
	text-indent: -9999px;
}
#header h1 a{
  width:392px;
  height:65px;
	display: block;

}
#header_hbg h1 a{
	height: 45px;
    width : 50%;
	display: block;
}
#header_hbg h1{
	font-weight: normal;
	padding-top: 2%;
	padding-left: 2%;
	padding-right: 1%;
	float: left;
	background-image: url(logo.png);
	background-repeat: no-repeat;
    background-size : contain;
	text-indent: -9999em;
	height: 45px;
    width : 50%;
	max-width: 379px;
}
#header_hbg h1 a{
	display: block;
}
#header span{
  font-size : 50%;
  color : gray;
  padding-left : 1%;
}
#header ul{
  width : 45%;
  float : right;
  font-size : 88%;
  font-weight : normal;
  margin-right : 5%;
  margin-top : 2%;
}
#header li{
  float : left;
  list-style-type : none;
  padding-top : 1%;
  width : 25%;
  text-align : center;
}

#header li a:hover{
  color : rgb(44, 183, 240);
}
#header_sub{
  width : 100%;
  overflow : hidden;
  padding-bottom : 2%;
}
#header_sub h1 a, #header_sub li a {
  color: rgb(31, 31, 31);
  text-decoration: none;
}
#header_sub h1{
  font-weight : bold;
  padding-top : 2%;
  padding-left : 2%;
  padding-right : 1%;
  width : 40%;
  float : left;
  font-size : 140%;
}
#header_sub span{
  font-size : 50%;
  color : gray;
  padding-left : 1%;
}
#header_sub ul{
  width : 40%;
  float: right;
  font-size : 88%;
  font-weight: nomal;
  margin-right: 5%;
  margin-top: 2%;
  color: gray;
}
#header_sub li{
  float : left;
  list-style-type : none;
  padding-top : 1%;
  padding-right : 2%;
  width : 24%;
}
#header_sub li a:hover{
  color : rgb(44, 183, 240);
}
#header_sub li:first-child{
  width : 15%;
}
#cont{
  width : 100%;
  padding-top : 2%;
  padding-bottom : 2%;
  overflow : hidden;
}
#page{
  width : 65%;
  float : left;
}
#menu{
  width : 30%;
  float : right;
}
#footer{
	padding-top: 4%;
	padding-bottom: 4%;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: silver;
}
.notec_text{
  font-size : 88%;
  color : gray;
  padding : 1%;
}
.date{
  font-size : 88%;
  color : gray;
  padding: 1%;
  text-align : right;
}
.category{
	overflow: hidden;
}
.category li{
	list-style-type: none;
	width: 46%;
	margin: 2px;
	float: left;
	text-align: center;
	border-radius: 3px;
	transition: .4s;
	color: #666666;
	border-width: 1px;
	border-style: dashed;
	border-color: #666666;
}
.category li a{
	display: block;
	padding:  5% 1% 5% 1%;
	text-decoration: none;
}
/*グリッド用スレッド*/
/*基本３列*/
.thread{
	margin-bottom: 5%;
	overflow: hidden;
}
.thread ul{
  width : 100%;
  overflow : hidden;
}
.thread li{
  padding : 2% 1% 1% 1%;
  margin : 0.5%;
  width : 30%;
  border-width : 1px;
  border-style : solid;
  border-color : silver;
  list-style-type : none;
  float : left;
  height : 300px;
  overflow : hidden;
  border-radius : 5px;
}
.thread li div {
    width:100%;
	background-size: cover;
	background-position: center center;
	border-radius : 5px;
}
.thread li div a{
	padding-top: 65%;
	width: 100%;
      height : auto;
	text-indent: -9999em;
	display: block;
}
.thread img{
  width : 100%;
  height : auto;
}
.thread dl{
  padding-top : 5px;
  margin : auto;
  width : 90%;
  line-height : 1.4em;
}
.thread dl dt{
  font-size : 98%;
  font-weight : bold;
  margin-top : 2%;
}
.thread dl dd{
	font-size: 80%;
}
/*******リスト型*******/
/*1列*/
.thread_list{
  width : 100%;
}
.thread_list ul{
  padding-bottom : 3%;
  overflow : hidden;
}
.thread_list li{
  color: gray;
  height : auto;
  overflow: hidden;
  list-style-type: none;
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: silver;
  padding-top : 5%;
  clear : both;
}
.thread_list img{
  width : 30%;
  height : auto;
  float : left;
}
.thread_list div {
  width : 30%;
  height : auto;
  float : left;
  text-indent: -9999em;
  background-size: cover;
  background-position: center center;
}
.thread_list div a{
	padding-top:40%;
    display: block;
}
.thread_list dl{
  margin-left : 32%;
  line-height : 1.2;
  font-size : 95%;
  overflow : hidden;
}
.thread_list dt{
  font-weight: bold;
  color: rgb(56, 56, 56);
  padding-bottom: 1%;
}
.thread_list dd{
  font-size : 88%;
}
/*2列*/
.thread_list_2{
  width: 100%;
  font-size: 98%;
  overflow: hidden;
  padding-bottom: 3%;
}
.thread_list_2 ul{
  overflow: hidden;
}
.thread_list_2 li{
  border-right-width : 1px;
  border-right-style : dashed;
  border-right-color : silver;
  width : 45%;
  height : 85px;
  padding-right : 1%;
  padding-bottom : 1%;
  float : left;
  padding-top : 1%;
  padding-left : 1%;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : rgb(204, 204, 204);
  overflow : hidden;
}
.thread_list_2 li div {
    float: left;
    width:35%;
	background-size: cover;
	background-position: center center;
	border-radius : 5px;
}
.thread_list_2 li div a{
	padding-top: 40%;
	width: 100%;
    height : auto;
	text-indent: -9999em;
	display: block;
	max-width :150px;
}
.thread_list_2 img{
  width : 100%;
  height : auto;
}
.thread_list_2 dl{
  width : 60%;
  float : right;
}
.thread_list_2 dt a{
  text-decoration : none;
  font-weight : bold;
  color :  rgb(51, 51, 51);
}
.thread_list_2 dd{
display:none;
}
.thread_list_2 p {
  width : 47%;
  padding-top : 1%;
  float : right;
}
/*******テキストのみスレッド*******/
.list{
  width : 98%;
  padding : 2%;
}
.list dt{
	padding-left: 60px;
	padding-top: 15px;
	font-weight: bold;
	color: rgb(204, 0, 0);
	font-size: 90%;
	background-position: left 15px;
}
.list dt a{
	color: rgb(204, 0, 0);
	text-decoration: none;
	padding-top: 1%;
}
.list dt a:hover{
  text-decoration: underline;
}
.list dd{
  padding-left : 60px;
  padding-bottom : 1%;
  border-bottom-width : 1px;
  border-bottom-style : dotted;
  border-bottom-color : black;
  font-size : 88%;
}

/*スリック用*/
.thread_slick{
  background-color : rgb(227, 227, 227);
}
.thread_slick li{
  border-width : 1px;
  border-style : solid;
  border-color : silver;
  text-align : center;
  margin : 5px;
  padding : 5px;
  width : 23%;
  height : auto;
  background-color : white;
  float : left;
}
.thread_slick img{
  object-fit: contain;
  width : 100%;
  height : auto;
  max-height : 600px!important;
}
.slick_list{
  padding-bottom : 3%;
  overflow : hidden;
}
.slick_list li{
	color: gray;
	overflow: hidden;
	list-style-type: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: silver;
	height: 85px;
	float: left;
}
.slick_list img{
  width : 40%;
  height : auto;
  float : left;
}
.slick_list dl{
  margin-left : 43%;
  line-height : 1.2;
  overflow : hidden;
}
.slick_list dt{
font-size : 90%;
  font-weight: bold;
  color: rgb(56, 56, 56);
  padding-bottom: 1%;
}
.slick_list dd{
  font-size : 75%;
}

/**画像表示レイアウト**/
.img_1col img,.img_2col img, .img_3col img,.img_4col img{
  width : 100%;
  height : auto;
  margin : auto;
}
.img_1col {
  width: 100%;
  font-size : 80%;
  color: gray;
  text-align: center;
  padding-top : 1%;
  padding-bottom : 2%;
}
.img_2col{
  width : 100%;
  overflow : hidden;
}
.img_2col li{
line-height : 1.2;
  margin : 1%;
  width : 40%;
  max-width : 300px;
  float : left;
  list-style-type : none;
  height : auto;
  font-size : 80%;
  color : rgb(80, 80, 80);
  text-align : center;
}
.img_3col{
  width : 100%;
  overflow : hidden;
}
.img_3col li{
line-height : 1.2;
  margin : 1%;
  width : 30%;
  max-width : 300px;
  float : left;
  list-style-type : none;
  height : auto;
  font-size : 80%;
  color : rgb(80, 80, 80);
  text-align : center;
}
.img_3col li div {
	background-size: cover;
	background-position: center center;
}
.img_3col li div a{
	padding-top: 75%;
	width: 100%;
	text-indent: -9999em;
	display: block;
}
.img_4col{
  width : 100%;
  overflow : hidden;
}
.img_4col li{
line-height : 1.2;
  margin : 1%;
  width : 22%;
  max-width : 300px;
  float : left;
  list-style-type : none;
  height : auto;
  font-size : 80%;
  color : rgb(80, 80, 80);
  text-align : center;
}
/*画像文字半々*/
.img50_text50{
	width: 100%;
	height: auto;
	overflow: hidden;
}
.img50_text50 img{ 
  width : 45%;
  float : left;
  height : auto;
}
.img50_text50 dl{
  font-size : 95%;
  margin-left : 48%;
}
.dl_btn{
padding-left:10px;
width:80px!important;
height:25px!important;
text-align=center;
}
/*テキスト用ｨ*/
.text_info{
  padding : 1%;
}
.text_info dt{
  font-weight : bold;
  margin-bottom : 1%;
}
.text_info dd{
  font-size : 90%;
  padding-left : 1%;
}
.dl_basic{
	overflow: hidden;
}
.dl_basic dt{
  font-weight : bold;
  margin-top : 2%;
}
.dl_basic dd{
  padding-left : 1%;
}
/*******小物**********/
date{
  font-size : 88%;
  color : gray;
  padding: 1%;
  text-align : right;
}
.more{
    font-size : 88%;
	margin-top: -5px;
	text-align: right;
}
.more a{
	font-size: 78%;
	border-radius: 3px;
	color: white;
	background-color: teal;
	padding-left: 2%;
	padding-right: 2%;
	text-decoration: none;
}

/***SNS***/
.sns{
    width : 100%;
	clear: both;
	margin-top: 2%;
	margin-bottom: 2%;
}
.sns ul {
	overflow: hidden;
}
.sns li{
	
	float: left;
	list-style-type: none;
	margin-right: 0.5%;
}
.sns div{
        height: 22px;
        overflow : hidden;
}
.slick_list{
  /*左画像右文字*/
  padding-bottom : 3%;
  overflow : hidden;
}
.slick_list li{
  color: gray;
  overflow: hidden;
  list-style-type: none;
  border-bottom-width: 1px;
  border-bottom-style: dotted;
  border-bottom-color: silver;
  height: 90px;
  float: left;
}
.slick_list img{
  width : 40%;
  height : auto;
  float : left;
}
.slick_list dl{
  margin-left : 43%;
  line-height : 1.2;
  overflow : hidden;
}
.slick_list dt{
  font-size : 90%;
  font-weight: bold;
  color: rgb(56, 56, 56);
  padding-bottom: 1%;
}
.slick_list dd{
  font-size : 75%;
}
/**********ハンバーガーめにゅー**********/
.hamburger-menu {
	display: none;
}
.menu-btn {
	position: fixed;
	top: 10px;
	right: 10px;
	display: flex;
	height: 30px;
	width: 30px;
	justify-content: center;
	align-items: center;
	z-index: 90;
	background-color: #ffffff;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background-color: #96c8ff;
  position: absolute;
}
.menu-btn span:before {
  bottom: 8px;
}
.menu-btn span:after {
  top: 8px;
}
#menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0);
/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  transform: rotate(-45deg);
}
.menu-content {
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 100%;
  /*leftの値を変更してメニューを画面外へ*/
    z-index: 80;
  background-color: #fff;
  transition: all 0.5s;
/*アニメーション設定*/
}
.menu-content ul {
  padding: 30px 10px 0;
}
.menu-content ul li {
  border-bottom: solid 1px #96c8ff;
  list-style: none;
}
.menu-content ul li a {
  display: block;
  width: 100%;
  font-size: 15px;
  box-sizing: border-box;
  color:#000;
  text-decoration: none;
  padding: 9px 15px 10px 0;
  position: relative;
}
.menu-content ul li a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-top: solid 2px #96c8ff;
  border-right: solid 2px #96c8ff;
  transform: rotate(45deg);
  position: absolute;
  right: 11px;
  top: 16px;
}
#menu-btn-check:checked ~ .menu-content {
  left: 0;
}
/*下部固定コンテナ*/
.fixed_bana{
    width: 100%;
    position: relative;
}
.fixed_img {
    height: 90px;
    width: 35%!important;
    position: absolute;
    bottom: 0;
    right: 0;
    height: auto;
    z-index: 1;
    padding : 2%;
}
.copyright{
	width: 100%;
	font-size: 80%;
	color: gray;
	text-align: center;
	line-height: 1.5em;
}
/******BREAK********/
@media(max-width : 801px){
#header ul{
display :none;
}
.hamburger-menu {
display:block;
}
  #header_sub h1, #header_sub li, .thread_list li{
  float : none;
  width : 96%;
  height : auto;
  margin : auto;
}
.thread li {
  width : 45%;
}
.thread img :first-child {
  width : 100%;
}
 .thread_post li {
   float : none;
   width : 98%;
   height : auto;
   margin : 2% auto 2% auto ;
   padding-bottom : 2%;
   }
.img50_text50 dl{
 margin-left : 0%;
}
.fixed_img{
 width : 60%!important;
}
}
@media(max-width : 641px){
  #header h1, #main, #page, #menu {
  float : none;
  width : 100%;
  height : auto;
  margin : auto;
  padding-top : 3%;
  padding-bottom : 3%;
}
.thread_list_2 li{
  float : none;
  width : 100%;
}
#header h1{
  text-align : center;
}
}
@media(max-width : 481px){
.sns li {
  float : none;
  width : 100%;
  margin : auto;
	padding-top: 3%;
	padding-bottom: 3%;
	text-align: center;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: silver;
}
.img_3col li, .img_4col li, .img_5col li{
width : 47%;
}
.img_left{
	float: none;
}
.img50_text50 img{
 float : none;
 width : 90%;
 margin-left : auto;
 margin-right : auto;
 margin-bottom : 10px;
}
.thread li, .thread_list_2 li {
  float : none;
  width : 96%;
  height : auto;
  margin : auto;
}
}