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

/*----------------------------------------------------------
section
----------------------------------------------------------*/
.section01{
padding: 60px 0;
}
.section01 .main{
background: #fff;
border-radius: 20px;
margin: 0 0 40px;
padding: 60px 60px 75px;
}
@media (max-width: 768px){
.section01{
padding: 6.0rem 0;
}
.section01 .main{
border-radius: 2.0rem;
margin: 0 0 4.0rem;
padding: 4.0rem 2.0rem;
}
}

/*----------------------------------------------------------
category
----------------------------------------------------------*/
[class^="category_"] a,
p[class^="category_"] {
font-size: 1.2rem;
font-weight: 600;
border-width: 1px;
border-style: solid;
border-radius: 100px;
padding: 3px 17px;
display: inline-block;
transition: 0.3s;
}
.category_blog{
color: #1E4290;
border-color: #1E4290;
}
.category_news{
color: #E21B1B;
border-color: #E21B1B;
}
@media (min-width: 769px){
[class^="category_"] a:hover{
background: #EFF7FD!important;
}
}
@media (max-width: 768px){
[class^="category_"] a,
p[class^="category_"]{
font-size: 1.4rem;
border-radius: 100px;
padding: 0.3rem 2.0rem;
}
}

/*----------------------------------------------------------
articles
----------------------------------------------------------*/
.menuBlock01{
background: #fff;
border-radius: 20px;
margin: 0 0 60px;
padding: 30px;
}
.menuBlock01 .box01{
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.menuBlock01 .box01 + .box01{
margin-top: 20px;
}
.menuBlock01 .box01 .ttl01{
width: 75px;
font-size: 1.4rem;
font-weight: 600;
margin: 6px 0 0;
}
.menuBlock01 .box01 .list01{
width: calc(100% - 75px);
flex-wrap: wrap;
align-items: flex-start;
}
.menuBlock01 .box01 .list01 > li{
margin: 0 10px 0 0;
display: inline-block;
}
.menuBlock01 .box01 .list01 > li:last-child{
margin-right: 0;
}
.menuBlock01 .box01 .list01 > li a{
background: #F5F5F5;
font-size: 1.4rem;
font-weight: 600;
border: 1px solid #707070;
border-radius: 100px;
padding: 6px 30px 8px;
display: block;
transition: 0.3s;
}
.menuBlock01 .box01 .list01 > li.current a{
background: #fff;
color: #1E4290;
border-color: #1E4290;
}
@media (min-width: 769px){
.menuBlock01 .box01 .list01 > li a:hover{
background: #EFF7FD;
color: #1E4290;
border-color: #1E4290;
}
}
@media (max-width: 768px){
.menuBlock01{
border-radius: 2.0rem;
margin: 0 0 4.0rem;
padding: 2.5rem 2.0rem;
}
.menuBlock01 .box01{
display: block;
}
.menuBlock01 .box01 + .box01{
margin-top: 1.5rem;
}
.menuBlock01 .box01 .ttl01{
width: 100%;
font-size: 1.6rem;
margin: 0 0 0.4rem;
}
.menuBlock01 .box01 .list01{
width: 100%;
}
.menuBlock01 .box01 .list01 > li{
margin: 0 1.0rem 0 0;
}
.menuBlock01 .box01 .list01 > li a{
padding: 0.5rem 2.4rem 0.7rem;
}
}

.articleList01 > li + li{
margin-top: 20px;
}
.articleList01 > li a{
width: 100%;
background: #fff;
border-radius: 20px;
padding: 30px 70px 35px 30px;
display: flex;
flex-wrap: wrap;
align-items: center;
position: relative;
}
.articleList01 > li a::before{
content: "";
width: 10px;
height: 12px;
background: url("/wp-content/themes/divehope/assets/images/common/common_ico_01_navy.webp") top center / 100% auto no-repeat;
position: absolute;
right: 30px;
top: 50%;
transform: translateY(-50%);
}
.articleList01 > li a .imageBlock{
width: 150px;
height: 100px;
border-radius: 10px;
margin: 0 20px 0 0;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.articleList01 > li a .imageBlock img{
width: auto;
height: 100%;
object-fit: cover;
}
.articleList01 > li a .textBlock{
width: calc(100% - 170px);
}
.articleList01 > li a .textBlock .block01{
margin: 0 0 10px;
display: flex;
align-items: center;
}
.articleList01 > li a .textBlock .block01 [class^="category_"]{
margin: 0 10px 0 0;
}
.articleList01 > li a .textBlock .block01 .date{
font-size: 1.2rem;
}
.articleList01 > li a .textBlock .ttl{
font-size: 1.4rem;
font-weight: 600;
margin: 0 0 5px;
}
.articleList01 > li a .textBlock .txt{
font-size: 1.2rem;
}
@media (max-width: 768px){
.articleList01 > li + li{
margin-top: 2.0rem;
}
.articleList01 > li a{
border-radius: 2.0rem;
padding: 2.0rem 4.5rem 2.0rem 2.0rem;
align-items: flex-start;
}
.articleList01 > li a::before{
width: 1.0rem;
height: 1.2rem;
right: 1.8rem;
}
.articleList01 > li a .imageBlock{
width: 10.0rem;
height: 10.0rem;
border-radius: 1.0rem;
margin: 0 1.0rem 0 0;
}
.articleList01 > li a .textBlock{
width: calc(100% - 11.0rem);
}
.articleList01 > li a .textBlock .block01{
margin: 0.5rem 0;
}
.articleList01 > li a .textBlock .block01 [class^="category_"]{
margin: 0;
order: 2;
}
.articleList01 > li a .textBlock .block01 .date{
font-size: 1.4rem;
margin: 0 1.0rem 0 0;
order: 1;
}
.articleList01 > li a .textBlock .ttl{
font-size: 1.6rem;
margin: 0;
}
.articleList01 > li a .textBlock .txt{
display: none;
}
}

.noArticle{
font-size: 1.6rem;
text-align: center;
margin: 0 0 40px;
}
@media (max-width: 768px){
.noArticle{
margin: 0 0 4.0rem;
}
}

/*----------------------------------------------------------
WP-PageNavi
----------------------------------------------------------*/
.wp-pagenavi{
width: 510px;
margin: 20px auto 40px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.wp-pagenavi a{
color: #1E4290;
font-size: 1.4rem;
font-weight: 600;
position: relative;
}
.wp-pagenavi a.previouspostslink{
padding-left: 35px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.wp-pagenavi a.previouspostslink::before{
content: "";
width: 24px;
height: 14px;
background: url("/wp-content/themes/divehope/assets/images/common/common_arrow_01_off.webp") top center / 100% auto no-repeat;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%) rotate(-180deg);
}
.wp-pagenavi a.nextpostslink{
padding-right: 35px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.wp-pagenavi a.nextpostslink::before{
content: "";
width: 24px;
height: 14px;
background: url("/wp-content/themes/divehope/assets/images/common/common_arrow_01_off.webp") top center / 100% auto no-repeat;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.wp-pagenavi a.page,
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi span.extend{
padding: 0 7px;
display: inline-block;
}
.wp-pagenavi span.current{
width: 30px;
height: 30px;
background: #1E4290;
color: #fff;
font-size: 1.4rem;
font-weight: 600;
text-align: center;
border-radius: 100px;
margin: 0 7px;
display: flex;
justify-content: center;
align-items: center;
}
@media (min-width: 769px){
.wp-pagenavi a:hover{
color: #5AC4FA;
}
.wp-pagenavi a.previouspostslink:hover::before,
.wp-pagenavi a.nextpostslink:hover::before{
background: url("/wp-content/themes/divehope/assets/images/common/common_arrow_01_on.webp") top center / 100% auto no-repeat;
}
}
@media (max-width: 768px){
.wp-pagenavi{
width: 100%;
margin: 2.0rem auto 4.0rem;
}
.wp-pagenavi a{
font-size: 1.4rem;
}
.wp-pagenavi a.previouspostslink{
padding-left: 3.0rem;
}
.wp-pagenavi a.previouspostslink::before{
width: 2.6rem;
height: 1.5rem;
}
.wp-pagenavi a.nextpostslink{
padding-right: 3.0rem;
}
.wp-pagenavi a.nextpostslink::before{
width: 2.6rem;
height: 1.5rem;
}
.wp-pagenavi a.page,
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi span.extend{
padding: 0 0.7rem;
}
.wp-pagenavi span.current{
width: 3.2rem;
height: 3.2rem;
font-size: 1.4rem;
margin: 0 0.3rem;
}
}

/*----------------------------------------------------------
single
----------------------------------------------------------*/
.main .dateBlock01{
margin: 0 0 5px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
}
.main .dateBlock01 .categoryList01{
width: 800px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.main .dateBlock01 .categoryList01 > li{
margin: 0 10px 10px 0;
}
.main .dateBlock01 .categoryList01 > li:last-child{
margin-right: 0;
}
.main .dateBlock01 .date01{
width: 80px;
font-size: 1.2rem;
text-align: right;
}
@media (max-width: 768px){
.main .dateBlock01{
margin: 0 0 0.3rem;
}
.main .dateBlock01 .categoryList01{
width: calc(100% - 9.0rem);
}
.main .dateBlock01 .categoryList01 > li{
margin: 0 1.0rem 1.0rem 0;
}
.main .dateBlock01 .date01{
width: 9.0rem;
font-size: 1.4rem;
}
}

.main .articleTitle01{
font-size: 2.0rem;
font-weight: 600;
border-bottom: 1px solid #ccc;
margin: 0 0 40px;
padding: 0 0 25px;
}
@media (max-width: 768px){
.main .articleTitle01{
font-size: 2.6rem;
border-bottom: 2px solid #ccc;
margin: 0 0 3.8rem;
padding: 0 0 2.0rem;
}
}

.main .thumbnail{
max-width: 500px;
height: auto;
border-radius: 10px;
margin: 0 auto 36px;
display: block;
}
@media (max-width: 768px){
.main .thumbnail{
max-width: 100%;
border-radius: 2.0rem;
margin: 0 auto 2.5rem;
}
}

.main .tagList01{
margin: 30px 0 0;
display: flex;
flex-wrap: wrap;
}
.main .tagList01 > li{
margin: 0 10px 5px 0;
}
.main .tagList01 > li:last-child{
margin-right: 0;
}
.main .tagList01 > li a{
color: #5AC4FA;
font-size: 1.4rem;
display: inline-block;
}
@media (max-width: 768px){
.main .tagList01{
margin: 3.0rem 0 0;
}
.main .tagList01 > li{
margin: 0 1.0rem 0.5rem 0;
}
}

.btnBlock01{
width: 920px;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
.btnBlock01 .btn:nth-child(1) a::before{
left: 15px;
right: auto;
transform: translateY(-50%) rotate(-180deg);
}
@media (max-width: 768px){
.btnBlock01{
width: 100%;
}
.btnBlock01 .btn:nth-child(1) a::before{
left: 1.5rem;
}
}