@charset "UTF-8";

/*
Theme Name: Capdo-WEBSITE2022
Author: Take-c Inc.
*/

/*********************************************/
/*  ◆ 検索結果 ◆
/*********************************************/

#search-page{
margin:0 auto;
width:100%;
background:#f4f4f4;
padding:2% 5% 5%;
}

#search-page main{
margin:0 auto;
max-width:1200px;
padding:0% 1%;
}

#search-page main .page-title{
text-align: left;
padding:3% 0 5%;
font-size:16px;
letter-spacing: 0.05em;
line-height:1.5;
font-weight:bold;
}

#search-page main .article-title{
text-align: left;
padding:4% 0 1%;
font-size:18px;
letter-spacing: 0.05em;
line-height:1.5;
color:#734d33;
border-bottom: 1px solid #734d33;
}

#search-page main .text{
text-align: left;
padding:2% 1%;
font-size:14px;
letter-spacing: 0.05em;
line-height:1.5;
color:#000;
}

.pagenav{
padding:5% 0;
font-size:14px;
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
/* ---------------------------------- */

#search-page main .page-title{
padding:3% 0 8%;
font-size:14px;
}

#search-page main .article-title{
padding:8% 0 1%;
font-size:14px;
}

#search-page main .text{
font-size:12px;
}
/* ---------------------------------- */
}

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

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
/* ---------------------------------- */

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
/* ---------------------------------- */

/* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 380px) {
/* ---------------------------------- */

/* ---------------------------------- */
}




/*****************************************************

blog

*****************************************************/



.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.clear{clear:both;}
.wp-block-image img{
	width:100%;
	display:block;
margin:5% auto 0;}

/* --- bg --- */

.bg{
margin:0 auto;
width:100%;
background:#f4f4f4;
}


/* --- wp-box --- */

#wp-box {
 margin:0 auto 8%;
	width:100%;
	max-width:1700px;
	display:flex;
	justify-content: space-between;
 flex-flow:row-reverse nowrap;
	align-items: flex-start;
	background:#f4f4f4;
}

#wp-box.casestudy{
	padding:0 5%;
	display:block;
}

/* --- contents --- */

#contents {
	margin:0 0 0 auto;
	width:73%;
}
#wp-box.casestudy #contents{
	margin:0 0 0 auto;
	width:100%;
}

.pagenav{
	margin:3% auto;
	font-size:14px;
}

/* --- sidebar --- */

#side{
	margin:0 auto 0;
	width:20%;
}

#side ul{
margin:0 auto 0;
width:100%;
}


#side ul li h2{
margin:0 auto 5%;
font-size:18px;
border-top:2px solid #000;
border-bottom:2px solid #000;
letter-spacing: 0.05em;
line-height:1.5;
padding:10px 0;
}

#side ul li:last-of-type h2{
margin:20% auto 5%;
}

#side ul li ul li{
margin:0 auto 3%;
width:85%;
padding:5px;
font-size:16px;
letter-spacing: 0.05em;
line-height:1.5;
text-align: left;
border-bottom:1px solid #000;
}

#side .wpp-list{margin:10% auto 0}

#side .wpp-list li{
border:none;
}

/* *********** ******************************** */
@media screen and (max-width: 1700px) {
/* ---------------------------------- */

/* ---------------------------------- */
}
/* *********** ******************************** */
@media screen and (max-width: 1500px) {
/* ---------------------------------- */

#side ul li h2{
margin:0 auto 5%;
font-size:15px;
padding:5px 0;
}

#side ul li ul li{font-size:13px;}

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
/* ---------------------------------- */

/* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 1024px) {
/* ---------------------------------- */
#wp-box {
padding:0 10%;
 flex-flow:row wrap;
}

/* --- contents --- */

#contents {
	margin:0 0 0 auto;
	width:100%;
}

/* --- sidebar --- */

#side{
	margin:0 auto 0;
	width:100%;
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
/* ---------------------------------- */
#wp-box {
padding:0 5%;
}
#side{padding:5% 10%;}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
/* ---------------------------------- */
#wp-box {
padding:0 4%;
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
/* ---------------------------------- */

/* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 380px) {
/* ---------------------------------- */

/* ---------------------------------- */
}




/*********************************************/
/*  ◆ 記事一覧ページ ◆
/*********************************************/

.works-box{
margin:0 auto;
width:100%;
}

.works-list{
margin:0 auto;
width:100%;
display:flex;
justify-content: flex-start;
align-items: stretch;
flex-flow:row wrap;
text-align: left;

}

.works-list.new{
justify-content: flex-start;
}
.works-list .list-in{
margin:0 3% 5% 0;
width:28%;
border:2px solid #000;
padding:2% 2% 4%;
position:relative;
text-align: left;
}
#wp-box.casestudy .works-list .list-in{
margin:0 1% 5% 0;
width:23%;
}

.works-list .list-in .blogimages img{
width:100%;
}

.works-list .list-in .title01{
padding:4% 2%;
font-size:15px;
letter-spacing: 0.03em;
line-height:1.5;
}

.works-list .list-in .category{
margin:2px 5px 10px 0;
font-size:10px;
border:1px solid #000;
border-radius:25px;
padding:4px 15px;
display:inline-block;
letter-spacing: 0.02em;
}

.works-list .list-in .read-btn{
position:absolute;
bottom:-20px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
background:#000;
padding:12px 30px 12px;
border-radius: 30px;
transition:0.3s;
}

.works-list .list-in .read-btn img{
width:100%;
}

.works-list .list-in .read-btn:hover{
background:#734d33;
transition:0.3s;
}

/*日付・カテゴリー*/
.list-in .dc-box{
margin:20px auto 0;
}

.list-in .dc-box .date{
font-size:14px;
padding: 0 0px 20px 0;
text-align: right;
}

/* *********** ******************************** */
@media screen and (max-width: 1500px) {
/* ---------------------------------- */

.works-list .list-in{
padding:2% 2% 5%;
}

.works-list .list-in .title01{
font-size:14px;
line-height:1.4
}

.works-list .list-in .read-btn{
background:#000;
padding:10px 20px 10px;
}

/*日付・カテゴリー*/
.list-in .dc-box{
display:flex;
justify-content: flex-end;
align-items: center;
}

/*日付・カテゴリー*/
.list-in .dc-box.news{
display:block
}

.list-in .dc-box .date{
font-size:12px;
padding: 0 10px 10px 0;
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
/* ---------------------------------- */
.works-list{
margin:0 auto 0 3%;
width:100%;
}

.works-list .list-in{
width:45%;
padding:2% 2% 5%;
}
#wp-box.casestudy .works-list .list-in{width:45%;}

.works-list .list-in .title01{
padding:3% 1%;
font-size:14px;
}

.works-list .list-in .read-btn img{max-width:120px
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
/* ---------------------------------- */


.works-list.new{
justify-content: space-between;
}

/* ---------------------------------- */
}

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

.works-list .list-in{
margin:0 1% 5% 0;
}

.works-list .list-in .title01{
font-size:13px;
}
.works-list .list-in{margin:0 auto 8%;}

.works-list .list-in .read-btn{
display:block;
width:100%;
max-width:150px;
text-align: center;
padding:10px 30px 10px;
}

.list-in .dc-box .date{
font-size:11px;
}

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
/* ---------------------------------- */


.works-list .list-in{
width:48%;
padding:2% 2% 8%;
}

#wp-box.casestudy .works-list .list-in{width:48%;}

.works-list .list-in .title01{font-size:12px;}

.works-list .list-in .read-btn{
max-width:120px;
padding:10px 20px 8px;
bottom:-14px;
}

.works-list .list-in .read-btn img{max-width:90px}

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
/* ---------------------------------- */
.works-list .list-in .title01{
padding:6% 5%;
font-size:12px;
letter-spacing: 0.01em;
line-height:1.3;
text-align: justify;
}

.list-in .dc-box .category{
margin:2px 5px 5px 0;
padding:2px 0;
width:100%;
display:block;
text-align: center;
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
/* ---------------------------------- */

/*日付・カテゴリー*/
.list-in .dc-box{
display:block;
padding:3% 0;
}

.list-in .dc-box .date{
font-size:11px;
padding: 1% 1% 1% 0;
text-align: right;
}

.list-in .dc-box .category{
padding:2px 0;
}
/* ---------------------------------- */
}


/*****************************************************
Case Study
*****************************************************/
#casestudy{
margin:0 auto 4%;
width:100%;
background:#f4f4f4;
}

#casestudy .category-box{
margin:0 auto;
width:100%;
max-width:1400px;
display:flex;
justify-content: space-around;
flex-flow:row nowrap;
align-items: center;
}

