
/*
-----------------------------------------------
flex
----------------------------------------------- */
.container01{
display:flex;
flex-wrap:wrap;
}

.container02{
display:flex;
flex-wrap:nowrap;
}

.container03{
display:flex;
flex-wrap:wrap-reverse;
}

.al-item01{
align-items:flex-end
}

.c-type01{
justify-content:space-between;
}

.c-type02{
justify-content:space-around;
}

.c-type03{
justify-content:flex-start;
}

.c-type04{
justify-content:center;
}


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

.book-img{
width:38%;
margin-bottom:30px;
}

.book-catch{
width:74%;
}

.book-txt{
width:56%;
}

.book-article{
border-top:dashed 1px #614c40;
margin-top:24px;
padding-top:24px;
margin-bottom:34px;
}

.mt40{
margin-top:40px;
}

.tac-all{
margin-left:auto;
margin-right:auto;
text-align:center;
}

.btn-on01:hover{
opacity:0.6;
}

.book-spec{
margin-left:6%;
margin-right:6%;
margin-top:40px;
}

.book-spec dl{
display:flex;
flex-wrap:wrap;
border:solid 2px #fffdec;
box-sizing:border-box;
}

.book-spec dt{
width:38%;
background:#dfdbd9;
text-align:center;
padding:0.15em 0;
box-sizing:border-box;
border-right:solid 2px #fffdec;
}

.book-spec dd{
width:59%;
background:#fff;
padding:0.15em 0 0.15em 1em;
box-sizing:border-box;
}

#con{
padding-bottom:40px;
box-sizing:border-box;
}

.banBox{
margin-bottom:34px;
margin-top:-14px;
box-sizing:border-box;
}

.banBox a:hover{
opacity:0.7;
}

.sponly{
display:none;
}

@media screen and (min-width:769px) and ( max-width:1039px) {
#con{
width:100%;
padding-left:5%;
padding-right:5%;
}

}

/*
-----------------------------------------------
▼TAB SP
----------------------------------------------- */
@media screen and (max-width: 768px) {
#con{
width:100%;
padding-left:5%;
padding-right:5%;
}


.book-img{
width:100%;
margin-bottom:30px;
}

.book-txt{
width:100%;
}

.book-txt p{
text-align:left !important;
}

.book-spec{
margin-left:0%;
margin-right:0%;
margin-top:20px;
}

.book-spec dd{
text-align:left !important;
}

.book-catch{
width:90%;
}

.book-photo-wrap{
box-sizing:border-box;
padding-left:15%;
padding-right:15%;
}

.btn-on01{
width:60%;
height:auto;
}

.banBox{
width:100%;
padding-left:5%;
padding-right:5%;
box-sizing:border-box;
}


}


/*
-----------------------------------------------
▼SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.pconly{
display:none;
}

.sponly{
display:block;
}

.banBox{
margin-bottom:0px;
margin-top:0;
}

}

/*
-----------------------------------------------
▼キオラ通信
----------------------------------------------- */

.dbook_list .dbook_in{
margin-right:130px;
margin-bottom:90px;
text-align:center;
font-family: 'Noto Sans JP', sans-serif;
}

.dbook_list .dbook_in:nth-of-type(3n){
margin-right:0;
}
.marugo{
font-family: 'M PLUS Rounded 1c', sans-serif;
}

.dbook_h01{
font-family: 'M PLUS Rounded 1c', sans-serif;
color:#5d5858;
font-size:30px;
font-weight:500;
padding:15px 0;
border-top:dashed 2px #5d5858;
border-bottom:dashed 2px #5d5858;
text-align:center;
margin-top:40px;
margin-bottom:60px;
}


.dbook_date{
margin-top:10px;
}
.dbook_name{
font-weight:bold;
font-size:19px;
margin-top:4px;
}


.dbook_btn01{
display:block;
width:14em;
margin-left:auto;
margin-right:auto;
margin-top:8px;
}

.dbook_btn01 a{
display:block;
padding:0.5em 0;
font-weight:bold;
color:#fff;
background:#64a0c8;
border-radius:8px;
}

.dbook_btn01 a:before{
content: '';/*何も入れない*/
  display: inline-block;
  width: 20px;/*画像の幅*/
  height: 24px;/*画像の高さ*/
content:url(../images/d_book/ic_book.png);
 background-size: contain;
  vertical-align: middle;
  margin-right:10px;
}


.dbook_btn02{
display:block;
width:9em;
margin-left:auto;
margin-right:auto;
margin-top:8px;
}

.dbook_btn02 a{
display:block;
padding:0.5em 0;
font-weight:bold;
color:#fff;
background:#f7931e;
border-radius:8px;
}

.dbook_btn01 a:hover,
.dbook_btn02 a:hover{
opacity:0.7;
text-decoration:none;
}

.dbook_in a:hover img{
opacity:0.7;
}

.dbook_list .dbook_in img{
display:block;
box-sizing:border-box;
margin-left:auto;
margin-right:auto;
}

/*
-----------------------------------------------
▼キオラ通信TAB
----------------------------------------------- */
@media screen and (max-width: 1024px) {
.dbook_list .dbook_in{
width:32%;
margin-right:2%;
}

.dbook_list .dbook_in:nth-of-type(3n){
margin-right:0 !important;
}

}

/*
-----------------------------------------------
▼キオラ通信SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.dbook_list .dbook_in{
width:49%;
margin-right:2%;
}

.dbook_list .dbook_in img{
padding-left:3%;
padding-right:3%
}

.dbook_list .dbook_in:nth-of-type(3n){
margin-right:2% !important;
}

.dbook_list .dbook_in:nth-of-type(2n){
margin-right:0 !important;
}


.dbook_btn01{
width:10.8em;
}

.dbook_btn01 a{
font-size:12px;
padding:0.56em 0;
letter-spacing:-0.12em;
}

.dbook_name{
font-size:17px;
}

.dbook_btn01 a:before{
  width: 20px;/*画像の幅*/
  height: 24px;/*画像の高さ*/
 background-size: contain;
  vertical-align: middle;
  margin-right:7px;
}

.dbook_h01{
font-size:20px;
padding:10px 0;
margin-top:40px;
margin-bottom:30px;
}

}
