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

.box_m {
width: 90%;
max-width: 800px;
margin: 0 auto;
}

#ceo .box div p span {
display: table;
font-size: 0.9em;
margin-left: auto;
padding-top: 30px;
}
#outline table {
width: 100%;
border-collapse: collapse;
}

#caseStudy ul li h4, #category ul li h4 {
background: #0E7EA8;
color: #fff;
font-weight: bold;
text-align: center;
}
#caseStudy ul li h5 {
font-weight: normal;
display: table;
margin: 0 auto;
}
#category ul li h4 span {
font-size: 0.8em;
}

#bloglist ul {
display: table;
margin: 0 auto;
}
#bloglist ul li:last-child {
padding-bottom: 0;
}
#entryDetail p:last-child {
padding-bottom: 0;
}

.pager ul{
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
}
.pager ul li{
text-align: center;
}

#worksDetail h3.h3-title {
font-family: "Noto Sans JP", "Yu Gothic medium", YuGothic, "Hiragino Sans", Meiryo, "sans-serif";
}
#worksDetail dl dt {
font-weight: bold;
}
.works-outlie {
width: 100%;
}
#worksDetail dl dd span {
display: block;
margin-top: 20px;
}
#worksDetail dl dd span a[data-lightbox] {
display: table;
background: #000;
color: #fff;
padding: 8px 20px;
border-radius: 8px;
font-size: 0.8em;
}
#flex > div[title="市街地"]{
display: flex;
flex-wrap: wrap;
}
#flex > div[title="市街地"] p {
width: 50%;
}

.intro h4 {
display: table;
margin: 0 auto;
font-weight: 900;
}
.intro a.btn2 {
margin: 0 auto;
}
#voice ul li img {
display: block;
width: 80%;
border-radius: 50%;
margin: 0 auto 20px;
}
#voice dl dt {
background: #4A4A4A;
color: #fff;
display: table;
text-align: center;
}
#voice dl dd:last-child {
margin-bottom: 0;
}
#paper table {
width: 100%;
border: 1px solid #4a4a4a;
border-spacing: 0;
}
#paper table th, #paper table td{
border: 1px solid #4a4a4a;
}

@media screen and (max-width: 560px) {
.hero {
margin-bottom: 50px;
}

#main > section {
padding-bottom: 40px;
}

#ceo .box div img {
display: block;
width: 60%;
margin: 0 auto 20px;
}
#ceo .box div p {
font-size: 1.5rem;
line-height: 130%;
}
#outline table {
border-collapse: separate;
border-spacing: 0 30px;
}
#outline table th, #outline table td {
display: block;
width: 100%;
}
#outline table th {
background: #EFEFEF;
padding: 10px 0;
}
#outline table td {
padding-top: 10px;
display: grid;
place-items: center;
}

#caseStudy ul li, #category ul li {
padding-bottom: 40px;
}
#caseStudy ul li:last-child, #category ul li:last-child {
padding-bottom: 0;
}
#caseStudy ul li h4, #category ul li h4 {
font-size: 1.8rem;
padding: 6px;
margin-bottom: 8px;
}

#bloglist ul li {
padding-bottom: 10px;
}
#bloglist ul li a {
font-size: 1.6rem;
}
#bloglist ul li a time {
display: block;
font-size: 0.8em;
}
#entryDetail p {
padding-bottom: 16px;
}

.pager {
padding-bottom: 40px;
}
.pager ul li{
width: 30px;
}
.entry {
padding-top: 40px;
}

#worksDetail dl dt, #worksDetail dl dd {
width: 100%;
}
#worksDetail dl dt {
padding-bottom: 8px;
}
#worksDetail dl dd {
padding-bottom: 20px;
}
#flex > div {
padding-bottom: 20px;
}

.intro h4 {
font-size: 6.5vw;
padding-bottom: 20px;
}
.intro p {
padding-bottom: 30px;
}

#voice ul li h4 {
font-size: 6vw;
padding-bottom: 10px;
}
#voice dl dt {
font-size: 1.8rem;
padding: 4px 10px;
margin-bottom: 10px;
}
#voice dl dd {
margin-bottom: 40px;
}

#paper table th, #paper table td {
padding: 4px;
display: block;
width: 100%;
box-sizing: border-box;
}
#paper table th {
background: #eee;
}
}

@media screen and (min-width: 561px) {
#ceo .box div {
display: flex;
justify-content: space-between;
}
#outline table tr:nth-child(odd) {
background: #EFEFEF;
}
#outline table th, #outline table td {
border: 1px solid #4A4A4A;
}