#casestudy .category-box .cat-title{
width:10%;
font-size:20px;
line-height:1.6;
letter-spacing: 0.05em;
font-weight:600
}

#casestudy .category-box .cat-title span{
border-top:2px solid #000;
border-bottom:2px solid #000;
padding:10px 10px 4px;
}

#casestudy .category-box .category-list{
width:80%;
display:flex;
justify-content: flex-start;
flex-flow:row wrap;
align-items: flex-start;
}

#casestudy .category-box .category-list li{
margin:0.5% 0.5%;
width:17%;
}

#casestudy .category-box .category-list li a{
display:block;
border:1px solid #000;
border-radius: 25px;
font-size:14px;
padding:8px 10px 5px;
letter-spacing: 0.03em;
transition:0.3s
}
#casestudy .category-box .category-list li a:hover{
border:1px solid #000;
background:#000;
color:#fff;
transition:0.3s
}

/* *********** ******************************** */
@media screen and (max-width: 1700px) {
/* ---------------------------------- */

/* ---------------------------------- */
}
/* *********** ******************************** */
@media screen and (max-width: 1500px) {
/* ---------------------------------- */

#casestudy .category-box{
padding:0 5%;
}

#casestudy .category-box .category-list{
padding:0 0 0 3%
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
/* ---------------------------------- */

#casestudy .category-box .category-list li a{
font-size:12px;
}
/* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 1024px) {
/* ---------------------------------- */

#casestudy .category-box{
display:block;
padding:0 5%;
}

#casestudy .category-box .cat-title{
width:100%;
font-size:18px;
}

#casestudy .category-box .cat-title span{
display:block
}
#casestudy .category-box .category-list{
width:100%;
padding: 3% 3% 3% 6%;
justify-content: flex-start;
}

#casestudy .category-box .category-list li{
width:30%;
}
#casestudy .category-box .category-list li a:hover{
border:1px solid #000;
background:#000;
color:#fff;
transition:0.3s
}
/* ---------------------------------- */
}

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

#casestudy .category-box .category-list li{
width:47%;
}
/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
/* ---------------------------------- */

#casestudy .category-box .cat-title{
margin:0 auto;
font-size:16px;
width:90%;
}

/* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
/* ---------------------------------- */

#casestudy .category-box .cat-title{
font-size:14px;

}
/* ---------------------------------- */
}
/* ******************************************* */
@media screen and (max-width: 380px) {
/* ---------------------------------- */

#casestudy .category-box .category-list li{
margin:1% 0.5%;
}
#casestudy .category-box .category-list li a{
font-size:10px;
}
/* ---------------------------------- */
}





/*****************************************************
Single
*****************************************************/
#wp-box #contents .single-article strong{font-weight:bold}
#wp-box #contents .single-article h1{
margin:4% auto 3%;
font-size:30px !important}

/* ************************************************************
h2〜h6
************************************************************ */
#wp-box #contents article h1{
	font-size:26px;
}

/*h2*/

#wp-box #contents article h2{
	margin:4% auto 3%;
	font-size:18px;
	color:#fff;
	letter-spacing:0.05em;
	line-height:1.4;
	font-weight:500;
	text-align:left;
	background-color:#a57f57;
	padding:2% 3%;
}

