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

#page_title{
background-image: url(images/pagetitle_bg.jpg);
background-image: -webkit-image-set(url(images/pagetitle_bg.jpg) 1x, url(images/pagetitle_bg@2x.jpg) 2x);
}

/* 中身-モバイルファースト======================================================================================================== */

.parts p{
}
.parts p span{
font-size: 30px;
color: #cf121b;
}
.parts .pager ul{
display: flex;
justify-content: flex-end;
}
.parts .pager ul li{
margin-left: 5px;
}
.parts .pager ul li a{
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
position: relative;
color: #cf121b;
width: 34px;
height: 34px;
border: solid 1px #cf121b;
}
.parts .pager ul li a.now{
background-color: #cf121b;
color: #fff;
pointer-events: none;
}
.parts .pager ul li.prev a::before,
.parts .pager ul li.next a::before{
content: "";
display: inline-block;
vertical-align: middle;
width: 8px;
height: 8px;
position: absolute;
top: 0;
bottom: 0;
margin: auto 0;
transform: rotate(45deg);
}
.parts .pager ul li.prev a::before{
border-bottom: 1px solid #cf121b;
border-left: 1px solid #cf121b;
}
.parts .pager ul li.next a::before{
border-top: 1px solid #cf121b;
border-right: 1px solid #cf121b;
}
.parts .pager ul li.prev a span,
.parts .pager ul li.next a span{
display: none;
}


#voice ul{
margin-top: 30px;
}
#voice li{
margin-bottom: 30px;
}
#voice li a{
display: block;
text-decoration: none;
}
#voice li .comment{
font-size: 12px;
margin-bottom: 5px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
#voice li .photo{
text-align: center;
max-width: 320px;
margin: 0 auto 10px;
}
#voice li .photo img{
aspect-ratio: 4/3;
object-fit: contain;
}
#voice li .name{
display: block;
font-size: 18px;
text-align: center;
}
#voice li .common_btn{
margin-top: 5px;
text-align: right;
}
#voice li .common_btn .a{
display: inline-block;
font-size: 12px;
width: 120px;
padding: 5px 20px;
margin-left: auto;
text-align: left;
}







/* PCのみ======================================================================================================== */
@media print, screen and (min-width: 751px){

.parts{
display: flex;
justify-content: space-between;
align-items: center;
}
.parts .pager ul li a:hover{
background-color: #cf121b;
color: #fff;
}
.parts .pager ul li.prev a:hover::before,
.parts .pager ul li.next a:hover::before{
border-color: #fff;
}


#voice ul{
display: flex;
flex-wrap: wrap;
margin-top: 60px;
}
#voice li{
width: 520px;
margin-bottom: 60px;
margin-left: 60px;
}
#voice li:nth-child(odd){
margin-left: 0px;
}
#voice li .comment{
font-size: 14px;
}
#voice li .photo{
max-width: 520px;
}
#voice li .name{
font-size: 20px;
}
#voice li .common_btn .a{
font-size: 12px;
min-width: auto;
}


}

