@charset "UTF-8";
/* Scss Document */
/* Shitrota Setting */
/* 色 */
/* キービジュアル */
/* *** *** *** *** *** *** *** *** */
.key-visual { position: relative; display: block; height: 520px; min-height: 520px; width: 100%; text-align: center; /* background-image: url("../../service/images/public/kv.jpg");*/ /* キービジュアルのイメージは各ページで設定 */ background-position: 50% 50%; background-size: cover; }

.key-visual h1 { display: inline-block; position: absolute; /*top: calc( (100% - 100px) / 2 + 1.5rem );*/ top: calc(50% + 1.5rem); left: 0; right: 0; margin: 0 auto; color: #fff; font-size: 3rem; -webkit-filter: drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.6)); filter: drop-shadow(0px 1px 6px rgba(0, 0, 0, 0.6)); }

@media (max-width: 767.98px) { .key-visual h1 { top: 50%; } }

/* 施工事例のナビ（カテゴリー表示） */
.nav-pills { margin: 1rem .5rem; }

.nav-pills li { font-size: 0.75rem; min-width: 20%; }

.nav-pills li.nav-item { -webkit-box-flex: inherit; -ms-flex: inherit; flex: inherit; -ms-flex-preferred-size: 20%; flex-basis: 20%; margin-bottom: 0.5rem; text-align: center; }

.nav-pills .nav-link { background-color: #f4f4f4; margin: 0 2px; padding: .5rem 0; height: 100%; }

.nav-pills .nav-link.active { background-color: #70bd8a; }

.nav-pills .nav-link.disabled { color: #ccc; }

@media (max-width: 767.98px) { .nav-pills li.nav-item { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; } }

/* 施工事例写真のリスト */
.list-portfolio a { display: block; position: relative; padding: 10px; color: #333; }

.list-portfolio a:hover { color: #333; -webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2); -webkit-transition: 0.5s ease; transition: 0.5s ease; }

.list-portfolio a:hover img { opacity: .6; -webkit-transition: 0.5s ease; transition: 0.5s ease; }

.list-portfolio a::after { position: absolute; top: 15px; right: 15px; content: ''; width: 32px; height: 32px; background-image: url("../../shared/images/icon-zoom.png"); background-size: cover; }

.list-portfolio h4 { border-left: 3px solid #70bd8a; padding-left: 7px; margin: 10px auto; font-size: 1.25rem; }

.list-portfolio .date { margin-bottom: 5px; color: #999; font-size: 0.875rem; }

/* ページナビ */
.pagenavi { margin-top: 3rem; }

.page-item.active .page-link { background: #70bd8a; border-color: #70bd8a; }

.page-link { color: #70bd8a; }

.page-link:hover { color: #70bd8a; }

.page-item.disabled .page-link { color: #ccc; }
/*# sourceMappingURL=service.css.map */