@charset "utf-8";

#map {
  height: 100%;
  width: 95%;
	margin: 0 auto;
}
@media screen and (max-width: 480px) {
#map {
  width: 92%;
	margin: 0 auto;
}
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

/*================================
 汎用
================================*/
.flex01 {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: stretch;
  align-items: stretch;
}
@media screen and (max-width: 767px) {
.flex01 {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
}
.flex02 {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: stretch;
  align-items: stretch;
}

.flex03 {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-align-items: stretch;
  align-items: stretch;
}
@media screen and (max-width: 767px) {
.flex03{
    -webkit-justify-content: space-between;
  justify-content: space-between;
}
}

.fwb {
	font-weight: bold;
}
.fw500 {
	font-weight: 500;
}

/*蛍光ペン的なやつ*/
.underline{
  background: linear-gradient(transparent 55%, #ffe0c2 55%);
}

/*テキスト省略*/
.ellipsis {
  position: relative;
  overflow: hidden;
  line-height: 20px;
  height:2.8em;
}
.ellipsis:before, .ellipsis:after {
  position: absolute;
  background: #fff;
}
.ellipsis:before {
  content: "･･･";
  bottom: 0;
  right: 0;
  padding:0 7px;
}
.ellipsis:after {
  content: "";
  width: 100%;
  height: 100%;
}

/*================================
 検索・絞り込み
================================*/
.select_map {
	margin-top: 50px;
}
.select_ttl {
	background: url(../../img/hometech_map/hometech_map_bg.jpg);
	background-size: cover;
	color: #fff;
	padding: 20px 2%;
	max-width: 340px;
	width: 100%;
	flex-basis: 33%;
}
@media screen and (max-width: 767px) {
.select_ttl {
	flex-basis: 100%;
	text-align: center;
	max-width: 100%;
	margin-bottom: 25px;
}
}
.select_ttl01 {
	font-size: 1.8rem;
	letter-spacing: 0.05rem;
	line-height: 1.6;
	padding-top: 14px;
	border-top: 1px solid #b5b5b5;
}
@media screen and (max-width: 767px) {
.select_ttl01 {
	text-align: center;
}
}
.select_ttl02 {
	font-size: 4.8rem;
	letter-spacing: 0.1rem;
	line-height: 1.2;
	padding-bottom: 10px;
	border-bottom: 1px solid #b5b5b5;
}
@media screen and (max-width: 767px) {
.select_ttl02 {
	font-size: 2.8rem;
}
}
.select_search {
	flex-basis: 66%;
}
@media screen and (max-width: 767px) {
.select_search {
	flex-basis: 100%;
}
}
.select_txt01 {
	font-weight: bold;
	font-size: 1.8rem;
	line-height: 2.2;
	display: inline;
}
.select_txt02 {
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1.8;
	letter-spacing: 0.05rem;
	margin: 20px 0 10px;
}
.select_search_input {
	flex-basis: 73%;
	font-size: 1.6rem;
	border: 1px solid #565656;
	border-radius: 5px;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	padding: 0 1.6rem;
}
@media screen and (max-width:480px) {
.select_search_input {
	flex-basis: 100%;
	line-height: 40px;
	margin-bottom: 10px;
}
}
@media screen and (max-width:640px) {
::-webkit-input-placeholder{
  font-size: 14px;
}
::-moz-placeholder {
  font-size: 14px;
}
:-ms-input-placeholder {
  font-size: 14px;
}
}
.select_search_icon {
	flex-basis: 26%;
}
@media screen and (max-width:480px) {
.select_search_icon {
	flex-basis: 100%;
}
}
.select_search_icon input[type=button] {
	line-height: 40px;
	font-size: 1.6rem;
	border: 1px solid #005c3f;
	border-radius: 5px;
	background-color: #005c3f;
	color: #fff;
	letter-spacing: 0.2rem;
	font-weight: bold;
	font-family: "FontAwesome", "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	width: 100%;
	transition:0.3s all;
}
@media screen and (max-width:480px) {
.select_search_icon input[type=button] {
	line-height: 30px;
	max-width: 150px;
	margin: 0 auto;
	display: block;
}
}
.select_search_icon input[type=button]:hover {
	background-color: rgba(0,92,63,0.3);
	color: #005c3f;
	cursor: pointer;
}


/*店舗選択*/
.select_category{
  position: relative;
  margin:30px auto 60px;
}
.select_category_inner{
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: stretch;
	align-items: stretch;
}
.select_category .select_category_txt{
  font-size: 14px;
  margin-bottom: 10px;
	font-weight: 500;
	letter-spacing: 0.05rem;
}
.select_category ul li {
	flex-basis: 16.66666%;
}
@media screen and (max-width: 960px) {
.select_category ul li {
	flex-basis: 25%;
}
}
@media screen and (max-width: 767px) {
.select_category ul li {
	flex-basis: 33.3333%;
}
}
@media screen and (max-width: 480px) {
.select_category ul li {
	flex-basis: 50%;
}
}
.select_category ul li a{
  display: block;
  text-align: center;
  margin-right:7%;
  transition:.5s all;
  margin-bottom: 10px;
	line-height: 40px;
	border: 1px solid #ff9934;
	letter-spacing: 0.2rem;
	font-weight: bold;
}
@media screen and (max-width: 1140px) {
.select_category ul li a{
  font-size: 14px;
}
}
.select_category ul li a:hover{
	background-color: #ff9934;
	color: #fff;
}
.select_category ul li a .fas{
	margin-left: 1rem;
}

@media screen and (max-width: 767px) {
/*  .select_category p{
line-height: 1.4; 
}
  .select_category ul li{
width:49%;
}
.select_category ul li a{
  width:100%;
	font-size: 14px;
}*/
}









/*================================
 記事タイトル
================================*/
.ttl_blog_detail {
  margin: 0 auto 40px;
  padding: 0;
  border-bottom: 1px solid #adadad;
}

.new {
  position: inherit;
}

.blog_newarea {
  -webkit-flex-basis: 6%;
  flex-basis: 6%;
	min-width: 59px;
}

.ttl_blog {
  font-size: 24px;
  line-height: 36px;
  letter-spacing: 0.05em;
  -webkit-flex-basis: 94%;
  flex-basis: 94%;
	padding-left: 1%;
}
.ttl_blog span {
  font-size: 18px;
}

.cms_detail_share {
  margin: 1.4rem auto 0;
  text-align: right;
}

.cms_detail_share .social_btn {
  margin: 0 0 10px;
  padding: 0;
}
@media screen and (max-width:1140px) {
.ttl_blog_detail {
  max-width: 96%;
}
}
@media screen and (max-width:767px) {
.blog_newarea {
  flex-basis: 70px;
  margin-bottom: 20px;
}
.ttl_blog_detail {
  margin-top: 50px;
	max-width: 100%;
}

.ttl_blog {
  flex-basis: 100%;
}
.cms_detail_share .social_btn {
  text-align: right;
}
.cms_detail_share {
  max-width: 1140px;
  margin-top: 30px;
}
}

.ttl_blog_bottom {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: start;
	align-items: start;
}
@media screen and (min-width: 0px) and (max-width:640px) {
.ttl_blog_bottom {
	display: block;
}
}
.detail_author {
	width: 40%;
	line-height: 1.8;
}
.detail_tagdate {
  overflow: hidden;
	width: 58%;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: center;
	align-items: center;
}
@media screen and (min-width: 0px) and (max-width:640px) {
.detail_author {
	width: 100%;
	margin-bottom: 10px;
}
.detail_tagdate {
	width: 100%;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}
}

.detail_tagdate_label {
	display: inline-block;
	padding-bottom: 10px;
}
.blog_tag{
	padding: 0 1% 10px;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}
.blog_tag span{
  min-width:80px;
  text-align: center;
  display: inline-block;
  padding:0 3%;
	background-color: #f1f1f1;
	box-shadow: 1px 1px 0px 1px #d6d6d6;
	line-height: 1.9;
}


/*================================
 現在の実績（ページ下部）
================================*/

.map_work_performance_bar {
	text-align: center;
	margin: 50px auto 120px;
}
.map_work_performance_bar .work_performance_bar {
	position: static;
	z-index: inherit;
	border-radius: 0;
	max-width: 600px;
	min-height: inherit;
	font-size: 22px;
	margin: 0 auto;
	background: #000;
	color: #fff;
	font-weight: normal;
	letter-spacing: 0.3rem;
	text-align: center;
	line-height: 2.2;
}
@media screen and (max-width:640px) {
.map_work_performance_bar .work_performance_bar {
	font-size: 16px;
}
}
.map_work_performance_bar .work_performance_num {
	font-size: 48px;
	display: block;
	line-height: 1.4;
}


/*================================
 一覧に戻る（フッター上）
================================*/

.btn_bottom a {
	font-size: 18px;	
  margin: 40px auto 0 auto;
  display: block;
  width: 300px;
  text-align: center;
  padding: 20px;
  background-color: #fff;
  border: 1px solid #ffa347;
  color: #ffa347;
  transition: .5s all;
  letter-spacing: 0.1em;
}

.btn_bottom a:hover {
  background: #ffa347;
  color: #fff;
}

.btn_bottom a i {
  padding-right: 15px;
}
@media screen and (min-width: 0px) and (max-width:767px) {
  .btn_bottom a {
    width:96%;
    padding:10px;
    line-height: 24px;
  }
}




/*================================
 こちらの施工事例もどうぞご覧ください♪
================================*/
.read_more_works{
 background:#fffaf5;
 padding:30px 0 40px;
 margin:50px auto 0;
}
.more_works_ttl{
 border-bottom:1px solid #ccc;
 margin:0 auto 35px;
	background: transparent;
	border-left: solid 5px #ffa347;
	padding: 5px 20px;
}
.more_works_ttl .ttl_en,
.more_works_ttl .ttl_ja{
 letter-spacing:0.05em;
 font-weight:bold;
}
.more_works_ttl .ttl_en{
 font-family: 'Josefin Sans', sans-serif;
 font-size:3rem;
}
.more_works_ttl .ttl_ja{
 color:#005c3f;
 font-size:1.8rem;
 padding:0 0 0 20px;
}
.more_works_list{
 justify-content: flex-start;
}
.more_works_list li{
 max-width:208px;
 width:100%;
 line-height:1.5;
}
.morelist_ttl{
 height:1em;
}
.more_works_list li .ellipsis:before,
.more_works_list li .ellipsis:after{
 background:#fffaf5;
}
.more_works_list li a{

}
.more_works_list li a:hover .morelist_img{
 opacity:0.5;
}
.morelist_img{
 margin:7px auto;
  transition:.2s;
}
.morelist_img_inner{
 position: relative;
 height: 0;
 overflow: hidden;
 width: 100%;
 padding-top:67.3%;
}
.morelist_img_inner img {
 position: absolute;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 width: 100%;
}
.morelist_data{
 text-align:right;
 font-size:1.4rem;
}
@media screen and (min-width: 1141px) {
.more_works_list li:not(:last-child) {
    margin-right: 1.2%;
}
}
@media screen and (max-width: 1140px) {
.more_works_list{
 flex-wrap:wrap;
}
.more_works_list li{
 max-width:none;
 width:30%;
}
.more_works_list li:first-child,
.more_works_list li:nth-of-type(2){
 width:48%;
 margin:0 0 40px;
}
.more_works_list li:first-child{
 margin-right:4%;
}
.more_works_list li:nth-of-type(3),
.more_works_list li:nth-of-type(4){
 margin-right:5%;
}
}
@media screen and (max-width: 550px) {
.more_works_ttl .ttl_ja{
 display:block;
 padding: 10px 0;
}
}
@media screen and (max-width: 480px) {
.more_works_ttl .ttl_ja{
 font-size:1.6rem;
}
.more_works_list li:nth-of-type(3) .morelist_ttl,
.more_works_list li:nth-of-type(4) .morelist_ttl,
.more_works_list li:nth-of-type(5) .morelist_ttl{
 font-size:1.4rem;
 height: 1.5em;
}
}

#map.shop_map{
    height: 722px;
}
.shop_period{
    width: 95%;
    margin: 10px auto;
    max-width: 1140px;
    text-align: right;
}