@charset "UTF-8";


/*ページ内リンクずれ
---------------------------------------------------------------------------*/
html {
  scroll-padding-top: 200px;
}

/*ページ内リンクずれ
---------------------------------------------------------------------------*/
.br-sp {
    display: none;
}

@media (max-width: 767px) {
    .br-sp {
        display: block;
    }
}

/*footer お問い合わせ
---------------------------------------------------------------------------*/
.section-two-h3 {
text-align:center;
font-size: 30px;
line-height: 1.5;
font-weight: bold;
letter-spacing:.05em;
margin: 10px 0
}
.section-two-h3 span{
font-size: 11px;
  display: block;
  margin-top: 0;
	font-weight: normal;
}


/*hr
---------------------------------------------------------------------------*/
hr {
border-width: 1px 0 0 0; /* 太さ */
border-style: dotted; /* 線種 */
border-color: #3F3F3F; /* 線色 */
height: 1px; /* 高さ */
max-width: 100%;
clear:both;
margin: 15px 0;
}


/*title
---------------------------------------------------------------------------*/
#title {
margin: 0;
width: 100%;
padding: 6% 0;
text-align: left;
}
#title h2 {
font-size: 200%;
line-height: 1.4;
text-align:left;
letter-spacing:1px;
/* 英語先頭大文字s*/
text-transform:capitalize;
/* Googlefont*/
font-family: "Oswald", sans-serif;
font-optical-sizing: auto;
font-style: normal;
font-weight: 500;
color: #fff;
}
p.hurigana {
color: #d3e5ff;
font-size: 10px;
}
.t_other {
background: url(../img/page/t_other.jpg) bottom / cover no-repeat;
}

@media screen and (min-width: 768px) {
#title {
padding: 4% 0;
}
#title h2 {
font-size: 270%;
}}


/*tex
---------------------------------------------------------------------------*/
.tex {
width: 100%;
line-height: 2em;
text-align:justify;
text-justify:inter-ideograph;
overflow: hidden;
padding: 5% 0
}

.tex_archive {
width: 100%;
line-height: 2em;
text-align:justify;
text-justify:inter-ideograph;
overflow: hidden;
padding: 10% 0
}

.tex img {
border: 0;
max-width: 100%;
height: auto;
box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}
.tex p{
margin: 0;
padding: 0;
}
.tex img a {
border: 0;
}
.tex a:hover img {
opacity: 0.6;
transition: 0.5s;
}
.tex a {
text-decoration: underline;
text-decoration-style:  dotted;
text-decoration-color:  #ccc;
}
@media screen and (min-width:768px) {
.tex_archive {
padding: 5% 0
}
}

/* 等分
---------------------------------------------------------------------------*/
.boxA:after	{content: "";
	display: block;
	clear: both}
.box33>div{
    border: 1px solid #003f92;
    padding: 10px;
    box-sizing: border-box;
}
.box33>div img{
    width: 90%;
		margin-top: 10px
}
@media screen and (min-width: 980px) {
.box2	{float: left;
	width: 28%}
.box3	{float: right;
	width: 68%}
.box4	{float: left;
	width: 48%}
.box5	{float: right;
	width: 48%}
		
.box33{
    display: flex;
    flex-wrap: wrap;
}
.box33>div{
    width: calc(100% / 3 - 20px);
    margin: 10px;
}
}	
@media (max-width:979px){
.box2,.box4
{margin-bottom: 5%}
.box33>div{
padding: 20px;
margin-bottom: 5%}
.box33>div img{
    width: 70%;
}}

/* ボックス*/
.box_nuri {
    padding: 1.5em 2em;
    margin: 2em 0;
    background: #ededed;/*背景色*/
}
.box_nuri p,
.box_waku p {
    margin: 0; 
    padding: 0;
}

.box_waku {
    padding: 2em 2em;
    margin: 2em 0;
    border: solid 1px #004098;
}


/*見出し
---------------------------------------------------------------------------*/
h3.midasi {
	color: #333;
	font-weight: normal;
	padding-bottom: 2%;
	font-size: 1.3em;
	margin-bottom: 20px;
	clear: both;
	border-bottom: solid 2px #ededed;
	position: relative;
}
h3.midasi:before {
	position: absolute;
	content: " ";
	display: block;
	border-bottom: solid 2px #004098;
	bottom: -2px;
	width: 20%;
}
h4.midasi {
color: #004098;
font-size: 1.3em;
line-height: 1.6em;
font-weight: normal;
padding: 0 0 20px 0
}
h4.title_name{
padding: 1rem 0;
font-size: 1.4em;
font-weight: normal;
margin:0
}
h5.midasi {
padding: 0.5rem 1rem;
border-left: 3px solid #004098;
font-size: 1.2em;
font-weight: normal;
margin-bottom: 20px;
}

