@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/


/************************************
** 固定ページ
************************************/
.page .inner{
	width:1000px;
	margin:0 auto;
	/*margin:0 15%;*/
}

/*----日付を非表示　-----*/
.post-6 .date-tags,
.post-22 .date-tags{
display: none;
}
/************************************
** TOP
************************************/
.morelink {text-align:center; margin:70px 0;}
.morelink a,
.morelink input {
    transition:all 0.2s ease-in;
    background-color:#fff;
    display:inline-block; border:1px solid #000; text-decoration:none;
    min-width:300px; height:58px; line-height:58px; font-size:16px; cursor:pointer;
  }
  .morelink a:hover,
  .morelink input:hover {background-color:#2e3132; color:#fff;}


.sec02 {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    display: block;
    background-color: #fbfaf8;
	padding-top:50px;
padding-bottom:50px;
}



/************************************
** header
************************************/
.article-header{ position:relative; margin-bottom:50px;}

.page-id-30 .article-header{ background:url('images/ti_about.jpg') left center no-repeat; width:100%; height:200px;}
.page-id-22 .article-header{ background:url('images/ti_staff.jpg') left center no-repeat; width:100%; height:200px;}
.page-id-77 .article-header{ background:url('images/ti_company.png') left center no-repeat; width:100%; height:200px;}
.page-id-87 .article-header{ background:url('images/ti_menu.jpg') left center no-repeat; width:100%; height:200px;}



.article-header h1{ color:#666; text-align:center; font-size:2em; font-family: YuGothic,'Yu Gothic',YuGothic,'Yu Gothic',sans-serif;}
.page .article-header h1{ position:absolute; top:30%; left:50%;}

/************************************
** clearfix
************************************/
.clearfix:after {
  content: "";
  display: block;
  clear: both;
} 
.clearfix:before {
  content: "";
  display: block;
  clear: both;
} 
.clearfix {
  display: block;
}

/************************************
** googlemap
************************************/
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/************************************
** 共通
************************************/
section{ margin-bottom:0!important;}

/*投稿日を非表示にする*/
.page .post-date {
  display: none;
}

/*更新日を非表示にする*/
.page .post-update{
  display: none;
}

.entry-card-meta, .related-entry-card-meta{ padding-bottom:10px;}

img.aligncenter {
display:block;
margin:5px auto 30px auto;
text-align:center;
}

img.alignright{ margin:5px 0 30px 30px;}
img.alignleft{ margin:5px 30px 30px 0;}

img a:hover{ opacity:0.5;}
a:hover img{ opacity:0.5;}


.alignright{ float:right; }
.alignleft{ float:left; }

.pc-img{ display:inline!important;}
.tab-img { display:none!important;}
.smt-img { display:none!important;}

/************************************
** Font
************************************/
.fss{font-size:60%;}
.fs{font-size:80%;}
.fm{font-size:120%;}
.fl{font-size:140%;}
.fll{font-size:180%;}
.fbig{ font-size:200%;}



.center{ text-align:center!important;}
.right{ text-align:right!important;}
.left{ text-align:left!important;}
/************************************
** margin / padding
************************************/
.mt10{ margin-top:10px;}
.mt30{ margin-top:30px;}

.mb0{ margin-bottom:0px!important;}
.mb15{ margin-bottom:15px;}
.mb30{ margin-bottom:30px!important;}
.mb50{ margin-bottom:50px!important;}

.mr0{margin-right:0!important;}
.mr10{margin-right:10px!important;}

/************************************
** Tittle
************************************/

.category-blog-post .entry-title,
.category-news-post .entry-title{
  border-top: 2px solid #949494;/*上線*/
  border-bottom: 2px solid #949494;/*下線*/
  color: #323232;
  padding: .5em 0;
}

/************************************
** 投稿ページ
************************************/
.eye-catch-wrap{
	display: block;
    float: left;
    margin-right:10px;	
}
.eye-catch img{}

/*******************************
* カテゴリページ
********************************/
.entry-card-wrap { margin-bottom:10px;}
.entry-card{
	padding-left:0!important;
	padding-bottom:20px;
	margin-bottom:10px;
    background: url(images/line-dotte.png) left 0px bottom repeat-x;
}

.post h2.entry-card-title,
.post h2.related-entry-card-title{
  position: relative;
  padding: 0.5em;
	margin-bottom:30px;
}
.post h2.entry-card-title::before,
.post h2.related-entry-card-title::before,
.post h2.entry-card-title::after,
.post h2.related-entry-card-title::after {
	content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
}
.post h2.entry-card-title::before,
.post h2.related-entry-card-title::before {
  width: 20%;
  background-color: #c2c2c2;
}
.post h2.entry-card-title::after,
.post h2.related-entry-card-title::after{
  width: 80%;
  background-color: #c0a6e0;
  left: 20%;
}


/*1023px以下*/
@media screen and (max-width: 1023px){

/************************************
** 固定ページ
************************************/
.page .inner{
	width:100%;
	margin:0 auto;
}
	
/************************************
** header
************************************/
.article-header{ position:relative; margin-bottom:50px; background-size:cover;}

.page-id-30 .article-header{ background:url('images/ti_about.jpg') left center no-repeat; width:100%; height:100px;}
.page-id-22 .article-header{ background:url('images/ti_staff.jpg') left center no-repeat; width:100%; height:100px;}
.page-id-77 .article-header{ background:url('images/ti_company.png') center center no-repeat; width:100%; height:100px;}
.page-id-87 .article-header{ background:url('images/ti_menu.jpg') left center no-repeat; width:100%; height:100px;}
/*.article-header h1{ position:absolute; top:10%; left:10%; color:#fff}	*/
	

/*ヘッダーボタンエリア　*/	
.logo-menu-button img{ position:absolute; left:10px; top:10px;}	
.navi-menu-button{ margin-top:10px!important;}

.h-submenu {
width: 80px;
text-align:right;
margin-top:5px!important;
margin-left: 0px !important;
 padding:0 0 0 5px !important;
}	

.ti01{ display:block;}
	
.smt-img{ display:inline!important;}
#main-image .smt-img{display:none !important;}
.tab-img{ display:none !important;}
#main-image .tab-img{display:inline !important;}	
.h-submenu .smt-img {display:inline!important;}
.category-page-content li.listred{ width:45%; margin:0 auto; }	

	
}
/*840px以下*/
@media screen and (max-width: 844px){
/************************************
** 			header
************************************/
.header-container-in{ display:none;}
.mobile-menu-buttons{background-color:#fff;}	
.mobile-menu-buttons .menu-button{ top:-10px;}	

/*ヘッダーボタンエリア　*/
.h-submenu{ margin-top:0; margin-left:0px!important;padding:0!important;}
.h-submenu li.m-tel{ margin:0px 0px 0 5px!important;color:#fff;}
.h-submenu li.m-contact{ margin:0px 0px 0 5px!important;color:#fff;}
.mobile-header-menu-buttons .h-submenu li{ display:inline-block;width:45%;}

/************************************
** 	
************************************/

	h1.entry-title{font-size:1.4em;}	
.eye-catch-wrap {
    display: block;
    float: none;
    margin-left: 0px;
	text-align:center;
}
}

@media screen and (max-width: 844px) {
  /* ロゴが収まる高さを確保 */
  .mobile-header-menu-buttons {
    min-height: 60px;
    align-items: center;
  }

  /* ロゴの位置を調整 */
  .mobile-header-menu-buttons .logo-menu-button {
    position: relative;
    top: 0;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 0 0 10px;
    box-sizing: border-box;
  }

  /* 下の文字も含めて拡大 */
  .mobile-header-menu-buttons .logo-menu-button img {
    position: static;
    display: block;
    height: 48px;
    width: auto;
    max-height: none;
    max-width: 100%;
    object-fit: contain;
  }
}
@media screen and (max-width: 844px) {
  /* ヘッダー全体を上下中央に */
  .mobile-header-menu-buttons {
    display: flex;
    align-items: center;
    min-height: 60px;
  }

  /* 電話とメニューを右側に配置 */
  .mobile-header-menu-buttons .logo-menu-button {
    margin-right: auto;
  }

  /* メニューの位置ずれを解除 */
  .mobile-header-menu-buttons .menu-button {
    top: 0;
  }

  .mobile-header-menu-buttons .navi-menu-button {
    margin-top: 0 !important;
    height: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  /* 電話ボタンの余白と幅を調整 */
  .mobile-header-menu-buttons .h-submenu {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 60px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
  }

  .mobile-header-menu-buttons .h-submenu li.h-tel {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0;
  }

  .mobile-header-menu-buttons .h-tel a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
  }

  /* 電話アイコンを拡大 */
  .mobile-header-menu-buttons .h-tel img {
    display: block !important;
    position: static;
    width: 36px;
    height: auto;
    max-height: none;
    margin: 0;
  }
}