@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.1
*/




/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
a{ /*リンクテキスト装飾無し*/
  text-decoration: none;
}




.content{
	margin:0 0 2% 0;
}

.home #breadcrumb{
	display:none;
}

.top-rinen{
	margin-bottom:5%;
}
.page .sns-share,
.page .sns-follow {
    display: none;
}

.home .entry-header{
	display:none;
}

.tel_sp{
	display:none;
}

.listing-item{
	list-style:none;
    width: 18.70%;
    height: 300px;
    overflow: hidden;
    box-shadow: 0 2px 5px #999;
    display: inline-block;
    margin-right: 12px;
    vertical-align: top;
	padding: 0.5%;
	margin-bottom: 15px;
}


.listing-item .title,
.listing-item .title a {
  font-size: 15px;
  border-left: 5px solid #0288b1;
  padding-left: 2%;
  line-height: 20px;
  display: -webkit-box !important;  
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.excerpt-dash{
	display:none;
}

.eye-catch-wrap{
	display:none;
}

.button_480{
	text-align:right;
	margin: 2% 1%;
}

#top-h2{
  margin-top:0;
  background: linear-gradient(to right, #00b3ff 50%, #0095d9 50%) right bottom;
  background-size: 200% 100.5%;
  transition: all 1s ease-out;
  color:#ffffff;
}
#top-h2:hover {
  background-position: left bottom;
  border-bottom: 2px solid #000; 
}

.article-footer{
	display:none;
}

.entry-content{
   margin-bottom:0;	
}

.copyright {
    background:#0000FF;
    padding: 2%;
    color: #ffffff;
}

.adress480 .f-ad{
	display: table;
	width:100%!important;
	padding-left:0;
}

.adress480 .f-list{
    display: table-cell;
    padding: 1%;
	 width: 350px;
}
.adress480 .f-list1{
    display: table-cell;
    padding: 1%;
	 width: 350px;
}
.adress480 .f-list3{
    display: table-cell;
    padding: 1%;
	 width: 350px;
}
/************************************
** 固定ページ共通(pc)
************************************/
.misaki_pages{
	width:900px;
	margin:0 auto;
}
.home .misaki_pages{
	width:100%;
}
.page_h2{
	background:#006fff!important;
	color:#ffffff!important;
}
.page .entry-title{
	display:none;
}
.page .date-tags{
	display:none;
}
.copyright {
    background: #006fff;
}

.page-id-12 .adress480 .f-ad, .page-id-12 .adress480 .f-ad, .page-id-8 .adress480 .f-ad, .page-id-10 .adress480 .f-ad, .page-id-17 .adress480 .f-ad, .single .adress480 .f-ad,  .category .adress480 .f-ad{
	  font-size:15.7px;
 }


/************************************
** 会社概要(pc)
************************************/

/************************************
** 会社実績(pc)
************************************/
.page-id-8 .page_h2{
	margin-top:0!important;
}
/************************************
** SDGs(pc)
************************************/
.page_h3{
	border-left: 8px solid #0093ea!important;
}
.sdgs_ul{
	padding-left:15px;
}
.sdgs_ul li{
	list-style:none;
}
.sdgs_all .sdgs_ul li{
   border: 1px solid #ccc;
   padding: 2%;
   border-radius: 0.5em;
}
/************************************
** 社内専用(pc)
************************************/
.page-id-642 .search-edit, input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea,
select {
  width: 20%;
}

.page-id-642 input[type='submit'],
#bbp_reply_submit,
.bp-login-widget-register-link a {
  width: 10%;
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	#header-in{
		height:200px;
	}
	.listing-item{
		width: 18.4%;
		height:auto;
	}
	#navi .navi-in > .menu-mobile li{
	  background: #04b324;
     border: 1px solid #fff;
	}
}