@media screen and (min-width:768px) {
h3.midasi,
h4.midasi {font-size: 1.5em;}
h5.midasi {
font-size: 1.3em;
padding: 0.5rem 2rem;}
}


/* ---------------------------------------------------------------------------------------------

　 table /comにある

--------------------------------------------------------------------------------------------- */
/* 必須マーク */
.must {
background: #004098;
}
/* 任意マーク */
.free {
background: #ededed;
}
.must,
.free {
color: #FFF;
font-size: 10px;
margin-right: 10px;
padding: 5px;
letter-spacing: 0.2em;
}

/* 入力確認のチェックボックスを大きく */
form .wpcf7-acceptance input[type="checkbox"] {
transform: scale(2.0);
margin-right: 0.5em;
}

/* その他 */
table.sonota td:nth-child(1){
background-color:#ededed;
vertical-align: top;
}
table.sonota td {
padding: 8px 0;
margin-bottom: 8px
}

@media screen and (min-width: 768px) {
table.sonota td{
padding: 20px;
}
table.sonota td:nth-child(1){
width:30%;
}
}
@media all and (max-width: 767px) {
table.sonota td {
display: block;
width: 100%;
border: none;
}
table.sonota td:nth-child(1){
padding: 8px;
}
}

/* ------------------------------

　 box

--------------------------------- */
.box_01 {
margin: 2em auto;
padding:2em;/*内側余白*/
background-color:#e5f6f5;/*背景の色*/
}
.box_02 {
margin: 0;
padding: 1em 0 0 0;
color: red;
}

.box_01_title {
    padding: 0 0 .5em 0;
    color: #00a69d;
		font-size: 1.1em;
		font-weight: bold
}

@media screen and (min-width:768px) {
.box_01_title {
    font-size: 1.2em;
}}


/*google-maps
---------------------------------------------------------------------------*/
.google-maps {
position: relative;
padding-bottom: 75%;
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}


/*pagination
---------------------------------------------------------------------------*/
.pagination {
clear: both;
padding: 20px 0;
position: relative;
font-size: 12px;
line-height: 12px;
text-align: center;
margin-bottom:3%
}
.pagination-box {
display: inline-block;
}
.pagination span, .pagination a {
display: block;
float: left;
margin: 2px 2px 2px 0;
padding: 8px 10px 8px 10px;
text-decoration: none;
width: auto;
color: #fff;
background: #c5c5c5;
}
.pagination a:hover {
color: #666;
background: #004098;
}
.pagination .current {
padding: 8px 10px 8px 10px;
background: #004098;
color: #fff;
}
.page_box {
float: left;
width: 100%;
margin-top:20px
}
@media screen and (min-width: 768px) {
.pagination {
font-size: 14px;
line-height: 14px;
}
.pagination span, .pagination a {
padding: 10px 15px 10px 15px;
}
.pagination .current {
padding: 10px 15px 10px 15px;
}
}


