@charset "utf-8";
/* CSS Document */

/*ピックアップの設定*/

#main #results{
position:relative;
}
#main #results h2{
font-size:1.19rem;
}

#main #results h3{
font-size:0.625rem;
}
#main #results_title{
    border-left:8px solid #FAFAF8;
    border-bottom:1px dotted #81715A;
    padding:20px 15px;
    float:left;
    width:100%;
    box-sizing: border-box; /* これを追加 */
    line-height: normal;
}
#main #results a{
color:#333333;
}
#main #results a:hover #results_title{

border-left:8px solid #81715A;
background-color:#ECEEF7;



}
#main #results_title dt {
    display: inline-block;
    width: 50px;
}
#main #results_title dd {
	font-size:1.5rem;
    display: inline-block;
    vertical-align: middle;
}  
#main #results_article{
	width:458px;
	float:left;
}
#main #results_img{
	width:150px;/*148px + border 2 */
	float:right;
}
#main #results_img a:first-child img{
border:1px solid #666666;
}

/*曲リストモバイル対応*/
@media only screen and (max-width: 750px) {
    #main #results h2 {
        font-size:1.125rem;
    }
    #main #results_title dd {
	font-size:1.19rem;
    }
}




/*検索結果、次へボタン*/

#results_count p{
	line-height: 30px;
}

#results_count{
	padding:15px 0;	
	float:left;
	width:100%;
	box-sizing: border-box; /* これを追加 */
	font-size:16px;
}
#results_count ol{
		line-height:30px;
}

#results_count ol li a{
font-size:18px;
	margin-right:8px;
	height:30px;
	width:30px;
	line-height:30px;
	text-align:center;
	float:left;
	border: 1px solid #CCCCCC;
	display: list-item;
	margin-bottom: 5px;
}

#results_count ol li a:hover{
background-color:#CCCCCC;
}

#results_count ol li.current,#results_count ol li.ellipsis{
	display: grid;
	font-size:18px;
	margin-right:8px;
	height:30px;
	width:30px;
	line-height:30px;
	text-align:center;
	float:left;
	color:#FAFAF8;
	margin-bottom: 5px;
}
#results_count ol li.current span.number_focus{
	background-color:#81715A;
	}
#results_count ol li.ellipsis{
	color:#666666;

}

#results_count ol li.page-nav a{
	border: none;
}

/* ======================================
   ページジャンプフォーム
====================================== */
.page-jump {
    clear: both;
    padding-top: 10px;
    border-top: 1px solid #eee;
    margin-top: 10px;
}

.page-jump-form {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.page-jump-form label {
    color: #666;
}

/* ドロップダウンリストのスタイル */
.page-jump-form .page-select {
    min-width: 60px;
    height: 30px;
    padding: 4px 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    background-color: #fff;
    cursor: pointer;
}

.page-jump-form .page-select:focus {
    outline: none;
    border-color: #81715A;
}

.page-jump-form .page-select:hover {
    background-color: #f8f8f8;
}

/* JavaScriptが無効な場合の移動ボタン（noscriptタグ内） */
.page-jump-form .page-jump-btn {
    height: 30px;
    padding: 0 16px;
    background-color: #81715A;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.page-jump-form .page-jump-btn:hover {
    background-color: #2d3d6e;
}

.page-jump-form .page-total {
    color: #999;
    font-size: 13px;
}

/* ======================================
   レスポンシブ対応（モバイル）
====================================== */
@media only screen and (max-width: 750px) {
    #results_count {
        padding: 10px 5px;
    }
    
    #results_count p {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        float: none;
    }
    
    #results_count ol {
        width: 100%;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        float: none;
    }
    
    #results_count ol li {
        float: none;
        margin: 0 4px 5px 4px;
    }
    
    #results_count ol li a,
    #results_count ol li.current span.number_focus,
    #results_count ol li.ellipsis {
        width: 36px;
        height: 36px;
        line-height: 36px;
        font-size: 16px;
		margin-right: 0px;
    }
    
    .page-jump {
        text-align: center;
    }
    
    .page-jump-form {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .page-jump-form .page-select {
        width: 150px;
        height: 36px;
        font-size: 15px;
    }
}