@charset "UTF-8";
/* ------------------------------
   books-list.css
------------------------------ */
/*books_list_wrap*/
.books_list_wrap{
    position: relative;
    padding: 200px 0 240px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    box-sizing: border-box;
}
.books_list_wrap:after{
    position: relative;
    display: block;
    content: '';
    width: calc(96% / 3);
    max-width: 382px;
}
.books_list_wrap .books-box{
    width: calc(96% / 3);
    max-width: 382px;
    display: flex;
    flex-direction: column-reverse;
    margin-bottom: 100px;
}

.books_list_wrap .books-box .txt{
    margin-top: 15px;
}
.books_list_wrap .books-box .ttl{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    color: #111111;
    letter-spacing: -.01em;
}
.books_list_wrap .books-box .text{
    text-align: center;
    font-size: 1.4rem;
    line-height: calc(18 / 14);
    color: #111111;
    letter-spacing: -.01em;
    min-height: 4rem;
    margin: 10px 0 10px 0;
}
.books_list_wrap .books-box .btn_wrap{ margin-top: 20px;}
.books_list_wrap .books-box .btn_wrap .btn{
    max-width: 222px;
}

.books_list_wrap .books-box .img{
    text-align: center;
}

@media screen and (max-width: 767px) {
    .books_list_wrap{
        padding: 18% 0 18% 0;
        display: block;
    }
    .books_list_wrap:after{
        display: none;
    }
    .books_list_wrap .books-box{
        width: 100%;
        max-width: inherit;
        margin-bottom: 0;
    }
    .books_list_wrap .books-box+.books-box{ margin-top: 14%;}

    .books_list_wrap .books-box .txt{
        margin-top: 10px;
    }
    .books_list_wrap .books-box .ttl{
        font-size: 1.6rem;
    }
    .books_list_wrap .books-box .text{
        font-size: 1.4rem;
        min-height: inherit;
        margin: 10px 0 10px 0;
    }
    .books_list_wrap .books-box .btn_wrap .btn{
        max-width: inherit;
        width: 70%;
    }
    .books_list_wrap .books-box .img{
        width: 50%;
        margin: 0 auto;
    }
}

/*books_detail_wrap*/
.books_detail_wrap{
    padding: 120px 0 172px 0;
    box-sizing: border-box;
}
.books_detail_wrap .sec01{
    padding: 0 0 95px 0;
    box-sizing: border-box;
}
.books_detail_wrap .book-title{
    text-align: center;
    font-size: 3.6rem;
    color: #141414;
}
.books_detail_wrap .book-author{
    text-align: center;
    font-size: 1.8rem;
    color: #111111;
    margin-top: 5px;
    margin-bottom: 55px;
}
.books_detail_wrap .book-img{
    text-align: center;
    margin: 0 auto 45px auto;
}