#caseStudy ul, #category ul {
display: flex;
flex-wrap: wrap;
}
#caseStudy ul li, #category ul li {
width: 32%;
margin: 0 2% 40px 0;
}
#caseStudy ul li:nth-child(3n), #category ul li:nth-child(3) {
margin-right: 0;
}
#caseStudy ul li:nth-last-child(-n+3), #category ul li {
margin-bottom: 0;
}
#caseStudy ul li h4, #category ul li h4 {
font-size: 2rem;
padding: 8px;
margin-bottom: 10px;
}
#caseStudy ul li h5 {
font-size: 1.8rem;
}

#bloglist ul li {
padding-bottom: 16px;
}
#entryDetail p {
padding-bottom: 24px;
}

.pager ul li{
width: 40px;
}

#flex {
display: flex;
justify-content: space-between;
}
#flex > div{
width: 48%;
}
#worksDetail dl {
width: 48%;
font-size: 2.2rem;
display: flex;
flex-wrap: wrap;
}

#voice ul li h4 {
font-size: 2.6rem;
padding-bottom: 20px;
}
#voice dl dt {
font-size: 2rem;
padding: 8px 20px;
margin-bottom: 20px;
}
#voice dl dd {
font-size: 1.8rem;
margin-bottom: 50px;
}

#paper table tr:nth-child(odd) {
background: #eee;
}
#paper table th {
width: 120px;
}
#paper table th, #paper table td {
padding: 8px;
}
}

@media screen and (max-width: 768px) {
#voice ul li, #paper .box > div > div {
padding-bottom: 40px;
}
#voice ul li:last-child, #paper .box > div > div:last-child {
padding-bottom: 0;
}
}

@media screen and (min-width: 769px) {
#voice ul, #paper .box > div {
display: flex;
flex-wrap: wrap;
}
#voice ul li, #paper .box > div > div {
width: 48%;
padding-right: 4%;
padding-bottom: 50px;
}
#voice ul li:nth-child(even), #paper .box > div > div:nth-child(even) {
padding-right: 0;
}
#voice ul li:nth-child(n+2), #paper .box > div > div:nth-child(n+2) {
padding-bottom: 0;
}
}

@media screen and (min-width:561px) and ( max-width:960px) {
#main > section {
padding-bottom: 60px;
}

#ceo .box div img {
width: 30%;
height: 100%;
}
#ceo .box div p {
width: 66%;
}
#outline table th, #outline table td {
font-size: 1.8rem;
padding: 10px;
}
#outline table th {
width: 140px;
}

#bloglist ul li a {
font-size: 1.8rem;
}
#bloglist ul li a time {
padding-right: 10px;
font-size: 0.9em;
}

.pager {
padding-bottom: 60px;
}
.entry {
padding-top: 60px;
}
#worksDetail dl dt {
padding-right: 20px;
}
#worksDetail dl dd {
padding-right: 50px;
}
dt.works-outlie {
padding: 16px 0 8px;
}
#worksDetail dl dd.works-outlie {
padding-bottom: 30px;
padding-right: 0;
}

.intro h4 {
font-size: 2.5rem;
padding-bottom: 30px;
}
.intro p {
font-size: 1.8rem;
padding-bottom: 40px;
}
}

@media screen and (max-width: 960px) {
.intro p {
display: table;
margin: 0 auto;
}
}

@media screen and (min-width: 961px) {
#main > section {
padding-bottom: 80px;
}

#ceo .box div img {
width: 20%;
height: 100%;
}
#ceo .box div p {
width: 73%;
line-height: 200%;
font-size: 1.8rem;
}
#outline table th, #outline table td {
font-size: 2.1rem;
padding: 16px 40px;
}
#outline table th {
width: 300px;
}
.pager {
padding-bottom: 80px;
}
.entry {
padding-top: 80px;
}

#worksDetail dl dt {
width: 20%;
padding-bottom: 10px;
}
#worksDetail dl dd {
width: 80%;
padding-bottom: 10px;
}
#worksDetail dl dt.works-outlie, #worksDetail dl dd.works-outlie {
width: 100%;
}
dt.works-outlie {
padding: 20px 0 10px;
}
#worksDetail dl dd.works-outlie {
padding-bottom: 40px;
padding-right: 0;
}

#bloglist ul li a {
font-size: 2rem;
}
#bloglist ul li a time {
padding-right: 20px;
font-size: 0.8em;
}

.intro h4 {
font-size: 3rem;
padding-bottom: 40px;
}
.intro p {
text-align: center;
font-size: 2rem;
padding-bottom: 60px;
}
}