@charset "UTF-8";
/* CSS Document */

/*PC*/
@media print, screen and (min-width: 769px) {

/*index
-------------------------*/
.unit_wrap {
margin: 0 auto 100px;
position: relative;
display: flex;
flex-wrap: wrap;
}

.unit_box {
width: 22.75%;
margin-right: 3%;
margin-bottom: 3%;
position: relative;
}

.unit_box:nth-child(4n) {
margin-right: 0;
}

.unit_box .img {
width: 100%;
margin: 0 auto;
}
.unit_box .img img {
object-fit: cover;
height: 220px;
width: 100%;
}

.unit_box h3 {
background: #333;
color: #FFF;
padding: 10px;
box-sizing: border-box;
font-weight: 500;
font-size: 0.8em;
line-height: 1.2;
margin: 0 0 10px;
}
.unit_box dl {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
font-size: 0.8em;
margin: 0 auto;
line-height: 1.4;
}
.unit_box a dl {
color: #000;
}
.unit_box dt {
width: 25%;
box-sizing: border-box;
margin-bottom: 5px;
}
.unit_box dd {
width: 75%;
box-sizing: border-box;
}

.pagination {
 display: flex;
 justify-content: center;
 padding-left:0;
 margin:20px 0;
 border-radius:4px
}
.pagination>li {
 display:inline
}
.pagination>li>a,
.pagination>li>span {
 position:relative;
 float:left;
 padding:6px 12px;
 margin-left:-1px;
 line-height:1.42857143;
 color:#428bca;
 text-decoration:none;
 background-color:#fff;
 border:1px solid #ddd
}
.pagination>li:first-child>a,
.pagination>li:first-child>span {
 margin-left:0;
 border-top-left-radius:4px;
 border-bottom-left-radius:4px
}
.pagination>li:last-child>a,
.pagination>li:last-child>span {
 border-top-right-radius:4px;
 border-bottom-right-radius:4px
}
.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
 color:#2a6496;
 background-color:#eee;
 border-color:#ddd
}
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
 z-index:2;
 color:#fff;
 cursor:default;
 background-color:#428bca;
 border-color:#428bca
}
.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
 color:#777;
 cursor:not-allowed;
 background-color:#fff;
 border-color:#ddd
}
.pagination-lg>li>a,
.pagination-lg>li>span {
 padding:10px 16px;
 font-size:18px
}
.pagination-lg>li:first-child>a,
.pagination-lg>li:first-child>span {
 border-top-left-radius:6px;
 border-bottom-left-radius:6px
}
.pagination-lg>li:last-child>a,
.pagination-lg>li:last-child>span {
 border-top-right-radius:6px;
 border-bottom-right-radius:6px
}
.pagination-sm>li>a,
.pagination-sm>li>span {
 padding:5px 10px;
 font-size:12px
}
.pagination-sm>li:first-child>a,
.pagination-sm>li:first-child>span {
 border-top-left-radius:3px;
 border-bottom-left-radius:3px
}
.pagination-sm>li:last-child>a,
.pagination-sm>li:last-child>span {
 border-top-right-radius:3px;
 border-bottom-right-radius:3px
}


/*detail
-----------------------------*/
.work_wrap2 {
width: 1000px;
margin: 0 auto 60px;
}

.work_wrap2_box_day {
font-size: 0.8em;
display: block;
margin: 0;
color: #028fd4;
}

.work_wrap2_box_tit {
background: #333;
color: #FFF;
font-size: 1.2em;
padding: 5px;
text-align: center;
margin: 0 auto 0px;
}

.work_wrap2_box_img {
width: 100%;
margin: 0 auto;
}

.work_wrap2_box_tag {
display: inline-block;
vertical-align: top;
padding: 0 5px;
color: #fff;
text-align: center;
background-color: #028fd4;
font-weight: 700;
font-size: 14px;
margin-left: auto;
}

.work_wrap2_box_img_list {
display: flex;
flex-wrap: wrap;
margin: 30px auto 60px
}

.work_wrap2_box_img_list li {
width: 30.66%;
margin-right: 3%;
}

.work_wrap2_box_img_list li:nth-child(3n) {
margin-right: 0
}

.p-table-works {
width: 100%;
border-collapse: collapse
}
.p-table-works td, .p-table-works th {
padding: 8px 20px;
border: 1px solid #c9c9c9;
background: #FFF;
}
.p-table-works th {
width: 110px;
text-align: left;
background-color: #f3f4f3
}


}