.books_detail_wrap .book-block{
    width: 100%;
    max-width: 970px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.books_detail_wrap .book-block.v-aligncenter{ align-items: center;}

.books_detail_wrap .book-block+.book-block{ margin-top: 75px;}
.books_detail_wrap .book-block .img{
    width: 31%;
    max-width: 300px;
}
.books_detail_wrap .book-block.w50 .img{
    width: 38%;
    max-width: 359px;
}
.pt65{ padding-top: 65px;}

.books_detail_wrap .book-block .txt{
    width: 55%;
    box-sizing: border-box;
}
.books_detail_wrap .book-block.w100 .txt{
    width: 100%;
}
.books_detail_wrap .book-block.w50 .txt{
    width: 50%;
}

.books_detail_wrap .book-block .txt h2{
    position: relative;
    font-size: 2.0rem;
    font-weight: 700;
    padding-left: 24px;
    margin-bottom: 25px;
    box-sizing: border-box;
}
.books_detail_wrap .book-block .txt h2:before{
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    content: '■';
    color: #cf1173;
}
.books_detail_wrap .book-block.-yellow .txt h2:before{
    color: #f8ce0a;
}
.books_detail_wrap .book-block.-brown .txt h2:before{
    color: #af7920;
}
.books_detail_wrap .book-block.-red .txt h2:before{
    color: #e91919;
}
.books_detail_wrap .book-block .txt p,
.books_detail_wrap .book-block02 .txt p{
    font-size: 1.6rem;
    line-height: calc(36 / 16);
    letter-spacing: -.005em;
    color: #141414;
}
.books_detail_wrap .book-block .txt p+p{ margin-top: 25px;}

.books_detail_wrap .sec02{
    padding: 70px 0 84px 0;
    box-sizing: border-box;
}

.books_detail_wrap .sec02 .ttl_wrap { margin-bottom: 30px;}
.sec-ttl.heading-a{
    text-align: center;
    font-size: 3.6rem;
    margin-bottom: 10px;
}
.ttl_wrap .en-ttl{
    text-align: center;
    font-size: 1.1rem;
    letter-spacing: .1em;
    color: #bc121a;
}
.books_detail_wrap .tw_wrap{
    text-align: center;
    width: 100%;
    max-width: 578px;
    margin: 0 auto;
    background: #FFF;
    padding: 5px;
    box-sizing: border-box;
}
.books_detail_wrap .tw_wrap .twitter-tweet{
    margin-left: auto;
    margin-right: auto;
}
.books_detail_wrap .tw_wrap+.tw_wrap{ margin-top: 10px;}

.books_detail_wrap .sec03{
    padding-top: 90px;
    box-sizing: border-box;
}
.books_detail_wrap .sec03.inner{
    max-width: 845px;
}
.books_detail_wrap .book-block02{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
}
.books_detail_wrap .book-block02 .txt{
    width: 60%;
}
.books_detail_wrap .book-block02 .txt .ttl_wrap{
    border-bottom: 2px solid #bc121a;
    padding-bottom: 10px;
    margin-bottom: 15px;
    box-sizing: border-box;
}
.books_detail_wrap .book-block02 .txt .ttl_wrap .ttl{
    font-size: 2.6rem;
    font-weight: 700;
    color: #111111;
    letter-spacing: -.001em;
}
.books_detail_wrap .book-block02 .txt .ttl_wrap .author{
    font-size: 1.8rem;
    color: #111111;
    letter-spacing: -.001em;
}
.books_detail_wrap .book-block02 .img{
    width: 30%;
    max-width: 250px;
}

.books_detail_wrap .sec03 .btn_wrap{
    margin: 35px auto 0 auto;
}
.books_detail_wrap .sec03 .btn-txt{
    text-align: center;
    font-size: 2.0rem;
    font-weight: 700;
    color: #111111;
    margin-bottom: 20px;
}
.books_detail_wrap .sec03 .btn-txt span{
    position: relative;
    display: inline-block;
}
.books_detail_wrap .sec03 .btn-txt span:before,
.books_detail_wrap .sec03 .btn-txt span:after{
    position: absolute;
    bottom: 0;
    display: block;

}
.books_detail_wrap .sec03 .btn-txt span:before{
    left: -23px;
    content: '＼';
}
.books_detail_wrap .sec03 .btn-txt span:after{
    right: -23px;
    content: '／';
}

.books_detail_wrap .sec03 .btn_wrap .btn{
    font-size: 2.4rem;
    max-width: 335px;
    padding: 12px 10px;
}
@media screen and (max-width: 767px) {
    .books_detail_wrap{
        padding: 18% 0;
        box-sizing: border-box;
    }
    .books_detail_wrap .sec01{
        padding: 0 0 14% 0;
    }
    .books_detail_wrap .book-title{
        font-size: 2.6rem;
    }
    .books_detail_wrap .book-author{
        font-size: 1.4rem;
        margin-bottom: 12%;
    }
    .books_detail_wrap .book-img{
        margin: 0 auto 12% auto;
    }

    .books_detail_wrap .book-block{
        width: 100%;
        max-width: inherit;
        display: block;
    }
    .books_detail_wrap .book-block+.book-block{ margin-top: 10%;}
    .books_detail_wrap .book-block .img{
        width: 100% !important;
        max-width: 300px;
        margin: 4% auto 0 auto;
    }
    .books_detail_wrap .book-block.w50 .img{
        max-width: 359px;
    }
    .pt65{ padding-top: 0;}
    .books_detail_wrap .book-block .txt{
        width: 100% !important;
    }
    .books_detail_wrap .book-block .txt h2{
        font-size: 1.8rem;
        padding-left: 24px;
        line-height: 1.75;
        margin-bottom: 4%;
    }

    .books_detail_wrap .book-block .txt p,
    .books_detail_wrap .book-block02 .txt p{
        font-size: 1.4rem;
    }
    .books_detail_wrap .book-block .txt p+p{ margin-top: 4%;}
    .books_detail_wrap .sec02{
        padding: 14% 0;
    }

    .books_detail_wrap .sec02 .ttl_wrap { margin-bottom: 8%;}
    .sec-ttl.heading-a{
        font-size: 2.6rem;
    }
    .books_detail_wrap .tw_wrap{
        max-width: inherit;
    }
    .books_detail_wrap .sec03{
        padding-top: 14%;
    }
    .books_detail_wrap .sec03.inner{
        max-width: inherit;
    }
    .books_detail_wrap .book-block02{
        display: block;
    }
    .books_detail_wrap .book-block02 .txt{
        width: 100%;
        margin-bottom: 6%;
    }

    .books_detail_wrap .book-block02 .txt .ttl_wrap .ttl{
        font-size: 2.4rem;
    }
    .books_detail_wrap .book-block02 .txt .ttl_wrap .author{
        font-size: 1.4rem;
    }
    .books_detail_wrap .book-block02 .img{
        width: 100%;
        max-width: 250px;
        margin: 0 auto;
    }

    .books_detail_wrap .sec03 .btn_wrap{
        margin: 8% auto 0 auto;
    }
    .books_detail_wrap .sec03 .btn-txt{
        font-size: 1.6rem;
        margin-bottom: 4%;
    }
    .books_detail_wrap .sec03 .btn_wrap .btn{
        font-size: 1.8rem;
        max-width: inherit;
        padding: 12px 10px;
    }

}