/*
Theme Name: habakiri-child
Theme URI: http://2inc.org ( テーマのURL )
Description: Habakiri の子テーマです ( テーマの説明 )
Author: Takashi Kitajima ( 作者名 )
Author URI: http://2inc.org ( 作者のURL )
Version: 1.0.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: habakiri
*/

*{
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", sans-serif;
}

/*---------- ヘッダーエリア　ここから ----------*/
#header{
  border-top:solid 5px #339d5b;
}
/*サイト名の上paddingを消す*/
.header--2row .site-branding,
.header--center .site-branding{
  padding-top:0px;
  padding-top:20px;
  padding-bottom:20px !important;
}
.site-branding{
	padding:10px 0px !important;
}

/*ヘッダー右上にミニメニューを表示*/
#header .navi1{
}
#header .info_area{
  display:block;
  position:absolute;
  top:0px;
}
#header .sp_info_area{
display:table-cell;
text-align:center;
}
/*ヘッダー右上に文字サイズを表示*/
#header .font_size li{
  list-style:none;
  border-radius: 0px 0px 6px 6px;
  background-color:#339d5b;
}
#header .font_size li.title{
  padding:5px;
  color:#fff;
  border-radius:0px;
}
#header .font_size li a,
#header .font_size li.active a:hover{
  color:#ffffff;
}
#header .font_size li a:hover{
  border-radius: 0px 0px 6px 6px;
  color:#339d5b;
}
#header .font_size li.active a{
  background-color:#0d702a;
}

/*ヘッダー右上に住所TEL表示*/
#header .info_area .tel_area{
  font-size: 1.5em;
  padding-top:5px;
}
#header .info_area .tel_area .tell,
#header .info_area .tel_area i{
  color:#339d5b;
}
#header .info_area .tel_area .t_small{
  font-size:0.6em;
  line-height:1.2em !important;
  display:block;
}
/*スマホ時の表示*/
/*@media screen and (max-width: 767px) {
	.entry{
	margin-top:0px !important;	
	}
}*/

/*---------- ヘッダーエリア　ここまで ----------*/

/*---------- 固定ページヘッダーエリア　ここから ----------*/
.page-header{
  /*padding-bottom:64px !important;*/
 padding:0px;
 margin:0px 0px 23px;
}
.page-header h1{
  color:#339d5b;
}
.page_cover{
  width:100%;
  height:100%;
  background:rgba(255,255,255,0.6);
  padding-top: 64px;
  padding-bottom:64px;
}

/*---------- 固定ページヘッダーエリア　ここまで ----------*/

/*---------- ヘッダーメニュー　ここから ----------*/
/*メニュー均等割り*/
@media screen and (min-width: 768px) {
  header .menu li {
    /*border-left: 1px solid #ccc;*/
    border-right: 1px solid #ccc;
    /*width: 20%;*/
	  /*6こ以上のとき*/
	  width: 16.667%;
  }
  header .menu:first-child{
    border-left: 1px solid #ccc;
  }
  header .menu li ul{
    width:100%;
  }
  header .menu li .sub-menu li {
    width:100%;
  }
}
.responsive-nav .sub-menu a{
    /*background-color:#ffffff !important;*/
}
.responsive-nav a{
  font-size:1.4rem !important;
}
/*メニューを含めたヘッダーの背景*/
.header--fixed, .header.header--fixed--is_scrolled{
  /*background-color: rgba(255,255,255,0.8) !important;*/
}
/*メニューエリアのみの背景*/
.responsive-nav, .header--transparency.header--fixed--is_scrolled .responsive-nav{
  /*background-color: rgba(255,255,255,0.8) !important;*/
}
.responsive-nav .menu > .menu-item > a,
.responsive-nav .menu > .menu-item-has-children > a{
  border-bottom:5px solid #ffffff;

}

.responsive-nav .menu > .menu-item > a:hover,
.responsive-nav .menu > .menu-item > a:active,
.responsive-nav .menu > .current-menu-item > a,
.responsive-nav .menu > .current-menu-ancestor > a,
.responsive-nav .menu > .current-menu-parent > a,
.responsive-nav .menu > .current_page_item > a,
.responsive-nav .menu > .current_page_parent > a,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .menu-item > a:hover,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .menu-item > a:active,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .current-menu-item > a,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .current-menu-ancestor > a,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .current-menu-parent > a,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .current_page_item > a,
.header--transparency.header--fixed--is_scrolled .responsive-nav .menu > .current_page_parent > a{
  border-bottom:5px solid #339d5b;
}

