@charset "utf-8";  
/* Mobile */ 

/* Book */
.book__title , .book__list > li , .book__index { border:solid 1px rgba(0,0,0,0.1) ; border-radius:0.4rem }
.book__item { padding-bottom:5rem ; margin-bottom:5rem ; border-bottom:dashed 1px rgba(0,0,0,0.1)  }
.book__item:last-child { padding-bottom:0 ; margin-bottom:0 ; border:none } 
.book__item .img { max-width:30rem }

.book__title , .book__list > li { display:block ; margin-bottom:0.5rem }
.book__title , .book__list > li , .book__index { padding:1rem 1rem 1.2rem 8.5rem ; position:relative } 
.book__tag {
    display:block ; width:6rem ; padding-right:1.5rem ; 
    font-size:1.4rem ; line-height:1.8rem ; text-align:right ; font-weight:500 ;
    position:absolute ; left:1rem ; top:50% ; transform:translateY(-50%) ;
}
.book__index .book__tag { transform:none ; top:1.7rem }
.book__tag::after {
    display:block ; content:"" ; width:1px ; height:1.2rem ;
    background-color:rgba(0,0,0,0.1) ;
    position:absolute ; right:0 ; top:50% ; transform:translateY(-50%) ;
}

.book__title     { font-size:2rem ; line-height:2.8rem ; font-weight:600 }
.book__list > li { font-size:1.6rem ; line-height:2.8rem }





@media screen and (min-width:1024px){ 

    /* Book */ 
    .book__item::after , .book__list::after { display:block ; content:"" ; clear:both } 
    .book__item .img { float:left ; width:23.4375% ; margin:0 }
    .book__info { float:right ; width:73.4375% ; margin:0 }
    .book__list > li:nth-child(1) { float:left ; width:55% }
    .book__list > li:nth-child(2) { float:right ; width:44.5% }

    .book__index .book__tag { transform:none ; top:1.9rem }
    .book__list > li { font-size:1.8rem }
 

} 
    
@media print { }