/*sp*/
@media only screen and (max-width: 768px) {

/*index
-------------------------*/
.unit_wrap {
width: 90%;
margin: 0 auto;
position: relative;
}
.unit_box {
margin:0 0 40px;
}
.unit_box .img {
width: 100%;
margin: 0 auto;
}
.unit_box h3 {
background: #333;
color: #FFF;
padding: 10px;
box-sizing: border-box;
font-weight: 500;
font-size: 0.8em;
line-height: 1.2;
margin: 0 0 10px;
}
.unit_box dl {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
position: relative;
font-size: 0.8em;
margin: 0 auto;
line-height: 1.4;
}
.unit_box a dl {
color: #000;
}
.unit_box dt {
width: 25%;
box-sizing: border-box;
margin-bottom: 5px;
}
.unit_box dd {
width: 75%;
box-sizing: border-box;
}


.pagination {
 display:inline-block;
 padding-left:0;
 margin:20px 0;
 border-radius:4px
}
.pagination>li {
 display:inline
}
.pagination>li>a,
.pagination>li>span {
 position:relative;
 float:left;
 padding:6px 12px;
 margin-left:-1px;
 line-height:1.42857143;
 color:#428bca;
 text-decoration:none;
 background-color:#fff;
 border:1px solid #ddd
}
.pagination>li:first-child>a,
.pagination>li:first-child>span {
 margin-left:0;
 border-top-left-radius:4px;
 border-bottom-left-radius:4px
}
.pagination>li:last-child>a,
.pagination>li:last-child>span {
 border-top-right-radius:4px;
 border-bottom-right-radius:4px
}
.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
 color:#2a6496;
 background-color:#eee;
 border-color:#ddd
}
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
 z-index:2;
 color:#fff;
 cursor:default;
 background-color:#428bca;
 border-color:#428bca
}
.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
 color:#777;
 cursor:not-allowed;
 background-color:#fff;
 border-color:#ddd
}
.pagination-lg>li>a,
.pagination-lg>li>span {
 padding:10px 16px;
 font-size:18px
}
.pagination-lg>li:first-child>a,
.pagination-lg>li:first-child>span {
 border-top-left-radius:6px;
 border-bottom-left-radius:6px
}
.pagination-lg>li:last-child>a,
.pagination-lg>li:last-child>span {
 border-top-right-radius:6px;
 border-bottom-right-radius:6px
}
.pagination-sm>li>a,
.pagination-sm>li>span {
 padding:5px 10px;
 font-size:12px
}
.pagination-sm>li:first-child>a,
.pagination-sm>li:first-child>span {
 border-top-left-radius:3px;
 border-bottom-left-radius:3px
}
.pagination-sm>li:last-child>a,
.pagination-sm>li:last-child>span {
 border-top-right-radius:3px;
 border-bottom-right-radius:3px
}

/*detail
-----------------------------*/
.work_wrap2 {
width: 90%;
margin: 0 auto 30px;
}

.work_wrap2_box_day {
font-size: 0.9em;
display: block;
margin: 0;
color: #028fd4;
}

.work_wrap2_box_tit {
background: #333;
color: #FFF;
font-size: 1.2em;
text-align: center;
margin: 0 auto 0px;
}

.work_wrap2_box_img {
width: 100%;
margin: 0 auto;
}

.work_wrap2_box_tag {
display: inline-block;
vertical-align: top;
padding: 0 5px;
color: #fff;
text-align: center;
background-color: #028fd4;
font-weight: 700;
font-size: 12px;
margin-left: auto;
}

.work_wrap2_box_img_list {
display: flex;
flex-wrap: wrap;
margin: 10px auto 20px
}

.work_wrap2_box_img_list li {
width: 30.66%;
margin-right: 3%;
}


.work_wrap2_box_img_list li:nth-child(3n) {
margin-right: 0;
}

.p-table-works {
width: 100%;
border-collapse: collapse
}

.p-table-works th {
text-align: left;
background-color: #f3f4f3;
padding: 8px 20px;
border: 1px solid #c9c9c9;
box-sizing: border-box;
}

.p-table-works td {
padding: 8px 20px;
box-sizing: border-box;
border: 1px solid #c9c9c9;
background:#FFF;
}

.p-table-works td,
.p-table-works th {
display: block;
width: 100%
}

}