@media screen and (max-width: 768px){
     #header .site-logo-image{
	     width:60%;
     }
	.listing-item {
      width: 18%;
	}
}
/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	#header{
		/**通常**/
		background-image: url("https://misakikg.jp/wp-content/uploads/2020/04/res_h-1.jpg");
		/**クリスマス**/
		 /**background-image: url("https://misakikg.jp/wp-content/uploads/2022/12/xmas_top_mobile.jpg");**/
	}
	#header .site-logo-image{
		/**width:通常80%;**正月60%**/
		width:60%;
	}
	.logo-image {
      margin-top: 10px;
	}
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	#navi .navi-in > .menu-mobile li{
	  background: #04b324;
      border: 1px solid #fff;
	}
	.entry-content{
		margin-bottom:0;
	}
	.tel_sp{
	  display:block;
      position: absolute;
      top: -227px;
      left: 0;
	}
	.article ul{
		padding:2%;
	}
	.listing-item .title, .listing-item .title a {
	font-size: 20px;
	}
	.listing-item {
      width: 100%;
      margin-right: 0px; 
      vertical-align: unset;
	  margin-bottom: 2%;
	  padding: 3%;
	  height:auto;
   }
	.listing-item  img{
		width: 100%;
	}
	.top-h2 {
     padding: 0.5em;
     color: #010101;
     background: #fb0000!important;
     border-bottom: solid 3px #7d0615;
   }
	
	.navi-footer-in > .menu-footer li.menu-item {
    background: #0353a9;
    padding: 5px 0;
    }
	.navi-footer-in > .menu-footer li.menu-item a {
    color:#ffffff;
	}
	.footer_480{
		border:1px solid #ccc;
		padding:5%;
	}
	.footer_480 .f-logo{
		display: block;
      margin: 0 auto;
	}
	.footer {
		margin-top: -10%;
	}
	
	.button_480 {
     background-color: #10a2da;
     color: #fff;
	  padding:5% 0;	
   }
   .button_480:hover {
     background-color: #025296;
   }
	.button_480 a{
	  color: #ffffff;
     display: block;
     text-align: center;
	}
	.adress480 .f-ad{
	  display: block;
	  padding-left: 0;
   }
	.page-id-12 .adress480 .f-ad, .page-id-12 .adress480 .f-ad, .page-id-8 .adress480 .f-ad, .page-id-10 .adress480 .f-ad, .page-id-17 .adress480 .f-ad, .single .adress480 .f-ad,  .category .adress480 .f-ad{
	  font-size:18px;
 }

  .adress480 .f-list{
    display: block;
	  width: 100%;
  }
	.adress480 .f-list1{
    display: block;
	  width: 100%;
  }
	.adress480 .f-list3{
    display: block;
	  width: 100%;
  }
/************************************
** 会社概要(レシポンシブ)
************************************/
	.misaki_pages{
	  width:100%;
  }	
	
/************************************
** SDGs(レシポンシブ)
************************************/	
	.sdgs_all .sdgs_ul li img{
	  width:30%;
  }
/************************************
** 健康経営(480)
************************************/		
	.kenk_img img{
		width:100%;
	}
	
/************************************
** 会社実績(480)
************************************/
  .jisseki_hyousyou img{
	  width:100%;
  }
	.misaki_pages .button{
		width:80%;
		margin:0 auto;
	}
	.misaki_pages .buttons{
		width:80%;
		margin:0 auto;
		padding:0
	}
/************************************
** カテゴリー一覧(480)
************************************/	
	.category #navi .navi-in > .menu-mobile {
    margin-top: 0;
}
	/************************************
** 社内専用(480)
************************************/	
.page-id-642 .search-edit, input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea,
select {
  width: 100%;
}
	
	.page-id-642 input[type='submit'],
#bbp_reply_submit,
.bp-login-widget-register-link a {
  width: 30%;
}
	
	
}
/*414px以下*/
@media screen and (max-width: 414px){
	 /*必要ならばここにコードを書く*/
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	.tel_sp{
      top: -196px;
	}
}

/*384px以下*/
@media screen and (max-width: 384px){
	 /*必要ならばここにコードを書く*/
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	.tel_sp{
      top: -224px;
	}
}

/*375px以下*/
@media screen and (max-width: 375px){
	 /*必要ならばここにコードを書く*/
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	.tel_sp{
      top: -189px;
	}
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	.single #navi .navi-in > .menu-mobile {
    margin-top: ;
   }
	.single .tel_sp{
      top: -189px;
	}
	
}

/*320px以下*/
@media screen and (max-width: 320px){
	 /*必要ならばここにコードを書く*/
	#navi .navi-in > .menu-mobile {
    margin-top: 0px;
   }
	.tel_sp{
      top: -180px;
	}
	.single #navi .navi-in > .menu-mobile {
    margin-top: 30px;
   }
	.single .tel_sp{
      top: -180px;
	}
}