.responsive-nav .menu>.menu-item>a,
.header--transparency.header--fixed--is_scrolled.responsive-nav .menu>.menu-item>a{
    padding-top:3px !important;
	padding-bottom:3px !important;
	/*ここから下はメニューが６件よりおおいとき*/
	padding-left:5px !important;
	padding-right:5px !important;
}
/*サブメニューが出たときのメニューズレを治す*/
header .responsive-nav .menu>.menu-item>a:hover,
header .responsive-nav .menu>.menu-item>a:active{
	margin-bottom:0px;
}
header ul.sub-menu:hover{
	margin-top:5px;
}
header li.current-menu-item ul.sub-menu:hover,
header li.current-menu-parent ul.sub-menu:hover{
	margin-top:0px;
}
header li.menu-item-has-children ul.sub-menu:hover{
	margin-top:0px;
}

header ul.sub-menu ul.sub-menu:hover{
	margin-top:0px;
}
.off-canvas-nav--dark ul.sub-menu:hover{
	margin-top:0px;
}

/*６このサブメニュー表示位置調整*/
.responsive-nav ul li ul li ul{
	left:100% !important;
}
/*---------- ヘッダーメニュー　ここまで ----------*/



/*---------- ボックスメニュー　ここから ----------*/
/*ボックスメニューの外側*/
.box_menu_outer{
  background-color:#339d5b;
}
/*ボックスメニューの内側*/
.box_menu_inner{
  background-color:#339d5b;
}
/*ボックスメニューのリンクタグを最大に*/
.box_menu a{
  /*display:block;*/
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding: 20px 0px 20px;
  
  position:relative;
  width:100%;
  height:100%;
  border-left: 1px solid #fff;
  /*border-right: 1px solid #fff;*/
  background-color:#339d5b;
  color:#ffffff;
  text-decoration:none;

}
.box_menu_r a{
  border-right: 1px solid #fff;
}
.box_menu a:hover{
  background-color:#ffffff;
  color:#339d5b;
}
.box_menu a:active{
  color:#ffffff;
}
/*ボックスメニューのガターをなくす*/
.box_menu_inner .col-md-3{
  padding-right:0px;
  padding-left:0px;
}