/*ギャラリー
---------------------------------------------------------------------------*/
.gallery { /** ギャラリーを囲むボックス **/
width: 100%;
margin-bottom: 20px !important;
overflow: hidden;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

.gallery br {display: none;} 

.gallery-item { /** 画像共通のスタイル **/
float: left;
margin-bottom: 0 !important;
}
.gallery-icon { /** 画像を囲む dt のスタイル **/
text-align: center;
}

.gallery-icon img {
width: 100%;
height: auto;
margin-bottom: 10px !important;
}

.gallery-caption,
.wp-caption-text { /** キャプション **/
color: #222;
font-size: 14px;
margin: 0 0 10px;
text-align: center;
}

.gallery-columns-1 .gallery-item { /** カラムなし **/
width: 100%;
margin-right: 0;
}
.gallery-columns-2 .gallery-item { /** 2カラム **/
width: 48%;
margin: 0 1%;
}
.gallery-columns-3 .gallery-item { /** 3カラム **/
width: 31.33333%;
margin: 0 1%;
}
.gallery-columns-4 .gallery-item { /** 4カラム **/
width: 23%;
margin: 0 1%;
}
.gallery-columns-5 .gallery-item { /** 5カラム **/
width: 18%;
margin: 0 1%;
}

@media (max-width:767px){
/* 640px以下用の記述 */
.gallery-columns-3 .gallery-item{
width: 48%;
margin: 0 1%;
}
.gallery-columns-5 .gallery-item {
width: 31.33333%;
margin: 0 1%;
}
table.mobile-block,
table.mobile-block th,
table.mobile-block td{border:none;}
table.mobile-block th,
table.mobile-block td{width:100%;display:block;}
table.mobile-block th,
table#otoiawase th,
table#otoiawase td{border-bottom:none;}
.release br {display: none;}
}


/*キャプション
---------------------------------------------------------------------------*/
figure {
   background-color: #fff;
   padding: 5px;
   display: table;
   overflow: hidden;
}

figure img {
    width:100%;
max-width: 100%;
height: auto;
}

figcaption {
    display: table-caption;
    caption-side: bottom;
    background: #fff;
}
@media only screen and (max-width:60em) {
figure {
   text-align:center;
   clear:both;
   overflow:hidden;
   padding:0;
   margin:0 auto
}
figure .alignright img,
figure .alignleft img{float:none;}
}


/* ---------------------------------------------------------------------------------------------

　   おしらせ　カテゴリの設定　一覧

--------------------------------------------------------------------------------------------- */
.info_box span{
width:100px;height:auto;float:left;margin:0 10px 5px 0;z-index:9999;
padding: 1px;
text-align: center;
font-size: 75%;
color:#fff;
background: #004098;
line-height: 2em;
}
.info_box:after {    
  content: "";
  display: block;
  clear: both;
}


/* ---------------------------------------------------------------------------------------------

　   おしらせ　カテゴリの設定　中ページ

--------------------------------------------------------------------------------------------- */
.cat_info span{
width:100px;height:auto;float:left;margin:0 10px 5px 0;z-index:9999;
padding: 1px;
text-align: center;
font-size: 75%;
color:#fff;
background: #004098;
line-height: 2em;
}
.cat_info:after {    
  content: "";
  display: block;
  clear: both;
}


/*	arvhive
/* ------------------------------------- */

/* category-news */
.itiran {
margin-top: 10px;
}
.info_box1{
margin-top: 50px;
}
.info_box {
border-bottom: #ededed solid 1px;
margin: 0 0 15px 0;
padding: 0 0 15px 0;
}
.i_date{
color: #3F3F3F;
margin: 0 10px 0 0;
}
.i_text{
margin: 0
}
.i_text a {
color: #444;
text-decoration: none;
display: block;
width: 100%;
}
.i_text a:hover {
color: #3F3F3F;
text-decoration: underline;
}

/* single_news.php */
.entry_news{
margin-top: 5%
}
.i_title{
color: #3F3F3F;
font-size: 150%;
font-weight:	400;
line-height: 150%;
margin: 4% 0 30px 0;
padding: 0;
}
/* footer線 */
.i_text_box{
border-bottom: #ededed solid 1px;
margin: 0 0 30px 0;
padding: 0 0 30px 0;
}

/* single_works.php */
.i_text_box_none{
margin: 10px 0 10px 0;
padding: 10px 0 10px 0;
width: 100%
}
li.widget{
list-style-type: none;
}

@media screen and (min-width:768px) {

/* single_news.php */
.entry_news{
margin-top: 2%
}
.i_title{
font-size: 170%;
line-height: 170%;
margin: 4% 0 30px 0;
}
.i_text_box_none{
width: 750px;
margin: 0 auto
}
}

/* back edit
---------------------------------------------------- */
.i_back{
max-width: 100%;
font-size:80%;
margin:10px 0;
}
.i_back a {
text-decoration: none;
}
.i_back a:visited {
text-decoration: underline;
}
.i_back a:hover {
text-decoration: underline;
}
.edit{
	width:100%;
	font-size:80%;
	clear:both;
}
.toukounone {
	width:100%;
	font-size:80%;
	clear:both;
	height:20px
}

/* ボタン　お知らせ一覧に戻る　single
---------------------------------------------------- */
.back_btn {
margin: 5% 0;
padding: 0;
width:100%;
box-sizing:border-box;
}
.back_btn a{
	margin:0 auto;
}
.back_btn a:after {
  content: "";
  clear: both;
  display: block;
}
a.btn {
  display:block;
  padding: 1em 0;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
	color: #004098;
  border: solid 1px #004098;
}
a.btn:hover{
text-decoration: none;
}
@media screen and (min-width:768px) {
.back_btn a{
	width:250px;
}
}


/* ---------------------------------------------------------------------------------------------

　   Works

--------------------------------------------------------------------------------------------- */
.work_box_list a {
	text-decoration: none;
	color: #333;
}
.en_work,
.works,/* スラッグ */
.works_doboku,
.works_kasen,
.works_saigai,	
.works_kankyo {
	padding: 3px 8px;
	color: #004098;
	border: solid 1px #004098
}

/* --------------------------------

　 施工事例

----------------------------------- */

h4.i_title_s {
	color: #333;
	font-weight: normal;
	padding-bottom: 2%;
	padding-top: 2%;
	font-size: 1.3em;
	margin-bottom: 20px;
	clear: both;
	border-bottom: solid 2px #ededed;
	position: relative;
}
h4.i_title_s:before {
	position: absolute;
	content: " ";
	display: block;
	border-bottom: solid 2px #004098;
	bottom: -2px;
	width: 20%;
}

.catebl {
	padding:0 8px;
	color: #004098;
	border: solid 1px #004098;
}

@media screen and (min-width:768px) {
h4.i_title_s {font-size: 1.5em;}
}
/* --------------------------------

　 施工メニュ横並び

----------------------------------- */
.button-d-box {
    margin-top: 20px;
}
.button-d-box ul{
    display: flex;
    margin: 0;
    padding: 0;
		border-top: 1px solid #ededed;
    border-left: 1px solid #ededed;
}
.button-d-box li{
    display: flex;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    border-bottom: 1px solid #ededed;
    border-right: 1px solid #ededed;
}
.button-d-box a{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    padding: 10px;
		text-decoration:none

}
.button-d-box li:last-child a{
}
.button-d-box li:hover a{
	background:#f2f2f2;
}

.button-d-box a.current {
    background:#f2f2f2;
    pointer-events: none;  /* リンクのhoverを無効に */
    cursor: default;  /* カーソルをデフォルトに */
    }
/* --------------------------------

　 施工　中ページ

----------------------------------- */
.page_sekou_box {
width:100%;
margin: 0 auto
}
.sekou_box dl {
padding: 15px 0;
border-bottom: 1px solid #ccc;
}

.sekou_box dt {
padding-bottom: 5px;
color: #004098
}

@media screen and (min-width: 768px) {
.page_sekou_box {
width: 750px
}
.sekou_box dt {
clear: left;
float: left;
width: 10%;
}
.sekou_box dd {
margin-left: 11%;
}
}
/* ---------------------------------------------------------------------------------------------

　   slick

--------------------------------------------------------------------------------------------- */

.slider-container, .slider-nav-container {
  display: none;
  position: relative;
}
.slider-container.initialized, .slider-nav-container.initialized {
  display: block;
}
.slider-nav-container {
  margin-top: 18px;
}
.slider {
  overflow: hidden;
}
.slider img{
width: 100%;
height: 50vw;
object-fit: cover;
overflow: hidden;
}

.slider-nav {
  margin: 0 26px 50px 26px;
}
.slider-nav div {
height: 15vw;
overflow: hidden;
}
.slider div{
height: 60vw;
}
@media screen and (min-width: 980px) {
.slider-nav div {
    height: 150px;
}
.slider div{
  height: 600px;
}}
.slider-nav img{
width: 100%;
height: 60px;
object-fit: cover;
overflow: hidden;
}

.slider-nav img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.slider-nav img:hover {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

.slider-arrow {
  position: absolute;
  top: 50%;
  height: 36px;
  margin-top: -18px;  /* 高さの半分だけネガティブマージン */
  color: #aaa;
  line-height: 36px;
  font-size: 28px;
  cursor: pointer;
  z-index: 10;  /* 重要 */
}
.slider-prev {
  left: 0;
}
.slider-next {
  right: 0;
}
.slick-slide {
  outline: 0;
}
.slider .slick-slide > img, .slider-nav .slick-slide > img {
  display: block;
  width: 100%;
  height: auto;
}
.slider {
  display:none;
}
.slider.slick-initialized {
  display: block;
}

/*edit
---------------------------------------------------------------------------*/
a.post-edit-link {
display: inline-block;
  padding: 0 1.6em;
  font-size: 0.8em;
  color: #fff;
  text-decoration: none;
  user-select: none;
  background: #999;
  transition: 0.2s ease;
}
a.post-edit-link:hover {
  opacity: .6;
color: #fff;  
}