/*h3*/
#wp-box #contents article h3{
	margin:6% auto 3%;
	font-size:20px;
	color:#734d33;
	letter-spacing:0.05em;
	line-height:1.4;
	font-weight:600;
	text-align:left;
}
/* *********************************************************** */

.time-category{
	margin:0 auto;
	font-size:14px;
	letter-spacing:0.05em;
	line-height:1.4;
	font-weight:400;
	text-align:left;
	padding:1%;
}

.contents{
	margin:2% auto 0;
	font-size:14px;
	letter-spacing:0.02em;
	line-height:1.4;
	text-align:left;
	padding:0 2% 10% 2%;
}



.contents p{
	margin:4% auto 0;
	line-height:1.7
}

.contents p a{
color:#734d33;

}


/***********single.php****************/
.single-article{
	margin:0 auto 10%;
	width:100%;
	max-width:1100px;
	padding:0 5%
}

.single-title{
	margin:0 auto;
	font-size:30px;
	letter-spacing:0.05em;
	line-height:1.4;
	font-weight:600;
	text-align:left;
	border-bottom:1px solid #000;
	padding:0 2% 10px;
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

.single-title{
	font-size:26px;
}

article h1{
	font-size:26px;
}

.time-category{
	font-size:14px;
}

.contents{
	font-size:14px;
}
	
	#wp-box #contents .single-article h1{font-size:25px !important}

 /* ************** */

}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */

.single-title{
	margin:0 auto;
	font-size:18px;
	letter-spacing:0.05em;
	line-height:1.4;
	font-weight:600;
	text-align:left;
	border-bottom:1px solid #000;
	padding:2% 2%;
}

/**************************************/


.time-category{
	font-size:12px;
}

.contents{
	font-size:13px;
	padding:4% 2% 10% 2%;

}

/*h2*/

#wp-box #contents article h2{
	margin:4% auto 3%;
	font-size:16px;
	padding:4% 5% 4%;
 line-height:1.2
}

/*h3*/
#wp-box #contents article h3{
	margin:10% auto 3%;
	font-size:18px;
}
/***********single.php****************/
.single-article{
	margin:3% auto 15%;
}
 /* ************** */

}



/*********************************************/
/*  ページネーション
/*********************************************/


.pagination {
	margin:0 auto 60px; 
	padding:0;
	text-align:center; 
	line-height:1;
}

.pagination:after {
	content:""; 
	display:block; 
	height:0; 
	visibility:hidden;
}

.pagination ul {
	text-align:center; 
	font-size:16px; 
}

.pagination ul li {
	display:inline-block;
	margin:0 2px 4px;}

.pagination span,
.pagination ul li a {
	padding:12px 12px 12px; 
	background-color:#f4f4f4; 
	color:#734d33; 
	border:1px solid #734d331e;
	border-radius:2px;
	display:block;
}

.pagination span.current {
	border:1px solid #734d33;
	background-color:#734d33;
	color:#fff;
}

.pagination span.dots {
	background:none; 
	border:0;
	color:#ddd
}


/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

	.pagination ul {		font-size:13px; }

	.pagination ul li {		margin:0 2px 2px;
}
	
	.pagination span,
	.pagination ul li a {
		padding:10px 10px 10px; 
	}


 /* ---------------------------------- */
}






/*********************************************/
/*  ◆ キャプション ◆
/*********************************************/

.wp-block-image figcaption{
margin:0 auto;
width:100%;
text-align: center;
font-size:12px;
}

/* ******************************************* */
@media screen and (max-width: 480px) {
/* ---------------------------------- */

.wp-block-image figcaption{
font-size:10px;
}

/* ---------------------------------- */
}

.widep{
	font-size: 2.2rem;
    padding-top: 5%;
	padding-bottom: 10%;
}
.widep a{
	border-bottom: solid 1px;
    padding-bottom: 1%;
}
@media screen and (max-width: 480px) {
	.widep{
	font-size: 1.4rem;
}
}