/*４つ表示になった時のボーダー*/
@media screen and ( max-width:991px){
.box_menu a{
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
}
/*---------- ボックスメニュー　ここまで ----------*/



/*---------- スライダー上のコンテンツの設定 ----------*/
.habakiri-slider{
  display:block;
  
  /*position:absolute;*/
}
/*スライダー上のコンテンツ*/
.slider_content{
  display:block;
  position:absolute;
  z-index:1;
  background:transparent;
  
  width:100%;
  top:129px;/*152.2 132.2px*/
}
.habakiri-slider, .habakiri-slider__item{
	height:360px !important;
}
.slider_content .inner_content{
  background-color:rgba(255,255,255,0.8);
  min-height:360px; /* PC */
	height:auto;
  /*display:flex;
  justify-content: center;*/
  padding:0px;
}
.inner_content h3{
  background-color:#339d5b;
  padding:10px;
  margin:0px;
  color:#ffffff;
  text-align:center;
}
.inner_content h4{
  color:#339d5b;
  font-weight:bold;
}
.slider_content .inner_content .info_area{
  padding: 0px 20px;
}
/*タブレット時の表示*/
@media screen and (min-width:768px) and ( max-width:991px){
  .slider_content{
    top:95px;/*70.8*/
  }
}
/*スマホ時の表示*/
@media screen and (max-width: 767px){
  .slider_content{
    width:100%;

  }
  .slider_content .inner_content{
    display:block;
    position:static;
    margin-top:318.2px;/*338.2*/
    width:100%;
  }
  .home .entry{
    margin-top:400px;
  }
}
.habakiri-slider__arrow{
	z-index:2;
}

/*---------- スライダー上コンテンツ　ここまで ----------*/



/*---------- お知らせエリア　ここから ----------*/
/*お知らせエリア*/
.box_news{
  /*border:1px solid #aaa;*/
  margin-top:5rem;
  /*margin-bottom:5rem;*/
}
/*タイトル二色の下線*/
.box_news h2{
  border-bottom:2px solid #aaaaaa;
  position:relative;
  margin:0px;
}
.box_news h2:after{
  position:absolute;
  content:"";
  display:block;
  border-bottom:2px solid #339d5b;
  bottom:-2px;
  width:20%;
}

/*お知らせ一件*/
.box_list{
 /*border-bottom:1px solid #aaaaaa;*/
}
.box_list a{
 display:block;
 position:relative;
 width:100%;
 height:100%;
 text-decoration:none;
 color:#383838;
  padding:1.5rem;
 border-bottom:1px solid #aaaaaa;
}
.box_list a:hover{
 transition: all .3s;
 background-color:#eff5fa;
}
/*お知らせアイコン*/
.label-primary{
 background-color:#F26964;
}
.label-news{
  background-color:#16A6B6;
}
.label-success{
	background-color:#0E7AC4;
}


/*---------- お知らせエリア　ここまで ----------*/


/*---------- ピックアップコンテンツ　ここから ----------*/
.box_pickup{
  margin-top:5rem;
  margin-bottom:1rem;
}
/*タイトル二色の下線*/
.box_pickup h2{
  border-bottom:2px solid #aaaaaa;
  position:relative;
  margin:0px;
  margin-bottom:3rem;
}
.box_pickup h2:after{
  position:absolute;
  content:"";
  display:block;
  border-bottom:2px solid #339d5b;
  bottom:-2px;
  width:20%;
}

.card{
  position:relative;
  display:block;
  height:150px;
  width:100%;
}
.card_mask{
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.card_mask:hover{
  background: rgba(255,255,255,0.5);

}
.card_label{
  position:absolute;
  background: rgba(0,0,0,0.6);
  width:100%;
  padding:3px 0;
  color:#ffffff;
  bottom:10px;
  text-align:center;
}
.card_text{
 
}
.pickup{
  /*background-image:url(./images/pickup1.jpg);*/
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup1{
  background-image:url(./images/pickup1.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup2{
  background-image:url(./images/pickup2.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup3{
  background-image:url(./images/pickup3.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup4{
  background-image:url(./images/pickup4.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup5{
  background-image:url(./images/pickup5.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup6{
  background-image:url(./images/pickup6.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup7{
  background-image:url(./images/pickup7.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
.pickup8{
  background-image:url(./images/pickup8.jpg);
  background-size: cover;
  border-radius:6px;
  margin-bottom:20px;
}
/*---------- ピックアップコンテンツ　ここまで ----------*/


/*---------- アイコンバナー　ここから ----------*/
/*アイコンバナーエリア*/
.box_bana{
 background-color:#ECEEF1;
 padding-top:30px;
 padding-bottom:30px;
  margin-top:5rem;
/*  margin-bottom:5rem;*/
}
.box_bana a{
 display:block;
 position:relative;
 width:100%;
 height:100%;
 text-decoration:none;
}

.box_bana .bana{
  background-size:cover;
  height:80px;
  display:flex;
  align-items: center;
  margin-bottom:1em;
  margin-top:1em;
}
.box_bana span{
  background-color:rgba(255,255,255,0.7);
  display:block;
  width:100%;
  text-align:center;
}
/*リンクホバーで背景画像だけアニメーションで透過*/
.bg_mask{
  height:100%;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.bg_mask:hover{
  background: rgba(255,255,255,0.5);

}
/* テーマのimagesフォルダを見に行く */
.box_bana .bana1{
  background-image:url(./images/bana1.jpg);
  background-size: cover;
}
.box_bana .bana2{
  background-image:url(./images/bana2.jpg);
  background-size: cover;
}
.box_bana .bana3{
  background-image:url(./images/bana3.jpg);
  background-size: cover;
}
.box_bana .bana4{
  background-image:url(./images/bana4.jpg);
  background-size: cover;
}
.box_bana .bana5{
  background-image:url(./images/bana5.png);
  background-size: cover;
}
.box_bana .bana6{
  background-image:url(./images/bana6.png);
  background-size: cover;
}
.box_bana .bana7{
  background-image:url(./images/bana7.png);
  background-size: cover;
}
.box_bana .bana8{
  background-image:url(./images/bana8.png);
  background-size: cover;
}
/*---------- アイコンバナー　ここまで ----------*/



/*---------- フッター　ここから ----------*/
/* footer content */
.footer_content{
	background: #ECEEF1;
	padding-top:2rem;
	padding-bottom:2rem;
}
.footer_content .link a{
	background:#ffffff;
	border:1px solid #ECEEF1;
	display:flex;
	width:100%;
	height:100%;
	min-height:80px;
	text-decoration:none;
	align-items:center;
	text-align:center;
	align-self:stretch;
	justify-content: center;
	flex:1 1 auto;
}
.footer_content .link{
	display:flex; 
}

.footer-widget-area, .footer-widget-area .widget_calendar #wp-calendar caption{
  background-color:#0d702a;
  color:#eff5fa !important;
}
.footer-widget-area a{
  color:#eff5fa !important;
}

/*フッターに新規追加したウィジェットエリアのメニュー表示*/
.footer-menu-area{
  background-color:#0d702a;
  text-align:right;
}
.footer-menu-widget ul{
	margin-top: 1em;
	margin-bottom:1em;
}
.footer-menu-widget li{
	display:inline-block;
	margin-left:1em;
}
.footer-menu-widget a{
	color:#ffffff;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.footer-menu-widget a::before{
 font-family: "FontAwesome";
 content: "\f138";
	padding:4px 0;
	margin-right:10px;

  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}
.footer-menu-widget a:hover{
  color: rgba(255,255,255,0.6);
}
.copyright{
  background-color:#339d5b;
  color:#ffffff;
}
/*---------- フッター　ここまで ----------*/

/*---------- ナビゲーションメニュー　ここから ----------*/
.sidebar-widget.widget_nav_menu li{
	border-bottom: 1px solid #dddddd;
}
.sidebar-widget.widget_nav_menu li a::after {
 font-family: "FontAwesome";
 content: "\f0a9";
 position:absolute;
	right:20px;
	padding:4px 0;

  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}
/*---------- ナビゲーションメニュー　ここから ----------*/

/*---------- 共通　ここから ----------*/
h2{
  border-bottom:2px solid #aaaaaa;
  position:relative;
  /*margin:0px;*/
  color:#339d5b;
}
h2:after{
  position:absolute;
  content:"";
  display:block;
  border-bottom:2px solid #339d5b;
  bottom:-2px;
  width:20%;
}
#main h2{
font-size:2.4rem;
margin-bottom:20px;
}
#main h3{
font-size:2.2rem;
}

/*tableデザイン*/
.table th,.table td{
  padding:5px;
	border-top:inherit;
}
.table-bordered td,
.table-bordered th{
	border:1px solid #aaaaaa !important;
}
/*table スマホ時スクロール*/
.scroll{
overflow: auto;　　　　/*tableをスクロールさせる*/
white-space: nowrap;　　/*tableのセル内にある文字の折り返しを禁止*/
}
.scroll::-webkit-scrollbar{　　/*tableにスクロールバーを追加*/
 height: 5px;
}
.scroll::-webkit-scrollbar-track{　　/*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {　　/*tableにスクロールバーを追加*/
 background: #BCBCBC;
}
/*color:#383838*/
.pm0{
  padding:0px;
  margin:0px;
}
.bd0,
.table .bd0 td{
  border:0px;
}
}
a:hover{
  text-decoration:none;
}
.t_red{
  color:#EB2142 !important;
}
.t_pink{
  color:#F27398 !important;
}
.t_blue{
  color:#337AB7 !important;
}
.must{
	color:#ff0000;
	font-weight:bold;
}
.w100{
  width:100%;
}
/*flexの設定*/
.flex{
  display:flex;
}
.flex_y{
  flex-direction:column;
}
.flex_middle{
  align-items:center;
}
.flex_c{
  justify-content:center;
}
.flex_streach{
  flex-grow:1;
}
.w100{
  width:100%;
}
h3,h4,h5,h6{
font-weight:bold;
}
h3{
margin-top:11.5px;
}

.in_link{
  background-color:#339d5b;
  border-radius:3px;
  border:1px solid #339d5b;
  color:#ffffff;
	padding:5px;
/*	display:block;*/
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  text-align:center;
}
.in_link:hover{
  background: rgba(255,255,255,0.5);
	border:1px solid #339d5b;
}
/*リンクの右矢印アイコン*/
.arrow_r::after{
 font-family: "FontAwesome";
 content: "\f0a9";
	padding:4px 0;
	margin-left:10px;

  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}
/*リンクの外部リンクアイコン*/
.link_out::after{
 font-family: "FontAwesome";
 content: "\f35d";
	padding:4px 0;
	margin-left:10px;

  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}
/*（１）のリスト*/
ul.list_num{
list-style-type:none;
}
.list_num li{
}
.list_num span{
margin-left:-25px;
}
.mapdiv{position: relative;width: 100%;padding-top: 75%;}
.mapdiv iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
/*---------- 共通　ここまで ----------*/

/*---------- 可変フォントサイズ調節　ここから ----------*/
/*.page-header__title{
  font-size:2em;
}*/
.footer-widget-area{
  font-size:0.8em;
}
/*---------- 可変フォントサイズ調節　ここまで ----------*/

/*印刷対応*/
/*ヘッダー右上に文字サイズを表示*/
@media print{
	#header .font_size{
		display:none;
	}
}
@media print and (min-width: 992px){
	.container{
		width:950px;
	}
}
@media print and (min-width: 768px){
	.container{
		width:100%;
	}
}
@media print{
	.container{
		width:auto;
	}
	/*print時に通常のナビゲーションを表示させる*/
	.responsive-nav{
		display:block !important;
		text-align: center !important;
	}
	.responsive-nav > ul > li, .responsive-nav > * > ul > li{
		display:inline-block !important;
		float:none !important;
	}
	.responsive-nav ul{
		text-align:center !important;
	}
}